/* ========================================

   1. TOKENS / CSS VARIABLES

   ======================================== */



:root {

	--black: #0b0b0b;

	--primary: #1d63ff;

	--cta: #0b5cff;

	--cta-dark: #0846c1;

	--soft-bd: #e5e7eb;

	--gold: #ffa826;

	--hero-grad: linear-gradient(180deg, rgba(238, 244, 255, .92) -9.4%, rgba(255, 255, 255, .98) 83.73%);

	--container-pad: 18px;

	--header-h: 64px;

	--ticker-speed: 32s;

	--cc-mega-shadow: 0 14px 36px rgba(0, 0, 0, .12);

	--dark-section-bg: #0E2B5C;

	--yellow-bg: #fdd201;

	--soft-bg: #f8f9fa;

	--ink: #1e293b;

	--muted: #64748b;

	--line: #e2e8f0;

	--header-yellow: #FEF200;

	--soft-blue-bg: #EEF4FF;

	--soft-blue-bd: #DBE8FF;

	--brand-blue: var(--primary);

	--ccl-proc-primary: #0b5cff;

	--ccl-proc-ink: #1a202c;

	--ccl-proc-muted: #4a5568;

	--ccl-proc-bg: #ffffff;

	--ccl-proc-surface: #f7fafc;

	--ccl-proc-line: #e2e8f0;

}



/* ========================================

   2. BASE & RESET STYLES

   ======================================== */

* {

	box-sizing: border-box;

	min-width: 0;

}



html {

	-webkit-text-size-adjust: 100%;

}



html,

body {

	margin: 0;

	padding: 0;

	font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

	color: #211b1b;

	background: #fff;

}



body {

	overflow-x: hidden;

	min-width: 320px;

}



body.no-scroll,

body.megamenu-open {

	overflow: hidden;

}



img {

	max-width: 100%;

	height: auto;

	display: block;

}



a {

	color: inherit;

	text-decoration: none;

}



.fine-print {

	font-size: 0.65rem;

	color: #999;

	line-height: 1.6;

	margin: 2rem auto 0 auto;

	padding: 0 1rem;

	text-align: left;

}



.fine-print strong {

	color: #333333;

	font-weight: 600;

}



/* ========================================

   3. UTILITY CLASSES

   ======================================== */



.container {

	width: 100%;

	max-width: 1380px;

	margin: 0 auto;

	padding-inline: var(--container-pad);

}



.container-fluid {

	--bs-gutter-x: 1.5rem;

	--bs-gutter-y: 0;

	width: 100%;

	padding-right: calc(var(--bs-gutter-x) * 0.5);

	padding-left: calc(var(--bs-gutter-x) * 0.5);

	margin-right: auto;

	margin-left: auto;

}



.clearfix {

	clear: both;

}



/* ========================================

   4. COMPONENTS

   ======================================== */



/* ----------------------------------------

   4.1 Buttons

   ---------------------------------------- */



.btn {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	padding: 10px 20px;

	border-radius: 6px;

	font-weight: 600;

	border: 1px solid transparent;

	transition: all .2s ease;

	font-size: 14px;

	cursor: pointer;

}



.btn--cta {

	background: var(--cta);

	color: #fff;

	border-color: var(--cta);

}



.btn--cta:hover {

	background: var(--cta-dark);

	opacity: 0.9;

	text-decoration: none;

}



.btn--dark {

	background: var(--ink);

	color: #fff;

}



.btn--dark:hover {

	background: #333;

}



.btn--sm {

	padding: 8px 12px;

	font-size: 13.5px;

	border-radius: 8px;

}



.btn--light {

	background: #fff;

	color: var(--ink);

	border: 1px solid #fff;

}



.btn--light:hover {

	background: var(--soft-bg);

	border-color: var(--soft-bd);

	text-decoration: none;

}



.btn {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	padding: 15px 30px;

	border-radius: 10px;

	font: 600 16px/1 Inter;

	text-decoration: none;

	transition: .3s;

}



.btn--prime {

	background: var(--primary);

	color: #fff;

	box-shadow: 0 5px 15px rgba(11, 92, 255, .3);

}



.btn--prime:hover {

	background: #1d4ed8;

	transform: translateY(-2px);

}



.btn--sec {

	background: #fff;

	color: var(--primary);

	border: 1px solid rgba(11, 92, 255, .2);

}



.btn--sec:hover {

	background: #f8faff;

}



/* ----------------------------------------

   4.2 Header & Navigation

   ---------------------------------------- */



#headerSentinel {

	height: 1px;

}



.cc-header {

	position: sticky;

	top: 0;

	z-index: 900;

	background: #fff;

	box-shadow: 0 2px 12px rgba(0, 0, 0, .05);

	transition: background-color .22s ease, box-shadow .22s ease, border-color .22s ease;

}



.cc-header.is-sticky {

	background: var(--header-yellow) !important;

	box-shadow: 0 6px 18px rgba(0, 0, 0, .08);

}



.cc-header.is-sticky .nav-toggle {

	border-color: rgba(0, 0, 0, .12);

}



.cc-navbar {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 24px;

	height: 80px;

}



.cc-logo img {

	height: 48px;

}



.cc-nav {

	display: flex;

	justify-content: center;

}



.cc-list {

	display: flex;

	align-items: center;

	gap: 32px;

	margin: 0;

	padding: 0;

	list-style: none;

}



.cc-link {

	display: inline-flex;

	align-items: center;

	gap: 6px;

	height: 80px;

	font-weight: 600;

	font-size: 15px;

	color: var(--ink);

	position: relative;

	border: 0;

	background: none;

	cursor: pointer;

}



.cc-link::after {

	content: '';

	position: absolute;

	bottom: 24px;

	left: 0;

	width: 100%;

	height: 2px;

	background: var(--primary);

	transform: scaleX(0);

	transform-origin: center;

	transition: transform .25s;

}



.cc-link:hover::after,

.cc-drop.open>.cc-link::after {

	transform: scaleX(1);

}



.cc-link .fa-caret-down {

	font-size: 12px;

	opacity: .7;

	transform: translateY(1px);

	transition: transform .18s;

}



.cc-actions {

	display: flex;

	align-items: center;

	gap: 16px;

}



.cc-call {

	font-weight: 700;

	white-space: nowrap;

	font-size: 15px;

}



.cc-call i {

	margin-right: 6px;

	color: var(--cta);

}



/* Nav Toggle (Hamburger) */

.nav-toggle {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 44px;

	height: 44px;

	padding: 0;

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

	background: #fff;

	box-shadow: 0 2px 8px rgba(0, 0, 0, .06);

	cursor: pointer;

	transition: background-color .2s, box-shadow .2s, border-color .2s;

}



.nav-toggle:hover {

	background: var(--soft-bg);

	box-shadow: 0 4px 16px rgba(0, 0, 0, .08);

}



.nav-toggle:focus-visible {

	outline: 2px solid var(--primary);

	outline-offset: 2px;

}



.cc-actions .nav-toggle {

	margin-left: 6px;

}



.nav-toggle .hamb {

	width: 22px;

	height: 22px;

	overflow: visible;

}



.nav-toggle .line {

	stroke: var(--ink);

	stroke-width: 2.4;

	stroke-linecap: round;

	transition: transform .25s ease, opacity .2s ease;

}



.nav-toggle[aria-expanded="true"] .line.top {

	transform: translateY(6px) rotate(45deg);

}



.nav-toggle[aria-expanded="true"] .line.mid {

	opacity: 0;

}



.nav-toggle[aria-expanded="true"] .line.bot {

	transform: translateY(-6px) rotate(-45deg);

}



/* ----------------------------------------

   4.3 Mega Menu

   ---------------------------------------- */



.mega-overlay {

	position: fixed;

	inset: 0;

	background: rgba(0, 0, 0, .4);

	opacity: 0;

	visibility: hidden;

	transition: opacity .3s, visibility .3s;

	z-index: 1100;

	pointer-events: none;

}



.cc-drop {

	position: static;

}



.cc-panel {

	position: absolute;

	left: 0;

	right: 0;

	top: 100%;

	background: linear-gradient(to bottom, #fff, #f9fafb);

	box-shadow: var(--cc-mega-shadow);

	padding: 48px;

	transform: translateY(-10px);

	opacity: 0;

	visibility: hidden;

	pointer-events: none;

	transition: opacity .25s, transform .25s;

	z-index: 1200;

	max-height: 86vh;

	overflow: hidden;

}



.cc-panel-inner {

	max-width: 1380px;

	margin: 0 auto;

	padding-inline: var(--container-pad);

}



.cc-drop.open>.cc-link {

	color: var(--primary);

}



.cc-drop.open>.cc-panel {

	opacity: 1;

	visibility: visible;

	pointer-events: auto;

	transform: translateY(0);

}



.cc-drop.open>.cc-link .fa-caret-down {

	transform: rotate(180deg) translateY(-2px);

}



/* Mega Menu: Class Actions */

.ca-mega {

	display: grid;

	grid-template-columns: 380px minmax(0, 1fr) 340px;

	gap: 28px;

	align-items: start;

}



.ca-side {

	display: grid;

	gap: 18px;

}



.ca-feature {

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

	padding: 18px;

	background: #fff;

	display: grid;

	grid-template-columns: 72px 1fr;

	gap: 14px;

	align-items: center;

}



.ca-feature img {

	width: 72px;

	height: 72px;

	border-radius: 10px;

	object-fit: cover;

}



.ca-feature h4 {

	margin: 2px 0 6px;

	font-size: medium;

	font-weight: 800;

	line-height: 1.2;

}



.ca-feature p {

	margin: 0;

	color: var(--muted);

	font-size: 14px;

}



.case-badge {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	font-size: 12px;

	font-weight: 700;

	background: var(--soft-bg);

	border: 1px solid var(--soft-bd);

	padding: 6px 10px;

	border-radius: 999px;

}



.status-dot {

	width: 8px;

	height: 8px;

	border-radius: 50%;

}



.dot-green {

	background: #22c55e;

}



.dot-amber {

	background: #f59e0b;

}



.dot-slate {

	background: #94a3b8;

}



.ca-cta {

	display: grid;

	gap: 10px;

	padding: 18px;

	border: 1px dashed var(--soft-bd);

	border-radius: 12px;

	background: #fff;

}



.ca-cta strong {

	font-size: 16px;

}



.ca-cta small {

	color: var(--muted);

}



.ca-list-wrap {

	max-height: 56vh;

	overflow: auto;

	padding-right: 8px;

	background: #fff;

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

}



.ca-tools {

	position: sticky;

	top: 0;

	z-index: 3;

	background: #fff;

	padding: 12px;

	margin: 0;

	border-bottom: 1px solid var(--soft-bd);

	border-top-left-radius: 12px;

	border-top-right-radius: 12px;

	display: flex;

	flex-wrap: wrap;

	gap: 10px 12px;

	align-items: center;

}



.ca-filter {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	font-weight: 700;

	font-size: 13px;

	border: 1px solid var(--soft-bd);

	background: #fff;

	padding: 8px 12px;

	border-radius: 999px;

	cursor: pointer;

	transition: all .2s;

}



.ca-filter[aria-pressed="true"] {

	background: var(--primary);

	color: #fff;

	border-color: var(--primary);

}



.ca-search {

	margin-left: auto;

	position: relative;

	flex: 1 1 auto;

	min-width: 280px;

	max-width: none;

}



.ca-search input {

	width: 100%;

	padding: 11px 14px 11px 38px;

	border: 1px solid var(--soft-bd);

	border-radius: 10px;

	font-size: 14px;

	background: #fff;

}



.ca-search svg {

	position: absolute;

	left: 12px;

	top: 50%;

	transform: translateY(-50%);

	width: 16px;

	height: 16px;

}



.ca-grid {

	display: grid;

	grid-template-columns: 1fr;

	gap: 14px;

	padding: 12px;

}



.ca-cardX {

	background: #fff;

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

	padding: 16px;

	display: grid;

	gap: 10px;

	transition: box-shadow .2s, transform .2s;

}



.ca-cardX:hover {

	box-shadow: 0 8px 20px rgba(0, 0, 0, .08);

	transform: translateY(-2px);

}



.ca-cardX h5 {

	margin: 0;

	font-size: 15.5px;

	line-height: 1.35;

	font-weight: 800;

}



.ca-meta {

	display: flex;

	gap: 8px;

	flex-wrap: wrap;

}



.ca-pill {

	font-size: 12px;

	font-weight: 700;

	border: 1px solid var(--soft-bd);

	padding: 4px 8px;

	border-radius: 999px;

	color: #374151;

	background: #f8fafc;

}



.ca-tease {

	margin: 0;

	color: var(--muted);

	font-size: 13.5px;

}



.ca-actions {

	display: flex;

	justify-content: space-between;

	align-items: center;

	gap: 10px;

}



.ca-actions a {

	font-weight: 700;

	color: var(--primary);

	text-decoration: underline;

	font-size: 13.5px;

}



.ca-actions .btn {

	color: #fff !important;

	text-decoration: none;

	line-height: 1;

}



.ca-actions .btn:hover {

	color: #fff !important;

	text-decoration: none;

}



.ca-rail {

	display: grid;

	gap: 16px;

}



.ca-updates,

.ca-help {

	background: #fff;

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

	padding: 16px;

	display: grid;

	gap: 12px;

}



.ca-updates h6,

.ca-help h6 {

	margin: 0;

	font-size: 14px;

	letter-spacing: .06em;

	text-transform: uppercase;

	color: #6b7280;

	font-weight: 800;

}



.ca-update-item {

	display: grid;

	gap: 4px;

}



.ca-update-item a {

	font-weight: 700;

	font-size: small;

}



.ca-update-item small {

	color: #6b7280;

}



.ca-progress {

	height: 6px;

	border-radius: 999px;

	background: #eef2ff;

	overflow: hidden;

}



.ca-progress>span {

	display: block;

	height: 100%;

	width: 60%;

	background: linear-gradient(90deg, var(--cta), var(--primary));

}



.ca-head {

	display: grid;

	gap: 6px;

	margin-bottom: 16px;

}



.ca-head h3 {

	margin: 0;

	font-size: 22px;

	font-weight: 800;

	letter-spacing: -.01em;

	color: var(--ink);

}



.ca-head p {

	margin: 0;

	font-size: 14.5px;

	color: var(--muted);

}



.ca-featured-badge {

	display: inline-block;

	font-size: 11px;

	font-weight: 800;

	color: #0f172a;

}



/* Mega Menu: Compensation / Services */

.svc-head {

	display: grid;

	gap: 6px;

	margin-bottom: 16px;

}



.svc-head h3 {

	margin: 0;

	font: 800 22px/1.2 "Inter Tight", Inter, sans-serif;

	letter-spacing: -.01em;

	color: var(--ink);

}



.svc-head p {

	margin: 0;

	font: 500 14.5px/1.5 Inter, system-ui, sans-serif;

	color: var(--muted);

}



.svc-wrap {

	display: grid;

	grid-template-columns: 360px minmax(0, 1.45fr) 320px;

	gap: 28px;

	align-items: start;

}



.svc-cats {

	display: grid;

	grid-template-columns: repeat(2, minmax(0, 1fr));

	gap: 12px;

}



.svc-cat {

	display: flex;

	align-items: center;

	gap: 12px;

	padding: 14px;

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

	background: #fff;

	cursor: pointer;

	transition: box-shadow .2s, transform .2s, border-color .2s, background .2s;

	font: 700 14.5px/1.25 Inter, system-ui, sans-serif;

}



.svc-cat:hover {

	box-shadow: 0 8px 18px rgba(0, 0, 0, .06);

	transform: translateY(-2px);

}



.svc-cat[aria-selected="true"] {

	border-color: var(--primary);

	background: #f6f9ff;

}



.svc-cat:focus-visible {

	outline: 2px solid var(--primary);

	outline-offset: 2px;

}



.svc-icon {

	width: 40px;

	height: 40px;

	border-radius: 10px;

	display: grid;

	place-items: center;

	flex: 0 0 40px;

	background: var(--soft-bg);

	color: var(--primary);

	font: 800 13px/1 "Inter Tight", Inter, sans-serif;

}



.svc-panel {

	display: none;

}



.svc-panel[aria-hidden="false"] {

	display: block;

}



.svc-deck {

	border: 1px solid var(--soft-bd);

	background: #fff;

	border-radius: 12px;

	padding: 16px 16px 12px;

}



.svc-titlebar {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 12px;

	margin-bottom: 8px;

}



.svc-title {

	margin: 0;

	font: 800 16px/1.2 "Inter Tight", Inter, sans-serif;

	color: var(--ink);

}



.svc-viewall-link {

	font: 800 14px/1 Inter, system-ui, sans-serif;

	color: var(--primary);

	text-decoration: underline;

}



.svc-subgrid {

	display: grid;

	grid-template-columns: repeat(2, minmax(0, 1fr));

	gap: 12px 24px;

}



.svc-list {

	list-style: none;

	margin: 0;

	padding: 0;

	display: grid;

	gap: 0;

}



.svc-row {

	display: flex;

	align-items: center;

	gap: 10px;

	padding: 10px 0;

	border-bottom: 1px dashed var(--line);

}



.svc-row:last-child {

	border-bottom: none;

}



.svc-link {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	font: 500 14.5px/1.45 Inter, system-ui, sans-serif;

	color: var(--ink);

	text-decoration: none;

}



.svc-link:hover {

	text-decoration: underline;

	color: var(--primary);

}



.svc-row .caret {

	color: var(--muted);

}



.svc-inline-divider {

	margin-top: 14px;

	padding-top: 12px;

	border-top: 1px solid var(--line);

}



.svc-inline-cta {

	display: grid;

	gap: 6px;

}



.svc-inline-cta .kicker {

	font: 800 11px/1.1 Inter, system-ui, sans-serif;

	letter-spacing: .06em;

	text-transform: uppercase;

	color: var(--primary);

}



.svc-inline-cta h5 {

	margin: 0;

	font: 800 16px/1.2 "Inter Tight", Inter, sans-serif;

	color: var(--ink);

}



.svc-inline-cta p {

	margin: 0;

	font: 500 14px/1.45 Inter, system-ui, sans-serif;

	color: var(--muted);

}



.svc-inline-cta .btn {

	width: fit-content;

}



.svc-rail {

	display: grid;

	gap: 16px;

}



.svc-card {

	border: 1px solid var(--soft-bd);

	border-radius: 12px;

	background: #fff;

	padding: 16px;

	display: grid;

	gap: 10px;

}



.svc-card .kicker {

	font: 800 11px/1.1 Inter, system-ui, sans-serif;

	letter-spacing: .06em;

	text-transform: uppercase;

	color: var(--primary);

}



.svc-card h5 {

	margin: 0;

	font: 800 16px/1.2 "Inter Tight", Inter, sans-serif;

	color: var(--ink);

}



.svc-card p {

	margin: 0;

	font: 500 14px/1.45 Inter, system-ui, sans-serif;

	color: var(--muted);

}



.svc-checks {

	list-style: none;

	margin: 2px 0 0;

	padding: 0;

	display: grid;

	gap: 8px;

}



.svc-checks li {

	display: flex;

	align-items: center;

	gap: 10px;

	font: 600 14px/1.4 Inter, system-ui, sans-serif;

	color: var(--ink);

}



.svc-check {

	display: inline-grid;

	place-items: center;

	width: 18px;

	height: 18px;

	border-radius: 50%;

	background: #e8f1ff;

	color: #0b5cff;

	font-size: 12px;

	font-weight: 800;

}



.svc-cta-row {

	display: flex;

	gap: 10px;

	flex-wrap: wrap;

}



.svc-cta-row .btn {

	flex: 1 1 auto;

}



.svc-aside {

	display: grid;

	gap: 16px;

}



.svc-empty {

	display: grid;

	gap: 10px;

}



.svc-brief {

	font: 500 14.5px/1.6 Inter, system-ui, sans-serif;

	color: var(--ink);

	margin: 0;

}



.svc-points {

	list-style: none;

	margin: 6px 0 0;

	padding: 0;

	display: grid;

	gap: 6px;

}



.svc-points li {

	display: flex;

	align-items: baseline;

	gap: 8px;

	font: 600 14px/1.45 Inter, system-ui, sans-serif;

	color: var(--ink);

}



.svc-points li::before {

	content: "•";

	color: var(--muted);

	font-size: 18px;

	line-height: 1;

	transform: translateY(-1px);

}



.svc-deck .svc-empty+.svc-inline-divider {

	margin-top: 16px;

}

/* ===== Resources: Accident Feeds column polish ===== */

/* Resources mega — compact 3-col grid reusing svc styles */

.res-mega{

  display:grid; gap:28px;

  grid-template-columns:360px minmax(0,1.45fr) 320px;

  align-items:start;

}

.res-side{ display:grid; gap:16px; }



/* Feed rows (icon • title • CTA) */

.res-feed{

  display:grid;

  grid-template-columns:auto 1fr auto;

  align-items:center; gap:12px;

  padding:12px; border:1px solid var(--soft-bd,#e2e8f0);

  border-radius:12px; background:#fff;

  transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;

  text-decoration:none; color:#0f172a;

  margin-bottom:10px;

}

.res-feed:hover{

  border-color:#dbe8ff;

  box-shadow:0 8px 18px rgba(0,0,0,.06);

  transform:translateY(-2px);

}

.res-ico{

  width:38px; height:38px; border-radius:10px;

  display:grid; place-items:center; flex:0 0 38px;

  background:rgba(11,92,255,.10); color:#0b5cff;

  border:1px solid #dbeafe; font-size:16px;

}

.res-text b{ display:block; font-weight:800; letter-spacing:.01em }

.res-text small{ display:block; color:#64748b; font-size:12.5px; line-height:1.3; margin-top:2px }


/*form-css*/

.ccl-aviation--section .everest-forms{width:100%;display:block;max-width:900px;background:#fff;border:2px solid #e5e7eb;border-radius:24px;padding:48px;margin:0 auto 0}
.ccl-aviation--section .everest-forms label{font-size:.95rem;font-weight:600;color:#1e293b}
.ccl-aviation--section .everest-forms .input-text{font-family:'Inter',sans-serif;font-size:1rem;padding:14px 18px;border:2px solid #e5e7eb;border-radius:12px;transition:all 0.3s ease;color:#1e293b;background:#fff}
.ccl-aviation--section .everest-forms select.input-text {cursor: pointer;}
.ccl-aviation--section .everest-forms textarea.input-text{resize:vertical;min-height:150px}
.ccl-aviation--section .everest-forms div.input-text{border:0;padding:0;text-align:center}
.ccl-aviation--section .everest-forms .evf-submit{font-family:'Inter',sans-serif;font-size:1rem!important;font-weight:700!important;padding:16px 36px!important;border:none!important;border-radius:12px!important;cursor:pointer!important;transition:all 0.3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;gap:10px;text-decoration:none;position:relative;overflow:hidden;margin:0 auto 0;box-shadow:0 4px 12px rgb(11 92 255 / .3)!important;background:linear-gradient(135deg,#0b5cff 0%,#0b5cff 100%)!important;color:#ffffff!important}
.ccl-aviation--section .everest-forms .evf-submit-container{text-align:center;padding:5px 0 0}
.ccl-aviation--section .everest-forms .evf-submit:after{content:"";background:url(../images/arrow-right-white.svg)no-repeat 100%;width:14px;height:16px;background-size:100%}
.ccl-aviation--section .everest-forms .evf-submit:hover {background: linear-gradient(135deg, #0846c1 0%, #0b5cff 100%) !important;box-shadow: 0 8px 24px rgba(11, 92, 255, 0.4);transform: translateY(-2px);}

.ccl-switch--container .everest-forms label{display:block;font-size:.95rem;font-weight:700;color:#1e293b;margin-bottom:10px;letter-spacing:.3px}
.ccl-switch--container .everest-forms .input-text{width:100%;padding:16px 18px;border:2px solid #cbd5e1;border-radius:12px;font-family:'Inter',sans-serif;font-size:1rem;color:#1e293b;transition:all 0.3s ease;background:#fff;font-weight:500;cursor:text}
.ccl-switch--container .everest-forms .evf-frontend-grid{padding:0!important}
.ccl-switch--container .everest-forms .evf-frontend-grid.evf-grid-2{width:48%!important;flex:0 0 48%!important}.ccl-switch--container .everest-forms .evf-frontend-grid.evf-grid-2:first-child{margin-right:4%}
.ccl-switch--container .everest-forms textarea.input-text{resize:vertical;min-height:140px;line-height:1.6}
.ccl-switch--container .everest-forms .evf-submit-container{padding:0}
.ccl-switch--container .everest-forms .evf-submit{background:#10b981!important;color:#ffffff!important;width:100%;justify-content:center;font-size:1.1rem!important;padding:20px 36px!important;box-shadow:0 4px 20px rgb(16 185 129 / .3)!important;display:inline-flex;align-items:center;font-family:'Inter',sans-serif;font-weight:700!important;border-radius:12px!important;text-decoration:none;transition:all 0.3s cubic-bezier(.4,0,.2,1);cursor:pointer;border:none!important;position:relative}
.ccl-switch--container .everest-forms .evf-submit:after{content:"";background:url(../images/arrow-right-white.svg)no-repeat 100%;width:14px;height:16px;background-size:100%}
.ccl-switch--container .everest-forms .evf-submit:hover {background: #059669 !important;transform: translateY(-2px);box-shadow: 0 8px 30px rgba(16, 185, 129, 0.4);}
.ccl-switch--container .everest-forms .evf-submit:hover:after {transform: translateX(4px);}

.ccl-cadetship--form-section .everest-forms label{display:block;font-weight:600;font-size:1.05rem;margin-bottom:10px;color:#1e293b}
.ccl-cadetship--form-section .everest-forms .evf-frontend-grid{padding:0!important}
.ccl-cadetship--form-section .everest-forms .input-text{width:100%;padding:16px 18px;border:2px solid #cbd5e1;border-radius:12px;font-family:'Inter',sans-serif;font-size:1rem;color:#1e293b;transition:all 0.3s ease;background:#fff;font-weight:500;cursor:text}
.ccl-cadetship--form-section .everest-forms .evf-field-radio ul{width:100%;display:flex;flex-wrap:wrap}
.ccl-cadetship--form-section .everest-forms .evf-field-radio ul li{margin:0 20px 15px 0!important;cursor: pointer;}
.ccl-cadetship--form-section .everest-forms .evf-field-radio ul li:last-child{margin-right:0!important}
.ccl-cadetship--form-section .everest-forms .evf-field-radio ul li label{margin:4px 0 0!important}

.ccl-cadetship--form-section .everest-forms .everest-forms-uploader{border:2px dashed #e5e7eb;border-radius:12px;padding:32px;text-align:center;background:#fff;transition:all 0.3s cubic-bezier(.4,0,.2,1);cursor:pointer;margin:0 0 25px}
.ccl-cadetship--form-section .everest-forms .everest-forms-uploader .everest-forms-upload-title{font-size:1rem;color:#64748b;margin:0}
.ccl-cadetship--form-section .everest-forms .everest-forms-uploader svg{width:50px;height:50px;padding:0;background:none;margin:0}
.ccl-cadetship--form-section .everest-forms .everest-forms-uploader svg path{fill:#1d63ff}
.ccl-cadetship--form-section .everest-forms textarea.input-text{min-height:140px;resize:vertical}
.ccl-cadetship--form-section .everest-forms .evf-submit-container{padding:0;text-align:center}
.ccl-cadetship--form-section .everest-forms .evf-submit-container .evf-submit{font-family:'Inter',sans-serif;font-size:1rem!important;font-weight:700!important;padding:14px 36px!important;border:none!important;border-radius:12px!important;cursor:pointer!important;transition:all 0.3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;gap:10px;text-decoration:none;position:relative;overflow:hidden;margin:15px auto 0;background:#0b5cff!important;color:#ffffff!important}
.ccl-cadetship--form-section .everest-forms .evf-submit-container .evf-submit:after{content:"";background:url(../images/send-icon.svg)no-repeat 100%;width:22px;height:20px;background-size:100%;transition: transform 0.3s ease}
.ccl-cadetship--form-section .everest-forms .evf-submit-container .evf-submit:hover {background: #0846c1 !important;transform: translateY(-3px);box-shadow: 0 12px 28px rgba(11, 92, 255, 0.4);}
.ccl-cadetship--form-section .everest-forms .evf-submit-container .evf-submit:hover:after {transform: translateX(5px);}
.ccl-cadetship--form-section .everest-forms .everest-forms-uploader:hover {border-color: #1d63ff;background: rgba(29, 99, 255, 0.02);}

@media (max-width:1180px){

  .res-mega{ grid-template-columns:1fr 1fr; }

}

@media (max-width:820px){

  .res-mega{ grid-template-columns:1fr; }

}



/* Section title with accent bar */

.res-title{

  margin: 0 0 12px;

  font: 800 18px/1.2 "Inter Tight", Inter, sans-serif;

  letter-spacing: -.01em;

  color: #0f172a;

  position: relative;

  display: inline-flex;

  align-items: center;

  gap: 10px;

}

.res-title::after{

  content: "";

  width: 28px; height: 3px;

  border-radius: 999px;

  background: linear-gradient(90deg, #ef4444, #0b5cff);

  transform: translateY(1px);

  opacity: .9;

}



/* Feed rows — strict alignment and nicer CTA */

.res-feed{

  display: grid;

  grid-template-columns: auto 1fr auto;

  align-items: center;

  gap: 12px;

  padding: 12px 12px;

  border: 1px solid #e2e8f0;

  border-radius: 12px;

  background: #fff;

  box-shadow: 0 1px 0 rgba(2,6,23,.03) inset;

  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;

}

.res-feed:hover{

  border-color: #dbeafe;

  box-shadow: 0 8px 18px rgba(0,0,0,.06);

  transform: translateY(-2px);

}



/* Icon chip (consistent size + soft fill) */

.res-ico{

  width: 38px; height: 38px;

  border-radius: 10px;

  display: grid; place-items: center;

  background: #eef4ff;

  border: 1px solid #dbeafe;

  color: #0b5cff;

  font-size: 16px;

}



/* Text block */

.res-text b{

  display: block;

  font-weight: 800;

  letter-spacing: .01em;

  color: #0f172a;

}

.res-text small{

  display: block;

  margin-top: 2px;

  font-size: 12.5px;

  color: #64748b;

  line-height: 1.3;

}



/* CTA button on the right to match your brand buttons */

.res-feed .btn{

  height: 36px; padding: 0 14px;

  border-radius: 10px;

  display: inline-flex; align-items: center; gap: 8px;

  font-weight: 800; letter-spacing: .01em;

  white-space: nowrap;

}

.res-feed .btn.btn--sec{

  background: #fff; color: #0b5cff;

  border: 1px solid #c7d7ff;

}

.res-feed:hover .btn.btn--sec{

  background: #f1f6ff; border-color: #b9cdff;

}



/* Mobile tightening */

@media (max-width: 820px){

  .res-title{ margin-bottom: 10px }

  .res-feed{ gap: 10px; padding: 10px }

  .res-feed .btn{ height: 34px; padding: 0 12px }

}



/* ----------------------------------------

   4.4 Top Bar (Consolidated + Polished)

   ---------------------------------------- */



/* Base topbar (legacy-safe) */

.topbar{

  background:#0b0b0b;

  color:#fff;

  font-size:13.5px;

  line-height:1;

}

.topbar i{ font-size:16px }

/* ===== Topbar dropdown: premium grid panel ===== */



/* ensure the dropdown stacks above nav/megamenu */

.topbar--compact .tb-quick{ position:relative; z-index:1500 }

.topbar--compact .tb-panel{

  position:absolute; right:0; top:calc(100% + 12px);

  min-width:540px; max-width:720px;

  background:#fff; color:#0f172a;

  border:1px solid #e2e8f0; border-radius:14px;

  box-shadow:0 20px 42px rgba(2,6,23,.18), 0 1px 0 rgba(2,6,23,.04) inset;

  padding:14px;

  opacity:0; transform:translateY(6px) scale(.985); pointer-events:none;

  transition:opacity .18s ease, transform .18s ease;

  z-index:1501;

}

.topbar--compact .tb-quick[open] .tb-panel{

  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;

}



/* arrow */

.topbar--compact .tb-quick[open] .tb-panel::before{

  content:""; position:absolute; top:-8px; right:26px;

  width:14px; height:14px; transform:rotate(45deg);

  background:#fff; border-left:1px solid #e2e8f0; border-top:1px solid #e2e8f0;

}



/* grid layout */

.topbar--compact .tb-menu-grid{

  display:grid; gap:12px 16px;

  grid-template-columns: repeat(2, minmax(240px, 1fr));

}

@media (max-width:640px){

  .topbar--compact .tb-panel{ min-width:320px; right:8px }

  .topbar--compact .tb-menu-grid{ grid-template-columns:1fr }

}



/* kicker */

.topbar--compact .tb-kicker{

  margin:4px 0 6px; padding:0 2px;

  font: 800 11px/1 Inter,system-ui,sans-serif;

  letter-spacing:.08em; text-transform:uppercase; color:#64748b;

}



/* item */

.topbar--compact .tb-item{

  display:flex; align-items:center; gap:12px;

  padding:10px 10px; border-radius:12px;

  text-decoration:none; color:#0b1220;

  transition:background .15s ease, transform .15s ease, box-shadow .15s ease;

}

.topbar--compact .tb-item:hover{

  background:#f8fafc; transform:translateX(2px);

}

.topbar--compact .tb-ico{

  display:grid; place-items:center; flex:0 0 38px; height:38px; width:38px;

  border-radius:10px; background:rgba(11,92,255,.10); color:#0b5cff;

  border:1px solid #dbeafe; font-size:16px;

}

.topbar--compact .tb-text b{ display:block; font-weight:800; letter-spacing:.01em }

.topbar--compact .tb-text small{ display:block; color:#64748b; font-size:12.5px; line-height:1.3; margin-top:2px }



/* divider + CTAs */

.topbar--compact .tb-divider{

  height:1px; background:#e2e8f0; margin:10px 0 8px; border-radius:2px;

}

.topbar--compact .tb-cta-row{

  display:flex; gap:10px; flex-wrap:wrap;

}

.topbar--compact .tb-cta-link{

  display:inline-flex; align-items:center; gap:8px;

  padding:10px 12px; border-radius:10px;

  background:#f8fafc; color:#0b1220; text-decoration:none; font-weight:800;

  border:1px solid #e2e8f0;

}

.topbar--compact .tb-cta-link:hover{ background:#eef2ff; border-color:#dbeafe }

.topbar--compact .tb-cta-primary{

  background:#0b5cff; color:#fff; border-color:#0b5cff;

}

.topbar--compact .tb-cta-primary:hover{ background:#0846c1; border-color:#0846c1 }



/* === Compact ribbon (scoped) === */

.topbar--compact{

  background:#0b0b0b;

  color:#fff;

  border-bottom:1px solid rgba(255,255,255,.08);

  position:relative;

  z-index:850;                     /* ribbon sits below sticky header */

}

.topbar--compact .tb-row{

  display:flex; align-items:center; justify-content:space-between;

  min-height:44px; gap:16px; padding-block:6px;

}



/* Left: credibility badge */

.topbar--compact .tb-badge{

  display:inline-flex; align-items:center; gap:8px;

  padding:6px 10px; border-radius:999px;

  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16);

  font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:#eaf2ff;

}

.topbar--compact .tb-badge i{ color:var(--cta,#0b5cff) }



/* Optional strapline */

.topbar--compact .tb-strap{

  color:#cfe0ff; font-weight:700; font-size:12.5px; letter-spacing:.01em;

  white-space:nowrap; opacity:.92; margin-left:10px;

}

.topbar--compact .tb-strap::before{ content:"•"; opacity:.5; margin:0 10px 0 4px }

@media (max-width:1060px){ .topbar--compact .tb-strap{ display:none } }



/* Sticky follower: pin ribbon below header when header becomes sticky */

.topbar--compact.tb-follow{

  position:sticky;

  top:var(--sticky-header-h,var(--header-h));

  z-index:850;

  border-bottom:1px solid rgba(0,0,0,.06);

  backdrop-filter:saturate(120%);

}



/* Right: Quick links dropdown (Details/Summary) */

.topbar--compact .tb-cta{ display:flex; align-items:center; gap:10px }



/* Trigger */

.topbar--compact .tb-quick{ position:relative; z-index:1500 } /* stacking context */

.topbar--compact .tb-quick summary{

  list-style:none; cursor:pointer;

  display:inline-flex; align-items:center; gap:8px;

  padding:6px 12px; border-radius:999px; color:#eaf2ff;

  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16);

  font-weight:800;

  transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;

}

.topbar--compact .tb-quick summary::-webkit-details-marker{ display:none }

.topbar--compact .tb-quick summary:hover{

  background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.28);

  box-shadow:0 6px 14px rgba(0,0,0,.18);

}

.topbar--compact .tb-quick[open] summary{

  background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.28);

}

.topbar--compact .tb-quick .tb-caret{ transition:transform .2s; opacity:.9 }

.topbar--compact .tb-quick[open] .tb-caret{ transform:rotate(180deg) }



/* Panel (premium look) */

.topbar--compact .tb-menu{

  position:absolute; right:0; top:calc(100% + 10px);

  min-width:280px; margin:0; padding:10px; list-style:none;

  background:#fff; color:#0f172a;

  border:1px solid #e2e8f0; border-radius:14px;

  /* rich elevation */

  box-shadow:

	0 18px 40px rgba(2,6,23,.18),

	0 2px 0 rgba(2,6,23,.04) inset;

  z-index:1501;                         /* ABOVE nav/mega (header~900, cc-panel<=1200) */

  /* entrance animation */

  opacity:0; transform:translateY(6px) scale(.985); pointer-events:none;

  transition:opacity .18s ease, transform .18s ease;

}

.topbar--compact .tb-quick[open] .tb-menu{

  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;

}



/* Arrow */

.topbar--compact .tb-quick[open] .tb-menu::before{

  content:""; position:absolute; top:-8px; right:22px;

  width:14px; height:14px; transform:rotate(45deg);

  background:#fff; border-left:1px solid #e2e8f0; border-top:1px solid #e2e8f0;

}



/* Items */

.topbar--compact .tb-menu a{

  display:flex; align-items:center; gap:10px;

  padding:12px 12px; border-radius:10px; text-decoration:none;

  color:#0f172a; font-weight:800; letter-spacing:.01em;

  transition:background .15s, color .15s, transform .15s;

}

.topbar--compact .tb-menu a:hover{

  background:#f8fafc; color:#0b1220; transform:translateX(2px);

}

.topbar--compact .tb-menu a:focus-visible{

  outline:0; box-shadow:0 0 0 3px rgba(11,92,255,.20);

}



/* Mobile: keep ribbon minimal */

@media (max-width:820px){ .topbar--compact .tb-badge{ display:none } }



/* Reduce motion */

@media (prefers-reduced-motion:reduce){

  .topbar--compact .tb-menu,

  .topbar--compact .tb-quick .tb-caret,

  .topbar--compact .tb-quick summary{ transition:none }

}

/* Elevate the ribbon above navigation only while the dropdown is open */

.topbar--compact.tb-elevated,

.topbar--compact:has(.tb-quick[open]) {

  z-index: 1600; /* higher than .cc-header, mega menu, etc. */

}



/* If sticky follower is active, same elevation on open */

.topbar--compact.tb-follow.tb-elevated,

.topbar--compact.tb-follow:has(.tb-quick[open]) {

  z-index: 1600;

}



/* ----------------------------------------

   4.5 Hero Section

   ---------------------------------------- */



.hero {

	background: var(--hero-grad);

	padding-block: clamp(36px, 6vh, 64px) 28px;

	position: relative;

	min-height: clamp(560px, 70vh, 760px);

	overflow: hidden;

}



.hero::before {

	content: "";

	position: absolute;

	inset: -20% -10% auto auto;

	width: 60vw;

	height: 60vw;

	background: radial-gradient(50% 50% at 50% 50%, rgba(15, 92, 255, .14) 0%, rgba(15, 92, 255, 0) 60%);

	filter: blur(22px);

	pointer-events: none;

	z-index: 0;

}



.hero::after {

	content: "";

	position: absolute;

	inset: 0;

	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .4) 60%, rgba(255, 255, 255, 1) 100%);

	pointer-events: none;

	z-index: 0;

}



.hero .container,

.hero-grid {

	position: relative;

	z-index: 1;

}



.hero-grid {

	display: grid;

	grid-template-columns: 1fr;

	gap: 28px;

	align-items: start;

}



.pill {

	display: inline-flex;

	align-items: center;

	gap: 10px;

	padding: 10px 14px;

	border-radius: 5px;

	background: #0040c1;

	color: #fff;

	font-weight: 500;

	font-size: 14px;

	box-shadow: 0 1px 0 rgba(0, 0, 0, .05);

}



.headline {

	margin: 16px 0;

	font-size: clamp(28px, 7vw, 34px);

	line-height: 1.08;

	letter-spacing: -.02em;

	font-weight: 700;

	color: #0b0b0b;

}



.headline .hi {

	position: relative;

	color: var(--primary);

}



.headline .hi::after {

	content: "";

	position: absolute;

	left: 0;

	right: 0;

	bottom: 2px;

	height: 10px;

	background: linear-gradient(90deg, rgba(11, 92, 255, .12), rgba(11, 92, 255, .22));

	border-radius: 6px;

	z-index: -1;

}



.hero:hover .headline .hi.shine::before {

	animation-duration: 2.6s;

}



.sub {

	font-size: 16px;

	line-height: 1.55;

	font-weight: 500;

	color: #2b2b2b;

	max-width: 60ch;

}



.ticker {

	position: relative;

	margin-top: 14px;

	overflow: hidden;

	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%);

	mask-image: linear-gradient(90deg, transparent 0, #000 36px, #000 calc(100% - 36px), transparent 100%);

}



.ticker-track {

	display: inline-flex;

	width: max-content;

	gap: 10px;

	will-change: transform;

	white-space: nowrap;

	animation: marquee var(--ticker-speed) linear infinite;

}



.ticker-item {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	padding: 8px 12px;

	border-radius: 3px;

	line-height: 1;

	font-size: 12.5px;

	font-weight: 500;

	border: 0;

	flex: 0 0 auto;

	white-space: nowrap;

}



.ticker-item.alt {

	background: var(--soft-bg);

	color: #0e0e0e;

}



.ticker-item.fill {

	background: #0b5cff;

	color: #fff;

}



@keyframes marquee {

	0% {

		transform: translateX(0);

	}

	100% {

		transform: translateX(-50%);

	}

}



.hero-right {

	display: flex;

	flex-direction: column;

	align-items: center;

	text-align: center;

	gap: 14px;

}



.hero-right--middle {

	align-self: center;

}



.avt-group {

	display: flex;

}



.avt-group img {

	width: 34px;

	height: 34px;

	border-radius: 50%;

	border: 2px solid #fff;

	object-fit: cover;

	margin-left: -16px;

}



.avt-group img:first-child {

	margin-left: 0;

}



.btn-row {

	display: flex;

	gap: 12px;

	flex-wrap: wrap;

	margin-top: 6px;

	justify-content: center;

}



.hero-crest-wrap {

	position: relative;

	flex: 0 0 auto;

	width: 84px;

	height: 84px;

	border-radius: 12px;

	background: linear-gradient(180deg, #f7f9ff, #ffffff);

	display: grid;

	place-items: center;

	border: 1px solid var(--soft-bd);

}



.hero-crest {

	width: 72px;

	height: auto;

}



.hero-social {

	display: flex;

	align-items: center;

	gap: 12px;

}



.hero-social .caption {

	font: 600 14px/1.35 Inter, system-ui, sans-serif;

	color: var(--ink);

}



.hero-social .caption small {

	color: var(--muted);

	font-weight: 500;

}



.hero-micro {

	display: flex;

	gap: 8px;

	flex-wrap: wrap;

}



.hero-micro .chip {

	padding: 6px 10px;

	border-radius: 999px;

	background: #eef4ff;

	border: 1px solid #dbe8ff;

	color: #0b5cff;

	font: 700 12px/1 Inter, system-ui, sans-serif;

}



.hero-actions {

	display: flex;

	gap: 10px;

	flex-wrap: wrap;

}



/* ----------------------------------------

   4.6 Metrics Section

   ---------------------------------------- */



.metrics {

	display: grid;

	align-items: start;

	grid-template-columns: repeat(5, minmax(0, 1fr));

	column-gap: 12px;

	row-gap: 8px;

	margin-top: 50px;

}



.metric {

	display: flex;

	flex-direction: column;

	gap: 6px;

	padding: 12px 14px;

}



.metric:not(:first-child) {

	border-left: 1px dashed var(--line);

}



.metric .stat {

	display: flex;

	align-items: flex-end;

	gap: 8px;

	flex-wrap: wrap;

}



.metric .value {

	font-family: "Inter Tight", Inter, sans-serif;

	font-weight: 800;

	font-size: clamp(22px, 6vw, 28px);

	line-height: 1;

	color: var(--primary) !important;

	letter-spacing: -.01em;

}



.metric .label-text {

	font: 800 12px/1.1 Inter, system-ui, sans-serif;

	letter-spacing: .06em;

	text-transform: uppercase;

	color: #111;

}



.metric .sub {

	font: 500 13.5px/1.45 Inter, system-ui, sans-serif;

	color: var(--muted);

}



.metric.review {

	flex-direction: row;

	align-items: center;

	gap: 12px;

	padding-right: 0;

}



.metric.review .m-label {

	font: 800 11px/1 Inter, system-ui, sans-serif;

	letter-spacing: .08em;

	color: var(--muted);

	margin-bottom: 4px;

}



.google-logo {

	height: 22px;

	margin-top: 6px;

}



.review-details .stars,

.metric.review .stars {

	display: flex;

	gap: 2px;

	color: var(--gold);

	font-size: 18px;

	line-height: 1;

}



.review-details .m-sub {

	color: var(--muted);

	margin-top: 7px;

	font-weight: 500;

}



.metric.review .google-logo {

	height: 20px;

	margin: 0;

}



.metric.review .m-sub {

	margin-top: 2px;

	font: 600 12.5px/1.2 Inter, system-ui, sans-serif;

	color: var(--ink);

}



.metrics--band {

	padding: 12px 12px;

}



.metrics--band .metric {

	padding: 12px 16px;

}



.metrics--leadwide {

	display: grid;

	grid-template-columns: repeat(2, minmax(0, 1fr));

	column-gap: 0;

	row-gap: 0;

}



.metrics--leadwide .metric:first-child {

	grid-column: 1 / -1;

	padding: 14px 16px;

	border-bottom: 1px dashed var(--line);

}



.metrics--leadwide .metric:nth-child(n+2) {

	padding: 5px 10px;

	border-top: 1px dashed var(--line);

}



.metrics--leadwide .metric:nth-child(2),

.metrics--leadwide .metric:nth-child(4) {

	border-right: 1px dashed var(--line);

}



.metrics--leadwide .metric.review {

	display: flex;

	align-items: center;

	gap: 16px;

	padding-right: 16px;

}



.metrics--leadwide .metric.review .google-logo {

	height: 20px;

	margin: 0;

}



.metrics--leadwide .metric.review .m-label {

	font: 800 11px/1 Inter, system-ui, sans-serif;

	letter-spacing: .08em;

	color: var(--muted);

	margin-bottom: 4px;

}



.metrics--leadwide .metric.review .stars {

	color: var(--gold);

	font-size: 18px;

	line-height: 1;

}



.metrics--leadwide .metric.review .m-sub {

	margin-top: 2px;

	font: 600 12.5px/1.2 Inter, system-ui, sans-serif;

	color: var(--ink);

}



/* ----------------------------------------

   4.7 "How We Can Help" Section (svalt2)

   ---------------------------------------- */



.svalt2 {

	position: relative;

	padding: 56px 0 64px;

	background: linear-gradient(180deg, #ffffff 0%, rgba(238, 244, 255, .55) 100%);

	border-top: 1px solid var(--line);

	overflow: hidden;

}



.svalt2::before {

	content: "";

	position: absolute;

	inset: 0;

	background: url("https://ccl.legalify.com.au/wp-content/uploads/2025/04/net-2.png") center/120% no-repeat;

	opacity: .10;

	pointer-events: none;

}



.svalt2 .container {

	position: relative;

	z-index: 1;

}



.svalt-head {

	display: grid;

	gap: 12px;

	text-align: center;

	margin: 0 auto 40px;

}



.svalt-kicker {

	display: inline-flex;

	align-items: center;

	gap: 6px;

	padding: 7px 14px;

	border-radius: 999px;

	border: 1px solid var(--line);

	background: #fff;

	font: 800 12px/1 Inter;

	letter-spacing: .06em;

	text-transform: uppercase;

	color: #0f172a;

	margin-inline: auto;

	box-shadow: 0 2px 8px rgba(11, 92, 255, .08);

	transition: transform .3s, box-shadow .3s;

}



.svalt-kicker:hover {

	transform: translateY(-1px);

	box-shadow: 0 4px 12px rgba(11, 92, 255, .12);

}



.svalt-title {

	margin: 0;

	font: 800 clamp(28px, 5.5vw, 48px)/1.05 "Inter Tight";

	letter-spacing: -.02em;

	color: #0f172a;

}



.svalt-title em {

	font-style: normal;

	background: linear-gradient(135deg, var(--primary), #1d4ed8);

	-webkit-background-clip: text;

	-webkit-text-fill-color: transparent;

}



.svalt-sub {

	margin: 0;

	color: var(--muted);

	font: 500 clamp(16px, 1.8vw, 16px)/1.65 Inter, system-ui;

	max-width: 68ch;

	margin-inline: auto;

	text-wrap: balance;

}



.svalt-sub strong {

	color: #0f172a;

	font-weight: 600;

}



.svalt-group {

	display: grid;

	gap: 8px;

	margin-top: 22px;

}



.svalt-gh {

	display: flex;

	align-items: center;

	gap: 10px;

	margin: 0;

	color: #0f172a;

	font: 800 15.5px/1.2 Inter, system-ui, sans-serif;

	letter-spacing: .02em;

}



.svalt-gh::after {

	content: "";

	flex: 1 1 auto;

	height: 1px;

	background: var(--line);

	border-radius: 2px;

	opacity: .9;

}



.svalt-list {

	display: grid;

	gap: 12px;

	margin-top: 10px;

	grid-template-columns: repeat(2, minmax(290px, 1fr));

	justify-content: center;

}



.svalt-item {

	position: relative;

	display: grid;

	align-items: center;

	gap: 14px;

	grid-template-columns: 56px 1fr auto;

	background: #fff;

	border: 1px solid var(--soft-bd);

	border-radius: 14px;

	padding: 14px 16px;

	text-decoration: none;

	color: #0b1220;

	box-shadow: 0 4px 12px rgba(0, 0, 0, .04);

	transition: transform .16s, box-shadow .16s, border-color .16s, background .16s;

}



.svalt-item:hover {

	transform: translateY(-2px);

	box-shadow: 0 10px 24px rgba(0, 0, 0, .08);

	border-color: #dbe4ff;

}



.svalt-item::before {

	content: "";

	position: absolute;

	inset: -2px;

	background: url("https://ccl.legalify.com.au/wp-content/uploads/2025/04/net-2.png") center/130% no-repeat;

	opacity: .06;

	pointer-events: none;

}



.svalt-ico {

	width: 56px;

	height: 56px;

	border-radius: 12px;

	display: grid;

	place-items: center;

	background: #f5f7ff;

	color: #0b5cff;

	border: 1px solid var(--soft-bd);

	font-size: 20px;

}



.svalt-body {

	display: grid;

	gap: 4px;

}



.svalt-h {

	margin: 0;

	font: 800 16px/1.2 "Inter Tight", Inter, sans-serif;

	color: #111827;

	text-align: left;

}



.svalt-meta {

	margin: 0;

	color: #4b5563;

	font: 500 13px/1.5 Inter, system-ui, sans-serif;

	text-align: left;

}



.svalt-go {

	width: 40px;

	height: 40px;

	display: grid;

	place-items: center;

	border-radius: 999px;

	background: #0b5cff;

	color: #fff;

	box-shadow: 0 6px 16px rgba(11, 92, 255, .35);

	transition: transform .15s ease, background .15s ease;

}



.svalt-item:hover .svalt-go {

	transform: translateX(2px);

	background: #0a49e0;

}



.svalt-callout {

	margin: 22px 0 6px;

	border: 1px dashed #cfe0ff;

	background: #f3f7ff;

	color: #0e1b2e;

	padding: 16px;

	border-radius: 14px;

	display: flex;

	gap: 12px;

	align-items: flex-start;

}



.svalt-callout i {

	color: #0b5cff;

	font-size: 18px;

	margin-top: 3px;

}



.svalt-callout p {

	margin: 0;

	font: 600 14px/1.55 Inter;

}



.svalt-actions {

	display: flex;

	gap: 12px;

	flex-wrap: wrap;

	justify-content: center;

	margin-top: 18px;

}



/* ----------------------------------------

   4.8 About Section

   ---------------------------------------- */



.about-section {

	overflow: hidden;

}



.about-section__main {

	background: var(--dark-section-bg);

	color: #fff;

	padding-top: 85px;

	position: relative;

}



.about-section__main::before {

	content: "";

	position: absolute;

	inset: 0;

	background-image: url("https://tpdclaimslawyers.com.au/wp-content/uploads/2022/11/bg-sv.png");

	background-position: bottom right;

	background-repeat: no-repeat;

	background-size: 400px auto;

	opacity: 0.15;

	z-index: 1;

}



.about-section__main .container {

	position: relative;

	z-index: 2;

}



.about-section__details {

	padding: 0;

}



.about__section {

	position: relative;

	margin-left: auto;

	margin-right: auto;

	padding: 100px 0 100px;

	z-index: 1;

}



.about__section:before {

	content: "";

	position: absolute;

	z-index: -1;

	left: 0;

	right: 0;

	bottom: 0;

	top: 40%;

	background: #fff;

	box-shadow: 0 10px 40px rgba(38, 44, 55, .12);

}



.about__section:after {

	content: "";

	position: absolute;

	z-index: -1;

	left: 0;

	right: 0;

	height: 350px;

	top: calc(40% - 60px);

	background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #fff 80%);

}



.about-hero {

	border-bottom: 1px solid rgba(255, 255, 255, 0.1);

	padding: 0 0 50px;

}



.about-hero__grid {

	display: grid;

	gap: 24px;

	align-items: center;

}



.about-hero__lockup {

	max-width: 820px;

}



.about-hero__title--prime {

	font-size: clamp(36px, 5vw, 54px);

	line-height: 1.08;

	font-weight: 800;

	letter-spacing: -0.015em;

	margin: 0 0 25px;

	color: #fff;

}



.title-period {

	color: var(--cta);

	position: relative;

	top: -1px;

}



.title-accent {

	background: linear-gradient(90deg, #cfe0ff 0%, #ffffff 60%, #cfe0ff 100%);

	-webkit-background-clip: text;

	background-clip: text;

	color: transparent;

}



.title-accent--underline {

	position: relative;

	white-space: nowrap;

}



.title-accent--underline::after {

	content: "";

	position: absolute;

	left: 0;

	right: 0;

	bottom: -6px;

	height: 6px;

	border-radius: 999px;

	background: linear-gradient(90deg, rgba(29, 194, 239, 0) 0%, rgba(29, 194, 239, 0.65) 35%, rgba(29, 99, 255, 0.85) 65%, rgba(29, 194, 239, 0) 100%);

	filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.25));

	transform: scaleX(0.85);

	opacity: 0.95;

	animation: titleSweep 1.4s ease 0.15s both;

}



@keyframes titleSweep {

	0% {

		transform: scaleX(0.1);

		opacity: 0;

	}

	60% {

		transform: scaleX(1.05);

		opacity: 1;

	}

	100% {

		transform: scaleX(0.98);

		opacity: 0.95;

	}

}



.about-hero__sublead {

	margin: 6px 0 14px;

	font-size: clamp(16px, 1.6vw, 18px);

	color: rgba(255, 255, 255, 0.82);

}



.title-meta {

	display: flex;

	flex-wrap: wrap;

	gap: 8px;

	margin: 0;

	padding: 0;

	list-style: none;

}



.title-chip {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 8px 10px;

	border-radius: 999px;

	font-size: 13px;

	font-weight: 600;

	color: #fff;

	background: rgba(255, 255, 255, 0.08);

	border: 1px solid rgba(255, 255, 255, 0.18);

}



.ab-pill {

	display: inline-block;

	padding: 6px 12px;

	border-radius: 999px;

	font-size: 12px;

	font-weight: 700;

	letter-spacing: 0.6px;

	text-transform: uppercase;

	line-height: 1;

	border: 1px solid rgba(255, 255, 255, 0.25);

	background: rgba(255, 255, 255, 0.08);

	color: #fff;

	backdrop-filter: saturate(130%) blur(2px);

	margin-bottom: 14px;

}



.about-intro {

	padding: 75px 0 25px;

}



.about-intro__grid {

	display: grid;

	gap: 32px;

	align-items: center;

}



.about-intro__kicker {

	color: #8fb4ff;

	text-transform: uppercase;

	font-weight: 700;

	font-size: 13px;

	letter-spacing: 0.8px;

	margin: 0 0 10px;

}



.about-intro__title {

	margin: 0 0 14px;

	font-size: clamp(28px, 3.5vw, 36px);

	font-weight: 800;

	line-height: 1.25;

	color: #fff;

}



.about-intro__lede {

	margin: 0 0 12px;

	color: rgba(255, 255, 255, 0.88);

	font-size: 17px;

	line-height: 1.75;

}



.about-intro__link {

	color: #cfe0ff;

	text-decoration: underline;

	text-underline-offset: 3px;

}



.about-intro__cta {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	margin-top: 10px;

	color: #fff;

	font-weight: 700;

	text-decoration: none;

	border-bottom: 2px solid rgba(255, 255, 255, 0.25);

	padding-bottom: 4px;

	transition: border-color 0.3s;

}



.about-intro__cta:hover {

	border-color: #fff;

	text-decoration: none;

}



.hero-cred {

	position: relative;

	border-radius: 16px;

	padding: 16px;

	background: radial-gradient(120% 120% at 20% 0%, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.04) 60%, rgba(255, 255, 255, 0.02) 100%);

	border: 1px solid rgba(255, 255, 255, 0.18);

	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.12);

	color: #fff;

	overflow: hidden;

}



.hero-cred::before {

	content: "";

	position: absolute;

	inset: 0 0 auto 0;

	height: 2px;

	background: linear-gradient(90deg, rgba(29, 99, 255, 0), rgba(29, 99, 255, 0.65), rgba(29, 99, 255, 0));

	opacity: 0.9;

}



.hero-cred::after {

	content: "";

	position: absolute;

	width: 260px;

	height: 260px;

	right: -110px;

	top: -110px;

	background: radial-gradient(closest-side, rgba(29, 194, 239, 0.18), rgba(29, 194, 239, 0));

	filter: blur(2px);

	pointer-events: none;

}



.hero-cred__media {

	overflow: hidden;

	margin-bottom: 12px;

}



.about-intro__media-link {

	position: relative;

	display: block;

}



.about-intro__img {

	width: 100%;

	aspect-ratio: 4/3;

	object-fit: cover;

	display: block;

}



.about-intro__play {

	position: absolute;

	top: 50%;

	left: 50%;

	transform: translate(-50%, -50%);

	width: 60px;

	height: 60px;

	display: grid;

	place-items: center;

	border-radius: 999px;

	background: rgba(255, 255, 255, 0.92);

	color: var(--primary);

	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);

}



.hero-cred__cta {

	display: flex;

	align-items: center;

	gap: 12px;

	margin: 2px 0 6px;

}



.hero-cred__cta--tight .hero-cred__btn {

	box-shadow: 0 10px 24px rgba(29, 194, 239, 0.32);

	border-color: transparent;

}



.hero-cred__phone {

	margin: 0;

	font-size: 14px;

	opacity: 0.9;

}



.hero-cred__tel {

	color: #fff;

	text-decoration: underline;

	text-underline-offset: 2px;

}



.badge {

	font-size: 12px;

	padding: 6px 8px;

	border-radius: 8px;

	background: rgba(255, 255, 255, 0.06);

	border: 1px solid rgba(255, 255, 255, 0.12);

	display: inline-flex;

	align-items: center;

	gap: 6px;

}



.about-services {

	display: grid;

	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

	gap: 30px;

	padding: 0 0 80px;

}



.about-service-card img {

	margin-bottom: 24px;

}



.about-service-card h3 {

	font-size: 20px;

	font-weight: 700;

	margin: 0 0 8px;

}



.about-service-card p {

	font-size: 15px;

	line-height: 1.6;

	color: rgba(255, 255, 255, 0.7);

	margin: 0;

}



.about-service-card a {

	color: #fff;

}



.about-service-card a:hover {

	text-decoration: underline;

}



/* Carousel */

.ccl-carousel {

	position: relative;

}



.ccl-carousel__slides {

	overflow: hidden;

	border-radius: 12px 12px 0 0;

}



.ccl-carousel__slide {

	display: none;

}



.ccl-carousel__slide.active {

	display: block;

	animation: fadeIn 0.5s;

}



@keyframes fadeIn {

	from {

		opacity: 0;

	}

	to {

		opacity: 1;

	}

}



.ccl-carousel__dots {

	text-align: center;

	padding-top: 16px;

}



.ccl-carousel__dot {

	height: 10px;

	width: 10px;

	margin: 0 5px;

	background-color: rgba(255, 255, 255, 0.4);

	border-radius: 50%;

	display: inline-block;

	cursor: pointer;

	border: none;

	padding: 0;

	transition: background-color 0.3s ease;

}



.ccl-carousel__dot:hover {

	background-color: rgba(255, 255, 255, 0.7);

}



.ccl-carousel__dot.active {

	background-color: #fff;

}



.small {

	font-size: 75%;

	display: block;

	text-align: center;

	margin-top: 8px;

	opacity: 0.7;

}



/* Video Modal */

.video-modal {

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background-color: rgba(0, 0, 0, 0.8);

	display: flex;

	justify-content: center;

	align-items: center;

	z-index: 1000;

	opacity: 0;

	visibility: hidden;

	transition: opacity 0.3s ease, visibility 0.3s ease;

}



.video-modal.is-visible {

	opacity: 1;

	visibility: visible;

}



.video-modal__content {

	position: relative;

	width: 90%;

	max-width: 900px;

	transform: scale(0.9);

	transition: transform 0.3s ease;

}



.video-modal.is-visible .video-modal__content {

	transform: scale(1);

}



.video-modal__close {

	position: absolute;

	top: -40px;

	right: 0;

	background: none;

	border: none;

	color: #fff;

	font-size: 36px;

	cursor: pointer;

}



.video-modal__video-wrapper {

	position: relative;

	padding-bottom: 56.25%;

	height: 0;

	overflow: hidden;

	background: #000;

}



.video-modal__video-wrapper iframe {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

}





/* ----------------------------------------

   4.9 TPD Section

   ---------------------------------------- */



.ccl-wrapper {

	position: relative;

	isolation: isolate;

	z-index: 0;

	margin-top: -240px;

	padding: 160px 0 50px;

	background: linear-gradient(180deg, #fff 0%, var(--soft-blue-bg) 60%);

	transition: background .3s, border-radius .3s, opacity .3s;

}



.ccl-content-grid {

	display: grid;

	gap: 60px;

	padding: 200px 0 0;

	margin: 0;

}



/* ----------------------------------------

   4.10 "Why CCL" Section

   ---------------------------------------- */



.why-ccl-full {

	--primary: #0b5cff;

	--muted: #667085;

	--bg: #f8faff;

	--line: rgba(219, 232, 255, .8);

}



.why-head {

	text-align: center;

	margin: 0 auto 64px;

	position: relative;

}



.why-pill {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 8px 16px;

	background: #fff;

	border: 1px solid var(--line);

	border-radius: 999px;

	font: 800 12px/1 Inter;

	letter-spacing: .06em;

	text-transform: uppercase;

	color: #0f172a;

	margin-bottom: 18px;

	box-shadow: 0 4px 12px rgba(11, 92, 255, .08);

	transition: .3s ease;

}



.why-pill:hover {

	transform: translateY(-2px);

	box-shadow: 0 6px 20px rgba(11, 92, 255, .12);

}



.why-head h2 {

	font: 800 clamp(36px, 7vw, 56px)/1.02 "Inter Tight";

	letter-spacing: -.02em;

	margin: 0 0 16px;

}



.gradient-text {

	background: linear-gradient(135deg, var(--primary), #1d4ed8);

	-webkit-background-clip: text;

	-webkit-text-fill-color: transparent;

}



.why-sub {

	font: 500 clamp(18px, 2.2vw, 22px)/1.65 Inter, system-ui;

	color: #334155;

	max-width: 68ch;

	margin: 0 auto 24px;

	text-wrap: balance;

}



.why-sub .highlight {

	background: linear-gradient(120deg, rgba(11, 92, 255, .12), rgba(11, 92, 255, .22));

	padding: 2px 8px;

	border-radius: 6px;

	font-weight: 600;

	color: #0f172a;

}



.hero-cta {

	display: flex;

	gap: 14px;

	justify-content: center;

	flex-wrap: wrap;

	margin-top: 28px;

}



.ccl-band {

	display: flex;

	align-items: center;

	gap: 10px;

	margin: 0 auto 64px;

	max-width: 760px;

}



.ccl-band.last {

	margin: 64px auto 5px;

}



.ccl-band s {

	height: 1px;

	flex: 1;

	background: linear-gradient(90deg, transparent, var(--line), transparent);

}



.ccl-band i {

	width: 140px;

	height: 4px;

	border-radius: 999px;

	background: linear-gradient(90deg, transparent, var(--primary), transparent);

	position: relative;

}



.ccl-band i::after {

	content: "";

	position: absolute;

	top: 50%;

	left: 50%;

	transform: translate(-50%, -50%);

	width: 10px;

	height: 10px;

	background: var(--primary);

	border-radius: 50%;

	box-shadow: 0 0 0 5px rgba(29, 99, 255, .15);

}



.value-grid {

	display: grid;

	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

	gap: 35px;

}



.v-tile {

	background: #fff;

	border: 1px solid var(--line);

	border-radius: 18px;

	padding: 28px;

	box-shadow: 0 4px 12px rgba(0, 0, 0, .04);

	transition: .3s;

	position: relative;

	overflow: hidden;

}



.v-tile::before {

	content: "";

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	height: 3px;

	background: linear-gradient(90deg, var(--primary), #1d4ed8);

	transform: scaleX(0);

	transition: transform .4s ease;

}



.v-tile:hover {

	transform: translateY(-6px);

	box-shadow: 0 12px 28px rgba(0, 0, 0, .08);

}



.v-tile:hover::before {

	transform: scaleX(1);

}



.v-ico {

	width: 56px;

	height: 56px;

	border-radius: 14px;

	background: linear-gradient(135deg, #eef4ff, #e0ebff);

	display: grid;

	place-items: center;

	color: var(--primary);

	font-size: 22px;

	margin-bottom: 14px;

	transition: .3s;

}



.v-tile:hover .v-ico {

	background: linear-gradient(135deg, var(--primary), #1d4ed8);

	color: #fff;

}



.v-tile h4 {

	font: 800 18px/1.3 "Inter Tight";

	margin: 0 0 10px;

}



.v-tile p {

	font-size: 15px;

	color: var(--muted);

	margin: 0 0 12px;

}



.v-list {

	list-style: none;

	padding: 0;

	margin: 0;

}



.v-list li {

	position: relative;

	padding: 4px 0 4px 20px;

	font: 500 14px/1.6 Inter;

	color: var(--muted);

}



.v-list li::before {

	content: "✓";

	position: absolute;

	left: 0;

	color: var(--primary);

	font-weight: 700;

}



.tile--prime {

	border-color: var(--primary);

	background: linear-gradient(135deg, #f8faff, #f0f7ff);

}



.fee-callout {

	background: rgba(11, 92, 255, .08);

	padding: 16px;

	border-radius: 10px;

	text-align: center;

	margin-top: 16px;

}



.fee-top {

	display: block;

	font: 800 20px/1 "Inter Tight";

	color: var(--primary);

}



.fee-small {

	font-size: 13px;

	color: var(--muted);

}



/* ----------------------------------------

   4.11 Interactive Process Timeline

   ---------------------------------------- */



/* ----------------------------------------

   4.11 Interactive Process Timeline (refined heading)

   ---------------------------------------- */



@keyframes ccl-proc-underline-sweep {

  to { transform: translateX(-50%) scaleX(1); }

}



@keyframes ccl-proc-sweep-in {

  0% { transform: scaleX(0); transform-origin: left; }

  100% { transform: scaleX(1); transform-origin: left; }

}



.ccl-proc-a9b3 * { box-sizing: border-box; min-width: 0; margin: 0; padding: 0; }



.ccl-proc-a9b3 {

  font-family: 'Inter', sans-serif;

  background-color: var(--ccl-proc-bg);

  color: var(--ccl-proc-ink);

}



.ccl-proc-a9b3 .ccl-proc-container { max-width: 1400px; margin: 0 auto; padding: 0 40px; }



.ccl-proc-a9b3 .ccl-proc-process-layout {

  display: grid;

  grid-template-columns: 1.75fr 1fr;

  gap: 5rem;

  align-items: start;

  padding: 100px 0;

}

.ccl-proc-sidebar-content { margin-top: 25px; }



.ccl-proc-a9b3 .ccl-proc-process-sidebar { position: sticky; top: 4rem; }



/* Badge: neutralize blue text, keep subtle frame */

.ccl-proc-a9b3 .ccl-proc-process-badge {

  display: inline-block;

  padding: 6px 12px;

  background: rgba(2, 6, 23, 0.035); /* soft ink wash */

  border: 1px solid var(--ccl-proc-line);

  border-radius: 999px;

  font: 700 12px/1 'Inter', sans-serif;

  letter-spacing: .06em;

  text-transform: uppercase;

  color: var(--ccl-proc-ink);

  margin-bottom: 14px;

}



/* Title: match Testimonials rhythm, minimal blue in text */

.ccl-proc-a9b3 .ccl-proc-process-title {

  font-weight: 900;

  font-size: clamp(32px, 4.6vw, 48px);

  line-height: 1.06;

  letter-spacing: -0.025em;

  text-wrap: balance;

  margin: 0 0 12px;

  color: var(--ccl-proc-ink);

}



/* Keep accent word as ink (no blue fill) */

.ccl-proc-a9b3 .ccl-proc-title-accent {

  color: var(--ccl-proc-ink);

  font-weight: 900;

}



/* Underline pill: subtle blue gradient, animated sweep */

.ccl-proc-a9b3 .ccl-proc-title-accent--underline { position: relative; }

.ccl-proc-a9b3 .ccl-proc-title-accent--underline::after {

  content: "";

  position: absolute;

  left: 50%;

  bottom: -12px;

  height: 12px;

  width: min(460px, 80%);

  border-radius: 999px;

  transform: translateX(-50%) scaleX(0);

  transform-origin: left center;

  opacity: .95;

  background:

	radial-gradient(24px 12px at 8% 50%, rgba(11,92,255,.22), rgba(11,92,255,0) 70%),

	linear-gradient(90deg, rgba(11,92,255,.14), rgba(11,92,255,.26) 40%, rgba(11,92,255,.14));

}

@media (prefers-reduced-motion: no-preference) {

  .ccl-proc-a9b3 .ccl-proc-title-accent--underline::after {

	animation: ccl-proc-underline-sweep .8s cubic-bezier(.2,.65,.3,1) .1s forwards;

  }

}



/* Remove bright blue period; keep ink */

.ccl-proc-a9b3 .ccl-proc-title-period { color: var(--ccl-proc-ink); }



/* Subtitle tone/measure aligned to testimonials */

.ccl-proc-a9b3 .ccl-proc-process-description {

  font: 500 17px/1.7 'Inter', sans-serif;

  color: #475569; /* cooler slate */

  margin: 1.5rem 0 2rem;

  max-width: 640px;

}



/* Progress rail unchanged */

.ccl-proc-a9b3 .ccl-proc-progress-rail {

  height: 4px;

  background: var(--ccl-proc-line);

  border-radius: 2px;

  overflow: hidden;

  margin: 0 0 1rem;

}

.ccl-proc-a9b3 .ccl-proc-progress-bar {

  display: block; height: 100%;

  background: linear-gradient(90deg, #0b5cff 0%, #3c82f6 100%);

  width: 0%;

  transition: width .4s cubic-bezier(.4,0,.2,1);

}



/* Steps/nav unchanged below */

.ccl-proc-a9b3 .ccl-proc-process-nav .ccl-proc-nav-steps { list-style: none; display: grid; gap: .5rem; }

.ccl-proc-a9b3 .ccl-proc-step-trigger {

  display: flex; align-items: center; gap: .75rem; width: 100%;

  padding: .875rem 1.125rem; background: #fff; border: 1px solid var(--ccl-proc-line);

  border-radius: 10px; text-align: left; cursor: pointer;

  transition: all .25s cubic-bezier(.4,0,.2,1); color: var(--ccl-proc-muted);

}

.ccl-proc-a9b3 .ccl-proc-step-trigger:hover {

  border-color: var(--ccl-proc-primary); background: rgba(11,92,255,.03); transform: translateX(4px);

}

.ccl-proc-a9b3 .ccl-proc-step-trigger.ccl-proc-active,

.ccl-proc-a9b3 .ccl-proc-step-trigger[aria-current="true"] {

  background: linear-gradient(135deg, #0b5cff 0%, #3c82f6 100%);

  border-color: var(--ccl-proc-primary); color: #fff; transform: translateX(8px) scale(1.01);

  box-shadow: 0 4px 12px rgba(11,92,255,.15);

}

.ccl-proc-a9b3 .ccl-proc-step-number {

  width: 1.875rem; height: 1.875rem; display:flex; align-items:center; justify-content:center;

  background: var(--ccl-proc-surface); border:1px solid var(--ccl-proc-line); border-radius:50%;

  font:700 .75rem/1 'Inter', sans-serif; color: var(--ccl-proc-muted); flex-shrink:0; transition: all .2s;

}

.ccl-proc-a9b3 .ccl-proc-step-trigger.ccl-proc-active .ccl-proc-step-number,

.ccl-proc-a9b3 .ccl-proc-step-trigger[aria-current="true"] .ccl-proc-step-number{

  background: rgba(255,255,255,.2); color:#fff; border-color:transparent;

}

.ccl-proc-a9b3 .ccl-proc-step-label { font: 600 .925rem/1.1 'Inter', sans-serif; }



.ccl-proc-a9b3 .ccl-proc-process-content { padding: 50px 0; }

.ccl-proc-a9b3 .ccl-proc-process-steps { display: grid; gap: 3rem; }

.ccl-proc-a9b3 .ccl-proc-process-step {

  padding: 2.25rem; background:#fff; border:1px solid var(--ccl-proc-line);

  border-radius:14px; box-shadow:0 2px 8px rgba(0,0,0,.04);

  transition: all .4s cubic-bezier(.4,0,.2,1); opacity:.7; transform: translateY(15px);

}

.ccl-proc-a9b3 .ccl-proc-process-step.ccl-proc-active {

  opacity:1; transform: translateY(0);

  border-color: rgba(11,92,255,.3); box-shadow: 0 8px 24px rgba(11,92,255,.08); background:#fff;

}

.ccl-proc-a9b3 .ccl-proc-step-header { display:flex; gap:1.5rem; align-items:flex-start; }

.ccl-proc-a9b3 .ccl-proc-step-icon {

  flex-shrink:0; width:3.75rem; height:3.75rem; display:flex; align-items:center; justify-content:center;

  background:#fff; border-radius:10px; border:1px solid var(--ccl-proc-line); transition: all .3s ease;

}

.ccl-proc-a9b3 .ccl-proc-process-step.ccl-proc-active .ccl-proc-step-icon { border-color: var(--ccl-proc-primary); background: rgba(11,92,255,.05); }

.ccl-proc-a9b3 .ccl-proc-step-icon svg { width:1.75rem; height:1.75rem; color: var(--ccl-proc-primary); stroke-width:2; }

.ccl-proc-a9b3 .ccl-proc-step-info h2 {

  margin: 0 0 .75rem; font: 700 21px/1.3 'Inter', sans-serif; color: var(--ccl-proc-ink); letter-spacing:-.01em;

}

.ccl-proc-a9b3 .ccl-proc-step-info p { margin:0; color: var(--ccl-proc-muted); font: 500 16px/1.7 'Inter', sans-serif; }



@media (max-width:1024px){

  .ccl-proc-a9b3 .ccl-proc-container { padding: 0 20px; }

  .ccl-proc-a9b3 .ccl-proc-process-layout { grid-template-columns:1fr; gap:2rem; padding:2rem 0; }

  .ccl-proc-a9b3 .ccl-proc-process-sidebar { position: static; grid-row: 1; }

}

@media (max-width:768px){

  .ccl-proc-a9b3 .ccl-proc-step-header { flex-direction: column; gap: 1rem; }

  .ccl-proc-a9b3 .ccl-proc-step-icon { width:3rem; height:3rem; }

  .ccl-proc-a9b3 .ccl-proc-step-icon svg { width:1.5rem; height:1.5rem; }

  .ccl-proc-a9b3 .ccl-proc-step-info h2 { font-size:19px; }

  .ccl-proc-a9b3 .ccl-proc-step-info p { font-size:15px; }

  .ccl-proc-a9b3 .ccl-proc-process-step { padding:1.75rem; }

  .ccl-proc-a9b3 .ccl-proc-title-accent--underline::after {

	height: 9px; bottom: -10px; width: min(360px, 82%);

  }

}



.ccl-proc-a9b3 .ccl-proc-step-trigger:focus-visible,

.ccl-proc-a9b3 .ccl-proc-process-step:focus-visible {

  outline: 2px solid var(--ccl-proc-primary);

  outline-offset: 2px;

}





/* --- Bridge divider between sections (unique: lsx-bridge-*) --- */

.lsx-bridge-divider{

  display:flex;align-items:center;justify-content:center;gap:12px;

  margin:36px auto 0;max-width:1200px;padding:0 24px;

}

.lsx-bridge-divider::before,

.lsx-bridge-divider::after{

  content:"";flex:1;height:1px;

  background:linear-gradient(90deg, rgba(11,92,255,0), rgba(11,92,255,.35));

}

.lsx-bridge-divider::after{

  background:linear-gradient(270deg, rgba(11,92,255,0), rgba(11,92,255,.35));

}

.lsx-bridge-dot{

  width:12px;height:12px;border-radius:999px;

  background:linear-gradient(135deg,var(--primary),var(--primary-dark));

  box-shadow:0 0 0 5px rgba(11,92,255,.08);

}

@media (max-width:768px){

  .lsx-bridge-divider{ margin:28px auto 0; }

}

/* Ensure process icons use outline strokes (match brand blue) */

.ccl-proc-a9b3 .ccl-proc-step-icon svg{

  stroke: currentColor;

  fill: none;

}

/* ===== Process sidebar: headline + badge refresh ===== */

.ccl-proc-a9b3 .ccl-proc-process-badge{

  display:inline-block;

  padding:6px 12px;

  border:1px solid var(--ccl-proc-line);

  border-radius:999px;

  background:rgba(2,6,23,.035);

  font:700 12px/1 'Inter',sans-serif;

  letter-spacing:.06em;

  text-transform:uppercase;

  color:var(--ccl-proc-ink);

  margin-bottom:10px;

}



.ccl-proc-a9b3 .ccl-proc-process-title{

  margin:0 0 6px;

  font-weight:900;

  font-size:clamp(30px,4.4vw,42px);

  letter-spacing:-.02em;

  line-height:1.06;

  color:var(--ccl-proc-ink);

}



.ccl-proc-a9b3 .ccl-proc-process-tagline{

  margin:0 0 6px;

  font:800 14px/1.2 'Inter',sans-serif;

  letter-spacing:.02em;

  color:#0b5cff; /* brand pop */

}



/* Keep your existing description tone, just a hair stronger */

.ccl-proc-a9b3 .ccl-proc-process-description{

  color:#475569;

  max-width:46ch;

}



/* ===== Step cards: subtle elevation + icon chip polish ===== */

.ccl-proc-a9b3 .ccl-proc-process-step{

  border:1px solid var(--ccl-proc-line);

  border-radius:14px;

  background:#fff;

  box-shadow:0 2px 8px rgba(0,0,0,.04);

  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease, opacity .2s ease;

  padding:22px;

}



.ccl-proc-a9b3 .ccl-proc-process-step:not(.ccl-proc-active):hover{

  border-color:#dbeafe;

  box-shadow:0 10px 24px rgba(11,92,255,.08);

  transform:translateY(-2px);

}



.ccl-proc-a9b3 .ccl-proc-process-step.ccl-proc-active{

  border-color:rgba(11,92,255,.30);

  box-shadow:0 10px 26px rgba(11,92,255,.10);

  opacity:1;

}



/* Icon chip */

.ccl-proc-a9b3 .ccl-proc-step-icon{

  width:3.1rem; height:3.1rem;

  display:flex; align-items:center; justify-content:center;

  border-radius:10px;

  background:rgba(11,92,255,.08);

  border:1px solid #dbeafe;

  color:#0b5cff;

}

.ccl-proc-a9b3 .ccl-proc-step-icon svg{

  width:1.6rem; height:1.6rem;

  stroke:currentColor; fill:none; stroke-width:2;

}



/* Headings within cards */

.ccl-proc-a9b3 .ccl-proc-step-info h2{

  margin:0 0 6px;

  font:800 20px/1.25 'Inter Tight',Inter,sans-serif;

  letter-spacing:-.01em;

  color:#0f172a;

}

.ccl-proc-a9b3 .ccl-proc-step-info p{

  color:#4b5563;

}



/* Nav buttons: tiny style boost when active (you already have base rules) */

.ccl-proc-a9b3 .ccl-proc-step-trigger.ccl-proc-active{

  box-shadow:0 6px 18px rgba(11,92,255,.18);

}



/* Mobile tightening */

@media (max-width:768px){

  .ccl-proc-a9b3 .ccl-proc-process-title{font-size:28px}

  .ccl-proc-a9b3 .ccl-proc-step-info h2{font-size:18px}

}



/* ----------------------------------------

   4.12 Comparison Section

   ---------------------------------------- */



.ccl-comparison-section {

	padding: 80px 0;

	position: relative;

}



.ccl-comparison-section::before {

	content: '';

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	height: 1px;

	background: linear-gradient(90deg, transparent, #e2e8f0, transparent);

}



.ccl-comparison-header {

	margin: 85px 0 20px;

	max-width: 800px;

}



.ccl-comparison-badge {

	display: inline-block;

	padding: 8px 16px;

	background: linear-gradient(135deg, #0b5cff, #1d4ed8);

	color: #fff;

	font-size: 14px;

	font-weight: 700;

	border-radius: 20px;

	text-transform: uppercase;

	letter-spacing: 0.5px;

	box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

	margin-bottom: 20px;

}



.ccl-comparison-title {

	font: 800 42px/1.1 "Inter Tight", Inter, sans-serif;

	color: #0f172a;

	margin: 0 0 16px;

	letter-spacing: -0.02em;

}



.ccl-comparison-title .ccl-highlight {

	background: linear-gradient(135deg, #0b5cff, #1d4ed8);

	-webkit-background-clip: text;

	-webkit-text-fill-color: transparent;

}



.ccl-comparison-subtitle {

	font-size: 18px;

	line-height: 1.6;

	color: #64748b;

	max-width: 800px;

}



.ccl-comparison-cards-grid {

	display: grid;

	grid-template-columns: 1fr 400px;

	gap: 30px;

	margin-top: 60px;

	margin-bottom: 60px;

}



.ccl-comparison-card.ccl-featured {

	background: #fff;

	border: 1px solid #e2e8f0;

	border-radius: 16px;

	overflow: hidden;

	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);

	position: relative;

	display: flex;

	flex-direction: column;

}



.ccl-comparison-card.ccl-featured::before {

	content: '';

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	height: 4px;

	background: linear-gradient(90deg, #0b5cff, #1d4ed8);

}



.ccl-card-content-wrapper {

	flex-grow: 1;

}



.ccl-card-header {

	padding: 30px 30px 20px;

	border-bottom: 1px solid #f1f5f9;

	display: flex;

	justify-content: space-between;

	align-items: flex-start;

	gap: 20px;

}



.ccl-provider-info {

	flex: 1;

}



.ccl-provider-logo img {

	height: 40px;

	width: auto;

	margin-bottom: 12px;

}



.ccl-provider-tags {

	display: flex;

	gap: 8px;

	flex-wrap: wrap;

}



.ccl-tag {

	padding: 6px 12px;

	border-radius: 6px;

	font-size: 12px;

	font-weight: 700;

	text-transform: uppercase;

	letter-spacing: 0.5px;

}



.ccl-tag.ccl-primary {

	background: #dbeafe;

	color: #1e40af;

}



.ccl-tag.ccl-success {

	background: #dcfce7;

	color: #166534;

}



.ccl-provider-rating {

	text-align: right;

}



.ccl-stars {

	color: #f59e0b;

	font-size: 16px;

	margin-bottom: 4px;

}



.ccl-rating-text {

	font-size: 12px;

	color: #64748b;

	font-weight: 600;

}



.ccl-card-features {

	padding: 0 30px;

}



.ccl-feature-category {

	margin: 30px 0;

}



.ccl-feature-category h4 {

	font: 700 18px/1.3 "Inter Tight", Inter, sans-serif;

	color: #0f172a;

	margin: 0 0 16px;

	padding-bottom: 8px;

	border-bottom: 2px solid #f1f5f9;

}



.ccl-features-list {

	display: flex;

	flex-direction: column;

	gap: 12px;

}



.ccl-feature-item {

	display: flex;

	align-items: flex-start;

	gap: 12px;

	padding: 16px;

	border-radius: 8px;

	transition: background-color 0.2s ease;

}



.ccl-feature-item:hover {

	background: #f8fafc;

}



.ccl-feature-item i {

	margin-top: 2px;

	flex-shrink: 0;

}



.ccl-feature-item.ccl-success i {

	color: #059669;

}



.ccl-feature-content {

	flex: 1;

}



.ccl-feature-content strong {

	display: block;

	font-weight: 700;

	color: #0f172a;

	margin-bottom: 4px;

}



.ccl-feature-content span {

	font-size: 14px;

	color: #64748b;

	line-height: 1.4;

}



.ccl-card-cta {

	padding: 20px 30px;

	margin-top: auto;

	background: #f8fafc;

	border-top: 1px solid #f1f5f9;

	text-align: center;

}



.ccl-card-cta .ccl-btn {

	width: auto;

	justify-content: center;

}



.ccl-btn {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 12px 24px;

	border-radius: 8px;

	font-weight: 700;

	text-decoration: none;

	transition: all 0.3s ease;

	border: none;

	cursor: pointer;

}



.ccl-btn-primary {

	background: #0b5cff;

	color: #fff;

}



.ccl-btn-primary:hover {

	background: #0846c1;

	transform: translateY(-2px);

	box-shadow: 0 8px 20px rgba(11, 92, 255, 0.4);

}



.ccl-btn-secondary {

	background: transparent;

	color: #fff;

	border: 1px solid #334155;

	justify-content: center;

}



.ccl-btn-secondary:hover {

	background: #334155;

	border-color: #475569;

}



.ccl-btn-large {

	padding: 16px 24px;

	font-size: 16px;

}



.ccl-comparison-options {

	display: flex;

	flex-direction: column;

	gap: 20px;

}



.ccl-option-card {

	background: #fff;

	border: 1px solid #e2e8f0;

	border-radius: 12px;

	padding: 24px;

	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);

}



.ccl-option-header {

	display: flex;

	justify-content: space-between;

	align-items: center;

	margin-bottom: 20px;

	padding-bottom: 16px;

	border-bottom: 1px solid #f1f5f9;

}



.ccl-option-header h4 {

	font: 700 18px/1.3 "Inter Tight", Inter, sans-serif;

	color: #0f172a;

	margin: 0;

}



.ccl-option-tag {

	padding: 4px 8px;

	border-radius: 6px;

	font-size: 11px;

	font-weight: 700;

	text-transform: uppercase;

	letter-spacing: 0.5px;

}



.ccl-option-tag.ccl-variable {

	background: #f8fafc;

	color: #475569;

	border: 1px solid #e2e8f0;

}



.ccl-option-tag.ccl-limited {

	background: #fffbeb;

	color: #d97706;

	border: 1px solid #fde68a;

}



.ccl-option-features {

	display: flex;

	flex-direction: column;

	gap: 12px;

	margin-bottom: 20px;

}



.ccl-feature-status {

	display: flex;

	align-items: center;

	gap: 8px;

	font-size: 14px;

	color: #64748b;

}



.ccl-feature-status.ccl-variable i {

	color: #94a3b8;

}



.ccl-feature-status.ccl-success i {

	color: #059669;

}



.ccl-feature-status.ccl-limited i {

	color: #d97706;

}



.ccl-option-risks h5 {

	font: 700 14px/1.3 "Inter Tight", Inter, sans-serif;

	color: #dc2626;

	margin: 0 0 8px;

}



.ccl-option-risks ul {

	margin: 0;

	padding-left: 16px;

	color: #64748b;

	font-size: 14px;

}



.ccl-option-risks li {

	margin-bottom: 4px;

}



.ccl-comparison-cta-section {

	background: linear-gradient(135deg, #0f172a, #1e293b);

	border-radius: 16px;

	padding: 50px;

	margin-bottom: 40px;

	color: #fff;

	text-align: center;

}



.ccl-cta-content {

	margin: 0 auto;

	display: grid;

	grid-template-columns: 1fr auto;

	gap: 40px;

	align-items: center;

}



.ccl-cta-text {

	text-align: left;

}



.ccl-cta-badge {

	display: inline-block;

	padding: 6px 12px;

	background: rgba(11, 92, 255, 0.2);

	color: #60a5fa;

	font-size: 12px;

	font-weight: 700;

	border-radius: 6px;

	margin-bottom: 12px;

	text-transform: uppercase;

	letter-spacing: 0.5px;

}



.ccl-cta-text h3 {

	font: 800 32px/1.2 "Inter Tight", Inter, sans-serif;

	color: #fff;

	margin: 0 0 12px;

}



.ccl-cta-text p {

	font-size: 16px;

	line-height: 1.6;

	color: #cbd5e1;

	margin: 0 0 20px;

}



.ccl-cta-benefits {

	display: flex;

	gap: 16px;

	flex-wrap: wrap;

}



.ccl-benefit {

	display: flex;

	align-items: center;

	gap: 8px;

	font-size: 14px;

	color: #e2e8f0;

}



.ccl-benefit i {

	color: #0b5cff;

}



.ccl-cta-actions {

	display: flex;

	flex-direction: column;

	gap: 12px;

	min-width: 280px;

}



.ccl-cta-note {

	margin-top: 8px;

}



.ccl-cta-note small {

	color: #94a3b8;

	font-size: 12px;

}



.ccl-legal-notes {

	border: 1px solid #e2e8f0;

	border-radius: 12px;

	overflow: hidden;

	background: #fff;

}



.ccl-legal-notes summary {

	padding: 20px 24px;

	background: #f8fafc;

	cursor: pointer;

	list-style: none;

	display: flex;

	justify-content: space-between;

	align-items: center;

	font-weight: 700;

	color: #0f172a;

	transition: background-color 0.2s ease;

}



.ccl-legal-notes summary:hover {

	background: #f1f5f9;

}



.ccl-legal-notes summary::-webkit-details-marker {

	display: none;

}



.ccl-legal-notes[open] summary i {

	transform: rotate(180deg);

}



.ccl-legal-notes summary i {

	transition: transform 0.3s ease;

}



.ccl-notes-content {

	padding: 24px;

}



.ccl-notes-grid {

	display: grid;

	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

	gap: 20px;

}



.ccl-note-item h5 {

	font: 700 14px/1.3 "Inter Tight", Inter, sans-serif;

	color: #0f172a;

	margin: 0 0 8px;

	text-transform: uppercase;

	letter-spacing: 0.5px;

}



.ccl-note-item p {

	font-size: 14px;

	line-height: 1.5;

	color: #64748b;

	margin: 0;

}

/* ===== Comparison CTA panel polish ===== */

.ccl-comparison-cta-section .ccl-cta-actions .ccl-btn {

  width: 100%;

  min-height: 52px;

  justify-content: center;

  font-weight: 800;

  letter-spacing: .01em;

}



/* Ghost button: stronger contrast on dark panel */

.ccl-comparison-cta-section .ccl-btn.ccl-btn-secondary {

  background: rgba(255,255,255,.06);

  color: #eaf2ff;

  border: 1px solid rgba(255,255,255,.18);

}

.ccl-comparison-cta-section .ccl-btn.ccl-btn-secondary:hover {

  background: rgba(255,255,255,.12);

  border-color: rgba(255,255,255,.28);

}



/* Primary stays brand but matches height */

.ccl-comparison-cta-section .ccl-btn.ccl-btn-primary {

  min-height: 52px;

}



/* Tighten spacing below the buttons copy line */

.ccl-comparison-cta-section .ccl-cta-note small {

  color: #94a3b8;

}



/* Mobile: keep the big primary then the call */

@media (max-width: 720px) {

  .ccl-comparison-cta-section .ccl-cta-actions .ccl-btn { min-height: 50px; }

}

/* Comparison header polish */

.ccl-comparison-header{

  text-wrap: balance;

}



/* keep the title tight and readable on two lines where possible */

.ccl-comparison-title{

  margin: 0 0 10px;                /* a touch tighter than default */

  text-wrap: balance;

}



/* underline the highlighted phrase for extra emphasis (brand-blue sweep) */

.ccl-comparison-title .ccl-highlight{

  position: relative;

  -webkit-text-fill-color: transparent;

  background: linear-gradient(135deg, var(--cta), #1d4ed8);

  -webkit-background-clip: text;

  background-clip: text;

}

.ccl-comparison-title .ccl-highlight::after{

  content:"";

  position: absolute; left: 0; right: 0; bottom: -6px;

  height: 6px; border-radius: 6px;

  background: linear-gradient(90deg, rgba(11,92,255,.18), rgba(11,92,255,.30));

}



/* subtitle: slightly cooler tone and comfortable measure */

.ccl-comparison-subtitle{

  color: #475569;                  /* a bit stronger than #64748b */

  max-width: 68ch;

  text-wrap: pretty;

}



/* badge: keep but add a subtle hover for cursor hints on desktop */

.ccl-comparison-badge{

  cursor: default;

}

@media (max-width: 640px){

  .ccl-comparison-title .ccl-highlight::after{ height: 5px; bottom: -5px; }

}

/* Subtle footer CTA under option cards */

.ccl-option-foot{

  margin-top: 12px;

  padding-top: 12px;

  border-top: 1px solid #f1f5f9;

  display: flex;

  gap: 12px;

  flex-wrap: wrap;

}



.ccl-ghost-link{

  display: inline-flex;

  align-items: center;

  gap: 6px;

  padding: 6px 8px;

  border-radius: 8px;

  color: var(--cta);

  font-weight: 800;

  text-decoration: none;

  transition: background .15s ease, color .15s ease;

}



.ccl-ghost-link:hover{

  background: #f8faff;

  color: var(--cta-dark);

}



.ccl-ghost-link i{ font-size: 0.95em; }



/* ----------------------------------------

   4.13 Case Results (CRV)

   ---------------------------------------- */



.crv-section {

	background: var(--dark-section-bg, #0f172a);

	color: #fff;

	padding-top: 85px;

	position: relative;

	min-height: 100vh;

}



.crv-section::before {

	content: "";

	position: absolute;

	inset: 0;

	background-image: url("https://tpdclaimslawyers.com.au/wp-content/uploads/2022/11/bg-sv.png");

	background-position: bottom right;

	background-repeat: no-repeat;

	background-size: 400px auto;

	opacity: 0.15;

	z-index: 1;

}



.crv-container {

	position: relative;

	z-index: 2;

	max-width: 1200px;

	margin: 0 auto;

	padding: 0 20px;

}



.crv-hero {

	border-bottom: 1px solid rgba(255, 255, 255, 0.1);

	padding: 0 0 50px;

	text-align: center;

}



.crv-hero__grid {

	display: grid;

	gap: 24px;

	align-items: center;

	justify-items: center;

}



.crv-hero__lockup {

	max-width: 820px;

}



.crv-hero__title--prime {

	font-size: clamp(36px, 5vw, 54px);

	line-height: 1.08;

	font-weight: 800;

	letter-spacing: -0.015em;

	margin: 0 0 25px;

	color: #fff;

}



.crv-title-period {

	color: var(--cta, #0b5cff);

	position: relative;

	top: -1px;

}



.crv-title-accent {

	background: linear-gradient(90deg, #cfe0ff 0%, #ffffff 60%, #cfe0ff 100%);

	-webkit-background-clip: text;

	background-clip: text;

	color: transparent;

}



.crv-title-accent--underline {

	position: relative;

	white-space: nowrap;

}



.crv-title-accent--underline::after {

	content: "";

	position: absolute;

	left: 0;

	right: 0;

	bottom: -6px;

	height: 6px;

	border-radius: 999px;

	background: linear-gradient(90deg, rgba(29, 194, 239, 0) 0%, rgba(29, 194, 239, 0.65) 35%, rgba(29, 99, 255, 0.85) 65%, rgba(29, 194, 239, 0) 100%);

	filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.25));

	transform: scaleX(0.85);

	opacity: 0.95;

	animation: crvTitleSweep 1.4s ease 0.15s both;

}



@keyframes crvTitleSweep {

	0% {

		transform: scaleX(0.1);

		opacity: 0;

	}

	60% {

		transform: scaleX(1.05);

		opacity: 1;

	}

	100% {

		transform: scaleX(0.98);

		opacity: 0.95;

	}

}



.crv-hero__sublead {

	margin: 6px 0 14px;

	font-size: clamp(16px, 1.6vw, 18px);

	color: rgba(255, 255, 255, 0.82);

}



.crv-title-meta {

	display: flex;

	flex-wrap: wrap;

	gap: 8px;

	margin: 0;

	padding: 0;

	list-style: none;

	justify-content: center;

}



.crv-title-chip {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 8px 10px;

	border-radius: 999px;

	font-size: 13px;

	font-weight: 600;

	color: #fff;

	background: rgba(255, 255, 255, 0.08);

	border: 1px solid rgba(255, 255, 255, 0.18);

}



.crv-pill {

	display: inline-block;

	padding: 6px 12px;

	border-radius: 999px;

	font-size: 12px;

	font-weight: 700;

	letter-spacing: 0.6px;

	text-transform: uppercase;

	line-height: 1;

	border: 1px solid rgba(255, 255, 255, 0.25);

	background: rgba(255, 255, 255, 0.08);

	color: #fff;

	backdrop-filter: saturate(130%) blur(2px);

	margin-bottom: 14px;

}



.crv-grid {

	display: grid;

	gap: 32px;

	align-items: start;

	padding: 75px 0 25px;

	transition: filter 0.3s ease;

	position: relative;

	isolation: isolate;

}



.crv-sidebar {

	position: sticky;

	top: 20px;

}



.crv-sidebar__kicker {

	color: #8fb4ff;

	text-transform: uppercase;

	font-weight: 700;

	font-size: 13px;

	letter-spacing: 0.8px;

	margin: 0 0 10px;

}



.crv-sidebar__title {

	margin: 0 0 14px;

	font-size: clamp(20px, 2.5vw, 24px);

	font-weight: 800;

	line-height: 1.25;

	color: #fff;

}



.crv-sidebar__lede {

	margin: 0 0 12px;

	color: rgba(255, 255, 255, 0.88);

	font-size: 15px;

	line-height: 1.6;

}



.crv-filter-group {

	margin-bottom: 24px;

}



.crv-filter-group h3 {

	font: 700 16px/1.3 "Inter Tight", Inter, sans-serif;

	color: #cfe0ff;

	margin: 0 0 16px;

}



.crv-filter-buttons {

	display: flex;

	flex-direction: column;

	gap: 8px;

}



.crv-filter-btn {

	display: flex;

	align-items: center;

	gap: 8px;

	padding: 10px 14px;

	background: rgba(255, 255, 255, 0.08);

	border: 1px solid rgba(255, 255, 255, 0.18);

	border-radius: 8px;

	font-size: 14px;

	font-weight: 600;

	color: rgba(255, 255, 255, 0.9);

	cursor: pointer;

	transition: all 0.2s ease;

	text-align: left;

	width: 100%;

}



.crv-filter-btn:hover {

	border-color: #0b5cff;

	color: #0b5cff;

	background: rgba(11, 92, 255, 0.1);

}



.crv-filter-btn.is-active {

	background: #0b5cff;

	border-color: #0b5cff;

	color: #fff;

}



.crv-filter-icon {

	font-size: 16px;

}



.crv-filter-select {

	display: none;

	width: 100%;

	padding: 12px 16px;

	border: 1px solid rgba(255, 255, 255, 0.18);

	border-radius: 8px;

	font-size: 14px;

	margin-bottom: 16px;

	background: rgba(255, 255, 255, 0.08);

	color: #fff;

}



.crv-search-group {

	margin-bottom: 24px;

}



.crv-search-box {

	position: relative;

}



.crv-search-box svg {

	position: absolute;

	left: 12px;

	top: 50%;

	transform: translateY(-50%);

	width: 18px;

	height: 18px;

	color: rgba(255, 255, 255, 0.6);

}



.crv-search-box input {

	width: 100%;

	padding: 12px 16px 12px 40px;

	border: 1px solid rgba(255, 255, 255, 0.18);

	border-radius: 8px;

	font-size: 15px;

	transition: border-color 0.2s ease;

	background: rgba(255, 255, 255, 0.08);

	color: #fff;

}



.crv-search-box input::placeholder {

	color: rgba(255, 255, 255, 0.5);

}



.crv-search-box input:focus {

	outline: none;

	border-color: #0b5cff;

	box-shadow: 0 0 0 3px rgba(11, 92, 255, 0.2);

}



.crv-main {

	display: flex;

	flex-direction: column;

	gap: 24px;

}



.crv-toolbar {

	display: flex;

	justify-content: space-between;

	align-items: center;

	padding: 16px 0;

	border-bottom: 1px solid rgba(255, 255, 255, 0.1);

}



.crv-count {

	font-weight: 600;

	color: rgba(255, 255, 255, 0.9);

}



.crv-sort {

	display: flex;

	align-items: center;

	gap: 8px;

}



.crv-sort label {

	font-size: 14px;

	color: rgba(255, 255, 255, 0.7);

}



.crv-sort select {

	padding: 6px 12px;

	border: 1px solid rgba(255, 255, 255, 0.25);

	border-radius: 6px;

	font-size: 14px;

	background: #0f172a;

	color: #e5edff;

	color-scheme: dark;

}



.crv-sort select:focus {

	outline: none;

	border-color: #0b5cff;

	box-shadow: 0 0 0 3px rgba(11, 92, 255, 0.25);

}



.crv-sort select option {

	background: #0f172a;

	color: #e5edff;

}



.crv-cases {

	display: grid;

	grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));

	gap: 24px;

	margin-bottom: 40px;

}



.crv-card {

	background: rgba(255, 255, 255, 0.1);

	border: 1px solid rgba(255, 255, 255, 0.15);

	border-radius: 12px;

	padding: 24px;

	transition: all 0.3s ease;

	position: relative;

	overflow: hidden;

	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);

}



.crv-card:hover {

	transform: translateY(-4px);

	box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);

	background: rgba(255, 255, 255, 0.12);

	border-color: rgba(255, 255, 255, 0.2);

}



.crv-card::before {

	content: "";

	position: absolute;

	top: 0;

	left: 0;

	width: 4px;

	height: 100%;

	background: #0b5cff;

	opacity: 0;

	transition: opacity 0.3s ease;

}



.crv-card:hover::before {

	opacity: 1;

}



.crv-header {

	display: flex;

	justify-content: space-between;

	align-items: center;

	margin-bottom: 12px;

}



.crv-badge {

	padding: 4px 10px;

	border-radius: 6px;

	font-size: 12px;

	font-weight: 700;

	text-transform: uppercase;

	letter-spacing: 0.5px;

}



.crv-badge--motor {

	background: rgba(59, 130, 246, 0.3);

	color: #93c5fd;

	border: 1px solid rgba(59, 130, 246, 0.4);

}



.crv-badge--work {

	background: rgba(245, 158, 11, 0.3);

	color: #fcd34d;

	border: 1px solid rgba(245, 158, 11, 0.4);

}



.crv-badge--medical {

	background: rgba(236, 72, 153, 0.3);

	color: #f9a8d4;

	border: 1px solid rgba(236, 72, 153, 0.4);

}



.crv-badge--public {

	background: rgba(16, 185, 129, 0.3);

	color: #6ee7b7;

	border: 1px solid rgba(16, 185, 129, 0.4);

}



.crv-status {

	font-size: 12px;

	font-weight: 600;

	color: #059669;

	background: rgba(16, 185, 129, 0.2);

	padding: 4px 8px;

	border-radius: 6px;

}



.crv-title {

	font: 700 18px/1.3 "Inter Tight", Inter, sans-serif;

	color: #fff;

	margin: 0 0 12px;

}



.crv-desc {

	font-size: 14px;

	line-height: 1.5;

	color: rgba(255, 255, 255, 0.8);

	margin: 0 0 16px;

}



.crv-details {

	display: flex;

	flex-direction: column;

	gap: 8px;

	margin-bottom: 16px;

	padding: 12px;

	background: rgba(255, 255, 255, 0.08);

	border-radius: 6px;

}



.crv-detail-item {

	display: flex;

	justify-content: space-between;

	font-size: 13px;

}



.crv-detail-label {

	font-weight: 600;

	color: rgba(255, 255, 255, 0.9);

}



.crv-detail-value {

	color: rgba(255, 255, 255, 0.8);

	text-align: right;

}



.crv-payout {

	display: flex;

	align-items: center;

	gap: 8px;

	margin-bottom: 16px;

	padding: 8px 0;

	border-top: 1px dashed rgba(255, 255, 255, 0.2);

	border-bottom: 1px dashed rgba(255, 255, 255, 0.2);

}



.crv-payout-amount {

	font: 800 20px/1 "Inter Tight", Inter, sans-serif;

	color: #10b981;

}



.crv-payout-label {

	font-size: 12px;

	color: rgba(255, 255, 255, 0.6);

	font-weight: 600;

}



.crv-actions {

	display: flex;

	justify-content: flex-end;

	align-items: center;

	gap: 12px;

}



.crv-btn {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 10px 16px;

	border-radius: 8px;

	font-size: 14px;

	font-weight: 600;

	text-decoration: none;

	cursor: pointer;

	border: none;

	transition: all 0.2s ease;

}



.crv-btn--cta {

	background: #0b5cff;

	color: #fff;

}



.crv-btn--cta:hover {

	background: #0047d6;

}



.crv-btn--dark {

	background: rgba(255, 255, 255, 0.1);

	color: #fff;

	border: 1px solid rgba(255, 255, 255, 0.2);

}



.crv-btn--dark:hover {

	background: rgba(255, 255, 255, 0.15);

}



.crv-btn--sm {

	padding: 8px 12px;

	font-size: 13px;

}



.crv-btn--lg {

	padding: 14px 28px;

	font-size: 16px;

	font-weight: 700;

}



.crv-load {

	text-align: center;

	padding: 20px 0 40px;

}



/* State Gate */

.crv-gate {

	position: absolute;

	inset: 0;

	display: flex;

	align-items: center;

	justify-content: center;

	z-index: 10;

}



.crv-gate__panel {

	background: rgba(0, 0, 0, 0.5);

	border: 1px solid rgba(255, 255, 255, 0.2);

	border-radius: 16px;

	padding: 40px;

	max-width: 500px;

	width: 90%;

	color: #fff;

	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);

	backdrop-filter: blur(10px);

}



.crv-gate__title {

	font-size: 32px;

	font-weight: 800;

	margin: 0 0 20px;

	text-align: center;

	color: #fff;

}



.crv-gate__notice {

	font-size: 16px;

	color: rgba(255, 255, 255, 0.9);

	margin: 0 0 16px;

	text-align: center;

	background: rgba(255, 255, 255, 0.1);

	padding: 12px;

	border-radius: 8px;

}



.crv-gate__label {

	display: block;

	font-size: 16px;

	font-weight: 600;

	margin: 0 0 12px;

	color: rgba(255, 255, 255, 0.9);

}



.crv-gate__select {

	width: 100%;

	padding: 14px 16px;

	border: 1px solid rgba(255, 255, 255, 0.3);

	border-radius: 8px;

	font-size: 16px;

	background: rgba(255, 255, 255, 0.1);

	color: #fff;

	margin-bottom: 20px;

	color-scheme: dark;

}



.crv-gate__select option {

	background: #0f172a;

	color: #fff;

}



.crv-gate__extra {

	margin-top: 20px;

	padding-top: 20px;

	border-top: 1px solid rgba(255, 255, 255, 0.2);

}



.crv-gate__line {

	font-size: 18px;

	font-weight: 600;

	margin: 0 0 16px;

	text-align: center;

	color: #8fb4ff;

}



.crv-gate__q {

	font-size: 16px;

	color: rgba(255, 255, 255, 0.9);

	margin: 0 0 16px;

	text-align: center;

}



.crv-gate__radios {

	display: flex;

	gap: 20px;

	justify-content: center;

	margin-bottom: 20px;

}



.crv-radio {

	display: flex;

	align-items: center;

	gap: 8px;

	cursor: pointer;

	font-weight: 600;

}



.crv-radio input {

	width: 18px;

	height: 18px;

}



.crv-gate__error {

	display: block;

	color: #f87171;

	font-size: 14px;

	margin-top: 8px;

	text-align: center;

}



.crv-gate__actions {

	display: flex;

	flex-direction: column;

	gap: 12px;

	margin-top: 24px;

}



.crv-gate__continue {

	background: #0b5cff;

	color: #fff;

	border: none;

	padding: 14px 24px;

	border-radius: 8px;

	font-size: 16px;

	font-weight: 700;

	cursor: pointer;

	transition: background 0.2s ease;

}



.crv-gate__continue:hover {

	background: #0047d6;

}



.crv-gate__cancel {

	color: rgba(255, 255, 255, 0.7);

	text-align: center;

	text-decoration: none;

	font-size: 14px;

}



.crv-gate__cancel:hover {

	color: #fff;

}



.crv-section.crv-is-gated .crv-grid>*:not(.crv-gate) {

	filter: blur(6px);

	pointer-events: none;

	user-select: none;

}

/* ----------------------------------------

   4.14 Testimonials (LSX)

   ---------------------------------------- */

   

	.lsx-testimonials {      --primary:#0b5cff;

	  --primary-dark:#0047d4;

	  --ink:#0f172a;

	  --muted:#6b7280;

	  --line:#e5e7eb;

	  --radius:16px;

	  --shadow:0 10px 25px -5px rgba(0,0,0,.08);

	--shadow-lg:0 20px 40px -10px rgba(0,0,0,.12);}

	.lsx-testimonials{padding:80px 0 48px;}

	.lsx-container{max-width: 1400px;margin:0 auto;padding:0 24px}

	.lsx-section-head{text-align:center;margin-bottom:32px}

	.lsx-eyebrow{

	  display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:#1d4ed8;

	  background:#eff6ff;border:1px solid #dbeafe;border-radius:999px;padding:7px 12px;font-weight:700;margin-bottom:12px;letter-spacing:.02em

	}

	.lsx-section-title{

	  margin:0 0 8px;font-weight:800;font-size:clamp(30px,5vw,46px);line-height:1.08;letter-spacing:-.02em

	}

	.lsx-section-title .lsx-accent{position:relative;display:inline-block}

	.lsx-section-title .lsx-accent::after{

	  content:"";position:absolute;left:0;right:0;bottom:-8px;height:10px;border-radius:8px;

	  background:linear-gradient(90deg,rgba(11,92,255,.20),rgba(11,92,255,0))

	}

	.lsx-section-subtitle{color:var(--muted);font-size:16px;max-width:640px;margin:8px auto 0}

	.lsx-ratings{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:18px;color:var(--muted);font-size:15px}

	.lsx-rating-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:700;box-shadow:var(--shadow)}

	.lsx-stars{color:#f59e0b;display:inline-flex;gap:2px}



	/* CAROUSEL */

	.lsx-carousel-container{position:relative;margin-top:28px}

	.lsx-carousel{position:relative;overflow:hidden;border-radius:var(--radius)}

	.lsx-carousel-track{display:flex;transition:transform .5s cubic-bezier(.25,.46,.45,.94);will-change:transform}



	.lsx-carousel-slide{flex:0 0 33.333%;padding:14px;transition:opacity .28s ease, transform .28s ease;opacity:.55;transform:translateY(4px) scale(.985)}

	.lsx-carousel-slide.is-active{opacity:1;transform:translateY(0) scale(1)}



	/* Card */

	.lsx-testimonial-card{

	  position:relative;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);

	  padding:26px;box-shadow:var(--shadow);transition:transform .3s ease, box-shadow .3s ease;overflow:hidden;

	  background-clip:padding-box; /* border curves cleanly */

	}

	.lsx-testimonial-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}

	.lsx-testimonial-card::before{

	  content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--primary),var(--primary-dark));

	  border-top-left-radius:inherit;border-top-right-radius:inherit;pointer-events:none;

	}

	.lsx-quote-mark{position:absolute;top:16px;right:20px;font-size:58px;line-height:1;color:#dbeafe;font-weight:800;opacity:.6}

	.lsx-client-info{display:flex;align-items:center;gap:14px;margin-bottom:12px}

	.lsx-client-avatar{width:52px;height:52px;border-radius:50%;border:2px solid var(--line);background:linear-gradient(135deg,#eef4ff,#fff);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--primary);letter-spacing:.5px}

	.lsx-client-name{font-weight:700}

	.lsx-client-meta{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:6px;margin-top:2px}

	.lsx-client-meta .fa-google{color:#4285f4}

	.lsx-testimonial-text{color:var(--muted);font-size:15.5px;line-height:1.75;margin-top:10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden}

	.lsx-testimonial-card.expanded .lsx-testimonial-text{-webkit-line-clamp:unset}

	.lsx-read-more{margin-top:12px;display:inline-flex;align-items:center;gap:8px;border:none;background:none;color:var(--primary);font-weight:700;font-size:13.5px;cursor:pointer}

	.lsx-read-more .lsx-chevron{transition:transform .3s ease}

	.lsx-testimonial-card.expanded .lsx-read-more .lsx-chevron{transform:rotate(180deg)}

	.lsx-testimonial-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}

	.lsx-review-source{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}

	.lsx-google-logo{width:16px;height:16px}

	.lsx-review-stars{color:#f59e0b;display:flex;gap:2px}



	/* NAV */

	.lsx-carousel-nav{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:24px}

	.lsx-carousel-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;box-shadow:var(--shadow)}

	.lsx-carousel-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:translateY(-2px)}

	.lsx-carousel-btn:disabled{opacity:.4;cursor:not-allowed;background:#fff;color:inherit;border-color:var(--line);transform:none}



	/* Blue line pagination */

	.lsx-progress-pagination{display:flex;align-items:center;gap:12px}

	.lsx-pagination-counter{font-size:14px;color:var(--muted);min-width:56px;text-align:center}

	.lsx-progress-bars{display:flex;align-items:center;gap:6px}

	.lsx-progress-seg{width:34px;height:4px;border-radius:999px;background:rgba(11,92,255,.22);transition:width .2s ease, background .2s ease}

	.lsx-progress-seg.active{background:var(--primary);width:46px}



	/* MINI COOL DIVIDER */

	.lsx-mini-divider{

	  display:flex;align-items:center;gap:12px;justify-content:center;

	  margin:26px auto 16px; max-width:760px; padding:0 8px;

	}

	.lsx-mini-divider::before,

	.lsx-mini-divider::after{

	  content:"";flex:1;height:1px;

	  background:linear-gradient(90deg, rgba(11,92,255,0), rgba(11,92,255,.35));

	}

	.lsx-mini-divider::after{

	  background:linear-gradient(270deg, rgba(11,92,255,0), rgba(11,92,255,.35));

	}

	.lsx-mini-divider .lsx-dot{

	  width:10px;height:10px;border-radius:999px;

	  background:linear-gradient(135deg,var(--primary),var(--primary-dark));

	  box-shadow:0 0 0 4px rgba(11,92,255,.08);

	}



	.lsx-section-cta{text-align:center;margin-top:35px}

	.lsx-btn{

	  display:inline-flex;align-items:center;gap:8px;

	  background:var(--primary);color:#fff;border:1px solid transparent;

	  padding:12px 22px;font-weight:700;border-radius:12px;text-decoration:none;transition:all .2s;

	  box-shadow:0 6px 16px rgba(11,92,255,.25)

	}

	.lsx-btn:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 10px 22px rgba(11,92,255,.32)}



	/* MOBILE OPTIMISATIONS */

	@media (max-width:1024px){ .lsx-carousel-slide{flex:0 0 50%} }

	@media (max-width:768px){

	  .lsx-testimonials{padding:64px 0 36px}

	  .lsx-section-head{margin-bottom:22px}

	  .lsx-carousel-slide{flex:0 0 100%}

	  .lsx-testimonial-card{padding:22px}

	  .lsx-quote-mark{font-size:52px}

	  .lsx-progress-seg{width:28px;height:5px}

	  .lsx-progress-seg.active{width:40px}

	}



	/* a11y */

	.lsx-carousel-btn:focus-visible,.lsx-read-more:focus-visible,.lsx-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

	@media (prefers-reduced-motion:reduce){ .lsx-carousel-track,.lsx-testimonial-card,.lsx-carousel-btn,.lsx-read-more .lsx-chevron,.lsx-btn{transition:none} }

	/* Testimonial card tweaks (subtle) */

.lsx-testimonial-card{ padding:24px 24px 20px; }

.lsx-client-name{ font-weight:800; }

.lsx-client-meta{ color:#64748b; font-weight:600; }

.lsx-quote-mark{ color:#dbeafe; font-size:56px; line-height:1; opacity:.7; }



/* Read-more affordance a touch stronger */

.lsx-read-more{ color:var(--primary); }

.lsx-read-more:hover{ text-decoration:underline; }





	/* Section with requested gradient */

	.rhub-resources{

	  --rhub-primary:#0b5cff; --rhub-primary-dark:#0846c1;

	  --rhub-secondary:#ff6b6b; --rhub-accent:#00d4aa;

	  --rhub-media:#9333ea; --rhub-about:#f59e0b;

	  --rhub-ink:#0f172a; --rhub-soft:#f8fafc; --rhub-slate:#64748b; --rhub-line:#e2e8f0;

	  --rhub-shadow:0 8px 24px -8px rgba(2,6,23,.12);

	  --rhub-shadow-lg:0 20px 40px -12px rgba(2,6,23,.18);

	  --rhub-radius:16px;

	  padding:88px 0;

	  background: linear-gradient(135deg, #ffffff 0%, #f0f7ff 100%);

	  position:relative;overflow:hidden;

	}

	.rhub-container{max-width:1240px;margin:0 auto;padding:0 20px;position:relative;z-index:1}



	/* Header */

	.rhub-header{text-align:center;margin-bottom:48px}

	.rhub-badge{

	  display:inline-block;padding:8px 16px;border-radius:999px;background:#fff;border:1px solid var(--rhub-line);

	  font:700 12px/1 Inter;letter-spacing:.06em;text-transform:uppercase;color:var(--rhub-primary);margin-bottom:16px;

	  box-shadow:0 4px 12px rgba(11,92,255,.08);

	}

	.rhub-title{

	  font-family:"Inter Tight",Inter; font-weight:900; font-size:clamp(36px,4.8vw,52px);

	  line-height:1.06; letter-spacing:-.025em; text-wrap:balance; position:relative; display:block; margin:0 0 16px;

	}

	.rhub-title::after{

	  content:"";position:absolute;left:50%;bottom:-16px;height:4px;width:min(440px,72%);

	  border-radius:999px;transform:translateX(-50%) scaleX(0);transform-origin:left center;opacity:.95;

	  background: linear-gradient(90deg, var(--rhub-primary), var(--rhub-accent));

	  animation:rhub-uline .8s cubic-bezier(.2,.65,.3,1) .1s forwards;

	}

	@keyframes rhub-uline{to{transform:translateX(-50%) scaleX(1)}}

	.rhub-subtitle{font-size:18px;color:#475569;max-width:720px;margin:28px auto 0;line-height:1.6}



	/* Controls */

	.rhub-controls{

	  display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:6px auto 32px;align-items:center;width:100%;

	}

	.rhub-search-shell{position:relative;flex:1 1 360px;max-width:560px;width:100%}

	.rhub-search-shell i{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#94a3b8;z-index:2}

	.rhub-search{

	  display:block;width:100%;height:52px;padding:14px 16px 14px 42px;border:2px solid var(--rhub-line);border-radius:12px;background:#fff;font-size:15px;

	  transition:border-color .18s, box-shadow .18s; -webkit-appearance:none; appearance:none;

	}

	.rhub-search:focus{outline:none;border-color:var(--rhub-primary);box-shadow:0 0 0 3px rgba(11,92,255,.1)}



	/* Dropdown */

	.rhub-filter{position:relative}

	.rhub-filter-toggle{

	  display:flex;align-items:center;gap:8px;padding:14px 20px;border-radius:999px;background:#fff;border:2px solid var(--rhub-line);

	  font-weight:700;font-size:14px;color:#334155;cursor:pointer;transition:all .18s;white-space:nowrap

	}

	.rhub-filter-toggle:hover{border-color:var(--rhub-primary)}

	.rhub-filter-toggle i:last-child{transition:transform .2s}

	.rhub-filter-toggle.rhub-open i:last-child{transform:rotate(180deg)}

	.rhub-filter-menu{

	  position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border-radius:16px;padding:16px;box-shadow:var(--rhub-shadow-lg);

	  z-index:10;display:none;border:1px solid var(--rhub-line)

	}

	.rhub-filter-menu.rhub-open{display:block}

	.rhub-filter-options{display:flex;flex-direction:column;gap:12px}

	.rhub-filter-opt{display:flex;align-items:center;gap:10px;cursor:pointer;padding:8px 0;font-weight:600}

	.rhub-filter-opt:hover{color:var(--rhub-primary)}

	.rhub-filter-opt input{display:none}

	.rhub-checkbox{

	  width:18px;height:18px;border:2px solid var(--rhub-line);border-radius:4px;display:flex;align-items:center;justify-content:center;transition:.2s

	}

	.rhub-filter-opt input:checked + .rhub-checkbox{background:var(--rhub-primary);border-color:var(--rhub-primary)}

	.rhub-filter-opt input:checked + .rhub-checkbox::after{content:'✓';color:#fff;font-size:12px;font-weight:700}



	/* Grid */

	.rhub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px}

	@media (max-width:768px){.rhub-grid{grid-template-columns:1fr}}



	/* Featured */

	.rhub-feature{

	  grid-column:auto;border-radius:var(--rhub-radius);overflow:hidden;background:linear-gradient(135deg,var(--rhub-primary),var(--rhub-primary-dark));

	  color:#fff;border:1px solid rgba(255,255,255,.25);box-shadow:var(--rhub-shadow-lg);display:flex;flex-direction:column

	}

	.rhub-feature-body{padding:24px;display:flex;flex-direction:column;gap:12px;flex:1}

	.rhub-feature-badge{display:inline-block;padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.22);font-weight:800;font-size:12px;letter-spacing:.04em;text-transform:uppercase;width:fit-content}

	.rhub-feature-title{font:700 22px/1.25 "Inter Tight",Inter}

	.rhub-feature-desc{font-size:15px;opacity:.95;line-height:1.5;flex:1}

	.rhub-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;border:1px solid transparent;font-weight:700;text-decoration:none;transition:transform .18s, box-shadow .18s}

	.rhub-btn--white{background:#fff;color:var(--rhub-primary);margin-top:8px}

	.rhub-btn--white:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,.12)}



	/* Cards */

	.rhub-card{

	  background:#fff;border:1px solid var(--rhub-line);border-radius:var(--rhub-radius);box-shadow:var(--rhub-shadow);

	  display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s,border-color .18s;position:relative;overflow:hidden

	}

	.rhub-card:hover{transform:translateY(-6px);box-shadow:var(--rhub-shadow-lg);border-color:rgba(11,92,255,.25)}

	.rhub-card::before{

	  content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--rhub-primary),var(--rhub-primary-dark));

	  border-top-left-radius:var(--rhub-radius);border-top-right-radius:var(--rhub-radius);pointer-events:none

	}

	.rhub-card[data-type="feeds"]::before{background:linear-gradient(90deg,var(--rhub-accent),#00b894)}

	.rhub-card[data-type="media"]::before{background:linear-gradient(90deg,var(--rhub-media),#7c3aed)}

	.rhub-card[data-type="about"]::before{background:linear-gradient(90deg,var(--rhub-about),#e67e22)}



	.rhub-card-head{padding:20px 20px 0;display:flex;justify-content:space-between;align-items:flex-start}

	.rhub-badge-type{padding:6px 12px;border-radius:999px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;border:1px solid currentColor;background:transparent}

	.rhub-badge-type.legal{color:var(--rhub-primary)}

	.rhub-badge-type.feeds{color:var(--rhub-accent)}

	.rhub-badge-type.media{color:var(--rhub-media)}

	.rhub-badge-type.about{color:var(--rhub-about)}

	.rhub-date{font-size:12.5px;color:#7b8a9f;font-weight:600}



	.rhub-card-body{padding:18px 20px 16px;flex-grow:1}

	.rhub-icon{

	  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:18px;

	  background:rgba(11,92,255,.08);color:var(--rhub-primary)

	}

	.rhub-icon.feeds{background:rgba(0,212,170,.1);color:var(--rhub-accent)}

	.rhub-icon.media{background:rgba(147,51,234,.1);color:var(--rhub-media)}

	.rhub-icon.about{background:rgba(245,158,11,.1);color:var(--rhub-about)}



	.rhub-h3{

	  font:700 18px/1.28 "Inter Tight",Inter;color:#0b1324;margin:0 0 8px;

	  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden

	}

	.rhub-desc{

	  font-size:14.5px;color:#6b7a90;margin:0 0 12px;line-height:1.5;font-weight:500;

	  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden

	}



	.rhub-meta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px}

	.rhub-meta-item{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#7b8a9f;font-weight:500}

	.rhub-meta-item i{color:var(--rhub-primary)}



	.rhub-card-foot{padding:0 20px 20px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--rhub-line);padding-top:16px}

	.rhub-link{font-size:14px;font-weight:700;color:var(--rhub-primary);text-decoration:none;display:flex;align-items:center;gap:8px;transition:gap .15s}

	.rhub-link:hover{gap:12px}



	.rhub-btn--outline{background:transparent;color:var(--rhub-primary);border:2px solid var(--rhub-line);padding:6px 12px;border-radius:999px;font-weight:700;cursor:pointer;transition:all .18s}

	.rhub-btn--outline:hover{border-color:var(--rhub-primary);transform:translateY(-1px)}

	.rhub-btn--outline.active{background:var(--rhub-primary);color:#fff;border-color:var(--rhub-primary)}

	.rhub-btn--outline.feeds{color:var(--rhub-accent);border-color:var(--rhub-accent)}

	.rhub-btn--outline.feeds.active{background:var(--rhub-accent);color:#fff;border-color:var(--rhub-accent)}

	.rhub-btn--outline.media{color:var(--rhub-media);border-color:var(--rhub-media)}

	.rhub-btn--outline.media.active{background:var(--rhub-media);color:#fff;border-color:var(--rhub-media)}

	.rhub-btn--outline.about{color:var(--rhub-about);border-color:var(--rhub-about)}

	.rhub-btn--outline.about.active{background:var(--rhub-about);color:#fff;border-color:var(--rhub-about)}



	.rhub-load{text-align:center;margin-top:48px}

	.rhub-btn--lg{padding:12px 24px;border:2px solid var(--rhub-line);background:#fff;color:var(--rhub-primary);border-radius:999px;font-weight:700;transition:all .18s}

	.rhub-btn--lg:hover{border-color:var(--rhub-primary);transform:translateY(-2px);box-shadow:0 8px 20px rgba(11,92,255,.12)}



	@media (max-width:768px){

	  .rhub-resources{padding:60px 0}

	  .rhub-title{font-size:32px}

	  .rhub-subtitle{font-size:16px}

	  .rhub-controls{flex-direction:column;align-items:stretch;gap:16px}

	  .rhub-search{height:48px}

	  .rhub-search-shell {flex: inherit;} /* keep this rule */

	  .rhub-filter-toggle{justify-content:center;padding:12px 16px}

	  .rhub-card{padding:16px}

	  .rhub-feature-body{padding:20px}

	  .rhub-feature-title{font-size:20px}

	}

	@media (max-width:480px){

	  .rhub-resources{padding:40px 0}

	  .rhub-title{font-size:28px}

	  .rhub-subtitle{font-size:15px}

	  .rhub-search{font-size:16px} /* prevent iOS zoom */

	}



/* ----------------------------------------

   4.15 Intake Wizard (CCL-CF)

   ---------------------------------------- */



/* ================================

   4.15.0  Root Vars & Base

   ================================ */

#ccl-cf-intake-root{

  /* Palette */

  --primary:#2563eb; --primary-dark:#1d4ed8; --primary-light:#eff6ff;

  --secondary:#7c3aed; --accent:#06b6d4;

  --success:#22c55e; --warning:#facc15; --error:#ef4444;



  /* Surfaces & ink */

  --bg-primary:#ffffff; --bg-secondary:#ffffff; --bg-tertiary:#f8fafc;

  --text-primary:#1e293b; --text-secondary:#475569; --text-tertiary:#64748b; --text-light:#94a3b8;



  /* Lines & effects */

  --border-light:#e2e8f0; --border-medium:#cbd5e1; --border-dark:#94a3b8;

  --shadow-sm:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.03);

  --shadow-md:0 4px 6px rgba(0,0,0,.10),0 2px 4px rgba(0,0,0,.05);

  --shadow-lg:0 10px 15px rgba(0,0,0,.10),0 4px 6px rgba(0,0,0,.05);

  --shadow-xl:0 20px 25px rgba(0,0,0,.10),0 10px 10px rgba(0,0,0,.04);

  --radius-sm:6px; --radius-md:10px; --radius-lg:14px; --radius-xl:20px; --radius-full:9999px;

  --transition:all .25s ease-in-out;

  --focus-ring:0 0 0 4px rgba(37,99,235,.15);

  --gradient-primary:linear-gradient(90deg,var(--primary),var(--secondary));



  color:var(--text-primary);

  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif;

  line-height:1.6; font-weight:400;

  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;

}



/* ================================

   4.15.1  Layout

   ================================ */

.ccl-cf-wrap{position:relative;min-height:100vh;padding:100px 0 150px;display:flex;align-items:flex-start;justify-content:center;}

.ccl-cf-wrap::before{content:"";position:absolute;inset:0;z-index:1;}

.ccl-cf-container{position:relative;z-index:2;max-width:1400px;margin:0 auto;padding:0 20px;width:100%;}

.ccl-cf-grid{display:grid;grid-template-columns:1fr 2.3fr;gap:40px;align-items:start;}

@media (max-width:991px){.ccl-switch--container .everest-forms .evf-frontend-grid.evf-grid-2 {width: 49% !important;flex: 0 0 49%!important;}
.ccl-switch--container .everest-forms .evf-frontend-grid.evf-grid-2:first-child {margin-right: 2%;} .ccl-cf-grid{grid-template-columns:1fr}.ccl-cf-sidebar{order:2;margin-top:24px;position:static}.ccl-cf-wizard{order:1}}

.ccl-cf-npnm {padding: 0px; margin: 0px;}



/* ================================

   4.15.2  Sidebar

   ================================ */

.ccl-cf-sidebar{position:sticky;top:20px;background:var(--bg-secondary);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-lg);border:1px solid var(--border-light);display:flex;flex-direction:column;gap:24px;}

.ccl-cf-kicker{color:var(--primary);text-transform:uppercase;font-weight:700;font-size:13px;letter-spacing:.8px;display:inline-block;padding:4px 10px;background:var(--primary-light);border-radius:var(--radius-full);}

.ccl-cf-h2{margin:0;font:800 clamp(24px,2.5vw,28px)/1.25 "Inter Tight",Inter,sans-serif;color:var(--text-primary);}

.ccl-cf-lede{margin:0;color:var(--text-secondary);font-size:16px;}



.ccl-cf-offices{display:flex;flex-direction:column;gap:20px;border-top:1px solid var(--border-light);padding-top:24px;}

.ccl-cf-office{display:flex;gap:16px;align-items:flex-start;}

.ccl-cf-office i{color:var(--primary);font-size:20px;padding-top:2px;}

.ccl-cf-office .ccl-cf-name{font-weight:600;color:var(--text-primary);margin:0 0 4px;font-size:15px;}

.ccl-cf-office .ccl-cf-addr{color:var(--text-secondary);font-size:14px;}

.ccl-cf-office .ccl-cf-phone{color:var(--primary);text-decoration:none;font-weight:700;font-size:17px;transition:var(--transition);}

.ccl-cf-office .ccl-cf-phone:hover{text-decoration:underline;color:var(--primary-dark);}



.ccl-cf-progress-side{margin-top:8px;padding-top:24px;border-top:1px solid rgba(255, 255, 255, .18);}

.ccl-cf-bar{height:8px;background:var(--border-light);border-radius:var(--radius-full);overflow:hidden;margin:12px 0 16px;}

.ccl-cf-bar>span{display:block;height:100%;width:0;background:var(--gradient-primary);transition:width .3s ease;border-radius:var(--radius-full);}

.ccl-cf-mini{list-style:none;display:flex;justify-content:space-between;gap:6px;color:var(--text-tertiary);font-size:14px;font-weight:500;padding:0;}

.ccl-cf-mini span{display:inline-grid;place-items:center;margin-right:5px;width:26px;height:26px;border-radius:50%;background:var(--bg-tertiary);font-weight:600;color:var(--text-secondary);font-size:13px;}

.ccl-cf-mini .ccl-cf-active span{background:var(--primary);color:#fff;}



/* ================================

   4.15.3  Wizard & Header

   ================================ */

.ccl-cf-wizard{background:var(--bg-secondary);border-radius:var(--radius-xl);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);border:1px solid var(--border-light);}

.ccl-cf-header{padding:32px;border-bottom:1px solid var(--border-light);background:linear-gradient(135deg,var(--primary-light) 0%,rgba(255,255,255,0) 100%);position:relative;overflow:hidden;}

.ccl-cf-header::before{content:"";position:absolute;top:-50%;right:-10%;width:200px;height:200px;background:radial-gradient(circle,rgba(37,99,235,.07) 0%,transparent 70%);border-radius:50%;}

.ccl-cf-header h1{margin:0 0 12px;font:800 clamp(30px,4vw,38px)/1.2 "Inter Tight",Inter,sans-serif;color:var(--text-primary);position:relative;z-index:2;}

.ccl-cf-header p{margin:0;color:var(--text-secondary);font-size:17px;position:relative;z-index:2;}

.ccl-cf-prog{height:6px;background:var(--border-light);border-radius:var(--radius-full);overflow:hidden;margin-top:20px;position:relative;z-index:2;}

.ccl-cf-prog>span{display:block;height:100%;width:0;background:var(--gradient-primary);transition:width .3s ease;border-radius:var(--radius-full);}



/* Steps (desktop) */

.ccl-cf-steps{display:flex;gap:12px;flex-wrap:wrap;padding:20px 24px;border-bottom:1px solid var(--border-light);background:var(--bg-tertiary);}

.ccl-cf-step{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:var(--radius-full);border:1px solid var(--border-light);background:var(--bg-secondary);color:var(--text-tertiary);cursor:pointer;font-size:15px;font-weight:500;transition:var(--transition);}

.ccl-cf-step .ccl-cf-n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--bg-tertiary);font-weight:600;font-size:13px;color:var(--text-secondary);}

.ccl-cf-step.ccl-cf-is-active{border-color:var(--primary);background:var(--primary-light);color:var(--primary);box-shadow:var(--shadow-sm);}

.ccl-cf-step.ccl-cf-is-active .ccl-cf-n{background:var(--primary);color:#fff;}

.ccl-cf-step.ccl-cf-is-done .ccl-cf-n{background:var(--success);color:#fff;}



/* ================================

   4.15.4  Sections & Typography

   ================================ */

.ccl-cf-content{padding:32px;background:var(--bg-tertiary);}

.ccl-cf-section{display:grid;gap:28px;}

.ccl-cf-section h3{margin:0 0 8px;font:700 24px/1.3 "Inter Tight",Inter,sans-serif;color:var(--text-primary);display:flex;align-items:center;gap:12px;}

.ccl-cf-section h3::before{content:"";display:block;width:6px;height:24px;background:var(--primary);border-radius:var(--radius-full);}



/* ================================

   4.15.5  Cards, Fields & Options

   ================================ */

.ccl-cf-form-section{position:relative;margin-bottom:32px;padding:28px;background:var(--bg-secondary);border-radius:var(--radius-lg);border:1px solid var(--border-light);box-shadow:var(--shadow-sm);transition:var(--transition);}

.ccl-cf-form-section:hover{box-shadow:var(--shadow-md);}

.ccl-cf-form-section h4{margin:0 0 20px;font-size:19px;font-weight:700;color:var(--text-primary);padding-bottom:12px;border-bottom:1px solid var(--border-light);display:flex;align-items:center;gap:10px;}

.ccl-cf-form-section h4::before{content:"";width:4px;height:20px;background:var(--accent);border-radius:var(--radius-full);}



.ccl-cf-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px;}

.ccl-cf-row:last-child{margin-bottom:0;}

@media (max-width:720px){.ccl-cf-row{grid-template-columns:1fr;}}



.ccl-cf-field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;}

.ccl-cf-label{font-size:15px;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:4px;}

.ccl-cf-req{color:var(--error);}



.ccl-cf-ctrl,.ccl-cf-select,.ccl-cf-txt{width:100%;min-height:52px;padding:12px 16px;border-radius:var(--radius-md);border:1px solid var(--border-light);background:var(--bg-tertiary);font-size:16px;color:var(--text-primary);transition:var(--transition);font-family:inherit;}

.ccl-cf-txt{min-height:130px;resize:vertical;}

.ccl-cf-ctrl:focus,.ccl-cf-select:focus,.ccl-cf-txt:focus{outline:none;border-color:var(--primary);background:var(--bg-secondary);box-shadow:var(--focus-ring);}

.ccl-cf-ctrl.ccl-cf-is-invalid,.ccl-cf-select.ccl-cf-is-invalid,.ccl-cf-txt.ccl-cf-is-invalid{border-color:var(--error);box-shadow:0 0 0 4px rgba(239,68,68,.1);}

.ccl-cf-ctrl::placeholder,.ccl-cf-txt::placeholder{color:var(--text-light);}



.ccl-cf-cond-card{border-left:4px solid var(--accent);background:var(--bg-tertiary);padding:20px;border-radius:var(--radius-md);}

.ccl-cf-opts{display:flex;flex-wrap:wrap;gap:10px;padding-top:4px;}

.ccl-cf-opts.ccl-cf-cols-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}

.ccl-cf-opts.ccl-cf-cols-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;}

.ccl-cf-opt{position:relative;width:100%;display:inline-flex;align-items:center;gap:10px;padding:14px 18px;border:1px solid var(--border-light);border-radius:var(--radius-md);background:var(--bg-primary);cursor:pointer;transition:var(--transition);font-size:15px;padding-right:40px;}

.ccl-cf-opt:hover{background:var(--bg-tertiary);border-color:var(--border-medium);}

.ccl-cf-opt input{accent-color:var(--primary);transform:scale(1.2);}

.ccl-cf-opt:has(input:checked){border-color:var(--primary);background:var(--primary-light);color:var(--primary);font-weight:600;}

.ccl-cf-opt:has(input:checked)::after{content:"✔";position:absolute;top:50%;right:14px;transform:translateY(-50%);font-size:18px;color:var(--primary);animation:ccl-cf-fadeIn .2s ease;}

@keyframes ccl-cf-fadeIn{from{opacity:0;transform:translateY(-50%) scale(.5)}to{opacity:1;transform:translateY(-50%) scale(1)}}



/* Validation */

.ccl-cf-error{display:none;font-size:13px;color:var(--error);margin-top:4px;font-weight:600;align-items:center;gap:6px;}

.ccl-cf-error::before{content:"⚠";font-size:14px;}

.ccl-cf-error.ccl-cf-is-visible{display:flex;}



/* Disclaimer & Actions */

.ccl-cf-disclaimer{padding:16px;background:rgba(250,204,21,.1);border-left:4px solid var(--warning);border-radius:var(--radius-md);margin:20px 0;}

.ccl-cf-disclaimer p{margin:0;color:#a16207;font-size:14px;}

.ccl-cf-actions{display:flex;gap:16px;justify-content:flex-end;margin-top:32px;border-top:1px solid var(--border-light);padding-top:24px;}



.ccl-cf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;border-radius:var(--radius-md);border:1px solid transparent;padding:0 28px;font-weight:700;cursor:pointer;transition:var(--transition);font-size:16px;text-decoration:none;}

.ccl-cf-btn--light{background:var(--bg-primary);color:var(--text-secondary);border-color:var(--border-light);}

.ccl-cf-btn--light:hover{background:var(--bg-tertiary);border-color:var(--border-medium);transform:translateY(-2px);box-shadow:var(--shadow-sm);}

.ccl-cf-btn--primary{background-image:var(--gradient-primary);color:#fff;border-color:transparent;box-shadow:var(--shadow-md);}

.ccl-cf-btn--primary:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:var(--shadow-lg);}

.ccl-cf-btn:active{transform:translateY(0);box-shadow:var(--shadow-sm);filter:brightness(.95);}

.ccl-cf-btn[disabled]{opacity:.6;cursor:not-allowed;transform:none;filter:none;box-shadow:none;}

.ccl-cf-spin{width:20px;height:20px;border:3px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:ccl-cf-spin .8s linear infinite;}

@keyframes ccl-cf-spin{to{transform:rotate(360deg)}}



/* Review */

.ccl-cf-review{display:grid;grid-template-columns:200px 1fr;gap:12px 16px;background:var(--bg-tertiary);padding:24px;border-radius:var(--radius-md);border:1px solid var(--border-light);}

.ccl-cf-review dt{font-weight:700;color:var(--text-primary);font-size:15px;}

.ccl-cf-review dd{margin:0;color:var(--text-secondary);word-break:break-word;font-size:15px;}

@media (max-width:600px){.ccl-cf-review{grid-template-columns:1fr}.ccl-cf-review dt{border-bottom:1px dashed var(--border-light);padding-bottom:4px;margin-bottom:4px}}



/* Success */

.ccl-cf-ok{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 40px;min-height:400px;text-align:center;background:var(--bg-secondary);border-radius:var(--radius-lg);}

.ccl-cf-ok .ccl-cf-ico{font-size:72px;color:var(--success);margin-bottom:20px;animation:ccl-cf-popIn .3s ease-out;}

@keyframes ccl-cf-popIn{0%{transform:scale(0);opacity:0}80%{transform:scale(1.2);opacity:1}100%{transform:scale(1)}}

.ccl-cf-ok h2{color:var(--success);margin:0 0 12px;font:800 32px/1.2 "Inter Tight",Inter,sans-serif;}

.ccl-cf-ok p{color:var(--text-secondary);margin-bottom:24px;font-size:17px;}



/* ================================

   4.15.6  Info & Toast

   ================================ */

.ccl-cf-info-tab{position:absolute;top:16px;right:16px;display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;border:1px solid var(--border-light);background:var(--bg-primary);color:var(--text-tertiary);font-weight:600;font-size:13px;cursor:pointer;transition:var(--transition);box-shadow:var(--shadow-sm);}

.ccl-cf-info-tab i{font-size:15px;color:var(--primary);}

.ccl-cf-info-tab:hover{background:var(--primary-light);border-color:var(--primary);color:var(--primary);transform:translateY(-1px);box-shadow:var(--shadow-md);}

.ccl-cf-info-panel{display:none;margin:16px 0 0;padding:16px;border-radius:var(--radius-md);border:1px solid var(--border-light);background:linear-gradient(180deg,#f0f6ff,#fff);color:var(--text-secondary);font-size:14px;line-height:1.6;will-change:height;}

.ccl-cf-info-panel.ccl-cf-show{display:block;}



.ccl-cf-toast{position:fixed;right:24px;top:24px;z-index:9999;max-width:400px;background:#fff;border:1px solid var(--border-light);border-left:5px solid var(--error);box-shadow:var(--shadow-xl);border-radius:12px;padding:16px 20px;display:none;}

.ccl-cf-toast.ccl-cf-show{display:block;animation:ccl-cf-slideDown .3s ease-out forwards;}

@keyframes ccl-cf-slideDown{from{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}

.ccl-cf-toast h5{margin:0 0 8px;font-size:16px;color:var(--error);font-weight:700;}

.ccl-cf-toast p,.ccl-cf-toast ul{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.5;}

.ccl-cf-toast .ccl-cf-close{position:absolute;top:12px;right:14px;background:none;border:none;cursor:pointer;color:var(--text-tertiary);font-size:20px;}

.ccl-cf-toast,.ccl-cf-toast *{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif!important;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}



[hidden]{display:none!important;}

.ccl-cf-gradient-text{background:var(--gradient-primary);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;}

#ccl-cf-stepCounter{display:none;}



/* ================================

   4.15.7  Responsive

   ================================ */

@media (max-width:768px){

  html,body,#ccl-cf-intake-root{overflow-x:hidden;}

  .ccl-cf-wrap{padding:0;}

  .ccl-cf-container{padding:12px;}

  .ccl-cf-grid{grid-template-columns:1fr;gap:12px;}

  .ccl-cf-sidebar{display:none;}

  .ccl-cf-header{padding:16px 16px 18px;}

  .ccl-cf-header::before{right:-30%;width:160px;height:160px;}

  .ccl-cf-steps{display:none;}

  #ccl-cf-stepCounter{display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:8px 12px;font-weight:700;font-size:13px;letter-spacing:.3px;border:1px solid var(--border-light);border-radius:999px;background:var(--bg-primary);color:var(--text-tertiary);box-shadow:var(--shadow-sm);}

  #ccl-cf-stepCounter::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--primary);display:inline-block;}

  .ccl-cf-content{padding:0;background:var(--bg-tertiary);}

  .ccl-cf-section{gap:0;padding-top:15px;}

  .ccl-cf-form-section{margin:12px 12px 16px;padding:16px;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);}

  .ccl-cf-row{grid-template-columns:1fr;gap:14px;margin-bottom:14px;}

  .ccl-cf-actions{padding:16px 12px 8px;gap:10px;}

  .ccl-cf-actions .ccl-cf-btn{width:100%;height:48px;}

  .ccl-cf-review{margin:12px;padding:16px;border-radius:var(--radius-md);}

}

@media (max-width:390px){

  .ccl-cf-header h1{font-size:24px;}

  .ccl-cf-form-section{margin:10px 10px 14px;padding:14px;}

  .ccl-cf-review{margin:10px;padding:14px;}

}



/* =========================================

   4.15.8  THEME: Intake BLUE (CRV energy)

   ========================================= */

/* Palette knobs */

#ccl-cf-intake-root.ccl-intake--blue{

  --dark-section-bg:#0E2B5C;

  --blue-acc:#0b5cff; --blue-acc-2:#21c8f6;

  --blue-ink:#eaf2ff; --blue-ink-soft:#cfe0ff;

  --icon-blue:#9ec0ff;

  --pill-bg:rgba(11,92,255,.20); --pill-bd:rgba(11,92,255,.35); --pill-ink:#eaf2ff;

}



/* Section backdrop */

#ccl-cf-intake-root.ccl-intake--blue{background:var(--dark-section-bg);color:#fff;position:relative;isolation:isolate;}

#ccl-cf-intake-root.ccl-intake--blue::before{content:"";position:absolute;inset:0;background-image:url("https://tpdclaimslawyers.com.au/wp-content/uploads/2022/11/bg-sv.png");background-position:bottom right;background-repeat:no-repeat;background-size:420px auto;opacity:.12;z-index:1;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-container,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-grid,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-wizard{position:relative;z-index:2;}



/* Header on blue */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-header{background:linear-gradient(135deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 100%);border-bottom:1px solid rgba(255,255,255,.10);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-header::before{background:radial-gradient(circle,rgba(255,255,255,.10) 0%,transparent 70%);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-header h1{color:#fff;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-header p{color:rgba(255,255,255,.88);}

/* Brand span (no purple) */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-gradient-text{background:linear-gradient(90deg,var(--blue-acc) 0%,var(--blue-acc-2) 60%,#38bdf8 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;}



/* Wizard shell on blue */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-wizard{background:transparent;border:1px solid rgba(255,255,255,.10);box-shadow:none;}



/* Steps on blue */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-steps{background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.10);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-step{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.88);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-step .ccl-cf-n{background:rgba(255,255,255,.18);color:#e5edff;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-step.ccl-cf-is-active{background:rgba(11,92,255,.22);border-color:var(--blue-acc);color:#f0f6ff;box-shadow:0 6px 16px rgba(11,92,255,.25);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-step.ccl-cf-is-active .ccl-cf-n{background:var(--blue-acc);color:#fff;}



/* Content panels on blue */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-content{background:transparent;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);box-shadow:0 10px 28px rgba(0,0,0,.28);backdrop-filter:saturate(130%) blur(2px);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.24);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-section h3,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section h4,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-label{color:#f6f9ff;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-section h3::before{background:var(--blue-acc);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section h4{border-bottom-color:rgba(255,255,255,.18);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-req{color:#ff7b7b;}



/* Inputs on blue (AA) */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ctrl,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-txt{background:rgba(8,15,30,.22);border:1px solid rgba(255,255,255,.24);color:#fff;color-scheme:dark;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ctrl::placeholder,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-txt::placeholder{color:rgba(224,233,255,.70);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ctrl:focus,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select:focus,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-txt:focus{background:rgba(8,15,30,.28);border-color:#4da3ff;box-shadow:0 0 0 3px rgba(11,92,255,.35);}



/* Select popup (modern UAs) */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select option{background:#0e2447;color:#eaf2ff;font-weight:600;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select option[value=""],#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select option:disabled{color:#9bb4d6;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select:focus option:checked,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select option:checked{background:var(--blue-acc)!important;color:#fff!important;}



/* Chips / radios on blue */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-opt{background:rgba(8,15,30,.22);border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.94);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-opt:hover{background:rgba(8,15,30,.28);border-color:rgba(255,255,255,.30);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-opt:has(input:checked){background:rgba(11,92,255,.24);border-color:#4da3ff;color:#eaf2ff;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-opt:has(input:checked)::after{color:var(--blue-acc);}



/* Sidebar polish */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-sidebar{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);box-shadow:0 8px 20px rgba(0,0,0,.18);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-kicker{color:#8fb4ff;background:rgba(255,255,255,.12);margin-bottom:15px;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office i{color:var(--icon-blue);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-addr{color:rgba(224,233,255,.85);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-phone{color:#37d5ff;font-weight:700;font-size:1.2rem;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-phone:hover{color:#5fe8ff;text-decoration:underline;}



/* Sidebar mini steps */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-mini{color:rgba(224,233,255,.88);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-mini span{background:rgba(255,255,255,.16);color:#e5edff;border:1px solid rgba(255,255,255,.22);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-mini .ccl-cf-active span{background:var(--blue-acc);color:#fff;}



/* Progress bars */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-prog,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-bar{background:rgba(255,255,255,.22);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-prog>span,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-bar>span{background:linear-gradient(90deg,var(--blue-acc),var(--blue-acc-2));}



/* Info panel & button */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-info-tab{background:rgba(255,255,255,.10);color:#cfe0ff;border-color:rgba(255,255,255,.20);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-info-tab i{color:#8fb4ff;}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-info-panel{background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.06));color:#e5edff;border-color:rgba(255,255,255,.20);}



/* Conditional cards (CTP / Nominal Defendant) */

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap,

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap{border-radius:12px;padding:16px 18px;box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 8px 20px rgba(11,92,255,.18);}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap{background:rgba(11,92,255,.12);border-left:4px solid #4da3ff;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap{background:rgba(11,92,255,.08);border-left:4px solid #7cc7ff;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap .ccl-cf-label,

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap .ccl-cf-label{color:#f6f9ff;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap .ccl-cf-error,

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap .ccl-cf-error{color:#ff9a9a;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap .ccl-cf-ctrl,

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap .ccl-cf-ctrl{background:rgba(8,15,30,.22);border:1px solid rgba(255,255,255,.26);color:#fff;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap .ccl-cf-ctrl::placeholder,

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap .ccl-cf-ctrl::placeholder{color:rgba(224,233,255,.75);}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpregoWrap .ccl-cf-ctrl:focus,

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-ctpAltWrap .ccl-cf-ctrl:focus{border-color:#4da3ff;background:rgba(8,15,30,.28);box-shadow:0 0 0 3px rgba(11,92,255,.35);outline:none;}



/* Abuse details */

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-abuseTextareaWrap{background:rgba(11,92,255,.10);border-left:4px solid #4da3ff;border-radius:12px;padding:16px 18px;box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 6px 18px rgba(11,92,255,.18);}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-abuseTextareaWrap .ccl-cf-label{color:#f0f5ff;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-abuseTextareaWrap .ccl-cf-txt{background:rgba(8,15,30,.22);border:1px solid rgba(255,255,255,.24);color:#fff;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-abuseTextareaWrap .ccl-cf-txt::placeholder{color:rgba(224,233,255,.65);font-style:italic;}

#ccl-cf-intake-root.ccl-intake--blue #ccl-cf-abuseTextareaWrap .ccl-cf-txt:focus{border-color:#4da3ff;box-shadow:0 0 0 3px rgba(11,92,255,.28);background:rgba(8,15,30,.28);}



/* General Enquiry info panel (no inline styles) */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-info-panel--general{

  display:block;background:linear-gradient(180deg,rgba(11,92,255,.14) 0%,rgba(4,34,84,.22) 100%);

  border-left:4px solid #4da3ff;border-radius:12px;padding:16px 18px;margin-bottom:20px;color:#eaf2ff;

  box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 6px 18px rgba(11,92,255,.15);

}



/* Buttons on blue */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-btn--primary{background:linear-gradient(90deg,var(--blue-acc) 0%,var(--blue-acc-2) 100%);color:#fff;border:none;box-shadow:0 10px 26px rgba(11,92,255,.32);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-btn--primary:hover{background:linear-gradient(90deg,#0846c1 0%,var(--blue-acc) 100%);transform:translateY(-2px);}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-btn--primary:focus{outline:none;box-shadow:0 0 0 3px rgba(11,92,255,.35);}



/* Toast on blue */

#ccl-cf-intake-root.ccl-intake--blue ~ #ccl-cf-formToast.ccl-cf-toast{background:rgba(8,25,56,.95);border-color:rgba(255,255,255,.14);border-left-color:#ef4444;color:#e8eeff;}

#ccl-cf-intake-root.ccl-intake--blue ~ #ccl-cf-formToast h5{color:#ff8a8a;}



/* Mobile on blue */

@media (max-width:768px){

  #ccl-cf-intake-root.ccl-intake--blue{background-position:bottom right;}

  #ccl-cf-intake-root.ccl-intake--blue .ccl-cf-header{padding:16px;}

  #ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section{margin:12px 12px 16px;}

}

/* ================================

   FIX: Blue theme sidebar legibility

   ================================ */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-sidebar {

  background: rgba(255,255,255,.08);

  border: 1px solid rgba(255,255,255,.15);

  box-shadow: 0 8px 20px rgba(0,0,0,.18);

}



/* Headline + lede */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-sidebar .ccl-cf-h2 {

  color: #ffffff;

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-sidebar .ccl-cf-lede,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-sidebar p {

  color: rgba(224,233,255,.90);

}



/* Divider line above the offices block */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-offices {

  border-top-color: rgba(255,255,255,.18);

}



/* Office rows */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office i {

  color: #9ec0ff;

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-name {

  color: #eaf2ff;                 /* brighter office name */

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-addr {

  color: rgba(224,233,255,.86);   /* readable address line */

}



/* Phone highlight */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-phone {

  color: #37d5ff;

  font-weight: 700;

  text-decoration: none;

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-office .ccl-cf-phone:hover {

  color: #5fe8ff;

  text-decoration: underline;

}



/* Kicker pill (“Contact Information”, “Your Progress”) */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-kicker,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-progress-side .ccl-cf-kicker {

  background: rgba(11,92,255,.20);

  border: 1px solid rgba(11,92,255,.35);

  color: #eaf2ff;

}



/* Mini step row at bottom of sidebar */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-mini { color: rgba(224,233,255,.88); }

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-mini span {

  background: rgba(255,255,255,.16);

  color: #e5edff;

  border: 1px solid rgba(255,255,255,.22);

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-mini .ccl-cf-active span {

  background: #0b5cff;

  color: #fff;

}

/* BLUE THEME — Disclaimer (lighter, readable) */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-disclaimer{

  /* lighter amber glass */

  background: rgba(253, 224, 71, 0.18);         /* ~yellow-300 @ 18% */

  border-left: 4px solid #facc15;               /* yellow-400 */

  color: #fff3c4;                                /* soft light ink */

  border-radius: 12px;

  padding: 14px 16px;

  box-shadow:

	0 0 0 1px rgba(255,255,255,.10) inset,

	0 6px 16px rgba(0,0,0,.12);

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-disclaimer p{

  margin: 0;

  color: #fff7d6;                                /* body copy */

  line-height: 1.55;

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-disclaimer strong{

  color: #ffe27a;                                 /* emphasis */

  font-weight: 800;

}



/* If there are links inside, keep them legible */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-disclaimer a{

  color:#fff; text-decoration: underline;

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-disclaimer a:hover{

  color:#fffbea;

}

/* ==========================================================

   BLUE THEME — Form Error, Review, and Success States

   ========================================================== */



/* --- 1. Error states (fields + messages) --- */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ctrl.ccl-cf-is-invalid,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-select.ccl-cf-is-invalid,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-txt.ccl-cf-is-invalid {

  border-color: #ff4d4d;

  box-shadow: 0 0 0 3px rgba(255, 77, 77, 0.3);

  background: rgba(255, 77, 77, 0.08);

  color: #fff;

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-error {

  color: #ff7676;

  font-weight: 600;

  text-shadow: 0 0 4px rgba(255, 77, 77, 0.3);

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-error::before {

  color: #ff9d9d;

}



/* --- 2. Review section (Step 4) --- */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review {

  background: rgba(255,255,255,0.08);

  border: 1px solid rgba(255,255,255,0.18);

  color: #eaf2ff;

  box-shadow: 0 10px 24px rgba(0,0,0,0.25);

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review dt {

  color: #ffffff;

  font-weight: 700;

  font-size: 15px;

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review dd {

  color: #cfe0ff;

  font-weight: 500;

  font-size: 15px;

  line-height: 1.55;

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review dd:not(:last-child) {

  margin-bottom: 4px;

}



/* --- 3. Success message (Message Sent) --- */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ok {

  background: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%);

  border: 1px solid rgba(255,255,255,0.15);

  border-radius: 18px;

  box-shadow: 0 12px 28px rgba(0,0,0,0.25);

  text-align: center;

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ok .ccl-cf-ico {

  color: #22c55e;

  font-size: 84px;

  margin-bottom: 22px;

  text-shadow: 0 0 8px rgba(34, 197, 94, 0.35);

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ok h2 {

  color: #4ade80; /* lighter green */

  font-weight: 800;

  font-size: 32px;

  margin-bottom: 12px;

  text-shadow: 0 0 6px rgba(34,197,94,0.4);

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ok p {

  color: rgba(224,233,255,0.88);

  font-size: 17px;

  margin-bottom: 26px;

}



#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ok .ccl-cf-btn--primary {

  background: linear-gradient(90deg, #0b5cff 0%, #21c8f6 100%);

  border: none;

  color: #fff;

  box-shadow: 0 8px 22px rgba(11,92,255,0.35);

  transition: all 0.25s ease;

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-ok .ccl-cf-btn--primary:hover {

  background: linear-gradient(90deg, #0846c1 0%, #0b5cff 100%);

  transform: translateY(-2px);

  box-shadow: 0 10px 26px rgba(11,92,255,0.45);

}

/* ===== Intake form performance passes (blue theme) ===== */



/* 1) Remove GPU-expensive blur/saturate from large panels */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review,

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-info-panel{

  backdrop-filter: none;                 /* kill costly filter */

  -webkit-backdrop-filter: none;

}



/* 2) Use simpler, lighter elevation */

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-form-section{

  box-shadow: 0 4px 12px rgba(0,0,0,.18); /* was heavier */

}

#ccl-cf-intake-root.ccl-intake--blue .ccl-cf-review{

  box-shadow: 0 4px 12px rgba(0,0,0,.18);

}



/* 3) Cut transitions on large containers (keep snappy UI) */

#ccl-cf-intake-root .ccl-cf-form-section,

#ccl-cf-intake-root .ccl-cf-review{

  transition: box-shadow .18s ease, border-color .18s ease;

}



/* 4) Make expand/collapse cheaper (hint to browser) */

#ccl-cf-intake-root .ccl-cf-info-panel,

#ccl-cf-intake-root .ccl-cf-cond-card{

  will-change: height;

}



/* 5) Respect low-power or motion-sensitive users */

@media (prefers-reduced-motion: reduce){

  #ccl-cf-intake-root .ccl-cf-form-section,

  #ccl-cf-intake-root .ccl-cf-review,

  #ccl-cf-intake-root .ccl-cf-info-panel,

  #ccl-cf-intake-root .ccl-cf-cond-card{

	transition: none !important;

	animation: none !important;

  }

}

	.ccl-about {

	 /* Scoped tokens (no :root pollution) */

	 --ccl-primary: #1d63ff;

	 --ccl-primary-dark: #0d4ad9;

	 --ccl-cta: #0b5cff;

	 --ccl-gold: #ffa826;

	 --ccl-gold-light: #ffc057;

	 --ccl-ink: #1e293b;

	 --ccl-ink-light: #475569;

	 --ccl-white: #fff;

	 --ccl-line: rgba(255,255,255,.16);

	 --ccl-cta-text: #0b0b0b;

	 --ccl-combo-max: 520px;

	 --ccl-radius: 12px;

	 --ccl-radius-lg: 20px;

	 --ccl-light-bg: #f8fafc;

	 --ccl-light-bg-alt: #f1f5f9;

	 --ccl-shadow: 0 4px 20px rgba(0,0,0,.08);

	 --ccl-shadow-lg: 0 20px 60px rgba(0,0,0,.12);

	}



	/* ===== BASE (scoped) ===== */

	.ccl-about * { box-sizing: border-box; margin: 0; padding: 0; }

	.ccl-about { margin: 0; scroll-behavior: smooth; }

	.ccl-about { font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: var(--ccl-ink); line-height: 1.7; font-size: 1.05rem; font-weight: 400; letter-spacing: -0.01em; }

	.ccl-about h1, .ccl-about h2, .ccl-about h3, .ccl-about h4, .ccl-about h5, .ccl-about h6 { font-family: 'Inter Tight', Inter, sans-serif; font-weight: 900; line-height: 1.1; letter-spacing: -0.02em; margin-bottom: 1rem; }

	.ccl-about p { margin-bottom: 1.5rem; color: var(--ccl-ink-light); }

	.ccl-about a { color: var(--ccl-primary); text-decoration: none; transition: color .2s ease; }

	.ccl-about a:hover { color: var(--ccl-primary-dark); }

	.ccl-about mark { color: inherit; background: linear-gradient(180deg, transparent 62%, rgba(255,168,38,.28) 62% 92%, transparent 92%); padding: 0 .18em; border-radius: 6px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }



	/* ===== ANIMATIONS ===== */

	@keyframes ccl-fadeInUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }

	@media (prefers-reduced-motion: reduce) {

	 .ccl-about * { animation: none !important; transition: none !important; }

	}



	/* ===== HERO ===== */

	.ccl-about .ccl-hero { position: relative; display: flex; flex-direction: column; align-items: center; isolation: isolate; color: var(--ccl-white); padding: clamp(84px, 14vw, 160px) 16px clamp(110px, 16vw, 170px); overflow: hidden; text-align: center; margin-bottom: 0; }

	.ccl-about .ccl-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url('https://cartercapner.com.au/wp-content/uploads/2020/06/canva-photo-editor.png') center 30%/cover no-repeat; }

	.ccl-about .ccl-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(1200px 520px at 110% -20%, rgba(29,99,255,.18), transparent 60%), linear-gradient(180deg, rgba(14,43,92,.92) 0%, rgba(14,43,92,.62) 44%, rgba(14,43,92,.84) 100%); }

	.ccl-about .ccl-hero__inner { max-width: 820px; width: 100%; animation: ccl-fadeInUp .6s ease-out; }

	.ccl-about .ccl-hero__kicker { font-size: .88rem; font-weight: 800; letter-spacing: .08em; color: var(--ccl-gold-light); text-transform: uppercase; margin: 0 0 .75rem; }

	.ccl-about .ccl-hero__title { font-size: clamp(2rem, 6.2vw, 4.2rem); margin: 0 0 .75rem; text-shadow: 0 4px 18px rgba(0,0,0,.32); }

	.ccl-about .ccl-hero__lead { font-size: clamp(1rem, 2.6vw, 1.15rem); line-height: 1.65; color: rgba(255,255,255,.92); max-width: 62ch; margin: 0 auto 1.2rem; }

	.ccl-about .ccl-hero__cta-container { width: 100%; display: grid; justify-items: center; margin-top: .25rem; }

	.ccl-about .ccl-hero__cta { display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1rem; border-radius: var(--ccl-radius); padding: 14px 22px; border: 0; cursor: pointer; text-decoration: none; background: var(--ccl-gold); color: var(--ccl-cta-text); box-shadow: 0 10px 28px rgba(255,168,38,.28); transition: transform .2s, box-shadow .25s; }

	.ccl-about .ccl-hero__cta:focus-visible { outline: 3px solid rgba(255,255,255,.55); outline-offset: 2px; }

	.ccl-about .ccl-hero__cta:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(255,168,38,.4); }



	/* HERO STATS */

	.ccl-about .ccl-hero-stats { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; background: rgba(0,0,0,.28); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--ccl-line); padding: 1rem; }

	.ccl-about .ccl-hero-stats__wrap { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); gap: .75rem; align-items: center; }

	.ccl-about .ccl-hero-stat { text-align: center; display: grid; gap: .3rem; }

	.ccl-about .ccl-hero-stat__num { font-family: 'Inter Tight', Inter, sans-serif; font-size: 2rem; font-weight: 900; line-height: 1; color: var(--ccl-white); }

	.ccl-about .ccl-hero-stat__label { font-size: .76rem; color: rgba(255,255,255,.85); letter-spacing: .05em; text-transform: uppercase; }

	.ccl-about .ccl-hero-stats__note { grid-column: 1/-1; text-align: center; margin-top: .25rem; font-size: .76rem; color: rgba(255,255,255,.85); }

	.ccl-about .ccl-hero-stats__note a { color: var(--ccl-white); text-decoration: underline; }

	@media (min-width: 901px) { .ccl-about .ccl-hero-stat + .ccl-hero-stat { position: relative; } .ccl-about .ccl-hero-stat + .ccl-hero-stat::before { content: ""; position: absolute; left: -.375rem; top: 12%; bottom: 12%; width: 1px; background: rgba(255,255,255,.2); } }



	/* HERO responsive */

	@media (max-width: 900px){

	 .ccl-about .ccl-hero { padding-bottom: clamp(56px, 9vw, 84px); margin: 0; }

	 .ccl-about .ccl-hero__cta { width: 100%; max-width: var(--ccl-combo-max); border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin: 0 auto; }

	 .ccl-about .ccl-hero-stats { position: static; width: inherit; background: none; border-top: 0; padding: 0; display: block; justify-content: center; }

	 .ccl-about .ccl-hero-stats__wrap { width: 100%; max-width: var(--ccl-combo-max); margin: 0; border: 1px solid rgba(255,255,255,.2); border-top: 0; border-bottom-left-radius: var(--ccl-radius); border-bottom-right-radius: var(--ccl-radius); padding: 1rem 1.25rem; box-shadow: 0 12px 26px rgba(0,0,0,.22); display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }

	 .ccl-about .ccl-hero-stat__num { font-size: 1.75rem; }

	 .ccl-about .ccl-hero-stat__label { font-size: .7rem; }

	 .ccl-about .ccl-hero-stats__note { grid-column: 1/-1; padding-top: .5rem; margin-top: .5rem; border-top: 1px solid rgba(255,255,255,.22); }

	}

	@media (max-width: 640px){

	 .ccl-about .ccl-hero-stats__wrap { display: block; padding: 12px 14px; }

	 .ccl-about .ccl-hero-stat { display: flex; align-items: center; justify-content: space-between; text-align: left; padding: 10px 2px; border-top: 1px solid rgba(255,255,255,.22); }

	 .ccl-about .ccl-hero-stat:first-child { border-top: none; }

	 .ccl-about .ccl-hero-stat__num { font-size: 1.1rem; }

	 .ccl-about .ccl-hero-stat__label { font-size: .86rem; letter-spacing: .01em; text-transform: none; opacity: .92; margin-left: 12px; }

	 .ccl-about .ccl-hero-stats__note { font-size: .74rem; margin: 6px 2px 4px; border-top: 0; padding-top: 0; }

	}



	/* ===== GENERIC SECTION ===== */

	.ccl-about .ccl-section { padding: clamp(90px, 12vw, 140px) 20px; position: relative; overflow: hidden; }

	.ccl-about .ccl-section.ccl-expertise { overflow: visible; }

	.ccl-about .ccl-section__inner { max-width: 1200px; margin: 0 auto; width: 100%; position: relative; z-index: 1; }

	.ccl-about .ccl-section__header { text-align: center; margin-bottom: clamp(50px, 8vw, 80px); max-width: 850px; margin-left: auto; margin-right: auto; }

	.ccl-about .ccl-section__kicker { font-size: .85rem; font-weight: 800; letter-spacing: .12em; color: var(--ccl-primary); text-transform: uppercase; margin: 0 0 1rem; display: inline-block; padding: 6px 16px; background: rgba(29,99,255,.08); border-radius: 50px; }

	.ccl-about .ccl-section__title { font-size: clamp(2rem, 4.8vw, 3.4rem); margin: 0 0 1.25rem; color: var(--ccl-ink); letter-spacing: -0.03em; }

	.ccl-about .ccl-section__lead { font-size: clamp(1.05rem, 2.4vw, 1.25rem); line-height: 1.7; color: var(--ccl-ink-light); max-width: 65ch; margin: 0 auto; opacity: .95; }



	/* ===== OUR STORY ===== */

	.ccl-about .ccl-our-story { background: linear-gradient(180deg, var(--ccl-white) 0%, var(--ccl-light-bg) 100%); position: relative; }

	.ccl-about .ccl-our-story::before { content: ""; position: absolute; top: 0; left: 0; width: 600px; height: 600px; background: radial-gradient(circle, rgba(29,99,255,.03) 0%, transparent 70%); border-radius: 50%; pointer-events: none; }

	.ccl-about .ccl-our-story__content { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(60px, 8vw, 85px); align-items: center; }

	.ccl-about .ccl-our-story__image { border-radius: var(--ccl-radius-lg); overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.04); animation: ccl-fadeInUp .7s ease-out .1s both; position: relative; transition: transform .4s ease; }

	.ccl-about .ccl-our-story__image:hover { transform: translateY(-8px); }

	.ccl-about .ccl-our-story__image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(29,99,255,.1) 0%, transparent 50%); pointer-events: none; opacity: 0; transition: opacity .4s ease; }

	.ccl-about .ccl-our-story__image:hover::after { opacity: 1; }

	.ccl-about .ccl-our-story__image img { width: 100%; height: auto; display: block; transition: transform .4s ease; }

	.ccl-about .ccl-our-story__image:hover img { transform: scale(1.02); }

	.ccl-about .ccl-our-story__text { animation: ccl-fadeInUp .7s ease-out .3s both; }

	.ccl-about .ccl-our-story__text p { font-size: clamp(1.15rem, 2.2vw, 1.3rem); line-height: 1.8; margin-bottom: 1.75rem; color: var(--ccl-ink); font-weight: 400; }

	.ccl-about .ccl-our-story__text p:first-of-type { font-size: clamp(1.25rem, 2.5vw, 1.45rem); font-weight: 500; color: var(--ccl-ink); line-height: 1.7; }

	.ccl-about .ccl-our-story__stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; margin-top: 3rem; padding-top: 2.5rem; border-top: 2px solid rgba(29,99,255,.12); }

	.ccl-about .ccl-our-story__stat { text-align: left; }

	.ccl-about .ccl-our-story__stat-number { font-family: 'Inter Tight', Inter, sans-serif; font-size: 2.75rem; font-weight: 900; color: var(--ccl-primary); line-height: 1; margin-bottom: .75rem; display: block; }

	.ccl-about .ccl-our-story__stat-label { font-size: 1rem; color: var(--ccl-ink-light); font-weight: 600; line-height: 1.4; }



	/* Responsive Story */

	@media (max-width: 768px){

	 .ccl-about .ccl-our-story__content { grid-template-columns: 1fr; gap: 50px; }

	 .ccl-about .ccl-our-story__image { order: 1; }

	 .ccl-about .ccl-our-story__text { order: 0; }

	 .ccl-about .ccl-our-story__stats { grid-template-columns: 1fr; }

	}



	/* ===== APPROACH ===== */

	.ccl-about .ccl-our-approach { background: var(--ccl-white); position: relative; }

	.ccl-about .ccl-approach-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; position: relative; margin-top: 3rem; }

	.ccl-about .ccl-approach-steps::before { content: ""; position: absolute; top: 35px; left: 10%; right: 10%; height: 2px; background: linear-gradient(90deg, var(--ccl-primary) 0%, var(--ccl-gold) 100%); z-index: 0; }

	.ccl-about .ccl-approach-step { text-align: center; position: relative; animation: ccl-fadeInUp .7s ease-out both; }

	.ccl-about .ccl-approach-step:nth-child(1){animation-delay:.1s;} .ccl-about .ccl-approach-step:nth-child(2){animation-delay:.2s;} .ccl-about .ccl-approach-step:nth-child(3){animation-delay:.3s;} .ccl-about .ccl-approach-step:nth-child(4){animation-delay:.4s;}

	.ccl-about .ccl-approach-step__number { width: 70px; height: 70px; border-radius: 50%; background: linear-gradient(135deg, var(--ccl-primary) 0%, #0d4ad9 100%); display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; color: var(--ccl-white); font-family: 'Inter Tight', Inter, sans-serif; font-size: 1.75rem; font-weight: 900; box-shadow: 0 10px 30px rgba(29,99,255,.25); position: relative; z-index: 1; transition: transform .3s ease; }

	.ccl-about .ccl-approach-step:hover .ccl-approach-step__number { transform: scale(1.1); }

	.ccl-about .ccl-approach-step__icon { font-size: 1.5rem; color: var(--ccl-white); }

	.ccl-about .ccl-approach-step__title { font-size: 1.15rem; margin: 0 0 .75rem; color: var(--ccl-ink); font-weight: 800; }

	.ccl-about .ccl-approach-step__text { font-size: .95rem; line-height: 1.6; color: var(--ccl-ink-light); margin: 0; }

	@media (max-width: 1024px){ .ccl-about .ccl-approach-steps { grid-template-columns: repeat(2,1fr); gap: 3rem 2rem; } .ccl-about .ccl-approach-steps::before { display: none; } }

	@media (max-width: 768px){ .ccl-about .ccl-approach-steps { grid-template-columns: 1fr; gap: 2.5rem; } }



	/* ===== EXPERTISE ===== */

	.ccl-about .ccl-expertise { background: var(--ccl-ink); color: var(--ccl-white); position: relative; }

	.ccl-about .ccl-expertise::before { content: ""; position: absolute; inset: 0; background: radial-gradient(1200px 800px at 20% 50%, rgba(29,99,255,.12) 0%, transparent 60%), radial-gradient(1000px 700px at 80% 50%, rgba(255,168,38,.1) 0%, transparent 60%); pointer-events: none; }

	.ccl-about .ccl-expertise .ccl-section__kicker { background: rgba(255,255,255,.12); color: var(--ccl-gold-light); }

	.ccl-about .ccl-expertise .ccl-section__title { color: var(--ccl-white); }

	.ccl-about .ccl-expertise .ccl-section__lead { color: rgba(255,255,255,.9); }

	.ccl-about .ccl-section__divider { width: 80px; height: 3px; border: none; border-radius: 4px; background: linear-gradient(90deg, var(--ccl-primary) 0%, var(--ccl-gold) 100%); margin: 2.5rem auto 0; }

	.ccl-about .ccl-expertise__layout { display: grid; grid-template-columns: 1fr 350px; gap: clamp(3rem, 6vw, 5rem); align-items: start; }

	.ccl-about .ccl-expertise-list { display: grid; gap: clamp(3rem, 6vw, 5rem); }

	.ccl-about .ccl-expertise-item { display: grid; grid-template-columns: auto 1fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: flex-start; animation: ccl-fadeInUp .7s ease-out both; position: relative; }

	.ccl-about .ccl-expertise-item:nth-child(1){animation-delay:.1s;} .ccl-about .ccl-expertise-item:nth-child(2){animation-delay:.2s;} .ccl-about .ccl-expertise-item:nth-child(3){animation-delay:.3s;} .ccl-about .ccl-expertise-item:nth-child(4){animation-delay:.4s;}

	.ccl-about .ccl-expertise-item::after { content: ""; position: absolute; bottom: -2.5rem; left: 85px; right: 0; height: 1px; background: linear-gradient(90deg, rgba(255,255,255,.15) 0%, transparent 100%); }

	.ccl-about .ccl-expertise-item:last-child::after { display: none; }

	.ccl-about .ccl-expertise-item__icon-wrap { width: 85px; height: 85px; border-radius: 50%; background: linear-gradient(135deg, var(--ccl-gold) 0%, var(--ccl-gold-light) 100%); display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 15px 40px rgba(255,168,38,.3); transition: transform .4s ease; }

	.ccl-about .ccl-expertise-item:hover .ccl-expertise-item__icon-wrap { transform: scale(1.05) rotate(-5deg); }

	.ccl-about .ccl-expertise-item__icon { font-size: 2.5rem; color: var(--ccl-cta-text); }

	.ccl-about .ccl-expertise-item__content h3 { font-size: clamp(1.5rem, 3vw, 2rem); margin: 0 0 1rem; color: var(--ccl-white); }

	.ccl-about .ccl-expertise-item__content p { font-size: clamp(1.05rem, 2vw, 1.2rem); line-height: 1.75; color: rgba(255,255,255,.85); margin: 1rem 0 .5rem; }

	.ccl-about .ccl-expertise-item__sub { font-size: .98rem; color: rgba(255,255,255,.9); margin: .25rem 0 .4rem; }

	.ccl-about .ccl-expertise-item__list { margin: .1rem 0 .6rem; padding-left: 1.1rem; color: rgba(255,255,255,.85); }

	.ccl-about .ccl-expertise-item__cta { display: inline-flex; align-items: center; gap: .5rem; font-weight: 800; color: var(--ccl-gold); }



	/* Expertise sidebar */

	.ccl-about .ccl-expertise-sidebar { background: rgba(255,255,255,.05); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: var(--ccl-radius-lg); padding: 2.5rem; border: 1px solid rgba(255,255,255,.1); position: sticky; top: 100px; align-self: start; max-height: calc(100vh - 120px); overflow-y: auto; transition: all .3s ease; }

	.ccl-about .ccl-expertise-sidebar.is-stuck { box-shadow: 0 12px 30px rgba(0,0,0,.22); border-color: rgba(255,255,255,.18); }

	.ccl-about .ccl-expertise-sidebar__title { font-size: 1.5rem; margin: 0 0 1.5rem; color: var(--ccl-white); }

	.ccl-about .ccl-expertise-sidebar__list { list-style: none; margin-bottom: 2rem; }

	.ccl-about .ccl-expertise-sidebar__item { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: 1.25rem; }

	.ccl-about .ccl-expertise-sidebar__item:last-child { margin-bottom: 0; }

	.ccl-about .ccl-expertise-sidebar__icon { width: 24px; height: 24px; background: var(--ccl-gold); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--ccl-cta-text); font-size: .8rem; }

	.ccl-about .ccl-expertise-sidebar__text { font-size: 1rem; color: rgba(255,255,255,.85); line-height: 1.5; }

	.ccl-about .ccl-expertise-sidebar__cta { display: block; text-align: center; background: var(--ccl-gold); color: var(--ccl-cta-text); font-weight: 700; padding: 1rem 1.5rem; border-radius: var(--ccl-radius); text-decoration: none; transition: all .3s ease; margin-top: 1.5rem; }

	.ccl-about .ccl-expertise-sidebar__cta:hover { background: var(--ccl-gold-light); transform: translateY(-2px); box-shadow: 0 10px 25px rgba(255,168,38,.3); }



	@media (max-width: 1024px){

	 .ccl-about .ccl-expertise__layout { grid-template-columns: 1fr; gap: 3rem; }

	 .ccl-about .ccl-expertise-sidebar { position: static; top: auto; max-height: none; overflow: visible; box-shadow: none; order: -1; z-index: auto; }

	}

	@media (max-width: 900px){

	 .ccl-about .ccl-expertise-item { grid-template-columns: 1fr; gap: 1.5rem; }

	 .ccl-about .ccl-expertise-item::after { left: 0; }

	 .ccl-about .ccl-expertise-item__icon-wrap { width: 75px; height: 75px; }

	 .ccl-about .ccl-expertise-item__icon { font-size: 2rem; }

	}



	/* ===== WHY CHOOSE US ===== */

	.ccl-about .ccl-why-choose { background: linear-gradient(180deg, var(--ccl-light-bg) 0%, var(--ccl-white) 100%); position: relative; }

	.ccl-about .ccl-why-list { display: grid; gap: clamp(3.5rem, 6vw, 5rem); max-width: 1100px; margin: 0 auto; }

	.ccl-about .ccl-why-item { display: grid; grid-template-columns: 100px 1fr; gap: clamp(2rem, 4vw, 3rem); align-items: flex-start; animation: ccl-fadeInUp .7s ease-out both; padding-bottom: clamp(3.5rem, 6vw, 5rem); border-bottom: 2px solid rgba(29,99,255,.08); }

	.ccl-about .ccl-why-item:nth-child(1){animation-delay:.1s;} .ccl-about .ccl-why-item:nth-child(2){animation-delay:.2s;} .ccl-about .ccl-why-item:nth-child(3){animation-delay:.3s;} .ccl-about .ccl-why-item:nth-child(4){animation-delay:.4s;} .ccl-about .ccl-why-item:nth-child(5){animation-delay:.5s;} .ccl-about .ccl-why-item:nth-child(6){animation-delay:.6s;}

	.ccl-about .ccl-why-item:last-child { border-bottom: none; padding-bottom: 0; }

	.ccl-about .ccl-why-item__number { font-family: 'Inter Tight', Inter, sans-serif; font-size: 4.5rem; font-weight: 900; color: var(--ccl-primary); line-height: 1; opacity: .15; user-select: none; }

	.ccl-about .ccl-why-item__header { display: flex; align-items: center; gap: 1rem; margin: 0 0 .75rem; }

	.ccl-about .ccl-why-item__icon { width: 50px; height: 50px; border-radius: 50%; background: linear-gradient(135deg, var(--ccl-primary) 0%, #0d4ad9 100%); display: flex; align-items: center; justify-content: center; color: var(--ccl-white); font-size: 1.25rem; flex-shrink: 0; box-shadow: 0 8px 24px rgba(29,99,255,.2); }

	.ccl-about .ccl-why-item__title { font-size: clamp(1.5rem, 3vw, 2.2rem); color: var(--ccl-ink); margin: 0; }

	.ccl-about .ccl-why-item__text { font-size: clamp(1.02rem, 2vw, 1.18rem); line-height: 1.8; color: var(--ccl-ink-light); margin: 0 0 .75rem; }

	.ccl-about .ccl-why-bullets { margin: .25rem 0 0; padding-left: 1.15rem; color: #64748b; }

	.ccl-about .ccl-why-bullets li { margin: .25rem 0; }



	/* ===== MV (Mission / Vision / Values) ===== */

	.ccl-about .ccl-mission-vision { background: linear-gradient(135deg, var(--ccl-white) 0%, var(--ccl-light-bg) 100%); position: relative; }

	.ccl-about .ccl-mission-vision::before { content: ""; position: absolute; top: 0; right: 0; width: 500px; height: 500px; background: radial-gradient(circle, rgba(29,99,255,.05) 0%, transparent 70%); border-radius: 50%; pointer-events: none; }



	.ccl-about .mv-section { padding: 5rem 0; background: linear-gradient(180deg, #F1F5F9 0%, #FFFFFF 100%); position: relative; overflow: hidden; }

	.ccl-about .mv-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; background: radial-gradient(circle at 20% 50%, rgba(37, 99, 235, 0.08) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(59, 130, 246, 0.06) 0%, transparent 50%); pointer-events: none; }

	.ccl-about .mv-section__container { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding: 0 1rem; position: relative; z-index: 1; }

	.ccl-about .mv-section__header { max-width: 52rem; margin: 0 auto 5rem; text-align: center; }

	.ccl-about .mv-section__kicker { color: #2563EB; font-weight: 700; font-size: .875rem; letter-spacing: .1em; text-transform: uppercase; display: inline-block; padding: .5rem 1.25rem; background: linear-gradient(135deg, rgba(37, 99, 235, .1), rgba(59, 130, 246, .1)); border-radius: 2rem; margin-bottom: 1rem; }

	.ccl-about .mv-section__title { margin-top: .75rem; font-size: 3rem; font-weight: 900; letter-spacing: -0.03em; background: linear-gradient(135deg, #0F172A 0%, #334155 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1.1; }

	.ccl-about .mv-section__lead { margin-top: 1.5rem; font-size: 1.2rem; color: #475569; line-height: 1.7; }

	.ccl-about .mv-section__mission-vision { display: grid; grid-template-columns: 1fr; gap: 2rem; margin-bottom: 5rem; }



	.ccl-about .mv-section__card { background: #FFFFFF; border: 1px solid rgba(226, 232, 240, 0.8); border-radius: 1.5rem; box-shadow: 0 4px 6px -1px rgba(0,0,0,.03), 0 2px 4px -1px rgba(0,0,0,.02); padding: 2.5rem; transition: all .4s cubic-bezier(.4,0,.2,1); position: relative; overflow: hidden; }

	.ccl-about .mv-section__card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #2563EB, #3B82F6); transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(.4,0,.2,1); }

	.ccl-about .mv-section__card:hover::before { transform: scaleX(1); }

	.ccl-about .mv-section__card:hover { transform: translateY(-8px); box-shadow: 0 20px 25px -5px rgba(0,0,0,.08), 0 10px 10px -5px rgba(0,0,0,.04); border-color: rgba(37, 99, 235, .2); }

	.ccl-about .mv-section__card-head { display: flex; align-items: center; gap: 1.25rem; margin-bottom: 1.5rem; }

	.ccl-about .mv-section__card-icon { width: 4rem; height: 4rem; border-radius: 1rem; background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%); color: #FFFFFF; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 20px -5px rgba(37,99,235,.3); flex-shrink: 0; position: relative; }

	.ccl-about .mv-section__card-icon i { font-size: 1.5rem; }

	.ccl-about .mv-section__card-icon::after { content: ''; position: absolute; inset: -2px; border-radius: 1rem; background: linear-gradient(135deg, #3B82F6, #2563EB); opacity: 0; transition: opacity .3s ease; z-index: -1; }

	.ccl-about .mv-section__card:hover .mv-section__card-icon::after { opacity: .3; }

	.ccl-about .mv-section__card-title { font-weight: 800; color: #0F172A; letter-spacing: -0.02em; }

	.ccl-about .mv-section__card-body > *:not(:last-child) { margin-bottom: 1.25rem; }

	.ccl-about .mv-section__card-body > p { color: #334155; font-size: 1.05rem; font-weight: 500; line-height: 1.7; }



	.ccl-about .mv-section__subtitle { font-weight: 800; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: #2563EB; padding: .5rem 1rem; background: rgba(37,99,235,.05); border-radius: .5rem; display: inline-block; }

	.ccl-about .mv-section__bullets { list-style: none; padding-left: 0; margin-top: 1rem; }

	.ccl-about .mv-section__bullets li { margin-bottom: .75rem; padding-left: 1.75rem; position: relative; color: #475569; font-size: 1rem; line-height: 1.6; }

	.ccl-about .mv-section__bullets li::before { content: '→'; position: absolute; left: 0; color: #2563EB; font-weight: bold; font-size: 1.1rem; }



	.ccl-about .mv-section__values-wrapper { margin-bottom: 6rem; text-align: center; }

	.ccl-about .mv-section__values-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 3rem; color: #0F172A; text-align: left; letter-spacing: -0.02em; }

	.ccl-about .mv-section__values-grid { display: grid; grid-template-columns: 1fr; gap: 1.75rem; text-align: center; }

	.ccl-about .mv-section__value-item { background: #FFFFFF; padding: 2rem 1.5rem; border-radius: 1rem; border: 1px solid rgba(226,232,240,.8); transition: transform .3s ease, box-shadow .3s ease; }

	.ccl-about .mv-section__value-item:hover { transform: translateY(-5px); box-shadow: 0 10px 15px -3px rgba(0,0,0,.07), 0 4px 6px -2px rgba(0,0,0,.04); }

	.ccl-about .mv-section__value-icon { font-size: 1.75rem; color: #2563EB; margin-bottom: 1rem; display: inline-block; }

	.ccl-about .mv-section__value-item h4 { font-size: 1.25rem; font-weight: 700; color: #1E293B; margin-bottom: .5rem; }

	.ccl-about .mv-section__value-item p { font-size: .95rem; color: #475569; line-height: 1.5; }



	.ccl-about .mv-section__rows { margin-top: 6rem; max-width: 75rem; margin-left: auto; margin-right: auto; }

	.ccl-about .mv-section__rows-header { text-align: center; margin-bottom: 3.5rem; }

	.ccl-about .mv-section__rows-title { font-size: 2.25rem; font-weight: 900; color: #0F172A; letter-spacing: -0.02em; margin-bottom: .75rem; }

	.ccl-about .mv-section__rows-subtitle { font-size: 1.1rem; color: #475569; max-width: 42rem; margin: 0 auto; }

	.ccl-about .mv-section__rows-grid { display: grid; gap: 2rem; }



	.ccl-about .mv-section__row { display: grid; grid-template-columns: auto 1fr; gap: 2rem; align-items: start; padding: 2.5rem; background: #FFFFFF; border-radius: 1.5rem; border: 1px solid rgba(226,232,240,.8); box-shadow: 0 4px 6px -1px rgba(0,0,0,.03); transition: all .4s cubic-bezier(.4,0,.2,1); position: relative; overflow: hidden; }

	.ccl-about .mv-section__row::after { content: ''; position: absolute; inset: 0; border-radius: 1.5rem; background: linear-gradient(135deg, rgba(251,191,36,.03), rgba(245,158,11,.03)); opacity: 0; transition: opacity .4s ease; pointer-events: none; }

	.ccl-about .mv-section__row:hover { transform: translateX(8px); box-shadow: 0 16px 32px -8px rgba(0,0,0,.12); border-color: rgba(251,191,36,.4); }

	.ccl-about .mv-section__row:hover::after { opacity: 1; }



	.ccl-about .mv-section__row-icon { width: 3.5rem; height: 3.5rem; min-width: 3.5rem; border-radius: 1rem; background: linear-gradient(135deg, #FBBF24 0%, #F59E0B 100%); color: #1F2937; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px -6px rgba(251,191,36,.45); flex-shrink: 0; position: relative; z-index: 1; }

	.ccl-about .mv-section__row-icon::before { content: ''; position: absolute; inset: -2px; border-radius: 1rem; background: linear-gradient(135deg, #FCD34D, #FBBF24); opacity: 0; transition: opacity .3s ease; z-index: -1; }

	.ccl-about .mv-section__row:hover .mv-section__row-icon::before { opacity: .4; }

	.ccl-about .mv-section__row-icon i { font-size: 1.5rem; }



	.ccl-about .mv-section__row-content { position: relative; z-index: 1; }

	.ccl-about .mv-section__row-title { font-size: 1.5rem; font-weight: 800; color: #0F172A; margin-bottom: .75rem; letter-spacing: -0.02em; }

	.ccl-about .mv-section__row-content > p { color: #334155; font-size: 1.05rem; line-height: 1.8; margin-bottom: 1.5rem; font-weight: 500; }

	.ccl-about .mv-section__row-list { padding-left: 0; list-style: none; color: #475569; display: grid; gap: .75rem; }

	.ccl-about .mv-section__row-list li { padding-left: 2rem; position: relative; line-height: 1.7; font-size: 1rem; }

	.ccl-about .mv-section__row-list li::before { content: ''; position: absolute; left: 0; top: .4rem; width: 1.25rem; height: 1.25rem; background: linear-gradient(135deg, #FBBF24, #F59E0B); border-radius: .25rem; display: flex; align-items: center; justify-content: center; }

	.ccl-about .mv-section__row-list li::after { content: '✓'; position: absolute; left: .25rem; top: .35rem; color: #1F2937; font-weight: bold; font-size: .875rem; }

	.ccl-about .mv-section__row-list strong { color: #1E293B; font-weight: 700; }



	/* MV responsive */

	@media (max-width: 640px){

	 .ccl-about .mv-section { padding: 3rem 0; }

	 .ccl-about .mv-section__title { font-size: 2rem; }

	 .ccl-about .mv-section__lead { font-size: 1rem; }

	 .ccl-about .mv-section__values-title, .ccl-about .mv-section__rows-title { font-size: 1.75rem; }

	 .ccl-about .mv-section__card, .ccl-about .mv-section__row { padding: 1.75rem; }

	 .ccl-about .mv-section__value-item { padding: 1.75rem; }

	 .ccl-about .mv-section__row { grid-template-columns: 1fr; text-align: center; gap: 1.5rem; }

	 .ccl-about .mv-section__row-icon { margin: 0 auto; }

	 .ccl-about .mv-section__row-content { text-align: center; }

	 .ccl-about .mv-section__row-list { text-align: left; }

	}

	@media (min-width: 641px){ .ccl-about .mv-section__container { padding: 0 1.5rem; } .ccl-about .mv-section__values-grid { grid-template-columns: repeat(2,1fr); } .ccl-about .mv-section__title { font-size: 3rem; } }

	@media (min-width: 768px){ .ccl-about .mv-section__mission-vision { grid-template-columns: repeat(2,1fr); } }

	@media (min-width: 1024px){

	 .ccl-about .mv-section { padding: 7rem 0; }

	 .ccl-about .mv-section__header { margin-bottom: 6rem; }

	 .ccl-about .mv-section__title { font-size: 3.5rem; }

	 .ccl-about .mv-section__container { padding: 0 2rem; }

	 .ccl-about .mv-section__values-grid { grid-template-columns: repeat(3,1fr); }

	 .ccl-about .mv-section__rows { margin-top: 7rem; }

	}



	/* ===== CTA ===== */

	.ccl-about .ccl-cta-section { background: linear-gradient(135deg, rgba(14,43,92,.95) 0%, rgba(13,74,217,.95) 100%), url('data:image/svg+xml,<svg width="60" height="60" xmlns="http://www.w3.org/2000/svg"><rect width="1" height="1" x="0" y="0" fill="rgba(255,255,255,.02)"/><\/svg>'); color: var(--ccl-white); text-align: center; position: relative; overflow: hidden; }

	.ccl-about .ccl-cta-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(1000px 600px at 30% 50%, rgba(29,99,255,.15) 0%, transparent 60%), radial-gradient(800px 500px at 70% 50%, rgba(255,168,38,.1) 0%, transparent 60%); pointer-events: none; }

	.ccl-about .ccl-cta-section .ccl-section__inner { max-width: 900px; }

	.ccl-about .ccl-cta-section__title { color: var(--ccl-white); margin-bottom: 1.5rem; font-size: clamp(2rem, 5vw, 3.2rem); }

	.ccl-about .ccl-cta-section__text { color: rgba(255,255,255,.92); margin-bottom: 2.5rem; font-size: clamp(1.05rem, 2.2vw, 1.2rem); line-height: 1.75; max-width: 650px; margin-left: auto; margin-right: auto; }

	.ccl-about .ccl-cta-section__buttons { display: flex; gap: 1.25rem; justify-content: center; flex-wrap: wrap; }

	.ccl-about .ccl-cta-button { display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.05rem; border-radius: var(--ccl-radius); padding: 16px 32px; border: 0; cursor: pointer; text-decoration: none; transition: all .3s cubic-bezier(.4,0,.2,1); position: relative; overflow: hidden; }

	.ccl-about .ccl-cta-button::before { content: ""; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; transform: translate(-50%,-50%); transition: width .5s, height .5s; }

	.ccl-about .ccl-cta-button--primary { background: linear-gradient(135deg, var(--ccl-gold) 0%, var(--ccl-gold-light) 100%); color: var(--ccl-cta-text); box-shadow: 0 10px 30px rgba(255,168,38,.35), 0 0 0 0 rgba(255,168,38,.3); }

	.ccl-about .ccl-cta-button--primary::before { background: rgba(255,255,255,.25); }

	.ccl-about .ccl-cta-button--primary:hover { transform: translateY(-3px); box-shadow: 0 15px 40px rgba(255,168,38,.45), 0 0 0 8px rgba(255,168,38,.15); }

	.ccl-about .ccl-cta-button--primary:hover::before { width: 300px; height: 300px; }

	.ccl-about .ccl-cta-button--secondary { background: rgba(255,255,255,.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: var(--ccl-white); border: 2px solid rgba(255,255,255,.3); }

	.ccl-about .ccl-cta-button--secondary::before { background: rgba(255,255,255,.1); }

	.ccl-about .ccl-cta-button--secondary:hover { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.5); transform: translateY(-3px); box-shadow: 0 10px 30px rgba(0,0,0,.2); }

	.ccl-about .ccl-cta-button--secondary:hover::before { width: 300px; height: 300px; }



	/* ===== UTIL ===== */

	.ccl-about .mv-divider { border: 0; height: 2px; width: 100%; margin: 2.5rem 0 3rem; background: linear-gradient(90deg, rgba(37,99,235,.25), rgba(255,168,38,.25)); border-radius: 2px; }



	/* =========================================================

	   CCL — OUR PEOPLE (scoped & collision-safe)

	========================================================== */



	.ccl-people {

	  /* Scoped tokens (moved from :root) */

	  --p-primary: #0052FF;

	  --p-cta: #0052FF;

	  --p-ink: #111827;

	  --p-muted: #6B7280;

	  --p-line: #E5E7EB;

	  --p-bg: #F9FAFB;

	  --p-white: #fff;

	  --p-dark-bg: #0D244F;

	  --p-soft-blue: #EFF6FF;

	  --p-soft-blue-bd: #DBEAFE;



	  --radius: 16px;

	  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);

	  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);

	  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);



	  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

	  color: var(--p-ink);

	  line-height: 1.6;

	  background: #fff;

	}

	.ccl-people * { box-sizing: border-box; }

	.ccl-people h1, .ccl-people h2, .ccl-people h3, .ccl-people h4 {

	  font-family: "Inter Tight", Inter, system-ui, sans-serif;

	  color: var(--p-ink);

	  font-weight: 800;

	  letter-spacing: -.02em;

	  line-height: 1.2;

	  margin: 0 0 .65rem;

	}

	.ccl-people a { color: var(--p-primary); text-decoration: none; transition: color .2s ease; }

	.ccl-people a:hover { color: color-mix(in oklab, var(--p-primary) 80%, #073abf); }

	.ccl-people .container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }



	/* Unique pill (kicker) */

	.ccl-people .cclp-kicker {

	  font: 700 .8rem/1 Inter, system-ui, sans-serif;

	  letter-spacing: .1em; text-transform: uppercase;

	  color: var(--p-primary); background: var(--p-soft-blue);

	  display: inline-flex; align-items: center; gap: .5rem;

	  padding: .5rem 1rem; border-radius: 999px; margin-bottom: 1rem;

	  border: 1px solid var(--p-soft-blue-bd);

	}

	.ccl-people .cclp-kicker i { font-size: .9em; }



	.ccl-people .section-head { text-align:center; max-width: 750px; margin: 0 auto 3rem; }

	.ccl-people .section-head p { font-size: 1.1rem; color: var(--p-muted); }

	.ccl-people .section-head h2 { font-size: clamp(2rem, 4.5vw, 3rem); }



	/* ----------------- HERO ----------------- */

	.ccl-people .hero {

	  padding: clamp(70px, 10vw, 50px) 0;

	  background:

		radial-gradient(1400px 400px at 50% -5%, rgba(0,82,255,0.12), transparent 60%),

		linear-gradient(180deg, var(--p-bg), #fff 65%);

	  border-bottom: 1px solid var(--p-line);

	  min-height: inherit;

	}

	.ccl-people .hero .container { text-align: center; max-width: 980px; }

	.ccl-people .hero .cclp-kicker { margin-bottom: 1rem; }

	.ccl-people .hero h1 { color: var(--p-ink); font-size: clamp(2.6rem, 5vw, 3.6rem); font-weight: 900; letter-spacing: -0.03em; text-wrap: balance; }

	.ccl-people .hero p { color: var(--p-muted); font-size: clamp(1.05rem, 2.1vw, 1.2rem); margin: 0.75rem auto 0; max-width: 65ch; }

	.ccl-people .cta-row { margin-top: 2rem; display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

	.ccl-people .btn {

	  display: inline-flex; align-items: center; justify-content: center; gap: .75rem;

	  font-weight: 700; border: 1px solid transparent; border-radius: 12px; padding: 14px 24px;

	  cursor: pointer; transition: all .2s ease; font-size: 1rem;

	}

	.ccl-people .btn i { font-size: 0.95em; }

	.ccl-people .btn:hover { transform: translateY(-1.5px); box-shadow: var(--shadow-lg); }

	.ccl-people .btn--gold { background: var(--p-primary); color: #fff; box-shadow: var(--shadow-md); }

	.ccl-people .btn--gold:hover { background: #0045CC; }

	.ccl-people .btn--ghost { background: var(--p-white); border-color: var(--p-line); color: var(--p-ink); box-shadow: var(--shadow-sm); }

	.ccl-people .btn--ghost:hover { background: var(--p-soft-blue); border-color: var(--p-soft-blue-bd); }



	/* ----------------- TRUST BAR ----------------- */

	.ccl-people .trustbar { background: var(--p-white); padding: 16px 0; border-bottom: 1px solid var(--p-line); }

	.ccl-people .trustbar .row { display: flex; gap: 24px; flex-wrap: wrap; align-items: center; justify-content: center; }

	.ccl-people .cclp-pill {

	  display: inline-flex; align-items: center; gap: .6rem; padding: .6rem 1rem;

	  background: var(--p-bg); border: 1px solid var(--p-line); border-radius: 999px;

	  font-weight: 600; font-size: 0.9rem; color: var(--p-ink);

	}

	.ccl-people .cclp-pill i { color: var(--p-primary); }



	/* ----------------- DIRECTORY ----------------- */

	.ccl-people .dir { padding: clamp(50px, 8vw, 100px) 0; background: #fff; }

	.ccl-people .util { background: var(--p-white); border-radius: var(--radius); padding: 24px; margin: 0 0 2rem; z-index: 10;}

	.ccl-people .util-body { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: end; }

	.ccl-people .filter-group { display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; }

	.ccl-people .display-controls { display: flex; justify-content: flex-end; align-items: end; gap: 24px; }

	.ccl-people .ctrl { display: flex; flex-direction: column; gap: 8px; }

	.ccl-people .ctrl label { font-size: .85rem; font-weight: 600; color: var(--p-ink); }

	.ccl-people .field-wrapper { position: relative; }

	.ccl-people .field-wrapper i {

	  position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #9CA3AF; pointer-events: none;

	}

	.ccl-people .field, .ccl-people .select {

	  width: 100%; background: #fff; border: 1px solid var(--p-line); border-radius: 10px; padding: 12px 16px;

	  font: inherit; transition: all .2s ease; font-size: 1rem;

	}

	.ccl-people .field { padding-left: 42px; }

	.ccl-people .select{

	  -webkit-appearance: none; -moz-appearance: none; appearance: none;

	  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");

	  background-position: right 1rem center; background-repeat: no-repeat; background-size: 1.25em; padding-right: 2.5rem;

	}

	.ccl-people .field:focus, .ccl-people .select:focus { outline: none; border-color: var(--p-primary); box-shadow: 0 0 0 3px color-mix(in oklab, var(--p-primary) 20%, transparent); }

	.ccl-people .display-group { display: flex; align-items: center; gap: 12px; }

	.ccl-people .display-label { font-size: .85rem; font-weight: 600; color: var(--p-ink); white-space: nowrap; }

	.ccl-people .seg, .ccl-people .toggle {

	  display: inline-flex; border: 1px solid var(--p-line); border-radius: 10px; overflow: hidden; background: var(--p-bg); padding: 4px;

	}

	.ccl-people .seg button, .ccl-people .toggle button {

	  padding: 8px 14px; border: 0; background: transparent; font-weight: 600; cursor: pointer; transition: all .2s ease;

	  border-radius: 8px; color: var(--p-muted); font-size: 0.9rem;

	}

	.ccl-people .seg button:hover, .ccl-people .toggle button:hover { color: var(--p-ink); }

	.ccl-people .seg button[aria-pressed="true"], .ccl-people .toggle button[aria-pressed="true"] {

	  background: var(--p-white); color: var(--p-primary); box-shadow: var(--shadow-sm);

	}

	.ccl-people .bottom-row {

	  margin-top: 16px; display: flex; justify-content: space-between; align-items: center; padding-top: 16px; border-top: 1px solid var(--p-line);

	}

	.ccl-people #count { font-size: .9rem; font-weight: 500; color: var(--p-muted); }

	.ccl-people .reset {

	  border: 0; background: transparent; font-weight: 600; cursor: pointer; transition: all .2s ease; color: var(--p-primary);

	  padding: 8px 12px; border-radius: 8px;

	}

	.ccl-people .reset:hover { background: var(--p-soft-blue); }

	.ccl-people #active-filters { margin: -1.5rem 0 2rem; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

	.ccl-people #active-filters:not(:empty) { padding-top: 1.5rem; border-top: 1px dashed var(--p-line); margin-top: 1.5rem; }

	.ccl-people .filter-tag {

	  display: inline-flex; align-items: center; gap: 6px; background: var(--p-soft-blue); color: var(--p-primary);

	  font-size: 0.85rem; font-weight: 600; padding: 6px 10px; border-radius: 99px;

	}

	.ccl-people .filter-tag .remove-filter { border: none; background: none; cursor: pointer; color: var(--p-primary); opacity: 0.7; transition: opacity 0.2s; }

	.ccl-people .filter-tag .remove-filter:hover { opacity: 1; }

	.ccl-people .util-drawer { display: none; }



	/* Grid + base cards */

	@keyframes cclp-card-fade-in { from { opacity: 0; transform: translateY(15px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

	.ccl-people .grid {

	  display: grid; grid-template-columns: repeat(4, 1fr);

	  border-top: 1px solid var(--p-line); border-left: 1px solid var(--p-line);

	}

	.ccl-people .card {

	  border-right: 1px solid var(--p-line); border-bottom: 1px solid var(--p-line);

	  transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;

	  display: flex; flex-direction: column; padding: 1.25rem; text-align: center;

	}

	.ccl-people .card--animate-in { animation: cclp-card-fade-in 0.5s ease forwards; }

	.ccl-people .card:hover { background-color: var(--p-bg);box-shadow: var(--shadow-sm); }

	.ccl-people .card-content { flex-grow: 1; display: flex; flex-direction: column; align-items: center; }



	.ccl-people .avatar {

	  width: 104px; height: 104px; border-radius: 50%;

	  background: var(--p-soft-blue); overflow: hidden; display: grid; place-items: center;

	  font: 800 2rem "Inter Tight", sans-serif; color: var(--p-primary);

	  margin: 0 auto 1rem; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--p-soft-blue-bd), var(--shadow-sm);

	  flex-shrink: 0;

	}

	.ccl-people .avatar img { width: 100%; height: 100%; object-fit: cover; }

	

	.ccl-people .grid:not(.is-compact) .card { padding: 1.25rem 1.25rem 1rem; }

	.ccl-people .grid:not(.is-compact) .card-content { gap: .4rem; }

	.ccl-people .grid:not(.is-compact) .card .card-info {

	  display: grid; justify-items: center; gap: .25rem;

	  margin-top: .25rem;

	  padding-bottom: .25rem;

	}

	.ccl-people .grid:not(.is-compact) .card .name {

	  font-size: 1.2rem; font-weight: 800; letter-spacing: -0.02em; margin-bottom: 0; color: var(--p-ink);

	}

	.ccl-people .grid:not(.is-compact) .card .role {

	  font-size: .8rem; font-weight: 600; color: var(--p-muted); margin: 0;

	  background: var(--p-bg); padding: 0.2rem 0.6rem; border-radius: 6px; border: 1px solid var(--p-line);

	}

	.ccl-people .grid:not(.is-compact) .card .meta {

	  display: inline-flex; align-items: center; gap: .45rem;

	  font-size: .9rem; color: var(--p-muted); font-weight: 500;

	  margin-top: 0.25rem;

	}

	.ccl-people .grid:not(.is-compact) .card .meta i { color: var(--p-muted); font-size: .8em; }



	.ccl-people .actions {

	  display: flex; justify-content: center; align-items: center;

	  margin-top: .9rem; width: 100%; padding-top: .75rem;

	}

	.ccl-people .grid:not(.is-compact) .actions { border-top: 1px dashed var(--p-line); }

	.ccl-people .btn-sm {

	  font-size: .9rem; border: 1px solid var(--p-line); background: var(--p-white);

	  color: var(--p-ink); border-radius: 10px; padding: .65rem 1rem; font-weight: 700; cursor: pointer; text-align: center; transition: all .2s ease;

	}

	.ccl-people .btn-sm:hover { box-shadow: var(--shadow-sm); border-color: var(--p-primary); color: var(--p-primary); background-color: var(--p-soft-blue); }

	.ccl-people .btn-sm--primary { background: var(--p-primary); color: white; border-color: var(--p-primary); }

	.ccl-people .btn-sm--primary:hover { background: #0045CC; border-color: #0045CC; color: #fff; box-shadow: var(--shadow-sm); }

	

	.ccl-people .btn-group {

	  display: flex; width: 100%;

	  border: 1px solid var(--p-line); border-radius: 10px;

	  overflow: hidden; transition: box-shadow .2s ease;

	}

	.ccl-people .btn-group:hover { box-shadow: var(--shadow-sm); }

	.ccl-people .btn-group > .btn-sm {

	  flex: 1; border-radius: 0; border: none;

	  transition: background-color 0.2s ease, color 0.2s ease;

	}

	.ccl-people .btn-group > .btn-sm:hover { box-shadow: none; border-color: transparent; }

	.ccl-people .btn-group > a.btn-sm { color: var(--p-primary); }

	.ccl-people .btn-group > a.btn-sm:hover { background: var(--p-soft-blue); }

	.ccl-people .btn-group > .btn-sm--primary { background-color: var(--p-soft-blue); color: var(--p-primary); }

	.ccl-people .btn-group > .btn-sm--primary:hover { background-color: #DBEAFE; }

	.ccl-people .btn-group > .btn-sm:first-of-type { border-right: 1px solid var(--p-line); }



	.ccl-people .grid.is-compact { grid-template-columns: 1fr; gap: 0.75rem; border: none; }

	.ccl-people .grid.is-compact .card {

	  background: #fff; border: 1px solid var(--p-line); border-radius: var(--radius);

	  box-shadow: var(--shadow-sm); flex-direction: row; align-items: center; justify-content: space-between;

	  padding: 1rem 1.5rem; gap: 1rem; text-align: left;

	}

	.ccl-people .grid.is-compact .card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); background-color: #fff; }

	.ccl-people .grid.is-compact .card-content { padding: 0; border: none; flex-direction: row; align-items: center; gap: 1rem; }

	.ccl-people .grid.is-compact .avatar { width: 50px; height: 50px; margin: 0; font-size: 1.25rem; }

	.ccl-people .grid.is-compact .name { color: var(--p-ink); margin: 0; }

	.ccl-people .grid.is-compact .role { color: var(--p-primary); margin: 0.1rem 0 0; }

	.ccl-people .grid.is-compact .meta { display: none; }

	.ccl-people .grid.is-compact .actions { padding: 0; gap: 0.75rem; flex-shrink: 0; width: auto; margin:0; border:0; }

	.ccl-people .grid.is-compact .btn-sm { flex: 0 1 auto; white-space: nowrap; }



	/* Modal */

	@keyframes cclp-modal-fade-in { from { opacity: 0; } to { opacity: 1; } }

	@keyframes cclp-dialog-scale-up { from { transform: scale(0.95) translateY(10px); opacity: 0; } to { transform: scale(1) translateY(0); opacity: 1; } }

	.ccl-people .modal[hidden] { display: none; }

	.ccl-people .modal {

	  position: fixed; inset: 0; display: flex; align-items: center; justify-content: center;

	  padding: 1rem; background: rgba(17, 24, 39, 0.8); backdrop-filter: blur(8px); z-index: 9999;

	  animation: cclp-modal-fade-in 0.3s ease forwards;

	}

	.ccl-people .dialog {

	  width: 100%; max-width: 800px; background: #fff; box-shadow: var(--shadow-lg);

	  display: grid; grid-template-columns: 300px 1fr; padding: 0; overflow: hidden; max-height: 90vh;

	  animation: cclp-dialog-scale-up 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;

	}

	.ccl-people .pv-left {

	  background: var(--p-dark-bg);

	  padding: 2.5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative;

	}

	.ccl-people .pv-left .name { font-size: 1.75rem; color: var(--p-white); line-height: 1.2; margin-top: 1rem; }

	.ccl-people .pv-left .role { color: rgba(255,255,255,0.7); font-size: 1rem; margin-top: 0.25rem; }

	.ccl-people .pv-right { position: relative; padding: 2.5rem; overflow-y: auto; }

	.ccl-people .dialog .close {

	  position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;

	  border: 0; background: var(--p-bg); border-radius: 50%; cursor: pointer; z-index: 10; font-size: 1.2rem; color: var(--p-muted);

	}

	.ccl-people .dialog .close:hover { background: var(--p-line); color: var(--p-ink); }

	.ccl-people .pv-left .pv-avatar {

	  width: 140px; height: 140px; border-radius: 50%; background: var(--p-soft-blue); display: grid; place-items: center; overflow: hidden;

	  font: 800 4rem "Inter Tight", sans-serif; color: var(--p-primary); border: 4px solid var(--p-primary); box-shadow: var(--shadow-lg);

	}

	.ccl-people .pv-left .pv-avatar img { width: 100%; height: 100%; object-fit: cover; }

	.ccl-people .pv-meta { margin-top: 2rem; display: flex; flex-direction: column; gap: .75rem; width: 100%; align-items: stretch; }

	.ccl-people .pv-chip {

	  display: inline-flex; align-items: center; justify-content: center; gap: .75rem; border: 1px solid var(--p-line);

	  background: #fff; border-radius: 10px; padding: .75rem 1rem; font-weight: 600; text-decoration: none; transition: all .2s ease; color: var(--p-ink);

	}

	.ccl-people .pv-chip i { color: var(--p-muted); transition: color .2s ease; width: 20px; text-align: center; }

	.ccl-people .pv-chip:hover { background: var(--p-bg); border-color: var(--p-muted); color: var(--p-ink); transform: translateY(-2px); box-shadow: var(--shadow-sm); }

	.ccl-people .pv-chip:hover i { color: var(--p-primary); }

	.ccl-people .pv-chip--primary { background: var(--p-primary); color: white; border-color: var(--p-primary); }

	.ccl-people .pv-chip--primary i { color: white; }

	.ccl-people .pv-chip--primary:hover { background: #0045CC; border-color: #0045CC; color: #fff; }

	.ccl-people .pv-right h3 {

	  font-size: 1rem; font-weight: 700; color: var(--p-muted); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 1rem;

	}

	.ccl-people .pv-right .pv-bio { font-size: 1.1rem; line-height: 1.7; }



	/* HOW & FAQ */

	.ccl-people .how-faq { background: var(--p-bg); padding: clamp(70px, 8vw, 100px) 0; }

	.ccl-people .how-faq-grid {

	  display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: flex-start; margin-top: 3rem;

	}

	.ccl-people .how-col h4,

	.ccl-people .faq-col h4 { font-size: 1.5rem; margin-bottom: 1.5rem; font-weight: 800; }

	.ccl-people .how-items { display: grid; gap: 1.5rem; }

	.ccl-people .how-items .item {

	  text-align: left; background: #fff; border: 1px solid var(--p-line);

	  border-radius: var(--radius); padding: 1.5rem; display: flex; gap: 1.5rem; align-items: flex-start;

	  transition: transform .2s ease, box-shadow .2s ease;

	}

	.ccl-people .how-items .item:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }

	.ccl-people .how-items .item .step-number {

	  flex-shrink: 0; display: inline-block; width: 40px; height: 40px; line-height: 40px; border-radius: 50%;

	  background: var(--p-primary); color: var(--p-white); font-weight: 700; text-align: center; margin-top: 5px;

	}

	.ccl-people .how-items .item-content h4 { font-size: 1.1rem; margin: 0 0 0.5rem; }

	.ccl-people .how-items .item-content p { margin: 0; font-size: 0.95rem; color: var(--p-muted); }



	/* FAQ — animate + single-open */

	.ccl-people .faq details {

	  background: #fff; border: 1px solid var(--p-line); border-radius: 12px; margin-bottom: 1rem;

	  transition: box-shadow .2s ease, border-color .2s ease; overflow: hidden;

	}

	.ccl-people .faq details[open] { box-shadow: var(--shadow-md); border-color: color-mix(in oklab, var(--p-primary) 25%, var(--p-line)); }

	.ccl-people .faq summary {

	  font-size: 1.05rem; font-weight: 700; padding: 1.1rem 1.25rem; cursor: pointer;

	  list-style: none; display: flex; justify-content: space-between; align-items: center;

	}

	.ccl-people .faq summary::-webkit-details-marker { display: none; }

	.ccl-people .faq summary .q { display: inline-flex; align-items: center; gap: .6rem; }

	.ccl-people .faq summary .q i { color: var(--p-primary); }

	.ccl-people .faq summary .chev { flex-shrink: 0; transition: transform .3s ease; }

	.ccl-people .faq details[open] summary .chev { transform: rotate(180deg); }

	.ccl-people .faq .faq-panel { height: 0; overflow: hidden; transition: height .3s ease; will-change: height; }

	.ccl-people .faq .faq-content { padding: 0 1.25rem 1.25rem; color: var(--p-muted); }



	/* CAREERS */

	.ccl-people .careers { color: #fff; padding: clamp(70px, 10vw, 120px) 0; background: var(--p-dark-bg); }

	.ccl-people .careers .container { position: relative; text-align: center; }

	.ccl-people .careers .btn--ghost { background: transparent; border-color: rgba(255, 255, 255, 0.4); color: #fff; }

	.ccl-people .careers .btn--ghost:hover { background: rgba(255, 255, 255, 0.1); border-color: #fff; color: #fff; }

	.ccl-people .careers h2 { color: #fff; }

	.ccl-people .careers p { color: rgba(255,255,255,.9); max-width: 65ch; margin: 0 auto 2rem; font-size: 1.1rem; }

	.ccl-people .load-more-container { text-align: center; margin-top: 2.5rem; }

	.ccl-people #loadMore:hover { transform: translateY(-2px) scale(1.02); box-shadow: var(--shadow-md); }

	.ccl-people #loadMore.is-loading { pointer-events: none; }



	/* Responsive */

	@media (max-width: 1200px) { .ccl-people .grid:not(.is-compact) { grid-template-columns: repeat(3,1fr); } }

	@media (max-width: 992px) {

	  .ccl-people .grid:not(.is-compact) { grid-template-columns: repeat(2,1fr); }

	  .ccl-people .util-body { grid-template-columns: 1fr; }

	  .ccl-people .display-controls { justify-content: flex-start; }

	  .ccl-people .hero .container { grid-template-columns: 1fr; text-align: center; }

	  .ccl-people .how-faq-grid { grid-template-columns: 1fr; }

	}

	@media (max-width: 768px) {

	  .ccl-people .util { position: static; top: unset; }

	  .ccl-people .util-body { display: none; }

	  .ccl-people .util { padding: 16px; }

	  .ccl-people .util-drawer { display: block; }

	  .ccl-people .util-drawer summary {

		list-style: none; cursor: pointer; font-weight: 600; display: inline-flex; gap: .5rem; align-items: center;

		padding: 8px 12px; border-radius: 8px; background: var(--p-bg); border: 1px solid var(--p-line);

	  }

	  .ccl-people .util-drawer summary::-webkit-details-marker { display: none; }

	  .ccl-people .drawer-body { margin-top: 1rem; display: grid; gap: 1rem; }

	  .ccl-people .grid:not(.is-compact) { grid-template-columns: 1fr; }

	  .ccl-people .dialog { grid-template-columns: 1fr; max-height: 85vh; }

	  .ccl-people .pv-left { padding: 2.5rem 1.5rem 1.5rem; }

	  .ccl-people .pv-left .pv-avatar { width: 120px; height: 120px; font-size: 3rem; margin-bottom: 0; }

	  .ccl-people .pv-left .pv-meta { margin-top: 2rem; flex-direction: column; }

	  .ccl-people .pv-right { padding: 2rem 1.5rem; }

	}

	@media (max-width: 576px) {

	  .ccl-people .hero { padding: 60px 0; }

	  .ccl-people .hero h1 { font-size: 2.5rem; }

	  .ccl-people .cta-row { flex-direction: column; align-items: stretch; }

	  .ccl-people .pv-left .pv-meta { flex-direction: column; }

	  .ccl-people .card .actions .btn-group { flex-direction: column; border: none; border-radius: 0; gap: 0.5rem; }

	  .ccl-people .card .actions .btn-group > .btn-sm { border-radius: 10px; border: 1px solid var(--p-line); }

	  .ccl-people .card .actions .btn-group > .btn-sm:first-of-type { border-right: none; }

	  .ccl-people .card .actions .btn-group > .btn-sm--primary { border-color: var(--p-primary); }

	}

/* ==========================================================================

   CASE RESULTS MODULE — GLOBAL SCOPE (within .case-results-module)

   Purpose: Layout shell (hero, gates, list/grid, trust, insights, modal)

   NOTE: Vars live on .case-results-module to avoid leaking globally

   ========================================================================== */



.case-results-module {

  /* Theme tokens */

  --ccl-primary: #1d63ff;

  --ccl-cta-text: #0b0b0b;

  --ccl-gold: #ffa826;

  --ccl-gold-light: #ffc057;

  --ccl-white: #fff;



  /* Greys & base */

  --light-gray-bg:#f8f9fa;

  --white:#ffffff;

  --border-color:#e2e8f0;



  /* Text colors */

  --text-dark-slate:#1e293b;

  --text-slate:#334155;

  --text-soft-slate:#64748b;

  --text-light-slate:#475569;



  /* Accents */

  --cta-blue:#0b5cff;

  --cta-blue-dark:#0047d6;

  --dark-bg-gate:#131b31;

  --success-green:#10b981;

  --success-green-bg:rgba(16,185,129,.1);

  --section-bg-subtle: #f7faff;



  /* Shadows */

  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);

  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);

  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);



  /* Grid container padding */

  --container-pad: 24px;



  font-family:'Inter',sans-serif;

  background:var(--light-gray-bg);

  color:var(--text-slate);

  line-height:1.6;

  -webkit-font-smoothing:antialiased;

  -moz-osx-font-smoothing:grayscale;

}



/* Base resets (scoped) */

.case-results-module * { box-sizing:border-box; margin:0; padding:0 }

.case-results-module button,

.case-results-module input,

.case-results-module select { font-family:inherit }



/* Focus rings (a11y) */

.case-results-module input:focus-visible,

.case-results-module select:focus-visible,

.case-results-module button:focus-visible {

  outline:3px solid rgba(11,92,255,.3);

  outline-offset:2px

}



/* Content containers */

.case-results-module .container {

  width:100%;

  max-width:1380px;

  margin:0 auto;

  padding-inline:var(--container-pad);

  position:relative;

  z-index:2;

}

.case-results-module .container-fluid {

  --bs-gutter-x: 1.5rem;

  --bs-gutter-y: 0;

  width:100%;

  padding-right: calc(var(--bs-gutter-x) * 0.5);

  padding-left: calc(var(--bs-gutter-x) * 0.5);

  margin-right:auto;

  margin-left:auto;

}



/* Section shim */

.crp-section { background:var(--light-gray-bg); position:relative }



/* ==========================================================================

   HERO (top banner)

   ========================================================================== */



.case-results-module .hero-section {

  padding:clamp(70px, 10vw, 50px) 0;

  background:

	radial-gradient(1400px 400px at 50% -5%, rgba(0,82,255,0.12), transparent 60%),

	linear-gradient(180deg, var(--section-bg-subtle), #fff 65%);

  border-bottom:1px solid var(--border-color);

  text-align:center;

}

.case-results-module .hero-section .container { max-width:980px; }

.case-results-module .hero-section .crp-kicker { margin-bottom:1rem; }

.case-results-module .hero-section h1{

  color:var(--text-dark-slate);

  font-size:clamp(2.6rem, 5vw, 3.6rem);

  font-weight:900; letter-spacing:-0.03em;

  text-wrap:balance; margin:0

}

.case-results-module .hero-section .lede{

  color:var(--text-slate);

  font-size:clamp(1.05rem, 2.1vw, 1.2rem);

  margin:.75rem auto 0; max-width:65ch; line-height:1.6

}

.case-results-module .cta-row{

  margin-top:2rem; display:flex; gap:16px; justify-content:center; flex-wrap:wrap

}



/* Buttons (hero actions) */

.case-results-module .btn{

  display:inline-flex; align-items:center; justify-content:center; gap:.75rem;

  font-weight:700; border:1px solid transparent; border-radius:12px; padding:14px 24px;

  cursor:pointer; transition:all .2s ease; font-size:1rem; text-decoration:none

}

.case-results-module .btn i { font-size:.95em }

.case-results-module .btn:hover { transform:translateY(-1.5px); box-shadow:var(--shadow-lg) }

.case-results-module .btn--gold { background:var(--cta-blue); color:#fff; box-shadow:var(--shadow-md) }

.case-results-module .btn--gold:hover { background:var(--cta-blue-dark) }

.case-results-module .btn--ghost { background:var(--white); border-color:var(--border-color); color:var(--text-dark-slate); box-shadow:var(--shadow-sm) }

.case-results-module .btn--ghost:hover { background:var(--section-bg-subtle); border-color:#DBEAFE }



/* ==========================================================================

   GATE (location gating overlay confined to section wrapper)

   ========================================================================== */



.gated-content-wrapper{ position:relative }

.case-results-module.crp-is-gated .gated-content-wrapper .crp-gated-content{

  filter:blur(10px); pointer-events:none; user-select:none

}

.crp-sticky-gate-container{ position:relative; z-index:60 }

.crp-gate{

  position:absolute; top:0; left:50%; transform:translateX(-50%);

  width:100%; max-width:100%;

  display:flex; justify-content:center; align-items:flex-start; padding:0 20px; z-index:60

}

.crp-gate.is-fixed{ position:fixed; top:16px; left:50%; transform:translateX(-50%) }

.crp-gate.is-hidden{ visibility:hidden; pointer-events:none }

.crp-gate[hidden]{ display:none }



/* Gate panel */

.crp-gate__panel{

  background:rgba(19,27,49,.9); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);

  border:1px solid rgba(255,255,255,.15); border-radius:16px; padding:40px; max-width:500px; width:100%; color:#fff;

  box-shadow:0 25px 50px -12px rgba(0,0,0,.4)

}

.crp-gate__title{ font-size:32px; font-weight:800; margin:0 0 20px; text-align:center }

.crp-gate__notice{

  font-size:16px; color:rgba(255,255,255,.9); margin:0 0 16px; text-align:center; background:rgba(255,255,255,.1);

  padding:12px; border-radius:8px

}

.crp-gate__label{ display:block; font-size:16px; font-weight:600; margin:0 0 12px; color:rgba(255,255,255,.9) }

.crp-gate__select{

  width:100%; padding:14px 16px; border:1px solid rgba(255,255,255,.3); border-radius:8px; font-size:16px;

  background:rgba(255,255,255,.1); color:#fff; margin-bottom:20px; color-scheme:dark

}

.crp-gate__select option{ background:var(--dark-bg-gate); color:#fff }

.crp-gate__extra{ margin-top:20px; padding-top:20px; border-top:1px solid rgba(255,255,255,.2) }

.crp-gate__line{ font-size:18px; font-weight:600; margin:0 0 16px; text-align:center; color:#8fb4ff }

.crp-gate__q{ font-size:16px; color:rgba(255,255,255,.9); margin:0 0 16px; text-align:center }

.crp-gate__radios{ display:flex; gap:20px; justify-content:center; margin-bottom:20px }

.crp-radio{ display:flex; align-items:center; gap:8px; cursor:pointer; font-weight:600 }

.crp-radio input{ width:18px; height:18px }

.crp-gate__error{ display:block; color:#f87171; font-size:14px; margin:-12px 0 12px; min-height:1.2em; text-align:center }

.crp-gate__actions{ display:flex; flex-direction:column; gap:12px; margin-top:24px }

.crp-gate__continue{

  background:var(--cta-blue); color:#fff; border:none; padding:14px 24px; border-radius:8px; font-size:16px; font-weight:700; cursor:pointer; transition:background .2s ease

}

.crp-gate__continue:hover{ background:var(--cta-blue-dark) }

.crp-gate__cancel{ color:rgba(255,255,255,.7); text-align:center; text-decoration:none; font-size:14px }

.crp-gate__cancel:hover{ color:#fff }



/* ==========================================================================

   UTILITIES / FILTERS / CASE GRID

   ========================================================================== */



.crp-main{ display:flex; flex-direction:column; gap:24px; margin-top:24px }

.crp-util-bar{

  background:#fff; border-radius:16px; padding:24px;

  box-shadow:0 4px 8px rgba(30,41,59,.03),0 12px 24px rgba(30,41,59,.07);

  border:1px solid #f1f5f9; margin-top:40px;

  display:flex; flex-direction:column; gap:16px

}

.crp-util-body{ display:grid; grid-template-columns:1fr auto; gap:20px; align-items:flex-end }

.crp-util-footer{ padding-top:16px; border-top:1px solid var(--border-color); display:flex; align-items:center }

.crp-util-label{ display:block; font-size:13px; font-weight:600; color:var(--text-slate); margin-bottom:8px }



/* Filter chips */

.crp-filter-group .crp-filter-buttons{

  display:inline-flex; background:var(--light-gray-bg); border-radius:99px; padding:6px; border:1px solid #e2e8f0; position:relative

}

.crp-filter-indicator{

  position:absolute; top:6px; left:0; height:calc(100% - 12px); background:var(--cta-blue);

  border-radius:99px; box-shadow:0 4px 12px rgba(11,92,255,.2); transition:all .4s cubic-bezier(.25,1,.5,1); z-index:1

}

.crp-filter-btn{

  flex:1 1 0%; display:flex; align-items:center; justify-content:center; gap:8px; padding:8px 18px;

  background:transparent; border:none; border-radius:99px; font-size:14px; font-weight:600; color:var(--text-light-slate);

  cursor:pointer; transition:color .3s ease; white-space:nowrap; position:relative; z-index:2

}

.crp-filter-btn.is-active{ color:#fff }



/* Search & sort */

.crp-search-box{ position:relative }

.crp-search-box svg{

  position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:#94a3b8

}

.crp-search-box input, .crp-sort-control select{

  width:100%; height:42px; padding:10px 12px; border:1px solid #e2e8f0; border-radius:8px; font-size:14px; transition:border-color .2s ease;

  background:#f8fafc; color:var(--text-slate)

}

.crp-search-box input{ padding-left:36px }

.crp-search-box input:focus, .crp-sort-control select:focus{

  outline:none; border-color:var(--cta-blue); box-shadow:0 0 0 3px rgba(11,92,255,.2)

}

.crp-count{ font-weight:600; color:var(--text-light-slate); font-size:14px }

.crp-filter-select{ display:none }



/* Cases grid and card anatomy */

.crp-cases{ display:grid; grid-template-columns:repeat(3, 1fr); gap:24px }

.crp-card{

  background:#fff; border:1px solid var(--border-color); border-radius:12px; padding:24px; position:relative; overflow:hidden;

  display:flex; flex-direction:column; box-shadow:0 4px 6px -1px rgba(0,0,0,.05),0 2px 4px -2px rgba(0,0,0,.05);

  transition:all .3s cubic-bezier(.4,0,.2,1)

}

.crp-card:hover{ transform:translateY(-5px); box-shadow:0 10px 15px -3px rgba(30,41,59,.07),0 4px 6px -4px rgba(30,41,59,.07); border-color:#d1d9e4; background:#fafbff }

.crp-card::before{ content:""; position:absolute; top:0; left:0; width:4px; height:100%; background:var(--cta-blue); opacity:0; transition:opacity .3s ease }

.crp-card:hover::before{ opacity:1 }

.crp-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:12px }



/* Badges */

.crp-badge{ padding:4px 10px; border-radius:6px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.5px }

.crp-badge--motor{ background:rgba(59,130,246,.1); color:#2563eb; border:1px solid rgba(59,130,246,.2) }

.crp-badge--work{ background:rgba(245,158,11,.1); color:#d97706; border:1px solid rgba(245,158,11,.2) }

.crp-badge--medical{ background:rgba(236,72,153,.1); color:#db2777; border:1px solid rgba(236,72,153,.2) }

.crp-badge--public{ background:var(--success-green-bg); color:#059669; border:1px solid rgba(16,185,129,.2) }

.crp-status{ font-size:12px; font-weight:600; color:#059669; background:var(--success-green-bg); padding:4px 8px; border-radius:6px }



/* Card content */

.crp-title{ font:700 18px/1.3 "Inter Tight",Inter,sans-serif; color:var(--text-dark-slate); margin-bottom:12px }

.crp-desc{ font-size:14px; color:var(--text-light-slate); margin-bottom:16px; flex-grow:1 }

.crp-details{ display:flex; flex-direction:column; gap:8px; margin-bottom:16px; padding:12px; background:var(--light-gray-bg); border-radius:6px }

.crp-detail-item{ display:flex; justify-content:space-between; font-size:13px }

.crp-detail-label{ font-weight:600; color:var(--text-slate) }

.crp-detail-value{ color:var(--text-light-slate); text-align:right }



/* Payout row */

.crp-payout{

  display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; padding:12px 0;

  border-top:1px dashed #cbd5e1; border-bottom:1px dashed #cbd5e1

}

.crp-payout-amount{ font:800 20px/1 "Inter Tight",Inter,sans-serif; color:var(--success-green) }

.crp-payout-label{ font-size:12px; color:var(--text-soft-slate); font-weight:600 }



/* Card actions */

.crp-actions{ display:flex; justify-content:flex-end; align-items:center; gap:12px; margin-top:auto }

.crp-btn{ display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:8px; font-size:14px; font-weight:600; text-decoration:none; cursor:pointer; border:none; transition:all .2s ease }

.crp-btn--cta{ background:var(--cta-blue); color:#fff }

.crp-btn--cta:hover{ background:var(--cta-blue-dark) }

.crp-btn--dark{ background:var(--border-color); color:var(--text-light-slate); border:1px solid #cbd5e1 }

.crp-btn--dark:hover{ background:#cbd5e1 }

.crp-btn--sm{ padding:8px 12px; font-size:13px }

.crp-btn--lg{ padding:14px 28px; font-size:16px; font-weight:700 }



/* Load more */

.crp-load{ text-align:center; padding:20px 0 40px }

.crp-load .fa-spinner { display:none }

.crp-load button.is-loading .fa-spinner { display:inline-block; animation:spin 1s linear infinite }

.crp-load button.is-loading .load-text { display:none }

.crp-load button.is-loaded{

  background:var(--success-green-bg); color:var(--success-green); border-color:transparent; cursor:default

}

.crp-load button.is-loaded:hover{ transform:none; box-shadow:none; background:var(--success-green-bg) }

.crp-load button.is-loaded .load-text i{ margin-right:.5rem }



/* ==========================================================================

   TYPOGRAPHY / SECTION HEADERS (generic utility)

   ========================================================================== */



.page-section{ background:#fff; padding:clamp(90px, 12vw, 120px) 20px }

.page-section.bg-light{ background:var(--light-gray-bg) }



.crp-section-header{

  text-align:center; margin-bottom:clamp(50px, 8vw, 80px); max-width:850px; margin-inline:auto

}

.crp-kicker{

  font-size:.85rem; font-weight:800; letter-spacing:.12em; color:var(--cta-blue); text-transform:uppercase; margin:0 0 1rem;

  display:inline-block; padding:6px 16px; background:rgba(11,92,255,.08); border-radius:50px

}

.crp-section-title{

  font-family:'Inter Tight', sans-serif; font-weight:900; font-size:clamp(2rem, 4.8vw, 3.4rem);

  margin:0 0 1.25rem; color:var(--text-dark-slate); letter-spacing:-0.03em; line-height:1.15

}

.crp-hero .crp-section-title{ font-size:clamp(2.6rem, 5vw, 3.6rem); line-height:1.2 }

.crp-section-title mark{

  color:inherit; background:linear-gradient(180deg, transparent 62%, rgba(255,168,38,.28) 62% 92%, transparent 92%);

  padding:0 .18em; border-radius:6px; -webkit-box-decoration-break:clone; box-decoration-break:clone

}

.crp-section-lead{ font-size:clamp(1.05rem, 2.4vw, 1.2rem); line-height:1.6; color:var(--text-slate); max-width:65ch; margin:0 auto }



/* ==========================================================================

   TRUST SECTION

   ========================================================================== */



.trust-section{ padding:100px 0; background:var(--section-bg-subtle) }

.trust-section .container{

  display:grid; grid-template-columns:1fr 1.2fr; gap:3rem; align-items:center

}

.trust-grid{ display:grid; gap:1.5rem }

.trust-card{

  background:var(--white); border:1px solid var(--border-color); border-radius:16px; padding:32px;

  display:flex; gap:24px; align-items:flex-start; box-shadow:0 4px 8px rgba(30,41,59,.03); transition:all .2s ease

}

.trust-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md) }

.trust-card__icon{

  font-size:24px; color:var(--cta-blue); background:#eff6ff; width:56px; height:56px; border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:4px

}

.trust-card__title{

  font-family:'Inter Tight', sans-serif; font-size:20px; font-weight:800; color:var(--text-dark-slate); margin:0 0 8px; letter-spacing:-0.015em; line-height:1.3

}

.trust-card__text{ font-size:15px; color:var(--text-light-slate) }



/* ==========================================================================

   INSIGHTS (tabs + panels + cards)

   ========================================================================== */



.stats-section{ padding:80px 0 }

.stats-disclaimer{ font-size:12px; color:var(--text-soft-slate); margin-top:40px; max-width:800px; margin-inline:auto }



.insights-nav-container{ text-align:center }

.insights-hint{

  display:inline-flex; align-items:center; gap:.5rem; color:var(--text-slate); font-weight:600; margin-bottom:1rem; font-size:.9rem

}

.insights-hint i{ color:var(--cta-blue) }



.insights-tabs{

  display:inline-flex; justify-content:center; margin-bottom:32px; flex-wrap:wrap; background:#fff; border-radius:99px; padding:6px; border:1px solid var(--border-color); position:relative

}

.insights-tab-indicator{

  position:absolute; top:6px; left:0; height:calc(100% - 12px); background:var(--cta-blue);	margin-top: 6px;

  border-radius:99px; box-shadow:0 4px 12px rgba(11,92,255,.2); transition:all .4s cubic-bezier(.25,1,.5,1); z-index:1

}

.insights-tab-btn{

	flex: 1 1 0%;

	display: flex;

	align-items: center;

	justify-content: center;

	gap: 8px;

	padding: 8px 18px;

	background: transparent;

	border: none;

	border-radius: 99px;

	font-size: 14px;

	font-weight: 600;

	color: var(--text-light-slate);

	cursor: pointer;

	transition: color .3s ease;

	white-space: nowrap;

	position: relative;

	z-index: 2;

}

.insights-tab-btn.is-active{ color:#fff }



.insights-tab-panel{ display:none }

.insights-tab-panel.is-active{ display:block; animation:panel-fade-in .5s ease }



@keyframes panel-fade-in{

  from{ opacity:0; transform:translateY(10px) }

  to  { opacity:1; transform:translateY(0) }

}



/* Panel content */

.insight-panel-content{

  background:#fff; border:1px solid var(--border-color); border-radius:16px; padding:0; text-align:left; box-shadow:0 10px 25px -5px rgba(30,41,59,.05); overflow:hidden

}

.insight-panel-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0 }

.insight-column{ padding:32px }

.insight-column--direct{ background:#f8f9fa }

.insight-column--represented{ background:#eff6ff; border-left:1px solid var(--border-color) }

.insight-column__title{ font-size:18px; font-weight:800; font-family:'Inter Tight',sans-serif; margin:0 0 24px }

.insight-payout{ margin-bottom:24px }

.insight-payout__value{

  font-size:clamp(32px,5vw,44px); font-weight:800; font-family:'Inter Tight',sans-serif; color:var(--text-dark-slate); line-height:1.1; margin-bottom:4px

}

.insight-payout__label{

  font-size:13px; font-weight:600; color:var(--text-soft-slate); text-transform:uppercase; letter-spacing:.5px

}

.insight-divider{ border:none; height:1px; background:var(--border-color); margin:24px 0 }



/* Net gain callout */

.insight-net-gain{

  background:var(--success-green-bg); border:1px solid rgba(16,185,129,.2); border-radius:12px; padding:16px; margin-top:24px

}

.insight-net-gain__value{ font-size:28px; font-weight:800; font-family:'Inter Tight',sans-serif; color:var(--success-green) }

.insight-net-gain__label{ font-size:13px; font-weight:700; color:#047857 }



/* Panel footer */

.insight-footer{

  padding:32px; border-top:1px solid var(--border-color); display:grid; grid-template-columns:1fr 1fr; gap:24px; background:#f1f5f9

}

.insight-footer > div{

  background:var(--white); padding:24px; border-radius:12px; border:1px solid var(--border-color)

}

.insight-footer h4{

  font-size:16px; font-weight:700; color:var(--text-dark-slate); margin:0 0 16px; display:flex; align-items:center; gap:10px

}

.insight-footer h4 i{ color:var(--cta-blue) }



/* Timeline bar in footer blocks */

.insight-timeline .tl-bar{ margin-top:8px }

.tl-meta{ font-size:13px; color:var(--text-soft-slate) }

.tl-bar{

  height:10px; background:#eef2f7; border-radius:99px; overflow:hidden; border:1px solid #e2e8f0

}

.tl-fill{

  display:block; height:100%; background:linear-gradient(90deg,var(--cta-blue),#3b82f6);

  width:calc((var(--months,0)/36)*100%); transition:width 1.5s cubic-bezier(.19,1,.22,1)

}



/* Inline bullet lists */

.key-considerations ul{ list-style:none; padding-left:0 }

.key-considerations li{

  position:relative; padding-left:24px; font-size:14px; color:var(--text-light-slate)

}

.key-considerations li + li{ margin-top:8px }

.key-considerations li::before{

  content:'✔'; position:absolute; left:0; top:0; color:var(--cta-blue); font-weight:700

}



/* small factor list (arrow bullets) */

.insight-factors{ margin-top:1.5rem }

.insight-factors ul{ list-style:none; padding-left:0 }

.insight-factors li{

  position:relative; padding-left:22px; font-size:14px; margin-bottom:.5rem

}

.insight-factors li::before{

  content:'›'; position:absolute; left:0; top:0; font-weight:700; color:var(--cta-blue)

}



/* ==========================================================================

   INSIGHTS SUMMARY (cards beneath panels)

   ========================================================================== */



.insights-summary-grid{

  display:grid; grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));

  gap:24px; text-align:left; margin-top:40px

}

.insight-summary-card{

  background:var(--white); border:1px solid var(--border-color); border-radius:16px; padding:32px; box-shadow:0 4px 10px rgba(30,41,59,.04)

}

.summary-stat-value{

  font-size:3.5rem; font-weight:800; font-family:'Inter Tight', sans-serif; color:var(--cta-blue); line-height:1; margin-bottom:12px

}

.summary-stat-icon{

  font-size:2.5rem; color:var(--cta-blue); margin-bottom:12px; height:60px; width:60px;

  display:flex; align-items:center; justify-content:center; background:#eff6ff; border-radius:12px

}

.summary-stat-label{

  font-size:1.15rem; font-weight:800; font-family:'Inter Tight', sans-serif; color:var(--text-dark-slate); margin-bottom:8px

}

.summary-stat-desc{ font-size:.95rem; color:var(--text-slate) }



/* donut aid */

.summary-chart-container{ height:120px; display:flex; align-items:center; margin-bottom:12px }

.summary-chart{

  width:120px; height:120px; border-radius:50%;

  background:conic-gradient(var(--cta-blue) 0% 86%, var(--border-color) 86% 100%);

  display:flex; align-items:center; justify-content:center; position:relative

}

.summary-chart::before{

  content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);

  width:90px; height:90px; background:var(--white); border-radius:50%

}

.summary-chart-value{ font-size:1.8rem; font-weight:800; color:var(--text-dark-slate); z-index:1 }



/* global fine print under summaries */

.final-disclaimer{

  font-size:.8rem; color:var(--text-soft-slate);

  border-top:1px solid var(--border-color); padding-top:1.5rem; margin-top:2rem

}



/* ==========================================================================

   MODAL (case details)

   ========================================================================== */



.crp-modal{ position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:20px; animation:modal-fade-in .3s ease }

.crp-modal[hidden]{ display:none }

.crp-modal-overlay{ position:absolute; inset:0; background:rgba(15,23,42,.8); backdrop-filter:blur(8px) }

.crp-modal-content{

  position:relative; z-index:1; background:#fff; border-radius:16px; width:100%; max-width:800px; max-height:90vh;

  display:flex; flex-direction:column; overflow:hidden; box-shadow:0 20px 40px rgba(0,0,0,.3); animation:modal-scale-up .4s cubic-bezier(.16,1,.3,1)

}

.crp-modal-close{

  position:absolute; top:16px; right:16px; width:40px; height:40px; border-radius:50%; border:none; background:#f1f5f9;

  font-size:24px; color:var(--text-soft-slate); cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; transition:all .2s ease

}

.crp-modal-close:hover{ background:#e2e8f0; color:var(--text-dark-slate); transform:rotate(90deg) }

.crp-modal-header{ padding:32px; border-bottom:1px solid var(--border-color) }

.crp-modal-header .crp-badge{ margin-bottom:12px }

.crp-modal-header h2{ font-size:28px; line-height:1.2; font-family:'Inter Tight',sans-serif; margin:0 }

.crp-modal-body{ padding:32px; overflow-y:auto }

.crp-modal-grid{ display:grid; grid-template-columns:2fr 1fr; gap:32px }

.crp-modal-main h4{ font-size:16px; font-weight:700; color:var(--text-dark-slate); margin:0 0 8px; padding-bottom:8px; border-bottom:1px solid var(--border-color) }

.crp-modal-main p{ font-size:15px; color:var(--text-slate); margin:0 0 24px }

.crp-modal-sidebar h4{ font-size:16px; font-weight:700; color:var(--text-dark-slate); margin:0 0 12px }

.crp-modal-sidebar .crp-details, .crp-modal-sidebar .crp-payout{ margin-bottom:0 }



/* Animations (modal + loader) */

@keyframes modal-fade-in{ from{opacity:0} to{opacity:1} }

@keyframes modal-scale-up{ from{ transform:scale(.95); opacity:0 } to{ transform:scale(1); opacity:1 } }

@keyframes spin { from{ transform:rotate(0deg) } to{ transform:rotate(360deg) } }



/* ==========================================================================

   WHY REPRESENTATION v8 (scoped) — this is your redesigned v8 band

   (kept identical to your working version, but grouped/commented)

   ========================================================================== */



/* … (the complete .whyrep-v8 block you already pasted follows here unchanged)

   NOTE: It’s already included below your existing CSS in your paste.

   Keeping it as-is to avoid altering behavior.

*/



/* ==========================================================================

   RESPONSIVE ADJUSTMENTS

   ========================================================================== */



@media (max-width:992px){

  .trust-section .container{ grid-template-columns:1fr; text-align:center }

  .crp-util-body{ grid-template-columns:1fr 1fr; gap:16px }

  .crp-filter-group{ grid-column:1 / -1 }

  .crp-cases{ grid-template-columns:repeat(2,1fr) }

}



@media (max-width:768px){

  .crp-util-body{ grid-template-columns:1fr }

  .crp-filter-group .crp-filter-buttons{ display:none }

  .crp-filter-select{

	display:block; width:100%; height:42px; padding:10px 12px; border:1px solid #e2e8f0; border-radius:8px; font-size:14px; transition:border-color .2s ease;

	background:#f8fafc; color:var(--text-slate)

  }

  .insight-panel-grid, .insight-footer{ grid-template-columns:1fr }

  .insight-column--represented{ border-left:none; border-top:1px solid var(--border-color) }

  .crp-modal-grid{ grid-template-columns:1fr }

  .crp-modal-sidebar{ grid-row:1; margin-bottom:24px }

  .crp-cases{ grid-template-columns:1fr }

}

/* ===========================

   WHY REPRESENTATION v8 (scoped)

   =========================== */



.crx-container .whyrep-v8{

  /* module tokens */

  --c-primary: #0b5cff;

  --c-primary-light: #eff6ff;

  --c-primary-border: #dbeafe;



  --c-secondary: #10b981;

  --c-secondary-light: #f0fdf4;

  --c-secondary-border: #bbf7d0;



  --c-tertiary: #f59e0b;

  --c-tertiary-light: #fffbeb;

  --c-tertiary-border: #fde68a;



  --c-text-dark: #0f172a;

  --c-text: #334155;

  --c-text-soft: #64748b;



  --c-bg-light: #f7faff;

  --c-border: #e2e8f0;

  --c-muted-bg: #f8fafc;

  --c-muted-border: #e2e8f0;



  --c-shadow-sm: 0 6px 16px rgba(2,6,23,.06);

  --c-shadow-md: 0 8px 18px rgba(2,6,23,.06);



  display:block;

  margin-top:80px;

  margin-bottom:80px;

}



/* Header */

.crx-container .whyrep-v8 .whyrepv8-head{

  text-align:left;

  margin:0;

  max-width:800px;

}

.crx-container .whyrep-v8 .crx-kicker{

  font:800 12px/1 'Inter', system-ui, sans-serif;

  letter-spacing:.06em;

  text-transform:uppercase;

  color:var(--c-primary);

  margin-bottom:8px;

}

.crx-container .whyrep-v8 .crx-section-title{

  font:900 2.5rem/1.2 'Inter Tight','Inter',system-ui,sans-serif;

  color:var(--c-text-dark);

  margin:0 0 12px;

}

.crx-container .whyrep-v8 .crx-section-title mark{

  background-color:var(--c-primary-light);

  color:var(--c-primary);

  padding:0 8px;

  border-radius:6px;

}

.crx-container .whyrep-v8 .crx-section-lead{

  font-size:1.125rem;

  color:var(--c-text);

  margin:0 0 24px;

}



/* Hero Comparison */

.crx-container .whyrep-v8 .whyrepv8-hero-compare{

  background:var(--c-primary);

  border:1px solid var(--c-primary-border);

  border-radius:18px;

  padding:24px;

  box-shadow:var(--c-shadow-md);

}

.crx-container .whyrep-v8 .hero-new-grid{

  display:grid;

  grid-template-columns:2fr 1fr;

  gap:20px;

  align-items:center;

}

.crx-container .whyrep-v8 .hero-main-card{

  background:#fff;

  border-radius:12px;

  padding:20px 24px;

  text-align:left;

  box-shadow:var(--c-shadow-sm);

}

.crx-container .whyrep-v8 .hero-multiplier{

  background:var(--c-primary);

  color:#fff;

  font:800 1.25rem/1 'Inter Tight','Inter',sans-serif;

  padding:10px 14px;

  border-radius:10px;

  text-align:center;

  display:inline-block;

}

.crx-container .whyrep-v8 .hero-multiplier span{

  display:block;

  font:600 13px/1.2 'Inter',sans-serif;

  color:rgba(255,255,255,.8);

  margin-top:2px;

}

.crx-container .whyrep-v8 .hero-main-value{

  font:900 3.5rem/1.1 'Inter Tight','Inter',sans-serif;

  color:var(--c-text-dark);

  margin:16px 0 4px;

}

.crx-container .whyrep-v8 .hero-main-label{

  font:700 15px/1.2 'Inter',system-ui;

  color:var(--c-text);

}

.crx-container .whyrep-v8 .hero-compare-card{

  background:rgba(255,255,255,.1);

  border:1px solid rgba(255,255,255,.3);

  border-radius:12px;

  padding:20px 24px;

  text-align:center;

  color:#fff;

}

.crx-container .whyrep-v8 .hero-compare-value{

  font:900 2.5rem/1.1 'Inter Tight','Inter',sans-serif;

  color:#fff;

  margin:0 0 4px;

}

.crx-container .whyrep-v8 .hero-compare-label{

  font:600 14px/1.2 'Inter',system-ui;

  color:rgba(255,255,255,.8);

}



/* Notes */

.crx-container .whyrep-v8 .cmp-note{

  margin-top:16px;

  font-size:13px;

  color:var(--c-text-soft);

  background-color:#fff;

  padding:10px 12px;

  border-radius:8px;

}

.crx-container .whyrep-v8 .whyrepv8-hero-compare .cmp-note{

  color:rgba(255,255,255,.9);

  background-color:rgba(255,255,255,.1);

  border:1px solid rgba(255,255,255,.2);

}



/* Subsection title */

.crx-container .whyrep-v8 .crx-subsection-title{

  text-align:center;

  font:900 1.75rem/1.2 'Inter Tight','Inter',system-ui,sans-serif;

  color:var(--c-text-dark);

  margin:64px 0 24px;

}



/* Benefits grid (2x2) */

.crx-container .whyrep-v8 .whyrepv8-benefits-grid{

  display:grid;

  grid-template-columns:repeat(2,minmax(0,1fr));

  gap:20px;

  margin-top:40px;

}

.crx-container .whyrep-v8 .rail-chip{

  display:flex; gap:14px; align-items:flex-start;

  background:#fff; border:1px solid var(--c-border);

  border-radius:12px; padding:16px;

  box-shadow:var(--c-shadow-sm);

}

.crx-container .whyrep-v8 .rail-chip i{

  width:38px; height:38px; border-radius:10px; display:grid; place-items:center;

  background:var(--c-primary-light); color:var(--c-primary);

  flex:0 0 38px; font-size:16px;

}

.crx-container .whyrep-v8 .rail-chip h4{

  margin:0 0 2px;

  font:800 16px/1.25 'Inter Tight','Inter',sans-serif;

  color:var(--c-text-dark);

}

.crx-container .whyrep-v8 .rail-chip p{

  margin:0; font-size:14px; color:var(--c-text);

}



/* Timeline (horizontal) */

.crx-container .whyrep-v8 .whyrepv8-flow-grid{

  display:grid;

  grid-template-columns:repeat(5,minmax(0,1fr));

  gap:20px;

  margin-top:24px;

  position:relative;

}

.crx-container .whyrep-v8 .whyrepv8-flow-grid::before{

  content:"";

  position:absolute; left:10%; right:10%; top:20px;

  height:3px; background:var(--c-primary-border); z-index:0;

}

.crx-container .whyrep-v8 .flow-item{

  text-align:center; position:relative; z-index:1;

}

.crx-container .whyrep-v8 .flow-dot{

  width:40px; height:40px; border-radius:50%; display:grid; place-items:center;

  margin:0 auto 12px; background:#fff; color:var(--c-primary);

  border:3px solid var(--c-primary);

  font:800 15px/1 'Inter',sans-serif;

  box-shadow:0 0 0 4px #fff;

}

.crx-container .whyrep-v8 .flow-body h4{

  margin:2px 0 4px;

  font:800 16px/1.25 'Inter Tight','Inter',sans-serif;

  color:var(--c-text-dark);

}

.crx-container .whyrep-v8 .flow-body p{

  margin:0; color:var(--c-text); font-size:14px;

}



/* Quote */

.crx-container .whyrep-v8 .whyrepv8-quote{

  margin:64px auto 0;

  background:var(--c-text-dark); color:#e2e8f0;

  border-radius:12px; padding:24px 28px;

  font:600 1.25rem/1.55 'Inter',system-ui,sans-serif;

  max-width:800px; text-align:center;

  border-left:6px solid var(--c-primary);

  box-shadow:0 10px 22px -12px rgba(2,6,23,.35);

}



/* Disclaimer */

.crx-container .whyrep-v8 .final-disclaimer{

  text-align:left; margin:40px auto 0;

  font-size:13px; color:var(--c-text-soft);

  background-color:var(--c-muted-bg);

  border:1px solid var(--c-muted-border);

  padding:20px 24px; line-height:1.7;

}

.crx-container .whyrep-v8 .final-disclaimer strong{ color:var(--c-text-dark); }



/* Responsive */

@media (max-width: 992px){

  .crx-container .whyrep-v8 .whyrepv8-benefits-grid{ grid-template-columns:1fr; }

  .crx-container .whyrep-v8 .whyrepv8-flow-grid{

	grid-template-columns:1fr; gap:24px;

  }

  .crx-container .whyrep-v8 .whyrepv8-flow-grid::before{ display:none; }



  .crx-container .whyrep-v8 .flow-item{

	text-align:left; display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start;

  }

  .crx-container .whyrep-v8 .flow-dot{ margin:0; }

  .crx-container .whyrep-v8 .flow-body h4{ margin-top:2px; }



  .crx-container .whyrep-v8 .flow-item:not(:last-child)::after{

	content:""; position:absolute; bottom:-12px; left:20px; transform:translateX(-50%);

	width:3px; height:24px; background:var(--c-primary-border); z-index:-1;

  }



  .crx-container .whyrep-v8 .crx-section-title{ font-size:2rem; }

  .crx-container .whyrep-v8 .crx-section-lead{ font-size:1rem; }

}

@media (max-width: 720px){

  .crx-container .whyrep-v8 .hero-new-grid{ grid-template-columns:1fr; }

  .crx-container .whyrep-v8 .hero-main-card{ text-align:center; }

  .crx-container .whyrep-v8 .hero-main-value{ font-size:3rem; }

  .crx-container .whyrep-v8 .whyrepv8-quote{ font-size:1.125rem; }

  .crx-container .whyrep-v8 .crx-section-title{ font-size:1.75rem; }

}

/* Tabs container remains relative */

.insights-tabs{

  display:inline-flex;

  justify-content:center;

  margin-bottom:32px;

  flex-wrap:wrap;

  background:#fff;

  border-radius:99px;

  padding:6px;

  border:1px solid var(--border-color);

  position:relative; /* required for absolute indicator */

}



/* Indicator: allow dynamic sizing + 2D movement */

.insights-tab-indicator{

  position:absolute;

  top:0; left:0;               /* actual position set via transform below */

  height:36px;                 /* JS will update for the active button */

  width:36px;                  /* JS will update for the active button */

  background:var(--cta-blue);

  border-radius:999px;

  box-shadow:0 4px 12px rgba(11,92,255,.2);

  z-index:1;

  /* Animate width/height and 2D movement smoothly */

  transition:

	transform .35s cubic-bezier(.25,1,.5,1),

	width .25s ease,

	height .25s ease;

}



/* Keep the active button text white on top of the indicator */

.insights-tab-btn{

  position:relative;

  z-index:2;

}



/* Optional: tighter tap targets on very small screens */

@media (max-width: 420px){

  .insights-tab-btn { padding: 10px 14px; }

}

/* Gate: when fixed, sit below the sticky header (fallback = 16px) */

.crp-gate.is-fixed{

  top: calc(var(--sticky-header-h, 16px) + env(safe-area-inset-top, 0px) + 8px);

}



/* Keep the gate panel fully visible on short viewports */

.crp-gate__panel{

  max-height: calc(100vh - var(--sticky-header-h, 0px) - env(safe-area-inset-top, 0px) - 32px);

  overflow: auto;

}

/* ========== Insights tabs: mobile-friendly pills ========== */



/* The indicator remains for single-row layouts; we’ll toggle it off via a class */

.insights-tabs.tabs-wrapped .insights-tab-indicator {

  display: none;

}



/* Give buttons a consistent pill look; the active one is a filled chip on mobile */

.insights-tab-btn {

  border: 1px solid transparent;           /* default: no visible border on desktop */

  transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;

}



/* Mobile layout: when tabs wrap (we set .tabs-wrapped via JS) */

.insights-tabs.tabs-wrapped {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;                                 /* spacing between chips */

  padding: 10px;                            /* comfortable padding */

  border-radius: 16px;

}



/* In wrapped mode, each button becomes its own chip */

.insights-tabs.tabs-wrapped .insights-tab-btn {

  padding: 10px 14px;

  border-radius: 999px;

  border-color: var(--border-color);

  background: #fff;

  color: var(--text-slate);

}



/* Active chip in wrapped mode */

.insights-tabs.tabs-wrapped .insights-tab-btn.is-active {

  background: var(--cta-blue);

  color: #fff;

  border-color: transparent;

  box-shadow: 0 6px 14px rgba(11,92,255,.22);

}



/* Optional: slightly tighter chips on very small screens */

@media (max-width: 420px){

  .insights-tabs.tabs-wrapped .insights-tab-btn {

	padding: 9px 12px;

  }

}

	/* ===========================

	  DESIGN SYSTEM

	  =========================== */

	#ccl-injury-calculator-module {

	  --primary:#0b5cff;

	  --primary-dark:#0047d6;

	  --primary-light:#3d7fff;

	  --primary-100:#eff6ff;

	  --primary-50:#f0f7ff;



	  --accent:#10b981;

	  --accent-light:#d1fae5;

	  --accent-dark:#059669;



	  --warning:#f59e0b;

	  --warning-light:#fef3c7;



	  --ink:#0f172a;

	  --text:#334155;

	  --soft:#64748b;

	  --subtle:#94a3b8;



	  --line:#e2e8f0;

	  --bg:#ffffff;

	  --bg-subtle:#f7faff;

	  --bg-card:#fafbfc;



	  --r-sm:10px;

	  --r-md:16px;

	  --r-lg:20px;

	  --r-xl:24px;



	  --shadow-sm:0 2px 8px rgba(2,6,23,.06);

	  --shadow-md:0 4px 16px rgba(2,6,23,.08);

	  --shadow-card:0 10px 28px rgba(2,6,23,.08);

	  --shadow-brand:0 12px 34px rgba(11,92,255,.22);

	  --shadow-hover:0 20px 48px rgba(2,6,23,.14);

	  

	  /* Styles from 'body' tag */

	  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;

	  color:var(--text);

	  background:#fff;

	  line-height:1.65;

	  -webkit-font-smoothing:antialiased;

	  -moz-osx-font-smoothing:grayscale;

	}

	

	#ccl-injury-calculator-module *{box-sizing:border-box}



	#ccl-injury-calculator-module h1,

	#ccl-injury-calculator-module h2,

	#ccl-injury-calculator-module h3,

	#ccl-injury-calculator-module h4{color:var(--ink); margin:0 0 .5rem; line-height:1.15}

	#ccl-injury-calculator-module h1{font-family:"Inter Tight",Inter,sans-serif; font-weight:900}

	#ccl-injury-calculator-module h2,

	#ccl-injury-calculator-module h3{font-weight:800}

	#ccl-injury-calculator-module h4{font-weight:700}

	#ccl-injury-calculator-module a{text-decoration:none; color:inherit}

	#ccl-injury-calculator-module img{max-width:100%; display:block}

	#ccl-injury-calculator-module p{margin:0 0 1rem}



	#ccl-injury-calculator-module .os-container{max-width:1380px; margin:0 auto; padding:0 24px}

	#ccl-injury-calculator-module .os-grid{display:grid; gap:24px}

	#ccl-injury-calculator-module .os-grid-2{grid-template-columns:1fr 1fr}

	#ccl-injury-calculator-module .os-grid-3{grid-template-columns:repeat(3,1fr)}

	#ccl-injury-calculator-module .os-grid-4{grid-template-columns:repeat(4,1fr)}

	@media (max-width:980px){ 

	  #ccl-injury-calculator-module .os-grid-2,

	  #ccl-injury-calculator-module .os-grid-3,

	  #ccl-injury-calculator-module .os-grid-4{ grid-template-columns:1fr } 

	}



	/* ===========================

	  COMPONENTS

	  =========================== */

	#ccl-injury-calculator-module .os-badge{

	  display:inline-flex; align-items:center; gap:8px;

	  padding:10px 18px; border-radius:999px;

	  background:linear-gradient(135deg, var(--accent-light), #a7f3d0);

	  color:var(--accent-dark);

	  font:700 13px/1 Inter,system-ui,sans-serif; 

	  letter-spacing:.05em; 

	  text-transform:uppercase;

	  border:1px solid rgba(16,185,129,.2);

	}



	#ccl-injury-calculator-module .os-btn{

	  display:inline-flex; align-items:center; justify-content:center; gap:10px;

	  padding:16px 32px; border-radius:14px; border:2px solid transparent;

	  font:700 16px/1.2 Inter,system-ui; cursor:pointer; transition:all .3s ease;

	  position:relative; overflow:hidden;

	}

	#ccl-injury-calculator-module .os-btn--primary{ 

	  background:linear-gradient(135deg, var(--primary), var(--primary-light)); 

	  color:#fff; 

	  box-shadow:var(--shadow-brand);

	  border:2px solid var(--primary);

	}

	#ccl-injury-calculator-module .os-btn--primary:hover{ 

	  transform:translateY(-2px);

	  box-shadow:0 16px 40px rgba(11,92,255,.3);

	}

	#ccl-injury-calculator-module .os-btn--outline{

	  background:transparent; 

	  border:2px solid var(--primary); 

	  color:var(--primary);

	}

	#ccl-injury-calculator-module .os-btn--outline:hover{ 

	  background:var(--primary);

	  color:#fff;

	}

	#ccl-injury-calculator-module .os-btn--large{

	  padding:20px 40px;

	  font-size:18px;

	}



	/* Select Dropdown */

	#ccl-injury-calculator-module select.hero-select{

	  appearance:none; 

	  background-color:#fff;

	  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%230b5cff' stroke-width='2' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");

	  background-repeat:no-repeat; 

	  background-position:right 1rem center; 

	  background-size:1.25em 1.25em;

	  padding:18px 3.5rem 18px 24px;

	  border:2px solid var(--line); 

	  border-radius:14px;

	  height:62px; 

	  width:100%; 

	  font:600 16px Inter,system-ui;

	  color:var(--text);

	  box-shadow:var(--shadow-sm);

	  transition:all .3s ease;

	}

	#ccl-injury-calculator-module select.hero-select:hover{

	  border-color:rgba(11,92,255,.4);

	}

	#ccl-injury-calculator-module select.hero-select:focus{ 

	  outline:0; 

	  border-color:var(--primary); 

	  box-shadow:0 0 0 4px rgba(11,92,255,.12), var(--shadow-card);

	}



	#ccl-injury-calculator-module .kcp_counsils_err{

	  display:none;

	  color:#dc2626;

	  font-size:14px;

	  font-weight:600;

	  margin-top:12px;

	  padding:12px 16px;

	  background:#fef2f2;

	  border-radius:10px;

	  border:1px solid #fecaca;

	}



	/* ===========================

	  HERO

	  =========================== */

	#ccl-injury-calculator-module .os-hero{ 

	  position:relative; 

	  overflow:hidden;

	  padding:100px 0 120px;

	}

	#ccl-injury-calculator-module .os-hero::before{

	  content:""; 

	  position:absolute; 

	  inset:0; 

	  z-index:-1;

	  background:

		radial-gradient(1400px 500px at 10% -5%, rgba(11,92,255,.12) 0%, transparent 50%),

		radial-gradient(1400px 500px at 90% -5%, rgba(16,185,129,.1) 0%, transparent 50%),

		linear-gradient(180deg,#fff 0%, #f8fbff 40%, #f0f7ff 100%);

	}

	

	#ccl-injury-calculator-module .os-hero__grid{

	  display:grid;

	  gap:64px;

	  align-items:center;

	}

	@media (min-width:980px){

	  #ccl-injury-calculator-module .os-hero__grid{

		grid-template-columns:1.1fr .9fr;

	  }

	}



	#ccl-injury-calculator-module .os-hero__title{

	  font-size:clamp(40px,6vw,72px);

	  line-height:1.05;

	  margin:24px 0;

	  background:linear-gradient(135deg, var(--ink) 0%, #1e3a8a 100%);

	  -webkit-background-clip:text;

	  -webkit-text-fill-color:transparent;

	  background-clip:text;

	}

	

	#ccl-injury-calculator-module .os-hero__subtitle{

	  font-size:clamp(18px,2.4vw,22px);

	  line-height:1.6;

	  color:var(--text);

	  margin-bottom:32px;

	}



	#ccl-injury-calculator-module .os-hero__stats{

	  display:flex;

	  gap:32px;

	  flex-wrap:wrap;

	  margin-top:40px;

	  padding-top:32px;

	  border-top:1px solid var(--line);

	}



	#ccl-injury-calculator-module .os-hero__stat{

	  display:flex;

	  align-items:center;

	  gap:12px;

	}



	#ccl-injury-calculator-module .os-hero__stat-icon{

	  width:48px;

	  height:48px;

	  border-radius:12px;

	  background:linear-gradient(135deg, var(--primary-100), #dbeafe);

	  color:var(--primary);

	  display:grid;

	  place-items:center;

	  font-size:20px;

	}



	#ccl-injury-calculator-module .os-hero__stat-label{

	  font-size:13px;

	  color:var(--soft);

	  line-height:1.2;

	  margin-bottom:2px;

	}



	#ccl-injury-calculator-module .os-hero__stat-value{

	  font:800 20px/1 Inter,system-ui;

	  color:var(--ink);

	}



	#ccl-injury-calculator-module .os-hero__form-card{

	  background:linear-gradient(135deg, #fff 0%, #fafbff 100%);

	  padding:0;

	  border-radius:28px;

	  box-shadow:0 24px 80px rgba(11,92,255,.2), 0 0 0 1px rgba(11,92,255,.08);

	  border:2px solid rgba(11,92,255,.12);

	  overflow:hidden;

	  position:relative;

	}



	#ccl-injury-calculator-module .os-hero__form-card::before{

	  content:"";

	  position:absolute;

	  top:0;

	  left:0;

	  right:0;

	  height:6px;

	  background:linear-gradient(90deg, var(--primary), var(--accent));

	}



	#ccl-injury-calculator-module .os-hero__form-header{

	  background:linear-gradient(135deg, var(--primary), var(--primary-light));

	  padding:32px 40px;

	  text-align:center;

	  position:relative;

	  overflow:hidden;

	}



	#ccl-injury-calculator-module .os-hero__form-header::before{

	  content:"";

	  position:absolute;

	  top:-50%;

	  right:-20%;

	  width:200px;

	  height:200px;

	  background:radial-gradient(circle, rgba(255,255,255,.15) 0%, transparent 70%);

	  border-radius:50%;

	}



	#ccl-injury-calculator-module .os-hero__form-icon{

	  width:64px;

	  height:64px;

	  margin:0 auto 16px;

	  border-radius:16px;

	  background:rgba(255,255,255,.2);

	  backdrop-filter:blur(10px);

	  display:grid;

	  place-items:center;

	  font-size:28px;

	  color:#fff;

	  box-shadow:0 8px 20px rgba(0,0,0,.15);

	}



	#ccl-injury-calculator-module .os-hero__form-title{

	  font:800 26px/1.2 "Inter Tight",Inter,sans-serif;

	  color:#fff;

	  margin-bottom:8px;

	  position:relative;

	}



	#ccl-injury-calculator-module .os-hero__form-subtitle{

	  font-size:15px;

	  color:rgba(255,255,255,.85);

	  margin:0;

	  position:relative;

	}



	#ccl-injury-calculator-module .os-hero__form-body{

	  padding:40px;

	}



	#ccl-injury-calculator-module .os-hero__form-label{

	  display:block;

	  font:700 15px/1.4 Inter,system-ui;

	  color:var(--ink);

	  margin-bottom:12px;

	}



	/* ===========================

	  TRUST BAR

	  =========================== */

	#ccl-injury-calculator-module .os-trust-bar{

	  background:#fff;

	  padding:64px 0;

	  border-top:1px solid var(--line);

	  border-bottom:1px solid var(--line);

	}



	#ccl-injury-calculator-module .os-trust-items{

	  display:flex;

	  justify-content:space-around;

	  align-items:center;

	  gap:48px;

	  flex-wrap:wrap;

	}



	#ccl-injury-calculator-module .os-trust-item{

	  text-align:center;

	  flex:1;

	  min-width:200px;

	}



	#ccl-injury-calculator-module .os-trust-value{

	  font:900 36px/1 "Inter Tight",Inter,sans-serif;

	  color:var(--primary);

	  margin-bottom:8px;

	}



	#ccl-injury-calculator-module .os-trust-label{

	  font:600 15px/1.4 Inter,system-ui;

	  color:var(--text);

	}



	/* ===========================

	  WHY CHOOSE US

	  =========================== */

	#ccl-injury-calculator-module .os-why-choose{

	  padding:100px 0;

	  background:linear-gradient(180deg, #fff 0%, var(--bg-subtle) 100%);

	}



	#ccl-injury-calculator-module .os-section-header{

	  text-align:center;

	  max-width:800px;

	  margin:0 auto 64px;

	}

	

	#ccl-injury-calculator-module .os-section-kicker{

	  display:inline-block;

	  font:700 13px/1 Inter,system-ui;

	  color:var(--primary);

	  text-transform:uppercase;

	  letter-spacing:.1em;

	  margin-bottom:16px;

	}



	#ccl-injury-calculator-module .os-section-title{

	  font:900 clamp(36px,5vw,56px)/1.1 "Inter Tight",Inter,sans-serif;

	  color:var(--ink);

	  margin-bottom:20px;

	}

	

	#ccl-injury-calculator-module .os-section-subtitle{

	  font-size:clamp(17px,2.2vw,20px);

	  color:var(--text);

	  line-height:1.65;

	}



	#ccl-injury-calculator-module .os-feature-card{

	  background:#fff;

	  border:1px solid var(--line);

	  border-radius:24px;

	  padding:40px;

	  box-shadow:var(--shadow-sm);

	  transition:all .4s cubic-bezier(.4,0,.2,1);

	  position:relative;

	  overflow:hidden;

	}



	#ccl-injury-calculator-module .os-feature-card::before{

	  content:"";

	  position:absolute;

	  top:0;

	  left:0;

	  right:0;

	  height:4px;

	  background:linear-gradient(90deg, var(--primary), var(--accent));

	  transform:translateY(-4px);

	  transition:transform .4s ease;

	}



	#ccl-injury-calculator-module .os-feature-card:hover{

	  box-shadow:var(--shadow-hover);

	  transform:translateY(-8px);

	  border-color:rgba(11,92,255,.3);

	}



	#ccl-injury-calculator-module .os-feature-card:hover::before{

	  transform:translateY(0);

	}



	#ccl-injury-calculator-module .os-feature-icon{

	  width:72px;

	  height:72px;

	  border-radius:18px;

	  background:linear-gradient(135deg, var(--primary-50), #dbeafe);

	  color:var(--primary);

	  display:grid;

	  place-items:center;

	  font-size:32px;

	  margin-bottom:24px;

	  transition:all .4s ease;

	}



	#ccl-injury-calculator-module .os-feature-card:hover .os-feature-icon{

	  transform:scale(1.1) rotate(5deg);

	  box-shadow:0 8px 20px rgba(11,92,255,.2);

	}



	#ccl-injury-calculator-module .os-feature-title{

	  font:800 22px/1.3 Inter,system-ui;

	  color:var(--ink);

	  margin-bottom:12px;

	}



	#ccl-injury-calculator-module .os-feature-text{

	  font-size:16px;

	  color:var(--text);

	  line-height:1.65;

	}



	/* ===========================

	  HOW IT WORKS

	  =========================== */

	#ccl-injury-calculator-module .os-how-it-works{

	  padding:100px 0;

	  background:#fff;

	  position:relative;

	}



	#ccl-injury-calculator-module .os-steps-container{

	  position:relative;

	}



	#ccl-injury-calculator-module .os-steps-line{

	  display:none;

	}



	@media (min-width:980px){

	  #ccl-injury-calculator-module .os-steps-line{

		display:block;

		position:absolute;

		top:60px;

		left:10%;

		right:10%;

		height:3px;

		background:linear-gradient(90deg, var(--primary) 0%, var(--accent) 100%);

		opacity:.2;

	  }

	}



	#ccl-injury-calculator-module .os-step-card{

	  background:#fff;

	  border:2px solid var(--line);

	  border-radius:24px;

	  padding:40px;

	  box-shadow:var(--shadow-card);

	  transition:all .4s ease;

	  position:relative;

	  z-index:1;

	}

	

	#ccl-injury-calculator-module .os-step-card:hover{

	  box-shadow:var(--shadow-hover);

	  transform:translateY(-8px);

	  border-color:var(--primary);

	}

	

	#ccl-injury-calculator-module .os-step-num{

	  width:56px; 

	  height:56px; 

	  border-radius:16px;

	  background:linear-gradient(135deg, var(--primary), var(--primary-light));

	  color:#fff; 

	  display:grid; 

	  place-items:center; 

	  font:900 24px/1 "Inter Tight",Inter,sans-serif;

	  margin-bottom:24px;

	  box-shadow:var(--shadow-brand);

	  position:relative;

	}



	#ccl-injury-calculator-module .os-step-num::after{

	  content:"";

	  position:absolute;

	  inset:-4px;

	  border-radius:18px;

	  background:linear-gradient(135deg, var(--primary), var(--primary-light));

	  opacity:.3;

	  z-index:-1;

	}

	

	#ccl-injury-calculator-module .os-step-title{

	  font:800 22px/1.3 Inter,system-sys;

	  color:var(--ink);

	  margin-bottom:14px;

	}

	

	#ccl-injury-calculator-module .os-step-text{

	  font-size:16px;

	  color:var(--text);

	  line-height:1.7;

	}



	/* ===========================

	  COMPARISON

	  =========================== */

	#ccl-injury-calculator-module .os-comparison{

	  padding:100px 0;

	  background:linear-gradient(180deg, var(--bg-subtle) 0%, #fff 100%);

	}



	#ccl-injury-calculator-module .os-comparison-grid{

	  display:grid;

	  gap:32px;

	  margin-top:56px;

	}



	@media (min-width:980px){

	  #ccl-injury-calculator-module .os-comparison-grid{

		grid-template-columns:1fr 1fr;

	  }

	}



	#ccl-injury-calculator-module .os-comparison-card{

	  background:#fff;

	  border:2px solid var(--line);

	  border-radius:24px;

	  padding:40px;

	  position:relative;

	  overflow:hidden;

	}



	#ccl-injury-calculator-module .os-comparison-card--highlighted{

	  border-color:var(--accent);

	  box-shadow:0 20px 60px rgba(16,185,129,.15);

	}



	#ccl-injury-calculator-module .os-comparison-card--highlighted::before{

	  content:"";

	  position:absolute;

	  top:0;

	  left:0;

	  right:0;

	  height:6px;

	  background:linear-gradient(90deg, var(--accent), var(--accent-dark));

	}



	#ccl-injury-calculator-module .os-comparison-badge{

	  display:inline-flex;

	  align-items:center;

	  gap:6px;

	  padding:8px 14px;

	  border-radius:999px;

	  background:var(--accent-light);

	  color:var(--accent-dark);

	  font:700 12px/1 Inter,system-ui;

	  text-transform:uppercase;

	  letter-spacing:.05em;

	  margin-bottom:20px;

	}



	#ccl-injury-calculator-module .os-comparison-title{

	  font:800 26px/1.2 "Inter Tight",Inter,sans-serif;

	  color:var(--ink);

	  margin-bottom:20px;

	}



	#ccl-injury-calculator-module .os-comparison-list{

	  list-style:none;

	  padding:0;

	  margin:0;

	}



	#ccl-injury-calculator-module .os-comparison-list li{

	  display:flex;

	  align-items:flex-start;

	  gap:12px;

	  margin-bottom:16px;

	  font-size:15px;

	  line-height:1.6;

	  color:var(--text);

	}



	#ccl-injury-calculator-module .os-comparison-list li i{

	  flex-shrink:0;

	  width:24px;

	  height:24px;

	  border-radius:6px;

	  display:grid;

	  place-items:center;

	  font-size:12px;

	  margin-top:2px;

	}



	#ccl-injury-calculator-module .os-comparison-list--positive li i{

	  background:var(--accent-light);

	  color:var(--accent-dark);

	}



	#ccl-injury-calculator-module .os-comparison-list--negative li i{

	  background:#fee2e2;

	  color:#dc2626;

	}



	#ccl-injury-calculator-module .os-comparison-list--neutral li i{

	  background:var(--primary-100);

	  color:var(--primary);

	}



	/* ===========================

	  FAQ

	  =========================== */

	#ccl-injury-calculator-module .os-faq{

	  padding:100px 0;

	  background:linear-gradient(180deg, var(--bg-subtle) 0%, #fff 100%);

	}



	#ccl-injury-calculator-module .os-faq-grid{

	  display:grid;

	  gap:20px;

	  max-width:900px;

	  margin:0 auto;

	}



	#ccl-injury-calculator-module .os-faq-item{

	  background:#fff;

	  border:1px solid var(--line);

	  border-radius:16px;

	  overflow:hidden;

	  transition:all .3s ease;

	}



	#ccl-injury-calculator-module .os-faq-item:hover{

	  box-shadow:var(--shadow-card);

	}



	#ccl-injury-calculator-module .os-faq-question{

	  display:flex;

	  align-items:center;

	  justify-content:space-between;

	  gap:20px;

	  padding:24px 28px;

	  cursor:pointer;

	  font:700 17px/1.4 Inter,system-ui;

	  color:var(--ink);

	  transition:all .3s ease;

	}



	#ccl-injury-calculator-module .os-faq-question:hover{

	  color:var(--primary);

	}



	#ccl-injury-calculator-module .os-faq-icon{

	  width:32px;

	  height:32px;

	  border-radius:8px;

	  background:var(--primary-100);

	  color:var(--primary);

	  display:grid;

	  place-items:center;

	  transition:all .3s ease;

	  flex-shrink:0;

	}



	#ccl-injury-calculator-module .os-faq-item.active .os-faq-icon{

	  transform:rotate(180deg);

	}



	#ccl-injury-calculator-module .os-faq-answer{

	  max-height:0;

	  overflow:hidden;

	  transition:max-height .4s ease;

	}



	#ccl-injury-calculator-module .os-faq-item.active .os-faq-answer{

	  max-height:500px;

	}



	#ccl-injury-calculator-module .os-faq-answer-content{

	  padding:0 28px 28px;

	  color:var(--text);

	  line-height:1.7;

	}



	/* ===========================

	  FULL SUITE LISTING

	  =========================== */

	#ccl-injury-calculator-module .os-calculators{

	  background:linear-gradient(180deg, #fff 0%, var(--bg-subtle) 100%);

	  padding:100px 0;

	  border-top:1px solid var(--line);

	}

	

	#ccl-injury-calculator-module .os-cat-head{

	  font:800 26px/1.2 "Inter Tight",Inter,sans-serif; 

	  color:var(--ink);

	  display:flex; 

	  align-items:center; 

	  gap:14px; 

	  margin:0 0 28px; 

	  padding-bottom:20px; 

	  border-bottom:2px solid var(--line);

	}

	

	#ccl-injury-calculator-module .os-cal-link{

	  display:flex; 

	  align-items:center; 

	  gap:16px; 

	  padding:22px; 

	  border:1px solid var(--line); 

	  border-radius:16px; 

	  background:#fff;

	  transition:all .3s ease; 

	  text-decoration:none; 

	  color:var(--text);

	}

	#ccl-injury-calculator-module .os-cal-link:hover{ 

	  border-color:var(--primary); 

	  box-shadow:0 8px 24px rgba(11,92,255,.14);

	  transform:translateX(6px);

	}

	

	#ccl-injury-calculator-module .os-cal-icon{ 

	  width:52px; 

	  height:52px; 

	  border-radius:14px; 

	  display:grid; 

	  place-items:center; 

	  background:linear-gradient(135deg, var(--primary-100), #dbeafe);

	  color:var(--primary); 

	  flex:0 0 52px;

	  font-size:22px;

	}



	/* ===========================

	  FINAL CTA

	  =========================== */

	#ccl-injury-calculator-module .os-final-cta{

	  position:relative; 

	  overflow:hidden; 

	  padding:120px 0;

	  background:linear-gradient(135deg,#0a1628 0%, #0f2744 50%, #0d1f3a 100%);

	}

	

	#ccl-injury-calculator-module .os-final-cta::before{

	  content:"";

	  position:absolute;

	  top:-50%;

	  left:-25%;

	  width:150%;

	  height:200%;

	  background:radial-gradient(ellipse at center, rgba(11,92,255,.18) 0%, transparent 60%);

	  animation:ccl-pulse 10s ease-in-out infinite;

	}

	

	@keyframes ccl-pulse{

	  0%, 100%{transform:scale(1);opacity:.8}

	  50%{transform:scale(1.15);opacity:.4}

	}

	

	#ccl-injury-calculator-module .os-final-cta__content{

	  position:relative;

	  z-index:1;

	  text-align:center;

	  max-width:800px;

	  margin:0 auto;

	}

	

	#ccl-injury-calculator-module .os-final-cta__title{

	  font:900 clamp(32px,5vw,52px)/1.1 'Inter Tight',Inter,sans-serif;

	  color:#fff;

	  margin-bottom:20px;

	}

	

	#ccl-injury-calculator-module .os-final-cta__text{

	  color:#d1dae6;

	  font-size:clamp(17px,2.2vw,20px);

	  line-height:1.65;

	  margin-bottom:40px;

	}



	#ccl-injury-calculator-module .os-final-cta__buttons{

	  display:flex;

	  gap:16px;

	  justify-content:center;

	  flex-wrap:wrap;

	}



	#ccl-injury-calculator-module .os-final-cta__note{

	  font-size:14px;

	  color:#a7b2c2;

	  margin-top:20px;

	}



	/* ===========================

	  UTILITIES

	  =========================== */

	#ccl-injury-calculator-module .text-center{text-align:center}

	#ccl-injury-calculator-module .mt-2{margin-top:.5rem}

	#ccl-injury-calculator-module .mt-3{margin-top:.75rem}

	#ccl-injury-calculator-module .mt-4{margin-top:1rem}

	#ccl-injury-calculator-module .mt-5{margin-top:1.25rem}

	#ccl-injury-calculator-module .mt-6{margin-top:1.5rem}

	#ccl-injury-calculator-module .mt-8{margin-top:2rem}

	#ccl-injury-calculator-module .mt-10{margin-top:2.5rem}

	#ccl-injury-calculator-module .mt-12{margin-top:3rem}

	#ccl-injury-calculator-module .mb-1{margin-bottom:.25rem}

	#ccl-injury-calculator-module .mb-2{margin-bottom:.5rem}

	#ccl-injury-calculator-module .mb-3{margin-bottom:.75rem}

	#ccl-injury-calculator-module .mb-4{margin-bottom:1rem}

	#ccl-injury-calculator-module .mb-6{margin-bottom:1.5rem}

	#ccl-injury-calculator-module .mb-8{margin-bottom:2rem}

	#ccl-injury-calculator-module .mb-10{margin-bottom:2.5rem}

	/* ===========================

	   DESIGN SYSTEM (Scoped)

	   =========================== */

	#ccl-nwf-module-blue {

	  --primary:#0b5cff;

	  --primary-dark:#0047d6;

	  --primary-light:#3d7fff;

	  --primary-100:#eff6ff;

	  --primary-50:#f0f7ff;



	  --warning:#f59e0b;

	  --warning-light:#fef3c7;



	  --ink:#0f172a;

	  --text:#334155;

	  --soft:#64748b;

	  --subtle:#94a3b8;



	  --line:#e2e8f0;

	  --bg:#ffffff;

	  --bg-subtle:#f7faff;

	  --bg-card:#fafbfc;



	  --r-sm:10px;

	  --r-md:16px;

	  --r-lg:20px;

	  --r-xl:24px;



	  --shadow-sm:0 2px 8px rgba(2,6,23,.06);

	  --shadow-md:0 4px 16px rgba(2,6,23,.08);

	  --shadow-card:0 10px 28px rgba(2,6,23,.08);

	  --shadow-brand:0 12px 34px rgba(11,92,255,.22);

	  --shadow-hover:0 20px 48px rgba(2,6,23,.14);



	  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;

	  color:var(--text);

	  background:#fff;

	  line-height:1.65;

	  -webkit-font-smoothing:antialiased;

	  -moz-osx-font-smoothing:grayscale;

	}



	#ccl-nwf-module-blue *{box-sizing:border-box}

	#ccl-nwf-module-blue h1,

	#ccl-nwf-module-blue h2,

	#ccl-nwf-module-blue h3,

	#ccl-nwf-module-blue h4{color:var(--ink); margin:0 0 .5rem; line-height:1.15}

	#ccl-nwf-module-blue h1{font-family:"Inter Tight",Inter,sans-serif; font-weight:900}

	#ccl-nwf-module-blue h2{font-weight:800} /* Keep h2 bold */

	#ccl-nwf-module-blue h3{font-weight:700; font-size: 22px;} /* Adjusted h3 */

	#ccl-nwf-module-blue h4{font-weight:700}

	#ccl-nwf-module-blue a{text-decoration:none; color:inherit}

	#ccl-nwf-module-blue img{max-width:100%; display:block}

	#ccl-nwf-module-blue p{margin:0 0 1rem}

	#ccl-nwf-module-blue ul{margin:0; padding:0; list-style: none;} /* Ensure ul reset */



	#ccl-nwf-module-blue .container{max-width:1380px; margin:0 auto; padding:0 24px}

	#ccl-nwf-module-blue .grid{display:grid; gap:24px}

	#ccl-nwf-module-blue .grid-2{grid-template-columns:1fr 1fr}

	#ccl-nwf-module-blue .grid-3{grid-template-columns:repeat(3,1fr)}

	#ccl-nwf-module-blue .grid-4{grid-template-columns:repeat(4,1fr)}

	@media (max-width:980px){

	  #ccl-nwf-module-blue .grid-2,

	  #ccl-nwf-module-blue .grid-3,

	  #ccl-nwf-module-blue .grid-4{ grid-template-columns:1fr }

	}



	/* Buttons & Badges */

	#ccl-nwf-module-blue .badge{

	  display:inline-flex; align-items:center; gap:8px;

	  padding:10px 18px; border-radius:999px;

	  background:linear-gradient(135deg, var(--primary-100), #dbeafe);

	  color:var(--primary-dark);

	  font:700 13px/1 Inter,system-ui,sans-serif;

	  letter-spacing:.05em;

	  text-transform:uppercase;

	  border:1px solid rgba(11,92,255,.2);

	  box-shadow:0 4px 12px rgba(11,92,255,.1);

	}

	#ccl-nwf-module-blue .btn{

	  display:inline-flex; align-items:center; justify-content:center; gap:10px;

	  padding:16px 32px; border-radius:14px; border:2px solid transparent;

	  font:700 16px/1.2 Inter,system-ui; cursor:pointer; transition:all .3s ease;

	}

	#ccl-nwf-module-blue .btn--primary{

	  background:linear-gradient(135deg, var(--primary), var(--primary-light));

	  color:#fff; box-shadow:var(--shadow-brand); border:2px solid var(--primary);

	}

	#ccl-nwf-module-blue .btn--primary:hover{ transform:translateY(-2px); box-shadow:0 16px 40px rgba(11,92,255,.3); }

	#ccl-nwf-module-blue .btn--outline{ background:transparent; border:2px solid var(--primary); color:var(--primary); }

	#ccl-nwf-module-blue .btn--outline:hover{ background:var(--primary); color:#fff; }

	#ccl-nwf-module-blue .btn--large{ padding:20px 40px; font-size:18px; }



	/* HERO STYLES */

	#ccl-nwf-module-blue .hero-section {

	  padding:clamp(70px, 10vw, 50px) 0;

	  background:

		radial-gradient(1400px 400px at 50% -5%, rgba(0,82,255,0.12), transparent 60%),

		linear-gradient(180deg, var(--bg-subtle), #fff 65%);

	  border-bottom:1px solid var(--line);

	  text-align:center;

	}

	#ccl-nwf-module-blue .hero-section .container { max-width:980px; }

	#ccl-nwf-module-blue .hero-section .badge { margin-bottom:1rem; }

	#ccl-nwf-module-blue .hero-section h1{

	  color:var(--ink);

	  font-size:clamp(2.6rem, 5vw, 3.6rem);

	  font-weight:900; letter-spacing:-0.03em;

	  text-wrap:balance;

	  font-family:"Inter Tight",Inter,sans-serif;

	  line-height: 1.1;

	  margin: 24px 0;

	}

	#ccl-nwf-module-blue .hero-section h1 .hero__highlight {

		background:linear-gradient(135deg, var(--primary-dark), var(--primary));

		-webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;

	}

	#ccl-nwf-module-blue .hero-section .lede{

	  color:var(--text);

	  font-size:clamp(1.05rem, 2.1vw, 1.2rem);

	  margin:.75rem auto 0; max-width:65ch; line-height:1.6

	}

	#ccl-nwf-module-blue .hero-section .cta-row {

		display:flex;

		gap:16px;

		justify-content:center;

		flex-wrap:wrap;

		margin-top: 40px;

	}



	/* PROMINENT DISCLAIMER */

	#ccl-nwf-module-blue .disclaimer-notice{

	  background:linear-gradient(135deg, #fff5e6 0%, #fff 100%); border-top:3px solid var(--warning); border-bottom:3px solid var(--warning); padding:40px 0;

	}

	#ccl-nwf-module-blue .disclaimer-notice__content{

	  max-width:1100px; margin:0 auto; background:#fff; border:2px solid var(--warning);

	  border-radius:16px; padding:32px 40px; box-shadow:0 8px 24px rgba(245,158,11,.15);

	}

	#ccl-nwf-module-blue .disclaimer-notice__header{

	  display:flex; align-items:center; gap:16px; margin-bottom:20px; padding-bottom:20px; border-bottom:2px solid var(--warning-light);

	}

	#ccl-nwf-module-blue .disclaimer-notice__icon{

	  width:56px; height:56px; border-radius:14px; background:var(--warning); color:#fff; display:grid; place-items:center; font-size:28px; flex-shrink:0;

	}

	#ccl-nwf-module-blue .disclaimer-notice__title{ font:800 24px/1.2 "Inter Tight",Inter,sans-serif; color:var(--ink); }

	#ccl-nwf-module-blue .disclaimer-notice__text{ font-size:15px; line-height:1.75; color:var(--text); }

	#ccl-nwf-module-blue .disclaimer-notice__text p{ margin-bottom:12px; }

	#ccl-nwf-module-blue .disclaimer-notice__text p:last-child{ margin-bottom:0; }

	#ccl-nwf-module-blue .disclaimer-notice__text strong{ color:var(--ink); font-weight:700; }

	#ccl-nwf-module-blue .disclaimer-notice__text .footer-text { /* Style for moved footer text */

		font-size: 13px;

		color: var(--soft);

		margin-top: 24px;

		padding-top: 24px;

		border-top: 1px solid var(--warning-light);

		text-align: center;

	}





	/* ENHANCED TABLE STYLES */

	#nwf-costs-table {padding-top: 100px;}

	#ccl-nwf-module-blue .content-table {

		width: 100%;

		border-collapse: collapse;

		border-radius: 16px;

		overflow: hidden;

		border: 1px solid var(--line);

		transition: box-shadow .3s ease;

	}

	#ccl-nwf-module-blue .content-table th,

	#ccl-nwf-module-blue .content-table td {

		padding: 20px 24px; /* Increased padding */

		text-align: left;

		border-bottom: 1px solid var(--line);

		font-size: 16px; /* Slightly larger font */

		line-height: 1.6;

		vertical-align: middle; /* Center content vertically */

	}

	#ccl-nwf-module-blue .content-table th {

		background: var(--bg-subtle);

		color: var(--ink);

		font-weight: 700;

		white-space: nowrap; /* Prevent headers wrapping */

	}

	#ccl-nwf-module-blue .content-table td {

		color: var(--text);

	}

	#ccl-nwf-module-blue .content-table tbody tr:nth-child(even) {

		background-color: var(--primary-50); /* Subtle alternating row */

	}

	#ccl-nwf-module-blue .content-table tbody tr:hover {

		background-color: var(--primary-100); /* Hover effect */

	}

	#ccl-nwf-module-blue .content-table tr:last-child td {

		border-bottom: 0;

	}

	#ccl-nwf-module-blue .content-table td:nth-child(3),

	#ccl-nwf-module-blue .content-table td:nth-child(4) {

		  text-align: left;

	}

	#ccl-nwf-module-blue .content-table .fa-check-circle { color: #16a34a; font-size: 22px; } /* Slightly larger icons */

	#ccl-nwf-module-blue .content-table .fa-times-circle { color: #dc2626; font-size: 22px; }

	#ccl-nwf-module-blue .content-table .fa-question-circle { color: var(--warning); font-size: 22px; }

	/* End Enhanced Table Styles */



	/* Shared section headers */

	#ccl-nwf-module-blue .section-header{ text-align:center; max-width:800px; margin:0 auto 64px; }

	#ccl-nwf-module-blue .section-kicker{ display:inline-block; font:700 13px/1 Inter,system-ui; color:var(--primary); text-transform:uppercase; letter-spacing:.1em; margin-bottom:16px; }

	#ccl-nwf-module-blue .section-title{ font:900 clamp(36px,5vw,56px)/1.1 "Inter Tight",Inter,sans-serif; color:var(--ink); margin-bottom:20px; }

	#ccl-nwf-module-blue .section-subtitle{ font-size:clamp(17px,2.2vw,20px); color:var(--text); line-height:1.65; }



	#ccl-nwf-module-blue .what-is { padding: 100px 0 0; }

	#ccl-nwf-module-blue .definition-card{ background:linear-gradient(135deg, var(--bg-subtle) 0%, #fff 100%); border:2px solid var(--line); border-radius:24px; padding:48px; max-width:900px; margin:0 auto 48px; box-shadow:var(--shadow-card); }

	#ccl-nwf-module-blue .definition-card__title{ font:700 24px/1.3 "Inter Tight",Inter,sans-serif; color:var(--ink); margin-bottom:20px; display:flex; align-items:center; gap:14px; } /* Adjusted title size */

	#ccl-nwf-module-blue .definition-card__icon{ width:56px; height:56px; border-radius:14px; background:linear-gradient(135deg, var(--primary-100), #dbeafe); color:var(--primary-dark); display:grid; place-items:center; font-size:24px; flex-shrink: 0; }

	#ccl-nwf-module-blue .definition-card__text{ font-size:18px; line-height:1.75; color:var(--text); }

	#ccl-nwf-module-blue .definition-card__text p:last-child { margin-bottom: 0; }

	#ccl-nwf-module-blue .definition-card__text ul { list-style: none; margin-top: 20px; padding-left: 0;}

	#ccl-nwf-module-blue .definition-card__text li {

		display:flex; align-items:flex-start; gap:12px; margin-bottom:12px; font-size:17px; color:var(--text);

	}

	#ccl-nwf-module-blue .definition-card__text li i { color:var(--primary); margin-top:4px; flex-shrink:0; font-size: 18px; width: 20px; text-align: center;}





	#ccl-nwf-module-blue .key-points{ display:grid; gap:24px; margin-top:48px; }

	@media (min-width:768px){ #ccl-nwf-module-blue .key-points{ grid-template-columns:repeat(3,1fr); } }

	#ccl-nwf-module-blue .key-point{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:32px; box-shadow:var(--shadow-sm); transition:all .3s ease; }

	#ccl-nwf-module-blue .key-point:hover{ box-shadow:var(--shadow-card); transform:translateY(-4px); border-color:var(--primary); }

	#ccl-nwf-module-blue .key-point__icon{ width:64px; height:64px; border-radius:16px; background:linear-gradient(135deg, var(--primary-100), #dbeafe); color:var(--primary-dark); display:grid; place-items:center; font-size:28px; margin-bottom:20px; flex-shrink: 0; }

	#ccl-nwf-module-blue .key-point__title{ font:700 20px/1.3 Inter,system-ui; color:var(--ink); margin-bottom:12px; } /* Adjusted title size */

	#ccl-nwf-module-blue .key-point__text{ font-size:15px; color:var(--text); line-height:1.7; }

	#ccl-nwf-module-blue .key-point__text ul { list-style: none; margin-top: 16px; padding-left: 0;}

	#ccl-nwf-module-blue .key-point__text li {

		display:flex; align-items:flex-start; gap:10px; margin-bottom:10px; font-size:15px;

	}

	 /* NEW List Item Styling */

	#ccl-nwf-module-blue .key-point__text li i.fa-check {

		color: var(--primary);

		margin-top: 4px;

		flex-shrink: 0;

		font-size: 14px;

		width: 18px; /* Ensure space for icon */

		text-align: center;

	}

	#ccl-nwf-module-blue .key-point__text .list-heading { /* Style for list headings */

		font-weight: 600;

		color: var(--ink);

		margin-bottom: 8px;

		display: block;

	}





	/* “Access to justice” block */

	#ccl-nwf-module-blue .access-justice { margin-top:80px; }

	#ccl-nwf-module-blue .access-justice .definition-card { background:linear-gradient(135deg, #fff 0%, var(--bg-subtle) 100%); }

	#ccl-nwf-module-blue .access-justice .definition-card__text p { font-size: 17px; }

	#ccl-nwf-module-blue .access-justice .definition-card__text p strong { color:var(--primary-dark); }



	/* 50/50 Rule */

	#ccl-nwf-module-blue .fifty-fifty-rule { padding:100px 0; background:linear-gradient(135deg, var(--primary-50) 0%, #fff 100%) }

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card{ max-width:100%; background:#fff; border:3px solid var(--primary); }

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__title{ justify-content:center; font-size: 24px;} /* Adjusted size */

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__icon{ background:linear-gradient(135deg, var(--primary-100), #dbeafe); color:var(--primary); }

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__text{ font-size:17px; }

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__text .example-box {

		background: var(--primary-50);

		border: 1px solid var(--primary-light);

		border-radius: 16px;

		padding: 24px;

		margin-top: 24px;

	}

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__text .example-box h4 {

		color: var(--primary-dark);

		font-weight: 800;

		font-size: 18px;

		margin-bottom: 16px;

	}

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__text .example-box p {

		font-size: 16px;

		margin-bottom: 8px;

	}

	 #ccl-nwf-module-blue .fifty-fifty-rule .definition-card__text .example-box p:last-child {

		margin-bottom: 0;

	}

	#ccl-nwf-module-blue .fifty-fifty-rule .definition-card__text .example-box strong {

		color: var(--ink);

		font-weight: 600;

	}



	#ccl-nwf-module-blue .grid-2-cols{ display:grid; gap:24px; }

	@media (min-width:768px){ #ccl-nwf-module-blue .grid-2-cols{ grid-template-columns:1fr 1fr; } }

	#ccl-nwf-module-blue .fifty-fifty-rule .key-point{ background:#fff; height:100%; }

	#ccl-nwf-module-blue .fifty-fifty-rule .key-point__icon{ background:linear-gradient(135deg, var(--primary-100), #dbeafe); color:var(--primary); }

	#ccl-nwf-module-blue .fifty-fifty-rule .cost-qualification{ font-size:14px; margin-top:10px; color:var(--soft); }

	#ccl-nwf-module-blue .confidence-box{

	  margin-top:40px; text-align:center; background:var(--primary-100); padding:32px; border-radius:20px; border:2px solid var(--primary);

	}

	#ccl-nwf-module-blue .confidence-box p{ font:700 20px/1.5 Inter,system-ui; color:var(--primary-dark); margin:0; }

	#ccl-nwf-module-blue .confidence-box strong { font-weight: 800; }



	/* New Content Section Base */

	#ccl-nwf-module-blue .content-section {

		padding: 100px 0;

	}

	#ccl-nwf-module-blue .content-section--bg-subtle {

		background:linear-gradient(180deg, var(--bg-subtle) 0%, #fff 100%);

	}



	/* REDESIGNED How it works */

	#ccl-nwf-module-blue .how-it-works{ padding:100px 0; background:linear-gradient(180deg, #fff 0%, var(--bg-subtle) 100%); }

	#ccl-nwf-module-blue .steps-container { max-width: 900px; margin: 0 auto; }

	#ccl-nwf-module-blue .step-card {

		background: #fff;

		border: 1px solid var(--line);

		border-radius: var(--r-xl);

		padding: 40px;

		margin-bottom: 32px;

		box-shadow: var(--shadow-card);

		display: grid;

		gap: 32px;

		align-items: center;

	}

	@media (min-width: 768px) {

		#ccl-nwf-module-blue .step-card {

			grid-template-columns: auto 1fr; /* Icon column + Content column */

		}

	}

	#ccl-nwf-module-blue .step-card__icon-wrapper {

		display: flex;

		flex-direction: column;

		align-items: center;

		gap: 16px;

	}

	#ccl-nwf-module-blue .step-card__number {

		width: 64px; height: 64px; border-radius: var(--r-lg);

		background: linear-gradient(135deg, var(--primary-dark), var(--primary));

		color: #fff; display: grid; place-items: center;

		font: 800 32px/1 "Inter Tight", Inter, sans-serif;

		box-shadow: 0 8px 24px rgba(11, 92, 255, .25);

		flex-shrink: 0;

	}

	#ccl-nwf-module-blue .step-card__visual-icon {

		width: 80px; height: 80px; border-radius: var(--r-md);

		background: linear-gradient(135deg, var(--primary-100), #dbeafe);

		color: var(--primary-dark); display: grid; place-items: center;

		font-size: 36px;

		flex-shrink: 0;

	}

	#ccl-nwf-module-blue .step-card__title { font: 700 24px/1.2 "Inter Tight", Inter, sans-serif; color: var(--ink); margin-bottom: 12px; } /* Adjusted size */

	#ccl-nwf-module-blue .step-card__text { font-size: 17px; color: var(--text); line-height: 1.7; margin-bottom: 16px; }

	#ccl-nwf-module-blue .step-card__details { background: var(--bg-subtle); border-left: 4px solid var(--primary); padding: 16px 20px; border-radius: var(--r-md); margin-top: 16px;}

	#ccl-nwf-module-blue .step-card__details ul { list-style: none; padding-left: 0; }

	#ccl-nwf-module-blue .step-card__details li { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px; font-size: 15px; color: var(--text); }

	#ccl-nwf-module-blue .step-card__details li:last-child { margin-bottom: 0; }

	#ccl-nwf-module-blue .step-card__details li i { color: var(--primary); margin-top: 4px; flex-shrink: 0; font-size: 16px; width: 18px; text-align: center; }

	/* End Redesigned How it works */



	/* Benefits */

	#ccl-nwf-module-blue .benefits{ padding:100px 0; background:#fff; }

	#ccl-nwf-module-blue .benefit-card{

	  background:linear-gradient(135deg, #fff 0%, var(--bg-subtle) 100%); border:1px solid var(--line); border-radius:24px; padding:40px;

	  box-shadow:var(--shadow-sm); transition:all .4s ease; position:relative; overflow:hidden; height:100%;

	}

	#ccl-nwf-module-blue .benefit-card::before{

	  content:""; position:absolute; top:0; left:0; right:0; height:4px;

	  background:linear-gradient(90deg, var(--primary-dark), var(--primary));

	  transform:translateY(-4px); transition:transform .4s ease;

	}

	#ccl-nwf-module-blue .benefit-card:hover{ box-shadow:var(--shadow-hover); transform:translateY(-6px); border-color:rgba(11,92,255,.3); }

	#ccl-nwf-module-blue .benefit-card:hover::before{ transform:translateY(0); }

	#ccl-nwf-module-blue .benefit-card__icon{

	  width:72px; height:72px; border-radius:18px; background:linear-gradient(135deg, var(--primary-100), #dbeafe);

	  color:var(--primary-dark); display:grid; place-items:center; font-size:32px; margin-bottom:24px;

	}

	#ccl-nwf-module-blue .benefit-card__title{ font:700 22px/1.3 Inter,system-ui; color:var(--ink); margin-bottom:14px; } /* Adjusted size */

	#ccl-nwf-module-blue .benefit-card__text{ font-size:16px; color:var(--text); line-height:1.7; }

	#ccl-nwf-module-blue .benefit-card .cost-qualification { font-size: 14px; margin-top: 10px; color: var(--soft); }



	/* Coverage */

	#ccl-nwf-module-blue .whats-covered{ padding:100px 0; background:linear-gradient(180deg, var(--bg-subtle) 0%, #fff 100%); }

	#ccl-nwf-module-blue .coverage-card{ background:#fff; border:2px solid var(--line); border-radius:20px; padding:0; overflow:hidden; box-shadow:var(--shadow-card); }

	#ccl-nwf-module-blue .coverage-card__header{

	  padding:28px 32px; background:linear-gradient(135deg, var(--primary-100) 0%, #dbeafe 100%); border-bottom:3px solid var(--primary);

	}

	#ccl-nwf-module-blue .coverage-card__title{

	  font:700 22px/1.2 "Inter Tight",Inter,sans-serif; color:var(--primary-dark); display:flex; align-items:center; gap:12px; } /* Adjusted size */

	#ccl-nwf-module-blue .coverage-card__body{ padding:32px; }

	#ccl-nwf-module-blue .coverage-items-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); gap:16px; }

	#ccl-nwf-module-blue .coverage-item{ display:flex; align-items:center; gap:10px; font:600 15px/1.4 Inter,system-ui; color:var(--ink) }

	#ccl-nwf-module-blue .coverage-item i{ color: var(--primary); }



	#ccl-nwf-module-blue .important-note{

	  margin-top:48px; background:#fff; border:2px solid var(--line); border-radius:20px; padding:40px; box-shadow:var(--shadow-card)

	}

	#ccl-nwf-module-blue .important-note p{ font-size:17px; line-height:1.7; color:var(--text); margin:0; }



	/* REDESIGNED Eligibility */

	#ccl-nwf-module-blue .eligibility { padding: 100px 0; background: #fff; }

	#ccl-nwf-module-blue .eligibility-container { max-width: 1000px; margin: 0 auto; }

	#ccl-nwf-module-blue .eligibility-grid { display: grid; gap: 32px; }

	@media (min-width: 768px) {

		#ccl-nwf-module-blue .eligibility-grid { grid-template-columns: 1fr 1fr; }

	}

	#ccl-nwf-module-blue .eligibility-point {

		background: linear-gradient(135deg, #fff 0%, var(--bg-subtle) 100%);

		border: 1px solid var(--line);

		border-radius: var(--r-xl);

		padding: 40px;

		box-shadow: var(--shadow-sm);

		display: flex;

		align-items: flex-start;

		gap: 24px;

		transition: all .3s ease;

	}

	 #ccl-nwf-module-blue .eligibility-point:hover {

		box-shadow: var(--shadow-card);

		border-color: var(--primary);

		transform: translateY(-4px);

	}

	#ccl-nwf-module-blue .eligibility-point__icon {

		width: 64px; height: 64px; border-radius: var(--r-lg);

		background: linear-gradient(135deg, var(--primary-100), #dbeafe);

		color: var(--primary-dark); display: grid; place-items: center;

		font-size: 28px; flex-shrink: 0;

	}

	#ccl-nwf-module-blue .eligibility-point__title { font: 700 20px/1.3 Inter, system-ui; color: var(--ink); margin-bottom: 8px; } /* Adjusted size */

	#ccl-nwf-module-blue .eligibility-point__text { font-size: 16px; color: var(--text); line-height: 1.7; margin: 0; }

	#ccl-nwf-module-blue .time-limit-box {

		margin-top: 48px; background: var(--warning-light); border: 2px solid var(--warning);

		border-radius: var(--r-xl); padding: 40px; box-shadow: 0 8px 24px rgba(245, 158, 11, .1);

	}

	#ccl-nwf-module-blue .time-limit-box__content { display: flex; align-items: flex-start; gap: 20px; }

	#ccl-nwf-module-blue .time-limit-box__icon {

		width: 56px; height: 56px; border-radius: var(--r-md); background: var(--warning); color: #fff;

		display: grid; place-items: center; font-size: 28px; flex-shrink: 0;

	}

	#ccl-nwf-module-blue .time-limit-box__title { font: 700 22px/1.3 Inter, system-ui; color: var(--ink); margin-bottom: 12px; } /* Adjusted size */

	#ccl-nwf-module-blue .time-limit-box__text { font-size: 17px; line-height: 1.7; color: var(--text); margin: 0; }

	#ccl-nwf-module-blue .eligibility-cta { margin-top: 48px; text-align: center; } /* Increased margin */

	#ccl-nwf-module-blue .eligibility-cta p { font-size: 18px; line-height: 1.7; color: var(--text); margin-bottom: 24px; max-width: 65ch; margin-left: auto; margin-right: auto;}

	/* End Redesigned Eligibility */



	/* FAQ */

	#ccl-nwf-module-blue .faq{ padding:100px 0; background:linear-gradient(180deg, #fff 0%, var(--bg-subtle) 100%); }

	#ccl-nwf-module-blue .faq-grid{ display:grid; gap:20px; max-width:900px; margin:0 auto; }

	#ccl-nwf-module-blue .faq-item{ background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; transition:all .3s ease; }

	#ccl-nwf-module-blue .faq-item:hover{ box-shadow:var(--shadow-card); }

	#ccl-nwf-module-blue .faq-question{

	  display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 28px; cursor:pointer;

	  font:700 17px/1.4 Inter,system-ui; color:var(--ink); transition:all .3s ease;

	}

	#ccl-nwf-module-blue .faq-question:hover{ color:var(--primary); }

	#ccl-nwf-module-blue .faq-icon{

	  width:32px; height:32px; border-radius:8px; background:var(--primary-100); color:var(--primary);

	  display:grid; place-items:center; transition:all .3s ease; flex-shrink:0;

	}

	#ccl-nwf-module-blue .faq-item.active .faq-icon{ transform:rotate(180deg); background:var(--primary); color:#fff; }

	#ccl-nwf-module-blue .faq-answer{ max-height:0; overflow:hidden; transition:max-height .4s ease; }

	#ccl-nwf-module-blue .faq-item.active .faq-answer{ max-height:800px; }

	#ccl-nwf-module-blue .faq-answer-content{ padding:0 28px 28px; color:var(--text); line-height:1.7; font-size:16px; }

	#ccl-nwf-module-blue .faq-answer-content .cost-qualification{ font-size:14px; margin-top:15px; color:var(--soft); display:block; }



	/* CTA */

	#ccl-nwf-module-blue .cta-section{

	  padding:100px 0; background:linear-gradient(135deg,#0a1628 0%, #0f2744 50%, #0d1f3a 100%); position:relative; overflow:hidden;

	}

	#ccl-nwf-module-blue .cta-section::before{

	  content:""; position:absolute; top:-50%; left:-25%; width:150%; height:200%;

	  background:radial-gradient(ellipse at center, rgba(11,92,255,.15) 0%, transparent 60%); animation:ccl-pulse-blue 10s ease-in-out infinite;

	}

	@keyframes ccl-pulse-blue{ 0%, 100%{transform:scale(1);opacity:.8} 50%{transform:scale(1.15);opacity:.4} }

	#ccl-nwf-module-blue .cta-section__content{ position:relative; z-index:1; text-align:center; max-width:800px; margin:0 auto; }

	#ccl-nwf-module-blue .cta-section__badge{

	  display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:999px;

	  background:rgba(255,255,255,.1); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.2);

	  color:#fff; font:700 13px/1 Inter,system-ui; letter-spacing:.05em; text-transform:uppercase; margin-bottom:24px;

	}

	#ccl-nwf-module-blue .cta-section__title{ font:900 clamp(32px,5vw,52px)/1.1 'Inter Tight',Inter,sans-serif; color:#fff; margin-bottom:20px; }

	#ccl-nwf-module-blue .cta-section__text{ color:#d1dae6; font-size:clamp(17px,2.2vw,20px); line-height:1.65; margin-bottom:40px; }

	#ccl-nwf-module-blue .cta-section__buttons{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:32px; }

	#ccl-nwf-module-blue .cta-section__note{ font-size:14px; color:#a7b2c2; margin-top:24px; display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap; }

	#ccl-nwf-module-blue .cta-section__note span{ display:flex; align-items:center; gap:8px; }

	/* Scope to this table only */

	#nwf-costs-table .table-wrap{

	  background:#fff;

	  border:1px solid var(--line, #e2e8f0);

	  border-radius:16px;

	  box-shadow:0 10px 28px rgba(2,6,23,.08);

	  overflow:hidden;

	}

	#nwf-costs-table .content-table{

	  width:100%;

	  border-collapse:collapse;

	  font-size:15px;

	  line-height:1.5;

	}

	#nwf-costs-table .content-table caption{

	  position:absolute;

	  left:-10000px;

	  top:auto;

	  width:1px;height:1px;

	  overflow:hidden;

	}

	#nwf-costs-table .content-table thead th{

	  background:var(--primary-100, #eff6ff);

	  color:var(--ink, #0f172a);

	  font:700 14px/1.2 Inter,system-ui,sans-serif;

	  letter-spacing:.02em;

	  padding:16px 18px;

	  text-align:left;

	  border-bottom:1px solid var(--line, #e2e8f0);

	  white-space:nowrap;

	}

	#nwf-costs-table .content-table tbody td{

	  padding:18px;

	  vertical-align:top;

	  border-bottom:1px solid var(--line, #e2e8f0);

	  color:var(--text, #334155);

	}

	#nwf-costs-table .content-table tbody tr:nth-child(2n){

	  background:rgba(219,232,255,.25); /* subtle soft-blue band */

	}

	#nwf-costs-table .content-table tbody tr:last-child td{

	  border-bottom:0;

	}



	/* Status chips (No green; brand blue / amber / red) */

	#nwf-costs-table .stat{

	  display:inline-flex; align-items:center; gap:8px;

	  font-weight:700; white-space:nowrap;

	}

	#nwf-costs-table .stat i{ font-size:14px }

	#nwf-costs-table .stat--yes{ color:var(--primary, #0b5cff); }

	#nwf-costs-table .stat--maybe{ color:var(--warning, #f59e0b); }

	#nwf-costs-table .stat--no{ color:#ef4444; } /* danger red */



	/* Mobile: transform rows into stacked cards with labels */

	@media (max-width: 780px){

	  #nwf-costs-table, #ccl-nwf-module-blue .content-section {padding: 20px 0;}

	  #nwf-costs-table .content-table thead{

		position:absolute;

		clip:rect(1px,1px,1px,1px);

		width:1px;height:1px;overflow:hidden;

	  }

	  #nwf-costs-table .table-wrap {

		background: inherit;

		border: inherit;

		box-shadow: inherit;

	  }

	  #nwf-costs-table .content-table tbody tr{

		display:block;

		background:#fff;

		margin: 25px 0;

		border:1px solid var(--line, #e2e8f0);

		border-radius:14px;

		box-shadow:0 6px 16px rgba(2,6,23,.06);

	  }

	  #nwf-costs-table .content-table tbody td{

		display:grid;

		grid-template-columns: 140px 1fr;

		gap:10px;

		border-bottom:0;

		padding:14px 16px;

	  }

	  #nwf-costs-table .content-table tbody td + td{

		border-top:1px dashed var(--line, #e2e8f0);

	  }

	  #nwf-costs-table .content-table tbody td::before{

		content:attr(data-label);

		font:700 13px/1.3 Inter,system-ui,sans-serif;

		color:var(--ink, #0f172a);

	  }

	}

	/* FOOTER DISCLAIMER - This style is no longer used, but kept for reference if needed */

	/*

	#ccl-nwf-module-blue .footer-disclaimer { background:var(--bg-subtle); border-top:2px solid var(--line); padding:32px 0; }

	#ccl-nwf-module-blue .footer-disclaimer__content{ max-width:980px; margin:0 auto; text-align:center; }

	#ccl-nwf-module-blue .footer-disclaimer p{ font-size:13px; color:var(--soft); line-height:1.6; margin:0; }

	*/



	@media (max-width:767px){

	  #ccl-nwf-module-blue .hero-section .cta-row { flex-direction: column; align-items: stretch; }

	  #ccl-nwf-module-blue .hero-section .cta-row .btn { width: 100%; }

	  #ccl-nwf-module-blue .cta-section__buttons{ flex-direction:column; align-items:stretch; }

	  #ccl-nwf-module-blue .cta-section__buttons .btn{ width:100%; }

	  #ccl-nwf-module-blue .disclaimer-notice__content{ padding:24px; }

	  #ccl-nwf-module-blue .disclaimer-notice__header{ flex-direction:column; text-align:center; }

	  #ccl-nwf-module-blue .step-card { grid-template-columns: 1fr; padding: 32px; } /* Stack step card content on mobile */

	  #ccl-nwf-module-blue .step-card__icon-wrapper { flex-direction: row; justify-content: center; } /* Icons side-by-side on mobile */

	  #ccl-nwf-module-blue .eligibility-grid { grid-template-columns: 1fr; } /* Stack eligibility points */

	  #ccl-nwf-module-blue .eligibility-point { flex-direction: column; text-align: center; gap: 16px; padding: 32px;}

	  #ccl-nwf-module-blue .eligibility-point__icon { margin: 0 auto; }

	  #ccl-nwf-module-blue .time-limit-box__content { flex-direction: column; align-items: center; text-align: center; }

	}

/* Generic .os-faq look & feel (reuses your tokens) */

.os-faq { padding:100px 0; background:linear-gradient(180deg, #fff 0%, var(--bg-subtle, #f7faff) 100%); }

.os-faq .os-container { max-width:1380px; margin:0 auto; padding:0 24px; }

.os-faq .os-faq-grid { display:grid; gap:20px; max-width:900px; margin:0 auto; }

.os-faq .os-faq-item { background:#fff; border:1px solid var(--line, #e2e8f0); border-radius:16px; overflow:hidden; transition:box-shadow .3s ease; }

.os-faq .os-faq-item:hover { box-shadow:0 10px 28px rgba(2,6,23,.08); }

.os-faq .os-faq-question { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 28px; cursor:pointer; font:700 17px/1.4 Inter, system-ui; color:var(--ink, #0f172a); transition:color .2s; }

.os-faq .os-faq-question:hover { color:var(--primary, #0b5cff); }

.os-faq .os-faq-icon { width:32px; height:32px; border-radius:8px; background:var(--primary-100, #eff6ff); color:var(--primary, #0b5cff); display:grid; place-items:center; transition:transform .3s; }

.os-faq .os-faq-item.active .os-faq-icon { transform: rotate(180deg); background:var(--primary, #0b5cff); color:#fff; }

.os-faq .os-faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease; }

.os-faq .os-faq-item.active .os-faq-answer { max-height:800px; }

.os-faq .os-faq-answer-content { padding:0 28px 28px; color:var(--text, #334155); line-height:1.7; font-size:16px; }



/* Optional: section header helpers */

.os-faq .os-section-header { text-align:center; max-width:800px; margin:0 auto 64px; }

.os-faq .os-section-kicker { display:inline-block; font:700 13px/1 Inter,system-ui; color:var(--primary, #0b5cff); text-transform:uppercase; letter-spacing:.1em; margin-bottom:16px; }

.os-faq .os-section-title { font:900 clamp(36px,5vw,56px)/1.1 "Inter Tight", Inter, sans-serif; color:var(--ink, #0f172a); margin-bottom:20px; }

.os-faq .os-section-subtitle { font-size:clamp(17px,2.2vw,20px); color:var(--text, #334155); line-height:1.65; }

  /* =========================

	 NAMESPACE: #ttl-blog

	 All classes/ids prefixed: ttl-

	 NOTE: Variables are SCOPED to #ttl-blog (no :root)

	 ========================= */



  /* ---- Design tokens (scoped) ---- */

  #ttl-blog, .ttl-scope {

	--ttl-primary:#1d63ff; --ttl-cta:#0b5cff; --ttl-cta-dark:#0846c1;

	--ttl-ink:#1e293b; --ttl-muted:#64748b; --ttl-line:#e2e8f0;

	--ttl-soft-bg:#f8fafc; --ttl-white:#ffffff; --ttl-dark-section-bg:#0E2B5C;

	--ttl-soft-blue-bg:#eff6ff; --ttl-soft-blue-bd:#dbeafe; --ttl-gold:#ffa826; --ttl-danger:#ef4444;

	--ttl-hero-gradient:linear-gradient(135deg,#0A101E 0%,#0E2B5C 100%);

	--ttl-card-shadow:0 4px 10px rgba(30,41,59,.04);

	--ttl-card-shadow-hover:0 10px 24px rgba(30,41,59,.08);

	--ttl-shadow-sm:0 1px 2px rgba(0,0,0,.04);

	--ttl-radius-sm:8px; --ttl-radius-md:10px; --ttl-radius-lg:14px;

  }



  /* Base (scoped) */

  #ttl-blog *{box-sizing:border-box;margin:0;padding:0}

  #ttl-blog{font-family:'Inter',sans-serif;background:var(--ttl-soft-bg);color:var(--ttl-ink);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

  #ttl-blog a{color:var(--ttl-cta);text-decoration:none;transition:color .2s}

  #ttl-blog a:hover{color:var(--ttl-cta-dark);text-decoration:underline}

  #ttl-blog .ttl-container{width:100%;max-width:1380px;margin-inline:auto;padding-inline:18px}

  @media (min-width:560px){#ttl-blog .ttl-container{padding-inline:22px}}

  @media (min-width:1200px){#ttl-blog .ttl-container{padding-inline:40px}}



  /* Buttons */

  #ttl-blog .ttl-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;border-radius:10px;font-weight:700;border:1px solid transparent;transition:all .2s;font-size:14.5px;cursor:pointer;text-decoration:none!important}

  #ttl-blog .ttl-btn i{margin-right:6px}

  #ttl-blog .ttl-btn--cta{background:var(--ttl-cta);color:#fff;border-color:var(--ttl-cta);box-shadow:0 4px 14px rgba(11,92,255,.25)}

  #ttl-blog .ttl-btn--cta:hover{background:var(--ttl-cta-dark);border-color:var(--ttl-cta-dark);transform:translateY(-1px);box-shadow:0 7px 18px rgba(11,92,255,.3)}

  #ttl-blog .ttl-btn--dark{background:var(--ttl-ink);color:#fff;border-color:var(--ttl-ink)}

  #ttl-blog .ttl-btn--dark:hover{background:#334155;border-color:#334155}

  #ttl-blog .ttl-btn--outline{background:var(--ttl-white);border:1px solid var(--ttl-line);color:var(--ttl-ink);box-shadow:var(--ttl-shadow-sm)}

  #ttl-blog .ttl-btn--outline:hover{background:var(--ttl-soft-bg);border-color:var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-btn--sm{padding:8px 14px;font-size:13px;border-radius:8px}



  /* Hero */

  #ttl-blog .ttl-hero{padding:clamp(60px,10vw,80px) 0;background:radial-gradient(1400px 400px at 50% -5%,rgba(0,82,255,.08),transparent 60%),linear-gradient(180deg,var(--ttl-soft-bg),#fff 65%);border-bottom:1px solid var(--ttl-line);text-align:center}

  #ttl-blog .ttl-hero .ttl-container{max-width:980px}

  #ttl-blog .ttl-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:var(--ttl-white);border:1px solid var(--ttl-line);font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ttl-cta);margin-bottom:1rem;box-shadow:var(--ttl-shadow-sm)}

  #ttl-blog .ttl-kicker i{font-size:.9em}

  #ttl-blog .ttl-hero h1{color:var(--ttl-ink);font-size:clamp(2.6rem,5vw,3.6rem);font-weight:900;letter-spacing:-.03em;text-wrap:balance;margin:0 0 1rem}

  #ttl-blog .ttl-lede{color:var(--ttl-muted);font-size:clamp(1.05rem,2.1vw,1.2rem);margin:.75rem auto 0;max-width:65ch;line-height:1.6}

  #ttl-blog .ttl-cta-row{margin-top:2rem;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}



  /* Sticky Filter Bar */

  #ttl-blog .ttl-filter-wrap{position:relative;z-index:50}

  #ttl-blog #ttl-filter-sentinel{height:1px}

  #ttl-blog .ttl-filter-bar{background:var(--ttl-white);padding:16px 0;border-top:1px solid var(--ttl-line);border-bottom:1px solid var(--ttl-line);transition:box-shadow .2s,padding .2s}

  #ttl-blog .ttl-filter-bar.ttl-is-sticky{position:fixed;top:0;left:0;right:0;box-shadow:0 4px 12px rgba(30,41,59,.08);z-index:100;border-top-color:transparent}

  /* Padding bump when sticky */

  #ttl-blog.ttl-sticky-padding{padding-top:var(--ttl-filter-height,60px)}



  #ttl-blog .ttl-filter-controls-wrap{display:flex;flex-direction:column;gap:12px}

  #ttl-blog .ttl-filter-controls{display:grid;gap:12px;align-items:center;grid-template-columns:auto minmax(160px,auto) minmax(180px,auto) 1fr}

  @media (max-width:1024px){

	#ttl-blog .ttl-filter-controls{grid-template-columns:1fr 1fr;grid-template-rows:auto auto}

	#ttl-blog .ttl-topic-dropdown{grid-column:1/-1;grid-row:1}

	#ttl-blog #ttl-date-filter{grid-column:1/2;grid-row:2}

	#ttl-blog #ttl-sort-filter{grid-column:2/3;grid-row:2}

	#ttl-blog .ttl-filter-search{grid-column:1/-1;grid-row:3;min-width:0}

  }

  @media (max-width:700px){

	#ttl-blog .ttl-filter-controls{grid-template-columns:1fr}

	#ttl-blog .ttl-topic-dropdown{grid-row:1}

	#ttl-blog #ttl-date-filter{grid-row:2}

	#ttl-blog #ttl-sort-filter{grid-row:3}

	#ttl-blog .ttl-filter-search{grid-row:4}

  }



  /* Topic dropdown */

  #ttl-blog .ttl-topic-dropdown{position:relative}

  #ttl-blog .ttl-topic-summary{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 16px;border-radius:999px;border:1px solid var(--ttl-line);background:var(--ttl-soft-bg);font-weight:700;font-size:13px;color:var(--ttl-muted);cursor:pointer;transition:all .2s;list-style:none;white-space:nowrap;width:100%}

  #ttl-blog .ttl-topic-summary::-webkit-details-marker{display:none}

  #ttl-blog .ttl-topic-summary:hover{background:var(--ttl-soft-blue-bg);border-color:var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-topic-dropdown[open]>.ttl-topic-summary{background:var(--ttl-soft-blue-bg);color:var(--ttl-cta);border-color:var(--ttl-cta);box-shadow:0 0 0 3px rgba(11,92,255,.1)}

  #ttl-blog .ttl-topic-summary .ttl-chevron{transition:transform .2s}

  #ttl-blog .ttl-topic-dropdown[open] .ttl-chevron{transform:rotate(180deg)}

  #ttl-blog .ttl-topic-panel{position:absolute;top:calc(100% + 8px);left:0;background:var(--ttl-white);border:1px solid var(--ttl-line);border-radius:var(--ttl-radius-md);box-shadow:0 8px 20px rgba(30,41,59,.12);padding:16px;z-index:60;min-width:260px;display:grid;gap:12px;max-height:350px;overflow-y:auto}

  #ttl-blog .ttl-topic-panel label{display:flex;align-items:center;gap:10px;font-size:14.5px;cursor:pointer;padding:4px 0;color:var(--ttl-ink)}

  #ttl-blog .ttl-topic-panel input[type="checkbox"]{accent-color:var(--ttl-cta);width:18px;height:18px;margin-top:-1px}

  #ttl-blog .ttl-topic-panel label:hover{color:var(--ttl-cta)}



  /* Selected tags */

  #ttl-blog #ttl-selected-tags{display:flex;flex-wrap:wrap;gap:8px}

  #ttl-blog .ttl-selected-tag{display:inline-flex;align-items:center;gap:6px;background:var(--ttl-soft-blue-bg);color:var(--ttl-cta);font-size:13px;font-weight:700;padding:6px 12px;border-radius:999px;border:1px solid var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-selected-tag button{background:none;border:none;font-size:16px;line-height:1;margin-left:4px;padding:0;color:var(--ttl-cta);opacity:.7;cursor:pointer;transition:opacity .2s}

  #ttl-blog .ttl-selected-tag button:hover{opacity:1}



  /* Selects & Search */

  #ttl-blog .ttl-filter-select{height:42px;padding:0 14px;border:1px solid var(--ttl-line);border-radius:10px;background:var(--ttl-soft-bg);color:var(--ttl-muted);font-weight:600;font-size:13.5px;cursor:pointer;min-width:140px;width:100%;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .85rem center;background-repeat:no-repeat;background-size:1em;padding-right:2.8rem}

  #ttl-blog .ttl-filter-select:hover{border-color:var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-filter-select:focus{outline:none;border-color:var(--ttl-cta);box-shadow:0 0 0 3px rgba(11,92,255,.1);background:var(--ttl-white)}



  #ttl-blog .ttl-filter-search{position:relative}

  #ttl-blog .ttl-filter-search input{width:100%;height:42px;padding:0 14px 0 38px;border:1px solid var(--ttl-line);border-radius:10px;font-size:14px;background:var(--ttl-soft-bg);color:var(--ttl-ink)}

  #ttl-blog .ttl-filter-search input::placeholder{color:var(--ttl-muted)}

  #ttl-blog .ttl-filter-search input:focus{outline:none;border-color:var(--ttl-cta);box-shadow:0 0 0 3px rgba(11,92,255,.1);background:var(--ttl-white)}

  #ttl-blog .ttl-filter-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--ttl-muted);pointer-events:none}



  /* Main */

  #ttl-blog .ttl-main{padding:clamp(2.5rem,6vw,4.5rem) 0}



  /* Featured */

  #ttl-blog .ttl-featured-wrap{margin-bottom:clamp(3rem,7vw,5rem);background:var(--ttl-white);border:1px solid var(--ttl-line);border-radius:var(--ttl-radius-lg);padding:clamp(1.5rem,4vw,2.5rem);box-shadow:var(--ttl-card-shadow)}

  #ttl-blog .ttl-featured-title{font-family:'Inter Tight',sans-serif;font-size:clamp(2rem,5.5vw,2.8rem);font-weight:900;color:var(--ttl-ink);margin-bottom:2rem;padding-bottom:.85rem;border-bottom:2px solid var(--ttl-cta);display:inline-block}

  #ttl-blog .ttl-featured-main{background:var(--ttl-white);border-radius:var(--ttl-radius-md);border:1px solid var(--ttl-line);border-left:4px solid var(--ttl-cta);padding:2rem;position:relative;transition:all .25s;margin-bottom:2rem}

  #ttl-blog .ttl-featured-main:hover{box-shadow:var(--ttl-card-shadow-hover);transform:translateY(-4px);border-color:var(--ttl-cta)}

  #ttl-blog .ttl-featured-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}

  #ttl-blog .ttl-category{font-size:12px;font-weight:700;color:var(--ttl-cta);text-transform:uppercase;letter-spacing:.05em}

  #ttl-blog .ttl-featured-badge{font-size:11px;font-weight:800;color:var(--ttl-cta-dark);background:var(--ttl-soft-blue-bg);padding:5px 12px;border-radius:999px;border:1px solid var(--ttl-soft-blue-bd);text-transform:uppercase;letter-spacing:.05em}

  #ttl-blog .ttl-featured-main h3{font-family:'Inter Tight',sans-serif;font-size:clamp(1.6rem,4vw,2rem);font-weight:800;line-height:1.2;margin:0 0 1rem}

  #ttl-blog .ttl-featured-main h3 a{color:var(--ttl-ink);text-decoration:none}

  #ttl-blog .ttl-featured-main h3 a:hover{color:var(--ttl-cta)}

  #ttl-blog .ttl-featured-main p{font-size:1.05rem;color:var(--ttl-muted);line-height:1.7;margin-bottom:1.5rem}

  #ttl-blog .ttl-read-more{display:inline-flex;align-items:center;gap:6px;font-weight:700;text-decoration:none;color:var(--ttl-cta);font-size:15px}

  #ttl-blog .ttl-read-more:hover{color:var(--ttl-cta-dark)}

  #ttl-blog .ttl-read-more i{transition:transform .2s}

  #ttl-blog .ttl-read-more:hover i{transform:translateX(3px)}



  #ttl-blog .ttl-featured-grid{display:grid;gap:1.5rem;grid-template-columns:1fr}

  @media (min-width:768px){#ttl-blog .ttl-featured-grid{grid-template-columns:repeat(3,1fr)}}

  #ttl-blog .ttl-featured-card{background:var(--ttl-soft-bg);border-radius:var(--ttl-radius-md);border:1px solid var(--ttl-line);padding:1.5rem;transition:all .25s;height:100%;display:flex;flex-direction:column}

  #ttl-blog .ttl-featured-card:hover{background:var(--ttl-white);border-color:var(--ttl-soft-blue-bd);box-shadow:var(--ttl-card-shadow);transform:translateY(-2px)}

  #ttl-blog .ttl-featured-card h4{font-family:'Inter Tight',sans-serif;font-size:1.25rem;font-weight:800;line-height:1.3;margin:0 0 .5rem}

  #ttl-blog .ttl-featured-card h4 a{color:var(--ttl-ink);text-decoration:none}

  #ttl-blog .ttl-featured-card h4 a:hover{color:var(--ttl-cta)}

  #ttl-blog .ttl-featured-card p{font-size:.9rem;color:var(--ttl-muted);margin:0 0 1rem;flex-grow:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}



  /* Layout */

  #ttl-blog .ttl-layout{display:grid;grid-template-columns:1fr;gap:3rem;align-items:start}

  @media (min-width:1024px){#ttl-blog .ttl-layout{grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:3.5rem}}



  /* Grid */

  #ttl-blog .ttl-grid-container{min-height:0}

  #ttl-blog .ttl-grid-title{font-family:'Inter Tight',sans-serif;font-size:clamp(1.8rem,5vw,2.5rem);font-weight:900;color:var(--ttl-ink);margin-bottom:2rem;padding-bottom:.85rem;border-bottom:2px solid var(--ttl-cta);display:inline-block}

  #ttl-blog .ttl-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}

  @media (min-width:768px){#ttl-blog .ttl-grid{grid-template-columns:repeat(2,1fr)}}



  /* Cards */

  #ttl-blog .ttl-post{background:var(--ttl-white);border-radius:var(--ttl-radius-lg);border:1px solid var(--ttl-line);box-shadow:var(--ttl-card-shadow);overflow:hidden;display:flex;flex-direction:column;transition:all .25s}

  #ttl-blog .ttl-post:hover{transform:translateY(-6px);box-shadow:var(--ttl-card-shadow-hover);border-color:var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-post-body{padding:1.75rem;flex-grow:1;display:flex;flex-direction:column}

  #ttl-blog .ttl-post-meta-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.85rem}

  #ttl-blog .ttl-post-date{font-size:13px;font-weight:600;color:var(--ttl-muted)}

  #ttl-blog .ttl-post-category{font-size:11.5px;font-weight:700;color:var(--ttl-cta);text-transform:uppercase;letter-spacing:.05em;background:var(--ttl-soft-blue-bg);padding:4px 10px;border-radius:8px;border:1px solid var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-post-title{font-family:'Inter Tight',sans-serif;font-size:1.4rem;font-weight:800;line-height:1.25;margin:0 0 .6rem}

  #ttl-blog .ttl-post-title a{color:var(--ttl-ink);text-decoration:none}

  #ttl-blog .ttl-post-title a:hover{color:var(--ttl-cta)}

  #ttl-blog .ttl-post-excerpt{margin:0 0 1.2rem;font-size:1rem;color:var(--ttl-muted);flex-grow:1}

  #ttl-blog .ttl-post-footer{margin-top:auto;padding:1rem 1.75rem;border-top:1px solid var(--ttl-line);display:flex;justify-content:space-between;align-items:center;background:var(--ttl-soft-bg)}

  #ttl-blog .ttl-post-views{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ttl-muted)}

  #ttl-blog .ttl-post-views svg{width:16px;height:16px;stroke:currentColor}

  #ttl-blog .ttl-post-read{font-size:14px;font-weight:700;text-decoration:none;color:var(--ttl-cta);display:flex;align-items:center;gap:4px}

  #ttl-blog .ttl-post-read:hover{color:var(--ttl-cta-dark);text-decoration:underline}

  #ttl-blog .ttl-hidden{display:none}



  /* Sidebar */

  #ttl-blog .ttl-sidebar{display:flex;flex-direction:column;gap:2.5rem}

  #ttl-blog .ttl-widget{background:var(--ttl-white);border-radius:var(--ttl-radius-lg);border:1px solid var(--ttl-line);padding:1.75rem;box-shadow:var(--ttl-card-shadow)}

  #ttl-blog .ttl-widget-title{font-family:'Inter Tight',sans-serif;font-size:1.3rem;font-weight:800;color:var(--ttl-ink);padding-bottom:.85rem;border-bottom:2px solid var(--ttl-cta);margin-bottom:1.2rem}

  #ttl-blog .ttl-widget-categories ul{list-style:none}

  #ttl-blog .ttl-widget-categories li{margin-bottom:.5rem}

  #ttl-blog .ttl-category-link{display:flex;justify-content:space-between;align-items:center;width:100%;font-weight:600;color:var(--ttl-muted);text-decoration:none;text-align:left;padding:8px 12px;border-radius:8px;transition:all .2s}

  #ttl-blog .ttl-category-link:hover{color:var(--ttl-cta);background:var(--ttl-soft-blue-bg)}

  #ttl-blog .ttl-category-link.ttl-active{color:var(--ttl-cta);background:var(--ttl-soft-blue-bg);font-weight:700}

  #ttl-blog .ttl-post-count{font-size:12px;color:var(--ttl-muted);background:var(--ttl-soft-bg);padding:3px 8px;border-radius:6px;font-weight:700;border:1px solid var(--ttl-line)}

  #ttl-blog .ttl-category-link:hover .ttl-post-count,

  #ttl-blog .ttl-category-link.ttl-active .ttl-post-count{background:var(--ttl-white);border-color:var(--ttl-soft-blue-bd);color:var(--ttl-cta)}



  #ttl-blog .ttl-widget-recent ul{list-style:none;display:flex;flex-direction:column;gap:1rem}

  #ttl-blog .ttl-rp-title{font-weight:700;line-height:1.3;font-size:15px;margin-bottom:4px}

  #ttl-blog .ttl-rp-title a{color:var(--ttl-ink);text-decoration:none}

  #ttl-blog .ttl-rp-title a:hover{color:var(--ttl-cta)}

  #ttl-blog .ttl-rp-date{font-size:13px;color:var(--ttl-muted)}



  #ttl-blog .ttl-widget-news p{font-size:14.5px;color:var(--ttl-muted);margin-bottom:1rem}

  #ttl-blog .ttl-widget-news form{display:flex;flex-direction:column;gap:.75rem}

  #ttl-blog .ttl-widget-news input[type="email"]{width:100%;height:46px;padding:0 16px;border:1px solid var(--ttl-line);border-radius:10px;font-size:14.5px;background:var(--ttl-soft-bg)}

  #ttl-blog .ttl-widget-news input[type="email"]::placeholder{color:#94a3b8}

  #ttl-blog .ttl-widget-news input[type="email"]:focus{outline:none;border-color:var(--ttl-cta);box-shadow:0 0 0 3px rgba(11,92,255,.1)}

  #ttl-blog .ttl-widget-news .ttl-submit{height:46px;padding:0 18px;border-radius:10px;border:none;background:var(--ttl-cta);color:#fff;font-weight:700;font-size:14.5px;cursor:pointer;transition:background-color .2s}

  #ttl-blog .ttl-widget-news .ttl-submit:hover{background:var(--ttl-cta-dark)}



  /* Pagination */

  #ttl-blog .ttl-pagination{margin-top:3.5rem;padding-top:2rem;border-top:1px solid var(--ttl-line);display:flex;justify-content:space-between;align-items:center}

  #ttl-blog .ttl-pagination-nav{display:none}

  @media (min-width:640px){#ttl-blog .ttl-pagination-nav{display:flex;gap:.6rem}}

  #ttl-blog .ttl-page-link,#ttl-blog .ttl-page-current,#ttl-blog .ttl-page-ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;border-radius:10px;font-size:14.5px;font-weight:700;text-decoration:none;padding:0 10px;transition:all .2s}

  #ttl-blog .ttl-page-link{color:var(--ttl-muted);background:var(--ttl-white);border:1px solid var(--ttl-line)}

  #ttl-blog .ttl-page-link:hover{background:var(--ttl-soft-blue-bg);color:var(--ttl-cta);border-color:var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-page-current{background:var(--ttl-cta);color:#fff;border:1px solid var(--ttl-cta);box-shadow:0 2px 6px rgba(11,92,255,.2)}

  #ttl-blog .ttl-page-ellipsis{color:#94a3b8}

  #ttl-blog .ttl-page-arrow{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border:1px solid var(--ttl-line);background:var(--ttl-white);border-radius:10px;font-size:14.5px;font-weight:700;color:var(--ttl-muted);text-decoration:none;transition:all .2s}

  #ttl-blog .ttl-page-arrow:hover{background:var(--ttl-soft-blue-bg);color:var(--ttl-cta);border-color:var(--ttl-soft-blue-bd)}

  #ttl-blog .ttl-page-arrow svg{width:18px;height:18px}



  /* Utilities */

  #ttl-blog .ttl-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}



		/* --- START: Base & Color Variables --- */

		.ccl-careers-page-wrapper {

			--navy: #0A1628;

			--navy-light: #1A2942;

			--slate: #475569; /* Slightly lighter slate for better contrast on cream */

			--slate-light: #64748b;

			--accent: #2563EB;

			--accent-light: #3B82F6;

			--cream: #f8fafc; /* Lighter cream for subtle backgrounds */

			--white: #FFFFFF;

			--border: #e2e8f0; /* Slightly lighter border */

			--gold: #F59E0B;

			

			/* New heading variables */

			--cta-blue: #0b5cff;

			--text-dark-slate: #1e293b;

			--text-slate: #475569; /* Same as --slate now */

			

			/* Defined for new container style */

			--container-pad: 24px;

			

			/* Added for new hero */

			--green: #10B981;



			/* Styles from <body> */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

			background: var(--white);

			color: var(--navy);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			overflow-x: hidden; /* Prevent horizontal scroll on body */

		}



		/* Removed *, html, body, and .container styles as requested */



		/* Screen reader only utility class (scoped to wrapper) */

		.ccl-careers-page-wrapper .sr-only {

			position: absolute;

			width: 1px;

			height: 1px;

			padding: 0;

			margin: -1px;

			overflow: hidden;

			clip: rect(0, 0, 0, 0);

			white-space: nowrap;

			border-width: 0;

		}

		/* --- END: Base & Color Variables --- */

		



		/* --- START: Hero Section CSS --- */

		.ccl-careers-hero {

			background: linear-gradient(165deg, var(--navy) 0%, var(--navy-light) 100%);

			color: var(--white);

			padding: 60px 0 80px; /* Mobile padding */

			position: relative;

			overflow: hidden;

		}

		 @media (min-width: 768px) {

			 .ccl-careers-hero { padding: 100px 0 120px; } /* Tablet padding */

		}

		 @media (min-width: 1024px) {

			 .ccl-careers-hero { padding: 50px 0 50px; } /* Desktop padding */

		}



		.ccl-careers-hero::before { /* Decorative element */

			content: '';

			position: absolute;

			top: -50%;

			right: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(37, 99, 235, 0.2), transparent 70%);

			border-radius: 50%;

			animation: ccl-careers-pulse 8s ease-in-out infinite;

			pointer-events: none; /* Make sure it doesn't interfere */

		}

		@keyframes ccl-careers-pulse {

			0%, 100% { transform: scale(1); opacity: 0.2; }

			50% { transform: scale(1.1); opacity: 0.3; }

		}

		.ccl-careers-hero-content {

			position: relative;

			z-index: 1;

			max-width: 900px;

			margin: 0 auto;

			text-align: center;

		}

		.ccl-careers-hero-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			background: rgba(16, 185, 129, 0.15);

			border: 1px solid rgba(16, 185, 129, 0.3);

			padding: 10px 20px; /* Adjusted padding */

			border-radius: 100px;

			font-size: 13px; /* Slightly smaller */

			font-weight: 600;

			margin-bottom: 24px;

			backdrop-filter: blur(10px);

		}

		.ccl-careers-hero-badge i {

			color: var(--green);

			font-size: 14px;

		}

		.ccl-careers-hero h1 {

			font-size: clamp(32px, 7vw, 60px); /* Responsive H1 */

			font-weight: 800;

			line-height: 1.15;

			margin-bottom: 20px;

			letter-spacing: -0.03em;

		}

		.ccl-careers-hero-subtitle {

			 font-size: clamp(17px, 4vw, 22px); /* Responsive subtitle */

			line-height: 1.5;

			color: rgba(255, 255, 255, 0.9);

			font-weight: 400;

			margin-bottom: 32px;

			max-width: 75ch; /* Limit line length */

			margin-left: auto;

			margin-right: auto;

		}

		/* REMOVED .ccl-careers-hero-stats styles */

		.ccl-careers-hero-cta {

			display: inline-flex;

			align-items: center;

			gap: 10px; /* Reduced gap */

			background: var(--white);

			color: var(--navy);

			padding: 14px 28px; /* Adjusted padding */

			border-radius: 10px; /* Slightly less rounded */

			font-size: 15px; /* Slightly smaller */

			font-weight: 700;

			text-decoration: none;

			transition: all 0.3s ease;

			box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Softer shadow */

			margin-top: 24px; /* Added margin-top since stats are gone */

		}

		.ccl-careers-hero-cta:hover {

			transform: translateY(-2px);

			box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15); /* Slightly larger hover shadow */

		}

		/* --- END: Hero Section CSS --- */

		



		/* --- START: Career Search CSS --- */

		.ccl-careers-search-section {

			padding: 25px 0; /* Reduced padding */

			background: var(--cream);

			border-bottom: 1px solid var(--border);

		}

		

		/* FIX: Ensure consistent alignment and grid behaviour */

		.ccl-careers-search-form {

			display: grid;

			grid-template-columns: 1fr; /* Mobile default */

			gap: 16px;

			align-items: flex-end; /* Align items to the bottom */

		}

		 /* Tablet layout */

		 @media (min-width: 768px) {

			 .ccl-careers-search-form {

				 grid-template-columns: 1fr 1fr; /* Two columns */

				 gap: 20px;

			}

			 /* Ensure button takes full width on tablet */

			 .ccl-careers-search-form .ccl-careers-form-group:last-child {

				 grid-column: 1 / -1; /* Span full width below inputs */

			}

			 .ccl-careers-search-btn {

				 width: auto; /* Allow button to size naturally */

				 padding: 0 32px; /* Add more horizontal padding */

				 justify-self: start; /* Align button to the start */

			}

		}

		 /* Desktop layout */

		 @media (min-width: 1024px) {

			 .ccl-careers-search-form {

				 grid-template-columns: 1fr 1fr 1fr auto; /* Original 4 columns */

				 gap: 20px;

			}

			 .ccl-careers-search-form .ccl-careers-form-group:last-child {

				 grid-column: auto; /* Reset column span */

			}

			.ccl-careers-search-btn {

				 justify-self: auto; /* Reset alignment */

				 width: auto; /* Reset width */

			}

		}

		

		.ccl-careers-form-group {

			display: flex;

			flex-direction: column;

			gap: 6px; /* Reduced gap */

		}

		

		.ccl-careers-form-group label {

			font-size: 13px; /* Smaller label */

			font-weight: 600;

			color: var(--slate);

			margin-bottom: 2px; /* Small space below label */

		}

		

		.ccl-careers-search-btn {

			background: var(--accent);

			color: var(--white);

			border: none;

			border-radius: 10px;

			cursor: pointer;

			font-size: 15px;

			font-weight: 600;

			transition: background 0.3s ease;

			height: 52px;

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			padding: 0 24px; /* Consistent padding */

		}

		

		.ccl-careers-search-btn:hover {

			background: var(--accent-light);

		}

		

		/* Custom Multi-Select Dropdown */

		.ccl-careers-multi-select {

			position: relative;

		}

		

		.ccl-careers-select-button {

			display: flex;

			justify-content: space-between;

			align-items: center;

			width: 100%;

			padding: 0 16px;

			background: var(--white);

			border: 1px solid var(--border); /* Thinner border */

			border-radius: 10px;

			cursor: pointer;

			font-size: 15px;

			font-weight: 500;

			height: 52px;

			text-align: left;

			 line-height: 50px;

		}

		

		.ccl-careers-select-button:hover {

			border-color: var(--slate-light);

		}

		

		.ccl-careers-select-button.ccl-careers-open {

			border-color: var(--accent);

			box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);

		}

		

		.ccl-careers-select-button .ccl-careers-button-text {

			overflow: hidden;

			text-overflow: ellipsis;

			white-space: nowrap;

			 padding-right: 10px;

		}

		

		.ccl-careers-button-text.ccl-careers-placeholder {

			color: var(--slate-light);

		}

		

		.ccl-careers-select-button i {

			transition: transform 0.2s ease;

			color: var(--slate-light);

			 flex-shrink: 0;

			font-size: 0.8em;

		}

		

		.ccl-careers-select-button.ccl-careers-open i {

			transform: rotate(180deg);

		}

		

		.ccl-careers-options-menu {

			display: none;

			position: absolute;

			top: calc(100% + 4px);

			left: 0;

			width: 100%;

			background: var(--white);

			border: 1px solid var(--border);

			border-radius: 10px;

			padding: 6px;

			z-index: 100;

			max-height: 250px;

			overflow-y: auto;

			box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);

		}

		

		.ccl-careers-options-menu.ccl-careers-open {

			display: block;

		}

		

		.ccl-careers-options-menu ul {

			list-style: none;

			padding: 0;

			margin: 0;

		}

		

		.ccl-careers-options-menu li label {

			display: flex;

			align-items: center;

			gap: 10px;

			padding: 10px 12px;

			border-radius: 8px;

			cursor: pointer;

			font-size: 14px;

			font-weight: 500;

			color: var(--slate);

		}

		

		.ccl-careers-options-menu li:hover {

			background: var(--cream);

		}

		

		.ccl-careers-options-menu li input[type="checkbox"] {

			width: 16px;

			height: 16px;

			accent-color: var(--accent);

			 flex-shrink: 0;

		}

		/* --- END: Career Search CSS --- */

		



		/* --- START: General Header Styles --- */

		 /* General Section Padding */

		 .ccl-careers-page-wrapper section { padding: 25px 0; } /* Mobile default */

		 @media (min-width: 768px) { .ccl-careers-page-wrapper section { padding: 30px 0; } } /* Tablet */

		 @media (min-width: 1024px) { .ccl-careers-page-wrapper section { padding: 50px 0; } } /* Desktop */



		.ccl-careers-header-wrapper {

			max-width: 800px;

			margin: 0 auto 40px auto; /* Reduced bottom margin */

			text-align: center;

		}



		.ccl-careers-kicker {

			font-size: .8rem; /* Slightly smaller */

			font-weight: 700; /* Adjusted weight */

			letter-spacing: .1em;

			color: var(--cta-blue);

			text-transform: uppercase;

			margin: 0 0 0.8rem; /* Reduced margin */

			display: inline-block;

			padding: 5px 14px;

			background: rgba(11, 92, 255, .08);

			border-radius: 50px;

		}



		.ccl-careers-section-title {

			font-family: 'Inter', sans-serif;

			font-weight: 800;

			font-size: clamp(1.8rem, 4.5vw, 2.8rem); /* Adjusted responsive size */

			margin: 0 0 1rem; /* Reduced margin */

			color: var(--text-dark-slate);

			letter-spacing: -0.03em;

			line-height: 1.2; /* Adjusted line height */

		}



		.ccl-careers-section-title mark {

			color: inherit;

			background: linear-gradient(180deg, transparent 62%, rgba(255, 168, 38, .28) 62% 92%, transparent 92%);

			padding: 0 .18em;

			border-radius: 6px;

			-webkit-box-decoration-break: clone;

			box-decoration-break: clone;

		}



		.ccl-careers-section-lead {

			font-size: clamp(1rem, 2.2vw, 1.15rem); /* Adjusted responsive size */

			line-height: 1.65; /* Slightly increased */

			color: var(--text-slate);

			margin: 0 auto;

		}

		/* --- END: General Header Styles --- */





		/* --- START: Navigation Cards Section CSS --- */

		.ccl-careers-nav-grid {

			display: grid;

			gap: 20px; /* Reduced gap */

		}



		.ccl-careers-nav-card {

			position: relative;

			display: block;

			background: var(--white);

			border-radius: 12px; /* Slightly less rounded */

			overflow: hidden;

			transition: all 0.3s ease;

			text-decoration: none;

			border: 1px solid var(--border); /* Thinner border */

			height: 250px; /* Default mobile height */

		}

		 @media (min-width: 768px) {

			 .ccl-careers-nav-card { height: 280px; } /* Tablet height */

		}

		 @media (min-width: 1024px) {

			 .ccl-careers-nav-card { height: 320px; } /* Desktop height */

		}



		 /* Grid spans defined in responsive */

		 @media (max-width: 767.98px) {

			 .ccl-careers-nav-grid { grid-template-columns: 1fr; }

			 .ccl-careers-nav-card { grid-column: span 1 !important; }

		}

		 @media (min-width: 768px) and (max-width: 1023.98px) {

			 .ccl-careers-nav-grid { grid-template-columns: repeat(6, 1fr); }

			 /* Tablet Spans */

			 .ccl-careers-nav-card:nth-child(1) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(2) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(3) { grid-column: span 6; }

			 .ccl-careers-nav-card:nth-child(4) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(5) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(6) { grid-column: span 6; }

			 .ccl-careers-nav-card:nth-child(7) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(8) { grid-column: span 3; }

		}

		 @media (min-width: 1024px) {

			 .ccl-careers-nav-grid { grid-template-columns: repeat(12, 1fr); }

			 /* Desktop Spans */

			 .ccl-careers-nav-card:nth-child(1) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(2) { grid-column: span 6; }

			 .ccl-careers-nav-card:nth-child(3) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(4) { grid-column: span 5; }

			 .ccl-careers-nav-card:nth-child(5) { grid-column: span 4; }

			 .ccl-careers-nav-card:nth-child(6) { grid-column: span 3; }

			 .ccl-careers-nav-card:nth-child(7) { grid-column: span 4; }

			 .ccl-careers-nav-card:nth-child(8) { grid-column: span 8; }

		}



		.ccl-careers-nav-card:hover {

			transform: translateY(-5px); /* Slightly less lift */

			box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1); /* Softer shadow */

			border-color: var(--accent);

		}



		.ccl-careers-nav-card-image {

			width: 100%;

			height: 100%;

			object-fit: cover;

			transition: transform 0.4s ease;

		}



		.ccl-careers-nav-card:hover .ccl-careers-nav-card-image {

			transform: scale(1.04); /* Slightly less zoom */

		}



		.ccl-careers-nav-card-overlay {

			position: absolute;

			inset: 0;

			background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, 0.7) 100%); /* Adjusted gradient */

			display: flex;

			align-items: flex-end;

			padding: 20px; /* Reduced padding */

			transition: all 0.3s ease;

		}



		.ccl-careers-nav-card:hover .ccl-careers-nav-card-overlay {

			 background: linear-gradient(180deg, rgba(37, 99, 235, 0.4) 0%, rgba(37, 99, 235, 0.8) 100%); /* Adjusted hover gradient */

		}



		.ccl-careers-nav-card-title {

			color: var(--white);

			font-size: clamp(16px, 3vw, 20px); /* Responsive title */

			font-weight: 700;

			line-height: 1.3;

			margin: 0;

		}

		/* --- END: Navigation Cards Section CSS --- */





		/* --- START: About Section (Life at CCL) CSS --- */

		.ccl-careers-about-section {

			background: var(--cream);

			border-top: 1px solid var(--border);

			border-bottom: 1px solid var(--border);

			 overflow: hidden; /* Prevent backdrop overflow */

		}

		/* --- END: About Section (Life at CCL) CSS --- */

		



		/* --- START: Perks & Benefits Section CSS --- */

		.ccl-careers-perks-section {

			background: var(--white);

		}



		.ccl-careers-perks-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); /* Adjust minmax */

			gap: 24px; /* Reduced gap */

			margin-top: 40px;

		}



		.ccl-careers-perk-card {

			background: var(--white);

			border: 1px solid var(--border);

			border-radius: 12px;

			padding: 28px; /* Adjusted padding */

			transition: all 0.3s ease;

			display: flex;

			flex-direction: column;

			align-items: flex-start;

		}



		.ccl-careers-perk-card:hover {

			border-color: var(--accent);

			transform: translateY(-4px);

			box-shadow: 0 10px 25px rgba(0, 0, 0, 0.07); /* Softer shadow */

		}



		.ccl-careers-perk-visual {

			width: 56px; /* Smaller visual */

			height: 56px;

			background: linear-gradient(135deg, var(--accent), var(--accent-light));

			border-radius: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 16px; /* Reduced margin */

			flex-shrink: 0;

		}



		.ccl-careers-perk-visual i {

			font-size: 24px; /* Smaller icon */

			color: var(--white);

		}



		.ccl-careers-perk-card h3 {

			font-size: 18px; /* Smaller heading */

			font-weight: 700;

			color: var(--navy);

			margin-bottom: 8px;

		}



		.ccl-careers-perk-card p {

			font-size: 14px; /* Smaller text */

			line-height: 1.6;

			color: var(--slate);

			flex-grow: 1;

			 margin-bottom: 12px; /* Add margin below paragraph */

		}

		

		.ccl-careers-perk-highlight {

			display: inline-block;

			margin-top: auto; /* Push highlight down */

			padding: 5px 10px; /* Adjusted padding */

			background: rgba(245, 158, 11, 0.1);

			color: #d97706; /* Darker gold */

			font-size: 11px; /* Smaller text */

			font-weight: 600;

			border-radius: 6px;

		}

		/* --- END: Perks & Benefits Section CSS --- */

		



		/* --- START: Hiring Process Section CSS --- */

		.ccl-careers-process-section {

			background: var(--cream);

			border-top: 1px solid var(--border);

		}



		.ccl-careers-process-steps {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

			gap: 24px; /* Reduced gap */

			margin-top: 40px;

			position: relative;

		}



		/* Dashed line connector */

		.ccl-careers-process-steps::before {

			 display: none; /* Hide by default */

		}

		/* Show connector only when 4 columns */

		@media (min-width: 992px) {

			.ccl-careers-process-steps { grid-template-columns: repeat(4, 1fr); }

			 .ccl-careers-process-steps::before {

				 display: block;

				 content: '';

				 position: absolute;

				 top: 40px; /* Align with icon center */

				 left: 12.5%;

				 width: 75%;

				 height: 2px;

				 background: repeating-linear-gradient(to right, var(--border), var(--border) 6px, transparent 6px, transparent 12px);

				 z-index: 0;

			}

		}





		.ccl-careers-process-step {

			display: flex;

			flex-direction: column;

			align-items: center;

			text-align: center;

			position: relative;

			z-index: 1;

			 padding: 16px 0; /* Add padding for spacing */

		}



		.ccl-careers-process-icon {

			width: 56px; /* Smaller icon */

			height: 56px;

			background: var(--white);

			border: 1px solid var(--border);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 16px;

			transition: all 0.3s ease;

		}

		

		.ccl-careers-process-icon i {

			font-size: 22px; /* Smaller icon size */

			color: var(--accent);

		}

		

		.ccl-careers-process-step:hover .ccl-careers-process-icon {

			background: var(--accent);

			border-color: var(--accent);

			transform: scale(1.08); /* Slightly less scale */

		}

		

		.ccl-careers-process-step:hover .ccl-careers-process-icon i {

			color: var(--white);

		}



		.ccl-careers-process-step h3 {

			font-size: 18px; /* Smaller heading */

			font-weight: 700;

			color: var(--navy);

			margin-bottom: 8px;

		}



		.ccl-careers-process-step p {

			font-size: 14px; /* Smaller text */

			line-height: 1.6;

			color: var(--slate);

		}

		/* --- END: Hiring Process Section CSS --- */





		/* --- START: Testimonials Section CSS (REDESIGNED) --- */

		.ccl-careers-testimonials-section {

			background: var(--cream); /* Changed background */

			border-top: 1px solid var(--border);

			border-bottom: 1px solid var(--border);

			 padding: 80px 0; /* Consistent padding */

			 @media (min-width: 1024px) { padding: 100px 0; }

		}



		.ccl-careers-testimonial-grid {

			display: grid;

			grid-template-columns: 1fr; /* Mobile: single column */

			gap: 32px; /* Increased gap */

			margin-top: 48px;

		}

		 @media (min-width: 992px) { /* Desktop: two columns */

			 .ccl-careers-testimonial-grid {

				 grid-template-columns: 1fr 1fr;

				 gap: 40px;

			}

		}

		.ccl-careers-testimonial-card {

			background: var(--white);

			border: 1px solid var(--border);

			border-radius: 16px; /* More rounded */

			padding: 32px 32px 28px; /* Adjusted padding */

			display: flex;

			flex-direction: column;

			position: relative; /* For quote icon positioning */

			 box-shadow: 0 8px 16px rgba(10, 22, 40, 0.04); /* Subtle shadow */

			 transition: all 0.3s ease;

		}

		.ccl-careers-testimonial-card:hover {

			 transform: translateY(-4px);

			 box-shadow: 0 12px 24px rgba(10, 22, 40, 0.08);

		}

		

		/* Quote Icon */

		.ccl-careers-testimonial-card::before {

			content: "\f10d"; /* FontAwesome quote-left */

			font-family: "Font Awesome 6 Free";

			font-weight: 900;

			position: absolute;

			top: 24px;

			left: 28px;

			font-size: 2.5rem;

			color: var(--accent);

			opacity: 0.15;

			line-height: 1;

			z-index: 0;

		}



		.ccl-careers-testimonial-card-stars {

			color: var(--gold);

			margin-bottom: 16px;

			 font-size: 0.9em; /* Consistent star size */

			 margin-left: auto; /* Align stars to the right */

			 position: relative; /* Ensure stars are above quote icon */

			 z-index: 1;

		}

		

		.ccl-careers-testimonial-card-text {

			font-size: clamp(16px, 2.5vw, 18px); /* Responsive quote */

			font-weight: 500;

			line-height: 1.7;

			color: var(--slate);

			flex-grow: 1;

			margin-bottom: 24px;

			padding-top: 16px; /* Space below quote icon area */

			 font-style: italic; /* Add italics to quote */

			 position: relative; /* Ensure text is above quote icon */

			 z-index: 1;

		}

		

		.ccl-careers-testimonial-author {

			display: flex;

			align-items: center;

			gap: 14px; /* Slightly more gap */

			padding-top: 20px;

			border-top: 1px solid var(--border); /* Re-added subtle border */

			margin-top: auto; /* Push author to bottom */

			position: relative; /* Ensure author is above quote icon */

			 z-index: 1;

		}

		

		.ccl-careers-testimonial-author img {

			width: 52px; /* Slightly larger image */

			height: 52px;

			border-radius: 50%;

			object-fit: cover;

			flex-shrink: 0;

			border: 3px solid var(--white); /* Add white border */

			box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Subtle shadow */

		}

		

		.ccl-careers-testimonial-author-details {

			 line-height: 1.3;

		}



		.ccl-careers-testimonial-author-name {

			font-size: 16px; /* Larger name */

			font-weight: 700;

			color: var(--navy);

			margin-bottom: 2px;

		}

		

		.ccl-careers-testimonial-author-role {

			font-size: 14px; /* Larger role */

			color: var(--slate-light);

		}

		/* --- END: Testimonials Section CSS --- */





		/* --- START: CTA Section CSS --- */

		.ccl-careers-cta-section {

			background: linear-gradient(165deg, var(--navy) 0%, var(--navy-light) 100%);

			color: var(--white);

			 /* Padding handled by general section rule */

			position: relative;

			overflow: hidden;

		}



		.ccl-careers-cta-section::before,

		.ccl-careers-cta-section::after { /* Combined decorative elements */

			content: '';

			position: absolute;

			border-radius: 50%;

			opacity: 0.3; /* Further reduce visibility */

			 pointer-events: none;

		}

		 .ccl-careers-cta-section::before {

			top: -40%; right: -20%; width: 600px; height: 600px;

			background: radial-gradient(circle, rgba(37, 99, 235, 0.15), transparent 70%);

		}

		 .ccl-careers-cta-section::after {

			 bottom: -40%; left: -20%; width: 500px; height: 500px;

			background: radial-gradient(circle, rgba(37, 99, 235, 0.1), transparent 70%);

		}





		.ccl-careers-cta-content {

			max-width: 750px; /* Slightly reduced width */

			margin: 0 auto;

			text-align: center;

			position: relative;

			z-index: 1;

		}



		.ccl-careers-cta-section h2 {

			 font-size: clamp(28px, 6vw, 40px); /* Adjusted responsive size */

			font-weight: 800;

			margin-bottom: 20px;

			letter-spacing: -0.02em;

			line-height: 1.25;

		}



		.ccl-careers-cta-section p {

			 font-size: clamp(15px, 3vw, 17px); /* Adjusted responsive size */

			line-height: 1.7; /* Adjusted line height */

			color: rgba(255, 255, 255, 0.85);

			margin-bottom: 16px;

		}

		 .ccl-careers-cta-section p:last-of-type {

			 margin-bottom: 32px; /* More space before signature */

		}



		.ccl-careers-cta-email {

			color: var(--gold);

			font-weight: 600; /* Adjusted weight */

			text-decoration: none;

			transition: all 0.2s ease;

			border-bottom: 1px solid transparent; /* Thinner underline */

		}



		.ccl-careers-cta-email:hover {

			border-bottom-color: var(--gold);

		}



		.ccl-careers-cta-signature {

			margin-top: 32px; /* Reduced margin */

			padding-top: 32px;

			border-top: 1px solid rgba(255, 255, 255, 0.15); /* Thinner border */

			display: inline-block;

		}



		.ccl-careers-cta-signature-name {

			font-size: 20px; /* Smaller name */

			font-weight: 700;

			margin-bottom: 4px; /* Reduced gap */

		}



		.ccl-careers-cta-signature-role {

			display: block;

			font-size: 14px; /* Smaller role */

			font-weight: 500;

			color: rgba(255, 255, 255, 0.65);

			letter-spacing: 0.02em;

		}

		/* --- END: CTA Section CSS --- */

		

		/* --- START: Pill/Dropdown Navigation Specific Styles --- */

		.ccl-diff{

			position: relative;

			display: grid;

			grid-template-areas:

				"nav"

				"panels";

			gap: 16px; /* Mobile gap */

			margin-top: 40px;

		}

		 @media (min-width: 768px) { /* Tablet stacked */

			 .ccl-diff {

				 grid-template-areas: "nav" "panels";

				 gap: 24px;

			}

		}

		 @media (min-width: 1024px) { /* Desktop side-by-side */

			 .ccl-diff {

				 grid-template-columns: 0.9fr 2.1fr;

				 grid-template-areas: "nav panels";

				 gap: 32px;

			}

		}



		/* Decorative backdrop */

		.ccl-diff::before{

			content:""; position:absolute; inset:auto auto -40px -40px;

			width: clamp(250px, 30vw, 320px); height: clamp(250px, 30vw, 320px);

			border-radius:50%; background:radial-gradient(ellipse at center, rgba(37,99,235,.08), transparent 65%);

			pointer-events:none; z-index: 0;

			@media (min-width: 1024px) { inset: -20px -20px auto auto; }

		}



		/* Pill navigation container (Hidden Mobile) */

		.ccl-diff-nav{

			 grid-area: nav;

			 display: none; /* Hidden by default */

			 flex-direction: column; /* Stacked on tablet */

			gap: 10px;

			position: relative; z-index: 1;

		}

		 @media (min-width: 768px) {

			 .ccl-diff-nav { display: flex; } /* Shown Tablet+ */

		}



		/* Mobile Dropdown Container (Shown Mobile) */

		.ccl-diff-mobile-select-wrapper {

			 grid-area: nav;

			 position: relative; z-index: 2;

			 display: block; /* Shown by default */

		}

		 @media (min-width: 768px) {

			 .ccl-diff-mobile-select-wrapper { display: none; } /* Hidden Tablet+ */

		}

		 /* Style the select element */

		.ccl-diff-mobile-select {

			appearance: none; -webkit-appearance: none; -moz-appearance: none;

			display: block; width: 100%;

			padding: 14px 40px 14px 16px; border: 1px solid var(--border);

			border-radius: 10px; background-color: var(--white);

			color: var(--navy); font-family: inherit; font-size: 1rem; font-weight: 600;

			cursor: pointer; line-height: 1.3;

			 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2364748b'%3E%3Cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 10.94l3.71-3.71a.75.75 0 111.06 1.06l-4.25 4.25a.75.75 0 01-1.06 0L5.23 8.29a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3E%3C/svg%3E");

			background-repeat: no-repeat; background-position: right 16px center; background-size: 1.2em 1.2em;

		}

		 .ccl-diff-mobile-select:focus {

			 outline: none; border-color: var(--accent);

			 box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);

		}





		.ccl-diff-pill{

			display:flex;align-items:center;gap:12px;

			padding: 12px 14px; border-radius:10px; border: 1px solid var(--border);

			background:#fff;color:var(--slate); font-weight: 600;

			cursor:pointer;transition: all 0.2s ease; text-align:left;

			width: 100%; font-size: 0.95rem; line-height: 1.3;

		}

		.ccl-diff-pill:hover{

			 border-color: var(--accent); background-color: #f8fafc;

			 box-shadow:0 4px 10px rgba(2,6,23,.06); transform:translateY(-1px);

		}

		.ccl-diff-pill.is-active{

			 border-color:var(--accent); box-shadow:0 6px 15px rgba(2,6,23,.08);

			 color: var(--navy); background-color: var(--white);

		}

		.ccl-diff-pill.is-active .ccl-diff-pill-icon {

			 background: linear-gradient(135deg,var(--accent),var(--accent-light)); color: #fff;

		}

		.ccl-diff-pill:focus-visible{

			 outline: none; border-color: var(--accent);

			 box-shadow:0 0 0 3px rgba(37,99,235,.2);

		}



		.ccl-diff-pill-icon{

			width: 36px; height: 36px; border-radius: 8px;

			display:grid;place-items:center;flex-shrink:0;

			background: var(--cream); color:var(--slate-light);

			transition: background 0.2s ease, color 0.2s ease; font-size: 1.1em;

		}

		.ccl-diff-pill-text{ white-space:normal; flex-grow: 1; }



		/* Panels */

		.ccl-diff-panels{ grid-area: panels; position:relative; z-index: 1;}



		.ccl-diff-panel{

			display: none; /* Hide panels by default */

			background:#fff; border:1px solid var(--border); border-radius:12px;

			box-shadow:0 10px 25px rgba(2,6,23,.07);

			padding: 24px !important; animation:cclDiffFade .25s ease;

			 min-height: 350px;

			 flex-direction: column; /* Keep flex for footer push */

			 @media (min-width: 768px) { padding: 28px; }

		}

		.ccl-diff-panel.is-active{

			 display: flex; /* Show only active panel */

		}



		@keyframes cclDiffFade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}



		.ccl-diff-panel-head{

			display:flex;justify-content:space-between;gap:12px 16px;align-items:flex-start;margin-bottom:12px;

			flex-wrap: wrap;

		}

		.ccl-diff-panel-head h3{margin:0;font-size: clamp(20px, 4vw, 24px);font-weight:700;letter-spacing:-.01em;color:var(--navy)}

		.ccl-diff-chips{display:flex;gap:8px;flex-wrap:wrap; padding-top: 4px;}

		.ccl-chip{

			display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;

			background:#eff6ff;border:1px solid #dbeafe;color:#1e40af; /* Darker blue */

			font-size:11px;font-weight:600; /* Adjusted weight */

		}

		 .ccl-chip i { font-size: 0.9em; }



		.ccl-diff-lead{

			 color:var(--slate);

			 font-size: clamp(15px, 2.5vw, 16px); /* Responsive lead */

			 margin: 6px 0 16px;

			 line-height: 1.65;

		}



		.ccl-diff-list{

			display:grid;

			grid-template-columns: 1fr; /* Mobile default */

			gap:10px 16px;margin:12px 0 16px; padding-left: 0;

			 @media (min-width: 600px) { grid-template-columns: repeat(2,minmax(0,1fr)); }

		}

		.ccl-diff-list li{list-style:none;display:flex;gap:10px;align-items:flex-start;color:var(--slate); font-size: 14px;}

		.ccl-diff-list i{color:#10B981;margin-top:4px; width: 15px; flex-shrink: 0; font-size: 0.9em;}



		.ccl-diff-foot{

			display:flex;justify-content:space-between;gap:12px 16px;align-items:center;

			margin-top: auto; /* Pushes footer to bottom */

			padding-top: 20px;

			flex-wrap: wrap;

			border-top: 1px solid var(--border); /* Add separator */

			 margin-top: 24px; /* Ensure space above border */

		}

		.ccl-metric{display:flex;gap:8px;align-items:baseline}

		.ccl-metric-label{color:var(--slate-light);font-size:12px;font-weight:600;}

		.ccl-metric-value{font-weight:700;color:var(--accent); font-size: 14px;}

		.ccl-link{color:var(--accent);font-weight:600;text-decoration:none; font-size: 14px;}

		.ccl-link i{margin-left:5px; font-size: 0.85em;}

		.ccl-link:hover{text-decoration:underline}



		 /* Accessibility improvements */

		 [role="tab"]:focus, [role="tabpanel"]:focus {

			 outline: none; /* Remove default outline */

		}

		/* ========================================

		   BASE STYLES & VARIABLES

		   Scoped within .ccl-media-listing-page

		   Using prefix: ccl-media-listing-

		   ======================================== */

		.ccl-media-listing-page {

			/* CSS Variables */

			--ccl-media-listing-primary: #1e3a8a; /* Dark Blue */

			--ccl-media-listing-primary-light: #3b82f6; /* Lighter Blue */

			--ccl-media-listing-primary-hover: #1e40af;

			--ccl-media-listing-secondary: #0ea5e9; /* Sky Blue */

			--ccl-media-listing-text-primary: #111827; /* Dark Gray */

			--ccl-media-listing-text-secondary: #4b5563; /* Medium Gray */

			--ccl-media-listing-text-tertiary: #9ca3af; /* Light Gray */

			--ccl-media-listing-border: #e5e7eb;

			--ccl-media-listing-border-light: #f3f4f6;

			--ccl-media-listing-bg-page: #f9fafb; /* Very Light Gray */

			--ccl-media-listing-bg-white: #ffffff;

			--ccl-media-listing-green: #10b981; /* Emerald Green */

			--ccl-media-listing-red: #ef4444; /* Red */

			--ccl-media-listing-purple: #8b5cf6; /* Purple */

			--ccl-media-listing-yellow: #f59e0b; /* Amber */



			/* Scoped Base Styles */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

			line-height: 1.6;

			color: var(--ccl-media-listing-text-primary);

			background: var(--ccl-media-listing-bg-page); /* Background applied to the wrapper */

			font-size: 15px;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}



		/* Scoped Reset */

		.ccl-media-listing-page *,

		.ccl-media-listing-page *::before,

		.ccl-media-listing-page *::after {

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}



		/* Skip link for accessibility */

		.ccl-media-listing-page .ccl-media-listing-skip-link {

			position: absolute;

			top: -40px;

			left: 0;

			background: var(--ccl-media-listing-primary);

			color: white;

			padding: 8px 16px;

			text-decoration: none;

			z-index: 10000;

		}

		.ccl-media-listing-page .ccl-media-listing-skip-link:focus { top: 0; }



		/* General Container */

		.ccl-media-listing-page .ccl-media-listing-container {

			max-width: 1400px;

			margin: 0 auto;

			padding: 3rem 1.5rem;

		}



		/* Keyframe Animations */

		@keyframes ccl-media-listing-spin {

			to { transform: translateX(-50%) rotate(360deg); }

		}

		@keyframes ccl-media-listing-fadeIn {

			from { opacity: 0; transform: translateY(10px); }

			to { opacity: 1; transform: translateY(0); }

		}



		/* ========================================

		   HERO SECTION

		   ======================================== */

		.ccl-media-listing-page .ccl-media-listing-hero-section {

			position: relative;

			background: linear-gradient(135deg, #e0f2fe 0%, #ffffff 70%);

			padding: 5rem 0 4rem;

			border-bottom: 1px solid var(--ccl-media-listing-border);

			overflow: hidden;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-container {

			position: relative;

			z-index: 1;

			max-width: 1200px;

			margin: 0 auto;

			padding: 0 1.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-content {

			max-width: 800px;

			margin: 0 auto;

			text-align: center;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-badge {

			display: inline-flex;

			align-items: center;

			gap: 0.5rem;

			padding: 0.625rem 1.25rem;

			background: white;

			color: var(--ccl-media-listing-primary);

			border: 1px solid var(--ccl-media-listing-primary-light);

			border-radius: 50px;

			font-size: 0.875rem;

			font-weight: 700;

			letter-spacing: 0.05em;

			text-transform: uppercase;

			margin-bottom: 1.75rem;

			box-shadow: 0 2px 8px rgba(30, 58, 138, 0.1);

		}

		.ccl-media-listing-page .ccl-media-listing-hero-badge i {

			color: var(--ccl-media-listing-primary-light);

		}

		.ccl-media-listing-page .ccl-media-listing-hero-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 6vw, 3.5rem);

			font-weight: 900;

			line-height: 1.1;

			letter-spacing: -0.03em;

			color: var(--ccl-media-listing-text-primary);

			margin-bottom: 1.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-title-highlight {

			background: linear-gradient(135deg, var(--ccl-media-listing-primary) 0%, var(--ccl-media-listing-secondary) 100%);

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

			display: inline;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-subtitle {

			font-size: clamp(1.1rem, 2.5vw, 1.25rem);

			line-height: 1.7;

			color: var(--ccl-media-listing-text-secondary);

			max-width: 650px;

			margin: 0 auto 3rem;

			font-weight: 400;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-wrapper {

			max-width: 700px;

			margin: 0 auto;

			position: relative;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-box {

			background: white;

			border: 2px solid var(--ccl-media-listing-border);

			border-radius: 16px;

			padding: 1rem 1.25rem 1rem 3.5rem;

			display: flex;

			align-items: center;

			gap: 0.75rem;

			transition: all 0.3s ease;

			box-shadow: 0 6px 16px rgba(0, 0, 0, 0.07);

			position: relative;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-box:focus-within {

			border-color: var(--ccl-media-listing-primary);

			box-shadow: 0 8px 24px rgba(30, 58, 138, 0.15);

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-icon {

			position: absolute;

			left: 1.25rem;

			top: 50%;

			transform: translateY(-50%);

			color: var(--ccl-media-listing-text-tertiary);

			font-size: 1.25rem;

			transition: color 0.2s;

			pointer-events: none;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-box:focus-within .ccl-media-listing-hero-search-icon {

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-input {

			flex: 1;

			border: none;

			outline: none;

			font-size: 1.125rem;

			color: var(--ccl-media-listing-text-primary);

			background: transparent;

			min-width: 0;

		}

		.ccl-media-listing-page .ccl-media-listing-hero-search-input::placeholder {

			color: var(--ccl-media-listing-text-tertiary);

			font-size: 1.125rem;

		}



		/* ========================================

		   MAIN LAYOUT (GRID & CONTENT AREAS)

		   ======================================== */

		.ccl-media-listing-page .ccl-media-listing-layout {

			display: grid;

			grid-template-columns: 1fr 300px;

			gap: 3rem;

			grid-template-areas: "main sidebar";

			transition: grid-template-columns 0.3s ease;

		}

		.ccl-media-listing-page .ccl-media-listing-layout.ccl-media-listing-sidebar-collapsed {

			grid-template-columns: 1fr;

			grid-template-areas: "main";

		}

		.ccl-media-listing-page .ccl-media-listing-layout.ccl-media-listing-sidebar-collapsed .ccl-media-listing-sidebar {

			display: none;

		}

		.ccl-media-listing-page .ccl-media-listing-main-content {

			grid-area: main;

			min-width: 0;

			position: relative; /* For loader */

		}



		/* ========================================

		   SIDEBAR & FILTERS

		   ======================================== */

		.ccl-media-listing-page .ccl-media-listing-sidebar {

			grid-area: sidebar;

			position: sticky;

			top: 2rem;

			height: fit-content;

		}

		.ccl-media-listing-page .ccl-media-listing-sidebar-section {

			background: white;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 14px;

			padding: 1.75rem;

			margin-bottom: 1.5rem;

			box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);

		}

		.ccl-media-listing-page .ccl-media-listing-sidebar-section h3 {

			font-size: 1.0625rem;

			font-weight: 700;

			color: var(--ccl-media-listing-text-primary);

			margin-bottom: 1.25rem;

			display: flex;

			align-items: center;

			gap: 0.625rem;

			padding-bottom: 0.875rem;

			border-bottom: 2px solid var(--ccl-media-listing-border-light);

		}



		/* Filter Group Styling */

		.ccl-media-listing-page .ccl-media-listing-filter-group {

			margin-bottom: 1.75rem;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-group:last-of-type {

			margin-bottom: 0;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-group > label {

			display: flex;

			align-items: center;

			justify-content: space-between;

			font-size: 0.8125rem;

			font-weight: 700;

			color: var(--ccl-media-listing-text-primary);

			margin-bottom: 0.875rem;

			text-transform: uppercase;

			letter-spacing: 0.03em;

			cursor: pointer;

			user-select: none;

			padding: 0.5rem 0;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-group > label.collapsible:hover {

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-filter-group > label i { /* Chevron icon */

			transition: transform 0.3s ease;

			font-size: 0.75rem;

			color: var(--ccl-media-listing-text-tertiary);

		}

		.ccl-media-listing-page .ccl-media-listing-filter-group > label.collapsed i {

			transform: rotate(-90deg);

		}



		/* Filter Options Container (Collapsible) */

		.ccl-media-listing-page .ccl-media-listing-filter-options {

			display: flex;

			flex-direction: column;

			gap: 0.375rem;

			max-height: 1000px;

			overflow: hidden;

			transition: max-height 0.4s ease-out, opacity 0.3s ease-in;

			opacity: 1;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-options.collapsed {

			max-height: 0;

			opacity: 0;

			transition: max-height 0.3s ease-in, opacity 0.2s ease-out;

		}



		/* Custom Checkbox Styles */

		.ccl-media-listing-page .ccl-media-listing-checkbox-wrapper {

			display: flex;

			align-items: center;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-wrapper input[type="checkbox"] {

			position: absolute;

			opacity: 0;

			cursor: pointer;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-label {

			display: flex;

			align-items: center;

			gap: 0.75rem;

			padding: 0.75rem 0.875rem;

			border-radius: 10px;

			cursor: pointer;

			transition: all 0.2s;

			font-size: 0.9375rem;

			color: var(--ccl-media-listing-text-secondary);

			width: 100%;

			user-select: none;

			border: 1px solid transparent;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-label:hover {

			background: var(--ccl-media-listing-bg-page);

			border-color: var(--ccl-media-listing-border);

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-custom { /* The visible box */

			width: 20px;

			height: 20px;

			border: 2px solid var(--ccl-media-listing-border);

			border-radius: 6px;

			background: white;

			flex-shrink: 0;

			display: flex;

			align-items: center;

			justify-content: center;

			transition: all 0.2s;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-wrapper input:checked ~ .ccl-media-listing-checkbox-label .ccl-media-listing-checkbox-custom {

			background: var(--ccl-media-listing-primary);

			border-color: var(--ccl-media-listing-primary);

			transform: scale(1.05);

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-custom::after { /* The checkmark */

			content: '';

			width: 5px;

			height: 9px;

			border: solid white;

			border-width: 0 2.5px 2.5px 0;

			transform: rotate(45deg);

			opacity: 0;

			transition: opacity 0.2s;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-wrapper input:checked ~ .ccl-media-listing-checkbox-label .ccl-media-listing-checkbox-custom::after {

			opacity: 1;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-wrapper input:checked ~ .ccl-media-listing-checkbox-label { /* Checked state label */

			background: #eff6ff;

			border-color: #bfdbfe;

			color: var(--ccl-media-listing-text-primary);

			font-weight: 600;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-count { /* Count badge */

			margin-left: auto;

			font-size: 0.8125rem;

			font-weight: 600;

			background: var(--ccl-media-listing-border-light);

			padding: 0.25rem 0.625rem;

			border-radius: 12px;

			min-width: 32px;

			text-align: center;

		}

		.ccl-media-listing-page .ccl-media-listing-checkbox-wrapper input:checked ~ .ccl-media-listing-checkbox-label .ccl-media-listing-filter-count {

			color: white;

			background: var(--ccl-media-listing-primary);

		}



		/* Topics List Styles */

		.ccl-media-listing-page .ccl-media-listing-topics-list {

			list-style: none;

		}

		.ccl-media-listing-page .ccl-media-listing-topics-list li {

			margin-bottom: 0.375rem;

			display: block;

			overflow: hidden;

			max-height: 100px; /* For show/hide animation */

			transition: max-height 0.3s ease-out, opacity 0.3s ease-out;

			opacity: 1;

		}

		.ccl-media-listing-page .ccl-media-listing-topics-list li.ccl-media-listing-hidden-topic {

			max-height: 0;

			opacity: 0;

			margin-bottom: 0;

			transition: max-height 0.3s ease-in, opacity 0.2s ease-in;

		}

		.ccl-media-listing-page .ccl-media-listing-topics-list a {

			display: flex;

			align-items: center;

			justify-content: space-between;

			padding: 0.75rem 0.875rem;

			border-radius: 10px;

			font-size: 0.9375rem;

			color: var(--ccl-media-listing-text-secondary);

			text-decoration: none;

			transition: all 0.2s;

			font-weight: 500;

			border: 1px solid transparent;

			cursor: pointer;

		}

		.ccl-media-listing-page .ccl-media-listing-topics-list a:hover {

			background: var(--ccl-media-listing-bg-page);

			border-color: var(--ccl-media-listing-border);

			color: var(--ccl-media-listing-text-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-topics-list a.active {

			background: #eff6ff;

			border-color: #bfdbfe;

			color: var(--ccl-media-listing-primary);

			font-weight: 600;

		}

		.ccl-media-listing-page .ccl-media-listing-topic-count { /* Topic count badge */

			font-size: 0.8125rem;

			padding: 0.25rem 0.625rem;

			background: var(--ccl-media-listing-border-light);

			border-radius: 12px;

			font-weight: 600;

			min-width: 32px;

			text-align: center;

		}

		.ccl-media-listing-page .ccl-media-listing-topics-list a.active .ccl-media-listing-topic-count {

			background: var(--ccl-media-listing-primary);

			color: white;

		}



		/* Show More/Less Button */

		.ccl-media-listing-page .ccl-media-listing-show-more-btn {

			width: 100%;

			padding: 0.75rem;

			background: white;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 10px;

			color: var(--ccl-media-listing-text-secondary);

			font-size: 0.875rem;

			font-weight: 600;

			cursor: pointer;

			transition: all 0.2s;

			margin-top: 0.5rem;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 0.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-show-more-btn:hover {

			background: var(--ccl-media-listing-bg-page);

			border-color: var(--ccl-media-listing-primary);

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-show-more-btn i { /* Chevron icon */

			transition: transform 0.3s ease;

			font-size: 0.75rem;

		}

		.ccl-media-listing-page .ccl-media-listing-show-more-btn.expanded i {

			transform: rotate(180deg);

		}



		/* Clear Filters Button */

		.ccl-media-listing-page .ccl-media-listing-clear-filters {

			width: 100%;

			padding: 0.875rem;

			background: white;

			border: 2px solid var(--ccl-media-listing-border);

			border-radius: 10px;

			color: var(--ccl-media-listing-text-secondary);

			font-size: 0.9375rem;

			font-weight: 600;

			cursor: pointer;

			transition: all 0.2s;

			margin-top: 1.25rem;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 0.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-clear-filters:hover {

			background: #fef2f2;

			border-color: #fca5a5;

			color: var(--ccl-media-listing-red);

		}



		/* Mobile Filter Toggle Button */

		.ccl-media-listing-page .ccl-media-listing-mobile-filter-toggle {

			display: none; /* Hidden by default */

			width: 100%;

			padding: 0.875rem 1.25rem;

			background: white;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 10px;

			color: var(--ccl-media-listing-text-primary);

			font-size: 1rem;

			font-weight: 600;

			cursor: pointer;

			margin-bottom: 1.5rem;

			justify-content: space-between;

			align-items: center;

		}



		/* ========================================

		   ARTICLE LISTING & CONTROLS

		   ======================================== */



		/* Loading State & Spinner */

		.ccl-media-listing-page .ccl-media-listing-loader {

			position: absolute;

			top: 10rem;

			left: 50%;

			transform: translateX(-50%);

			width: 50px;

			height: 50px;

			border: 5px solid var(--ccl-media-listing-border-light);

			border-top-color: var(--ccl-media-listing-primary);

			border-radius: 50%;

			animation: ccl-media-listing-spin 1s linear infinite;

			z-index: 10;

			display: none; /* Hidden by default */

		}

		.ccl-media-listing-page .ccl-media-listing-main-content.ccl-media-listing-loading .ccl-media-listing-loader {

			display: block;

		}

		.ccl-media-listing-page .ccl-media-listing-main-content.ccl-media-listing-loading .ccl-media-listing-articles-grid,

		.ccl-media-listing-page .ccl-media-listing-main-content.ccl-media-listing-loading .ccl-media-listing-pagination-container,

		.ccl-media-listing-page .ccl-media-listing-main-content.ccl-media-listing-loading .ccl-media-listing-no-results {

			opacity: 0.3;

			pointer-events: none; /* Prevent interaction */

		}



		/* Results Header (Count & Controls) */

		.ccl-media-listing-page .ccl-media-listing-results-header {

			display: flex;

			justify-content: space-between;

			align-items: center;

			margin-bottom: 2rem;

			padding-bottom: 1.25rem;

			border-bottom: 2px solid var(--ccl-media-listing-border);

		}

		.ccl-media-listing-page .ccl-media-listing-results-count {

			font-size: 0.9375rem;

			color: var(--ccl-media-listing-text-secondary);

			font-weight: 500;

		}

		.ccl-media-listing-page .ccl-media-listing-results-count strong {

			color: var(--ccl-media-listing-text-primary);

			font-weight: 700;

		}

		.ccl-media-listing-page .ccl-media-listing-controls { /* Container for toggle buttons */

			display: flex;

			align-items: center;

			gap: 0.75rem;

		}



		/* Desktop Filter Toggle Button */

		.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn {

			display: flex; /* Shown on desktop */

			align-items: center;

			gap: 0.5rem;

			padding: 0.5rem 1rem;

			background: white;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 10px;

			color: var(--ccl-media-listing-text-secondary);

			font-size: 0.9375rem;

			font-weight: 600;

			cursor: pointer;

			transition: all 0.2s;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn:hover {

			background: var(--ccl-media-listing-bg-page);

			border-color: var(--ccl-media-listing-primary);

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn.active {

			background: #eff6ff;

			border-color: var(--ccl-media-listing-primary);

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn i:last-child { /* Chevron */

			transition: transform 0.3s ease;

			font-size: 0.75rem;

		}

		.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn.active i:last-child {

			transform: rotate(180deg);

		}



		/* View Toggle (Grid/List) */

		.ccl-media-listing-page .ccl-media-listing-view-toggle {

			display: flex;

			gap: 0.5rem;

			background: white;

			padding: 0.375rem;

			border-radius: 10px;

			border: 1px solid var(--ccl-media-listing-border);

		}

		.ccl-media-listing-page .ccl-media-listing-view-btn {

			padding: 0.5rem 0.75rem;

			border: none;

			background: transparent;

			color: var(--ccl-media-listing-text-tertiary);

			cursor: pointer;

			border-radius: 7px;

			transition: all 0.2s;

			font-size: 1rem;

		}

		.ccl-media-listing-page .ccl-media-listing-view-btn.active {

			background: var(--ccl-media-listing-primary);

			color: white;

		}



		/* Articles Grid Container */

		.ccl-media-listing-page .ccl-media-listing-articles-grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

			gap: 1.5rem;

			margin-bottom: 3rem;

			transition: opacity 0.3s;

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view { /* List view modifier */

			grid-template-columns: 1fr;

			gap: 1rem;

		}



		/* No Results Message */

		.ccl-media-listing-page .ccl-media-listing-no-results {

			grid-column: 1 / -1; /* Span full width */

			text-align: center;

			padding: 4rem 2rem;

			background: white;

			border-radius: 16px;

			border: 2px dashed var(--ccl-media-listing-border);

			margin: 2rem 0;

		}

		.ccl-media-listing-page .ccl-media-listing-no-results-icon {

			width: 80px;

			height: 80px;

			margin: 0 auto 1.5rem;

			background: var(--ccl-media-listing-bg-page);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

		}

		.ccl-media-listing-page .ccl-media-listing-no-results-icon i {

			font-size: 2rem;

			color: var(--ccl-media-listing-text-tertiary);

		}

		.ccl-media-listing-page .ccl-media-listing-no-results h3 {

			font-size: 1.5rem;

			margin-bottom: 0.75rem;

		}

		.ccl-media-listing-page .ccl-media-listing-no-results p {

			color: var(--ccl-media-listing-text-secondary);

			margin-bottom: 2rem;

		}

		.ccl-media-listing-page .ccl-media-listing-no-results button { /* Clear filters button inside no results */

			padding: 0.875rem 2rem;

			background: var(--ccl-media-listing-primary);

			color: white;

			border: none;

			border-radius: 10px;

			font-weight: 600;

			cursor: pointer;

			transition: background 0.2s;

		}

		.ccl-media-listing-page .ccl-media-listing-no-results button:hover {

			background: var(--ccl-media-listing-primary-hover);

		}



		/* Individual Article Card */

		.ccl-media-listing-page .ccl-media-listing-article-card {

			background: white;

			border-radius: 12px;

			overflow: hidden;

			box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			border: 1px solid var(--ccl-media-listing-border);

			display: flex;

			flex-direction: column;

			height: 100%; /* Ensure cards align in grid */

			animation: ccl-media-listing-fadeIn 0.3s ease-in both; /* Fade-in animation */

		}

		.ccl-media-listing-page .ccl-media-listing-article-card:hover {

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);

			border-color: var(--ccl-media-listing-primary);

		}



		/* Article Card Header (Grid View) */

		.ccl-media-listing-page .ccl-media-listing-article-header {

			display: flex;

			flex-direction: column;

			align-items: center;

			padding: 2rem 1.5rem 1.25rem;

			background: linear-gradient(180deg, var(--ccl-media-listing-bg-page) 0%, white 100%);

			border-bottom: 1px solid var(--ccl-media-listing-border-light);

		}

		.ccl-media-listing-page .ccl-media-listing-outlet-avatar {

			width: 64px;

			height: 64px;

			border-radius: 12px;

			object-fit: contain;

			background: white;

			padding: 12px;

			border: 2px solid var(--ccl-media-listing-border);

			margin-bottom: 1rem;

			transition: all 0.3s ease;

		}

		.ccl-media-listing-page .ccl-media-listing-article-card:hover .ccl-media-listing-outlet-avatar {

			border-color: var(--ccl-media-listing-primary);

			transform: scale(1.05);

		}

		.ccl-media-listing-page .ccl-media-listing-outlet-name {

			font-size: 0.9375rem;

			font-weight: 700;

			color: var(--ccl-media-listing-text-primary);

			margin-bottom: 0.25rem;

			text-align: center;

		}

		.ccl-media-listing-page .ccl-media-listing-article-date {

			font-size: 0.8125rem;

			color: var(--ccl-media-listing-text-tertiary);

			display: flex;

			align-items: center;

			gap: 0.375rem;

		}



		/* Article Card Content (Grid & List View shared) */

		.ccl-media-listing-page .ccl-media-listing-article-content {

			padding: 1.5rem;

			display: flex;

			flex-direction: column;

			flex: 1; /* Allow content to grow */

		}

		.ccl-media-listing-page .ccl-media-listing-article-tags {

			display: flex;

			align-items: center;

			gap: 0.5rem;

			margin-bottom: 1rem;

			flex-wrap: wrap;

		}

		.ccl-media-listing-page .ccl-media-listing-article-topic {

			display: inline-flex;

			align-items: center;

			gap: 0.375rem;

			padding: 0.375rem 0.75rem;

			background: #eff6ff;

			color: var(--ccl-media-listing-primary);

			border-radius: 6px;

			font-size: 0.75rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.05em;

		}

		.ccl-media-listing-page .ccl-media-listing-format-badge {

			display: inline-flex;

			align-items: center;

			gap: 0.375rem;

			padding: 0.375rem 0.75rem;

			border-radius: 6px;

			font-size: 0.75rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.05em;

		}

		/* Specific format badge styles */

		.ccl-media-listing-page .ccl-media-listing-format-badge.ccl-media-listing-format-article { background: #dbeafe; color: #0284c7; }

		.ccl-media-listing-page .ccl-media-listing-format-badge.ccl-media-listing-format-video { background: #fee2e2; color: #dc2626; }

		.ccl-media-listing-page .ccl-media-listing-format-badge.ccl-media-listing-format-podcast { background: #f3e8ff; color: #7c3aed; }

		.ccl-media-listing-page .ccl-media-listing-format-badge.ccl-media-listing-format-interview { background: #dcfce7; color: #16a34a; }



		.ccl-media-listing-page .ccl-media-listing-article-title {

			font-size: 1.125rem;

			font-weight: 700;

			line-height: 1.4;

			color: var(--ccl-media-listing-text-primary);

			margin-bottom: 0.75rem;

			display: -webkit-box;

			-webkit-line-clamp: 3; /* Clamp title in grid view */

			-webkit-box-orient: vertical;

			overflow: hidden;

		}

		.ccl-media-listing-page .ccl-media-listing-article-card:hover .ccl-media-listing-article-title {

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-article-excerpt {

			font-size: 0.9375rem;

			line-height: 1.6;

			color: var(--ccl-media-listing-text-secondary);

			margin-bottom: 1.25rem;

			display: -webkit-box;

			-webkit-line-clamp: 3; /* Clamp excerpt in grid view */

			-webkit-box-orient: vertical;

			overflow: hidden;

			flex: 1; /* Allow excerpt to grow and push 'Read More' down */

		}

		.ccl-media-listing-page .ccl-media-listing-read-more {

			display: inline-flex;

			align-items: center;

			gap: 0.5rem;

			color: var(--ccl-media-listing-primary);

			font-weight: 600;

			font-size: 0.875rem;

			text-decoration: none;

			transition: gap 0.2s ease;

			padding-top: 1rem;

			border-top: 1px solid var(--ccl-media-listing-border-light);

			margin-top: auto; /* Push to bottom */

		}

		.ccl-media-listing-page .ccl-media-listing-read-more:hover { gap: 0.75rem; }



		/* Meta info shown only in List View */

		.ccl-media-listing-page .ccl-media-listing-article-meta-list {

			display: none; /* Hidden by default */

			align-items: center;

			gap: 1rem;

			padding-top: 0.75rem;

			margin-top: 0.75rem;

			border-top: 1px solid var(--ccl-media-listing-border-light);

			font-size: 0.8125rem;

			color: var(--ccl-media-listing-text-tertiary);

		}

		.ccl-media-listing-page .ccl-media-listing-article-meta-item {

			display: flex;

			align-items: center;

			gap: 0.375rem;

		}



		/* List View Specific Card Adjustments */

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-card {

			flex-direction: row;

			align-items: stretch; /* Stretch header and content vertically */

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-header {

			flex-shrink: 0;

			width: 160px;

			border-right: 1px solid var(--ccl-media-listing-border-light);

			border-bottom: none;

			justify-content: center;

			padding: 1.5rem 1rem;

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-outlet-avatar {

			width: 56px;

			height: 56px;

			margin-bottom: 0.75rem;

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-date {

			display: none; /* Hide date in header */

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-content {

			flex: 1;

			padding: 1.25rem 1.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-title {

			-webkit-line-clamp: 2; /* Shorter clamp for title */

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-excerpt {

			-webkit-line-clamp: 2; /* Shorter clamp for excerpt */

			font-size: 0.9rem; /* Slightly smaller excerpt text */

			margin: 0.5rem 0 0.75rem;

			color: var(--ccl-media-listing-text-secondary);

			flex-grow: 0; /* Don't let excerpt grow excessively */

			line-height: 1.45;

			max-height: calc(1.45em * 2); /* Fallback for non-webkit */

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-meta-list {

			display: flex; /* Show meta list */

			margin-top: auto; /* Push meta + read more down */

			margin-bottom: 1rem;

			border-top: none;

			padding-top: 0;

		}

		.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-read-more {

			border-top: none;

			padding-top: 0;

			margin-top: 0;

		}



		/* ========================================

		   PAGINATION

		   ======================================== */

		.ccl-media-listing-page .ccl-media-listing-pagination-container {

			display: flex;

			justify-content: center;

			align-items: center;

			gap: 0.5rem;

			margin: 2rem 0;

			flex-wrap: wrap;

		}

		.ccl-media-listing-page .ccl-media-listing-page-link {

			display: flex;

			align-items: center;

			justify-content: center;

			text-decoration: none;

			color: var(--ccl-media-listing-text-secondary);

			font-weight: 600;

			font-size: 0.9375rem;

			padding: 0.75rem 1.125rem;

			min-width: 44px;

			height: 44px;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 10px;

			background: white;

			cursor: pointer;

			transition: all 0.2s;

		}

		.ccl-media-listing-page .ccl-media-listing-page-link:hover {

			background: var(--ccl-media-listing-bg-page);

			border-color: var(--ccl-media-listing-primary);

			color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-page-link.active {

			background: var(--ccl-media-listing-primary);

			border-color: var(--ccl-media-listing-primary);

			color: white;

			font-weight: 700;

		}

		.ccl-media-listing-page .ccl-media-listing-page-link.disabled {

			color: var(--ccl-media-listing-text-tertiary);

			background: var(--ccl-media-listing-bg-page);

			cursor: not-allowed;

			pointer-events: none;

		}

		.ccl-media-listing-page .ccl-media-listing-page-link.dots {

			border: none;

			background: transparent;

			padding: 0.75rem 0.25rem;

			cursor: default;

		}

		.ccl-media-listing-page .ccl-media-listing-page-link.dots:hover {

			background: transparent;

			color: var(--ccl-media-listing-text-secondary);

			border: none;

		}



		/* ========================================

		   MEDIA SUITE (RESOURCES & ENQUIRIES)

		   ======================================== */

		.ccl-media-listing-page .ccl-media-listing-media-suite {

			display: flex;

			flex-wrap: wrap;

			align-items: flex-start;

			gap: 2rem;

			margin-bottom: 2.5rem;

			background: var(--ccl-media-listing-bg-white);

			padding: 2rem;

			border-radius: 16px;

			border: 1px solid var(--ccl-media-listing-border);

			box-shadow: 0 4px 12px rgba(0,0,0,0.05);

		}



		/* Media Assets Section (Left) */

		.ccl-media-listing-page .ccl-media-listing-media-assets {

			flex: 1 1 65%; /* Take more space */

			min-width: 320px;

		}

		.ccl-media-listing-page .ccl-media-listing-assets-header h2 {

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ccl-media-listing-primary);

			display: flex;

			gap: .75rem;

			align-items: center;

			padding-bottom: 0.5rem;

			border-bottom: 2px solid var(--ccl-media-listing-primary-light);

			margin-bottom: 0.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-assets-header h2 i {

			color: var(--ccl-media-listing-primary-light);

			font-size: 1.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-assets-sub {

			color: var(--ccl-media-listing-text-secondary);

			margin: .25rem 0 1.5rem;

			font-size: 1rem;

		}



		/* Assets Tools (Search & Filter Chips) */

		.ccl-media-listing-page .ccl-media-listing-assets-tools {

			display: flex;

			gap: .75rem;

			align-items: center;

			flex-wrap: wrap;

			margin-bottom: 1.5rem;

		}

		.ccl-media-listing-page .ccl-media-listing-search-wrap {

			position: relative;

			display: flex;

			align-items: center;

			flex-grow: 1; /* Allow search to grow */

		}

		.ccl-media-listing-page .ccl-media-listing-search-wrap i { /* Search icon */

			position: absolute;

			left: .85rem;

			color: var(--ccl-media-listing-text-tertiary);

			font-size: 1rem;

		}

		.ccl-media-listing-page #ccl-media-listing-assets-search { /* Assets search input */

			padding: .75rem 1rem .75rem 2.5rem;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 10px;

			background: #fff;

			width: 100%;

			font-size: 1rem;

			box-shadow: inset 0 1px 2px rgba(0,0,0,0.05);

			transition: border-color .2s, box-shadow .2s;

		}

		.ccl-media-listing-page #ccl-media-listing-assets-search::placeholder {

			color: var(--ccl-media-listing-text-tertiary);

		}

		.ccl-media-listing-page #ccl-media-listing-assets-search:focus {

			outline: none;

			border-color: var(--ccl-media-listing-primary);

			box-shadow: 0 0 0 3px rgba(30,58,138,.12);

		}

		.ccl-media-listing-page .ccl-media-listing-filter-chips { /* Asset type filter chips */

			display: flex;

			gap: .5rem;

			flex-shrink: 0; /* Prevent chips shrinking too much */

		}

		.ccl-media-listing-page .ccl-media-listing-chip { /* General chip style */

			font-size: .875rem;

			font-weight: 600;

			padding: .4rem .9rem;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 8px;

			background: #fff;

			color: var(--ccl-media-listing-text-secondary);

			cursor: pointer;

			transition: all .2s;

			box-shadow: 0 1px 2px rgba(0,0,0,0.04);

		}

		.ccl-media-listing-page .ccl-media-listing-chip:hover {

			border-color: #cdd2d8;

			background: var(--ccl-media-listing-bg-page);

			color: var(--ccl-media-listing-text-primary);

			box-shadow: 0 2px 4px rgba(0,0,0,0.06);

			transform: translateY(-1px);

		}

		.ccl-media-listing-page .ccl-media-listing-chip.active {

			border-color: var(--ccl-media-listing-primary);

			color: var(--ccl-media-listing-primary);

			background: #eff6ff;

			font-weight: 700;

			box-shadow: none;

			transform: none;

		}

		.ccl-media-listing-page .ccl-media-listing-chip.meta { /* Smaller chip for meta info */

			font-size: 0.75rem;

			font-weight: 500;

			padding: .2rem .6rem;

			background: var(--ccl-media-listing-bg-page);

			color: var(--ccl-media-listing-text-secondary);

			border-radius: 6px;

			box-shadow: none;

			cursor: default;

		}

		.ccl-media-listing-page .ccl-media-listing-chip.meta:hover {

			transform: none;

			background: var(--ccl-media-listing-bg-page); /* No hover effect */

		}



		/* Media Suite Tabs */

		.ccl-media-listing-page .ccl-media-listing-media-tabs {

			display: flex;

			gap: .25rem;

			border-bottom: 2px solid var(--ccl-media-listing-border);

			margin: 1.5rem 0 0;

		}

		.ccl-media-listing-page .ccl-media-listing-tab-button {

			border: none;

			background: transparent;

			padding: .75rem 1rem;

			border-radius: 8px 8px 0 0;

			font-weight: 700;

			color: var(--ccl-media-listing-text-secondary);

			cursor: pointer;

			position: relative;

			top: 2px; /* Align with bottom border */

			transition: all .2s;

			font-size: 0.95rem;

		}

		.ccl-media-listing-page .ccl-media-listing-tab-button i { margin-right: 0.5rem; }

		.ccl-media-listing-page .ccl-media-listing-tab-button:hover {

			color: var(--ccl-media-listing-text-primary);

			background-color: var(--ccl-media-listing-bg-page);

		}

		.ccl-media-listing-page .ccl-media-listing-tab-button.active {

			background: var(--ccl-media-listing-bg-white);

			color: var(--ccl-media-listing-primary);

			border: 2px solid var(--ccl-media-listing-border);

			border-bottom-color: var(--ccl-media-listing-bg-white); /* Hide bottom border */

			font-weight: 800;

		}



		/* Tab Content Styling (Smooth Transition) */

		.ccl-media-listing-page .ccl-media-listing-tab-content-wrapper {

			position: relative;

			overflow: hidden;

			transition: height .28s cubic-bezier(.2,.7,.3,1); /* Height transition */

			will-change: height;

		}

		.ccl-media-listing-page .ccl-media-listing-tab-panel {

			background: var(--ccl-media-listing-bg-white);

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 0 0 14px 14px; /* Round bottom corners */

			border-top: none; /* Top border handled by tabs */

			padding: 1.5rem;

			box-shadow: 0 2px 8px rgba(0,0,0,0.03);

			/* Transition styles */

			position: absolute; /* Stack panels */

			inset: 0 0 auto 0; /* top:0; left:0; width:100% */

			width: 100%;

			opacity: 0;

			visibility: hidden;

			pointer-events: none;

			transform: translateY(6px); /* Slight vertical shift */

			transition: opacity .22s ease, transform .22s ease;

		}

		.ccl-media-listing-page .ccl-media-listing-tab-panel.active {

			position: relative; /* Take up space */

			opacity: 1;

			visibility: visible;

			pointer-events: auto;

			transform: translateY(0);

			z-index: 2; /* Ensure active is on top */

		}

		/* Temp state for measuring height during transition */

		.ccl-media-listing-page .ccl-media-listing-panel-measure {

			position: relative !important;

			visibility: hidden !important;

			opacity: 0 !important;

			pointer-events: none !important;

			transform: none !important;

		}

		@media (prefers-reduced-motion: reduce) { /* Respect reduced motion */

			.ccl-media-listing-page .ccl-media-listing-tab-content-wrapper { transition: none; }

			.ccl-media-listing-page .ccl-media-listing-tab-panel { transition: none; }

		}



		/* Assets Grid (Inside Tab) */

		.ccl-media-listing-page .ccl-media-listing-assets-grid {

			list-style: none;

			display: grid;

			gap: 1.25rem;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

		}

		.ccl-media-listing-page .ccl-media-listing-asset-card {

			display: flex;

			gap: 1rem;

			align-items: flex-start;

			padding: 1.25rem;

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 14px;

			background: #fff;

			transition: transform .2s, box-shadow .2s, border-color .2s;

			box-shadow: 0 2px 5px rgba(0,0,0,0.05);

		}

		.ccl-media-listing-page .ccl-media-listing-asset-card:hover {

			transform: translateY(-3px);

			border-color: var(--ccl-media-listing-primary-light);

			box-shadow: 0 8px 20px rgba(30,58,138,.1);

		}

		.ccl-media-listing-page .ccl-media-listing-asset-icon {

			width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;

			border-radius: 12px; background: #eef6ff; border: 1px solid #cce7ff;

			font-size: 1.25rem; color: var(--ccl-media-listing-primary);

			flex-shrink: 0;

		}

		.ccl-media-listing-page .ccl-media-listing-asset-body { flex: 1 1 auto; min-width: 0; }

		.ccl-media-listing-page .ccl-media-listing-asset-title { font-weight: 700; font-size: 1.05rem; color: var(--ccl-media-listing-text-primary); margin-bottom: 0.1rem; }

		.ccl-media-listing-page .ccl-media-listing-asset-sub { color: var(--ccl-media-listing-text-secondary); font-size: .9rem; line-height: 1.5; margin-top: .125rem; }

		.ccl-media-listing-page .ccl-media-listing-asset-meta { display: flex; gap: .375rem; flex-wrap: wrap; margin-top: .75rem; }

		.ccl-media-listing-page .ccl-media-listing-asset-actions {

			display: flex;

			gap: .5rem;

			flex-wrap: wrap;

			margin-left: auto; /* Push actions to the right */

			align-self: flex-end; /* Align to bottom of flex container */

			padding-top: 0.5rem; /* Space above actions */

		}



		/* Boilerplate Tab Styles */

		.ccl-media-listing-page .ccl-media-listing-boilerplate-grid {

			display: grid;

			gap: 1.5rem;

			grid-template-columns: 1fr; /* Default single column */

		}

		.ccl-media-listing-page .ccl-media-listing-boilerplate-card {

			border: 1px solid var(--ccl-media-listing-border);

			border-radius: 14px;

			background: #fff;

			padding: 0; /* Remove padding, handled by inner elements */

			overflow: hidden;

			box-shadow: 0 2px 8px rgba(0,0,0,0.04);

		}

		.ccl-media-listing-page .ccl-media-listing-bp-header {

			display: flex;

			justify-content: space-between;

			align-items: center;

			gap: 1rem;

			padding: 1rem 1.25rem 0.75rem;

			border-bottom: 1px solid var(--ccl-media-listing-border);

			background: var(--ccl-media-listing-bg-page);

		}

		.ccl-media-listing-page .ccl-media-listing-bp-header h3 { margin-bottom: 0; font-size: 1.05rem; font-weight: 700; color: var(--ccl-media-listing-text-primary); }

		.ccl-media-listing-page .ccl-media-listing-bp-content {

			padding: 1.25rem;

			background: #fff;

		}

		.ccl-media-listing-page .ccl-media-listing-bp-content p {

			color: var(--ccl-media-listing-text-secondary);

			font-size: 0.95rem;

			line-height: 1.65;

			margin: 0;

		}

		.ccl-media-listing-page .ccl-media-listing-bp-actions {

			margin-top: 0;

			display: flex;

			gap: .5rem;

		}



		/* Bios Tab Styles (Similar structure to Assets) */

		.ccl-media-listing-page .ccl-media-listing-bios-grid { list-style: none; display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }

		.ccl-media-listing-page .ccl-media-listing-bio-card {

			display: flex; gap: 1rem; align-items: flex-start; padding: 1.25rem; border: 1px solid var(--ccl-media-listing-border);

			border-radius: 14px; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.05);

			transition: transform .2s, box-shadow .2s, border-color .2s;

		}

		.ccl-media-listing-page .ccl-media-listing-bio-card:hover {

			transform: translateY(-3px);

			border-color: var(--ccl-media-listing-primary-light);

			box-shadow: 0 8px 20px rgba(30,58,138,.1);

		}

		.ccl-media-listing-page .ccl-media-listing-bio-icon {

			width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;

			border-radius: 12px; background: #eef6ff; border: 1px solid #cce7ff;

			font-size: 1.25rem; color: var(--ccl-media-listing-primary);

			flex-shrink: 0;

		}

		.ccl-media-listing-page .ccl-media-listing-bio-body { flex: 1; }

		.ccl-media-listing-page .ccl-media-listing-bio-title { font-weight: 700; font-size: 1.05rem; margin-bottom: 0.1rem; }

		.ccl-media-listing-page .ccl-media-listing-bio-sub { color: var(--ccl-media-listing-text-secondary); font-size: .9rem; margin-top: .125rem; }

		.ccl-media-listing-page .ccl-media-listing-bio-meta { display: flex; gap: .375rem; flex-wrap: wrap; margin-top: .75rem; }

		.ccl-media-listing-page .ccl-media-listing-bio-actions {

			display: flex;

			gap: .5rem;

			flex-wrap: wrap;

			margin-left: auto;

			align-self: flex-end;

			padding-top: 0.5rem;

		}



		/* Media Enquiries Section (Right) */

		.ccl-media-listing-page .ccl-media-listing-media-contact {

			flex: 0 0 clamp(280px, 30%, 340px); /* Fixed width range */

			background: linear-gradient(145deg, #eef6ff 0%, #e0f2fe 100%);

			padding: 1.75rem;

			border-radius: 14px;

			border: 1px solid #cce7ff;

			box-shadow: 0 4px 10px rgba(30, 58, 138, 0.08);

			display: flex; /* Enable flex for vertical centering */

			flex-direction: column;

		}

		.ccl-media-listing-page .ccl-media-listing-media-contact-inner {

			 margin: auto 0; /* Vertically center content */

		}

		.ccl-media-listing-page .ccl-media-listing-contact-heading {

			display: block;

			font-size: 1.25rem;

			font-weight: 800;

			margin-bottom: 0.5rem;

			color: var(--ccl-media-listing-text-primary);

			display: flex;

			align-items: center;

			gap: 0.6rem;

		}

		.ccl-media-listing-page .ccl-media-listing-contact-heading::before {

			content: '\f0e0'; /* Envelope icon */

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			color: var(--ccl-media-listing-primary);

			font-size: 1.1rem;

		}

		.ccl-media-listing-page .ccl-media-listing-media-contact .title { display: block; font-size: 1rem; color: var(--ccl-media-listing-text-secondary); margin-bottom: 1.5rem; }

		.ccl-media-listing-page .ccl-media-listing-media-contact p { margin: 0.75rem 0; display: flex; align-items: center; gap: 0.6rem; font-size: 1rem; }

		.ccl-media-listing-page .ccl-media-listing-media-contact p i { color: var(--ccl-media-listing-primary); width: 20px; text-align: center; font-size: 1.05rem; }

		.ccl-media-listing-page .ccl-media-listing-media-contact a { color: var(--ccl-media-listing-primary); font-weight: 600; text-decoration: none; word-break: break-word; }

		.ccl-media-listing-page .ccl-media-listing-media-contact a:hover { text-decoration: underline; color: var(--ccl-media-listing-primary-hover); }

		.ccl-media-listing-page .ccl-media-listing-contact-cta { margin-top: 1.5rem; }

		.ccl-media-listing-page .ccl-media-listing-contact-cta .ccl-media-listing-btn-primary {

			width: 100%;

			justify-content: center;

			padding: 0.75rem 1rem;

			color: #fff; /* Ensure text white */

		}

		.ccl-media-listing-page .ccl-media-listing-contact-cta .ccl-media-listing-btn-primary:hover {

			color: #fff; /* Keep text white */

		}



		/* Usage Note & Toast Message */

		.ccl-media-listing-page .ccl-media-listing-usage-note { margin-top: 1rem; color: var(--ccl-media-listing-text-secondary); font-size: .85rem; padding: 0.5rem 0; border-top: 1px dashed var(--ccl-media-listing-border-light); }

		.ccl-media-listing-page .ccl-media-listing-toast {

			position: fixed; left: 50%; transform: translateX(-50%); bottom: 24px;

			background: rgba(17, 24, 39, 0.95); color: #fff; padding: 0.75rem 1.25rem; border-radius: 8px;

			font-weight: 600; font-size: 0.9rem; opacity: 0; pointer-events: none;

			transition: opacity .2s, transform .2s, bottom .2s; z-index: 9999;

			box-shadow: 0 4px 12px rgba(0,0,0,0.2);

		}

		.ccl-media-listing-page .ccl-media-listing-toast.show { opacity: 1; bottom: 30px; transform: translateX(-50%); }



		/* ========================================

		   BUTTON STYLES (UNIQUE PREFIX)

		   ======================================== */

		.ccl-media-listing-page .ccl-media-listing-btn {

			display: inline-flex; align-items: center; gap: .4rem; padding: .55rem .9rem;

			border-radius: 8px; border: 1px solid var(--ccl-media-listing-border); background: #fff;

			font-weight: 600; cursor: pointer; text-decoration: none; color: var(--ccl-media-listing-text-secondary);

			transition: all .2s; box-shadow: 0 1px 2px rgba(0,0,0,0.05); font-size: 0.9rem;

		}

		.ccl-media-listing-page .ccl-media-listing-btn:hover {

			border-color: var(--ccl-media-listing-primary); color: var(--ccl-media-listing-primary);

			background: var(--ccl-media-listing-bg-page); box-shadow: 0 2px 4px rgba(0,0,0,0.07); transform: translateY(-1px);

		}

		.ccl-media-listing-page .ccl-media-listing-btn:active { transform: translateY(0); box-shadow: 0 1px 2px rgba(0,0,0,0.05); }



		/* Primary Button */

		.ccl-media-listing-page .ccl-media-listing-btn-primary {

			background: var(--ccl-media-listing-primary); color: #fff; border-color: var(--ccl-media-listing-primary);

		}

		.ccl-media-listing-page .ccl-media-listing-btn-primary:hover {

			background: var(--ccl-media-listing-primary-hover); color: #fff; border-color: var(--ccl-media-listing-primary-hover);

		}



		/* Micro Button Modifier */

		.ccl-media-listing-page .ccl-media-listing-btn.micro { padding: .4rem .75rem; font-size: .8rem; }



		/* Ghost Button Modifier (Micro only) */

		.ccl-media-listing-page .ccl-media-listing-btn.micro.ghost {

			background: transparent; border-color: transparent; box-shadow: none; color: var(--ccl-media-listing-text-secondary);

		}

		.ccl-media-listing-page .ccl-media-listing-btn.micro.ghost:hover {

			background: var(--ccl-media-listing-bg-page); border-color: var(--ccl-media-listing-border);

			color: var(--ccl-media-listing-primary); transform: none; box-shadow: none;

		}



		/* ========================================

		   RESPONSIVE STYLES

		   ======================================== */



		/* Tablet - Sidebar stacks, mobile filter appears */

		@media (max-width: 1024px) {

			.ccl-media-listing-page .ccl-media-listing-layout {

				grid-template-columns: 1fr;

				grid-template-areas: "sidebar" "main"; /* Stack sidebar on top */

			}

			.ccl-media-listing-page .ccl-media-listing-sidebar { position: static; } /* Remove sticky */

			.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn { display: none; } /* Hide desktop filter toggle */

			.ccl-media-listing-page .ccl-media-listing-mobile-filter-toggle { display: flex; } /* Show mobile filter toggle */

			.ccl-media-listing-page #sidebar-filter-content { display: none; } /* Hide filter content by default on mobile */

			.ccl-media-listing-page #sidebar-filter-content.is-open { display: block; } /* Show when toggled */



			.ccl-media-listing-page .ccl-media-listing-media-suite { display: block; padding: 1.5rem; } /* Stack media suite sections */

			.ccl-media-listing-page .ccl-media-listing-media-contact {

				margin-top: 1.5rem;

				flex-basis: auto; /* Reset flex sizing */

				align-self: auto;

				min-width: unset;

			}

		}



		/* Smaller Tablet / Large Phone - Adjust header, grid */

		@media (max-width: 768px) {

			.ccl-media-listing-page .ccl-media-listing-hero-section { padding: 4rem 0 3rem; }

			.ccl-media-listing-page .ccl-media-listing-hero-search-box { padding: 0.75rem 1rem 0.75rem 2.75rem; }

			.ccl-media-listing-page .ccl-media-listing-results-header { flex-direction: column; align-items: flex-start; gap: 1rem; }

			.ccl-media-listing-page .ccl-media-listing-controls { width: 100%; justify-content: flex-end; }

			.ccl-media-listing-page .ccl-media-listing-articles-grid { grid-template-columns: 1fr; } /* Force single column */

			/* List view adjustments for smaller screens */

			.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-card { flex-direction: column; } /* Stack vertically */

			.ccl-media-listing-page .ccl-media-listing-articles-grid.ccl-media-listing-list-view .ccl-media-listing-article-header { width: 100%; border-right: none; border-bottom: 1px solid var(--ccl-media-listing-border-light); }



			.ccl-media-listing-page .ccl-media-listing-boilerplate-grid { grid-template-columns: 1fr; } /* Ensure single column */

		}



		/* Small Phone - Reduce padding, font sizes */

		@media (max-width: 480px) {

			.ccl-media-listing-page .ccl-media-listing-container { padding: 2.5rem 1rem; }

			.ccl-media-listing-page .ccl-media-listing-hero-title { font-size: 2.25rem; }

			.ccl-media-listing-page .ccl-media-listing-filter-toggle-btn span { display: none; } /* Hide text in desktop toggle */

			.ccl-media-listing-page .ccl-media-listing-pagination-container { gap: 0.25rem; }

			.ccl-media-listing-page .ccl-media-listing-page-link { padding: 0.5rem 0.75rem; min-width: 38px; height: 38px; }

			.ccl-media-listing-page .ccl-media-listing-media-suite { padding: 1rem; }

			.ccl-media-listing-page .ccl-media-listing-assets-header h2 { font-size: 1.5rem; }

			.ccl-media-listing-page .ccl-media-listing-assets-tools { flex-direction: column; align-items: stretch; gap: 1rem; } /* Stack tools */

			.ccl-media-listing-page .ccl-media-listing-search-wrap { flex-grow: 0; }

			.ccl-media-listing-page #ccl-media-listing-assets-search { min-width: unset; }

			.ccl-media-listing-page .ccl-media-listing-filter-chips { justify-content: flex-start; flex-wrap: wrap; } /* Allow chips to wrap */

		}

		/* Scoped Variables and Base Styles */

		.ccl-res-page-wrapper {

			/* Moved variables from :root */

			--ccl-res-rhub-primary: #0b5cff;

			--ccl-res-rhub-primary-dark: #0847d1;

			--ccl-res-rhub-accent: #00d4aa;

			--ccl-res-rhub-media: #9333ea;

			--ccl-res-rhub-about: #f59e0b;

			--ccl-res-rhub-line: #e8ecf3;

			--ccl-res-rhub-bg: #fafbfd;

			--ccl-res-rhub-shadow: 0 1px 3px rgba(11, 92, 255, .06);

			--ccl-res-rhub-shadow-lg: 0 8px 16px rgba(11, 92, 255, .1);

			--ccl-res-rhub-radius: 12px;



			/* Applied body styles */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			color: #0b1324;

			background: var(--ccl-res-rhub-bg);

			line-height: 1.5;

			box-sizing: border-box; /* Apply box-sizing here */

		}

		

		/* Apply box-sizing to all elements within the wrapper */

		.ccl-res-page-wrapper *, 

		.ccl-res-page-wrapper *::before, 

		.ccl-res-page-wrapper *::after {

			 box-sizing: inherit;

			 margin: 0; /* Basic reset applied here */

			 padding: 0; /* Basic reset applied here */

		}





		.ccl-res-resources-container {

			max-width: 1280px;

			margin: 0 auto;

			padding: 0 20px;

		}



		/* Hero Section - Compact */

		.ccl-res-resources-hero {

			background: linear-gradient(135deg, var(--ccl-res-rhub-primary), var(--ccl-res-rhub-primary-dark));

			color: #fff;

			padding: 50px 0;

			position: relative;

			overflow: hidden;

		}



		.ccl-res-resources-hero::before {

			content: "";

			position: absolute;

			top: 0;

			right: 0;

			width: 40%;

			height: 100%;

			background: radial-gradient(circle at top right, rgba(255,255,255,.12), transparent);

			pointer-events: none;

		}



		.ccl-res-resources-hero-content {

			position: relative;

			z-index: 1;

			max-width: 800px;

		}



		.ccl-res-resources-hero-badge {

			display: inline-block;

			padding: 5px 12px;

			border-radius: 999px;

			background: rgba(255,255,255,.2);

			font-weight: 700;

			font-size: 11px;

			letter-spacing: .05em;

			text-transform: uppercase;

			margin-bottom: 12px;

		}



		.ccl-res-resources-hero h1 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-size: 36px;

			font-weight: 800;

			line-height: 1.2;

			margin-bottom: 10px;

		}



		.ccl-res-resources-hero p {

			font-size: 15px;

			line-height: 1.5;

			opacity: .92;

		}



		/* Search Section - Compact */

		.ccl-res-resources-controls {

			margin: -30px 0 30px;

			position: relative;

			z-index: 10;

			display: flex;

			gap: 12px;

			align-items: stretch; /* This makes flex items the same height */

		}



		.ccl-res-resources-search-box {

			flex: 1;

			background: #fff;

			border-radius: var(--ccl-res-rhub-radius);

			box-shadow: var(--ccl-res-rhub-shadow-lg);

			padding: 12px 16px;

			display: flex;

			gap: 12px;

			align-items: center;

			border: 1px solid var(--ccl-res-rhub-line);

		}



		.ccl-res-resources-search-input {

			flex: 1;

			border: none;

			font-size: 14px;

			padding: 8px 12px;

			color: #0b1324;

			font-weight: 500;

			background: transparent; /* Ensure input bg is transparent */

			outline: none; /* Remove default outline */

		}



		.ccl-res-resources-search-input:focus {

			outline: none;

		}



		.ccl-res-resources-search-input::placeholder {

			color: #7b8a9f;

		}



		.ccl-res-resources-search-icon {

			color: var(--ccl-res-rhub-primary);

			font-size: 16px;

		}



		/* Filter Dropdown */

		.ccl-res-filter-dropdown {

			position: relative;

		}



		.ccl-res-filter-toggle {

			background: #fff;

			border: 1px solid var(--ccl-res-rhub-line);

			border-radius: var(--ccl-res-rhub-radius);

			padding: 12px 20px;

			display: flex;

			align-items: center;

			gap: 10px;

			font-size: 14px;

			font-weight: 600;

			color: #0b1324;

			cursor: pointer;

			transition: all .2s;

			box-shadow: var(--ccl-res-rhub-shadow-lg);

			white-space: nowrap;

			min-width: 200px;

			height: 100%; /* Make the button fill its parent container */

			text-align: left; /* Ensure text aligns left */

			appearance: none; /* Remove default button appearance */

			font-family: inherit; /* Inherit font */

		}



		.ccl-res-filter-toggle:hover {

			border-color: var(--ccl-res-rhub-primary);

			box-shadow: var(--ccl-res-rhub-shadow-lg), 0 0 0 3px rgba(11,92,255,.1);

		}



		.ccl-res-filter-toggle i.fas.fa-filter {

			color: var(--ccl-res-rhub-primary);

			font-size: 14px;

		}



		.ccl-res-filter-text {

			flex: 1;

			text-align: left;

		}



		.ccl-res-filter-count {

			padding: 2px 8px;

			background: rgba(11,92,255,.1);

			color: var(--ccl-res-rhub-primary);

			border-radius: 999px;

			font-size: 11px;

			font-weight: 700;

		}



		.ccl-res-filter-arrow {

			color: #7b8a9f;

			font-size: 12px;

			transition: transform .2s;

		}



		.ccl-res-filter-dropdown.active .ccl-res-filter-arrow {

			transform: rotate(180deg);

		}



		.ccl-res-filter-menu {

			position: absolute;

			top: calc(100% + 8px);

			right: 0;

			background: #fff;

			border: 1px solid var(--ccl-res-rhub-line);

			border-radius: var(--ccl-res-rhub-radius);

			box-shadow: 0 8px 24px rgba(0,0,0,.12);

			padding: 8px;

			min-width: 240px;

			opacity: 0;

			visibility: hidden;

			transform: translateY(-10px);

			transition: all .2s;

			z-index: 100;

		}



		.ccl-res-filter-dropdown.active .ccl-res-filter-menu {

			opacity: 1;

			visibility: visible;

			transform: translateY(0);

		}



		.ccl-res-filter-option {

			padding: 0;

		}



		.ccl-res-filter-option label {

			display: flex;

			align-items: center;

			gap: 12px;

			padding: 10px 12px;

			cursor: pointer;

			border-radius: 8px;

			transition: background .2s;

			font-size: 14px; /* Ensure label text has base size */

			font-weight: 500; /* Ensure label text has base weight */

			color: #0b1324; /* Ensure label text has base color */

		}



		.ccl-res-filter-option label:hover {

			background: var(--ccl-res-rhub-bg);

		}



		.ccl-res-filter-checkbox {

			/* Keep hidden */

			position: absolute;

			opacity: 0;

			pointer-events: none;

		}



		.ccl-res-filter-checkbox-custom {

			width: 18px;

			height: 18px;

			border: 2px solid var(--ccl-res-rhub-line);

			border-radius: 4px;

			position: relative;

			transition: all .2s;

			flex-shrink: 0;

			display: inline-block; /* Make it visible */

			vertical-align: middle; /* Align with text */

			margin-right: 8px; /* Space between box and text */

		}

		

		 /* Style adjustments to make custom checkbox work with label */

		.ccl-res-filter-option label {

			position: relative; /* Needed for absolute positioning of checkbox */

			padding-left: 0; /* Adjust padding as custom box provides space */

		}

		.ccl-res-filter-option label .ccl-res-filter-option-text {

			 margin-left: 36px; /* Space for the custom checkbox (width + margin) */

		 }

		.ccl-res-filter-checkbox-custom {

			 position: absolute;

			 left: 12px; /* Position custom checkbox within label padding */

			 top: 50%;

			 transform: translateY(-50%);

			 margin-right: 0; /* Remove margin as positioned absolutely */

		 }





		.ccl-res-filter-checkbox:checked + .ccl-res-filter-checkbox-custom {

			background: var(--ccl-res-rhub-primary);

			border-color: var(--ccl-res-rhub-primary);

		}



		.ccl-res-filter-checkbox:checked + .ccl-res-filter-checkbox-custom::after {

			content: '✓';

			position: absolute;

			top: 50%;

			left: 50%;

			transform: translate(-50%, -50%);

			color: #fff;

			font-size: 12px;

			font-weight: 700;

		}



		.ccl-res-filter-option-text {

			display: flex;

			align-items: center;

			gap: 10px;

			/* Inherited from label now */

		   /* font-size: 14px; */

		   /* font-weight: 500; */

		   /* color: #0b1324; */

			flex: 1;

		}



		.ccl-res-filter-option-text i {

			color: #7b8a9f;

			font-size: 14px;

			width: 16px;

			text-align: center;

		}



		.ccl-res-filter-divider {

			height: 1px;

			background: var(--ccl-res-rhub-line);

			margin: 8px 0;

		}



		/* Section Headers - Compact */

		.ccl-res-resources-section {

			margin-bottom: 40px;

		}



		.ccl-res-section-header {

			margin-bottom: 20px;

			display: flex;

			align-items: center;

			gap: 12px;

		}



		.ccl-res-section-badge {

			padding: 4px 10px;

			border-radius: 999px;

			font-size: 10px;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: .05em;

		}



		.ccl-res-section-badge.ccl-res-legal {

			background: rgba(11,92,255,.1);

			color: var(--ccl-res-rhub-primary);

		}



		.ccl-res-section-badge.ccl-res-feeds {

			background: rgba(0,212,170,.1);

			color: var(--ccl-res-rhub-accent);

		}



		.ccl-res-section-badge.ccl-res-media {

			background: rgba(147,51,234,.1);

			color: var(--ccl-res-rhub-media);

		}



		.ccl-res-section-badge.ccl-res-about {

			background: rgba(245,158,11,.1);

			color: var(--ccl-res-rhub-about);

		}



		.ccl-res-section-title {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-size: 22px;

			font-weight: 700;

			color: #0b1324;

		}



		/* Resource Grid - Compact */

		.ccl-res-resources-grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));

			gap: 16px;

		}



		/* Resource Cards - Compact */

		.ccl-res-resource-card {

			background: #fff;

			border: 1px solid var(--ccl-res-rhub-line);

			border-radius: var(--ccl-res-rhub-radius);

			box-shadow: var(--ccl-res-rhub-shadow);

			display: flex;

			flex-direction: column;

			transition: transform .15s, box-shadow .15s, border-color .15s;

			position: relative;

			overflow: hidden;

			text-decoration: none; /* In case card itself is a link */

		}



		.ccl-res-resource-card:hover {

			transform: translateY(-3px);

			box-shadow: var(--ccl-res-rhub-shadow-lg);

			border-color: rgba(11,92,255,.2);

		}



		.ccl-res-resource-card::before {

			content: "";

			position: absolute;

			inset: 0 0 auto 0;

			height: 3px;

			background: linear-gradient(90deg, var(--ccl-res-rhub-primary), var(--ccl-res-rhub-primary-dark));

			pointer-events: none;

		}



		.ccl-res-resource-card.ccl-res-feeds::before {

			background: linear-gradient(90deg, var(--ccl-res-rhub-accent), #00b894);

		}



		.ccl-res-resource-card.ccl-res-media::before {

			background: linear-gradient(90deg, var(--ccl-res-rhub-media), #7c3aed);

		}



		.ccl-res-resource-card.ccl-res-about::before {

			background: linear-gradient(90deg, var(--ccl-res-rhub-about), #e67e22);

		}



		.ccl-res-resource-card-header {

			padding: 14px 16px 0;

		}



		.ccl-res-resource-type-badge {

			padding: 4px 10px;

			border-radius: 999px;

			font-size: 10px;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: .04em;

			border: 1px solid currentColor;

			display: inline-block; /* Ensure it takes up space */

		}



		.ccl-res-resource-type-badge.ccl-res-legal {

			color: var(--ccl-res-rhub-primary);

		}



		.ccl-res-resource-type-badge.ccl-res-feeds {

			color: var(--ccl-res-rhub-accent);

		}



		.ccl-res-resource-type-badge.ccl-res-media {

			color: var(--ccl-res-rhub-media);

		}



		.ccl-res-resource-type-badge.ccl-res-about {

			color: var(--ccl-res-rhub-about);

		}



		.ccl-res-resource-card-body {

			padding: 12px 16px;

			flex-grow: 1;

		}



		.ccl-res-resource-icon {

			width: 40px;

			height: 40px;

			border-radius: 10px;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 10px;

			font-size: 16px;

			background: rgba(11,92,255,.08);

			color: var(--ccl-res-rhub-primary);

		}



		.ccl-res-resource-icon.ccl-res-feeds {

			background: rgba(0,212,170,.1);

			color: var(--ccl-res-rhub-accent);

		}



		.ccl-res-resource-icon.ccl-res-media {

			background: rgba(147,51,234,.1);

			color: var(--ccl-res-rhub-media);

		}



		.ccl-res-resource-icon.ccl-res-about {

			background: rgba(245,158,11,.1);

			color: var(--ccl-res-rhub-about);

		}



		.ccl-res-resource-title {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-size: 16px;

			font-weight: 700;

			color: #0b1324;

			margin: 0 0 6px;

			line-height: 1.3;

		}



		.ccl-res-resource-description {

			font-size: 13px;

			color: #6b7a90;

			margin: 0;

			line-height: 1.4;

			font-weight: 500;

		}



		.ccl-res-resource-card-footer {

			padding: 0 16px 14px;

			display: flex;

			justify-content: space-between;

			align-items: center;

			border-top: 1px solid var(--ccl-res-rhub-line);

			padding-top: 12px;

		}



		.ccl-res-resource-link {

			font-size: 13px;

			font-weight: 700;

			color: var(--ccl-res-rhub-primary);

			text-decoration: none;

			display: flex;

			align-items: center;

			gap: 6px;

			transition: gap .15s;

		}



		.ccl-res-resource-link:hover {

			gap: 10px;

		}



		.ccl-res-resource-link.ccl-res-feeds {

			color: var(--ccl-res-rhub-accent);

		}



		.ccl-res-resource-link.ccl-res-media {

			color: var(--ccl-res-rhub-media);

		}



		.ccl-res-resource-link.ccl-res-about {

			color: var(--ccl-res-rhub-about);

		}



		/* Featured Card - Compact */

		.ccl-res-featured-card {

			grid-column: 1 / -1;

			background: linear-gradient(135deg, var(--ccl-res-rhub-primary), var(--ccl-res-rhub-primary-dark));

			color: #fff;

			padding: 24px 28px;

			border-radius: var(--ccl-res-rhub-radius);

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 24px;

			border: 1px solid rgba(255,255,255,.25);

			box-shadow: var(--ccl-res-rhub-shadow-lg);

		}



		.ccl-res-featured-content h3 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-size: 20px;

			font-weight: 700;

			margin-bottom: 6px;

			color: #fff; /* Ensure heading color contrasts */

		}



		.ccl-res-featured-content p {

			font-size: 14px;

			opacity: .92;

			line-height: 1.5;

			margin-bottom: 14px;

			color: #fff; /* Ensure paragraph color contrasts */

		}



		.ccl-res-featured-btn {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 10px 20px;

			border-radius: 999px;

			background: #fff;

			color: var(--ccl-res-rhub-primary);

			font-weight: 700;

			font-size: 13px;

			text-decoration: none;

			transition: transform .15s, box-shadow .15s;

			border: none; /* Remove default button border */

			cursor: pointer; /* Add pointer cursor */

		}



		.ccl-res-featured-btn:hover {

			transform: translateY(-2px);

			box-shadow: 0 8px 16px rgba(0,0,0,.1);

		}



		/* Filter Section */

		/* Responsive */

		@media (max-width: 768px) {

			.ccl-res-resources-hero {

				padding: 40px 0;

			}



			.ccl-res-resources-hero h1 {

				font-size: 28px;

			}



			.ccl-res-resources-hero p {

				font-size: 14px;

			}



			.ccl-res-resources-controls {

				flex-direction: column;

				gap: 12px;

				margin: -20px 0 24px;

			}



			.ccl-res-resources-search-box {

				width: 100%;

			}



			.ccl-res-filter-dropdown {

				width: 100%;

			}



			.ccl-res-filter-toggle {

				width: 100%;

				min-width: auto;

				/* Reset height, as it will be stacked */

				height: auto; 

				/* Ensure consistent padding when stacked */

				padding: 12px 16px; 

			}

			

			/* Re-align search box padding to match filter when stacked */

			.ccl-res-resources-search-box {

				padding: 12px 16px;

			}



			.ccl-res-resources-search-input {

				padding: 8px 12px; /* Keep original input padding */

			}





			.ccl-res-filter-menu {

				left: 0;

				right: 0;

				min-width: auto;

			}



			.ccl-res-resources-grid {

				grid-template-columns: 1fr;

				gap: 16px;

			}



			.ccl-res-featured-card {

				flex-direction: column;

				padding: 20px;

				gap: 16px;

			}



			.ccl-res-section-title {

				font-size: 20px;

			}



			.ccl-res-section-header {

				flex-direction: column;

				align-items: flex-start;

				gap: 8px;

			}



			.ccl-res-resource-card {

				margin: 0;

			}



			.ccl-res-resource-card-header {

				padding: 12px 14px 0;

			}



			.ccl-res-resource-card-body {

				padding: 10px 14px;

			}



			.ccl-res-resource-card-footer {

				padding: 0 14px 12px;

				padding-top: 10px;

			}



			.ccl-res-cta-buttons {

				flex-direction: column;

				width: 100%;

			}



			.ccl-res-cta-primary, .ccl-res-cta-secondary {

				width: 100%;

				justify-content: center;

			}



			.ccl-res-cta-title {

				font-size: 26px;

			}



			.ccl-res-cta-subtitle {

				font-size: 15px;

			}



			.ccl-res-cta-section {

				padding: 50px 0;

			}

		}



		@media (max-width: 480px) {

			.ccl-res-resources-container {

				padding: 0 16px;

			}



			.ccl-res-resources-hero {

				padding: 30px 0;

			}



			.ccl-res-resources-hero h1 {

				font-size: 24px;

			}



			.ccl-res-resources-hero p {

				font-size: 13px;

			}



			.ccl-res-resources-search-box {

				padding: 10px 14px;

			}



			.ccl-res-resources-search-input {

				font-size: 14px;

				padding: 6px 10px;

			}



			.ccl-res-filter-toggle {

				padding: 10px 16px;

				font-size: 13px;

				gap: 8px;

			}



			.ccl-res-filter-text {

				font-size: 13px;

			}



			.ccl-res-filter-count {

				font-size: 10px;

				padding: 2px 6px;

			}



			.ccl-res-filter-option label {

				padding: 8px 10px;

			}

			 .ccl-res-filter-option label .ccl-res-filter-option-text {

				 margin-left: 24px; /* Adjust for smaller screens */

			 }

			 .ccl-res-filter-checkbox-custom {

				 left: 10px; /* Adjust for smaller screens */

			 }



			.ccl-res-filter-option-text {

				font-size: 13px;

				gap: 8px;

			}



			.ccl-res-section-title {

				font-size: 18px;

			}



			.ccl-res-section-badge {

				font-size: 9px;

				padding: 3px 8px;

			}



			.ccl-res-resource-title {

				font-size: 15px;

			}



			.ccl-res-resource-description {

				font-size: 12px;

			}



			.ccl-res-resource-icon {

				width: 36px;

				height: 36px;

				font-size: 14px;

			}



			.ccl-res-resource-type-badge {

				font-size: 9px;

				padding: 3px 8px;

			}



			.ccl-res-resource-link {

				font-size: 12px;

			}



			.ccl-res-cta-title {

				font-size: 22px;

			}



			.ccl-res-cta-subtitle {

				font-size: 14px;

			}



			.ccl-res-cta-section {

				padding: 40px 0;

			}



			.ccl-res-cta-primary, .ccl-res-cta-secondary {

				font-size: 14px;

				padding: 12px 24px;

			}

		}



		/* Featured Resources Section (Already Prefixed) - No changes needed unless conflicts arise */

		/* Quick Actions Section (Already Prefixed) - No changes needed unless conflicts arise */



		/* CTA Section */

		.ccl-res-cta-section {

			background: linear-gradient(135deg, var(--ccl-res-rhub-primary), var(--ccl-res-rhub-primary-dark));

			padding: 70px 0;

			text-align: center;

		}



		.ccl-res-cta-content {

			max-width: 800px;

			margin: 0 auto;

			padding: 0 20px; /* Add padding for smaller screens */

		}



		.ccl-res-cta-title {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-size: 38px;

			font-weight: 800;

			color: #fff;

			margin-bottom: 16px;

			line-height: 1.2;

		}



		.ccl-res-cta-subtitle {

			font-size: 17px;

			color: rgba(255,255,255,.92);

			margin-bottom: 32px;

			line-height: 1.6;

		}



		.ccl-res-cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			align-items: center;

			flex-wrap: wrap; /* Allow buttons to wrap on small screens */

		}



		.ccl-res-cta-primary, .ccl-res-cta-secondary {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 14px 28px;

			border-radius: 999px;

			text-decoration: none;

			font-size: 15px;

			font-weight: 700;

			transition: all .2s;

			border: none; /* Remove default border */

			cursor: pointer; /* Add pointer cursor */

		}



		.ccl-res-cta-primary {

			background: #fff;

			color: var(--ccl-res-rhub-primary);

		}



		.ccl-res-cta-primary:hover {

			transform: translateY(-2px);

			box-shadow: 0 12px 24px rgba(0,0,0,.15);

		}



		.ccl-res-cta-secondary {

			background: transparent;

			color: #fff;

			border: 2px solid rgba(255,255,255,.4);

		}



		.ccl-res-cta-secondary:hover {

			background: rgba(255,255,255,.1);

			border-color: #fff;

		}



		/* Adjustments for button wrapping on mobile */

		 @media (max-width: 768px) {

			  .ccl-res-cta-buttons {

				  flex-direction: column; /* Stack buttons */

			  }

			  .ccl-res-cta-primary, .ccl-res-cta-secondary {

				  width: 100%; /* Make buttons full width */

				  max-width: 300px; /* Optional: constrain max width */

				  justify-content: center; /* Center text/icon */

			  }

		 }

		 @media (max-width: 480px) {

			 .ccl-res-cta-title {

				 font-size: 28px;

			 }

			 .ccl-res-cta-subtitle {

				 font-size: 15px;

			 }

			  .ccl-res-cta-primary, .ccl-res-cta-secondary {

				  padding: 12px 24px;

				  font-size: 14px;

			  }

		 }

		.ccl-ccpage-wrapper {

			--navy: #0A1128;

			--navy-light: #1B2845;

			--blue: #0b5cff;

			--blue-light: #3d7fff;

			--gold: #FFB800;

			--gold-dark: #E6A700;

			--white: #ffffff;

			--gray-50: #f9fafb;

			--gray-100: #f3f4f6;

			--gray-200: #e5e7eb;

			--gray-300: #d1d5db;

			--gray-500: #6b7280;

			--gray-600: #4b5563;

			--gray-700: #374151;

			--gray-900: #111827;

			--green: #10b981;

			--red: #ef4444;



			font-family: 'Inter', sans-serif;

			color: var(--gray-900);

			background: var(--white);

			line-height: 1.6;

		}



		.ccl-ccpage-wrapper *,

		.ccl-ccpage-wrapper *::before,

		.ccl-ccpage-wrapper *::after {

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}



		.ccl-ccpage-container {

			width: 100%;

			max-width: 1400px;

			margin: 0 auto;

			padding: 0 20px;

		}



		/* ========================================

		   HERO - CENTERED LAYOUT

		   ======================================== */

		.ccl-ccpage-hero {

			background: linear-gradient(135deg, var(--navy) 0%, #0d1a3d 50%, var(--navy-light) 100%);

			padding: 60px 0 80px;

			position: relative;

			overflow: hidden;

			text-align: center;

		}



		.ccl-ccpage-hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -10%;

			width: 700px;

			height: 700px;

			background: radial-gradient(circle, rgba(255, 184, 0, 0.2) 0%, transparent 70%);

			animation: ccl-ccpage-float 20s infinite ease-in-out;

		}



		.ccl-ccpage-hero::after {

			content: '';

			position: absolute;

			bottom: -30%;

			left: -5%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.15) 0%, transparent 70%);

			animation: ccl-ccpage-float 25s infinite ease-in-out reverse;

		}



		@keyframes ccl-ccpage-float {

			0%, 100% { transform: translate(0, 0) rotate(0deg); }

			33% { transform: translate(30px, -30px) rotate(5deg); }

			66% { transform: translate(-20px, 20px) rotate(-5deg); }

		}



		.ccl-ccpage-hero-content-center {

			position: relative;

			z-index: 2;

			max-width: 900px;

			margin: 0 auto;

		}



		.ccl-ccpage-hero-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 6vw, 4.5rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1.1;

			margin-bottom: 24px;

			letter-spacing: -0.02em;

		}



		.ccl-ccpage-hero-highlight {

			color: var(--gold);

			position: relative;

			display: inline-block;

		}



		.ccl-ccpage-hero-highlight::after {

			content: '';

			position: absolute;

			bottom: -5px;

			left: 0;

			width: 100%;

			height: 8px;

			background: linear-gradient(90deg, var(--gold) 0%, transparent 100%);

			opacity: 0.3;

		}



		.ccl-ccpage-hero-description {

			font-size: 20px;

			color: rgba(255, 255, 255, 0.9);

			line-height: 1.8;

			margin-bottom: 48px;

			max-width: 700px;

			margin-left: auto;

			margin-right: auto;

		}



		.ccl-ccpage-hero-stats {

			display: flex;

			gap: 48px;

			margin-bottom: 48px;

			justify-content: center;

			flex-wrap: wrap;

		}



		.ccl-ccpage-stat {

			text-align: center;

		}



		.ccl-ccpage-stat-number {

			font-family: 'Inter Tight', sans-serif;

			font-size: 3.2rem;

			font-weight: 900;

			background: linear-gradient(135deg, var(--gold) 0%, #ffd700 100%);

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

			line-height: 1;

			margin-bottom: 8px;

		}



		.ccl-ccpage-stat-label {

			color: rgba(255, 255, 255, 0.75);

			font-size: 15px;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 0.5px;

		}



		.ccl-ccpage-hero-cta-buttons {

			display: flex;

			gap: 16px;

			flex-wrap: wrap;

			justify-content: center;

		}



		.ccl-ccpage-btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 32px;

			border-radius: 100px;

			font-weight: 700;

			font-size: 15px;

			transition: all 0.3s;

			border: none;

			cursor: pointer;

			text-decoration: none;

		}



		.ccl-ccpage-btn-large {

			padding: 20px 40px;

			font-size: 17px;

		}



		.ccl-ccpage-btn-gold {

			background: linear-gradient(135deg, var(--gold) 0%, #ffc933 100%);

			color: var(--navy);

			box-shadow: 0 10px 30px rgba(255, 184, 0, 0.4);

		}



		.ccl-ccpage-btn-gold:hover {

			background: linear-gradient(135deg, var(--gold-dark) 0%, var(--gold) 100%);

			transform: translateY(-3px);

			box-shadow: 0 15px 40px rgba(255, 184, 0, 0.5);

		}



		.ccl-ccpage-btn-outline {

			background: rgba(255, 255, 255, 0.05);

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.3);

			backdrop-filter: blur(10px);

		}



		.ccl-ccpage-btn-outline:hover {

			background: rgba(255, 255, 255, 0.15);

			border-color: var(--white);

			transform: translateY(-2px);

		}



		/* ========================================

		   CONTACT FORM SECTION

		   ======================================== */

		.ccl-ccpage-contact-form-section {

			padding: 100px 0;

			background: linear-gradient(180deg, var(--gray-50) 0%, var(--white) 50%);

		}



		.ccl-ccpage-form-intro-center {

			text-align: center;

			max-width: 700px;

			margin: 0 auto 60px;

		}



		.ccl-ccpage-form-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 10px 24px;

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.1) 0%, rgba(255, 184, 0, 0.1) 100%);

			border-radius: 100px;

			font-size: 13px;

			font-weight: 700;

			color: var(--blue);

			margin-bottom: 24px;

			border: 1px solid rgba(11, 92, 255, 0.2);

		}



		.ccl-ccpage-form-intro-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--navy);

			margin-bottom: 16px;

			letter-spacing: -0.02em;

		}



		.ccl-ccpage-form-intro-desc {

			font-size: 18px;

			color: var(--gray-600);

			line-height: 1.7;

		}



		.ccl-ccpage-form-layout-with-sidebar {

			display: grid;

			grid-template-columns: 380px 1fr;

			gap: 40px;

			max-width: 1400px;

			margin: 0 auto;

		}



		/* Sidebar Styling */

		.ccl-ccpage-form-sidebar {

			background: linear-gradient(145deg, var(--navy) 0%, var(--navy-light) 100%);

			padding: 40px;

			border-radius: 24px;

			color: var(--white);

			height: fit-content;

			position: sticky;

			top: 40px;

			box-shadow: 0 20px 60px rgba(10, 17, 40, 0.3);

			order: 1;

		}



		.ccl-ccpage-form-wrapper-center {

			background: var(--white);

			border-radius: 32px;

			padding: 60px;

			box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);

			border: 1px solid var(--gray-200);

			position: relative;

			overflow: hidden;

			order: 2;

		}



		.ccl-ccpage-sidebar-header {

			margin-bottom: 32px;

			padding-bottom: 24px;

			border-bottom: 2px solid rgba(255, 255, 255, 0.1);

		}



		.ccl-ccpage-sidebar-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 24px;

			font-weight: 900;

			color: var(--white);

			margin-bottom: 12px;

			line-height: 1.3;

		}



		.ccl-ccpage-sidebar-phone {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			font-size: 22px;

			font-weight: 800;

			color: var(--gold);

			text-decoration: none;

			margin-bottom: 20px;

		}



		.ccl-ccpage-sidebar-phone:hover {

			color: var(--white);

		}



		.ccl-ccpage-sidebar-description {

			font-size: 14px;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.85);

			margin-bottom: 24px;

		}



		.ccl-ccpage-sidebar-rating {

			display: flex;

			align-items: center;

			gap: 8px;

			padding: 12px 16px;

			background: rgba(255, 184, 0, 0.15);

			border-radius: 12px;

			border: 1px solid rgba(255, 184, 0, 0.3);

		}



		.ccl-ccpage-sidebar-rating i {

			color: var(--gold);

			font-size: 16px;

		}



		.ccl-ccpage-sidebar-rating span {

			font-size: 13px;

			font-weight: 600;

			color: rgba(255, 255, 255, 0.9);

		}



		.ccl-ccpage-sidebar-hours {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			padding: 16px;

			background: rgba(255, 255, 255, 0.05);

			border-radius: 12px;

			border: 1px solid rgba(255, 255, 255, 0.1);

			margin-top: 16px;

		}



		.ccl-ccpage-sidebar-hours-icon {

			width: 40px;

			height: 40px;

			min-width: 40px;

			background: rgba(255, 184, 0, 0.2);

			border-radius: 10px;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--gold);

			font-size: 18px;

		}



		.ccl-ccpage-sidebar-hours-content {

			flex: 1;

		}



		.ccl-ccpage-sidebar-hours-label {

			font-size: 11px;

			font-weight: 700;

			color: rgba(255, 255, 255, 0.6);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 4px;

		}



		.ccl-ccpage-sidebar-hours-time {

			font-size: 14px;

			font-weight: 700;

			color: var(--white);

			margin-bottom: 4px;

		}



		.ccl-ccpage-sidebar-hours-note {

			font-size: 12px;

			color: rgba(255, 255, 255, 0.7);

		}



		.ccl-ccpage-sidebar-offices {

			margin-top: 32px;

		}



		.ccl-ccpage-sidebar-office {

			margin-bottom: 28px;

			padding-bottom: 28px;

			border-bottom: 1px solid rgba(255, 255, 255, 0.1);

		}



		.ccl-ccpage-sidebar-office:last-child {

			margin-bottom: 0;

			padding-bottom: 0;

			border-bottom: none;

		}



		.ccl-ccpage-sidebar-office-name {

			font-weight: 700;

			font-size: 15px;

			color: var(--white);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 8px;

		}



		.ccl-ccpage-sidebar-office-name i {

			color: var(--gold);

			font-size: 14px;

		}



		.ccl-ccpage-sidebar-office-address {

			font-size: 13px;

			line-height: 1.6;

			color: rgba(255, 255, 255, 0.7);

			margin-bottom: 8px;

		}



		.ccl-ccpage-sidebar-office-phone {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			font-size: 14px;

			font-weight: 600;

			color: var(--gold);

			text-decoration: none;

			transition: all 0.3s;

		}



		.ccl-ccpage-sidebar-office-phone:hover {

			color: var(--white);

			gap: 10px;

		}



		.ccl-ccpage-sidebar-office-phone i {

			font-size: 12px;

		}



		.ccl-ccpage-form-wrapper-center {

			background: var(--white);

			border-radius: 32px;

			padding: 60px;

			box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);

			border: 1px solid var(--gray-200);

			position: relative;

			overflow: hidden;

		}



		.ccl-ccpage-form-wrapper-center::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--gold) 0%, var(--blue) 50%, var(--gold) 100%);

			background-size: 200% 100%;

			animation: ccl-ccpage-shimmer 3s linear infinite;

		}



		@keyframes ccl-ccpage-shimmer {

			0% { background-position: 200% 0; }

			100% { background-position: -200% 0; }

		}



		.ccl-ccpage-form-section {

			margin-bottom: 32px;

		}



		.ccl-ccpage-form-section:last-of-type {

			margin-bottom: 0;

		}



		.ccl-ccpage-form-section-label {

			display: flex;

			align-items: center;

			gap: 10px;

			font-family: 'Inter Tight', sans-serif;

			font-weight: 800;

			font-size: 18px;

			color: var(--navy);

			margin-bottom: 20px;

		}



		.ccl-ccpage-form-section-label i {

			color: var(--blue);

			font-size: 20px;

		}



		.ccl-ccpage-form-section-label.ccl-ccpage-required::after {

			content: " *";

			color: var(--red);

			font-size: 20px;

		}



		.ccl-ccpage-form-row-2 {

			display: grid;

			grid-template-columns: 1fr 1fr;

			gap: 20px;

		}



		.ccl-ccpage-form-group {

			margin-bottom: 0;

		}



		.ccl-ccpage-form-label {

			display: block;

			font-weight: 600;

			color: var(--gray-700);

			margin-bottom: 8px;

			font-size: 14px;

		}



		.ccl-ccpage-form-label.ccl-ccpage-required::after {

			content: " *";

			color: var(--red);

		}



		.ccl-ccpage-input-wrapper {

			position: relative;

		}



		.ccl-ccpage-input-icon {

			position: absolute;

			left: 18px;

			top: 50%;

			transform: translateY(-50%);

			color: var(--gray-400);

			font-size: 16px;

			transition: all 0.3s;

			pointer-events: none;

		}



		.ccl-ccpage-form-input,

		.ccl-ccpage-form-textarea,

		.ccl-ccpage-form-select {

			width: 100%;

			padding: 16px 20px 16px 50px;

			border: 2px solid var(--gray-200);

			border-radius: 14px;

			font-size: 15px;

			font-family: inherit;

			transition: all 0.3s;

			background: var(--white);

			font-weight: 500;

			appearance: none;

		}



		.ccl-ccpage-form-select {

			padding-left: 20px;

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");

			background-repeat: no-repeat;

			background-position: right 20px center;

			background-size: 16px;

		}



		.ccl-ccpage-form-input:focus,

		.ccl-ccpage-form-textarea:focus,

		.ccl-ccpage-form-select:focus {

			outline: none;

			border-color: var(--blue);

			background: rgba(11, 92, 255, 0.02);

			box-shadow: 0 0 0 4px rgba(11, 92, 255, 0.08);

		}



		.ccl-ccpage-form-input:focus ~ .ccl-ccpage-input-icon {

			color: var(--blue);

		}



		.ccl-ccpage-form-textarea {

			resize: vertical;

			min-height: 150px;

			padding-left: 20px;

			line-height: 1.6;

		}



		/* --- Checkbox & Radio Styling (FIXED) --- */

		.ccl-ccpage-checkbox-grid {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 16px;

		}



		.ccl-ccpage-checkbox-grid-small {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

			gap: 12px;

		}

		

		.ccl-ccpage-checkbox-item {

			position: relative;

		}



		.ccl-ccpage-checkbox-item input[type="checkbox"],

		.ccl-ccpage-checkbox-item input[type="radio"] {

			position: absolute;

			opacity: 0;

			cursor: pointer;

		}



		.ccl-ccpage-checkbox-label,

		.ccl-ccpage-checkbox-label-small {

			display: flex;

			align-items: center;

			cursor: pointer;

			transition: all 0.3s;

			font-weight: 600;

			color: var(--gray-700);

			position: relative;

		}



		.ccl-ccpage-checkbox-label {

			gap: 12px;

			padding: 18px 50px 18px 20px;

			background: var(--white);

			border: 2px solid var(--gray-200);

			border-radius: 14px;

			font-size: 15px;

			min-height: 64px;

			line-height: 1.4;

		}



		.ccl-ccpage-checkbox-label-small {

			gap: 8px;

			padding: 12px 16px;

			padding-right: 45px; /* Ensure space for radio/check */

			background: var(--white);

			border: 2px solid var(--gray-200);

			border-radius: 12px;

			font-size: 14px;

			min-height: 52px; /* Set min-height for alignment */

		}



		.ccl-ccpage-checkbox-label i {

			font-size: 20px;

			color: var(--gray-400);

			transition: all 0.3s;

			flex-shrink: 0;

			margin-top: 2px;

			align-self: flex-start;

		}



		/* Base pseudo-element for both radio and checkbox */

		.ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-label-small::before {

			content: '';

			position: absolute;

			right: 18px;

			top: 50%;

			transform: translateY(-50%);

			border: 2px solid var(--gray-300);

			background: var(--white);

			transition: all 0.3s;

		}

		.ccl-ccpage-checkbox-label::before {

			width: 22px;

			height: 22px;

		}

		.ccl-ccpage-checkbox-label-small::before {

			width: 20px;

			height: 20px;

		}



		/* Checkbox specific shape */

		.ccl-ccpage-checkbox-item input[type="checkbox"] + .ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-item input[type="checkbox"] + .ccl-ccpage-checkbox-label-small::before {

			border-radius: 6px;

		}



		/* Radio specific shape */

		.ccl-ccpage-checkbox-item input[type="radio"] + .ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-item input[type="radio"] + .ccl-ccpage-checkbox-label-small::before {

			border-radius: 50%;

		}



		/* Hover state */

		.ccl-ccpage-checkbox-label:hover,

		.ccl-ccpage-checkbox-label-small:hover {

			border-color: var(--blue-light);

			background: rgba(11, 92, 255, 0.03);

		}



		/* Base checked state (label) */

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label,

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label-small,

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label,

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label-small {

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.08) 0%, rgba(11, 92, 255, 0.12) 100%);

			border-color: var(--blue);

			color: var(--blue);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.15);

		}

		

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label i,

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label i {

			color: var(--blue);

		}



		/* Base checked state (pseudo-element) */

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label-small::before,

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label-small::before {

			background-color: var(--blue);

			border-color: var(--blue);

			background-position: center;

			background-repeat: no-repeat;

		}



		/* Checked CHECKBOX icon */

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-item input[type="checkbox"]:checked + .ccl-ccpage-checkbox-label-small::before {

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");

			background-size: 14px;

		}

		

		/* Checked RADIO icon */

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label::before,

		.ccl-ccpage-checkbox-item input[type="radio"]:checked + .ccl-ccpage-checkbox-label-small::before {

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Ccircle cx='12' cy='12' r='8'%3E%3C/circle%3E%3C/svg%3E");

			background-size: 10px;

		}

		/* --- End Checkbox & Radio Styling --- */





		/* Conditional Sections */

		.ccl-ccpage-conditional-group {

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.03) 0%, rgba(255, 184, 0, 0.03) 100%);

			padding: 32px;

			border-radius: 20px;

			border: 2px dashed var(--gray-300);

			animation: ccl-ccpage-slideDown 0.3s ease-out;

		}



		@keyframes ccl-ccpage-slideDown {

			from {

				opacity: 0;

				transform: translateY(-10px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}



		.ccl-ccpage-conditional-section {

			margin-bottom: 24px;

			animation: ccl-ccpage-slideDown 0.3s ease-out;

		}



		.ccl-ccpage-conditional-section:last-child {

			margin-bottom: 0;

		}



		.ccl-ccpage-conditional-header {

			font-weight: 700;

			font-size: 15px;

			color: var(--navy);

			margin-bottom: 16px;

			padding-bottom: 10px;

			border-bottom: 2px solid var(--blue);

			display: flex;

			align-items: center;

			gap: 8px;

		}



		.ccl-ccpage-conditional-header::before {

			content: '→';

			color: var(--blue);

			font-size: 18px;

		}



		/* Submit Button */

		.ccl-ccpage-btn-submit {

			width: 100%;

			padding: 20px;

			background: linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 100%);

			color: var(--white);

			border: none;

			border-radius: 16px;

			font-size: 18px;

			font-weight: 800;

			cursor: pointer;

			transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			margin-top: 32px;

			text-transform: uppercase;

			letter-spacing: 1px;

			box-shadow: 0 12px 35px rgba(10, 17, 40, 0.25);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-ccpage-btn-submit:disabled {

			background: var(--gray-500);

			cursor: not-allowed;

			transform: none;

			box-shadow: none;

		}



		.ccl-ccpage-btn-submit::before {

			content: '';

			position: absolute;

			top: 0;

			left: -100%;

			width: 100%;

			height: 100%;

			background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);

			transition: left 0.5s;

		}



		.ccl-ccpage-btn-submit:not(:disabled):hover::before {

			left: 100%;

		}



		.ccl-ccpage-btn-submit:not(:disabled):hover {

			transform: translateY(-4px) scale(1.02);

			box-shadow: 0 20px 50px rgba(10, 17, 40, 0.35);

		}



		.ccl-ccpage-btn-submit:not(:disabled):active {

			transform: translateY(-2px) scale(0.98);

		}



		.ccl-ccpage-form-note {

			margin-top: 24px;

			padding: 16px 20px;

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.05) 0%, rgba(255, 184, 0, 0.05) 100%);

			border-left: 4px solid var(--blue);

			border-radius: 12px;

			font-size: 13px;

			color: var(--gray-700);

			display: flex;

			align-items: flex-start;

			gap: 12px;

			line-height: 1.6;

		}



		.ccl-ccpage-form-note i {

			color: var(--blue);

			margin-top: 2px;

			flex-shrink: 0;

		}



		.ccl-ccpage-form-message {

			margin-top: 24px;

			padding: 20px;

			border-radius: 16px;

			font-size: 15px;

			font-weight: 600;

			line-height: 1.6;

			display: none;

		}

		.ccl-ccpage-form-message.ccl-ccpage-success {

			background: rgba(16, 185, 129, 0.1);

			border: 2px solid var(--green);

			color: #065f46;

			display: block;

		}

		.ccl-ccpage-form-message.ccl-ccpage-error {

			background: rgba(239, 68, 68, 0.1);

			border: 2px solid var(--red);

			color: #b91c1c;

			display: block;

		}





		/* Custom Multi-Select Dropdown */

		.ccl-ccpage-contact-method-dropdown {

			position: relative;

			width: 100%;

		}



		.ccl-ccpage-dropdown-header {

			background: var(--white);

			border: 2px solid var(--gray-200);

			border-radius: 12px;

			padding: 14px 48px 14px 20px;

			cursor: pointer;

			transition: all 0.3s;

			position: relative;

			min-height: 52px;

			display: flex;

			align-items: center;

		}



		.ccl-ccpage-dropdown-header:hover {

			border-color: var(--blue);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.1);

		}



		.ccl-ccpage-dropdown-header.ccl-ccpage-active {

			border-color: var(--blue);

			border-bottom-left-radius: 0;

			border-bottom-right-radius: 0;

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.15);

		}



		.ccl-ccpage-dropdown-placeholder {

			color: var(--gray-500);

			flex: 1;

		}



		.ccl-ccpage-dropdown-header.ccl-ccpage-has-selection .ccl-ccpage-dropdown-placeholder {

			color: var(--navy);

		}



		.ccl-ccpage-dropdown-icon {

			position: absolute;

			right: 20px;

			color: var(--gray-500);

			transition: transform 0.3s;

		}



		.ccl-ccpage-dropdown-header.ccl-ccpage-active .ccl-ccpage-dropdown-icon {

			transform: rotate(180deg);

		}



		.ccl-ccpage-dropdown-list {

			position: absolute;

			top: 100%;

			left: 0;

			right: 0;

			background: var(--white);

			border: 2px solid var(--blue);

			border-top: none;

			border-bottom-left-radius: 12px;

			border-bottom-right-radius: 12px;

			max-height: 0;

			overflow: hidden;

			transition: all 0.3s;

			z-index: 100;

			box-shadow: 0 10px 30px rgba(11, 92, 255, 0.15);

		}



		.ccl-ccpage-dropdown-list.ccl-ccpage-active {

			max-height: 300px;

			overflow-y: auto;

		}



		.ccl-ccpage-dropdown-item {

			padding: 12px 20px;

			display: flex;

			align-items: center;

			gap: 12px;

			cursor: pointer;

			transition: background 0.2s;

		}



		.ccl-ccpage-dropdown-item:hover {

			background: var(--gray-50);

		}



		.ccl-ccpage-dropdown-item input[type="checkbox"] {

			width: 20px;

			height: 20px;

			cursor: pointer;

			accent-color: var(--blue);

		}



		.ccl-ccpage-dropdown-item label {

			flex: 1;

			cursor: pointer;

			margin: 0;

			font-size: 15px;

			color: var(--gray-700);

		}

		/* ========================================

		   WHY CHOOSE US SECTION - MODERN REDESIGN

		   ======================================== */

		.ccl-ccpage-why-choose-section {

			padding: 100px 0;

			background: linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 50%, var(--navy) 100%);

			position: relative;

			overflow: hidden;

		}



		.ccl-ccpage-why-choose-section::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(255, 184, 0, 0.1) 0%, transparent 70%);

			animation: ccl-ccpage-float 20s infinite ease-in-out;

		}



		.ccl-ccpage-why-choose-section::after {

			content: '';

			position: absolute;

			bottom: -40%;

			left: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			animation: ccl-ccpage-float 25s infinite ease-in-out reverse;

		}



		.ccl-ccpage-section-header {

			text-align: center;

			margin-bottom: 64px;

			position: relative;

			z-index: 2;

		}



		.ccl-ccpage-section-header-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 4vw, 3rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 16px;

		}



		.ccl-ccpage-section-header-desc {

			font-size: 18px;

			color: rgba(255, 255, 255, 0.8);

			max-width: 600px;

			margin: 0 auto;

		}



		.ccl-ccpage-benefits-grid {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 24px;

			max-width: 1200px;

			margin: 0 auto;

			position: relative;

			z-index: 2;

		}



		.ccl-ccpage-benefit-card {

			background: rgba(255, 255, 255, 0.05);

			backdrop-filter: blur(10px);

			padding: 40px 32px;

			border-radius: 20px;

			transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			border: 2px solid rgba(255, 255, 255, 0.1);

			display: flex;

			align-items: flex-start;

			gap: 24px;

		}



		.ccl-ccpage-benefit-card:hover {

			transform: translateY(-8px);

			background: rgba(255, 255, 255, 0.08);

			border-color: var(--gold);

			box-shadow: 0 20px 60px rgba(255, 184, 0, 0.2);

		}



		.ccl-ccpage-benefit-icon {

			width: 70px;

			height: 70px;

			min-width: 70px;

			background: linear-gradient(135deg, var(--gold) 0%, #ffd700 100%);

			border-radius: 16px;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--navy);

			font-size: 32px;

			box-shadow: 0 10px 30px rgba(255, 184, 0, 0.3);

			transition: all 0.3s;

		}



		.ccl-ccpage-benefit-card:hover .ccl-ccpage-benefit-icon {

			transform: scale(1.1) rotate(-5deg);

			box-shadow: 0 15px 40px rgba(255, 184, 0, 0.5);

		}



		.ccl-ccpage-benefit-content {

			flex: 1;

		}



		.ccl-ccpage-benefit-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 20px;

			font-weight: 800;

			color: var(--white);

			margin-bottom: 8px;

			line-height: 1.3;

		}



		.ccl-ccpage-benefit-desc {

			color: rgba(255, 255, 255, 0.75);

			line-height: 1.7;

			font-size: 15px;

			margin: 0;

		}



		/* ========================================

		   LOCATIONS SECTION - INTERACTIVE MAP FINDER

		   ======================================== */

		.ccl-ccpage-locations-section {

			padding: 100px 0;

			background: linear-gradient(180deg, var(--white) 0%, var(--gray-50) 100%);

		}



		.ccl-ccpage-locations-container {

			max-width: 1400px;

			margin: 0 auto;

			padding: 0 20px;

		}



		.ccl-ccpage-locations-header {

			text-align: center;

			margin-bottom: 60px;

		}



		.ccl-ccpage-locations-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 4vw, 3rem);

			font-weight: 900;

			margin-bottom: 16px;

			color: var(--navy);

		}



		.ccl-ccpage-locations-desc {

			color: var(--gray-600);

			font-size: 18px;

		}



		.ccl-ccpage-location-finder-wrapper {

			display: grid;

			grid-template-columns: 1fr 1.2fr;

			gap: 40px;

			margin-bottom: 60px;

		}



		/* Map Visual */

		.ccl-ccpage-location-map {

			background: linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 100%);

			border-radius: 24px;

			padding: 40px;

			position: relative;

			overflow: hidden;

			min-height: 500px;

			display: flex;

			flex-direction: column;

			justify-content: center;

			align-items: center;

		}



		.ccl-ccpage-location-map::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(255, 184, 0, 0.15) 0%, transparent 70%);

		}



		.ccl-ccpage-map-icon {

			font-size: 120px;

			color: rgba(255, 184, 0, 0.3);

			margin-bottom: 24px;

			position: relative;

			z-index: 2;

			animation: ccl-ccpage-pulse 2s ease-in-out infinite;

		}



		@keyframes ccl-ccpage-pulse {

			0%, 100% { transform: scale(1); opacity: 0.3; }

			50% { transform: scale(1.05); opacity: 0.5; }

		}



		.ccl-ccpage-map-result {

			text-align: center;

			position: relative;

			z-index: 2;

			color: var(--white);

			display: none;

		}



		.ccl-ccpage-map-result.ccl-ccpage-active {

			display: block;

			animation: ccl-ccpage-fadeIn 0.4s ease-out;

		}



		@keyframes ccl-ccpage-fadeIn {

			from { opacity: 0; transform: translateY(10px); }

			to { opacity: 1; transform: translateY(0); }

		}



		.ccl-ccpage-map-result-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 32px;

			font-weight: 900;

			color: var(--gold);

			margin-bottom: 16px;

		}



		.ccl-ccpage-map-result-desc {

			font-size: 18px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			line-height: 1.5;

		}



		.ccl-ccpage-map-result-desc strong {

			color: var(--gold);

			font-weight: 800;

		}



		.ccl-ccpage-map-result-phone {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			padding: 16px 32px;

			background: var(--gold);

			color: var(--navy);

			border-radius: 100px;

			font-size: 24px;

			font-weight: 800;

			text-decoration: none;

			box-shadow: 0 10px 30px rgba(255, 184, 0, 0.4);

			transition: all 0.3s;

			margin-bottom: 20px;

		}



		.ccl-ccpage-map-result-phone:hover {

			transform: translateY(-3px);

			box-shadow: 0 15px 40px rgba(255, 184, 0, 0.5);

		}



		.ccl-ccpage-nearby-office {

			margin-top: 20px;

			padding: 20px;

			background: rgba(255, 255, 255, 0.1);

			border-radius: 16px;

			border: 2px solid rgba(255, 255, 255, 0.2);

		}



		.ccl-ccpage-nearby-office-title {

			font-size: 16px;

			font-weight: 700;

			color: var(--gold);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 8px;

		}



		.ccl-ccpage-nearby-office-title i {

			font-size: 18px;

		}



		.ccl-ccpage-nearby-office-desc {

			font-size: 14px;

			color: rgba(255, 255, 255, 0.8);

			margin-bottom: 12px;

			line-height: 1.6;

		}



		.ccl-ccpage-nearby-office-desc strong {

			color: var(--gold);

			font-weight: 700;

		}



		.ccl-ccpage-nearby-office-phone {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 10px 20px;

			background: rgba(255, 255, 255, 0.15);

			color: var(--white);

			border-radius: 100px;

			font-size: 14px;

			font-weight: 700;

			text-decoration: none;

			border: 1px solid rgba(255, 255, 255, 0.3);

			transition: all 0.3s;

		}



		.ccl-ccpage-nearby-office-phone:hover {

			background: var(--white);

			color: var(--navy);

		}



		/* Search Panel */

		.ccl-ccpage-location-search-panel {

			background: var(--white);

			border-radius: 24px;

			padding: 40px;

			box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);

			border: 2px solid var(--gray-100);

		}



		.ccl-ccpage-search-panel-header {

			margin-bottom: 32px;

		}



		.ccl-ccpage-search-panel-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 24px;

			font-weight: 800;

			color: var(--navy);

			margin-bottom: 12px;

		}



		.ccl-ccpage-search-panel-desc {

			color: var(--gray-600);

			font-size: 15px;

		}



		.ccl-ccpage-search-box-enhanced {

			position: relative;

			margin-bottom: 32px;

		}



		.ccl-ccpage-search-icon-enhanced {

			position: absolute;

			left: 24px;

			top: 50%;

			transform: translateY(-50%);

			color: var(--gray-400);

			font-size: 20px;

			transition: all 0.3s;

			z-index: 2;

		}



		.ccl-ccpage-search-input-enhanced.ccl-ccpage-searching ~ .ccl-ccpage-search-icon-enhanced {

			animation: ccl-ccpage-searchPulse 1s infinite;

		}



		@keyframes ccl-ccpage-searchPulse {

			0%, 100% { opacity: 1; }

			50% { opacity: 0.4; }

		}



		.ccl-ccpage-search-input-enhanced {

			width: 100%;

			padding: 20px 24px 20px 64px;

			border: 2px solid var(--gray-200);

			border-radius: 16px;

			font-size: 17px;

			font-family: inherit;

			font-weight: 500;

			transition: all 0.3s;

			background: var(--white);

		}



		.ccl-ccpage-search-input-enhanced:focus {

			outline: none;

			border-color: var(--blue);

			box-shadow: 0 0 0 4px rgba(11, 92, 255, 0.1);

		}



		.ccl-ccpage-search-input-enhanced:focus ~ .ccl-ccpage-search-icon-enhanced {

			color: var(--blue);

		}



		.ccl-ccpage-popular-searches {

			margin-bottom: 32px;

		}



		.ccl-ccpage-popular-searches-title {

			font-size: 14px;

			font-weight: 700;

			color: var(--gray-700);

			margin-bottom: 16px;

			text-transform: uppercase;

			letter-spacing: 0.5px;

		}



		.ccl-ccpage-popular-tags {

			display: flex;

			flex-wrap: wrap;

			gap: 10px;

		}



		.ccl-ccpage-popular-tag {

			padding: 10px 20px;

			background: var(--gray-100);

			color: var(--gray-700);

			border-radius: 100px;

			font-size: 14px;

			font-weight: 600;

			cursor: pointer;

			transition: all 0.3s;

			border: 2px solid transparent;

		}



		.ccl-ccpage-popular-tag:hover {

			background: var(--blue);

			color: var(--white);

			transform: translateY(-2px);

		}



		.ccl-ccpage-all-locations-list {

			max-height: 400px;

			overflow-y: auto;

			margin-top: 24px;

			padding-right: 10px;

		}



		.ccl-ccpage-all-locations-list::-webkit-scrollbar {

			width: 8px;

		}



		.ccl-ccpage-all-locations-list::-webkit-scrollbar-track {

			background: var(--gray-100);

			border-radius: 10px;

		}



		.ccl-ccpage-all-locations-list::-webkit-scrollbar-thumb {

			background: var(--blue);

			border-radius: 10px;

		}



		.ccl-ccpage-location-list-item {

			padding: 16px 20px;

			background: var(--gray-50);

			border-radius: 12px;

			margin-bottom: 12px;

			cursor: pointer;

			transition: all 0.3s;

			border: 2px solid transparent;

			display: flex;

			justify-content: space-between;

			align-items: center;

		}



		.ccl-ccpage-location-list-item:hover {

			background: rgba(11, 92, 255, 0.05);

			border-color: var(--blue);

			transform: translateX(5px);

		}



		.ccl-ccpage-location-list-item.ccl-ccpage-hidden {

			display: none;

		}



		.ccl-ccpage-location-list-name {

			font-weight: 700;

			color: var(--navy);

			font-size: 16px;

		}



		.ccl-ccpage-location-list-phone {

			display: flex;

			align-items: center;

			gap: 6px;

			color: var(--blue);

			font-weight: 600;

			font-size: 15px;

			text-decoration: none;

		}



		.ccl-ccpage-no-results-enhanced {

			text-align: center;

			padding: 60px 20px;

			color: var(--gray-500);

			display: none;

		}



		.ccl-ccpage-no-results-enhanced.ccl-ccpage-show {

			display: block;

		}



		.ccl-ccpage-no-results-enhanced i {

			font-size: 60px;

			margin-bottom: 20px;

			opacity: 0.3;

		}



		/* ========================================

		   CTA SECTION

		   ======================================== */

		.ccl-ccpage-cta-section {

			padding: 100px 0;

			background: linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 100%);

			text-align: center;

			position: relative;

			overflow: hidden;

		}



		.ccl-ccpage-cta-section::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			transform: translate(-50%, -50%);

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(255, 184, 0, 0.15) 0%, transparent 70%);

		}



		.ccl-ccpage-cta-content {

			position: relative;

			z-index: 2;

			max-width: 900px; /* Added for consistency */

			margin: 0 auto;

			padding: 0 20px;

		}



		.ccl-ccpage-cta-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 20px;

		}



		.ccl-ccpage-cta-desc {

			font-size: 20px;

			color: rgba(255, 255, 255, 0.85);

			margin-bottom: 40px;

			max-width: 700px;

			margin-left: auto;

			margin-right: auto;

		}



		.ccl-ccpage-cta-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}



		.ccl-ccpage-cta-btn-large {

			padding: 20px 48px;

			font-size: 18px;

		}



		.ccl-ccpage-cta-btn-white {

			background: var(--white);

			color: var(--navy);

			box-shadow: 0 12px 40px rgba(255, 255, 255, 0.3);

		}



		.ccl-ccpage-cta-btn-white:hover {

			transform: translateY(-4px) scale(1.05);

			box-shadow: 0 20px 60px rgba(255, 255, 255, 0.4);

		}



		/* ========================================

		   RESPONSIVE

		   ======================================== */

		@media (max-width: 1200px) {

			.ccl-ccpage-form-layout-with-sidebar {

				grid-template-columns: 1fr;

				gap: 40px;

			}



			.ccl-ccpage-form-sidebar {

				position: static;

				order: 2;

			}



			.ccl-ccpage-form-wrapper-center {

				order: 1;

			}

		}



		@media (max-width: 1024px) {

			.ccl-ccpage-benefits-grid {

				grid-template-columns: 1fr;

			}

		}



		@media (max-width: 768px) {

			.ccl-ccpage-hero {

				padding: 80px 0;

			}



			.ccl-ccpage-stat-number {

				font-size: 2.5rem;

			}



			.ccl-ccpage-form-wrapper-center {

				padding: 40px 24px;

			}



			.ccl-ccpage-form-row-2 {

				grid-template-columns: 1fr;

			}



			.ccl-ccpage-checkbox-grid {

				grid-template-columns: 1fr;

			}



			.ccl-ccpage-checkbox-grid-small {

				grid-template-columns: 1fr;

			}



			.ccl-ccpage-benefits-grid {

				grid-template-columns: 1fr;

			}



			.ccl-ccpage-contact-form-section {

				padding: 60px 0;

			}



			.ccl-ccpage-why-choose-section {

				padding: 60px 0;

			}



			.ccl-ccpage-form-sidebar {

				padding: 32px 24px;

			}



			.ccl-ccpage-location-finder-wrapper {

				grid-template-columns: 1fr;

			}



			.ccl-ccpage-location-map {

				min-height: 400px;

			}



			.ccl-ccpage-benefit-card {

				padding: 32px 24px;

			}



			.ccl-ccpage-benefit-icon {

				width: 60px;

				height: 60px;

				min-width: 60px;

				font-size: 28px;

			}

		}



		@media (max-width: 480px) {

			.ccl-ccpage-hero-description {

				font-size: 17px;

			}



			.ccl-ccpage-form-wrapper-center {

				padding: 32px 20px;

			}



			.ccl-ccpage-form-section-label {

				font-size: 16px;

			}



			.ccl-ccpage-conditional-group {

				padding: 20px;

			}



			.ccl-ccpage-form-sidebar {

				padding: 28px 20px;

			}



			.ccl-ccpage-sidebar-title {

				font-size: 20px;

			}



			.ccl-ccpage-sidebar-phone {

				font-size: 18px;

			}



			.ccl-ccpage-location-search-panel {

				padding: 28px 20px;

			}



			.ccl-ccpage-search-panel-title {

				font-size: 20px;

			}



			.ccl-ccpage-popular-tags {

				justify-content: center;

			}



			.ccl-ccpage-map-result-title {

				font-size: 24px;

			}



			.ccl-ccpage-map-result-phone {

				font-size: 20px;

				padding: 14px 28px;

			}

		}

		/* ========================================

		   BASE STYLES & RESET

		   ======================================== */

		

		.ccl-ohistory--wrapper {

			--black: #0b0b0b;

			--primary: #1d63ff;

			--cta: #0b5cff;

			--cta-dark: #0846c1;

			--soft-bd: #e5e7eb;

			--gold: #ffa826;

			--soft-bg: #f8f9fa;

			--ink: #1e293b;

			--muted: #64748b;

			--line: #e2e8f0;

			--slate-light: #64748b;

			--container-pad: 20px;

			

			/* Timeline specific */

			--timeline-line: #e2e8f0;

			--timeline-dot: #0b5cff;

			--history-gradient: linear-gradient(180deg, rgba(238, 244, 255, .95) 0%, rgba(255, 255, 255, 1) 100%);

			

			/* Base styles merged from html/body */

			margin: 0;

			padding: 0;

			font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

			color: #211b1b;

			background: #fff;

			overflow-x: hidden;

			width: 100%;

			min-width: 320px;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}



		.ccl-ohistory--wrapper * {

			box-sizing: border-box;

			min-width: 0;

			-webkit-tap-highlight-color: rgba(11, 92, 255, 0.1);

		}



		.ccl-ohistory--wrapper img, 

		.ccl-ohistory--wrapper video, 

		.ccl-ohistory--wrapper iframe {

			max-width: 100%;

			height: auto;

			display: block;

		}



		.ccl-ohistory--wrapper i, 

		.ccl-ohistory--wrapper svg {

			flex-shrink: 0;

		}



		.ccl-ohistory--wrapper a {

			color: inherit;

			text-decoration: none;

		}



		.ccl-ohistory--wrapper button,

		.ccl-ohistory--btn {

			min-height: 48px;

			min-width: 48px;

		}



		.ccl-ohistory--container {

			width: 100%;

			max-width: 1380px;

			margin: 0 auto;

			padding-inline: var(--container-pad);

		}



		/* ========================================

		   SCROLL REVEAL ANIMATION

		   ======================================== */



		.ccl-ohistory--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}



		.ccl-ohistory--scroll-reveal.revealed {

			opacity: 1;

			transform: translateY(0);

		}



		/* ========================================

		   BUTTONS

		   ======================================== */



		.ccl-ohistory--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			padding: 18px 36px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 16px;

			text-decoration: none;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			border: 2px solid transparent;

			cursor: pointer;

			position: relative;

			overflow: hidden;

		}



		.ccl-ohistory--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}



		.ccl-ohistory--btn:hover::before {

			width: 300px;

			height: 300px;

		}



		.ccl-ohistory--btn--primary {

			background: var(--cta);

			color: #fff;

			border-color: var(--cta);

			box-shadow: 0 4px 20px rgba(11, 92, 255, 0.3);

		}



		.ccl-ohistory--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-3px);

			box-shadow: 0 8px 30px rgba(11, 92, 255, 0.4);

		}



		.ccl-ohistory--btn--secondary {

			background: #fff;

			color: var(--cta);

			border-color: var(--cta);

		}



		.ccl-ohistory--btn--secondary:hover {

			background: var(--cta);

			color: #fff;

			transform: translateY(-3px);

			box-shadow: 0 8px 30px rgba(11, 92, 255, 0.3);

		}



		/* ========================================

		   HERO SECTION - ENHANCED

		   ======================================== */



		.ccl-ohistory--hero {

			background: var(--history-gradient);

			padding: 50px 0 90px;

			position: relative;

			overflow: hidden;

		}



		.ccl-ohistory--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background-image: 

				radial-gradient(circle at 20% 30%, rgba(11, 92, 255, 0.12) 0%, transparent 50%),

				radial-gradient(circle at 80% 70%, rgba(11, 92, 255, 0.08) 0%, transparent 50%),

				radial-gradient(circle at 50% 50%, rgba(11, 92, 255, 0.05) 0%, transparent 60%);

			pointer-events: none;

			animation: pulseGlow 8s ease-in-out infinite;

		}



		@keyframes pulseGlow {

			0%, 100% { opacity: 1; }

			50% { opacity: 0.7; }

		}



		/* Floating elements */

		.ccl-ohistory--hero::after {

			content: '';

			position: absolute;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

			top: -200px;

			right: -200px;

			animation: float 20s ease-in-out infinite;

		}



		@keyframes float {

			0%, 100% { transform: translate(0, 0) rotate(0deg); }

			33% { transform: translate(30px, -30px) rotate(120deg); }

			66% { transform: translate(-20px, 20px) rotate(240deg); }

		}



		.ccl-ohistory--hero__inner {

			max-width: 950px;

			margin: 0 auto;

			text-align: center;

			position: relative;

			z-index: 1;

		}



		.ccl-ohistory--hero__kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(11, 92, 255, 0.1);

			border: 1.5px solid rgba(11, 92, 255, 0.25);

			color: var(--primary);

			font-weight: 700;

			font-size: 14px;

			text-transform: uppercase;

			letter-spacing: 1px;

			padding: 10px 20px;

			border-radius: 999px;

			margin-bottom: 32px;

			animation: fadeInDown 0.8s ease;

		}



		@keyframes fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-20px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}



		.ccl-ohistory--hero__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: clamp(2.5rem, 7vw, 4.5rem);

			font-weight: 900;

			line-height: 1.1;

			color: var(--ink);

			margin: 0 0 28px;

			animation: fadeInUp 1s ease 0.2s both;

		}



		@keyframes fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}



		.ccl-ohistory--hero__title mark {

			background: linear-gradient(120deg, rgba(11, 92, 255, 0.2) 0%, rgba(11, 92, 255, 0.15) 100%);

			background-position: 0 85%;

			background-repeat: no-repeat;

			background-size: 100% 45%;

			padding: 0 12px;

			color: var(--primary);

			position: relative;

		}



		.ccl-ohistory--hero__lead {

			font-size: clamp(1.1rem, 2.5vw, 1.35rem);

			line-height: 1.7;

			color: var(--muted);

			margin: 0 0 48px;

			max-width: 800px;

			margin-left: auto;

			margin-right: auto;

			animation: fadeInUp 1s ease 0.4s both;

		}



		.ccl-ohistory--hero__stats {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

			gap: 24px;

			max-width: 1000px;

			margin: 0 auto;

			animation: fadeInUp 1s ease 0.6s both;

		}



		.ccl-ohistory--hero__stat {

			background: rgba(255, 255, 255, 0.9);

			backdrop-filter: blur(20px);

			border: 1px solid rgba(255, 255, 255, 0.5);

			border-radius: 20px;

			padding: 28px 24px;

			text-align: center;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);

		}



		.ccl-ohistory--hero__stat:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 40px rgba(11, 92, 255, 0.15);

			border-color: rgba(11, 92, 255, 0.3);

			background: rgba(255, 255, 255, 1);

		}



		.ccl-ohistory--hero__stat-num {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: 2.75rem;

			font-weight: 900;

			color: var(--primary);

			margin-bottom: 10px;

			line-height: 1;

			display: block;

		}



		.ccl-ohistory--hero__stat-label {

			font-size: 1rem;

			font-weight: 600;

			color: var(--ink);

			line-height: 1.4;

		}



		/* ========================================

		   TIMELINE SECTION - MOBILE-FIRST REDESIGN

		   ======================================== */



		.ccl-ohistory--timeline {

			padding: 100px 0;

			background: linear-gradient(180deg, #fff 0%, rgba(248, 249, 250, 0.5) 50%, #fff 100%);

			position: relative;

			overflow: hidden;

		}



		/* Decorative background */

		.ccl-ohistory--timeline::before {

			content: '';

			position: absolute;

			top: 5%;

			left: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.03) 0%, transparent 70%);

			border-radius: 50%;

			pointer-events: none;

		}



		.ccl-ohistory--timeline::after {

			content: '';

			position: absolute;

			bottom: 10%;

			right: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.04) 0%, transparent 70%);

			border-radius: 50%;

			pointer-events: none;

		}



		.ccl-ohistory--timeline__header {

			max-width: 900px;

			margin: 0 auto 80px;

			text-align: center;

			position: relative;

			z-index: 1;

		}



		.ccl-ohistory--timeline__kicker {

			font-size: 14px;

			font-weight: 800;

			color: var(--primary);

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 24px;

			display: inline-flex;

			align-items: center;

			gap: 12px;

		}



		.ccl-ohistory--timeline__kicker::before,

		.ccl-ohistory--timeline__kicker::after {

			content: '';

			width: 40px;

			height: 3px;

			background: linear-gradient(90deg, var(--primary), transparent);

			border-radius: 2px;

		}



		.ccl-ohistory--timeline__kicker::after {

			background: linear-gradient(90deg, transparent, var(--primary));

		}



		.ccl-ohistory--timeline__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: clamp(2.25rem, 6vw, 4rem);

			font-weight: 900;

			line-height: 1.15;

			color: var(--ink);

			margin: 0 0 28px;

			letter-spacing: -0.02em;

		}



		.ccl-ohistory--timeline__title mark {

			background: linear-gradient(120deg, rgba(11, 92, 255, 0.2) 0%, rgba(11, 92, 255, 0.12) 100%);

			background-position: 0 88%;

			background-repeat: no-repeat;

			background-size: 100% 50%;

			padding: 0 8px;

			color: var(--primary);

		}



		.ccl-ohistory--timeline__lead {

			font-size: clamp(1.05rem, 2vw, 1.25rem);

			line-height: 1.7;

			color: var(--muted);

			margin: 0;

			max-width: 750px;

			margin: 0 auto;

		}



		/* Timeline Container */

		.ccl-ohistory--timeline-container {

			max-width: 1000px;

			margin: 0 auto;

			position: relative;

		}



		/* Vertical timeline line - Mobile first */

		.ccl-ohistory--timeline-line {

			position: absolute;

			left: 28px;

			top: 0;

			bottom: 0;

			width: 3px;

			background: var(--timeline-line);

			overflow: hidden;

		}



		/* Progress fill that reveals on scroll */

		.ccl-ohistory--timeline-line::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 0%;

			background: linear-gradient(180deg, var(--primary) 0%, #1d4ed8 100%);

			transition: height 0.3s ease-out;

			box-shadow: 0 0 10px rgba(11, 92, 255, 0.4);

		}



		.ccl-ohistory--timeline-items {

			position: relative;

			z-index: 1;

		}



		/* Timeline Item - Stacked Mobile Layout */

		.ccl-ohistory--timeline-item {

			display: flex;

			gap: 24px;

			margin-bottom: 60px;

			position: relative;

		}



		.ccl-ohistory--timeline-item:last-child {

			margin-bottom: 0;

		}



		/* Dot wrapper - Always on left for mobile */

		.ccl-ohistory--timeline-dot-wrapper {

			flex-shrink: 0;

			width: 56px;

			display: flex;

			align-items: flex-start;

			justify-content: center;

			padding-top: 12px;

		}



		/* Enhanced milestone dot */

		.ccl-ohistory--timeline-dot {

			position: relative;

			width: 24px;

			height: 24px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary), #1d4ed8);

			border: 4px solid #fff;

			box-shadow: 0 0 0 3px rgba(11, 92, 255, 0.2), 0 4px 16px rgba(11, 92, 255, 0.25);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}



		/* Glow effect */

		.ccl-ohistory--timeline-dot::before {

			content: '';

			position: absolute;

			inset: -6px;

			border-radius: 50%;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.15), transparent 70%);

			opacity: 0;

			transition: opacity 0.4s ease;

		}



		.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-dot {

			transform: scale(1.25);

			box-shadow: 0 0 0 4px rgba(11, 92, 255, 0.25), 0 6px 24px rgba(11, 92, 255, 0.35);

		}



		.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-dot::before {

			opacity: 1;

		}



		/* Content wrapper - Contains card and context */

		.ccl-ohistory--timeline-content-wrapper {

			flex: 1;

			min-width: 0;

			display: flex;

			flex-direction: column;

			gap: 16px;

		}



		/* Main content card */

		.ccl-ohistory--timeline-content {

			background: #fff;

			border: 2px solid var(--soft-bd);

			border-radius: 20px;

			padding: 28px;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}



		/* Top accent line */

		.ccl-ohistory--timeline-content::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--primary), #1d4ed8, var(--primary));

			background-size: 200% 100%;

			opacity: 0;

			transition: opacity 0.4s ease;

		}



		.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-content {

			transform: translateY(-6px);

			box-shadow: 0 12px 40px rgba(11, 92, 255, 0.12);

			border-color: rgba(11, 92, 255, 0.3);

		}



		.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-content::before {

			opacity: 1;

			animation: shimmer 2s ease-in-out infinite;

		}



		@keyframes shimmer {

			0% { background-position: 200% 0; }

			100% { background-position: -200% 0; }

		}



		/* Year badge */

		.ccl-ohistory--timeline-content__year {

			display: inline-flex;

			align-items: center;

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: 0.9rem;

			font-weight: 900;

			color: #fff;

			background: linear-gradient(135deg, var(--primary), #1d4ed8);

			padding: 8px 18px;

			border-radius: 999px;

			margin-bottom: 16px;

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.25);

			letter-spacing: 0.5px;

		}



		.ccl-ohistory--timeline-content__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: clamp(1.2rem, 3vw, 1.5rem);

			font-weight: 800;

			color: var(--ink);

			margin: 0 0 14px;

			line-height: 1.3;

			letter-spacing: -0.01em;

		}



		.ccl-ohistory--timeline-content__desc {

			font-size: clamp(0.95rem, 2vw, 1.05rem);

			line-height: 1.7;

			color: var(--muted);

			margin: 0;

		}



		/* Achievement list */

		.ccl-ohistory--timeline-content__list {

			list-style: none;

			padding: 0;

			margin: 20px 0 0 0;

			display: flex;

			flex-direction: column;

			gap: 10px;

		}



		.ccl-ohistory--timeline-content__list li {

			display: flex;

			align-items: flex-start;

			gap: 12px;

			font-size: clamp(0.9rem, 2vw, 1rem);

			color: var(--ink);

			background: rgba(248, 249, 250, 0.6);

			padding: 12px 14px;

			border-radius: 10px;

			border: 1px solid transparent;

			transition: all 0.3s ease;

		}



		.ccl-ohistory--timeline-content__list li:hover {

			background: rgba(238, 244, 255, 0.4);

			border-color: rgba(11, 92, 255, 0.2);

			transform: translateX(4px);

		}



		.ccl-ohistory--timeline-content__list li i {

			color: var(--primary);

			flex-shrink: 0;

			font-size: 14px;

			margin-top: 2px;

		}



		/* Historical Context - Completely Redesigned */

		.ccl-ohistory--timeline-context {

			background: linear-gradient(135deg, rgba(248, 249, 250, 0.8), rgba(238, 244, 255, 0.4));

			border: 1.5px solid var(--soft-bd);

			border-left: 3px solid var(--primary);

			border-radius: 12px;

			padding: 16px 18px;

			backdrop-filter: blur(10px);

			transition: all 0.3s ease;

			/* Ensure no overflow */

			overflow: hidden;

			word-wrap: break-word;

			max-width: 100%;

		}



		.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-context {

			background: linear-gradient(135deg, rgba(238, 244, 255, 0.7), rgba(248, 249, 250, 0.6));

			border-color: rgba(11, 92, 255, 0.3);

			box-shadow: 0 4px 16px rgba(11, 92, 255, 0.06);

		}



		.ccl-ohistory--timeline-context__label {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			font-size: 10px;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 0.8px;

			color: var(--primary);

			margin-bottom: 8px;

			background: rgba(11, 92, 255, 0.1);

			padding: 4px 10px;

			border-radius: 6px;

		}



		.ccl-ohistory--timeline-context__label i {

			font-size: 10px;

		}



		.ccl-ohistory--timeline-context__text {

			font-size: clamp(0.85rem, 2vw, 0.95rem);

			font-style: italic;

			color: var(--slate-light);

			line-height: 1.6;

			margin: 0;

			/* Prevent text overflow */

			word-break: normal;

			overflow-wrap: break-word;

			hyphens: manual;

		}



		/* ========================================

		   DESKTOP LAYOUT (768px and up)

		   ======================================== */



		@media (min-width: 768px) {

			.ccl-ohistory--timeline {

				padding: 100px 0;

			}



			.ccl-ohistory--timeline__header {

				margin-bottom: 80px;

			}



			.ccl-ohistory--timeline-container {

				max-width: 1300px;

			}



			/* Center line for desktop */

			.ccl-ohistory--timeline-line {

				left: 50%;

				transform: translateX(-50%);

				width: 3px;

			}



			/* Zigzag layout for desktop */

			.ccl-ohistory--timeline-item {

				display: grid;

				grid-template-columns: 1fr 100px 1fr;

				gap: 40px;

				margin-bottom: 80px;

				align-items: flex-start;

			}



			.ccl-ohistory--timeline-dot-wrapper {

				grid-column: 2;

				width: auto;

				padding-top: 20px;

			}



			.ccl-ohistory--timeline-dot {

				width: 28px;

				height: 28px;

				border: 5px solid #fff;

				box-shadow: 0 0 0 4px rgba(11, 92, 255, 0.2), 0 6px 20px rgba(11, 92, 255, 0.25);

			}



			.ccl-ohistory--timeline-dot::before {

				inset: -8px;

			}



			.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-dot {

				transform: scale(1.35) rotate(180deg);

				box-shadow: 0 0 0 6px rgba(11, 92, 255, 0.25), 0 8px 30px rgba(11, 92, 255, 0.4);

			}



			/* Connector lines from dot to content */

			.ccl-ohistory--timeline-dot::after {

				content: '';

				position: absolute;

				top: 50%;

				width: 35px;

				height: 2px;

				background: linear-gradient(90deg, var(--primary), transparent);

				transform: translateY(-50%);

			}



			/* Odd items - content on left */

			.ccl-ohistory--timeline-item:nth-child(odd) .ccl-ohistory--timeline-content-wrapper {

				grid-column: 1;

			}



			.ccl-ohistory--timeline-item:nth-child(odd) .ccl-ohistory--timeline-dot::after {

				right: 100%;

				margin-right: 8px;

			}



			/* Even items - content on right */

			.ccl-ohistory--timeline-item:nth-child(even) .ccl-ohistory--timeline-content-wrapper {

				grid-column: 3;

			}



			.ccl-ohistory--timeline-item:nth-child(even) .ccl-ohistory--timeline-dot::after {

				left: 100%;

				margin-left: 8px;

				background: linear-gradient(90deg, transparent, var(--primary));

			}



			.ccl-ohistory--timeline-content {

				padding: 32px;

			}



			.ccl-ohistory--timeline-content__year {

				font-size: 1rem;

				padding: 10px 22px;

				margin-bottom: 20px;

			}



			.ccl-ohistory--timeline-context {

				padding: 20px 22px;

			}

		}



		/* Large desktop optimization */

		@media (min-width: 1200px) {

			.ccl-ohistory--timeline-item {

				gap: 50px;

				margin-bottom: 100px;

			}



			.ccl-ohistory--timeline-content {

				padding: 36px;

			}



			.ccl-ohistory--timeline-content__list li {

				padding: 14px 16px;

			}



			.ccl-ohistory--timeline-context {

				padding: 22px 24px;

			}

		}



		/* ========================================

		   ADVOCACY SECTION - ENHANCED

		   ======================================== */



		.ccl-ohistory--advocacy {

			padding: 100px 0;

			background: var(--soft-bg);

			position: relative;

		}



		.ccl-ohistory--advocacy::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background-image: 

				radial-gradient(circle at 70% 30%, rgba(11, 92, 255, 0.03) 0%, transparent 50%);

			pointer-events: none;

		}



		.ccl-ohistory--advocacy__header {

			max-width: 850px;

			margin: 0 auto 60px;

			text-align: center;

		}



		.ccl-ohistory--advocacy__kicker {

			font-size: 15px;

			font-weight: 700;

			color: var(--primary);

			text-transform: uppercase;

			letter-spacing: 1.5px;

			margin-bottom: 20px;

			display: inline-flex;

			align-items: center;

			gap: 8px;

		}



		.ccl-ohistory--advocacy__kicker::before,

		.ccl-ohistory--advocacy__kicker::after {

			content: '';

			width: 30px;

			height: 2px;

			background: var(--primary);

		}



		.ccl-ohistory--advocacy__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: clamp(2.25rem, 5.5vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ink);

			margin: 0 0 24px;

		}



		.ccl-ohistory--advocacy__title mark {

			background: linear-gradient(120deg, rgba(11, 92, 255, 0.18) 0%, rgba(11, 92, 255, 0.15) 100%);

			background-position: 0 85%;

			background-repeat: no-repeat;

			background-size: 100% 45%;

			padding: 0 12px;

			color: var(--primary);

		}



		.ccl-ohistory--advocacy__lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

			margin: 0;

		}



		.ccl-ohistory--advocacy-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

			max-width: 1300px;

			margin: 0 auto;

		}



		.ccl-ohistory--advocacy-card {

			background: #fff;

			border: 2px solid var(--soft-bd);

			border-radius: 24px;

			padding: 32px;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}



		.ccl-ohistory--advocacy-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 5px;

			background: linear-gradient(90deg, var(--primary), #1d4ed8, var(--primary));

			background-size: 200% 100%;

			transform: translateY(-5px);

			transition: all 0.4s ease;

		}



		.ccl-ohistory--advocacy-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 60px rgba(11, 92, 255, 0.15);

			border-color: var(--primary);

		}



		.ccl-ohistory--advocacy-card:hover::before {

			transform: translateY(0);

			animation: shimmer 2s ease-in-out infinite;

		}



		@keyframes shimmer {

			0% { background-position: 200% 0; }

			100% { background-position: -200% 0; }

		}



		.ccl-ohistory--advocacy-card__icon {

			width: 72px;

			height: 72px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.12), rgba(11, 92, 255, 0.06));

			color: var(--primary);

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 32px;

			margin-bottom: 28px;

			transition: all 0.4s ease;

		}



		.ccl-ohistory--advocacy-card:hover .ccl-ohistory--advocacy-card__icon {

			background: linear-gradient(135deg, var(--primary), #1d4ed8);

			color: #fff;

			transform: rotate(360deg) scale(1.1);

		}



		.ccl-ohistory--advocacy-card__year {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: 0.9rem;

			font-weight: 800;

			color: var(--primary);

			text-transform: uppercase;

			letter-spacing: 1.2px;

			margin-bottom: 16px;

		}



		.ccl-ohistory--advocacy-card__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ink);

			margin: 0 0 18px;

			line-height: 1.3;

		}



		.ccl-ohistory--advocacy-card__desc {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin: 0 0 24px;

		}



		.ccl-ohistory--advocacy-card__achievements {

			list-style: none;

			padding: 0;

			margin: 0;

		}



		.ccl-ohistory--advocacy-card__achievements li {

			display: flex;

			align-items: flex-start;

			gap: 12px;

			margin-bottom: 12px;

			font-size: 1rem;

			color: var(--muted);

		}



		.ccl-ohistory--advocacy-card__achievements li:last-child {

			margin-bottom: 0;

		}



		.ccl-ohistory--advocacy-card__achievements li i {

			color: var(--primary);

			margin-top: 5px;

			flex-shrink: 0;

			font-size: 16px;

		}



		/* ========================================

		   LEGACY SECTION - ENHANCED

		   ======================================== */



		.ccl-ohistory--legacy {

			padding: 100px 0;

			background: linear-gradient(180deg, #fff 0%, rgba(238, 244, 255, 0.3) 100%);

		}



		.ccl-ohistory--legacy__inner {

			max-width: 1300px;

			margin: 0 auto;

		}



		.ccl-ohistory--legacy__header {

			max-width: 850px;

			margin: 0 auto 60px;

			text-align: center;

		}



		.ccl-ohistory--legacy__kicker {

			font-size: 15px;

			font-weight: 700;

			color: var(--primary);

			text-transform: uppercase;

			letter-spacing: 1.5px;

			margin-bottom: 20px;

			display: inline-flex;

			align-items: center;

			gap: 8px;

		}



		.ccl-ohistory--legacy__kicker::before,

		.ccl-ohistory--legacy__kicker::after {

			content: '';

			width: 30px;

			height: 2px;

			background: var(--primary);

		}



		.ccl-ohistory--legacy__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: clamp(2.25rem, 5.5vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ink);

			margin: 0 0 24px;

		}



		.ccl-ohistory--legacy__title mark {

			background: linear-gradient(120deg, rgba(11, 92, 255, 0.18) 0%, rgba(11, 92, 255, 0.15) 100%);

			background-position: 0 85%;

			background-repeat: no-repeat;

			background-size: 100% 45%;

			padding: 0 12px;

			color: var(--primary);

		}



		.ccl-ohistory--legacy__lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

			margin: 0;

		}



		.ccl-ohistory--legacy-stats {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));

			gap: 28px;

		}



		.ccl-ohistory--legacy-stat {

			text-align: center;

			padding: 36px 28px;

			background: linear-gradient(135deg, #fff 0%, rgba(248, 249, 250, 0.8) 100%);

			border: 2px solid var(--soft-bd);

			border-radius: 24px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}



		.ccl-ohistory--legacy-stat::before {

			content: '';

			position: absolute;

			top: 0;

			left: -100%;

			width: 100%;

			height: 100%;

			background: linear-gradient(90deg, transparent, rgba(11, 92, 255, 0.05), transparent);

			transition: left 0.6s ease;

		}



		.ccl-ohistory--legacy-stat:hover::before {

			left: 100%;

		}



		.ccl-ohistory--legacy-stat:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 48px rgba(11, 92, 255, 0.12);

			border-color: var(--primary);

			background: linear-gradient(135deg, #fff 0%, rgba(238, 244, 255, 0.5) 100%);

		}



		.ccl-ohistory--legacy-stat__icon {

			width: 90px;

			height: 90px;

			margin: 0 auto 24px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.12), rgba(11, 92, 255, 0.06));

			color: var(--primary);

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 40px;

			transition: all 0.4s ease;

		}



		.ccl-ohistory--legacy-stat:hover .ccl-ohistory--legacy-stat__icon {

			background: linear-gradient(135deg, var(--primary), #1d4ed8);

			color: #fff;

			transform: scale(1.1) rotate(360deg);

		}



		.ccl-ohistory--legacy-stat__num {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: 3.5rem;

			font-weight: 900;

			color: var(--primary);

			margin-bottom: 12px;

			line-height: 1;

		}



		.ccl-ohistory--legacy-stat__label {

			font-size: 1.15rem;

			font-weight: 700;

			color: var(--ink);

			margin-bottom: 10px;

		}



		.ccl-ohistory--legacy-stat__desc {

			font-size: 1rem;

			color: var(--muted);

			line-height: 1.6;

			margin: 0;

		}



		/* ========================================

		   CTA SECTION - ENHANCED

		   ======================================== */



		.ccl-ohistory--section {

			padding: 80px 0;

		}



		.ccl-ohistory--cta-section {

			background: linear-gradient(135deg, rgba(11, 92, 255, 0.03) 0%, rgba(238, 244, 255, 0.5) 100%);

			border-top: 1px solid var(--line);

			border-bottom: 1px solid var(--line);

			position: relative;

			overflow: hidden;

		}



		.ccl-ohistory--cta-section::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			transform: translate(-50%, -50%);

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			pointer-events: none;

		}



		.ccl-ohistory--section__inner {

			max-width: 1000px;

			margin: 0 auto;

			position: relative;

			z-index: 1;

		}



		.ccl-ohistory--section__header {

			max-width: 850px;

			margin: 0 auto 40px;

			text-align: center;

		}



		.ccl-ohistory--cta-section__title {

			font-family: 'Inter Tight', Inter, sans-serif;

			font-size: clamp(2rem, 5vw, 2.75rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ink);

			margin: 0 0 24px;

		}



		.ccl-ohistory--cta-section__text {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

			margin: 0;

		}



		.ccl-ohistory--cta-section__buttons {

			display: flex;

			flex-wrap: wrap;

			gap: 20px;

			justify-content: center;

			align-items: center;

		}



		/* ========================================

		   RESPONSIVE DESIGN - COMPREHENSIVE

		   ======================================== */



		/* Large Tablet - 1024px */

		@media (max-width: 1024px) {

			.ccl-ohistory--wrapper {

				--container-pad: 24px;

			}



			.ccl-ohistory--hero {

				padding: 100px 0 80px;

			}



			.ccl-ohistory--advocacy-grid {

				grid-template-columns: repeat(2, 1fr);

				gap: 28px;

			}



			.ccl-ohistory--legacy-stats {

				grid-template-columns: repeat(2, 1fr);

			}

		}



		/* Tablet - 768px */

		@media (max-width: 768px) {

			.ccl-ohistory--wrapper {

				--container-pad: 20px;

				font-size: 16px;

			}



			/* Hero Section */

			.ccl-ohistory--hero {

				padding: 80px 0 60px;

			}



			.ccl-ohistory--hero__kicker {

				font-size: 12px;

				padding: 8px 16px;

				margin-bottom: 24px;

			}



			.ccl-ohistory--hero__title {

				margin-bottom: 20px;

			}



			.ccl-ohistory--hero__lead {

				font-size: 1.15rem;

				margin-bottom: 36px;

			}



			.ccl-ohistory--hero__stats {

				grid-template-columns: repeat(2, 1fr);

				gap: 16px;

			}



			.ccl-ohistory--hero__stat {

				padding: 24px 20px;

			}



			.ccl-ohistory--hero__stat-num {

				font-size: 2.25rem;

			}



			.ccl-ohistory--hero__stat-label {

				font-size: 0.9rem;

			}



			/* Sections */

			.ccl-ohistory--timeline,

			.ccl-ohistory--advocacy,

			.ccl-ohistory--legacy,

			.ccl-ohistory--section {

				padding: 70px 0;

			}



			/* Section Headers */

			.ccl-ohistory--timeline__header,

			.ccl-ohistory--advocacy__header,

			.ccl-ohistory--legacy__header {

				margin-bottom: 60px;

			}



			/* Advocacy Cards */

			.ccl-ohistory--advocacy-grid {

				grid-template-columns: 1fr;

				gap: 24px;

			}



			.ccl-ohistory--advocacy-card {

				padding: 32px;

			}



			.ccl-ohistory--advocacy-card__icon {

				width: 64px;

				height: 64px;

				font-size: 28px;

				margin-bottom: 24px;

			}



			.ccl-ohistory--advocacy-card__year {

				font-size: 0.85rem;

			}



			.ccl-ohistory--advocacy-card__title {

				font-size: 1.35rem;

				margin-bottom: 16px;

			}



			.ccl-ohistory--advocacy-card__desc {

				font-size: 1rem;

				margin-bottom: 20px;

			}



			.ccl-ohistory--advocacy-card__achievements li {

				font-size: 0.95rem;

				margin-bottom: 10px;

			}



			/* Legacy Stats */

			.ccl-ohistory--legacy-stats {

				grid-template-columns: 1fr;

				gap: 24px;

			}



			.ccl-ohistory--legacy-stat {

				padding: 36px 28px;

			}



			.ccl-ohistory--legacy-stat__icon {

				width: 76px;

				height: 76px;

				font-size: 34px;

				margin-bottom: 20px;

			}



			.ccl-ohistory--legacy-stat__num {

				font-size: 3rem;

			}



			.ccl-ohistory--legacy-stat__label {

				font-size: 1.05rem;

			}



			.ccl-ohistory--legacy-stat__desc {

				font-size: 0.95rem;

			}



			/* CTA Section */

			.ccl-ohistory--cta-section__title {

				margin-bottom: 20px;

			}



			.ccl-ohistory--cta-section__text {

				font-size: 1.1rem;

			}



			.ccl-ohistory--cta-section__buttons {

				flex-direction: column;

				width: 100%;

				gap: 16px;

			}



			.ccl-ohistory--btn {

				width: 100%;

				min-height: 54px;

				font-size: 16px;

				padding: 16px 32px;

			}

		}



		/* Mobile - 480px and below */

		@media (max-width: 480px) {

			.ccl-ohistory--wrapper {

				--container-pad: 16px;

			}



			/* Hero Section */

			.ccl-ohistory--hero {

				padding: 60px 0 50px;

			}



			.ccl-ohistory--hero::after {

				width: 400px;

				height: 400px;

				top: -150px;

				right: -150px;

			}



			.ccl-ohistory--hero__kicker {

				font-size: 11px;

				padding: 7px 14px;

				margin-bottom: 20px;

			}



			.ccl-ohistory--hero__lead {

				font-size: 1.05rem;

			}



			.ccl-ohistory--hero__stats {

				grid-template-columns: 1fr;

				gap: 12px;

			}



			.ccl-ohistory--hero__stat {

				padding: 20px 16px;

			}



			.ccl-ohistory--hero__stat-num {

				font-size: 2rem;

			}



			.ccl-ohistory--hero__stat-label {

				font-size: 0.85rem;

			}



			/* Sections */

			.ccl-ohistory--timeline,

			.ccl-ohistory--advocacy,

			.ccl-ohistory--legacy,

			.ccl-ohistory--section {

				padding: 60px 0;

			}



			/* Section Headers */

			.ccl-ohistory--timeline__header,

			.ccl-ohistory--advocacy__header,

			.ccl-ohistory--legacy__header,

			.ccl-ohistory--section__header {

				margin-bottom: 48px;

			}



			/* Advocacy Cards */

			.ccl-ohistory--advocacy-card {

				padding: 28px;

				border-radius: 20px;

			}



			.ccl-ohistory--advocacy-card__icon {

				width: 56px;

				height: 56px;

				font-size: 24px;

				margin-bottom: 20px;

			}



			.ccl-ohistory--advocacy-card__year {

				font-size: 0.8rem;

			}



			.ccl-ohistory--advocacy-card__title {

				font-size: 1.2rem;

			}



			.ccl-ohistory--advocacy-card__desc {

				font-size: 0.95rem;

			}



			.ccl-ohistory--advocacy-card__achievements li {

				font-size: 0.9rem;

			}



			/* Legacy Stats */

			.ccl-ohistory--legacy-stat {

				padding: 32px 24px;

				border-radius: 20px;

			}



			.ccl-ohistory--legacy-stat__icon {

				width: 68px;

				height: 68px;

				font-size: 30px;

				margin-bottom: 18px;

			}



			.ccl-ohistory--legacy-stat__num {

				font-size: 2.75rem;

			}



			.ccl-ohistory--legacy-stat__label {

				font-size: 1rem;

			}



			.ccl-ohistory--legacy-stat__desc {

				font-size: 0.9rem;

			}



			/* CTA */

			.ccl-ohistory--btn {

				min-height: 52px;

				font-size: 15px;

				padding: 15px 28px;

			}

		}



		/* Extra Small Mobile - 360px and below */

		@media (max-width: 360px) {

			.ccl-ohistory--wrapper {

				--container-pad: 14px;

			}



			.ccl-ohistory--hero__stat-num {

				font-size: 1.75rem;

			}



			.ccl-ohistory--advocacy-card__title {

				font-size: 1.1rem;

			}



			.ccl-ohistory--legacy-stat__num {

				font-size: 2.5rem;

			}

		}



		/* Touch device specific improvements */

		@media (hover: none) and (pointer: coarse) {

			/* Ensure tap targets are large enough */

			.ccl-ohistory--btn {

				min-height: 52px;

			}



			/* Remove hover effects that don't work on touch */

			.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-dot,

			.ccl-ohistory--timeline-item:hover .ccl-ohistory--timeline-content,

			.ccl-ohistory--advocacy-card:hover,

			.ccl-ohistory--legacy-stat:hover {

				transform: none;

			}



			/* Active state for touch feedback */

			.ccl-ohistory--btn:active {

				transform: scale(0.97);

			}



			.ccl-ohistory--advocacy-card:active,

			.ccl-ohistory--legacy-stat:active {

				transform: scale(0.98);

			}

		}

	   /* ========================================

		   CARTER CAPNER LAW - COMMUNITY PAGE

		   Prefix: ccl-community--

		======================================== */

		

		.ccl-community--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--muted);

			

			/* Reset */

			margin: 0;

			padding: 0;

			box-sizing: border-box;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-community--wrapper *,

		.ccl-community--wrapper *::before,

		.ccl-community--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		/* Smooth Scrolling */

		.ccl-community--wrapper {

			scroll-behavior: smooth;

		}

		

		/* Main Container */

		.ccl-community--wrapper main {

			overflow-x: hidden;

		}

		

		/* ========================================

		   HERO SECTION

		======================================== */

		

		.ccl-community--hero {

			position: relative;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 120px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-community--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

			animation: ccl-community--glow 15s ease-in-out infinite;

		}

		

		@keyframes ccl-community--glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(10%, 10%) scale(1.1); }

		}

		

		.ccl-community--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-community--kicker {

			display: inline-block;

			font-size: 0.9rem;

			font-weight: 700;

			letter-spacing: 2px;

			text-transform: uppercase;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 20px;

			padding: 8px 20px;

			background: rgba(255, 255, 255, 0.15);

			border-radius: 50px;

			backdrop-filter: blur(10px);

			animation: ccl-community--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-community--fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-community--hero h1 {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			line-height: 1.1;

			color: var(--white);

			margin-bottom: 28px;

			animation: ccl-community--fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-community--fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-community--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.35rem);

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			margin-bottom: 32px;

			animation: ccl-community--fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-community--definition {

			background: rgba(255, 255, 255, 0.12);

			border-left: 4px solid rgba(255, 255, 255, 0.4);

			padding: 24px 28px;

			border-radius: 8px;

			text-align: left;

			max-width: 700px;

			margin: 0 auto;

			backdrop-filter: blur(10px);

			animation: ccl-community--fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-community--definition-term {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.35rem;

			font-weight: 800;

			color: var(--white);

			margin-bottom: 12px;

			font-style: italic;

		}

		

		.ccl-community--definition-text {

			font-size: 1.05rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 8px;

		}

		

		.ccl-community--definition-source {

			font-size: 0.9rem;

			color: rgba(255, 255, 255, 0.7);

			font-style: italic;

		}

		

		/* ========================================

		   SECTION HEADERS

		======================================== */

		

		.ccl-community--section {

			padding: 100px 24px;

		}

		

		.ccl-community--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 70px;

		}

		

		.ccl-community--section-kicker {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

			font-size: 0.85rem;

			font-weight: 700;

			letter-spacing: 2px;

			text-transform: uppercase;

			color: var(--primary-blue);

			margin-bottom: 20px;

		}

		

		.ccl-community--section-kicker::before,

		.ccl-community--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-community--section h2 {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ink);

			margin-bottom: 24px;

		}

		

		.ccl-community--section h2 mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.25) 100%);

			color: inherit;

			padding: 0 8px;

			border-radius: 4px;

		}

		

		.ccl-community--section h2 mark.green {

			background: linear-gradient(120deg, rgba(16, 185, 129, 0.2) 0%, rgba(16, 185, 129, 0.3) 100%);

		}

		

		.ccl-community--section h2 mark.gold {

			background: linear-gradient(120deg, rgba(255, 168, 38, 0.2) 0%, rgba(255, 168, 38, 0.3) 100%);

		}

		

		.ccl-community--section-lead {

			font-size: 1.2rem;

			line-height: 1.8;

			color: var(--muted);

		}

		

		/* ========================================

		   VALUES GRID

		======================================== */

		

		.ccl-community--values-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 32px;

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-community--value-card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 40px 36px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-community--value-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 5px;

			background: var(--primary-blue);

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--value-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 60px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-community--value-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-community--value-icon {

			width: 85px;

			height: 85px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--value-icon i {

			font-size: 2.2rem;

			color: var(--white);

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--value-card:hover .ccl-community--value-icon {

			transform: rotate(10deg) scale(1.05);

		}

		

		.ccl-community--value-card:hover .ccl-community--value-icon i {

			transform: rotate(-10deg);

		}

		

		.ccl-community--value-card h3 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 16px;

			line-height: 1.3;

		}

		

		.ccl-community--value-card p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		/* ========================================

		   CONTENT SECTIONS

		======================================== */

		

		.ccl-community--content-section {

			max-width: 1200px;

			margin: 0 auto 100px;

		}

		

		.ccl-community--content-section:last-child {

			margin-bottom: 0;

		}

		

		.ccl-community--section-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 3.5vw, 3rem);

			font-weight: 900;

			color: var(--ink);

			margin-bottom: 28px;

			line-height: 1.2;

		}

		

		.ccl-community--section-subtitle {

			font-size: 1.4rem;

			font-weight: 700;

			color: var(--primary-blue);

			margin-bottom: 20px;

			line-height: 1.4;

		}

		

		.ccl-community--section-subtitle--green {

			color: var(--accent-green);

		}

		

		.ccl-community--content-text {

			font-size: 1.1rem;

			line-height: 1.9;

			color: var(--muted);

			margin-bottom: 24px;

		}

		

		.ccl-community--content-text:last-child {

			margin-bottom: 0;

		}

		

		/* ========================================

		   PROGRAM CARDS - REDESIGNED

		======================================== */

		

		.ccl-community--programs-section {

			background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);

		}

		

		.ccl-community--programs-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-community--program-card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			overflow: hidden;

			margin-bottom: 48px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);

		}

		

		.ccl-community--program-card:last-child {

			margin-bottom: 0;

		}

		

		.ccl-community--program-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--accent-green) 0%, #059669 100%);

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--program-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 20px 60px rgba(16, 185, 129, 0.15);

			border-color: var(--accent-green);

		}

		

		.ccl-community--program-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-community--program-inner {

			display: grid;

			grid-template-columns: 280px 1fr;

			gap: 0;

		}

		

		.ccl-community--program-card.reverse .ccl-community--program-inner {

			grid-template-columns: 1fr 280px;

		}

		

		.ccl-community--program-visual {

			position: relative;

			background: linear-gradient(135deg, var(--accent-green) 0%, #059669 100%);

			padding: 48px 32px;

			display: flex;

			flex-direction: column;

			align-items: center;

			justify-content: center;

			text-align: center;

			order: 1;

		}

		

		.ccl-community--program-card.reverse .ccl-community--program-visual {

			order: 2;

		}

		

		.ccl-community--program-visual::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: url('data:image/svg+xml,<svg width="40" height="40" xmlns="http://www.w3.org/2000/svg"><circle cx="2" cy="2" r="1" fill="rgba(255,255,255,0.1)"/></svg>');

			opacity: 0.6;

		}

		

		.ccl-community--program-icon-large {

			position: relative;

			z-index: 1;

			width: 120px;

			height: 120px;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 28px;

			border: 4px solid rgba(255, 255, 255, 0.3);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--program-card:hover .ccl-community--program-icon-large {

			transform: scale(1.1) rotate(10deg);

			background: rgba(255, 255, 255, 0.25);

		}

		

		.ccl-community--program-icon-large i {

			font-size: 3.5rem;

			color: var(--white);

		}

		

		.ccl-community--program-badge {

			position: relative;

			z-index: 1;

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 10px 20px;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--white);

			margin-bottom: 16px;

		}

		

		.ccl-community--program-badge i {

			font-size: 0.85rem;

		}

		

		.ccl-community--program-title-visual {

			position: relative;

			z-index: 1;

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--white);

			line-height: 1.3;

		}

		

		.ccl-community--program-content {

			padding: 48px 44px;

			order: 2;

		}

		

		.ccl-community--program-card.reverse .ccl-community--program-content {

			order: 1;

		}

		

		.ccl-community--program-category {

			display: inline-block;

			font-size: 0.8rem;

			font-weight: 700;

			letter-spacing: 1.5px;

			text-transform: uppercase;

			color: var(--accent-green);

			margin-bottom: 12px;

			padding: 6px 14px;

			background: rgba(16, 185, 129, 0.1);

			border-radius: 50px;

		}

		

		.ccl-community--program-content h3 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 900;

			color: var(--ink);

			margin-bottom: 20px;

			line-height: 1.2;

		}

		

		.ccl-community--program-description {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 24px;

		}

		

		.ccl-community--program-stats {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			margin-bottom: 28px;

		}

		

		.ccl-community--stat-badge {

			display: inline-flex;

			flex-direction: column;

			padding: 16px 24px;

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(16, 185, 129, 0.12) 100%);

			border-radius: 12px;

			border-left: 4px solid var(--accent-green);

			min-width: 140px;

		}

		

		.ccl-community--stat-badge-number {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 900;

			color: var(--accent-green);

			line-height: 1;

			margin-bottom: 6px;

		}

		

		.ccl-community--stat-badge-label {

			font-size: 0.85rem;

			font-weight: 600;

			color: var(--ink);

			line-height: 1.3;

		}

		

		.ccl-community--program-features {

			list-style: none;

			margin-bottom: 28px;

		}

		

		.ccl-community--program-features li {

			position: relative;

			padding-left: 32px;

			margin-bottom: 14px;

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		.ccl-community--program-features li:last-child {

			margin-bottom: 0;

		}

		

		.ccl-community--program-features li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--accent-green);

			font-size: 0.9rem;

		}

		

		.ccl-community--program-highlight-text {

			padding: 24px 28px;

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.08) 0%, rgba(255, 168, 38, 0.12) 100%);

			border-radius: 12px;

			border-left: 4px solid var(--accent-gold);

		}

		

		.ccl-community--program-highlight-text p {

			font-size: 1.05rem;

			font-weight: 600;

			color: var(--ink);

			line-height: 1.7;

			margin: 0;

		}

		

		.ccl-community--program-highlight-text strong {

			color: var(--accent-gold);

		}

		

		/* ========================================

		   STATS SECTION

		======================================== */

		

		.ccl-community--stats {

			background: linear-gradient(135deg, var(--ink) 0%, #0f172a 100%);

			padding: 80px 24px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-community--stats::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: url('data:image/svg+xml,<svg width="60" height="60" xmlns="http://www.w3.org/2000/svg"><rect width="1" height="1" fill="rgba(255,255,255,0.05)"/></svg>');

			opacity: 0.5;

		}

		

		.ccl-community--stats-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

			gap: 48px;

			max-width: 1100px;

			margin: 0 auto;

			position: relative;

			z-index: 1;

		}

		

		.ccl-community--stat-item {

			text-align: center;

		}

		

		.ccl-community--stat-number {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 5vw, 4rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1;

			margin-bottom: 12px;

			display: block;

		}

		

		.ccl-community--stat-number.accent {

			color: var(--primary-blue);

		}

		

		.ccl-community--stat-label {

			font-size: 1rem;

			color: rgba(255, 255, 255, 0.8);

			font-weight: 500;

		}

		

		/* ========================================

		   LEADERSHIP SECTION

		======================================== */

		

		.ccl-community--leadership {

			background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);

		}

		

		.ccl-community--leadership-content {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-community--leadership-intro {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 48px;

			margin-bottom: 48px;

			box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);

		}

		

		.ccl-community--leadership-intro h3 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 24px;

		}

		

		.ccl-community--leadership-intro p {

			font-size: 1.1rem;

			line-height: 1.9;

			color: var(--muted);

			margin-bottom: 20px;

		}

		

		.ccl-community--leadership-intro p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-community--achievements-list {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 24px;

		}

		

		.ccl-community--achievement-item {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			padding: 28px;

			display: flex;

			align-items: flex-start;

			gap: 20px;

			transition: all 0.3s ease;

		}

		

		.ccl-community--achievement-item:hover {

			transform: translateX(8px);

			border-color: var(--accent-gold);

			box-shadow: 0 8px 30px rgba(255, 168, 38, 0.15);

		}

		

		.ccl-community--achievement-icon {

			flex-shrink: 0;

			width: 50px;

			height: 50px;

			border-radius: 12px;

			background: linear-gradient(135deg, var(--accent-gold) 0%, #f59e0b 100%);

			display: flex;

			align-items: center;

			justify-content: center;

		}

		

		.ccl-community--achievement-icon i {

			font-size: 1.4rem;

			color: var(--white);

		}

		

		.ccl-community--achievement-text {

			flex: 1;

		}

		

		.ccl-community--achievement-text h4 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.1rem;

			font-weight: 700;

			color: var(--ink);

			margin-bottom: 6px;

		}

		

		.ccl-community--achievement-text p {

			font-size: 0.95rem;

			line-height: 1.6;

			color: var(--muted);

			margin: 0;

		}

		

		/* ========================================

		   WORLDWIDE CONNECTIONS

		======================================== */

		

		.ccl-community--worldwide {

			background: linear-gradient(135deg, #0f172a 0%, var(--ink) 100%);

			padding: 100px 24px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-community--worldwide::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: radial-gradient(circle at 30% 50%, rgba(29, 99, 255, 0.1) 0%, transparent 50%),

						radial-gradient(circle at 70% 80%, rgba(16, 185, 129, 0.08) 0%, transparent 50%);

		}

		

		.ccl-community--worldwide-content {

			max-width: 1200px;

			margin: 0 auto;

			position: relative;

			z-index: 1;

		}

		

		.ccl-community--worldwide-header {

			text-align: center;

			margin-bottom: 60px;

		}

		

		.ccl-community--worldwide-kicker {

			display: inline-block;

			font-size: 0.85rem;

			font-weight: 700;

			letter-spacing: 2px;

			text-transform: uppercase;

			color: var(--primary-blue);

			margin-bottom: 20px;

			padding: 8px 20px;

			background: rgba(29, 99, 255, 0.15);

			border-radius: 50px;

			backdrop-filter: blur(10px);

		}

		

		.ccl-community--worldwide h2 {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 28px;

			line-height: 1.2;

		}

		

		.ccl-community--worldwide-lead {

			font-size: 1.25rem;

			line-height: 1.8;

			color: rgba(255, 255, 255, 0.85);

			max-width: 900px;

			margin: 0 auto 50px;

		}

		

		.ccl-community--regions-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 32px;

			margin-bottom: 60px;

		}

		

		.ccl-community--region-card {

			background: rgba(255, 255, 255, 0.05);

			border: 2px solid rgba(255, 255, 255, 0.1);

			border-radius: 20px;

			padding: 36px 32px;

			backdrop-filter: blur(10px);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-community--region-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--primary-blue) 0%, var(--accent-green) 100%);

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--region-card:hover {

			transform: translateY(-8px);

			background: rgba(255, 255, 255, 0.08);

			border-color: rgba(29, 99, 255, 0.3);

			box-shadow: 0 20px 60px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-community--region-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-community--region-icon {

			width: 70px;

			height: 70px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--region-card:hover .ccl-community--region-icon {

			transform: scale(1.1) rotate(10deg);

		}

		

		.ccl-community--region-icon i {

			font-size: 2rem;

			color: var(--white);

		}

		

		.ccl-community--region-card h3 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--white);

			margin-bottom: 12px;

			line-height: 1.3;

		}

		

		.ccl-community--region-card p {

			font-size: 1rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.75);

			margin: 0;

		}

		

		.ccl-community--mission-statement {

			background: rgba(29, 99, 255, 0.1);

			border: 2px solid rgba(29, 99, 255, 0.2);

			border-radius: 20px;

			padding: 48px;

			backdrop-filter: blur(10px);

			text-align: center;

		}

		

		.ccl-community--mission-statement p {

			font-size: 1.35rem;

			line-height: 1.9;

			color: var(--white);

			font-weight: 500;

			margin: 0;

		}

		

		.ccl-community--mission-statement strong {

			color: var(--accent-green);

			font-weight: 700;

		}

		

		/* ========================================

		   SCROLL REVEAL

		======================================== */

		

		.ccl-community--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),

						transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-community--scroll-reveal.revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Staggered animations */

		.ccl-community--scroll-reveal:nth-child(1) { transition-delay: 0.1s; }

		.ccl-community--scroll-reveal:nth-child(2) { transition-delay: 0.2s; }

		.ccl-community--scroll-reveal:nth-child(3) { transition-delay: 0.3s; }

		.ccl-community--scroll-reveal:nth-child(4) { transition-delay: 0.4s; }

		.ccl-community--scroll-reveal:nth-child(5) { transition-delay: 0.5s; }

		.ccl-community--scroll-reveal:nth-child(6) { transition-delay: 0.6s; }

		

		/* ========================================

		   RESPONSIVE DESIGN

		======================================== */

		

		@media (max-width: 1024px) {

			.ccl-community--wrapper {

				font-size: 15px;

			}

			

			.ccl-community--section {

				padding: 80px 20px;

			}

			

			.ccl-community--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-community--values-grid {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

				gap: 28px;

			}

			

			.ccl-community--program-inner {

				grid-template-columns: 1fr;

			}

			

			.ccl-community--program-card.reverse .ccl-community--program-inner {

				grid-template-columns: 1fr;

			}

			

			.ccl-community--program-visual,

			.ccl-community--program-card.reverse .ccl-community--program-visual {

				order: 1;

			}

			

			.ccl-community--program-content,

			.ccl-community--program-card.reverse .ccl-community--program-content {

				order: 2;

				padding: 36px 32px;

			}

			

			.ccl-community--program-icon-large {

				width: 100px;

				height: 100px;

			}

			

			.ccl-community--program-icon-large i {

				font-size: 3rem;

			}

			

			.ccl-community--stats {

				padding: 60px 20px;

			}

			

			.ccl-community--stats-grid {

				gap: 36px;

			}

			

			.ccl-community--leadership-intro {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-community--wrapper {

				font-size: 14px;

			}

			

			.ccl-community--section {

				padding: 60px 16px;

			}

			

			.ccl-community--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-community--section-header {

				margin-bottom: 50px;

			}

			

			.ccl-community--values-grid {

				grid-template-columns: 1fr;

				gap: 24px;

			}

			

			.ccl-community--value-card {

				padding: 32px 28px;

			}

			

			.ccl-community--program-card {

				margin-bottom: 32px;

			}

			

			.ccl-community--program-content h3 {

				font-size: 1.65rem;

			}

			

			.ccl-community--program-stats {

				flex-direction: column;

			}

			

			.ccl-community--stat-badge {

				width: 100%;

			}

			

			.ccl-community--stats {

				padding: 50px 16px;

			}

			

			.ccl-community--stats-grid {

				grid-template-columns: repeat(2, 1fr);

				gap: 32px;

			}

			

			.ccl-community--leadership-intro {

				padding: 28px;

			}

			

			.ccl-community--achievements-list {

				grid-template-columns: 1fr;

			}

			

			.ccl-community--worldwide {

				padding: 70px 20px;

			}

			

			.ccl-community--mission-statement {

				padding: 36px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-community--section {

				padding: 50px 16px;

			}

			

			.ccl-community--hero {

				padding: 60px 16px 50px;

			}

			

			.ccl-community--definition {

				padding: 20px 24px;

			}

			

			.ccl-community--value-icon {

				width: 70px;

				height: 70px;

			}

			

			.ccl-community--value-icon i {

				font-size: 1.8rem;

			}

			

			.ccl-community--program-icon-large {

				width: 85px;

				height: 85px;

			}

			

			.ccl-community--program-icon-large i {

				font-size: 2.5rem;

			}

			

			.ccl-community--program-content {

				padding: 28px 24px;

			}

			

			.ccl-community--program-content h3 {

				font-size: 1.5rem;

			}

			

			.ccl-community--stats-grid {

				grid-template-columns: 1fr;

				gap: 28px;

			}

			

			.ccl-community--section-kicker::before,

			.ccl-community--section-kicker::after {

				width: 25px;

			}

			

			.ccl-community--worldwide {

				padding: 50px 16px;

			}

			

			.ccl-community--regions-grid {

				grid-template-columns: 1fr;

				gap: 24px;

			}

			

			.ccl-community--region-icon {

				width: 60px;

				height: 60px;

			}

			

			.ccl-community--region-icon i {

				font-size: 1.6rem;

			}

			

			.ccl-community--mission-statement {

				padding: 32px 24px;

			}

		}

		.ccl-switch--wrapper {

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--light-bg: #f8fafc;

			--dark-bg: #0f172a;

			--red-warning: #ef4444;

			--red-light: #fee2e2;

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ink);

			background-color: var(--white);

			margin: 0;

			padding: 0;

			box-sizing: border-box;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;		

			box-sizing: inherit;

			margin: 0;

			padding: 0;

			scroll-behavior: smooth;			

		}

		.ccl-switch--wrapper h1, .ccl-switch--wrapper h2, .ccl-switch--wrapper h3, .ccl-switch--wrapper h4 {

			font-family: 'Inter Tight', sans-serif;

			font-weight: 800;

			line-height: 1.2;

			color: var(--ink);			

		}

		.ccl-switch--wrapper main {

			overflow-x: hidden;

		}





		.ccl-switch--wrapper p {

			line-height: 1.7;

		}

		/* Hero Section */

		.ccl-switch--hero {

			position: relative;

			background: linear-gradient(135deg, var(--cta-dark) 0%, var(--primary-blue) 100%);

			padding: 50px 24px 60px;

			overflow: hidden;

		}



		.ccl-switch--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background:

				radial-gradient(circle at 20% 50%, rgba(16, 185, 129, 0.15) 0%, transparent 50%),

				radial-gradient(circle at 80% 80%, rgba(255, 168, 38, 0.1) 0%, transparent 50%);

			animation: ccl-switch--pulse 15s ease-in-out infinite;

			z-index: 1;

		}



		@keyframes ccl-switch--pulse {

			0%, 100% { opacity: 1; transform: scale(1); }

			50% { opacity: 0.8; transform: scale(1.05); }

		}



		.ccl-switch--hero-container {

			max-width: 1200px;

			margin: 0 auto;

			position: relative;

			z-index: 2;

		}



		.ccl-switch--hero-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			background: rgba(255,255,255,0.2);

			backdrop-filter: blur(10px);

			padding: 12px 24px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--white);

			margin-bottom: 28px;

			border: 1px solid rgba(255,255,255,0.3);

		}



		.ccl-switch--hero-badge i {

			color: var(--accent-green);

			font-size: 1.1rem;

		}



		.ccl-switch--hero-content {

			max-width: 950px;

		}



		.ccl-switch--hero h1 {

			font-size: clamp(2.5rem, 6vw, 5rem);

			color: var(--white);

			margin-bottom: 32px;

			font-weight: 900;

			letter-spacing: -0.02em;

			line-height: 1.1;

		}



		.ccl-switch--hero h1 .highlight {

			background: linear-gradient(180deg, transparent 65%, rgba(16, 185, 129, 0.4) 65%);

			padding: 0 10px;

			display: inline;

		}



		.ccl-switch--hero-lead {

			font-size: clamp(1.1rem, 2.2vw, 1.4rem);

			color: rgba(255,255,255,0.95);

			line-height: 1.6;

			margin-bottom: 20px;

			font-weight: 500;

			max-width: 800px;

		}



		.ccl-switch--hero-subtext {

			font-size: clamp(1rem, 1.8vw, 1.15rem);

			color: rgba(255,255,255,0.9);

			margin-bottom: 40px;

			font-weight: 400;

		}



		.ccl-switch--hero-ctas {

			display: flex;

			gap: 16px;

			flex-wrap: wrap;

			margin-bottom: 56px;

		}



		.ccl-switch--hero-proof {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));

			gap: 32px;

			padding-top: 40px;

			border-top: 1px solid rgba(255,255,255,0.25);

			margin-top: 40px;

		}



		.ccl-switch--hero-proof-item {

			text-align: center;

		}



		.ccl-switch--hero-proof-number {

			display: block;

			font-size: clamp(2.5rem, 5vw, 3rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1;

			margin-bottom: 8px;

		}



		.ccl-switch--hero-proof-label {

			font-size: clamp(0.9rem, 1.5vw, 1rem);

			color: rgba(255,255,255,0.85);

			font-weight: 500;

		}



		/* Buttons */

		.ccl-switch--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			font-family: 'Inter', sans-serif;

			font-size: clamp(0.95rem, 1.8vw, 1.05rem);

			font-weight: 700;

			padding: 16px 32px;

			border-radius: 12px;

			text-decoration: none;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			cursor: pointer;

			border: none;

			position: relative;

			overflow: hidden;

			text-align: center;

			white-space: nowrap;

		}



		.ccl-switch--btn i {

			transition: transform 0.3s ease;

		}



		.ccl-switch--btn:hover i {

			transform: translateX(4px);

		}



		.ccl-switch--btn--primary {

			background: var(--white);

			color: var(--cta-blue);

			box-shadow: 0 4px 20px rgba(0,0,0,0.15);

		}



		.ccl-switch--btn--primary:hover {

			transform: translateY(-2px);

			box-shadow: 0 8px 30px rgba(0,0,0,0.25);

		}



		.ccl-switch--btn--secondary {

			background: transparent;

			color: var(--white);

			border: 2px solid rgba(255,255,255,0.5);

		}



		.ccl-switch--btn--secondary:hover {

			background: rgba(255,255,255,0.15);

			border-color: var(--white);

		}



		.ccl-switch--btn--cta {

			background: var(--cta-blue);

			color: var(--white);

			box-shadow: 0 4px 20px rgba(11, 92, 255, 0.3);

		}



		.ccl-switch--btn--cta:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 30px rgba(11, 92, 255, 0.4);

		}



		.ccl-switch--btn--dark {

			background: var(--dark-bg);

			color: var(--white);

		}



		.ccl-switch--btn--dark:hover {

			background: #1e293b;

			transform: translateY(-2px);

		}



		.ccl-switch--btn--submit {

			background: var(--accent-green);

			color: var(--white);

			width: 100%;

			justify-content: center;

			font-size: 1.1rem;

			padding: 20px 36px;

			box-shadow: 0 4px 20px rgba(16, 185, 129, 0.3);

		}



		.ccl-switch--btn--submit:hover {

			background: #059669;

			transform: translateY(-2px);

			box-shadow: 0 8px 30px rgba(16, 185, 129, 0.4);

		}



		/* Section Base */

		.ccl-switch--section {

			padding: 100px 24px;

		}



		.ccl-switch--section-alt {

			background: var(--light-bg);

		}



		.ccl-switch--section-dark {

			background: var(--dark-bg);

			color: var(--white);

		}



		.ccl-switch--section-dark h1,

		.ccl-switch--section-dark h2,

		.ccl-switch--section-dark h3,

		.ccl-switch--section-dark h4 {

			 color: var(--white);

		}

		.ccl-switch--section-dark p {

			 color: rgba(255, 255, 255, 0.9);

		}

		.ccl-switch--section-dark .ccl-switch--section-lead {

			color: rgba(255, 255, 255, 0.85);

		}



		.ccl-switch--container {

			max-width: 1200px;

			margin: 0 auto;

		}



		.ccl-switch--section-header {

			text-align: center;

			max-width: 900px;

			margin: 0 auto 72px;

		}



		.ccl-switch--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: var(--primary-blue);

			margin-bottom: 20px;

		}

		.ccl-switch--section-dark .ccl-switch--section-kicker {

			color: var(--accent-gold);

		}



		.ccl-switch--section-kicker::before,

		.ccl-switch--section-kicker::after {

			content: '';

			width: 32px;

			height: 2px;

			background: currentColor;

		}



		.ccl-switch--section-header h2 {

			font-size: clamp(2.2rem, 5vw, 3.5rem);

			margin-bottom: 28px;

			font-weight: 900;

			letter-spacing: -0.02em;

		}



		.ccl-switch--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.25) 60%);

			color: inherit;

			padding: 0 6px;

		}

		.ccl-switch--section-dark .ccl-switch--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(255, 168, 38, 0.4) 60%);

		}



		.ccl-switch--section-lead {

			font-size: clamp(1.1rem, 2vw, 1.3rem);

			color: var(--muted);

			line-height: 1.8;

			max-width: 800px;

			margin-left: auto;

			margin-right: auto;

		}



		/* ============================================

		   IMPROVED FORM SECTION

		   ============================================ */

		.ccl-switch--form-section {

			background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);

			position: relative;

			overflow: hidden;

		}



		.ccl-switch--form-section::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background:

				radial-gradient(circle at 20% 30%, rgba(29, 99, 255, 0.1) 0%, transparent 50%),

				radial-gradient(circle at 80% 70%, rgba(16, 185, 129, 0.08) 0%, transparent 50%);

			z-index: 1;

		}



		.ccl-switch--form-container {

			max-width: 1200px;

			margin: 0 auto;

			position: relative;

			z-index: 2;

		}



		.ccl-switch--form-header {

			text-align: center;

			margin-bottom: 64px;

		}



		.ccl-switch--form-badge {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(16, 185, 129, 0.15);

			padding: 10px 24px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--accent-green);

			margin-bottom: 24px;

			border: 1px solid rgba(16, 185, 129, 0.3);

		}



		.ccl-switch--form-header h2 {

			font-size: clamp(2.2rem, 5vw, 3.5rem);

			color: var(--white);

			margin-bottom: 20px;

			line-height: 1.2;

		}



		.ccl-switch--form-header p {

			font-size: clamp(1.1rem, 2vw, 1.25rem);

			color: rgba(255,255,255,0.85);

			line-height: 1.7;

			max-width: 800px;

			margin: 0 auto;

		}



		.ccl-switch--form-wrapper {

			display: grid;

			grid-template-columns: 1fr;

			gap: 60px;

			align-items: start;

		}

		@media (min-width: 992px) {

			.ccl-switch--form-wrapper {

				grid-template-columns: 1fr minmax(450px, 550px);

				gap: 80px;

			}

			.ccl-switch--form-card {

				 position: sticky;

				 top: 100px;

			}

		}



		.ccl-switch--form-benefits {

			display: flex;

			flex-direction: column;

			gap: 24px;

		}



		.ccl-switch--form-benefit {

			display: flex;

			align-items: flex-start;

			gap: 20px;

			padding: 28px;

			background: rgba(255,255,255,0.05);

			border: 1px solid rgba(255,255,255,0.1);

			border-radius: 16px;

			transition: all 0.3s ease;

		}



		.ccl-switch--form-benefit:hover {

			background: rgba(255,255,255,0.08);

			border-color: rgba(16, 185, 129, 0.4);

			transform: translateX(5px);

		}



		.ccl-switch--form-benefit-icon {

			width: 48px;

			height: 48px;

			border-radius: 12px;

			background: linear-gradient(135deg, var(--accent-green), #059669);

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			color: var(--white);

			font-size: 1.3rem;

			box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3);

		}



		.ccl-switch--form-benefit-text {

			flex: 1;

		}



		.ccl-switch--form-benefit-text strong {

			display: block;

			font-size: 1.2rem;

			color: var(--white);

			margin-bottom: 8px;

			font-weight: 700;

		}



		.ccl-switch--form-benefit-text span {

			font-size: 1rem;

			color: rgba(255,255,255,0.75);

			line-height: 1.6;

		}



		/* IMPROVED FORM CARD - FIXED TO LOOK INTERACTIVE */

		.ccl-switch--form-card {

			background: var(--white);

			border-radius: 24px;

			padding: 48px;

			box-shadow: 0 25px 100px rgba(0,0,0,0.25);

			border: 1px solid rgba(255,255,255,0.1);

			z-index: 2;

		}



		.ccl-switch--form-card-header {

			text-align: center;

			margin-bottom: 40px;

			padding-bottom: 32px;

			border-bottom: 2px solid var(--light-bg);

		}



		.ccl-switch--form-card h3 {

			font-size: 1.8rem;

			color: var(--ink);

			margin-bottom: 10px;

			font-weight: 800;

		}



		.ccl-switch--form-card .form-subtitle {

			font-size: 1.05rem;

			color: var(--muted);

			font-weight: 500;

		}



		/* IMPROVED FORM GROUPS */

		.ccl-switch--form-group {

			margin-bottom: 24px;

		}



		.ccl-switch--form-group label {

			display: block;

			font-size: 0.95rem;

			font-weight: 700;

			color: var(--ink);

			margin-bottom: 10px;

			letter-spacing: 0.3px;

		}



		.ccl-switch--form-group label .required {

			color: var(--red-warning);

			margin-left: 2px;

		}



		/* FIXED INPUT FIELDS - NOW LOOK INTERACTIVE */

		.ccl-switch--form-group input:not([type="submit"]),

		.ccl-switch--form-group select,

		.ccl-switch--form-group textarea {

			width: 100%;

			padding: 16px 18px;

			border: 2px solid #cbd5e1;

			border-radius: 12px;

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			color: var(--ink);

			transition: all 0.3s ease;

			background: var(--white);

			font-weight: 500;

			cursor: text;

		}



		.ccl-switch--form-group select {

			cursor: pointer;

		}



		.ccl-switch--form-group input:not([type="submit"]):hover,

		.ccl-switch--form-group select:hover,

		.ccl-switch--form-group textarea:hover {

			border-color: #94a3b8;

			box-shadow: 0 2px 8px rgba(0,0,0,0.05);

		}



		.ccl-switch--form-group input:not([type="submit"]):focus,

		.ccl-switch--form-group select:focus,

		.ccl-switch--form-group textarea:focus {

			outline: none;

			border-color: var(--primary-blue);

			background: var(--white);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}



		.ccl-switch--form-group input:not([type="submit"])::placeholder,

		.ccl-switch--form-group textarea::placeholder {

			color: #94a3b8;

			opacity: 1;

		}



		.ccl-switch--form-group select {

			appearance: none;

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");

			background-position: right 1rem center;

			background-repeat: no-repeat;

			background-size: 1.5em 1.5em;

			padding-right: 3.5rem;

		}



		.ccl-switch--form-group textarea {

			resize: vertical;

			min-height: 140px;

			line-height: 1.6;

		}



		.ccl-switch--form-row {

			display: grid;

			grid-template-columns: 1fr;

			gap: 20px;

		}

		@media (min-width: 576px) {

			.ccl-switch--form-row {

				grid-template-columns: 1fr 1fr;

			}

		}



		.ccl-switch--form-note {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			font-size: 0.9rem;

			color: var(--muted);

			margin-top: 28px;

			padding-top: 28px;

			border-top: 2px solid var(--light-bg);

		}



		.ccl-switch--form-note i {

			color: var(--accent-green);

			font-size: 1.1rem;

		}



		/* ============================================

		   IMPROVED RED FLAGS DIAGNOSTIC

		   ============================================ */

		.ccl-switch--red-flags {

			background: var(--white);

			border-radius: 24px;

			padding: 56px 48px;

			max-width: 1200px;

			margin: 0 auto;

			box-shadow: 0 20px 80px rgba(239, 68, 68, 0.12);

			border: 3px solid var(--red-light);

		}



		.ccl-switch--red-flags-header {

			text-align: center;

			margin-bottom: 56px;

		}



		.ccl-switch--red-flags-badge {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			background: rgba(239, 68, 68, 0.1);

			padding: 12px 28px;

			border-radius: 50px;

			font-size: 0.95rem;

			font-weight: 700;

			color: var(--red-warning);

			margin-bottom: 28px;

			border: 2px solid rgba(239, 68, 68, 0.2);

		}



		.ccl-switch--red-flags-badge i {

			font-size: 1.2rem;

		}



		.ccl-switch--red-flags-header h3 {

			font-size: clamp(2rem, 3.5vw, 2.8rem);

			color: var(--ink);

			margin-bottom: 20px;

			font-weight: 900;

		}



		.ccl-switch--red-flags-header p {

			font-size: clamp(1.05rem, 2vw, 1.2rem);

			color: var(--muted);

			max-width: 750px;

			margin: 0 auto;

			line-height: 1.7;

		}



		.ccl-switch--red-flags-grid {

			display: grid;

			grid-template-columns: 1fr;

			gap: 20px;

			margin-bottom: 48px;

		}

		@media (min-width: 992px) {

			 .ccl-switch--red-flags-grid {

				 grid-template-columns: repeat(2, 1fr);

				 gap: 24px;

			 }

		}



		/* IMPROVED RED FLAG ITEMS */

		.ccl-switch--red-flag-item {

			background: linear-gradient(135deg, #fafbfc 0%, var(--white) 100%);

			border: 2px solid #e2e8f0;

			border-radius: 16px;

			padding: 28px;

			display: flex;

			align-items: flex-start;

			gap: 20px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			cursor: pointer;

			position: relative;

			overflow: hidden;

		}



		.ccl-switch--red-flag-item::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			width: 6px;

			height: 100%;

			background: var(--red-warning);

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}



		.ccl-switch--red-flag-item:hover {

			transform: translateY(-4px);

			box-shadow: 0 12px 40px rgba(239, 68, 68, 0.15);

			border-color: rgba(239, 68, 68, 0.4);

		}



		.ccl-switch--red-flag-item.checked {

			border-color: var(--red-warning);

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.08) 0%, rgba(239, 68, 68, 0.02) 100%);

			box-shadow: 0 8px 32px rgba(239, 68, 68, 0.2);

		}



		.ccl-switch--red-flag-item.checked::before {

			transform: scaleY(1);

		}



		/* IMPROVED CHECKBOX */

		.ccl-switch--red-flag-checkbox {

			width: 32px;

			height: 32px;

			border: 3px solid #cbd5e1;

			border-radius: 10px;

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			background: var(--white);

			margin-top: 2px;

			position: relative;

		}



		.ccl-switch--red-flag-item.checked .ccl-switch--red-flag-checkbox {

			background: var(--red-warning);

			border-color: var(--red-warning);

			transform: scale(1.1);

		}



		.ccl-switch--red-flag-item.checked .ccl-switch--red-flag-checkbox::after {

			content: '✓';

			color: var(--white);

			font-weight: 900;

			font-size: 1.1rem;

			animation: checkmark-pop 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);

		}



		@keyframes checkmark-pop {

			0% {

				transform: scale(0) rotate(-45deg);

				opacity: 0;

			}

			50% {

				transform: scale(1.2) rotate(5deg);

			}

			100% {

				transform: scale(1) rotate(0);

				opacity: 1;

			}

		}



		.ccl-switch--red-flag-content {

			flex: 1;

		}



		.ccl-switch--red-flag-item h4 {

			font-size: 1.15rem;

			color: var(--ink);

			margin-bottom: 8px;

			font-weight: 700;

		}



		.ccl-switch--red-flag-item p {

			font-size: 0.95rem;

			color: var(--muted);

			line-height: 1.6;

		}



		/* IMPROVED RESULT BOX */

		.ccl-switch--red-flags-result {

			background: linear-gradient(135deg, #dc2626, var(--red-warning));

			border-radius: 20px;

			padding: 48px 40px;

			text-align: center;

			display: none;

			color: var(--white);

			position: relative;

			overflow: hidden;

			margin-top: 48px;

			box-shadow: 0 20px 60px rgba(239, 68, 68, 0.4);

		}



		.ccl-switch--red-flags-result::before {

			content: '⚠';

			position: absolute;

			top: -30px;

			right: -30px;

			font-size: 180px;

			opacity: 0.08;

			transform: rotate(15deg);

		}



		.ccl-switch--red-flags-result > * {

			position: relative;

			z-index: 2;

		}



		.ccl-switch--red-flags-result.show {

			display: block;

			animation: slideUp 0.5s cubic-bezier(0.4, 0, 0.2, 1);

		}



		@keyframes slideUp {

			from {

				opacity: 0;

				transform: translateY(20px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}



		.ccl-switch--red-flags-result h4 {

			font-size: clamp(1.6rem, 3vw, 2rem);

			color: var(--white);

			margin-bottom: 20px;

			font-weight: 900;

		}



		.ccl-switch--red-flags-result p {

			font-size: clamp(1.05rem, 2vw, 1.2rem);

			color: rgba(255,255,255,0.95);

			margin-bottom: 36px;

			line-height: 1.7;

			max-width: 700px;

			margin-left: auto;

			margin-right: auto;

		}



		.ccl-switch--red-flags-result .ccl-switch--btn {

			 padding: 16px 32px;

			 font-size: 1.05rem;

			 max-width: 340px;

			 margin: 0 auto;

		}



		.ccl-switch--flags-counter {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			background: rgba(255,255,255,0.2);

			padding: 10px 24px;

			border-radius: 50px;

			font-size: 0.95rem;

			font-weight: 700;

			margin-bottom: 20px;

		}



		.ccl-switch--flags-counter-number {

			background: var(--white);

			color: var(--red-warning);

			width: 32px;

			height: 32px;

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 1.1rem;

			font-weight: 900;

		}



		/* ============================================

		   REDESIGNED COMPARISON GRID

		   ============================================ */

		.ccl-switch--comparison-section {

			position: relative;

			padding: 100px 24px 120px;

			background: linear-gradient(180deg, var(--white) 0%, var(--light-bg) 100%);

		}



		.ccl-switch--comparison-grid {

			display: grid;

			grid-template-columns: 1fr;

			gap: 28px;

			max-width: 1200px;

			margin: 0 auto;

		}

		

		@media (min-width: 992px) {

			.ccl-switch--comparison-grid {

				grid-template-columns: repeat(3, 1fr);

				gap: 24px;

			}

		}

		

		@media (min-width: 768px) and (max-width: 991px) {

			.ccl-switch--comparison-grid {

				grid-template-columns: repeat(2, 1fr);

			}

		}



		/* REDESIGNED COMPARISON CARDS */

		.ccl-switch--comparison-card {

			background: var(--white);

			border: 2px solid #e2e8f0;

			border-radius: 24px;

			padding: 44px 40px;

			position: relative;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			display: flex;

			flex-direction: column;

			min-height: 540px;

			overflow: hidden;

		}



		.ccl-switch--comparison-card--typical,

		.ccl-switch--comparison-card--direct {

			opacity: 0.88;

		}



		.ccl-switch--comparison-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 20px 60px rgba(0,0,0,0.1);

		}



		/* CARTER CAPNER CARD - PREMIUM DESIGN */

		.ccl-switch--comparison-card--ccl {

			border: 3px solid var(--primary-blue);

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.03), var(--white));

			box-shadow: 0 20px 80px rgba(29, 99, 255, 0.2);

			transform: scale(1.05);

			border-radius: 28px;

			min-height: 560px;

		}



		.ccl-switch--comparison-card--ccl::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 8px;

			background: linear-gradient(90deg, var(--primary-blue), var(--accent-green));

			border-radius: 28px 28px 0 0;

		}



		.ccl-switch--comparison-card--ccl::after {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: radial-gradient(circle at 80% 20%, rgba(29, 99, 255, 0.05) 0%, transparent 50%);

			pointer-events: none;

			z-index: 1;

		}



		.ccl-switch--comparison-card--ccl > * {

			position: relative;

			z-index: 2;

		}



		.ccl-switch--comparison-card--ccl:hover {

			box-shadow: 0 30px 100px rgba(29, 99, 255, 0.25);

			transform: scale(1.08) translateY(-12px);

		}



		/* IMPROVED BADGE */

		.ccl-switch--comparison-badge {

			background: linear-gradient(135deg, var(--accent-gold), #f59e0b);

			color: var(--white);

			padding: 10px 24px;

			border-radius: 50px;

			font-size: 0.85rem;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 0.8px;

			box-shadow: 0 6px 24px rgba(255, 168, 38, 0.4);

			z-index: 10;

			white-space: nowrap;

		}



		.ccl-switch--comparison-header {

			text-align: center;

			margin-bottom: 36px;

			padding-bottom: 28px;

			border-bottom: 2px solid var(--light-bg);

			padding-top: 20px;

		}



		.ccl-switch--comparison-card--ccl .ccl-switch--comparison-header {

			padding-top: 32px;

			border-bottom-color: rgba(29, 99, 255, 0.15);

		}



		.ccl-switch--comparison-title {

			font-size: 1.6rem;

			color: var(--ink);

			margin-bottom: 10px;

			font-weight: 800;

			letter-spacing: -0.01em;

		}



		.ccl-switch--comparison-subtitle {

			font-size: 1rem;

			color: var(--muted);

			font-weight: 500;

		}



		.ccl-switch--comparison-features {

			display: flex;

			flex-direction: column;

			gap: 20px;

			flex-grow: 1;

			padding-top: 10px;

		}



		/* IMPROVED FEATURE ITEMS */

		.ccl-switch--comparison-feature {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			padding: 6px 0;

		}



		.ccl-switch--comparison-icon {

			width: 32px;

			height: 32px;

			border-radius: 10px;

			flex-shrink: 0;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-top: 2px;

			font-size: 0.9rem;

			font-weight: 900;

		}



		.ccl-switch--comparison-icon i {

			font-size: 1.05rem;

		}



		.ccl-switch--comparison-icon--yes {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(16, 185, 129, 0.08));

			color: var(--accent-green);

		}



		.ccl-switch--comparison-icon--no {

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.15), rgba(239, 68, 68, 0.08));

			color: var(--red-warning);

		}



		.ccl-switch--comparison-text {

			flex: 1;

			font-size: 1.02rem;

			line-height: 1.6;

			color: var(--ink);

		}



		.ccl-switch--comparison-text strong {

			font-weight: 700;

			color: var(--ink);

		}



		/* ============================================

		   IMPROVED PROCESS SECTION

		   ============================================ */

		.ccl-switch--detailed-process {

			max-width: 950px;

			margin: 0 auto;

			position: relative;

		}



		.ccl-switch--detailed-process::before {

			 content: '';

			 position: absolute;

			 left: 31px;

			 top: 80px;

			 bottom: 80px;

			 width: 3px;

			 background: linear-gradient(180deg, rgba(29, 99, 255, 0.3), rgba(16, 185, 129, 0.3));

			 z-index: 1;

			 display: none;

		}

		@media (min-width: 768px) {

			 .ccl-switch--detailed-process::before {

				 display: block;

			 }

		}



		/* IMPROVED PROCESS STEPS */

		.ccl-switch--detailed-step {

			display: flex;

			flex-direction: row;

			gap: 36px;

			margin-bottom: 48px;

			align-items: flex-start;

			position: relative;

			z-index: 2;

		}

		 @media (max-width: 767px) {

			 .ccl-switch--detailed-step {

				 flex-direction: column;

				 align-items: center;

				 text-align: center;

				 gap: 20px;

			 }

			 .ccl-switch--detailed-process::before {

				 display: none;

			 }

		 }



		.ccl-switch--detailed-step-number {

			width: 72px;

			height: 72px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-green));

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.3);

			margin-top: 4px;

			border: 4px solid var(--white);

		}

		 @media (max-width: 767px) {

			 .ccl-switch--detailed-step-number {

				 margin-top: 0;

				 margin-bottom: 20px;

			 }

		 }



		.ccl-switch--detailed-step-number span {

			font-size: 2.2rem;

			font-weight: 900;

			color: var(--white);

		}



		.ccl-switch--detailed-step-content {

			flex: 1;

			background: var(--white);

			border-radius: 20px;

			padding: 36px;

			box-shadow: 0 10px 40px rgba(0,0,0,0.08);

			border: 2px solid var(--soft-border);

			width: 100%;

			transition: all 0.3s ease;

		}



		.ccl-switch--detailed-step-content:hover {

			box-shadow: 0 15px 50px rgba(0,0,0,0.12);

			border-color: var(--primary-blue);

		}



		.ccl-switch--detailed-step-header {

			display: flex;

			justify-content: space-between;

			align-items: flex-start;

			margin-bottom: 20px;

			gap: 16px;

			flex-wrap: wrap;

		}

		 @media (max-width: 767px) {

			 .ccl-switch--detailed-step-header {

				 flex-direction: column;

				 align-items: center;

			 }

		 }



		.ccl-switch--detailed-step-header h3 {

			font-size: clamp(1.5rem, 3vw, 1.8rem);

			color: var(--ink);

			flex-grow: 1;

			font-weight: 800;

		}



		.ccl-switch--detailed-step-time {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 10px 20px;

			background: rgba(16, 185, 129, 0.12);

			border-radius: 50px;

			font-size: 0.95rem;

			font-weight: 700;

			color: var(--accent-green);

			flex-shrink: 0;

		}



		.ccl-switch--detailed-step-description {

			font-size: clamp(1.05rem, 1.8vw, 1.15rem);

			line-height: 1.7;

			color: var(--muted);

			margin-bottom: 32px;

		}



		.ccl-switch--detailed-step-details {

			display: flex;

			flex-direction: column;

			gap: 16px;

		}



		.ccl-switch--detail-item {

			display: flex;

			align-items: flex-start;

			gap: 14px;

			padding: 18px;

			background: var(--light-bg);

			border-radius: 12px;

			transition: all 0.3s ease;

			border: 2px solid transparent;

		}



		.ccl-switch--detail-item:hover {

			background: rgba(29, 99, 255, 0.06);

			transform: translateX(8px);

			border-color: rgba(29, 99, 255, 0.2);

		}



		.ccl-switch--detail-item > i {

			font-size: 1.3rem;

			color: var(--accent-green);

			flex-shrink: 0;

			margin-top: 3px;

			width: 24px;

			text-align: center;

		}



		.ccl-switch--detail-item > div {

			flex: 1;

		}



		.ccl-switch--detail-item strong {

			display: block;

			font-size: 1.05rem;

			color: var(--ink);

			margin-bottom: 6px;

			font-weight: 700;

		}



		.ccl-switch--detail-item span {

			font-size: 0.98rem;

			color: var(--muted);

			line-height: 1.6;

		}



		.ccl-switch--detailed-step-callout {

			margin-top: 32px;

			padding: 28px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.08), rgba(29, 99, 255, 0.04));

			border-left: 5px solid var(--primary-blue);

			border-radius: 12px;

			display: flex;

			gap: 18px;

			align-items: flex-start;

		}



		.ccl-switch--detailed-step-callout--success {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.08), rgba(16, 185, 129, 0.04));

			border-left-color: var(--accent-green);

		}



		.ccl-switch--detailed-step-callout > i {

			font-size: 1.6rem;

			color: var(--primary-blue);

			flex-shrink: 0;

			margin-top: 2px;

		}



		.ccl-switch--detailed-step-callout--success > i {

			color: var(--accent-green);

		}



		.ccl-switch--detailed-step-callout strong {

			display: block;

			font-size: 1.15rem;

			color: var(--ink);

			margin-bottom: 8px;

			font-weight: 800;

		}



		.ccl-switch--detailed-step-callout p {

			font-size: 1.02rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}



		.ccl-switch--process-cta {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.08), rgba(16, 185, 129, 0.08));

			border-radius: 24px;

			padding: 56px;

			text-align: center;

			margin-top: 72px;

			border: 2px solid rgba(29, 99, 255, 0.2);

		}



		.ccl-switch--process-cta-content h3 {

			font-size: clamp(2rem, 4vw, 2.8rem);

			color: var(--ink);

			margin-bottom: 20px;

			font-weight: 900;

		}



		.ccl-switch--process-cta-content p {

			font-size: clamp(1.05rem, 2vw, 1.2rem);

			color: var(--muted);

			margin-bottom: 36px;

			max-width: 700px;

			margin-left: auto;

			margin-right: auto;

			line-height: 1.7;

		}



		/* ============================================

		   IMPROVED REFERRER SECTION

		   ============================================ */

		.ccl-switch--section-dark {

			background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);

		}



		.ccl-switch--referrer-hero {

			text-align: center;

			max-width: 950px;

			margin: 0 auto 96px;

		}



		.ccl-switch--referrer-badge {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			background: rgba(255, 168, 38, 0.15);

			padding: 12px 28px;

			border-radius: 50px;

			font-size: 0.95rem;

			font-weight: 700;

			color: var(--accent-gold);

			margin-bottom: 32px;

			border: 2px solid rgba(255, 168, 38, 0.3);

		}



		.ccl-switch--referrer-badge i {

			font-size: 1.2rem;

		}



		.ccl-switch--referrer-title {

			font-size: clamp(2.4rem, 5vw, 3.8rem);

			color: var(--white);

			margin-bottom: 28px;

			line-height: 1.15;

			font-weight: 900;

		}



		.ccl-switch--referrer-lead {

			font-size: clamp(1.15rem, 2vw, 1.3rem);

			color: rgba(255,255,255,0.9);

			line-height: 1.7;

			max-width: 850px;

			margin: 0 auto;

		}



		.ccl-switch--referrer-subtitle {

			font-size: clamp(1.9rem, 3.5vw, 2.6rem);

			color: var(--white);

			text-align: center;

			margin-bottom: 56px;

			font-weight: 800;

		}



		/* IMPROVED REFERRER TYPE CARDS */

		.ccl-switch--referrer-types {

			margin-bottom: 96px;

		}



		.ccl-switch--referrer-types-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 28px;

		}



		.ccl-switch--referrer-type-card {

			background: rgba(255,255,255,0.06);

			backdrop-filter: blur(10px);

			border: 2px solid rgba(255,255,255,0.12);

			border-radius: 20px;

			padding: 36px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			text-align: center;

		}



		.ccl-switch--referrer-type-card:hover {

			background: rgba(255,255,255,0.1);

			border-color: rgba(255, 168, 38, 0.5);

			transform: translateY(-8px);

			box-shadow: 0 15px 50px rgba(255, 168, 38, 0.2);

		}



		.ccl-switch--referrer-type-icon {

			width: 72px;

			height: 72px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.25), rgba(255, 168, 38, 0.12));

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 2rem;

			color: var(--accent-gold);

			margin: 0 auto 24px;

			box-shadow: 0 8px 24px rgba(255, 168, 38, 0.2);

		}



		.ccl-switch--referrer-type-card h4 {

			font-size: 1.3rem;

			color: var(--white);

			margin-bottom: 12px;

			font-weight: 800;

		}



		.ccl-switch--referrer-type-card p {

			font-size: 1rem;

			color: rgba(255,255,255,0.75);

			line-height: 1.7;

		}



		/* IMPROVED WHY CCL CARDS */

		.ccl-switch--referrer-why {

			margin-bottom: 96px;

		}



		.ccl-switch--referrer-why-grid {

			display: grid;

			gap: 28px;

		}



		.ccl-switch--referrer-why-card {

			background: rgba(255,255,255,0.06);

			border: 2px solid rgba(255,255,255,0.12);

			border-radius: 20px;

			padding: 36px;

			display: flex;

			flex-direction: column;

			gap: 20px;

			align-items: center;

			text-align: center;

			transition: all 0.4s ease;

		}

		@media (min-width: 768px) {

			.ccl-switch--referrer-why-card {

				 flex-direction: row;

				 gap: 28px;

				 align-items: flex-start;

				 text-align: left;

			}

		}



		.ccl-switch--referrer-why-card:hover {

			background: rgba(255,255,255,0.1);

			border-color: rgba(29, 99, 255, 0.5);

			transform: translateX(8px);

		}



		.ccl-switch--referrer-why-number {

			font-size: 2.8rem;

			font-weight: 900;

			color: transparent;

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-green));

			-webkit-background-clip: text;

			background-clip: text;

			-webkit-text-fill-color: transparent;

			flex-shrink: 0;

			line-height: 1;

			width: 60px;

			text-align: center;

		}



		.ccl-switch--referrer-why-content h4 {

			font-size: 1.4rem;

			color: var(--white);

			margin-bottom: 12px;

			font-weight: 800;

		}



		.ccl-switch--referrer-why-content p {

			font-size: 1.05rem;

			color: rgba(255,255,255,0.8);

			line-height: 1.7;

		}



		/* Practice Areas */

		.ccl-switch--referrer-practice {

			margin-bottom: 96px;

		}



		.ccl-switch--referrer-practice-intro {

			text-align: center;

			font-size: 1.15rem;

			color: rgba(255,255,255,0.85);

			margin-bottom: 48px;

			max-width: 800px;

			margin-left: auto;

			margin-right: auto;

		}



		.ccl-switch--referrer-practice-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));

			gap: 20px;

		}



		.ccl-switch--referrer-practice-item {

			background: rgba(255,255,255,0.06);

			border: 2px solid rgba(255,255,255,0.12);

			border-radius: 12px;

			padding: 18px 24px;

			display: flex;

			align-items: center;

			gap: 14px;

			transition: all 0.3s ease;

		}



		.ccl-switch--referrer-practice-item:hover {

			background: rgba(255,255,255,0.1);

			border-color: var(--accent-green);

			transform: scale(1.05);

		}



		.ccl-switch--referrer-practice-item i {

			font-size: 1.4rem;

			color: var(--accent-green);

			flex-shrink: 0;

			width: 28px;

			text-align: center;

		}



		.ccl-switch--referrer-practice-item span {

			font-size: 1rem;

			color: var(--white);

			font-weight: 600;

		}



		/* REDESIGNED REFERRAL PROCESS */

		.ccl-switch--referrer-process {

			margin-bottom: 96px;

		}



		.ccl-switch--referrer-process-intro {

			text-align: center;

			font-size: 1.15rem;

			color: rgba(255,255,255,0.85);

			margin-bottom: 64px;

			max-width: 800px;

			margin-left: auto;

			margin-right: auto;

		}



		.ccl-switch--referrer-process-steps {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 28px;

			max-width: 1100px;

			margin: 0 auto;

		}



		.ccl-switch--referrer-process-step {

			background: rgba(255,255,255,0.06);

			border: 2px solid rgba(255,255,255,0.12);

			border-radius: 20px;

			padding: 36px 32px;

			text-align: center;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}



		.ccl-switch--referrer-process-step::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 6px;

			background: linear-gradient(90deg, var(--primary-blue), var(--accent-green));

			opacity: 0;

			transition: opacity 0.3s ease;

		}



		.ccl-switch--referrer-process-step:hover {

			background: rgba(255,255,255,0.1);

			border-color: rgba(29, 99, 255, 0.5);

			transform: translateY(-8px);

			box-shadow: 0 15px 50px rgba(29, 99, 255, 0.2);

		}



		.ccl-switch--referrer-process-step:hover::before {

			opacity: 1;

		}



		.ccl-switch--referrer-process-step-number {

			width: 72px;

			height: 72px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-green));

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 2rem;

			font-weight: 900;

			color: var(--white);

			margin: 0 auto 24px;

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.3);

		}



		.ccl-switch--referrer-process-step-content h4 {

			font-size: 1.4rem;

			color: var(--white);

			margin-bottom: 12px;

			font-weight: 800;

		}



		.ccl-switch--referrer-process-step-content p {

			font-size: 1.05rem;

			color: rgba(255,255,255,0.8);

			line-height: 1.7;

		}



		/* Referrer Testimonials - REMOVED old testimonial styles as not in use */



		/* Referrer FAQ */

		.ccl-switch--referrer-faq {

			margin-bottom: 96px;

		}



		.ccl-switch--referrer-faq-list {

			max-width: 950px;

			margin: 0 auto;

		}



		.ccl-switch--referrer-faq-item {

			background: rgba(255,255,255,0.06);

			border: 2px solid rgba(255,255,255,0.12);

			border-radius: 16px;

			margin-bottom: 16px;

			overflow: hidden;

			transition: all 0.3s ease;

		}



		.ccl-switch--referrer-faq-item.active {

			background: rgba(255,255,255,0.1);

			border-color: var(--primary-blue);

		}



		.ccl-switch--referrer-faq-q {

			display: flex;

			justify-content: space-between;

			align-items: center;

			padding: 5px 28px;

			cursor: pointer;

			user-select: none;

		}



		.ccl-switch--referrer-faq-q h4 {

			font-size: 1.15rem;

			color: var(--white);

			flex: 1;

			padding-right: 20px;

			font-weight: 700;

		}



		.ccl-switch--referrer-faq-q i {

			color: var(--accent-gold);

			font-size: 1.2rem;

			transition: transform 0.3s ease;

		}



		.ccl-switch--referrer-faq-a {

			max-height: 0;

			overflow: hidden;

			padding: 0;

			transition: max-height 0.4s ease, padding 0.4s ease;

		}



		.ccl-switch--referrer-faq-item.active .ccl-switch--referrer-faq-a {

			max-height: 500px;

			padding: 0 28px 28px;

		}



		.ccl-switch--referrer-faq-a p {

			font-size: 1.05rem;

			color: rgba(255,255,255,0.85);

			line-height: 1.8;

			padding-top: 8px;

		}



		/* Referrer CTA */

		.ccl-switch--referrer-cta {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.12), rgba(16, 185, 129, 0.12));

			border: 2px solid rgba(255,255,255,0.2);

			border-radius: 24px;

			padding: 56px;

			text-align: center;

		}



		.ccl-switch--referrer-cta h3 {

			font-size: clamp(2rem, 4vw, 2.8rem);

			color: var(--white);

			margin-bottom: 20px;

			font-weight: 900;

		}



		.ccl-switch--referrer-cta > p {

			font-size: clamp(1.05rem, 2vw, 1.2rem);

			color: rgba(255,255,255,0.9);

			margin-bottom: 36px;

			max-width: 700px;

			margin-left: auto;

			margin-right: auto;

			line-height: 1.7;

		}



		.ccl-switch--referrer-cta-buttons {

			display: flex;

			gap: 20px;

			justify-content: center;

			flex-wrap: wrap;

			margin-bottom: 32px;

		}

		@media (max-width: 576px) {

			.ccl-switch--referrer-cta-buttons {

				flex-direction: column;

				align-items: center;

			}

			 .ccl-switch--referrer-cta-buttons .ccl-switch--btn {

				 width: 100%;

				 max-width: 300px;

			 }

		}



		.ccl-switch--referrer-cta-note {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			font-size: 0.95rem;

			color: rgba(255,255,255,0.75);

		}



		.ccl-switch--referrer-cta-note i {

			color: var(--accent-green);

			font-size: 1.1rem;

		}



		/* FAQ */

		.ccl-switch--faq {

			max-width: 900px;

			margin: 0 auto;

		}



		.ccl-switch--faq-item {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			margin-bottom: 16px;

			overflow: hidden;

			transition: all 0.3s ease;

		}



		.ccl-switch--faq-item.active {

			border-color: var(--primary-blue);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.12);

		}



		.ccl-switch--faq-question {

			display: flex;

			justify-content: space-between;

			align-items: center;

			padding: 5px 32px;

			cursor: pointer;

			user-select: none;

		}



		.ccl-switch--faq-question h3 {

			font-size: 1.2rem;

			color: var(--ink);

			flex: 1;

			padding-right: 20px;

			font-weight: 700;

		}



		.ccl-switch--faq-icon {

			width: 36px;

			height: 36px;

			border-radius: 50%;

			background: var(--light-bg);

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			transition: all 0.3s ease;

			border: 2px solid var(--soft-border);

		}



		.ccl-switch--faq-icon i {

			color: var(--primary-blue);

			font-size: 1.1rem;

			transition: transform 0.3s ease;

		}



		.ccl-switch--faq-item.active .ccl-switch--faq-icon {

			background: var(--primary-blue);

			border-color: var(--primary-blue);

		}



		.ccl-switch--faq-item.active .ccl-switch--faq-icon i {

			color: var(--white);

			transform: rotate(180deg);

		}



		.ccl-switch--faq-answer {

			max-height: 0;

			overflow: hidden;

			padding: 0;

			transition: max-height 0.4s ease, padding 0.4s ease;

		}



		.ccl-switch--faq-item.active .ccl-switch--faq-answer {

			max-height: 800px;

			padding: 0 32px 32px;

		}



		.ccl-switch--faq-answer p,

		.ccl-switch--faq-answer li {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 14px;

		}



		.ccl-switch--faq-answer p:last-child,

		.ccl-switch--faq-answer li:last-child {

			margin-bottom: 0;

		}



		.ccl-switch--faq-answer ul {

			margin: 14px 0;

			padding-left: 24px;

		}

		.ccl-switch--faq-answer li {

			padding-left: 8px;

		}



		/* Scroll Reveal */

		.ccl-switch--scroll-reveal {

			opacity: 0;

			transform: translateY(30px);

			transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);

			transition-delay: 0.1s;

		}



		.ccl-switch--scroll-reveal.revealed {

			opacity: 1;

			transform: translateY(0);

		}



		/* Additional Responsive Adjustments */

		@media (max-width: 991px) {

			.ccl-switch--form-card {

				 position: static;

			}

			.ccl-switch--comparison-card {

				 min-height: unset;

			}

			.ccl-switch--comparison-card--ccl {

				transform: scale(1);

			}

		}



		@media (max-width: 767px) {

			.ccl-switch--section {

				 padding: 60px 16px;

			}

			.ccl-switch--hero {

				 padding: 80px 16px 80px;

			}

			.ccl-switch--hero-ctas {

				 flex-direction: column;

				 align-items: stretch;

			}

			.ccl-switch--hero-ctas .ccl-switch--btn {

				 width: 100%;

				 max-width: none;

			}



			.ccl-switch--red-flags {

				 padding: 36px 24px;

			}



			.ccl-switch--form-card {

				 padding: 32px 24px;

			}



			.ccl-switch--detailed-process {

				 padding: 0 10px;

			}



			.ccl-switch--faq-question {

				 padding: 22px 24px;

			}

			 .ccl-switch--faq-item.active .ccl-switch--faq-answer {

				 padding: 0 24px 24px;

			 }

			 .ccl-switch--referrer-faq-q {

				 padding: 20px 24px;

			 }

			 .ccl-switch--referrer-faq-item.active .ccl-switch--referrer-faq-a {

				 padding: 0 24px 24px;

			 }

		}



		@media (max-width: 480px) {

			.ccl-switch--hero-proof {

				 grid-template-columns: 1fr 1fr;

				 gap: 20px;

			}

			.ccl-switch--form-card {

				 padding: 28px 20px;

			}

			.ccl-switch--red-flags {

				padding: 32px 20px;

			}

			.ccl-switch--red-flags-grid {

				 gap: 16px;

			}

			.ccl-switch--red-flag-item {

				 padding: 22px;

				 gap: 14px;

			}

		}



		/* ACCESSIBILITY FIXES */

		*:focus-visible {

			outline: 3px solid var(--primary-blue);

			outline-offset: 2px;

		}



		.ccl-switch--btn:focus-visible {

			outline: 3px solid rgba(255, 255, 255, 0.8);

			outline-offset: 3px;

		}



		.ccl-switch--skip-link {

			position: absolute;

			top: -40px;

			left: 0;

			background: var(--primary-blue);

			color: white;

			padding: 12px 16px;

			text-decoration: none;

			z-index: 100;

			font-weight: 600;

		}



		.ccl-switch--skip-link:focus {

			top: 0;

		}

		/* ===================================

		   CSS VARIABLES & BASE STYLES

		   Scoped to wrapper

		=================================== */

		.ccl-refer--wrapper {

			/* Brand Colors */

			--ccl-refer-primary-blue: #1d63ff;

			--ccl-refer-cta-blue: #0b5cff;

			--ccl-refer-cta-dark: #0846c1;

			--ccl-refer-accent-green: #10b981;

			--ccl-refer-accent-gold: #ffa826;

			--ccl-refer-ink: #1e293b;

			--ccl-refer-muted: #64748b;

			--ccl-refer-soft-border: #e5e7eb;

			--ccl-refer-white: #ffffff;

			--ccl-refer-light-bg: #f8fafc;

			

			/* Typography */

			--ccl-refer-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--ccl-refer-font-display: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			

			/* Spacing */

			--ccl-refer-section-padding: 120px;

			--ccl-refer-card-padding: 48px;

			--ccl-refer-gap: 40px;

			

			/* Effects */

			--ccl-refer-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			--ccl-refer-shadow-sm: 0 4px 16px rgba(29, 99, 255, 0.1);

			--ccl-refer-shadow-md: 0 12px 32px rgba(29, 99, 255, 0.15);

			--ccl-refer-shadow-lg: 0 20px 60px rgba(29, 99, 255, 0.25);

			--ccl-refer-shadow-gold: 0 20px 60px rgba(255, 168, 38, 0.4);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--ccl-refer-font-primary);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-refer-ink);

			background-color: var(--ccl-refer-white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}

		

		.ccl-refer--wrapper * {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		/* ===================================

		   HERO SECTION - DRAMATIC REDESIGN

		=================================== */

		.ccl-refer--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 100px 24px;

			overflow: hidden;

		}

		

		@keyframes ccl-refer-glow {

			0%, 100% { transform: translate(0, 0) rotate(0deg); }

			33% { transform: translate(5%, 5%) rotate(120deg); }

			66% { transform: translate(-5%, 10%) rotate(240deg); }

		}

		

		.ccl-refer--hero-content {

			position: relative;

			z-index: 2;

			max-width: 1400px;

			margin: 0 auto;

			display: grid;

			grid-template-columns: 1fr 0.5fr;

			gap: 60px;

			align-items: center;

		}

		

		.ccl-refer--hero-left {

			text-align: left;

		}

		

		.ccl-refer--hero-right {

			display: flex;

			justify-content: center;

			align-items: center;

		}

		

		.ccl-refer--hero-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(20px);

			border: 2px solid rgba(255, 255, 255, 0.3);

			padding: 14px 32px;

			border-radius: 50px;

			font-size: 1rem;

			font-weight: 700;

			color: var(--ccl-refer-white);

			letter-spacing: 1px;

			text-transform: uppercase;

			margin-bottom: 36px;

			animation: ccl-refer-fadeInDown 0.8s ease-out, ccl-refer-float 3s ease-in-out infinite;

			box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-refer--hero-kicker i {

			font-size: 1.3rem;

			animation: ccl-refer-bounce 2s ease-in-out infinite;

		}

		

		@keyframes ccl-refer-float {

			0%, 100% { transform: translateY(0); }

			50% { transform: translateY(-10px); }

		}

		

		@keyframes ccl-refer-bounce {

			0%, 100% { transform: scale(1); }

			50% { transform: scale(1.2); }

		}

		

		.ccl-refer--hero-title {

			font-family: var(--ccl-refer-font-display);

			font-size: clamp(3rem, 7vw, 6rem);

			font-weight: 900;

			color: var(--ccl-refer-white);

			line-height: 1.05;

			margin-bottom: 32px;

			animation: ccl-refer-fadeInUp 0.8s ease-out 0.2s backwards;

			text-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);

			letter-spacing: -0.02em;

		}

		

		.ccl-refer--hero-subtitle {

			font-size: clamp(1.2rem, 2.5vw, 1.5rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.6;

			margin: 0 0 32px;

			animation: ccl-refer-fadeInUp 0.8s ease-out 0.4s backwards;

			font-weight: 500;

		}

		

		/* Hero CTA Button */

		.ccl-refer--hero-cta {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			padding: 20px 48px;

			font-family: var(--ccl-refer-font-primary);

			font-size: 1.2rem;

			font-weight: 800;

			text-decoration: none;

			border: none;

			border-radius: 14px;

			cursor: pointer;

			transition: var(--ccl-refer-transition);

			position: relative;

			overflow: hidden;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			background: linear-gradient(135deg, var(--ccl-refer-accent-gold), #ff8c00);

			color: var(--ccl-refer-white);

			box-shadow: 0 12px 40px rgba(255, 168, 38, 0.5);

			animation: ccl-refer-fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-refer--hero-cta::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-refer--hero-cta:hover::before {

			width: 400px;

			height: 400px;

		}

		

		.ccl-refer--hero-cta span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--hero-cta i {

			position: relative;

			z-index: 1;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--hero-cta:hover {

			transform: translateY(-3px);

			box-shadow: 0 16px 50px rgba(255, 168, 38, 0.6);

		}

		

		.ccl-refer--hero-cta:hover i {

			transform: translateX(5px);

		}

		

		/* ===================================

		   GIFT CARD VISUAL - ENHANCED

		=================================== */

		.ccl-refer--giftcard-container {

			display: inline-block;

			animation: ccl-refer-fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-refer--giftcard {

			position: relative;

			background: linear-gradient(145deg, #ffa826 0%, #ff8c00 50%, #ffa826 100%);

			color: var(--ccl-refer-white);

			border-radius: 28px;

			padding: 36px 40px;

			min-width: 420px;

			box-shadow: 

				0 25px 70px rgba(255, 168, 38, 0.5),

				inset 0 2px 0 rgba(255, 255, 255, 0.4),

				inset 0 -2px 0 rgba(0, 0, 0, 0.2);

			transform: rotate(2deg);

			transition: var(--ccl-refer-transition);

			border: 3px solid rgba(255, 255, 255, 0.3);

			overflow: hidden;

		}

		

		.ccl-refer--giftcard:hover {

			transform: rotate(0deg) translateY(-8px);

			box-shadow: 

				0 30px 80px rgba(255, 168, 38, 0.6),

				inset 0 2px 0 rgba(255, 255, 255, 0.4),

				inset 0 -2px 0 rgba(0, 0, 0, 0.2);

		}

		

		/* Shine effect */

		.ccl-refer--gift-shine {

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: linear-gradient(

				45deg,

				transparent 30%,

				rgba(255, 255, 255, 0.1) 50%,

				transparent 70%

			);

			animation: ccl-refer-shine 8s ease-in-out infinite;

		}

		

		@keyframes ccl-refer-shine {

			0%, 100% { transform: translateX(-100%) translateY(-100%); }

			50% { transform: translateX(100%) translateY(100%); }

		}

		

		/* Dashed border */

		.ccl-refer--giftcard::after {

			content: '';

			position: absolute;

			inset: 14px;

			border-radius: 20px;

			border: 2px dashed rgba(255, 255, 255, 0.4);

			pointer-events: none;

		}

		

		.ccl-refer--gift-top {

			display: flex;

			justify-content: space-between;

			align-items: center;

			margin-bottom: 20px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--ribbon {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			background: linear-gradient(145deg, #fffaec, #ffe9b8);

			color: #0c0c0c;

			padding: 10px 18px;

			border-radius: 999px;

			font-weight: 900;

			font-size: 0.9rem;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			box-shadow: 

				0 4px 12px rgba(0, 0, 0, 0.15),

				inset 0 1px 0 rgba(255, 255, 255, 0.8);

		}

		

		.ccl-refer--ribbon i {

			color: #ffa826;

			font-size: 1rem;

		}

		

		.ccl-refer--gift-icon {

			opacity: 0.9;

			filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));

			animation: ccl-refer-bounce 2s ease-in-out infinite;

		}

		

		.ccl-refer--gift-amount {

			font-family: var(--ccl-refer-font-display);

			font-weight: 900;

			line-height: 1;

			font-size: clamp(4rem, 8vw, 5.5rem);

			margin: 12px 0;

			text-shadow: 

				0 6px 20px rgba(0, 0, 0, 0.3),

				0 2px 4px rgba(0, 0, 0, 0.2);

			position: relative;

			z-index: 1;

			letter-spacing: -0.02em;

		}

		

		.ccl-refer--gift-subtitle {

			font-weight: 700;

			font-size: 1.1rem;

			text-transform: uppercase;

			letter-spacing: 2px;

			opacity: 0.95;

			margin-bottom: 20px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--gift-meta {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 20px;

			background: rgba(0, 0, 0, 0.15);

			padding: 16px 20px;

			border-radius: 14px;

			margin: 20px 0 16px;

			position: relative;

			z-index: 1;

			backdrop-filter: blur(10px);

		}

		

		.ccl-refer--gift-meta-item {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 4px;

			flex: 1;

		}

		

		.ccl-refer--meta-label {

			font-size: 0.8rem;

			text-transform: uppercase;

			letter-spacing: 1px;

			opacity: 0.85;

			font-weight: 600;

		}

		

		.ccl-refer--meta-value {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.8rem;

			font-weight: 900;

			text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);

		}

		

		.ccl-refer--gift-meta-divider {

			width: 2px;

			height: 40px;

			background: rgba(255, 255, 255, 0.3);

		}

		

		.ccl-refer--gift-footer {

			text-align: center;

			font-size: 0.85rem;

			opacity: 0.85;

			font-style: italic;

			position: relative;

			z-index: 1;

		}

		

		@keyframes ccl-refer-fadeInDown {

			from { opacity: 0; transform: translateY(-40px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		@keyframes ccl-refer-fadeInUp {

			from { opacity: 0; transform: translateY(40px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		@keyframes ccl-refer-pulse {

			0%, 100% { transform: scale(1); }

			50% { transform: scale(1.05); }

		}

		

		

		/* ===================================

		   SECTION HEADERS - MORE PROMINENT

		=================================== */

		.ccl-refer--section {

			padding: var(--ccl-refer-section-padding) 24px;

			position: relative;

		}

		

		.ccl-refer--section--alt {

			background: linear-gradient(180deg, var(--ccl-refer-white) 0%, var(--ccl-refer-light-bg) 100%);

		}

		

		.ccl-refer--section-header {

			text-align: center;

			max-width: 900px;

			margin: 0 auto 80px;

		}

		

		.ccl-refer--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			font-size: 1rem;

			font-weight: 800;

			color: var(--ccl-refer-white);

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 24px;

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-cta-dark));

			padding: 12px 32px;

			border-radius: 50px;

			box-shadow: var(--ccl-refer-shadow-md);

			position: relative;

		}

		

		.ccl-refer--section-kicker::before,

		.ccl-refer--section-kicker::after {

			content: '◆';

			font-size: 0.7rem;

			opacity: 0.7;

		}

		

		.ccl-refer--section-title {

			font-family: var(--ccl-refer-font-display);

			font-size: clamp(2.75rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--ccl-refer-ink);

			line-height: 1.15;

			margin-bottom: 28px;

			letter-spacing: -0.02em;

		}

		

		.ccl-refer--section-title mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.25) 60%);

			color: var(--ccl-refer-primary-blue);

			padding: 0 8px;

			position: relative;

		}

		

		.ccl-refer--section-lead {

			font-size: 1.35rem;

			color: var(--ccl-refer-muted);

			line-height: 1.8;

			font-weight: 500;

		}

		

		/* ===================================

		   HOW IT WORKS CARDS - REDESIGNED

		=================================== */

		.ccl-refer--steps-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));

			gap: 40px;

			max-width: 1300px;

			margin: 0 auto;

		}

		

		.ccl-refer--step-card {

			position: relative;

			background: var(--ccl-refer-white);

			border-radius: 32px;

			padding: 48px 36px;

			text-align: center;

			transition: var(--ccl-refer-transition);

			box-shadow: var(--ccl-refer-shadow-sm);

			overflow: hidden;

		}

		

		/* Gradient border effect */

		.ccl-refer--step-card::before {

			content: '';

			position: absolute;

			inset: 0;

			border-radius: 32px;

			padding: 3px;

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-accent-green), var(--ccl-refer-accent-gold));

			-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);

			-webkit-mask-composite: xor;

			mask-composite: exclude;

			opacity: 0;

			transition: var(--ccl-refer-transition);

		}

		

		/* Decorative corner accent */

		.ccl-refer--step-card::after {

			content: '';

			position: absolute;

			top: 0;

			right: 0;

			width: 100px;

			height: 100px;

			background: linear-gradient(135deg, transparent 50%, rgba(29, 99, 255, 0.05) 50%);

			border-radius: 0 32px 0 100%;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--step-card:hover {

			transform: translateY(-15px) scale(1.02);

			box-shadow: var(--ccl-refer-shadow-lg);

		}

		

		.ccl-refer--step-card:hover::before {

			opacity: 1;

		}

		

		.ccl-refer--step-card:hover::after {

			width: 120px;

			height: 120px;

		}

		

		.ccl-refer--step-number {

			position: relative;

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 110px;

			height: 110px;

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue) 0%, var(--ccl-refer-cta-dark) 100%);

			border-radius: 50%;

			font-family: var(--ccl-refer-font-display);

			font-size: 3.5rem;

			font-weight: 900;

			color: var(--ccl-refer-white);

			margin: 0 auto 32px;

			box-shadow: var(--ccl-refer-shadow-md);

			transition: var(--ccl-refer-transition);

			border: 5px solid var(--ccl-refer-white);

		}

		

		/* Outer ring effect */

		.ccl-refer--step-number::before {

			content: '';

			position: absolute;

			inset: -12px;

			border-radius: 50%;

			border: 2px dashed var(--ccl-refer-primary-blue);

			opacity: 0.3;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--step-card:hover .ccl-refer--step-number {

			transform: rotate(360deg) scale(1.15);

			box-shadow: var(--ccl-refer-shadow-lg);

		}

		

		.ccl-refer--step-card:hover .ccl-refer--step-number::before {

			transform: rotate(-360deg) scale(1.2);

			opacity: 0.6;

		}

		

		.ccl-refer--step-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ccl-refer-ink);

			margin-bottom: 16px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--step-desc {

			font-size: 1.1rem;

			color: var(--ccl-refer-muted);

			line-height: 1.7;

			position: relative;

			z-index: 1;

		}

		

		/* ===================================

		   BENEFITS SECTION - REDESIGNED (2 COLUMN LAYOUT)

		=================================== */

		.ccl-refer--benefits-container {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-refer--benefits-columns {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 20px;

		}

		

		.ccl-refer--benefit-item {

			display: flex;

			align-items: flex-start;

			gap: 20px;

			padding: 32px;

			background: var(--ccl-refer-white);

			border-radius: 20px;

			border-left: 5px solid transparent;

			transition: var(--ccl-refer-transition);

			box-shadow: var(--ccl-refer-shadow-sm);

		}

		

		.ccl-refer--benefit-item:hover {

			border-left-color: var(--ccl-refer-primary-blue);

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.04), rgba(16, 185, 129, 0.02));

			transform: translateX(10px);

			box-shadow: var(--ccl-refer-shadow-md);

		}

		

		.ccl-refer--benefit-icon {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 70px;

			height: 70px;

			min-width: 70px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(16, 185, 129, 0.1));

			border-radius: 16px;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--benefit-icon i {

			font-size: 2rem;

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-accent-green));

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

		}

		

		.ccl-refer--benefit-item:hover .ccl-refer--benefit-icon {

			transform: scale(1.1) rotate(5deg);

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.2), rgba(16, 185, 129, 0.2));

		}

		

		.ccl-refer--benefit-content {

			flex: 1;

		}

		

		.ccl-refer--benefit-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-refer-ink);

			margin-bottom: 8px;

		}

		

		.ccl-refer--benefit-desc {

			font-size: 1rem;

			color: var(--ccl-refer-muted);

			line-height: 1.7;

		}

		

		/* ===================================

		   WHO CAN YOU REFER SECTION - REDESIGNED (2 COLUMN LIST)

		=================================== */

		.ccl-refer--who-container {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-refer--who-columns {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 16px;

			margin-bottom: 48px;

		}

		

		.ccl-refer--who-item {

			display: flex;

			align-items: flex-start;

			gap: 20px;

			padding: 28px;

			background: var(--ccl-refer-white);

			border-radius: 16px;

			border-left: 4px solid transparent;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--who-item:hover {

			border-left-color: var(--ccl-refer-primary-blue);

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.03), rgba(16, 185, 129, 0.02));

			transform: translateX(8px);

		}

		

		.ccl-refer--who-icon {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 60px;

			height: 60px;

			min-width: 60px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(16, 185, 129, 0.1));

			border-radius: 14px;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--who-icon i {

			font-size: 1.75rem;

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-accent-green));

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

		}

		

		.ccl-refer--who-item:hover .ccl-refer--who-icon {

			transform: scale(1.05);

		}

		

		.ccl-refer--who-content {

			flex: 1;

		}

		

		.ccl-refer--who-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.2rem;

			font-weight: 800;

			color: var(--ccl-refer-ink);

			margin-bottom: 6px;

		}

		

		.ccl-refer--who-desc {

			font-size: 0.95rem;

			color: var(--ccl-refer-muted);

			line-height: 1.6;

		}

		

		.ccl-refer--who-note {

			max-width: 100%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(16, 185, 129, 0.05));

			border-left: 4px solid var(--ccl-refer-primary-blue);

			padding: 24px 28px;

			border-radius: 16px;

			display: flex;

			align-items: flex-start;

			gap: 16px;

		}

		

		.ccl-refer--who-note i {

			font-size: 1.5rem;

			color: var(--ccl-refer-primary-blue);

			flex-shrink: 0;

			margin-top: 2px;

		}

		

		.ccl-refer--who-note p {

			font-size: 1.05rem;

			color: var(--ccl-refer-ink);

			line-height: 1.7;

			margin: 0;

			font-weight: 500;

		}

		

		/* ===================================

		   WHY REFER TO CARTER CAPNER LAW - REDESIGNED (FEATURED CARDS)

		=================================== */

		.ccl-refer--why-ccl-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-refer--why-ccl-featured {

			display: grid;

			grid-template-columns: repeat(3, 1fr);

			gap: 32px;

			margin-bottom: 32px;

		}

		

		.ccl-refer--why-ccl-hero-card {

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-cta-dark));

			color: var(--ccl-refer-white);

			border-radius: 28px;

			padding: 48px 36px;

			text-align: center;

			transition: var(--ccl-refer-transition);

			box-shadow: var(--ccl-refer-shadow-lg);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-refer--why-ccl-hero-card::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

		}

		

		.ccl-refer--why-ccl-hero-card:hover {

			transform: translateY(-12px) scale(1.03);

			box-shadow: var(--ccl-refer-shadow-lg), 0 0 0 3px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-refer--why-ccl-stat {

			font-family: var(--ccl-refer-font-display);

			font-size: clamp(3.5rem, 6vw, 5rem);

			font-weight: 900;

			line-height: 1;

			margin-bottom: 16px;

			position: relative;

			text-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);

		}

		

		.ccl-refer--why-ccl-hero-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.5rem;

			font-weight: 800;

			margin-bottom: 12px;

			position: relative;

		}

		

		.ccl-refer--why-ccl-hero-desc {

			font-size: 1.05rem;

			line-height: 1.7;

			opacity: 0.95;

			position: relative;

		}

		

		.ccl-refer--why-ccl-grid {

			display: grid;

			grid-template-columns: repeat(3, 1fr);

			gap: 24px;

		}

		

		.ccl-refer--why-ccl-card {

			background: var(--ccl-refer-white);

			border-radius: 20px;

			padding: 36px 28px;

			text-align: center;

			transition: var(--ccl-refer-transition);

			box-shadow: var(--ccl-refer-shadow-sm);

			border-top: 3px solid transparent;

		}

		

		.ccl-refer--why-ccl-card:hover {

			transform: translateY(-8px);

			box-shadow: var(--ccl-refer-shadow-md);

			border-top-color: var(--ccl-refer-primary-blue);

		}

		

		.ccl-refer--why-ccl-icon {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 70px;

			height: 70px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(16, 185, 129, 0.1));

			border-radius: 50%;

			margin-bottom: 20px;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--why-ccl-icon i {

			font-size: 2rem;

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-accent-green));

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

		}

		

		.ccl-refer--why-ccl-card:hover .ccl-refer--why-ccl-icon {

			transform: scale(1.1);

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.2), rgba(16, 185, 129, 0.2));

		}

		

		.ccl-refer--why-ccl-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.25rem;

			font-weight: 800;

			color: var(--ccl-refer-ink);

			margin-bottom: 10px;

		}

		

		.ccl-refer--why-ccl-desc {

			font-size: 0.95rem;

			color: var(--ccl-refer-muted);

			line-height: 1.7;

		}

		

		/* ===================================

		   ACCORDION COMPONENTS

		=================================== */

		.ccl-refer--accordion-container {

			max-width: 1000px;

			margin: 0 auto;

			display: flex;

			flex-direction: column;

			gap: 16px;

		}

		

		.ccl-refer--accordion-item {

			background: var(--ccl-refer-white);

			border-radius: 16px;

			border: 2px solid var(--ccl-refer-soft-border);

			overflow: hidden;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--accordion-item:hover {

			border-color: var(--ccl-refer-primary-blue);

			box-shadow: var(--ccl-refer-shadow-sm);

		}

		

		.ccl-refer--accordion-header {

			width: 100%;

			display: flex;

			justify-content: space-between;

			align-items: center;

			padding: 24px 28px;

			background: none;

			border: none;

			cursor: pointer;

			transition: var(--ccl-refer-transition);

			text-align: left;

		}

		

		.ccl-refer--accordion-header:hover {

			background: var(--ccl-refer-light-bg);

		}

		

		.ccl-refer--accordion-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-refer-ink);

		}

		

		.ccl-refer--accordion-icon {

			font-size: 1.2rem;

			color: var(--ccl-refer-primary-blue);

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--accordion-item--active .ccl-refer--accordion-header {

			background: var(--ccl-refer-light-bg);

		}

		

		.ccl-refer--accordion-item--active .ccl-refer--accordion-icon {

			transform: rotate(180deg);

		}

		

		.ccl-refer--accordion-content {

			max-height: 0;

			overflow: hidden;

			transition: max-height 0.4s ease-out, padding 0.4s ease-out;

		}

		

		.ccl-refer--accordion-item--active .ccl-refer--accordion-content {

			max-height: 1000px;

			padding: 0 28px 28px;

		}

		

		.ccl-refer--accordion-content p {

			font-size: 1.05rem;

			color: var(--ccl-refer-muted);

			line-height: 1.7;

			margin-bottom: 12px;

		}

		

		.ccl-refer--accordion-content p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-refer--accordion-content ul {

			list-style: none;

			padding-left: 0;

			margin: 12px 0;

		}

		

		.ccl-refer--accordion-content li {

			position: relative;

			padding-left: 32px;

			margin-bottom: 10px;

			font-size: 1rem;

			color: var(--ccl-refer-muted);

			line-height: 1.7;

		}

		

		.ccl-refer--accordion-content li::before {

			content: '\f058';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-refer-accent-green);

			font-size: 1.1rem;

		}

		

		.ccl-refer--accordion-content strong {

			color: var(--ccl-refer-ink);

			font-weight: 700;

		}

		

		/* ===================================

		   FORM SECTION - WIZARD STYLE

		=================================== */

		.ccl-refer--wizard-progress {

			display: flex;

			align-items: center;

			justify-content: space-between;

			margin-bottom: 48px;

			padding: 0 20px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--wizard-step {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 10px;

			flex: 0 0 auto;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--wizard-step-number {

			width: 50px;

			height: 50px;

			border-radius: 50%;

			background: var(--ccl-refer-light-bg);

			border: 3px solid var(--ccl-refer-soft-border);

			display: flex;

			align-items: center;

			justify-content: center;

			font-family: var(--ccl-refer-font-display);

			font-size: 1.3rem;

			font-weight: 900;

			color: var(--ccl-refer-muted);

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--wizard-step-label {

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--ccl-refer-muted);

			text-align: center;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--wizard-step--active .ccl-refer--wizard-step-number {

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-cta-dark));

			border-color: var(--ccl-refer-primary-blue);

			color: var(--ccl-refer-white);

			box-shadow: var(--ccl-refer-shadow-md);

			transform: scale(1.1);

		}

		

		.ccl-refer--wizard-step--active .ccl-refer--wizard-step-label {

			color: var(--ccl-refer-primary-blue);

		}

		

		.ccl-refer--wizard-step--completed .ccl-refer--wizard-step-number {

			background: var(--ccl-refer-accent-green);

			border-color: var(--ccl-refer-accent-green);

			color: var(--ccl-refer-white);

		}

		

		.ccl-refer--wizard-step--completed .ccl-refer--wizard-step-number::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

		}

		

		.ccl-refer--wizard-step--completed .ccl-refer--wizard-step-label {

			color: var(--ccl-refer-accent-green);

		}

		

		.ccl-refer--wizard-line {

			flex: 1;

			height: 3px;

			background: var(--ccl-refer-soft-border);

			margin: 0 8px;

			position: relative;

			top: -20px;

		}

		

		.ccl-refer--wizard-line--completed {

			background: var(--ccl-refer-accent-green);

		}

		

		.ccl-refer--wizard-page {

			display: none;

			position: relative;

			z-index: 2;

		}

		

		.ccl-refer--wizard-page--active {

			display: block;

			animation: ccl-refer-fadeInUp 0.4s ease-out;

		}

		

		.ccl-refer--wizard-nav {

			display: flex;

			gap: 16px;

			justify-content: space-between;

			margin-top: 40px;

			padding-top: 32px;

			border-top: 2px solid var(--ccl-refer-soft-border);

			position: relative;

			z-index: 10;

		}

		

		.ccl-refer--btn--secondary {

			background: var(--ccl-refer-light-bg);

			color: var(--ccl-refer-ink);

			border: 2px solid var(--ccl-refer-soft-border);

		}

		

		.ccl-refer--btn--secondary:hover {

			background: var(--ccl-refer-white);

			border-color: var(--ccl-refer-primary-blue);

			transform: translateY(-2px);

		}

		

		.ccl-refer--review-section {

			background: var(--ccl-refer-light-bg);

			border-radius: 16px;

			padding: 24px;

			margin-bottom: 24px;

			border-left: 4px solid var(--ccl-refer-primary-blue);

			position: relative;

			z-index: 2;

		}

		

		.ccl-refer--review-heading {

			font-family: var(--ccl-refer-font-display);

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-refer-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-refer--review-content {

			display: grid;

			gap: 12px;

		}

		

		.ccl-refer--review-item {

			display: flex;

			gap: 12px;

			font-size: 1rem;

			line-height: 1.6;

		}

		

		.ccl-refer--review-label {

			font-weight: 700;

			color: var(--ccl-refer-ink);

			min-width: 140px;

		}

		

		.ccl-refer--review-value {

			color: var(--ccl-refer-muted);

			flex: 1;

		}

		.ccl-refer--form-container {

			max-width: 900px;

			margin: 0 auto;

			background: var(--ccl-refer-white);

			border-radius: 32px;

			padding: 60px;

			box-shadow: var(--ccl-refer-shadow-lg);

			position: relative;

			overflow: hidden;

		}

		

		/* Decorative background elements */

		.ccl-refer--form-container::before {

			content: '';

			position: absolute;

			top: -100px;

			right: -100px;

			width: 300px;

			height: 300px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			z-index: 0;

			pointer-events: none;

		}

		

		.ccl-refer--form-container::after {

			content: '';

			position: absolute;

			bottom: -100px;

			left: -100px;

			width: 300px;

			height: 300px;

			background: radial-gradient(circle, rgba(16, 185, 129, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			z-index: 0;

			pointer-events: none;

		}

		

		.ccl-refer--form-step {

			margin-bottom: 56px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--form-step-header {

			background: linear-gradient(135deg, var(--ccl-refer-primary-blue), var(--ccl-refer-cta-dark));

			color: var(--ccl-refer-white);

			padding: 28px 36px;

			border-radius: 20px;

			margin-bottom: 40px;

			position: relative;

			overflow: hidden;

			box-shadow: var(--ccl-refer-shadow-md);

		}

		

		.ccl-refer--form-step-header::before {

			content: '';

			position: absolute;

			top: 0;

			right: 0;

			width: 150px;

			height: 150px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			z-index: 0;

			pointer-events: none;

		}

		

		.ccl-refer--form-step-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 2rem;

			font-weight: 900;

			margin-bottom: 8px;

			position: relative;

		}

		

		.ccl-refer--form-step-subtitle {

			font-size: 1.1rem;

			opacity: 0.95;

			position: relative;

		}

		

		.ccl-refer--form-group {

			margin-bottom: 32px;

			position: relative;

			z-index: 2;

		}

		

		.ccl-refer--form-label {

			display: block;

			font-weight: 700;

			color: var(--ccl-refer-ink);

			margin-bottom: 10px;

			font-size: 1.05rem;

		}

		

		.ccl-refer--form-label--required::after {

			content: '*';

			color: #ef4444;

			margin-left: 6px;

			font-size: 1.2rem;

		}

		

		.ccl-refer--form-helper {

			display: block;

			font-size: 0.95rem;

			color: var(--ccl-refer-muted);

			margin-top: 8px;

			font-style: italic;

		}

		

		.ccl-refer--form-input,

		.ccl-refer--form-select,

		.ccl-refer--form-textarea {

			width: 100%;

			padding: 16px 20px;

			border: 2px solid var(--ccl-refer-soft-border);

			border-radius: 14px;

			font-family: var(--ccl-refer-font-primary);

			font-size: 1.05rem;

			color: var(--ccl-refer-ink);

			transition: var(--ccl-refer-transition);

			background-color: var(--ccl-refer-white);

		}

		

		.ccl-refer--form-input:focus,

		.ccl-refer--form-select:focus,

		.ccl-refer--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-refer-primary-blue);

			box-shadow: 0 0 0 5px rgba(29, 99, 255, 0.1);

			transform: translateY(-2px);

		}

		

		.ccl-refer--form-textarea {

			min-height: 140px;

			resize: vertical;

			line-height: 1.6;

		}

		

		.ccl-refer--form-row {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

			gap: 24px;

		}

		

		.ccl-refer--form-row--thirds {

			grid-template-columns: 1fr 1fr 2fr;

		}

		

		.ccl-refer--conditional-group {

			display: none;

			margin-top: 24px;

			padding: 28px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05) 0%, rgba(16, 185, 129, 0.05) 100%);

			border-radius: 16px;

			border-left: 5px solid var(--ccl-refer-primary-blue);

			box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.05);

		}

		

		.ccl-refer--conditional-group.ccl-refer--active {

			display: block;

			animation: ccl-refer-slideDown 0.4s ease-out;

		}

		

		@keyframes ccl-refer-slideDown {

			from { opacity: 0; transform: translateY(-15px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-refer--checkbox-group {

			display: flex;

			align-items: flex-start;

			gap: 14px;

			padding: 20px;

			background: var(--ccl-refer-light-bg);

			border-radius: 14px;

			border: 2px solid var(--ccl-refer-soft-border);

			transition: var(--ccl-refer-transition);

			position: relative;

			z-index: 2;

		}

		

		.ccl-refer--checkbox-group:hover {

			border-color: var(--ccl-refer-primary-blue);

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-refer--checkbox {

			width: 22px;

			height: 22px;

			min-width: 22px;

			accent-color: var(--ccl-refer-primary-blue);

			cursor: pointer;

		}

		

		.ccl-refer--checkbox-label {

			font-size: 1rem;

			color: var(--ccl-refer-muted);

			line-height: 1.6;

			cursor: pointer;

		}

		

		/* ===================================

		   BUTTONS - ENHANCED

		=================================== */

		.ccl-refer--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			padding: 18px 42px;

			font-family: var(--ccl-refer-font-primary);

			font-size: 1.15rem;

			font-weight: 800;

			text-decoration: none;

			border: none;

			border-radius: 14px;

			cursor: pointer;

			transition: var(--ccl-refer-transition);

			position: relative;

			overflow: hidden;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			z-index: 5;

		}

		

		.ccl-refer--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.4);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-refer--btn:hover::before {

			width: 400px;

			height: 400px;

		}

		

		.ccl-refer--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-refer--btn i {

			position: relative;

			z-index: 1;

			transition: var(--ccl-refer-transition);

		}

		

		.ccl-refer--btn:hover i {

			transform: translateX(5px);

		}

		

		.ccl-refer--btn--primary {

			background: linear-gradient(135deg, var(--ccl-refer-cta-blue), var(--ccl-refer-cta-dark));

			color: var(--ccl-refer-white);

			box-shadow: var(--ccl-refer-shadow-md);

		}

		

		.ccl-refer--btn--primary:hover {

			transform: translateY(-3px);

			box-shadow: var(--ccl-refer-shadow-lg);

		}

		

		.ccl-refer--btn--primary:active {

			transform: translateY(-1px);

		}

		

		.ccl-refer--btn--large {

			padding: 24px 56px;

			font-size: 1.25rem;

		}

		

		.ccl-refer--btn:disabled {

			opacity: 0.5;

			cursor: not-allowed;

			transform: none !important;

		}

		

		/* ===================================

		   SCROLL REVEAL ANIMATION

		=================================== */

		.ccl-refer--scroll-reveal {

			opacity: 0;

			transform: translateY(50px);

			transition: opacity 1s ease-out, transform 1s ease-out;

		}

		

		.ccl-refer--scroll-reveal.ccl-refer--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ===================================

		   SUCCESS MESSAGE

		=================================== */

		.ccl-refer--success-message {

			display: none;

			text-align: center;

			padding: 80px 24px;

			animation: ccl-refer-fadeInUp 0.6s ease-out;

		}

		

		.ccl-refer--success-message.ccl-refer--active {

			display: block;

		}

		

		.ccl-refer--success-icon {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 140px;

			height: 140px;

			background: linear-gradient(135deg, var(--ccl-refer-accent-green), #059669);

			border-radius: 50%;

			margin-bottom: 32px;

			box-shadow: 0 20px 60px rgba(16, 185, 129, 0.4);

			position: relative;

		}

		

		.ccl-refer--success-icon::before {

			content: '';

			position: absolute;

			inset: -15px;

			border-radius: 50%;

			border: 3px dashed var(--ccl-refer-accent-green);

			opacity: 0.3;

			animation: ccl-refer-rotate 20s linear infinite;

		}

		

		@keyframes ccl-refer-rotate {

			from { transform: rotate(0deg); }

			to { transform: rotate(360deg); }

		}

		

		.ccl-refer--success-icon i {

			font-size: 5rem;

			color: var(--ccl-refer-white);

		}

		

		.ccl-refer--success-title {

			font-family: var(--ccl-refer-font-display);

			font-size: 3rem;

			font-weight: 900;

			color: var(--ccl-refer-ink);

			margin-bottom: 20px;

		}

		

		.ccl-refer--success-text {

			font-size: 1.3rem;

			color: var(--ccl-refer-muted);

			max-width: 700px;

			margin: 0 auto;

			line-height: 1.7;

		}

		

		/* ===================================

		   RESPONSIVE DESIGN

		=================================== */

		@media (max-width: 1024px) {

			.ccl-refer--wrapper {

				--ccl-refer-section-padding: 100px;

				--ccl-refer-card-padding: 40px;

			}

			

			.ccl-refer--hero-content {

				gap: 40px;

			}

			

			.ccl-refer--steps-grid {

				grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

				gap: 32px;

			}

			

			.ccl-refer--benefits-columns {

				grid-template-columns: 1fr;

			}

			

			.ccl-refer--who-columns {

				grid-template-columns: 1fr;

			}

			

			.ccl-refer--why-ccl-featured,

			.ccl-refer--why-ccl-grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-refer--giftcard {

				min-width: 380px;

			}

			

			.ccl-refer--wizard-progress {

				padding: 0 10px;

			}

			

			.ccl-refer--wizard-step-label {

				font-size: 0.8rem;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-refer--wrapper {

				--ccl-refer-section-padding: 80px;

				--ccl-refer-card-padding: 32px;

				--ccl-refer-gap: 24px;

			}

			

			.ccl-refer--hero {

				padding: 80px 20px;

			}

			

			.ccl-refer--hero-content {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-refer--hero-left {

				text-align: center;

			}

			

			.ccl-refer--hero-cta {

				display: flex;

				width: 100%;

				max-width: 400px;

				margin: 0 auto;

			}

			

			.ccl-refer--giftcard {

				min-width: auto;

				max-width: 100%;

				padding: 28px 32px;

			}

			

			.ccl-refer--gift-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-refer--gift-meta-divider {

				width: 100%;

				height: 2px;

			}

			

			.ccl-refer--form-container {

				padding: 40px 28px;

			}

			

			.ccl-refer--form-row--thirds {

				grid-template-columns: 1fr;

			}

			

			.ccl-refer--step-card,

			.ccl-refer--benefit-item,

			.ccl-refer--who-item {

				padding: 32px 24px;

			}

			

			.ccl-refer--wizard-progress {

				gap: 8px;

			}

			

			.ccl-refer--wizard-step-label {

				display: none;

			}

			

			.ccl-refer--wizard-line {

				margin: 0 4px;

			}

			

			.ccl-refer--wizard-nav {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-refer--wizard-nav button {

				width: 100%;

			}

			

			.ccl-refer--accordion-header {

				padding: 20px;

			}

			

			.ccl-refer--accordion-title {

				font-size: 1.1rem;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-refer--wrapper {

				--ccl-refer-section-padding: 60px;

				--ccl-refer-card-padding: 24px;

			}

			

			.ccl-refer--section {

				padding: var(--ccl-refer-section-padding) 16px;

			}

			

			.ccl-refer--hero {

				padding: 60px 16px;

			}

			

			.ccl-refer--hero-content {

				gap: 32px;

			}

			

			.ccl-refer--giftcard {

				padding: 24px 24px;

				border-radius: 20px;

			}

			

			.ccl-refer--ribbon {

				font-size: 0.8rem;

				padding: 8px 14px;

			}

			

			.ccl-refer--gift-amount {

				font-size: clamp(3rem, 10vw, 4rem);

			}

			

			.ccl-refer--form-container {

				padding: 28px 20px;

				border-radius: 24px;

			}

			

			.ccl-refer--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-refer--btn {

				width: 100%;

			}

			

			.ccl-refer--section-title {

				font-size: clamp(2rem, 8vw, 2.75rem);

			}

			

			.ccl-refer--wizard-step-number {

				width: 40px;

				height: 40px;

				font-size: 1.1rem;

			}

			

			.ccl-refer--wizard-line {

				top: -15px;

			}

			

			.ccl-refer--accordion-header {

				padding: 16px;

			}

			

			.ccl-refer--accordion-item--active .ccl-refer--accordion-content {

				padding: 0 16px 20px;

			}

			

			.ccl-refer--who-item,

			.ccl-refer--benefit-item {

				flex-direction: column;

				text-align: center;

			}

			

			.ccl-refer--who-icon,

			.ccl-refer--benefit-icon {

				margin: 0 auto;

			}

		}

		/* ============================================

			TESTIMONIALS PAGE STYLES

			All styles scoped to .ccl-testimonials--wrapper

			============================================ */

		

		.ccl-testimonials--wrapper {

			/* CSS Variables */

			--ccl-testimonials-primary-blue: #1d63ff;

			--ccl-testimonials-cta-blue: #0b5cff;

			--ccl-testimonials-cta-dark: #0846c1;

			--ccl-testimonials-accent-green: #10b981;

			--ccl-testimonials-accent-gold: #ffa826;

			--ccl-testimonials-ink: #1e293b;

			--ccl-testimonials-muted: #64748b;

			--ccl-testimonials-soft-border: #e5e7eb;

			--ccl-testimonials-white: #ffffff;

			--ccl-testimonials-light-gray: #f8fafc; /* Added */

			--ccl-testimonials-error-red: #ef4444; /* Added */

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-testimonials-ink);

			

			/* Layout */

			margin: 0;

			padding: 0;

			background: var(--ccl-testimonials-white);

			overflow-x: hidden;

		}

		

		.ccl-testimonials--wrapper main {

			position: relative;

		}

		

		.ccl-testimonials--wrapper section {

			padding: 100px 24px;

		}

		

		/* ============================================

			HERO SECTION

			============================================ */

		

		.ccl-testimonials--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px;

			overflow: hidden;

		}

		

		.ccl-testimonials--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-testimonials-glow 8s ease-in-out infinite;

		}

		

		.ccl-testimonials--hero::after {

			content: '';

			position: absolute;

			bottom: -30%;

			right: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-testimonials-glow 10s ease-in-out infinite reverse;

		}

		

		@keyframes ccl-testimonials-glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, 30px) scale(1.1); }

		}

		

		.ccl-testimonials--hero-grid {

			position: relative;

			z-index: 1;

			max-width: 1400px;

			margin: 0 auto;

			display: grid;

			grid-template-columns: 1fr 0.8fr;

			gap: 60px;

			align-items: center;

		}

		

		.ccl-testimonials--hero-text {

			animation: ccl-testimonials-fadeInLeft 0.8s ease-out;

		}

		

		.ccl-testimonials--kicker {

			display: inline-block;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 2px;

			color: rgba(255, 255, 255, 0.9);

			background: rgba(255, 255, 255, 0.15);

			padding: 8px 20px;

			border-radius: 50px;

			margin-bottom: 24px;

		}

		

		.ccl-testimonials--hero h1 {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			line-height: 1.1;

			color: var(--ccl-testimonials-white);

			margin: 0 0 24px 0;

		}

		

		.ccl-testimonials--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			line-height: 1.6;

			color: rgba(255, 255, 255, 0.95);

			margin: 0;

		}

		

		/* Hero Rating Box */

		.ccl-testimonials--hero-rating-box {

			background: rgba(255, 255, 255, 0.98);

			border-radius: 24px;

			padding: 48px 40px;

			box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);

			animation: ccl-testimonials-fadeInRight 0.8s ease-out;

			position: relative;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-testimonials--hero-rating-box::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-testimonials-accent-green), var(--ccl-testimonials-primary-blue));

		}

		

		.ccl-testimonials--hero-rating-number {

			font-family: 'Inter Tight', sans-serif;

			font-size: 5rem;

			font-weight: 900;

			line-height: 1;

			color: var(--ccl-testimonials-primary-blue);

			margin: 0 0 16px 0;

		}

		

		.ccl-testimonials--hero-stars {

			font-size: 2rem;

			color: var(--ccl-testimonials-accent-gold);

			margin-bottom: 16px;

			letter-spacing: 4px;

		}

		

		.ccl-testimonials--hero-rating-meta {

			font-size: 1.1rem;

			color: var(--ccl-testimonials-muted);

			margin: 0 0 20px 0;

		}

		

		.ccl-testimonials--hero-rating-meta strong {

			color: var(--ccl-testimonials-ink);

			font-weight: 700;

		}

		

		.ccl-testimonials--hero-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 10px 20px;

			background: linear-gradient(135deg, #f0fdf4 0%, #e0f2fe 100%);

			border-radius: 50px;

			font-size: 0.95rem;

			color: var(--ccl-testimonials-ink);

			font-weight: 600;

		}

		

		.ccl-testimonials--hero-badge i {

			color: var(--ccl-testimonials-accent-green);

			font-size: 1.1rem;

		}

		

		@keyframes ccl-testimonials-fadeInLeft {

			from {

				opacity: 0;

				transform: translateX(-40px);

			}

			to {

				opacity: 1;

				transform: translateX(0);

			}

		}

		

		@keyframes ccl-testimonials-fadeInRight {

			from {

				opacity: 0;

				transform: translateX(40px);

			}

			to {

				opacity: 1;

				transform: translateX(0);

			}

		}

		

		@keyframes ccl-testimonials-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		@keyframes ccl-testimonials-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		/* ============================================

			TRANSPARENCY SECTION (REDESIGNED)

			============================================ */

		

		.ccl-testimonials--transparency-section {

			background: linear-gradient(180deg, #f8fafc 0%, var(--ccl-testimonials-white) 100%);

			padding: 100px 24px;

			position: relative;

		}

		

		.ccl-testimonials--transparency-section::before {

			content: '';

			position: absolute;

			top: 0;

			left: 50%;

			transform: translateX(-50%);

			width: 100%;

			max-width: 800px;

			height: 400px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.05) 0%, transparent 70%);

			pointer-events: none;

		}

		

		.ccl-testimonials--transparency-container {

			max-width: 1200px;

			margin: 0 auto;

			position: relative;

			z-index: 1;

		}

		

		.ccl-testimonials--transparency-header {

			text-align: center;

			max-width: 800px;

			margin: 0 auto 60px;

		}

		

		.ccl-testimonials--transparency-kicker {

			font-size: 0.9rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 2px;

			color: var(--ccl-testimonials-primary-blue);

			margin-bottom: 16px;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

		}

		

		.ccl-testimonials--transparency-kicker::before,

		.ccl-testimonials--transparency-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--ccl-testimonials-primary-blue);

		}

		

		.ccl-testimonials--transparency-header h2 {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 4vw, 4rem);

			font-weight: 900;

			line-height: 1.15;

			color: var(--ccl-testimonials-ink);

			margin: 0 0 24px 0;

		}

		

		.ccl-testimonials--transparency-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 8px;

		}

		

		.ccl-testimonials--transparency-lead {

			font-size: 1.25rem;

			line-height: 1.7;

			color: var(--ccl-testimonials-ink);

			font-weight: 600;

			margin: 0 0 20px 0;

		}

		

		.ccl-testimonials--transparency-text {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-testimonials-muted);

			margin: 0;

		}

		

		/* Transparency Cards Grid */

		.ccl-testimonials--transparency-cards {

			display: grid;

			grid-template-columns: repeat(3, 1fr);

			gap: 32px;

			margin-top: 60px;

		}

		

		.ccl-testimonials--transparency-card {

			background: var(--ccl-testimonials-white);

			border: 2px solid var(--ccl-testimonials-soft-border);

			border-radius: 20px;

			padding: 40px 32px;

			transition: all 0.4s ease;

			position: relative;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-testimonials--transparency-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 0;

			background: linear-gradient(135deg, var(--ccl-testimonials-primary-blue), var(--ccl-testimonials-accent-green));

			transition: height 0.4s ease;

		}

		

		.ccl-testimonials--transparency-card:hover {

			border-color: var(--ccl-testimonials-primary-blue);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.15);

			transform: translateY(-8px);

		}

		

		.ccl-testimonials--transparency-card:hover::before {

			height: 6px;

		}

		

		.ccl-testimonials--transparency-card-icon {

			width: 72px;

			height: 72px;

			background: linear-gradient(135deg, var(--ccl-testimonials-primary-blue), var(--ccl-testimonials-cta-blue));

			border-radius: 20px;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 2rem;

			color: var(--ccl-testimonials-white);

			margin: 0 auto 24px;

			transition: all 0.4s ease;

			box-shadow: 0 8px 20px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-testimonials--transparency-card:hover .ccl-testimonials--transparency-card-icon {

			transform: scale(1.1) rotate(-5deg);

			box-shadow: 0 12px 30px rgba(29, 99, 255, 0.35);

		}

		

		.ccl-testimonials--transparency-card-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ccl-testimonials-ink);

			margin: 0 0 16px 0;

		}

		

		.ccl-testimonials--transparency-card-text {

			font-size: 1.05rem;

			line-height: 1.6;

			color: var(--ccl-testimonials-muted);

			margin: 0;

		}

		

		/* ============================================

			SECTION HEADERS

			============================================ */

		

		.ccl-testimonials--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-testimonials--section-kicker {

			font-size: 0.9rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 2px;

			color: var(--ccl-testimonials-primary-blue);

			margin-bottom: 16px;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

		}

		

		.ccl-testimonials--section-kicker::before,

		.ccl-testimonials--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--ccl-testimonials-primary-blue);

		}

		

		.ccl-testimonials--section-header h2 {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ccl-testimonials-ink);

			margin: 0 0 24px 0;

		}

		

		.ccl-testimonials--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 8px;

		}

		

		.ccl-testimonials--section-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--ccl-testimonials-muted);

			margin: 0;

		}

		

		/* ============================================

			REVIEWS LIST & SIDEBAR LAYOUT

			============================================ */

		

		.ccl-testimonials--content-wrapper {

			display: grid;

			grid-template-columns: 1fr 400px;

			gap: 40px;

			max-width: 1400px;

			margin: 0 auto;

			align-items: start;

		}

		

		/* Reviews Column */

		.ccl-testimonials--reviews-column {

			background: var(--ccl-testimonials-white);

			border: 2px solid var(--ccl-testimonials-soft-border);

			border-radius: 24px;

			overflow: hidden;

		}

		

		.ccl-testimonials--reviews-container {

			max-height: 800px;

			overflow-y: auto;

			padding: 0;

		}

		

		/* Custom Scrollbar */

		.ccl-testimonials--reviews-container::-webkit-scrollbar {

			width: 8px;

		}

		

		.ccl-testimonials--reviews-container::-webkit-scrollbar-track {

			background: #f1f5f9;

		}

		

		.ccl-testimonials--reviews-container::-webkit-scrollbar-thumb {

			background: var(--ccl-testimonials-primary-blue);

			border-radius: 4px;

		}

		

		.ccl-testimonials--reviews-container::-webkit-scrollbar-thumb:hover {

			background: var(--ccl-testimonials-cta-dark);

		}

		

		/* Individual Review Item */

		.ccl-testimonials--review-item {

			padding: 28px 32px;

			border-bottom: 1px solid var(--ccl-testimonials-soft-border);

			transition: background-color 0.3s ease;

			position: relative;

			padding-left: 60px; /* Space for quote icon */

		}

		

		.ccl-testimonials--review-quote-icon {

			position: absolute;

			top: 28px;

			left: 24px;

			font-size: 1.5rem;

			color: var(--ccl-testimonials-soft-border);

		}

		

		.ccl-testimonials--review-item:last-child {

			border-bottom: none;

		}

		

		.ccl-testimonials--review-item:hover {

			background-color: #f8fafc;

		}

		

		.ccl-testimonials--review-item-header {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 8px;

			flex-wrap: wrap; /* Allow badge to wrap on smaller screens if needed */

		}



		.ccl-testimonials--review-name {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.15rem;

			font-weight: 800;

			color: var(--ccl-testimonials-ink);

			margin: 0;

		}

		

		.ccl-testimonials--review-badge {

			font-size: 0.8rem;

			font-weight: 600;

			color: var(--ccl-testimonials-accent-green);

			background: #f0fdf4;

			padding: 4px 8px;

			border-radius: 6px;

			display: inline-flex;

			align-items: center;

			gap: 5px;

		}



		.ccl-testimonials--review-badge i {

			font-size: 0.7rem;

		}

		

		.ccl-testimonials--review-meta {

			display: flex;

			align-items: center;

			gap: 16px;

			margin-bottom: 12px;

		}



		.ccl-testimonials--review-stars {

			font-size: 0.9rem;

			color: var(--ccl-testimonials-accent-gold);

			margin-bottom: 0;

		}

		

		.ccl-testimonials--review-date {

			font-size: 0.9rem;

			color: var(--ccl-testimonials-muted);

			font-weight: 500;

		}

		

		.ccl-testimonials--review-text {

			font-size: 1rem;

			line-height: 1.6;

			color: var(--ccl-testimonials-muted);

			margin: 0;

		}

		

		/* Sidebar */

		.ccl-testimonials--sidebar {

			position: sticky;

			top: 24px;

		}

		

		.ccl-testimonials--sidebar-card {

			background: var(--ccl-testimonials-white);

			border: 2px solid var(--ccl-testimonials-soft-border);

			border-radius: 24px;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);

		}

		

		.ccl-testimonials--sidebar-header {

			background: linear-gradient(135deg, var(--ccl-testimonials-primary-blue), var(--ccl-testimonials-cta-blue));

			color: var(--ccl-testimonials-white);

			text-align: center;

			padding: 36px 24px;

		}

		

		.ccl-testimonials--sidebar-rating {

			font-family: 'Inter Tight', sans-serif;

			font-size: 3.5rem;

			font-weight: 900;

			line-height: 1;

			margin-bottom: 12px;

		}

		

		.ccl-testimonials--sidebar-stars {

			font-size: 1.5rem;

			color: var(--ccl-testimonials-accent-gold);

			margin-bottom: 12px;

		}

		

		.ccl-testimonials--sidebar-count {

			font-size: 1rem;

			opacity: 0.95;

		}

		

		.ccl-testimonials--sidebar-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.25rem;

			font-weight: 800;

			color: var(--ccl-testimonials-ink);

			margin: 24px 24px 16px;

		}

		

		/* Rating Breakdown */

		.ccl-testimonials--rating-breakdown {

			padding: 0 24px 28px;

		}

		

		.ccl-testimonials--breakdown-item {

			display: grid;

			grid-template-columns: 60px 1fr 40px;

			align-items: center;

			gap: 12px;

			margin-bottom: 16px;

		}

		

		.ccl-testimonials--breakdown-label {

			font-size: 0.9rem;

			color: var(--ccl-testimonials-ink);

			font-weight: 600;

		}

		

		.ccl-testimonials--breakdown-bar {

			height: 6px;

			background: var(--ccl-testimonials-soft-border);

			border-radius: 3px;

			overflow: hidden;

		}

		

		.ccl-testimonials--breakdown-fill {

			height: 100%;

			background: linear-gradient(90deg, var(--ccl-testimonials-accent-green), var(--ccl-testimonials-primary-blue));

			border-radius: 3px;

			transition: width 0.6s ease;

		}

		

		.ccl-testimonials--breakdown-count {

			font-size: 0.9rem;

			color: var(--ccl-testimonials-muted);

			text-align: right;

			font-weight: 600;

		}

		

		/* ============================================

			CTA SECTION

			============================================ */

		

		.ccl-testimonials--cta-section {

			background: linear-gradient(135deg, var(--ccl-testimonials-light-gray) 0%, #f1f5f9 100%);

			padding: 100px 24px;

		}

		

		.ccl-testimonials--cta-container {

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-testimonials--cta-buttons {

			display: flex;

			justify-content: center;

			gap: 24px;

			margin-bottom: 60px;

			flex-wrap: wrap;

		}

		

		.ccl-testimonials--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			padding: 20px 32px;

			font-family: 'Inter', sans-serif;

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s ease;

			position: relative;

			overflow: hidden;

			width: auto;

			min-width: 280px;

		}

		

		.ccl-testimonials--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-testimonials--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-testimonials--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-testimonials--btn i {

			position: relative;

			z-index: 1;

			font-size: 1.5rem;

			font-family: "Font Awesome 6 Free";

			font-weight: 900; 

			font-style: normal;

		}

		

		.ccl-testimonials--btn--positive {

			background: var(--ccl-testimonials-accent-green);

			color: var(--ccl-testimonials-white);

			box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);

		}

		

		.ccl-testimonials--btn--positive:hover {

			background: #059669;

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(16, 185, 129, 0.4);

		}

		

		.ccl-testimonials--btn--negative {

			background: var(--ccl-testimonials-error-red);

			color: var(--ccl-testimonials-white);

			box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);

		}

		

		.ccl-testimonials--btn--negative:hover {

			background: #dc2626;

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(239, 68, 68, 0.4);

		}

		

		/* ============================================

			FEEDBACK FORM STYLING IMPROVEMENTS

			============================================ */

		

		.ccl-testimonials--form-container {

			background: var(--ccl-testimonials-white);

			border: 1px solid #dee2e6; 

			border-radius: 16px; 

			padding: 48px;

			box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08); 

			display: none;

			margin-top: 30px; 

			position: relative; /* Needed for pseudo-element border */

			border-top: 4px solid var(--ccl-testimonials-error-red); /* Red top border accent */

		}

		

		.ccl-testimonials--form-container.ccl-testimonials--active {

			display: block;

			animation: ccl-testimonials-slideDown 0.5s ease-out;

		}

		

		@keyframes ccl-testimonials-slideDown {

			from {

				opacity: 0;

				transform: translateY(-20px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-testimonials--form-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(1.5rem, 3vw, 1.8rem); 

			font-weight: 800;

			color: var(--ccl-testimonials-ink);

			margin: 0 0 10px 0;

			text-align: center;

			display: flex; /* Flexbox for icon alignment */

			align-items: center;

			justify-content: center;

			gap: 10px; /* Space between icon and text */

		}

		 /* Style for the icon in the title */

		.ccl-testimonials--form-title i {

			color: var(--ccl-testimonials-error-red);

			font-size: 1.5rem; /* Adjust icon size if needed */

		}

		

		.ccl-testimonials--form-subtitle {

			font-size: 1rem; 

			color: var(--ccl-testimonials-muted);

			text-align: center;

			margin: 0 auto 12px auto; /* Centered with less margin bottom */

			max-width: 500px; 

		}



		/* Note about required fields */

		.ccl-testimonials--required-note {

			font-size: 0.85rem;

			color: var(--ccl-testimonials-muted);

			text-align: center;

			margin-bottom: 32px; /* Space below the note */

		}

		.ccl-testimonials--required-note span {

			 color: var(--ccl-testimonials-error-red);

			 font-weight: bold;

		}

		

		.ccl-testimonials--form-grid {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 20px 24px; 

			margin-bottom: 24px;

		}

		

		.ccl-testimonials--form-group {

			display: flex;

			flex-direction: column;

		}

		

		.ccl-testimonials--form-group--full {

			grid-column: 1 / -1;

		}

		

		.ccl-testimonials--form-label {

			font-size: 0.9rem; 

			font-weight: 600;

			color: var(--ccl-testimonials-ink);

			margin-bottom: 6px; 

		}

		

		.ccl-testimonials--form-label--required::after {

			content: '*';

			color: var(--ccl-testimonials-error-red);

			margin-left: 4px;

		}

		

		.ccl-testimonials--form-input,

		.ccl-testimonials--form-select,

		.ccl-testimonials--form-textarea {

			padding: 12px 16px; 

			font-family: 'Inter', sans-serif;

			font-size: 0.95rem; 

			color: var(--ccl-testimonials-ink);

			background-color: var(--ccl-testimonials-light-gray); 

			border: 1px solid var(--ccl-testimonials-soft-border); 

			border-radius: 8px; 

			transition: all 0.2s ease-in-out; 

		}

		

		/* More prominent focus state */

		.ccl-testimonials--form-input:focus,

		.ccl-testimonials--form-select:focus,

		.ccl-testimonials--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-testimonials-primary-blue);

			background-color: var(--ccl-testimonials-white); /* White background on focus */

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}



		/* Style for invalid state (added in JS validation) */

		.ccl-testimonials--form-input.invalid,

		.ccl-testimonials--form-select.invalid,

		.ccl-testimonials--form-textarea.invalid {

			 border-color: var(--ccl-testimonials-error-red);

			 box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1);

		}

		.ccl-testimonials--rating-input.invalid {

			 outline: 2px solid var(--ccl-testimonials-error-red);

			 border-radius: 4px; /* Optional: adds rounded corners to the outline */

			 padding: 2px; /* Add padding so outline doesn't touch stars */

			 margin: -2px; /* Offset padding */

		}

		

		.ccl-testimonials--form-textarea {

			min-height: 120px;

			resize: vertical;

		}

		

		.ccl-testimonials--form-group--checkbox {

			grid-column: 1 / -1;

			display: flex;

			align-items: flex-start; /* Align items to the start for multi-line labels */

			gap: 10px; 

			margin-top: 8px;

			background-color: var(--ccl-testimonials-light-gray); 

			padding: 12px 16px;

			border-radius: 8px;

			border: 1px solid var(--ccl-testimonials-soft-border);

		}



		 .ccl-testimonials--form-group--checkbox input[type="checkbox"] {

			width: 16px; 

			height: 16px;

			accent-color: var(--ccl-testimonials-primary-blue);

			flex-shrink: 0; 

			margin-top: 3px; /* Align checkbox better with the first line of text */

		}

		

		.ccl-testimonials--form-group--checkbox label {

			font-size: 0.9rem; 

			color: var(--ccl-testimonials-muted);

			font-weight: 500;

			margin-bottom: 0;

			cursor: pointer; 

			line-height: 1.5; /* Improve readability if label wraps */

		}

		

		.ccl-testimonials--rating-input {

			display: flex;

			gap: 10px; 

			margin-top: 4px;

			padding: 4px 0; 

		}

		

		.ccl-testimonials--star-btn {

			background: none;

			border: none;

			font-size: 1.8rem; 

			color: #d1d5db; 

			cursor: pointer;

			transition: all 0.15s ease;

			padding: 0;

			line-height: 1; 

		}

		

		/* Subtle hover effect for inactive stars */

		.ccl-testimonials--rating-input:hover .ccl-testimonials--star-btn:not(.ccl-testimonials--active) {

			 color: #fde047; 

		}



		/* Hover effect for the specific star being hovered */

		 .ccl-testimonials--star-btn:hover {

			color: var(--ccl-testimonials-accent-gold) !important; /* Ensure hover color takes precedence */

			transform: scale(1.25); /* Slightly bigger pop */

		}

		

		/* Style for selected stars */

		.ccl-testimonials--star-btn.ccl-testimonials--active {

			color: var(--ccl-testimonials-accent-gold);

			transform: scale(1.1); /* Keep selected stars slightly larger */

		}

		

		.ccl-testimonials--form-submit {

			width: 100%;

			padding: 16px 32px; 

			font-family: 'Inter', sans-serif;

			font-size: 1.05rem; 

			font-weight: 700;

			color: var(--ccl-testimonials-white);

			background: linear-gradient(135deg, var(--ccl-testimonials-cta-blue), var(--ccl-testimonials-primary-blue)); 

			border: none;

			border-radius: 10px; 

			cursor: pointer;

			transition: all 0.25s ease-out; 

			margin-top: 24px;

			box-shadow: 0 4px 10px rgba(29, 99, 255, 0.25); 

		}

		

		.ccl-testimonials--form-submit:hover {

			transform: translateY(-3px); 

			box-shadow: 0 10px 20px rgba(29, 99, 255, 0.35); 

			 background: linear-gradient(135deg, var(--ccl-testimonials-primary-blue), var(--ccl-testimonials-cta-dark)); 

		}

		

		.ccl-testimonials--form-submit:active {

			transform: translateY(-1px); 

			 box-shadow: 0 4px 10px rgba(29, 99, 255, 0.25);

		}



		 /* Confirmation Message Styling */

		#feedback-confirmation {

			text-align: center;

			padding: 30px 20px; 

			background-color: #e0f2fe; 

			border: 1px solid #7dd3fc; 

			border-radius: 10px; 

			margin-top: 24px;

			display: none; 

		}

		#feedback-confirmation h4 {

			font-family: 'Inter Tight', sans-serif;

			color: #0c4a6e; 

			font-size: 1.4rem; 

			margin-bottom: 8px; 

		}

		#feedback-confirmation p {

			 color: #075985; 

			 font-size: 1rem; 

			 line-height: 1.6;

		}



		/* Error message style (optional, if you add JS to show errors) */

		.ccl-testimonials--error-message {

			color: var(--ccl-testimonials-error-red);

			font-size: 0.85rem;

			margin-top: 4px;

			display: none; /* Hidden by default */

		}

		

		/* ============================================

			SCROLL REVEAL ANIMATIONS

			============================================ */

		

		.ccl-testimonials--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-testimonials--scroll-reveal.ccl-testimonials--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

			RESPONSIVE DESIGN

			============================================ */

		

		@media (max-width: 1024px) {

			.ccl-testimonials--wrapper section {

				padding: 80px 20px;

			}

			

			.ccl-testimonials--hero {

				padding: 100px 20px;

			}

			

			.ccl-testimonials--hero-grid {

				gap: 48px;

			}

			

			.ccl-testimonials--hero-rating-number {

				font-size: 4.5rem;

			}

			

			.ccl-testimonials--transparency-cards {

				gap: 24px;

			}

			

			.ccl-testimonials--content-wrapper {

				grid-template-columns: 1fr 320px;

				gap: 28px;

			}

			

			.ccl-testimonials--reviews-container {

				max-height: 700px;

			}

			

			.ccl-testimonials--sidebar-rating {

				font-size: 3rem;

			}

			

			.ccl-testimonials--form-container {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-testimonials--wrapper section {

				padding: 60px 16px;

			}

			

			.ccl-testimonials--hero {

				padding: 80px 16px;

			}

			

			.ccl-testimonials--hero-grid {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-testimonials--hero-text {

				text-align: center;

			}

			

			.ccl-testimonials--hero-rating-box {

				padding: 36px 32px;

			}

			

			.ccl-testimonials--hero-rating-number {

				font-size: 4rem;

			}

			

			.ccl-testimonials--transparency-section {

				padding: 60px 16px;

			}

			

			.ccl-testimonials--transparency-cards {

				grid-template-columns: 1fr;

				gap: 24px;

			}

			

			.ccl-testimonials--transparency-card:hover {

				transform: translateY(-4px);

			}

			

			.ccl-testimonials--transparency-kicker::before,

			.ccl-testimonials--transparency-kicker::after {

				width: 24px;

			}

			

			.ccl-testimonials--section-kicker::before,

			.ccl-testimonials--section-kicker::after {

				width: 24px;

			}

			

			.ccl-testimonials--content-wrapper {

				grid-template-columns: 1fr;

				gap: 32px;

			}

			

			.ccl-testimonials--sidebar {

				position: static;

				order: -1;

			}

			

			.ccl-testimonials--reviews-container {

				max-height: 600px;

			}

			

			.ccl-testimonials--review-item {

				padding: 20px 24px;

				padding-left: 50px; /* Adjust quote icon padding */

			}

			.ccl-testimonials--review-quote-icon {

				 left: 16px;

			}

			

			.ccl-testimonials--form-grid {

				grid-template-columns: 1fr;

				gap: 16px; /* Less gap on mobile */

			}

			

			.ccl-testimonials--form-container {

				padding: 28px;

			}

			

			.ccl-testimonials--cta-buttons {

				flex-direction: column;

				align-items: stretch;

			}

			

			.ccl-testimonials--btn {

				width: 100%;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-testimonials--wrapper {

				font-size: 15px;

			}

			

			.ccl-testimonials--hero {

				padding: 60px 16px;

			}

			

			.ccl-testimonials--kicker {

				font-size: 0.8rem;

				padding: 6px 16px;

			}

			

			.ccl-testimonials--hero-rating-box {

				padding: 28px 24px;

			}

			

			.ccl-testimonials--hero-rating-number {

				font-size: 3.5rem;

			}

			

			.ccl-testimonials--hero-stars {

				font-size: 1.5rem;

			}

			

			.ccl-testimonials--transparency-card {

				padding: 32px 24px;

			}

			

			.ccl-testimonials--reviews-container {

				max-height: 500px;

			}

			

			.ccl-testimonials--review-item {

				padding: 18px 20px;

				 padding-left: 45px; /* Adjust quote icon padding */

			}

			 .ccl-testimonials--review-quote-icon {

				 left: 12px;

				 top: 18px;

				 font-size: 1.3rem;

			}

			 .ccl-testimonials--review-item-header {

				 gap: 8px; /* Less gap for badge on mobile */

			 }

			

			.ccl-testimonials--sidebar-rating {

				font-size: 2.5rem;

			}

			

			.ccl-testimonials--sidebar-header {

				padding: 28px 20px;

			}

			

			.ccl-testimonials--form-container {

				padding: 24px;

			}

			 .ccl-testimonials--form-title {

				font-size: 1.4rem;

				gap: 8px; /* Less gap for title icon */

			 }

			 .ccl-testimonials--form-title i {

				 font-size: 1.3rem;

			 }

			 .ccl-testimonials--form-subtitle {

				 font-size: 0.95rem;

				 margin-bottom: 8px;

			 }

			 .ccl-testimonials--required-note {

				 font-size: 0.8rem;

				 margin-bottom: 24px;

			 }

			

			.ccl-testimonials--btn {

				padding: 16px 24px;

				font-size: 1rem;

			}



			 .ccl-testimonials--form-group--checkbox label {

				font-size: 0.85rem; /* Slightly smaller checkbox label on mobile */

			}

			.ccl-testimonials--star-btn {

				 font-size: 1.6rem; /* Smaller stars on mobile */

			}

			 .ccl-testimonials--form-submit {

				 padding: 14px 28px;

				 font-size: 1rem;

			 }

			 #feedback-confirmation h4 {

				 font-size: 1.2rem;

			 }

			 #feedback-confirmation p {

				 font-size: 0.95rem;

			 }

		}

		/* ============================================

		   CCL VACANCIES PAGE STYLES

		   All styles scoped to .ccl-vacancies--wrapper

		============================================ */

		

		.ccl-vacancies--wrapper {

			/* CSS Variables */

			--ccl-vacancies-primary-blue: #1d63ff;

			--ccl-vacancies-cta-blue: #0b5cff;

			--ccl-vacancies-cta-dark: #0846c1;

			--ccl-vacancies-accent-green: #10b981;

			--ccl-vacancies-accent-gold: #ffa826;

			--ccl-vacancies-ink: #1e293b;

			--ccl-vacancies-muted: #64748b;

			--ccl-vacancies-soft-border: #e5e7eb;

			--ccl-vacancies-white: #ffffff;

			--ccl-vacancies-light-bg: #f8fafc;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-vacancies-muted);

			

			/* Reset */

			box-sizing: border-box;

		}

		

		.ccl-vacancies--wrapper *,

		.ccl-vacancies--wrapper *::before,

		.ccl-vacancies--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-vacancies--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		.ccl-vacancies--wrapper a {

			text-decoration: none;

			color: inherit;

		}

		

		/* ============================================

		   HERO SECTION

		============================================ */

		

		.ccl-vacancies--hero {

			position: relative;

			background: linear-gradient(135deg, var(--ccl-vacancies-primary-blue) 0%, var(--ccl-vacancies-cta-dark) 100%);

			padding: 120px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-vacancies--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-vacancies-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-vacancies-glow {

			0%, 100% { transform: translate(0, 0); }

			50% { transform: translate(10%, 10%); }

		}

		

		.ccl-vacancies--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-vacancies--hero-kicker {

			display: inline-block;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.95rem;

			font-weight: 600;

			letter-spacing: 2px;

			text-transform: uppercase;

			margin-bottom: 20px;

			padding: 8px 20px;

			background: rgba(255, 255, 255, 0.15);

			border-radius: 50px;

			backdrop-filter: blur(10px);

			animation: ccl-vacancies-fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-vacancies-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-vacancies--hero-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--ccl-vacancies-white);

			line-height: 1.1;

			margin-bottom: 24px;

			animation: ccl-vacancies-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-vacancies-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-vacancies--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			max-width: 750px;

			margin: 0 auto;

			animation: ccl-vacancies-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		/* ============================================

		   MAIN CONTENT LAYOUT (SIDEBAR + CONTENT)

		============================================ */

		

		.ccl-vacancies--main-layout {

			display: grid;

			grid-template-columns: 320px 1fr;

			gap: 48px;

			max-width: 1400px;

			margin: 0 auto;

			padding: 60px 24px;

		}

		

		/* ============================================

		   SIDEBAR FILTER - DROPDOWN STYLE

		============================================ */

		

		.ccl-vacancies--sidebar {

			position: sticky;

			top: 20px;

			height: fit-content;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.03) 0%, rgba(16, 185, 129, 0.03) 100%);

			border: 2px solid var(--ccl-vacancies-soft-border);

			border-radius: 20px;

			padding: 32px;

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);

		}

		

		.ccl-vacancies--sidebar::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 5px;

			background: linear-gradient(90deg, var(--ccl-vacancies-primary-blue) 0%, var(--ccl-vacancies-accent-green) 100%);

			border-radius: 20px 20px 0 0;

		}

		

		.ccl-vacancies--sidebar-header {

			margin-bottom: 24px;

			padding-bottom: 24px;

			border-bottom: 2px solid var(--ccl-vacancies-soft-border);

		}

		

		.ccl-vacancies--sidebar-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.6rem;

			font-weight: 800;

			color: var(--ccl-vacancies-ink);

			margin-bottom: 10px;

			display: flex;

			align-items: center;

			gap: 12px;

		}

		

		.ccl-vacancies--sidebar-title i {

			color: var(--ccl-vacancies-white);

			font-size: 1.2rem;

			background: linear-gradient(135deg, var(--ccl-vacancies-primary-blue), var(--ccl-vacancies-cta-dark));

			width: 44px;

			height: 44px;

			display: flex;

			align-items: center;

			justify-content: center;

			border-radius: 12px;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-vacancies--sidebar-subtitle {

			font-size: 0.95rem;

			color: var(--ccl-vacancies-muted);

			font-weight: 500;

		}

		

		.ccl-vacancies--filter-search {

			position: relative;

			margin-bottom: 28px;

			animation: ccl-vacancies-fadeInUp 0.5s ease-out backwards;

		}

		

		.ccl-vacancies--filter-search-input {

			width: 100%;

			padding: 12px 16px 12px 44px;

			font-size: 0.95rem;

			font-family: 'Inter', sans-serif;

			color: var(--ccl-vacancies-ink);

			background: var(--ccl-vacancies-white);

			border: 2px solid var(--ccl-vacancies-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

		}

		

		.ccl-vacancies--filter-search-input:focus {

			outline: none;

			border-color: var(--ccl-vacancies-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-vacancies--filter-search-input::placeholder {

			color: var(--ccl-vacancies-muted);

		}

		

		.ccl-vacancies--filter-search-icon {

			position: absolute;

			left: 16px;

			top: 50%;

			transform: translateY(-50%);

			color: var(--ccl-vacancies-muted);

			pointer-events: none;

		}

		

		.ccl-vacancies--filter-group {

			margin-bottom: 20px;

			animation: ccl-vacancies-fadeInUp 0.5s ease-out backwards;

		}

		

		.ccl-vacancies--filter-group:nth-child(2) { animation-delay: 0.1s; }

		.ccl-vacancies--filter-group:nth-child(3) { animation-delay: 0.2s; }

		.ccl-vacancies--filter-group:nth-child(4) { animation-delay: 0.3s; }

		

		.ccl-vacancies--filter-group:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-vacancies--filter-label {

			display: flex;

			align-items: center;

			gap: 10px;

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--ccl-vacancies-ink);

			margin-bottom: 10px;

			text-transform: uppercase;

			letter-spacing: 0.8px;

		}

		

		.ccl-vacancies--filter-label i {

			color: var(--ccl-vacancies-primary-blue);

			font-size: 1rem;

			width: 20px;

			text-align: center;

		}

		

		.ccl-vacancies--filter-select {

			width: 100%;

			padding: 12px 40px 12px 16px;

			font-size: 0.95rem;

			font-family: 'Inter', sans-serif;

			font-weight: 500;

			color: var(--ccl-vacancies-ink);

			background: var(--ccl-vacancies-white);

			border: 2px solid var(--ccl-vacancies-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

			appearance: none;

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");

			background-repeat: no-repeat;

			background-position: right 12px center;

			background-size: 20px;

			cursor: pointer;

		}

		

		.ccl-vacancies--filter-select:hover {

			border-color: var(--ccl-vacancies-primary-blue);

			background-color: rgba(29, 99, 255, 0.02);

		}

		

		.ccl-vacancies--filter-select:focus {

			outline: none;

			border-color: var(--ccl-vacancies-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-vacancies--filter-divider {

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--ccl-vacancies-soft-border), transparent);

			margin: 28px 0;

		}

		

		.ccl-vacancies--filter-reset {

			width: 100%;

			padding: 14px;

			background: var(--ccl-vacancies-white);

			border: 2px solid var(--ccl-vacancies-primary-blue);

			border-radius: 12px;

			color: var(--ccl-vacancies-primary-blue);

			font-size: 0.95rem;

			font-weight: 700;

			cursor: pointer;

			transition: all 0.3s ease;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

		}

		

		.ccl-vacancies--filter-reset i {

			font-size: 0.9rem;

			transition: transform 0.3s ease;

		}

		

		.ccl-vacancies--filter-reset:hover {

			background: var(--ccl-vacancies-primary-blue);

			color: var(--ccl-vacancies-white);

			transform: translateY(-2px);

			box-shadow: 0 6px 16px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-vacancies--filter-reset:hover i {

			transform: rotate(-180deg);

		}

		

		.ccl-vacancies--filter-reset:active {

			transform: translateY(0);

		}

		

		.ccl-vacancies--active-filters {

			margin-bottom: 20px;

			display: flex;

			flex-wrap: wrap;

			gap: 8px;

			min-height: 0;

		}

		

		.ccl-vacancies--active-filter-tag {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			padding: 6px 12px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(16, 185, 129, 0.1));

			border: 1px solid var(--ccl-vacancies-primary-blue);

			border-radius: 20px;

			font-size: 0.85rem;

			font-weight: 600;

			color: var(--ccl-vacancies-primary-blue);

		}

		

		.ccl-vacancies--active-filter-tag i {

			cursor: pointer;

			font-size: 0.75rem;

			transition: transform 0.2s ease;

		}

		

		.ccl-vacancies--active-filter-tag i:hover {

			transform: scale(1.2);

		}

		

		.ccl-vacancies--content-area {

			min-width: 0;

		}

		

		/* ============================================

		   SECTION HEADERS

		============================================ */

		

		.ccl-vacancies--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-vacancies--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			color: var(--ccl-vacancies-primary-blue);

			font-size: 0.9rem;

			font-weight: 700;

			letter-spacing: 2px;

			text-transform: uppercase;

			margin-bottom: 16px;

		}

		

		.ccl-vacancies--section-kicker::before,

		.ccl-vacancies--section-kicker::after {

			content: '';

			width: 30px;

			height: 2px;

			background: var(--ccl-vacancies-primary-blue);

		}

		

		.ccl-vacancies--section-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--ccl-vacancies-ink);

			line-height: 1.2;

			margin-bottom: 20px;

		}

		

		.ccl-vacancies--section-title mark {

			background: linear-gradient(120deg, transparent 0%, transparent 50%, rgba(29, 99, 255, 0.2) 50%, rgba(29, 99, 255, 0.2) 100%);

			background-size: 200% 100%;

			background-position: 100% 0;

			color: inherit;

			padding: 0 8px;

			animation: ccl-vacancies-highlight 1.2s ease-out 0.5s forwards;

		}

		

		@keyframes ccl-vacancies-highlight {

			to {

				background-position: 0 0;

			}

		}

		

		.ccl-vacancies--section-lead {

			font-size: 1.2rem;

			color: var(--ccl-vacancies-muted);

			line-height: 1.7;

		}

		

		/* ============================================

		   JOB LISTINGS (SEEK-STYLE LIST)

		============================================ */

		

		.ccl-vacancies--jobs-list {

			display: flex;

			flex-direction: column;

			gap: 16px;

			margin-bottom: 80px;

		}

		

		.ccl-vacancies--job-item {

			position: relative;

			background: var(--ccl-vacancies-white);

			border: 1px solid var(--ccl-vacancies-soft-border);

			border-radius: 12px;

			padding: 24px;

			transition: all 0.3s ease;

			cursor: pointer;

			display: flex;

			gap: 20px;

			align-items: flex-start;

		}

		

		.ccl-vacancies--job-item:hover {

			border-color: var(--ccl-vacancies-primary-blue);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.15);

			transform: translateX(4px);

		}

		

		.ccl-vacancies--job-icon {

			flex-shrink: 0;

			width: 60px;

			height: 60px;

			border-radius: 12px;

			background: linear-gradient(135deg, var(--ccl-vacancies-primary-blue), var(--ccl-vacancies-cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

			transition: all 0.3s ease;

		}

		

		.ccl-vacancies--job-item:hover .ccl-vacancies--job-icon {

			transform: scale(1.05);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-vacancies--job-icon i {

			font-size: 1.5rem;

			color: var(--ccl-vacancies-white);

		}

		

		.ccl-vacancies--job-content {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-vacancies--job-header {

			display: flex;

			align-items: flex-start;

			justify-content: space-between;

			gap: 16px;

			margin-bottom: 12px;

		}

		

		.ccl-vacancies--job-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.4rem;

			font-weight: 800;

			color: var(--ccl-vacancies-ink);

			line-height: 1.3;

			margin-bottom: 8px;

			transition: color 0.3s ease;

		}

		

		.ccl-vacancies--job-item:hover .ccl-vacancies--job-title {

			color: var(--ccl-vacancies-primary-blue);

		}

		

		.ccl-vacancies--job-company {

			font-size: 1rem;

			color: var(--ccl-vacancies-muted);

			font-weight: 500;

			margin-bottom: 12px;

		}

		

		.ccl-vacancies--job-meta {

			display: flex;

			align-items: center;

			flex-wrap: wrap;

			gap: 12px;

			margin-bottom: 12px;

		}

		

		.ccl-vacancies--job-badge {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			padding: 6px 12px;

			background: rgba(29, 99, 255, 0.08);

			color: var(--ccl-vacancies-primary-blue);

			font-size: 0.85rem;

			font-weight: 600;

			border-radius: 6px;

		}

		

		.ccl-vacancies--job-badge i {

			font-size: 0.75rem;

		}

		

		.ccl-vacancies--job-badge--location {

			background: rgba(16, 185, 129, 0.08);

			color: var(--ccl-vacancies-accent-green);

		}

		

		.ccl-vacancies--job-description {

			font-size: 0.95rem;

			color: var(--ccl-vacancies-muted);

			line-height: 1.6;

			margin-bottom: 16px;

			display: -webkit-box;

			-webkit-line-clamp: 2;

			-webkit-box-orient: vertical;

			overflow: hidden;

		}

		

		.ccl-vacancies--job-footer {

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 16px;

		}

		

		.ccl-vacancies--job-tags {

			display: flex;

			align-items: center;

			gap: 8px;

			flex-wrap: wrap;

		}

		

		.ccl-vacancies--job-tag {

			font-size: 0.8rem;

			color: var(--ccl-vacancies-muted);

			padding: 4px 10px;

			background: var(--ccl-vacancies-light-bg);

			border-radius: 4px;

		}

		

		.ccl-vacancies--job-action {

			flex-shrink: 0;

		}

		

		.ccl-vacancies--job-link {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			color: var(--ccl-vacancies-primary-blue);

			font-weight: 600;

			font-size: 0.95rem;

			transition: all 0.3s ease;

			padding: 8px 16px;

			border-radius: 8px;

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-vacancies--job-link i {

			transition: transform 0.3s ease;

			font-size: 0.85rem;

		}

		

		.ccl-vacancies--job-link:hover {

			background: var(--ccl-vacancies-primary-blue);

			color: var(--ccl-vacancies-white);

		}

		

		.ccl-vacancies--job-link:hover i {

			transform: translateX(3px);

		}

		

		/* ============================================

		   CAREER TILES SECTION

		============================================ */

		

		.ccl-vacancies--career-section {

			background: var(--ccl-vacancies-white);

			padding: 100px 24px;

		}

		

		.ccl-vacancies--career-container {

			max-width: 1400px;

			margin: 0 auto;

		}

		

		.ccl-vacancies--tiles-grid {

			display: grid;

			gap: 20px;

			grid-template-columns: 1fr;

		}

		

		.ccl-vacancies--tile-card {

			position: relative;

			display: block;

			background: var(--ccl-vacancies-white);

			border-radius: 12px;

			overflow: hidden;

			transition: all 0.3s ease;

			text-decoration: none;

			border: 1px solid var(--ccl-vacancies-soft-border);

			height: 250px;

		}

		

		.ccl-vacancies--tile-card:hover {

			transform: translateY(-5px);

			box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);

			border-color: var(--ccl-vacancies-primary-blue);

		}

		

		.ccl-vacancies--tile-image {

			width: 100%;

			height: 100%;

			object-fit: cover;

			transition: transform 0.4s ease;

		}

		

		.ccl-vacancies--tile-card:hover .ccl-vacancies--tile-image {

			transform: scale(1.04);

		}

		

		.ccl-vacancies--tile-overlay {

			position: absolute;

			inset: 0;

			background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, 0.7) 100%);

			display: flex;

			align-items: flex-end;

			padding: 20px;

			transition: all 0.3s ease;

		}

		

		.ccl-vacancies--tile-card:hover .ccl-vacancies--tile-overlay {

			background: linear-gradient(180deg, rgba(29, 99, 255, 0.4) 0%, rgba(29, 99, 255, 0.8) 100%);

		}

		

		.ccl-vacancies--tile-title {

			color: var(--ccl-vacancies-white);

			font-size: clamp(16px, 3vw, 20px);

			font-weight: 700;

			line-height: 1.3;

			margin: 0;

		}

		

		/* ============================================

		   NOTE SECTION

		============================================ */

		

		.ccl-vacancies--note {

			padding: 32px;

			background: rgba(255, 168, 38, 0.1);

			border-left: 4px solid var(--ccl-vacancies-accent-gold);

			border-radius: 12px;

			margin-bottom: 32px;

		}

		

		.ccl-vacancies--note-content {

			display: flex;

			align-items: flex-start;

			gap: 16px;

		}

		

		.ccl-vacancies--note-icon {

			flex-shrink: 0;

			width: 32px;

			height: 32px;

			border-radius: 50%;

			background: var(--ccl-vacancies-accent-gold);

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-vacancies-white);

			font-size: 1rem;

		}

		

		.ccl-vacancies--note-text {

			flex: 1;

			color: var(--ccl-vacancies-ink);

			font-size: 1rem;

			line-height: 1.6;

		}

		

		.ccl-vacancies--note-text strong {

			font-weight: 700;

		}

		

		/* ============================================

		   EXPRESSION OF INTEREST FORM

		============================================ */

		

		.ccl-vacancies--eoi-section {

			background: var(--ccl-vacancies-light-bg);

			padding: 100px 24px;

		}

		

		.ccl-vacancies--eoi-container {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-vacancies--eoi-header {

			text-align: center;

			margin-bottom: 48px;

		}

		

		.ccl-vacancies--eoi-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 4vw, 3rem);

			font-weight: 900;

			color: var(--ccl-vacancies-ink);

			margin-bottom: 16px;

			line-height: 1.2;

		}

		

		.ccl-vacancies--eoi-subtitle {

			font-size: 1.15rem;

			color: var(--ccl-vacancies-muted);

			margin-bottom: 24px;

		}

		

		.ccl-vacancies--eoi-contact {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			padding: 16px 24px;

			background: var(--ccl-vacancies-white);

			border-radius: 12px;

			border: 2px solid var(--ccl-vacancies-soft-border);

			display: inline-flex;

		}

		

		.ccl-vacancies--eoi-contact-avatar {

			width: 48px;

			height: 48px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--ccl-vacancies-primary-blue), var(--ccl-vacancies-accent-green));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-vacancies-white);

			font-weight: 700;

			font-size: 1.2rem;

		}

		

		.ccl-vacancies--eoi-contact-info {

			text-align: left;

		}

		

		.ccl-vacancies--eoi-contact-name {

			font-weight: 700;

			color: var(--ccl-vacancies-ink);

			font-size: 1rem;

		}

		

		.ccl-vacancies--eoi-contact-title {

			font-size: 0.9rem;

			color: var(--ccl-vacancies-muted);

		}

		

		.ccl-vacancies--eoi-form {

			background: var(--ccl-vacancies-white);

			border-radius: 20px;

			padding: 48px;

			border: 2px solid var(--ccl-vacancies-soft-border);

			box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);

		}

		

		.ccl-vacancies--form-row {

			display: grid;

			grid-template-columns: 1fr 1fr;

			gap: 24px;

			margin-bottom: 24px;

		}

		

		.ccl-vacancies--form-group {

			margin-bottom: 24px;

		}

		

		.ccl-vacancies--form-group--full {

			grid-column: 1 / -1;

		}

		

		.ccl-vacancies--form-label {

			display: block;

			font-weight: 700;

			color: var(--ccl-vacancies-ink);

			margin-bottom: 10px;

			font-size: 0.95rem;

		}

		

		.ccl-vacancies--form-label--required::after {

			content: ' *';

			color: #ef4444;

		}

		

		.ccl-vacancies--form-input,

		.ccl-vacancies--form-select,

		.ccl-vacancies--form-textarea {

			width: 100%;

			padding: 14px 16px;

			font-size: 1rem;

			font-family: 'Inter', sans-serif;

			color: var(--ccl-vacancies-ink);

			background: var(--ccl-vacancies-light-bg);

			border: 2px solid var(--ccl-vacancies-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

		}

		

		.ccl-vacancies--form-input:hover,

		.ccl-vacancies--form-select:hover,

		.ccl-vacancies--form-textarea:hover {

			border-color: var(--ccl-vacancies-primary-blue);

			background: var(--ccl-vacancies-white);

		}

		

		.ccl-vacancies--form-input:focus,

		.ccl-vacancies--form-select:focus,

		.ccl-vacancies--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-vacancies-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.15);

			background: var(--ccl-vacancies-white);

		}

		

		.ccl-vacancies--form-select {

			appearance: none;

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");

			background-repeat: no-repeat;

			background-position: right 12px center;

			background-size: 20px;

			padding-right: 40px;

			cursor: pointer;

		}

		

		.ccl-vacancies--form-textarea {

			min-height: 120px;

			resize: vertical;

		}

		

		.ccl-vacancies--form-upload {

			border: 2px dashed var(--ccl-vacancies-soft-border);

			border-radius: 12px;

			padding: 32px;

			text-align: center;

			background: var(--ccl-vacancies-light-bg);

			transition: all 0.3s ease;

			cursor: pointer;

			display: block;

		}

		

		.ccl-vacancies--form-upload:hover {

			border-color: var(--ccl-vacancies-primary-blue);

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-vacancies--form-upload-icon {

			width: 60px;

			height: 60px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--ccl-vacancies-primary-blue), var(--ccl-vacancies-cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

			margin: 0 auto 16px;

		}

		

		.ccl-vacancies--form-upload-icon i {

			font-size: 1.5rem;

			color: var(--ccl-vacancies-white);

		}

		

		.ccl-vacancies--form-upload-text {

			font-size: 1rem;

			color: var(--ccl-vacancies-ink);

			font-weight: 600;

			margin-bottom: 8px;

		}

		

		.ccl-vacancies--form-upload-hint {

			font-size: 0.9rem;

			color: var(--ccl-vacancies-muted);

		}

		

		.ccl-vacancies--form-upload input[type="file"] {

			display: none;

		}

		

		.ccl-vacancies--form-submit {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 16px 40px;

			font-family: 'Inter', sans-serif;

			font-size: 1.05rem;

			font-weight: 700;

			text-align: center;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s ease;

			border: none;

			background: linear-gradient(135deg, var(--ccl-vacancies-cta-blue), var(--ccl-vacancies-primary-blue));

			color: var(--ccl-vacancies-white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

			width: 100%;

		}

		

		.ccl-vacancies--form-submit:hover {

			background: linear-gradient(135deg, var(--ccl-vacancies-cta-dark), var(--ccl-vacancies-cta-blue));

			box-shadow: 0 6px 20px rgba(29, 99, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-vacancies--form-submit:active {

			transform: translateY(0);

		}

		

		.ccl-vacancies--form-submit:disabled {

			opacity: 0.6;

			cursor: not-allowed;

			transform: none;

		}

		

		/* ============================================

		   CONTACT SECTION

		============================================ */

		

		/* ============================================

		   BUTTONS

		============================================ */

		

		.ccl-vacancies--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 32px;

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			text-align: center;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s ease;

			border: none;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-vacancies--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s ease, height 0.6s ease;

		}

		

		.ccl-vacancies--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-vacancies--btn--primary {

			background: linear-gradient(135deg, var(--ccl-vacancies-cta-blue), var(--ccl-vacancies-primary-blue));

			color: var(--ccl-vacancies-white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-vacancies--btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-vacancies-cta-dark), var(--ccl-vacancies-cta-blue));

			box-shadow: 0 6px 20px rgba(29, 99, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-vacancies--btn--secondary {

			background: var(--ccl-vacancies-white);

			color: var(--ccl-vacancies-primary-blue);

			border: 2px solid var(--ccl-vacancies-primary-blue);

		}

		

		.ccl-vacancies--btn--secondary:hover {

			background: var(--ccl-vacancies-primary-blue);

			color: var(--ccl-vacancies-white);

			transform: translateY(-2px);

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		============================================ */

		

		.ccl-vacancies--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-vacancies--scroll-reveal.ccl-vacancies--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		============================================ */

		

		@media (min-width: 768px) {

			.ccl-vacancies--tiles-grid {

				grid-template-columns: repeat(6, 1fr);

			}

			

			.ccl-vacancies--tile-card {

				height: 280px;

			}

			

			.ccl-vacancies--tile-card:nth-child(1) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(2) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(3) { grid-column: span 6; }

			.ccl-vacancies--tile-card:nth-child(4) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(5) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(6) { grid-column: span 6; }

			.ccl-vacancies--tile-card:nth-child(7) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(8) { grid-column: span 3; }

		}

		

		@media (min-width: 1024px) {

			.ccl-vacancies--tiles-grid {

				grid-template-columns: repeat(12, 1fr);

			}

			

			.ccl-vacancies--tile-card {

				height: 320px;

			}

			

			.ccl-vacancies--tile-card:nth-child(1) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(2) { grid-column: span 6; }

			.ccl-vacancies--tile-card:nth-child(3) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(4) { grid-column: span 5; }

			.ccl-vacancies--tile-card:nth-child(5) { grid-column: span 4; }

			.ccl-vacancies--tile-card:nth-child(6) { grid-column: span 3; }

			.ccl-vacancies--tile-card:nth-child(7) { grid-column: span 4; }

			.ccl-vacancies--tile-card:nth-child(8) { grid-column: span 8; }

		}

		

		@media (max-width: 1024px) {

			.ccl-vacancies--wrapper {

				font-size: 15px;

			}

			

			.ccl-vacancies--hero {

				padding: 100px 24px 80px;

			}

			

			.ccl-vacancies--main-layout {

				grid-template-columns: 1fr;

				padding: 50px 24px;

			}

			

			.ccl-vacancies--sidebar {

				position: static;

				margin-bottom: 40px;

			}

			

			.ccl-vacancies--jobs-list {

				gap: 14px;

			}

			

			.ccl-vacancies--job-item {

				padding: 20px;

			}

			

			.ccl-vacancies--form-row {

				grid-template-columns: 1fr;

				gap: 0;

			}

			

			.ccl-vacancies--eoi-section {

				padding: 80px 24px;

			}

			

			.ccl-vacancies--eoi-form {

				padding: 36px 28px;

			}

			

			.ccl-vacancies--eoi-contact {

				padding: 14px 20px;

				gap: 10px;

			}

			

			.ccl-vacancies--eoi-contact-avatar {

				width: 42px;

				height: 42px;

				font-size: 1.1rem;

			}

			

			.ccl-vacancies--eoi-title {

				font-size: clamp(1.75rem, 4vw, 2.5rem);

			}

			

			.ccl-vacancies--eoi-subtitle {

				font-size: 1.05rem;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-vacancies--wrapper {

				font-size: 14px;

			}

			

			.ccl-vacancies--hero {

				padding: 80px 20px 60px;

			}

			

			.ccl-vacancies--main-layout {

				padding: 40px 20px;

			}

			

			.ccl-vacancies--jobs-list {

				gap: 12px;

			}

			

			.ccl-vacancies--job-item {

				padding: 16px;

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-vacancies--job-icon {

				width: 50px;

				height: 50px;

			}

			

			.ccl-vacancies--job-icon i {

				font-size: 1.25rem;

			}

			

			.ccl-vacancies--job-header {

				flex-direction: column;

			}

			

			.ccl-vacancies--job-footer {

				flex-direction: column;

				align-items: flex-start;

			}

			

			.ccl-vacancies--job-action {

				width: 100%;

			}

			

			.ccl-vacancies--job-link {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-vacancies--career-section,

			.ccl-vacancies--eoi-section {

				padding: 60px 20px;

			}

			

			.ccl-vacancies--eoi-header {

				margin-bottom: 36px;

			}

			

			.ccl-vacancies--eoi-title {

				font-size: clamp(1.5rem, 5vw, 2rem);

				margin-bottom: 14px;

			}

			

			.ccl-vacancies--eoi-subtitle {

				font-size: 1rem;

				margin-bottom: 20px;

			}

			

			.ccl-vacancies--eoi-contact {

				padding: 12px 16px;

				gap: 10px;

			}

			

			.ccl-vacancies--eoi-contact-avatar {

				width: 40px;

				height: 40px;

				font-size: 1rem;

			}

			

			.ccl-vacancies--eoi-contact-name {

				font-size: 0.95rem;

			}

			

			.ccl-vacancies--eoi-contact-title {

				font-size: 0.85rem;

			}

			

			.ccl-vacancies--eoi-form {

				padding: 28px 20px;

				border-radius: 16px;

			}

			

			.ccl-vacancies--form-group {

				margin-bottom: 20px;

			}

			

			.ccl-vacancies--form-row {

				margin-bottom: 0;

			}

			

			.ccl-vacancies--form-label {

				font-size: 0.9rem;

				margin-bottom: 8px;

			}

			

			.ccl-vacancies--form-input,

			.ccl-vacancies--form-select,

			.ccl-vacancies--form-textarea {

				padding: 12px 14px;

				font-size: 16px; /* Prevents zoom on iOS */

			}

			

			.ccl-vacancies--form-select {

				background-position: right 10px center;

				padding-right: 36px;

			}

			

			.ccl-vacancies--form-textarea {

				min-height: 100px;

			}

			

			.ccl-vacancies--form-upload {

				padding: 24px 16px;

			}

			

			.ccl-vacancies--form-upload-icon {

				width: 50px;

				height: 50px;

				margin-bottom: 12px;

			}

			

			.ccl-vacancies--form-upload-icon i {

				font-size: 1.25rem;

			}

			

			.ccl-vacancies--form-upload-text {

				font-size: 0.95rem;

			}

			

			.ccl-vacancies--form-upload-hint {

				font-size: 0.85rem;

			}

			

			.ccl-vacancies--form-submit {

				padding: 14px 32px;

				font-size: 1rem;

			}

			

			.ccl-vacancies--note {

				padding: 24px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-vacancies--hero {

				padding: 60px 16px 50px;

			}

			

			.ccl-vacancies--main-layout {

				padding: 32px 16px;

			}

			

			.ccl-vacancies--hero-kicker {

				font-size: 0.85rem;

				padding: 6px 16px;

			}

			

			.ccl-vacancies--section-kicker::before,

			.ccl-vacancies--section-kicker::after {

				width: 20px;

			}

			

			.ccl-vacancies--job-item {

				padding: 14px;

			}

			

			.ccl-vacancies--job-title {

				font-size: 1.15rem;

			}

			

			.ccl-vacancies--job-icon {

				width: 45px;

				height: 45px;

			}

			

			.ccl-vacancies--job-icon i {

				font-size: 1.1rem;

			}

			

			.ccl-vacancies--career-section,

			.ccl-vacancies--eoi-section {

				padding: 50px 16px;

			}

			

			.ccl-vacancies--eoi-header {

				margin-bottom: 28px;

			}

			

			.ccl-vacancies--eoi-title {

				font-size: clamp(1.35rem, 5vw, 1.75rem);

				line-height: 1.25;

				margin-bottom: 12px;

			}

			

			.ccl-vacancies--eoi-subtitle {

				font-size: 0.95rem;

				margin-bottom: 18px;

			}

			

			.ccl-vacancies--eoi-contact {

				padding: 10px 14px;

				gap: 8px;

				flex-direction: column;

				text-align: center;

			}

			

			.ccl-vacancies--eoi-contact-avatar {

				width: 36px;

				height: 36px;

				font-size: 0.95rem;

			}

			

			.ccl-vacancies--eoi-contact-info {

				text-align: center;

			}

			

			.ccl-vacancies--eoi-contact-name {

				font-size: 0.9rem;

			}

			

			.ccl-vacancies--eoi-contact-title {

				font-size: 0.8rem;

			}

			

			.ccl-vacancies--eoi-form {

				padding: 24px 16px;

				border-radius: 14px;

			}

			

			.ccl-vacancies--form-group {

				margin-bottom: 18px;

			}

			

			.ccl-vacancies--form-label {

				font-size: 0.85rem;

				margin-bottom: 8px;

			}

			

			.ccl-vacancies--form-input,

			.ccl-vacancies--form-select,

			.ccl-vacancies--form-textarea {

				padding: 11px 12px;

				font-size: 16px; /* Prevents zoom on iOS */

				border-radius: 10px;

			}

			

			.ccl-vacancies--form-select {

				background-position: right 8px center;

				background-size: 18px;

				padding-right: 32px;

			}

			

			.ccl-vacancies--form-textarea {

				min-height: 90px;

			}

			

			.ccl-vacancies--form-upload {

				padding: 20px 14px;

			}

			

			.ccl-vacancies--form-upload-icon {

				width: 45px;

				height: 45px;

				margin-bottom: 10px;

			}

			

			.ccl-vacancies--form-upload-icon i {

				font-size: 1.1rem;

			}

			

			.ccl-vacancies--form-upload-text {

				font-size: 0.9rem;

				margin-bottom: 6px;

			}

			

			.ccl-vacancies--form-upload-hint {

				font-size: 0.8rem;

			}

			

			.ccl-vacancies--form-submit {

				padding: 13px 28px;

				font-size: 0.95rem;

			}

			

			.ccl-vacancies--btn {

				padding: 14px 24px;

				font-size: 0.95rem;

			}

		}

		

		/* ============================================

		   EXTRA SMALL SCREENS (< 360px)

		============================================ */

		

		@media (max-width: 360px) {

			.ccl-vacancies--wrapper {

				font-size: 13px;

			}

			

			.ccl-vacancies--eoi-form {

				padding: 20px 14px;

			}

			

			.ccl-vacancies--form-group {

				margin-bottom: 16px;

			}

			

			.ccl-vacancies--form-input,

			.ccl-vacancies--form-select,

			.ccl-vacancies--form-textarea {

				padding: 10px;

			}

			

			.ccl-vacancies--eoi-title {

				font-size: 1.3rem;

			}

			

			.ccl-vacancies--form-submit {

				padding: 12px 24px;

				font-size: 0.9rem;

			}

		}

		

		/* ============================================

		   TOUCH DEVICE OPTIMIZATIONS

		============================================ */

		

		@media (hover: none) and (pointer: coarse) {

			.ccl-vacancies--job-item:hover {

				transform: none;

			}

			

			.ccl-vacancies--job-item:active {

				transform: translateX(4px);

			}

			

			/* Make form controls more touch-friendly */

			.ccl-vacancies--form-input,

			.ccl-vacancies--form-select,

			.ccl-vacancies--form-textarea {

				min-height: 48px; /* Better touch target */

			}

			

			.ccl-vacancies--form-textarea {

				min-height: 100px;

			}

			

			.ccl-vacancies--form-upload {

				min-height: 120px;

				display: flex;

				flex-direction: column;

				align-items: center;

				justify-content: center;

			}

			

			.ccl-vacancies--form-submit {

				min-height: 52px;

			}

			

			.ccl-vacancies--filter-select {

				min-height: 48px;

			}

			

			.ccl-vacancies--filter-reset {

				min-height: 48px;

			}

		}

		

		/* ============================================

		   MEDIUM TABLETS (768px - 1024px)

		============================================ */

		

		@media (min-width: 769px) and (max-width: 1024px) {

			.ccl-vacancies--eoi-header {

				margin-bottom: 44px;

			}

			

			.ccl-vacancies--eoi-form {

				padding: 40px 32px;

			}

			

			.ccl-vacancies--form-row {

				grid-template-columns: 1fr 1fr;

				gap: 20px;

				margin-bottom: 20px;

			}

			

			.ccl-vacancies--form-input,

			.ccl-vacancies--form-select,

			.ccl-vacancies--form-textarea {

				font-size: 16px; /* Prevents zoom on iOS */

			}

		}

		

		/* ============================================

		   LANDSCAPE MOBILE OPTIMIZATION

		============================================ */

		

		@media (max-height: 600px) and (orientation: landscape) {

			.ccl-vacancies--hero {

				padding: 60px 24px 50px;

			}

			

			.ccl-vacancies--eoi-section,

			.ccl-vacancies--career-section {

				padding: 50px 24px;

			}

			

			.ccl-vacancies--eoi-header {

				margin-bottom: 30px;

			}

			

			.ccl-vacancies--eoi-form {

				padding: 24px;

			}

			

			.ccl-vacancies--form-upload {

				padding: 20px;

			}

			

			.ccl-vacancies--form-upload-icon {

				width: 40px;

				height: 40px;

				margin-bottom: 8px;

			}

			

			.ccl-vacancies--form-upload-icon i {

				font-size: 1rem;

			}

		}

		

		/* ============================================

		   SMOOTH SCROLL

		============================================ */

		

		.ccl-vacancies--wrapper {

			scroll-behavior: smooth;

		}

		/* ============================================

		   CCL BENEFITS PAGE - ISOLATED STYLES

		   All classes prefixed with ccl-benefits--

		   No global selectors - all scoped to wrapper

		============================================ */

		

		.ccl-benefits--wrapper {

			/* CSS Variables */

			--ccl-benefits-primary: #1d63ff;

			--ccl-benefits-dark: #0f172a;

			--ccl-benefits-accent: #10b981;

			--ccl-benefits-orange: #ff6b35;

			--ccl-benefits-purple: #8b5cf6;

			--ccl-benefits-text: #1e293b;

			--ccl-benefits-muted: #64748b;

			--ccl-benefits-border: #e2e8f0;

			--ccl-benefits-bg-light: #f8fafc;

			--ccl-benefits-white: #ffffff;

			

			--ccl-benefits-font-base: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

			

			margin: 0;

			padding: 0;

			font-family: var(--ccl-benefits-font-base);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-benefits-text);

			background: var(--ccl-benefits-dark);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			overflow-x: hidden;

		}

		

		.ccl-benefits--wrapper *,

		.ccl-benefits--wrapper *::before,

		.ccl-benefits--wrapper *::after {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		.ccl-benefits--wrapper h1,

		.ccl-benefits--wrapper h2,

		.ccl-benefits--wrapper h3,

		.ccl-benefits--wrapper h4 {

			font-weight: 800;

			line-height: 1.2;

			color: var(--ccl-benefits-dark);

		}

		

		.ccl-benefits--wrapper ul {

			list-style: none;

		}

		

		.ccl-benefits--wrapper a {

			text-decoration: none;

		}

		

		/* ============================================

		   Hero Section - BOLD

		============================================ */

		

		.ccl-benefits--hero {

			background: var(--ccl-benefits-dark);

			padding: 50px 0px 60px;

			position: relative;

			overflow: hidden;

			min-height: 60vh;

			display: flex;

			align-items: center;

		}

		

		.ccl-benefits--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			animation: ccl-benefits-pulse 8s ease-in-out infinite;

		}

		

		.ccl-benefits--hero::after {

			content: '';

			position: absolute;

			bottom: -30%;

			left: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(16, 185, 129, 0.12) 0%, transparent 70%);

			animation: ccl-benefits-pulse 6s ease-in-out infinite reverse;

		}

		

		@keyframes ccl-benefits-pulse {

			0%, 100% { transform: scale(1) translateY(0); opacity: 1; }

			50% { transform: scale(1.1) translateY(-20px); opacity: 0.8; }

		}

		

		.ccl-benefits--hero-content {

			max-width: 1100px;

			margin: 0 auto;

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--hero-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			background: linear-gradient(135deg, var(--ccl-benefits-accent), #059669);

			color: var(--ccl-benefits-white);

			font-size: 0.75rem;

			font-weight: 800;

			letter-spacing: 2px;

			text-transform: uppercase;

			padding: 10px 24px;

			border-radius: 50px;

			margin-bottom: 32px;

			box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);

			animation: ccl-benefits-slideInDown 0.8s ease-out;

		}

		

		@keyframes ccl-benefits-slideInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-benefits--hero h1 {

			font-size: clamp(3.5rem, 8vw, 4.5rem);

			color: var(--ccl-benefits-white);

			margin-bottom: 32px;

			line-height: 1.1;

			letter-spacing: -0.02em;

			animation: ccl-benefits-slideInUp 1s ease-out 0.2s both;

		}

		

		@keyframes ccl-benefits-slideInUp {

			from { opacity: 0; transform: translateY(40px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-benefits--hero h1 span {

			background: linear-gradient(135deg, var(--ccl-benefits-accent), #10b981, #34d399);

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

			position: relative;

			display: inline-block;

		}

		

		.ccl-benefits--hero h1 span::after {

			content: '';

			position: absolute;

			bottom: -8px;

			left: 0;

			right: 0;

			height: 8px;

			background: linear-gradient(90deg, var(--ccl-benefits-accent), transparent);

			border-radius: 4px;

		}

		

		.ccl-benefits--hero p {

			font-size: 1.35rem;

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.8;

			margin-bottom: 20px;

			max-width: 900px;

			animation: ccl-benefits-slideInUp 1s ease-out 0.4s both;

		}

		

		.ccl-benefits--hero-tagline {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.75);

			font-style: italic;

			font-weight: 500;

			border-left: 4px solid var(--ccl-benefits-accent);

			padding-left: 24px;

			margin-top: 32px;

			max-width: 800px;

			animation: ccl-benefits-slideInUp 1s ease-out 0.6s both;

		}

		

		/* ============================================

		   Container & Section Styles

		============================================ */

		

		.ccl-benefits--container {

			max-width: 1300px;

			margin: 0 auto;

			padding: 0 40px;

		}

		

		.ccl-benefits--section {

			padding: 100px 0;

			position: relative;

		}

		

		.ccl-benefits--section-header {

			text-align: center;

			max-width: 900px;

			margin: 0 auto 80px;

		}

		

		.ccl-benefits--section-kicker {

			font-size: 0.85rem;

			font-weight: 900;

			letter-spacing: 3px;

			text-transform: uppercase;

			color: var(--ccl-benefits-primary);

			margin-bottom: 16px;

			position: relative;

			display: inline-block;

		}

		

		.ccl-benefits--section-kicker::after {

			content: '';

			position: absolute;

			bottom: -8px;

			left: 0;

			width: 60%;

			height: 3px;

			background: linear-gradient(90deg, var(--ccl-benefits-primary), transparent);

			border-radius: 2px;

		}

		

		.ccl-benefits--section-header h2 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			margin-bottom: 24px;

			line-height: 1.1;

			letter-spacing: -0.02em;

		}

		

		.ccl-benefits--section-lead {

			font-size: 1.25rem;

			color: var(--ccl-benefits-muted);

			line-height: 1.8;

			font-weight: 500;

		}

		

		/* ============================================

		   Mission Section

		============================================ */

		

		.ccl-benefits--mission {

			background: var(--ccl-benefits-white);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--mission::before {

			content: '';

			position: absolute;

			top: 0;

			right: 0;

			width: 40%;

			height: 100%;

			background: linear-gradient(135deg, transparent 0%, var(--ccl-benefits-bg-light) 100%);

			clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);

		}

		

		.ccl-benefits--mission-content {

			display: grid;

			grid-template-columns: 1.2fr 1fr;

			gap: 80px;

			align-items: center;

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--mission-text h3 {

			font-size: 2.5rem;

			margin-bottom: 24px;

			color: var(--ccl-benefits-dark);

			letter-spacing: -0.01em;

			position: relative;

			display: inline-block;

		}

		

		.ccl-benefits--mission-text h3::after {

			content: '';

			position: absolute;

			bottom: -8px;

			left: 0;

			width: 80px;

			height: 6px;

			background: var(--ccl-benefits-accent);

			border-radius: 3px;

		}

		

		.ccl-benefits--mission-text p {

			font-size: 1.15rem;

			color: var(--ccl-benefits-text);

			line-height: 1.9;

			margin-bottom: 20px;

			font-weight: 500;

		}

		

		.ccl-benefits--mission-highlight {

			background: linear-gradient(135deg, var(--ccl-benefits-dark), #1e293b);

			border-left: 6px solid var(--ccl-benefits-accent);

			padding: 32px;

			border-radius: 0 16px 16px 0;

			margin-top: 32px;

			box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);

			transform: translateX(-40px);

		}

		

		.ccl-benefits--mission-highlight p {

			font-size: 1.2rem;

			font-weight: 700;

			color: var(--ccl-benefits-white);

			margin: 0;

			line-height: 1.7;

		}

		

		.ccl-benefits--mission-values {

			display: grid;

			gap: 24px;

		}

		

		.ccl-benefits--value-card {

			background: var(--ccl-benefits-white);

			border: 3px solid var(--ccl-benefits-border);

			border-radius: 16px;

			padding: 32px;

			transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--value-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			width: 6px;

			height: 0;

			background: linear-gradient(180deg, var(--ccl-benefits-accent), var(--ccl-benefits-primary));

			transition: height 0.4s ease;

		}

		

		.ccl-benefits--value-card:hover {

			border-color: var(--ccl-benefits-primary);

			transform: translateX(12px) translateY(-8px);

			box-shadow: -16px 16px 48px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-benefits--value-card:hover::before {

			height: 100%;

		}

		

		.ccl-benefits--value-card i {

			font-size: 2.5rem;

			color: var(--ccl-benefits-accent);

			margin-bottom: 16px;

			transition: transform 0.4s ease;

			display: inline-block;

		}

		

		.ccl-benefits--value-card:hover i {

			transform: scale(1.1) rotate(5deg);

		}

		

		.ccl-benefits--value-card h4 {

			font-size: 1.4rem;

			margin-bottom: 12px;

			font-weight: 800;

		}

		

		.ccl-benefits--value-card p {

			font-size: 1rem;

			color: var(--ccl-benefits-muted);

			margin: 0;

			line-height: 1.7;

		}

		

		/* ============================================

		   Benefits Grid

		============================================ */

		

		.ccl-benefits--benefits {

			background: linear-gradient(180deg, var(--ccl-benefits-bg-light) 0%, var(--ccl-benefits-white) 100%);

		}

		

		.ccl-benefits--benefits-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));

			gap: 40px;

		}

		

		.ccl-benefits--benefit-card {

			background: var(--ccl-benefits-white);

			border: 3px solid transparent;

			border-radius: 24px;

			padding: 40px;

			transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--benefit-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 0;

			background: linear-gradient(135deg, var(--ccl-benefits-primary), var(--ccl-benefits-accent));

			transition: height 0.5s ease;

			z-index: 0;

		}

		

		.ccl-benefits--benefit-card::after {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.1) 0%, transparent 70%);

			transform: translate(-50%, -50%);

			transition: width 0.6s ease, height 0.6s ease;

			border-radius: 50%;

		}

		

		.ccl-benefits--benefit-card:hover {

			transform: translateY(-12px) scale(1.02);

			box-shadow: 0 32px 80px rgba(29, 99, 255, 0.2);

			border-color: var(--ccl-benefits-primary);

		}

		

		.ccl-benefits--benefit-card:hover::before {

			height: 6px;

		}

		

		.ccl-benefits--benefit-card:hover::after {

			width: 300px;

			height: 300px;

		}

		

		.ccl-benefits--benefit-card > * {

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--benefit-icon {

			width: 80px;

			height: 80px;

			background: linear-gradient(135deg, var(--ccl-benefits-primary), #0846c1);

			border-radius: 20px;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 2.2rem;

			color: var(--ccl-benefits-white);

			margin-bottom: 24px;

			transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			box-shadow: 0 12px 32px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-benefits--benefit-card:hover .ccl-benefits--benefit-icon {

			transform: rotate(10deg) scale(1.1);

			box-shadow: 0 20px 48px rgba(29, 99, 255, 0.4);

		}

		

		.ccl-benefits--benefit-card h3 {

			font-size: 1.6rem;

			margin-bottom: 16px;

			font-weight: 800;

			letter-spacing: -0.01em;

		}

		

		.ccl-benefits--benefit-card p {

			font-size: 1.05rem;

			color: var(--ccl-benefits-muted);

			line-height: 1.8;

			margin-bottom: 20px;

			font-weight: 500;

		}

		

		.ccl-benefits--benefit-features {

			list-style: none;

		}

		

		.ccl-benefits--benefit-features li {

			padding: 10px 0;

			display: flex;

			align-items: flex-start;

			gap: 12px;

			font-size: 1rem;

			color: var(--ccl-benefits-text);

			font-weight: 500;

			transition: transform 0.3s ease;

		}

		

		.ccl-benefits--benefit-card:hover .ccl-benefits--benefit-features li {

			transform: translateX(4px);

		}

		

		.ccl-benefits--benefit-features li i {

			color: var(--ccl-benefits-accent);

			font-size: 1.1rem;

			margin-top: 4px;

			flex-shrink: 0;

		}

		

		/* ============================================

		   Loyalty Rewards

		============================================ */

		

		.ccl-benefits--loyalty {

			background: linear-gradient(135deg, #0f172a 0%, var(--ccl-benefits-primary) 50%, #8b5cf6 100%);

			color: var(--ccl-benefits-white);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--loyalty::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.05) 1px, transparent 1px);

			background-size: 50px 50px;

			animation: ccl-benefits-grid-move 20s linear infinite;

		}

		

		@keyframes ccl-benefits-grid-move {

			0% { transform: translate(0, 0); }

			100% { transform: translate(50px, 50px); }

		}

		

		.ccl-benefits--loyalty .ccl-benefits--section-kicker {

			color: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-benefits--loyalty .ccl-benefits--section-kicker::after {

			background: linear-gradient(90deg, rgba(255, 255, 255, 0.6), transparent);

		}

		

		.ccl-benefits--loyalty .ccl-benefits--section-header h2 {

			color: var(--ccl-benefits-white);

		}

		

		.ccl-benefits--loyalty .ccl-benefits--section-lead {

			color: rgba(255, 255, 255, 0.9);

		}

		

		.ccl-benefits--loyalty-timeline {

			max-width: 1000px;

			margin: 0 auto;

			display: grid;

			gap: 40px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--loyalty-milestone {

			background: rgba(255, 255, 255, 0.08);

			backdrop-filter: blur(20px);

			border: 3px solid rgba(255, 255, 255, 0.2);

			border-radius: 24px;

			padding: 40px;

			display: flex;

			gap: 32px;

			align-items: center;

			transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--loyalty-milestone::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), transparent);

			opacity: 0;

			transition: opacity 0.5s ease;

		}

		

		.ccl-benefits--loyalty-milestone:hover {

			background: rgba(255, 255, 255, 0.15);

			transform: translateX(20px) scale(1.03);

			border-color: var(--ccl-benefits-accent);

			box-shadow: -24px 24px 64px rgba(0, 0, 0, 0.3);

		}

		

		.ccl-benefits--loyalty-milestone:hover::before {

			opacity: 1;

		}

		

		.ccl-benefits--loyalty-icon {

			width: 100px;

			height: 100px;

			background: linear-gradient(135deg, var(--ccl-benefits-accent), #059669);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 2.5rem;

			flex-shrink: 0;

			box-shadow: 0 16px 48px rgba(16, 185, 129, 0.4);

			transition: all 0.5s ease;

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--loyalty-milestone:hover .ccl-benefits--loyalty-icon {

			transform: rotate(360deg) scale(1.15);

			box-shadow: 0 24px 64px rgba(16, 185, 129, 0.6);

		}

		

		.ccl-benefits--loyalty-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--loyalty-content h3 {

			color: var(--ccl-benefits-white);

			font-size: 2rem;

			margin-bottom: 12px;

			font-weight: 900;

			letter-spacing: -0.01em;

		}

		

		.ccl-benefits--loyalty-content p {

			color: rgba(255, 255, 255, 0.95);

			font-size: 1.15rem;

			line-height: 1.7;

			margin: 0;

			font-weight: 500;

		}

		

		/* ============================================

		   Culture Section

		============================================ */

		

		.ccl-benefits--culture {

			background: var(--ccl-benefits-white);

			position: relative;

		}

		

		.ccl-benefits--culture::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 200px;

			background: linear-gradient(180deg, var(--ccl-benefits-bg-light), transparent);

		}

		

		.ccl-benefits--culture-grid {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 32px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--culture-item {

			background: linear-gradient(135deg, var(--ccl-benefits-white), var(--ccl-benefits-bg-light));

			border: 3px solid transparent;

			border-radius: 20px;

			padding: 40px;

			transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--culture-item::before {

			content: '';

			position: absolute;

			top: -2px;

			left: -2px;

			right: -2px;

			bottom: -2px;

			background: linear-gradient(135deg, var(--ccl-benefits-accent), var(--ccl-benefits-primary), var(--ccl-benefits-purple));

			border-radius: 20px;

			opacity: 0;

			transition: opacity 0.5s ease;

			z-index: -1;

		}

		

		.ccl-benefits--culture-item:hover {

			background: var(--ccl-benefits-white);

			transform: translateX(16px) translateY(-8px);

			box-shadow: -20px 20px 60px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-benefits--culture-item:hover::before {

			opacity: 1;

		}

		

		.ccl-benefits--culture-item i {

			font-size: 3rem;

			background: linear-gradient(135deg, var(--ccl-benefits-accent), var(--ccl-benefits-primary));

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

			margin-bottom: 20px;

			transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			display: inline-block;

		}

		

		.ccl-benefits--culture-item:hover i {

			transform: scale(1.2) rotate(-10deg);

			background: var(--ccl-benefits-white);

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

		}

		

		.ccl-benefits--culture-item h3 {

			font-size: 1.6rem;

			margin-bottom: 16px;

			font-weight: 800;

			letter-spacing: -0.01em;

			transition: color 0.5s ease;

		}

		

		.ccl-benefits--culture-item:hover h3 {

			color: var(--ccl-benefits-white);

		}

		

		.ccl-benefits--culture-item p {

			font-size: 1.05rem;

			color: var(--ccl-benefits-muted);

			line-height: 1.8;

			margin: 0;

			font-weight: 500;

			transition: color 0.5s ease;

		}

		

		.ccl-benefits--culture-item:hover p {

			color: var(--ccl-benefits-white);

		}

		

		/* ============================================

		   CTA Section

		============================================ */

		

		.ccl-benefits--cta {

			background: var(--ccl-benefits-white);

			padding: 100px 0;

		}

		

		.ccl-benefits--cta-box {

			background: linear-gradient(135deg, var(--ccl-benefits-dark) 0%, #1e293b 50%, var(--ccl-benefits-primary) 100%);

			border-radius: 32px;

			padding: 80px 50px;

			text-align: center;

			position: relative;

			overflow: hidden;

			box-shadow: 0 32px 100px rgba(0, 0, 0, 0.2);

		}

		

		.ccl-benefits--cta-box::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(16, 185, 129, 0.2) 0%, transparent 70%);

			animation: ccl-benefits-float 8s ease-in-out infinite;

		}

		

		.ccl-benefits--cta-box::after {

			content: '';

			position: absolute;

			bottom: -30%;

			left: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			animation: ccl-benefits-float 6s ease-in-out infinite reverse;

		}

		

		@keyframes ccl-benefits-float {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, -30px) scale(1.1); }

		}

		

		.ccl-benefits--cta-box h2 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			color: var(--ccl-benefits-white);

			margin-bottom: 24px;

			position: relative;

			z-index: 1;

			letter-spacing: -0.02em;

			font-weight: 900;

		}

		

		.ccl-benefits--cta-box p {

			font-size: 1.3rem;

			color: rgba(255, 255, 255, 0.95);

			margin-bottom: 40px;

			max-width: 800px;

			margin-left: auto;

			margin-right: auto;

			line-height: 1.8;

			position: relative;

			z-index: 1;

			font-weight: 500;

		}

		

		.ccl-benefits--cta-buttons {

			display: flex;

			gap: 20px;

			justify-content: center;

			flex-wrap: wrap;

			position: relative;

			z-index: 1;

		}

		

		/* ============================================

		   Buttons

		============================================ */

		

		.ccl-benefits--btn {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			padding: 20px 40px;

			font-size: 1.1rem;

			font-weight: 800;

			border-radius: 14px;

			text-decoration: none;

			transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

			border: none;

			cursor: pointer;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-benefits--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			background: rgba(255, 255, 255, 0.2);

			border-radius: 50%;

			transform: translate(-50%, -50%);

			transition: width 0.6s ease, height 0.6s ease;

		}

		

		.ccl-benefits--btn:hover::before {

			width: 400px;

			height: 400px;

		}

		

		.ccl-benefits--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-benefits--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.4s ease;

		}

		

		.ccl-benefits--btn:hover i {

			transform: translateX(6px);

		}

		

		.ccl-benefits--btn--primary {

			background: linear-gradient(135deg, var(--ccl-benefits-accent), #059669);

			color: var(--ccl-benefits-white);

			box-shadow: 0 16px 48px rgba(16, 185, 129, 0.4);

		}

		

		.ccl-benefits--btn--primary:hover {

			transform: translateY(-6px) scale(1.05);

			box-shadow: 0 24px 64px rgba(16, 185, 129, 0.5);

		}

		

		.ccl-benefits--btn--secondary {

			background: var(--ccl-benefits-white);

			color: var(--ccl-benefits-primary);

			box-shadow: 0 16px 48px rgba(255, 255, 255, 0.2);

		}

		

		.ccl-benefits--btn--secondary:hover {

			transform: translateY(-6px) scale(1.05);

			box-shadow: 0 24px 64px rgba(255, 255, 255, 0.3);

		}

		

		/* ============================================

		   Scroll Reveal Animation

		============================================ */

		

		.ccl-benefits--fade-in {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275), 

						transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);

		}

		

		.ccl-benefits--fade-in.ccl-benefits--visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Stagger delays */

		.ccl-benefits--fade-in:nth-child(1) { transition-delay: 0s; }

		.ccl-benefits--fade-in:nth-child(2) { transition-delay: 0.1s; }

		.ccl-benefits--fade-in:nth-child(3) { transition-delay: 0.2s; }

		.ccl-benefits--fade-in:nth-child(4) { transition-delay: 0.3s; }

		.ccl-benefits--fade-in:nth-child(5) { transition-delay: 0.4s; }

		.ccl-benefits--fade-in:nth-child(6) { transition-delay: 0.5s; }

		.ccl-benefits--fade-in:nth-child(7) { transition-delay: 0.6s; }

		.ccl-benefits--fade-in:nth-child(8) { transition-delay: 0.7s; }

		

		/* ============================================

		   Touch Device Optimizations

		============================================ */

		

		@media (hover: none) and (pointer: coarse) {

			.ccl-benefits--benefit-card:hover,

			.ccl-benefits--value-card:hover,

			.ccl-benefits--culture-item:hover,

			.ccl-benefits--loyalty-milestone:hover {

				transform: none;

			}

			

			.ccl-benefits--btn:active {

				transform: scale(0.95);

			}

		}

		

		/* ============================================

		   Responsive Design

		============================================ */

		

		@media (max-width: 1024px) {

			.ccl-benefits--wrapper {

				font-size: 15px;

			}

			

			.ccl-benefits--hero {

				min-height: auto;

				padding: 100px 32px 80px;

			}

			

			.ccl-benefits--mission-content {

				grid-template-columns: 1fr;

				gap: 60px;

			}

			

			.ccl-benefits--mission::before {

				display: none;

			}

			

			.ccl-benefits--mission-highlight {

				transform: translateX(0);

			}

			

			.ccl-benefits--culture-grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-benefits--loyalty-milestone {

				flex-direction: column;

				text-align: center;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-benefits--wrapper {

				font-size: 14px;

			}

			

			.ccl-benefits--hero {

				padding: 80px 24px 60px;

			}

			

			.ccl-benefits--hero h1 {

				font-size: clamp(2.5rem, 8vw, 3.5rem);

			}

			

			.ccl-benefits--hero p {

				font-size: 1.15rem;

			}

			

			.ccl-benefits--container {

				padding: 0 24px;

			}

			

			.ccl-benefits--section {

				padding: 80px 0;

			}

			

			.ccl-benefits--section-header {

				margin-bottom: 60px;

			}

			

			.ccl-benefits--section-header h2 {

				font-size: clamp(2rem, 6vw, 3rem);

			}

			

			.ccl-benefits--benefits-grid {

				grid-template-columns: 1fr;

				gap: 32px;

			}

			

			.ccl-benefits--benefit-card {

				padding: 32px;

			}

			

			.ccl-benefits--loyalty {

				padding: 80px 0;

			}

			

			.ccl-benefits--loyalty-milestone {

				padding: 32px;

			}

			

			.ccl-benefits--loyalty-icon {

				width: 80px;

				height: 80px;

				font-size: 2rem;

			}

			

			.ccl-benefits--loyalty-content h3 {

				font-size: 1.5rem;

			}

			

			

			.ccl-benefits--cta-box {

				padding: 60px 32px;

			}

			

			.ccl-benefits--cta-box h2 {

				font-size: clamp(2rem, 6vw, 3rem);

			}

			

			.ccl-benefits--cta-buttons {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-benefits--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-benefits--wrapper {

				font-size: 14px;

			}

			

			.ccl-benefits--hero {

				padding: 60px 20px 50px;

			}

			

			.ccl-benefits--container {

				padding: 0 20px;

			}

			

			.ccl-benefits--section {

				padding: 60px 0;

			}

			

			.ccl-benefits--benefit-card {

				padding: 24px;

			}

			

			.ccl-benefits--benefit-icon {

				width: 60px;

				height: 60px;

				font-size: 1.8rem;

			}

		}

		

		/* ============================================

		   Reduced Motion Support

		============================================ */

		

		@media (prefers-reduced-motion: reduce) {

			.ccl-benefits--wrapper *,

			.ccl-benefits--wrapper *::before,

			.ccl-benefits--wrapper *::after {

				animation-duration: 0.01ms !important;

				animation-iteration-count: 1 !important;

				transition-duration: 0.01ms !important;

			}

			

			.ccl-benefits--fade-in {

				opacity: 1;

				transform: none;

			}

		}

		/* ============================================

		   DIVERSITY & INCLUSION PAGE STYLES

		   Prefix: ccl-diversity--

		============================================ */

		

		.ccl-diversity--wrapper {

			/* CSS Variables */

			--ccl-primary-blue: #1d63ff;

			--ccl-cta-blue: #0b5cff;

			--ccl-cta-dark: #0846c1;

			--ccl-accent-green: #10b981;

			--ccl-accent-gold: #ffa826;

			--ccl-ink: #1e293b;

			--ccl-muted: #64748b;

			--ccl-soft-border: #e5e7eb;

			--ccl-white: #ffffff;

			

			/* Base Styles */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

			line-height: 1.6;

			color: var(--ccl-ink);

			background-color: #f8fafc;

			margin: 0;

			padding: 0;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-diversity--wrapper main {

			overflow-x: hidden;

		}

		

		.ccl-diversity--wrapper * {

			box-sizing: border-box;

		}

		

		/* ============================================

		   HERO SECTION

		============================================ */

		

		.ccl-diversity--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 140px 24px 120px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-diversity--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-diversity--glow 15s ease-in-out infinite;

		}

		

		@keyframes ccl-diversity--glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, 30px) scale(1.1); }

		}

		

		.ccl-diversity--hero__content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-diversity--hero__kicker {

			display: inline-block;

			background: rgba(255, 255, 255, 0.2);

			color: var(--ccl-white);

			padding: 8px 20px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 24px;

			backdrop-filter: blur(10px);

			animation: ccl-diversity--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-diversity--fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-diversity--hero__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 6vw, 4.5rem);

			font-weight: 900;

			color: var(--ccl-white);

			margin: 0 0 28px;

			line-height: 1.1;

			animation: ccl-diversity--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-diversity--fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-diversity--hero__lead {

			font-size: clamp(1.1rem, 2vw, 1.3rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.8;

			margin: 0 auto;

			max-width: 800px;

			animation: ccl-diversity--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		/* ============================================

		   SECTION HEADER

		============================================ */

		

		.ccl-diversity--section {

			padding: 100px 24px;

		}

		

		.ccl-diversity--section__header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-diversity--section__kicker {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

			font-size: 0.95rem;

			font-weight: 700;

			color: var(--ccl-primary-blue);

			text-transform: uppercase;

			letter-spacing: 1px;

			margin-bottom: 20px;

		}

		

		.ccl-diversity--section__kicker::before,

		.ccl-diversity--section__kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--ccl-primary-blue);

		}

		

		.ccl-diversity--section__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.25rem, 5vw, 3.5rem);

			font-weight: 900;

			color: var(--ccl-ink);

			margin: 0 0 24px;

			line-height: 1.2;

		}

		

		.ccl-diversity--section__title mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.15) 100%);

			background-size: 100% 40%;

			background-position: 0 85%;

			background-repeat: no-repeat;

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-diversity--section__lead {

			font-size: 1.2rem;

			color: var(--ccl-muted);

			line-height: 1.8;

			margin: 0;

		}

		

		/* ============================================

		   INTRO CONTENT AREA

		============================================ */

		

		.ccl-diversity--intro-content {

			max-width: 1100px;

			margin: 48px auto 60px;

		}

		

		.ccl-diversity--intro-text {

			font-size: 1.15rem;

			color: var(--ccl-muted);

			line-height: 1.9;

			margin-bottom: 28px;

		}

		

		.ccl-diversity--intro-stats {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));

			gap: 32px;

			margin-top: 48px;

		}

		

		.ccl-diversity--stat-item {

			display: flex;

			gap: 24px;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			padding: 32px;

			align-items: flex-start;

		}

		

		.ccl-diversity--stat-icon {

			flex-shrink: 0;

			width: 70px;

			height: 70px;

			display: flex;

			align-items: center;

			justify-content: center;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			font-size: 1.8rem;

			color: var(--ccl-primary-blue);

		}

		

		.ccl-diversity--stat-content {

			flex: 1;

		}

		

		.ccl-diversity--stat-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.4rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 12px;

		}

		

		.ccl-diversity--stat-text {

			font-size: 1.05rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		.ccl-diversity--subsection-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(1.75rem, 4vw, 2.25rem);

			font-weight: 800;

			color: var(--ccl-ink);

			text-align: center;

			margin: 60px auto 40px;

			max-width: 850px;

		}

		

		/* ============================================

		   PILLARS GRID

		============================================ */

		

		.ccl-diversity--pillars {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 32px;

			max-width: 1400px;

			margin: 0 auto;

		}

		

		.ccl-diversity--pillar-card {

			position: relative;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 24px;

			padding: 40px 36px;

			text-align: center;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-diversity--pillar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-diversity--pillar-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.15);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-diversity--pillar-card:hover::before {

			transform: scaleY(1);

		}

		

		.ccl-diversity--pillar-card__icon {

			width: 90px;

			height: 90px;

			margin: 0 auto 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			font-size: 2.5rem;

			color: var(--ccl-primary-blue);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-diversity--pillar-card:hover .ccl-diversity--pillar-card__icon {

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			color: var(--ccl-white);

			transform: rotate(10deg) scale(1.05);

		}

		

		.ccl-diversity--pillar-card__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 16px;

		}

		

		.ccl-diversity--pillar-card__description {

			font-size: 1.05rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Color Variants */

		.ccl-diversity--pillar-card--green .ccl-diversity--pillar-card__icon {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.15));

			color: var(--ccl-accent-green);

		}

		

		.ccl-diversity--pillar-card--green:hover .ccl-diversity--pillar-card__icon {

			background: linear-gradient(135deg, #059669, var(--ccl-accent-green));

		}

		

		.ccl-diversity--pillar-card--green::before {

			background: linear-gradient(90deg, #059669, var(--ccl-accent-green));

		}

		

		.ccl-diversity--pillar-card--gold .ccl-diversity--pillar-card__icon {

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.1), rgba(255, 168, 38, 0.15));

			color: var(--ccl-accent-gold);

		}

		

		.ccl-diversity--pillar-card--gold:hover .ccl-diversity--pillar-card__icon {

			background: linear-gradient(135deg, #f59e0b, var(--ccl-accent-gold));

		}

		

		.ccl-diversity--pillar-card--gold::before {

			background: linear-gradient(90deg, #f59e0b, var(--ccl-accent-gold));

		}

		

		/* ============================================

		   COMMITMENT SECTION

		============================================ */

		

		.ccl-diversity--commitment {

			background: var(--ccl-white);

		}

		

		.ccl-diversity--commitment__content {

			max-width: 1000px;

			margin: 0 auto;

		}

		

		.ccl-diversity--commitment__text {

			font-size: 1.15rem;

			color: var(--ccl-muted);

			line-height: 1.9;

			margin-bottom: 36px;

		}

		

		.ccl-diversity--commitment-detail {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

			border-radius: 20px;

			padding: 48px;

			margin: 48px 0;

		}

		

		.ccl-diversity--commitment-detail__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 24px;

		}

		

		.ccl-diversity--commitment-detail__text {

			font-size: 1.1rem;

			color: var(--ccl-muted);

			line-height: 1.85;

			margin-bottom: 20px;

		}

		

		.ccl-diversity--commitment-detail__text:last-child {

			margin-bottom: 0;

		}

		

		.ccl-diversity--commitment-feature {

			display: grid;

			grid-template-columns: 1.2fr 1fr;

			gap: 48px;

			align-items: center;

			margin: 48px 0;

		}

		

		.ccl-diversity--commitment-feature__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.85rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 20px;

		}

		

		.ccl-diversity--commitment-feature__text {

			font-size: 1.1rem;

			color: var(--ccl-muted);

			line-height: 1.85;

			margin: 0;

		}

		

		.ccl-diversity--commitment-visual-grid {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 16px;

		}

		

		.ccl-diversity--commitment-visual-item {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			padding: 28px 20px;

			text-align: center;

			transition: all 0.3s ease;

		}

		

		.ccl-diversity--commitment-visual-item:hover {

			transform: translateY(-5px);

			box-shadow: 0 10px 25px rgba(29, 99, 255, 0.1);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-diversity--commitment-visual-item i {

			font-size: 2.2rem;

			color: var(--ccl-primary-blue);

			margin-bottom: 12px;

			display: block;

		}

		

		.ccl-diversity--commitment-visual-item span {

			font-size: 0.95rem;

			font-weight: 700;

			color: var(--ccl-ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			display: block;

		}

		

		.ccl-diversity--commitment__highlights {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 24px;

			margin-top: 48px;

		}

		

		.ccl-diversity--highlight {

			background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);

			border-left: 4px solid var(--ccl-primary-blue);

			border-radius: 12px;

			padding: 28px;

		}

		

		.ccl-diversity--highlight__icon {

			font-size: 2rem;

			color: var(--ccl-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-diversity--highlight__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.25rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 12px;

		}

		

		.ccl-diversity--highlight__text {

			font-size: 1rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* ============================================

		   PROGRAM CARDS

		============================================ */

		

		.ccl-diversity--programs {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

			max-width: 1400px;

			margin: 0 auto;

		}

		

		.ccl-diversity--program-card {

			position: relative;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 24px;

			padding: 36px 32px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-diversity--program-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-accent-green), #059669);

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-diversity--program-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(16, 185, 129, 0.12);

			border-color: rgba(16, 185, 129, 0.3);

		}

		

		.ccl-diversity--program-card:hover::before {

			transform: scaleY(1);

		}

		

		.ccl-diversity--program-card__icon {

			width: 80px;

			height: 80px;

			margin-bottom: 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.15));

			font-size: 2.2rem;

			color: var(--ccl-accent-green);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-diversity--program-card:hover .ccl-diversity--program-card__icon {

			background: linear-gradient(135deg, var(--ccl-accent-green), #059669);

			color: var(--ccl-white);

			transform: rotate(-10deg) scale(1.05);

		}

		

		.ccl-diversity--program-card__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 16px;

		}

		

		.ccl-diversity--program-card__description {

			font-size: 1.05rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* ============================================

		   GENDER EQUALITY EXPANDED CONTENT

		============================================ */

		

		.ccl-diversity--gender-intro {

			max-width: 1100px;

			margin: 0 auto 60px;

		}

		

		.ccl-diversity--gender-intro__content {

			margin-bottom: 48px;

		}

		

		.ccl-diversity--gender-intro__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 24px;

		}

		

		.ccl-diversity--gender-intro__text {

			font-size: 1.1rem;

			color: var(--ccl-muted);

			line-height: 1.85;

			margin-bottom: 20px;

		}

		

		.ccl-diversity--gender-intro__commitments {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 24px;

		}

		

		.ccl-diversity--commitment-box {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.05), rgba(16, 185, 129, 0.08));

			border-left: 4px solid var(--ccl-accent-green);

			border-radius: 12px;

			padding: 28px 24px;

			transition: all 0.3s ease;

		}

		

		.ccl-diversity--commitment-box:hover {

			transform: translateX(5px);

			box-shadow: 0 8px 20px rgba(16, 185, 129, 0.12);

		}

		

		.ccl-diversity--commitment-box i {

			font-size: 2rem;

			color: var(--ccl-accent-green);

			margin-bottom: 16px;

			display: block;

		}

		

		.ccl-diversity--commitment-box h4 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.25rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 12px;

		}

		

		.ccl-diversity--commitment-box p {

			font-size: 1rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* ============================================

		   CULTURAL SECTION

		============================================ */

		

		.ccl-diversity--cultural__intro {

			max-width: 900px;

			margin: 0 auto 48px;

			text-align: center;

		}

		

		.ccl-diversity--cultural__text {

			font-size: 1.15rem;

			color: var(--ccl-muted);

			line-height: 1.8;

			margin-bottom: 20px;

		}

		

		.ccl-diversity--cultural-expanded {

			max-width: 1100px;

			margin: 48px auto 60px;

		}

		

		.ccl-diversity--cultural-content {

			margin-bottom: 48px;

		}

		

		.ccl-diversity--cultural-content__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 24px;

		}

		

		.ccl-diversity--cultural-content__text {

			font-size: 1.1rem;

			color: var(--ccl-muted);

			line-height: 1.85;

			margin-bottom: 20px;

		}

		

		.ccl-diversity--cultural-initiatives {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 28px;

		}

		

		.ccl-diversity--initiative-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			padding: 32px 28px;

			transition: all 0.3s ease;

		}

		

		.ccl-diversity--initiative-card:hover {

			transform: translateY(-5px);

			box-shadow: 0 12px 30px rgba(255, 168, 38, 0.12);

			border-color: rgba(255, 168, 38, 0.3);

		}

		

		.ccl-diversity--initiative-header {

			display: flex;

			align-items: center;

			gap: 16px;

			margin-bottom: 16px;

		}

		

		.ccl-diversity--initiative-header i {

			font-size: 1.8rem;

			color: var(--ccl-accent-gold);

		}

		

		.ccl-diversity--initiative-header h4 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0;

		}

		

		.ccl-diversity--initiative-card p {

			font-size: 1.05rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		.ccl-diversity--pathway-cards {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-diversity--pathway-card {

			position: relative;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 24px;

			padding: 40px 36px;

			text-align: center;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-diversity--pathway-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-accent-gold), #f59e0b);

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-diversity--pathway-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(255, 168, 38, 0.12);

			border-color: rgba(255, 168, 38, 0.3);

		}

		

		.ccl-diversity--pathway-card:hover::before {

			transform: scaleY(1);

		}

		

		.ccl-diversity--pathway-card__icon {

			width: 85px;

			height: 85px;

			margin: 0 auto 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.1), rgba(255, 168, 38, 0.15));

			font-size: 2.3rem;

			color: var(--ccl-accent-gold);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-diversity--pathway-card:hover .ccl-diversity--pathway-card__icon {

			background: linear-gradient(135deg, var(--ccl-accent-gold), #f59e0b);

			color: var(--ccl-white);

			transform: rotate(10deg) scale(1.05);

		}

		

		.ccl-diversity--pathway-card__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.6rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin: 0 0 16px;

		}

		

		.ccl-diversity--pathway-card__description {

			font-size: 1.05rem;

			color: var(--ccl-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* ============================================

		   LGBTI+ SECTION

		============================================ */

		

		.ccl-diversity--lgbti {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

		}

		

		.ccl-diversity--lgbti__content {

			max-width: 1000px;

			margin: 0 auto;

			display: grid;

			grid-template-columns: 1fr 1fr;

			gap: 60px;

			align-items: center;

		}

		

		.ccl-diversity--lgbti__visual {

			position: relative;

		}

		

		.ccl-diversity--lgbti__icon-grid {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 20px;

		}

		

		.ccl-diversity--lgbti__icon-item {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			padding: 32px;

			text-align: center;

			transition: all 0.3s ease;

		}

		

		.ccl-diversity--lgbti__icon-item:hover {

			transform: translateY(-5px);

			box-shadow: 0 10px 30px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-diversity--lgbti__icon-item i {

			font-size: 2.5rem;

			color: var(--ccl-primary-blue);

			margin-bottom: 12px;

		}

		

		.ccl-diversity--lgbti__icon-label {

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--ccl-ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

		}

		

		.ccl-diversity--lgbti__text-content h3 {

			font-family: 'Inter Tight', sans-serif;

			font-size: 2rem;

			font-weight: 900;

			color: var(--ccl-ink);

			margin: 0 0 24px;

			line-height: 1.3;

		}

		

		.ccl-diversity--lgbti__text-content p {

			font-size: 1.15rem;

			color: var(--ccl-muted);

			line-height: 1.8;

			margin-bottom: 24px;

		}

		

		.ccl-diversity--lgbti__benefits {

			list-style: none;

			padding: 0;

			margin: 32px 0 0;

		}

		

		.ccl-diversity--lgbti__benefits li {

			font-size: 1.05rem;

			color: var(--ccl-muted);

			padding-left: 32px;

			position: relative;

			margin-bottom: 16px;

			line-height: 1.6;

		}

		

		.ccl-diversity--lgbti__benefits li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-accent-green);

			font-size: 1.1rem;

		}

		

		/* ============================================

		   CTA SECTION

		============================================ */

		

		.ccl-diversity--cta {

			background: linear-gradient(135deg, var(--ccl-ink) 0%, #334155 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-diversity--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.1) 0%, transparent 70%);

			animation: ccl-diversity--glow-reverse 20s ease-in-out infinite;

		}

		

		@keyframes ccl-diversity--glow-reverse {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(-30px, -30px) scale(1.1); }

		}

		

		.ccl-diversity--cta__content {

			position: relative;

			z-index: 2;

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-diversity--cta__title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2rem, 5vw, 3rem);

			font-weight: 900;

			color: var(--ccl-white);

			margin: 0 0 24px;

			line-height: 1.2;

		}

		

		.ccl-diversity--cta__text {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.9);

			line-height: 1.8;

			margin: 0 0 40px;

		}

		

		.ccl-diversity--cta__buttons {

			display: flex;

			gap: 20px;

			justify-content: center;

			flex-wrap: wrap;

		}

		

		/* ============================================

		   BUTTONS

		============================================ */

		

		.ccl-diversity--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 36px;

			font-family: 'Inter', sans-serif;

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border-radius: 12px;

			border: none;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-diversity--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-diversity--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-diversity--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-diversity--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-diversity--btn:hover i {

			transform: translateX(5px);

		}

		

		.ccl-diversity--btn--primary {

			background: var(--ccl-cta-blue);

			color: var(--ccl-white);

		}

		

		.ccl-diversity--btn--primary:hover {

			background: var(--ccl-cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 10px 30px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-diversity--btn--secondary {

			background: var(--ccl-white);

			color: var(--ccl-primary-blue);

		}

		

		.ccl-diversity--btn--secondary:hover {

			background: #f8fafc;

			transform: translateY(-2px);

			box-shadow: 0 10px 30px rgba(255, 255, 255, 0.2);

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATIONS

		============================================ */

		

		.ccl-diversity--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-diversity--scroll-reveal.ccl-diversity--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		============================================ */

		

		@media (max-width: 1024px) {

			.ccl-diversity--wrapper .ccl-diversity--section {

				padding: 80px 24px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--pillars,

			.ccl-diversity--wrapper .ccl-diversity--programs,

			.ccl-diversity--wrapper .ccl-diversity--pathway-cards {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

				gap: 24px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--lgbti__content {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--commitment__highlights {

				grid-template-columns: 1fr;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--intro-stats {

				grid-template-columns: 1fr;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--commitment-feature {

				grid-template-columns: 1fr;

				gap: 36px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--gender-intro__commitments {

				grid-template-columns: 1fr;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--cultural-initiatives {

				grid-template-columns: 1fr;

			}

			.ccl-aviation--section .everest-forms {
				padding: 36px;
			}

		}

		

		@media (max-width: 768px) {

			.ccl-diversity--wrapper .ccl-diversity--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--section {

				padding: 60px 20px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--section__header {

				margin-bottom: 40px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--pillars,

			.ccl-diversity--wrapper .ccl-diversity--programs,

			.ccl-diversity--wrapper .ccl-diversity--pathway-cards {

				grid-template-columns: 1fr;

				gap: 20px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--section__kicker::before,

			.ccl-diversity--wrapper .ccl-diversity--section__kicker::after {

				width: 30px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--cta__buttons {

				flex-direction: column;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--lgbti__icon-grid {

				grid-template-columns: repeat(2, 1fr);

				gap: 16px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--lgbti__icon-item {

				padding: 24px 16px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--commitment-detail {

				padding: 32px 24px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--commitment-visual-grid {

				grid-template-columns: repeat(2, 1fr);

			}

			

			.ccl-diversity--wrapper .ccl-diversity--stat-item {

				flex-direction: column;

				text-align: center;

				align-items: center;

			}

			.ccl-aviation--section .everest-forms {padding: 28px;border-radius: 20px;}

			.ccl-aviation--section .everest-forms div.input-text .ccl-aviation--btn {
				width: fit-content;
			}

			.ccl-switch--container .everest-forms .evf-frontend-grid.evf-grid-2 {
				width: 100% !important;
				flex: 0 0 100%!important;
			}
			.ccl-switch--container .everest-forms .evf-frontend-grid.evf-grid-2:first-child {
				margin-right: 0;
			}

		}

		@media (max-width: 600px) {

			.ccl-aviation--section .everest-forms div.input-text .ccl-aviation--btn {
				width: 100%;
			}

			.ccl-aviation--section .everest-forms .evf-submit {
				width: 100%;
				justify-content: center;
			}

		}

		

		@media (max-width: 480px) {

			.ccl-diversity--wrapper .ccl-diversity--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--section {

				padding: 50px 16px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--pillar-card,

			.ccl-diversity--wrapper .ccl-diversity--program-card,

			.ccl-diversity--wrapper .ccl-diversity--pathway-card {

				padding: 32px 24px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--hero__kicker {

				font-size: 0.8rem;

				padding: 6px 16px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--section__title {

				font-size: 2rem;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--pillar-card__icon,

			.ccl-diversity--wrapper .ccl-diversity--program-card__icon,

			.ccl-diversity--wrapper .ccl-diversity--pathway-card__icon {

				width: 75px;

				height: 75px;

				font-size: 2rem;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--commitment-detail {

				padding: 24px 20px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--commitment-visual-grid {

				grid-template-columns: 1fr;

				gap: 12px;

			}

			

			.ccl-diversity--wrapper .ccl-diversity--initiative-card {

				padding: 24px 20px;

			}

			.ccl-cadetship--form-section .everest-forms .evf-field-radio ul li {
				margin: 0 0 10px 0!important;
    			width: 100%;
			}

		}

		.ccl-cadetship--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--light-bg: #f8fafc;

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Typography */

			--font-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', 'Inter', sans-serif;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-bounce: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);

			

			/* Base Styles */

			box-sizing: border-box;

			font-family: var(--font-base);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ink);

			background: var(--white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-cadetship--wrapper *,

		.ccl-cadetship--wrapper *::before,

		.ccl-cadetship--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-cadetship--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		.ccl-cadetship--wrapper a {

			text-decoration: none;

			color: inherit;

		}

		

		/* Hero Section */

		.ccl-cadetship--hero {

			position: relative;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 80px 24px 70px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-cadetship--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-cadetship--glow 8s ease-in-out infinite;

			border-radius: 50%;

		}

		

		@keyframes ccl-cadetship--glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.8; }

		}

		

		.ccl-cadetship--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-cadetship--hero-kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(255, 255, 255, 0.15);

			backdrop-filter: blur(10px);

			padding: 10px 24px;

			border-radius: 50px;

			color: var(--white);

			font-size: 0.95rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 28px;

			animation: ccl-cadetship--fadeInDown 0.8s ease-out;

		}

		

		.ccl-cadetship--hero-kicker i {

			font-size: 1.1rem;

		}

		

		@keyframes ccl-cadetship--fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-cadetship--hero h1 {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1.1;

			margin-bottom: 24px;

			animation: ccl-cadetship--fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-cadetship--fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-cadetship--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			margin-bottom: 36px;

			animation: ccl-cadetship--fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-cadetship--hero-meta {

			display: flex;

			flex-wrap: wrap;

			gap: 24px;

			justify-content: center;

			margin-bottom: 40px;

			animation: ccl-cadetship--fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-cadetship--hero-meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: var(--white);

			font-size: 1.05rem;

			font-weight: 600;

		}

		

		.ccl-cadetship--hero-meta-item i {

			font-size: 1.25rem;

			opacity: 0.9;

		}

		

		.ccl-cadetship--hero-cta {

			animation: ccl-cadetship--fadeInUp 0.8s ease-out 0.8s both;

		}

		

		/* Buttons */

		.ccl-cadetship--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 36px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1.05rem;

			cursor: pointer;

			border: none;

			transition: var(--transition-base);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-cadetship--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-cadetship--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-cadetship--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-cadetship--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-cadetship--btn:hover i {

			transform: translateX(5px);

		}

		

		.ccl-cadetship--btn--primary {

			background: var(--white);

			color: var(--primary-blue);

		}

		

		.ccl-cadetship--btn--primary:hover {

			transform: translateY(-3px);

			box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);

		}

		

		.ccl-cadetship--btn--secondary {

			background: var(--cta-blue);

			color: var(--white);

		}

		

		.ccl-cadetship--btn--secondary:hover {

			background: var(--cta-dark);

			transform: translateY(-3px);

			box-shadow: 0 12px 28px rgba(11, 92, 255, 0.4);

		}

		

		/* Section Base */

		.ccl-cadetship--section {

			padding: var(--section-padding) 24px;

		}

		

		.ccl-cadetship--section--alt {

			background: var(--light-bg);

		}

		

		.ccl-cadetship--container {

			max-width: 1280px;

			margin: 0 auto;

		}

		

		/* Section Headers */

		.ccl-cadetship--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 64px;

		}

		

		.ccl-cadetship--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			color: var(--primary-blue);

			font-size: 0.95rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1px;

			margin-bottom: 16px;

		}

		

		.ccl-cadetship--section-kicker::before,

		.ccl-cadetship--section-kicker::after {

			content: '';

			width: 32px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-cadetship--section-header h2 {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			line-height: 1.15;

			margin-bottom: 20px;

		}

		

		.ccl-cadetship--section-header h2 mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.15) 100%);

			background-repeat: no-repeat;

			background-size: 100% 40%;

			background-position: 0 85%;

			color: inherit;

			padding: 0 8px;

		}

		

		.ccl-cadetship--section-header p {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		/* Cards Grid */

		.ccl-cadetship--cards {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

		}

		

		.ccl-cadetship--card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			position: relative;

			overflow: hidden;

			transition: var(--transition-base);

		}

		

		.ccl-cadetship--card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--primary-blue);

			transform: translateY(-4px);

			transition: var(--transition-base);

		}

		

		.ccl-cadetship--card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);

		}

		

		.ccl-cadetship--card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-cadetship--card-icon {

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: var(--transition-bounce);

		}

		

		.ccl-cadetship--card:hover .ccl-cadetship--card-icon {

			transform: rotate(360deg);

			background: linear-gradient(135deg, var(--accent-green), var(--accent-gold));

		}

		

		.ccl-cadetship--card-icon i {

			font-size: 2rem;

			color: var(--white);

		}

		

		.ccl-cadetship--card h3 {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			margin-bottom: 12px;

			line-height: 1.3;

		}

		

		.ccl-cadetship--card p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin-bottom: 20px;

		}

		

		.ccl-cadetship--card ul {

			list-style: none;

			margin-bottom: 0;

		}

		

		.ccl-cadetship--card ul li {

			font-size: 1rem;

			line-height: 1.8;

			color: var(--muted);

			padding-left: 28px;

			position: relative;

			margin-bottom: 12px;

		}

		

		.ccl-cadetship--card ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--accent-green);

		}

		

		/* Info Box */

		.ccl-cadetship--info-box {

			background: linear-gradient(135deg, var(--light-bg) 0%, var(--white) 100%);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 48px;

			margin: 48px 0;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-cadetship--info-box::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--primary-blue), var(--accent-green));

		}

		

		.ccl-cadetship--info-box h3 {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			margin-bottom: 20px;

			display: flex;

			align-items: center;

			gap: 16px;

		}

		

		.ccl-cadetship--info-box h3 i {

			color: var(--primary-blue);

		}

		

		.ccl-cadetship--info-box p {

			font-size: 1.15rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 16px;

		}

		

		.ccl-cadetship--info-box p:last-child {

			margin-bottom: 0;

		}

		

		/* Qualities List */

		.ccl-cadetship--qualities-section {

			margin-bottom: 48px;

		}

		

		.ccl-cadetship--qualities-section:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-cadetship--qualities-heading {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--primary-blue);

			margin-bottom: 28px;

			text-align: center;

		}

		

		.ccl-cadetship--qualities {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 24px;

		}

		

		.ccl-cadetship--quality-item {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			padding: 24px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			transition: var(--transition-base);

		}

		

		.ccl-cadetship--quality-item:hover {

			border-color: var(--primary-blue);

			transform: translateX(8px);

		}

		

		.ccl-cadetship--quality-icon {

			width: 48px;

			height: 48px;

			min-width: 48px;

			border-radius: 12px;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

		}

		

		.ccl-cadetship--quality-icon i {

			color: var(--white);

			font-size: 1.25rem;

		}

		

		.ccl-cadetship--quality-content h4 {

			font-size: 1.2rem;

			font-weight: 700;

			margin-bottom: 4px;

		}

		

		.ccl-cadetship--quality-content p {

			font-size: 0.95rem;

			color: var(--muted);

			line-height: 1.6;

			margin: 0;

		}

		

		/* Application Form */

		.ccl-cadetship--form-section {

			background: var(--white);

			padding: var(--section-padding) 24px;

		}

		

		.ccl-cadetship--form-container {

			max-width: 800px;

			margin: 0 auto;

			background: var(--light-bg);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 56px;

		}

		

		.ccl-cadetship--form-header {

			text-align: center;

			margin-bottom: 48px;

		}

		

		.ccl-cadetship--form-header h2 {

			font-family: var(--font-display);

			font-size: 2.5rem;

			font-weight: 900;

			margin-bottom: 16px;

		}

		

		.ccl-cadetship--form-header p {

			font-size: 1.15rem;

			color: var(--muted);

		}

		

		.ccl-cadetship--form-group {

			margin-bottom: 28px;

		}

		

		.ccl-cadetship--form-label {

			display: block;

			font-weight: 600;

			font-size: 1.05rem;

			margin-bottom: 10px;

			color: var(--ink);

		}

		

		.ccl-cadetship--form-label--required::after {

			content: ' *';

			color: #ef4444;

		}

		

		.ccl-cadetship--form-input,

		.ccl-cadetship--form-textarea,

		.ccl-cadetship--form-select {

			width: 100%;

			padding: 14px 18px;

			border: 2px solid var(--soft-border);

			border-radius: 12px;

			font-family: var(--font-base);

			font-size: 1rem;

			color: var(--ink);

			background: var(--white);

			transition: var(--transition-base);

		}

		

		.ccl-cadetship--form-input:focus,

		.ccl-cadetship--form-textarea:focus,

		.ccl-cadetship--form-select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-cadetship--form-textarea {

			min-height: 140px;

			resize: vertical;

		}

		

		.ccl-cadetship--form-file {

			border: 2px dashed var(--soft-border);

			border-radius: 12px;

			padding: 32px;

			text-align: center;

			background: var(--white);

			transition: var(--transition-base);

			cursor: pointer;

		}

		

		.ccl-cadetship--form-file:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.02);

		}

		

		.ccl-cadetship--form-file i {

			font-size: 2.5rem;

			color: var(--primary-blue);

			margin-bottom: 12px;

		}

		

		.ccl-cadetship--form-file p {

			font-size: 1rem;

			color: var(--muted);

			margin: 0;

		}

		

		.ccl-cadetship--form-file p strong {

			color: var(--primary-blue);

		}

		

		.ccl-cadetship--radio-group {

			display: flex;

			gap: 24px;

			margin-top: 12px;

		}

		

		.ccl-cadetship--radio-label {

			display: flex;

			align-items: center;

			gap: 10px;

			cursor: pointer;

			font-weight: 500;

		}

		

		.ccl-cadetship--radio-label input[type="radio"] {

			width: 20px;

			height: 20px;

			cursor: pointer;

		}

		

		.ccl-cadetship--form-submit {

			text-align: center;

			margin-top: 40px;

		}

		

		.ccl-cadetship--form-note {

			text-align: center;

			font-size: 0.9rem;

			color: var(--muted);

			margin-top: 20px;

		}

		

		/* Highlight Box */

		.ccl-cadetship--highlight {

			background: linear-gradient(135deg, var(--accent-green) 0%, #059669 100%);

			color: var(--white);

			padding: 40px 48px;

			border-radius: 20px;

			text-align: center;

			margin: 48px 0;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-cadetship--highlight::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 400px;

			height: 400px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-cadetship--highlight-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-cadetship--highlight h3 {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			margin-bottom: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

		}

		

		.ccl-cadetship--highlight h3 i {

			font-size: 1.75rem;

		}

		

		.ccl-cadetship--highlight p {

			font-size: 1.15rem;

			line-height: 1.7;

			margin: 0;

			opacity: 0.95;

		}

		

		/* Timeline */

		.ccl-cadetship--timeline {

			max-width: 900px;

			margin: 64px auto;

			position: relative;

		}

		

		.ccl-cadetship--timeline::before {

			content: '';

			position: absolute;

			left: 40px;

			top: 0;

			bottom: 0;

			width: 3px;

			background: linear-gradient(180deg, var(--primary-blue), var(--accent-green));

		}

		

		.ccl-cadetship--timeline-item {

			position: relative;

			padding-left: 100px;

			margin-bottom: 48px;

		}

		

		.ccl-cadetship--timeline-marker {

			position: absolute;

			left: 0;

			top: 0;

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: var(--white);

			border: 4px solid var(--primary-blue);

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 1.5rem;

			color: var(--primary-blue);

			font-weight: 900;

			box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

			z-index: 1;

		}

		

		.ccl-cadetship--timeline-content {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			padding: 32px;

		}

		

		.ccl-cadetship--timeline-content h3 {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			margin-bottom: 12px;

		}

		

		.ccl-cadetship--timeline-content p {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Scroll Reveal */

		.ccl-cadetship--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-cadetship--scroll-reveal.ccl-cadetship--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* CTA Section */

		.ccl-cadetship--cta-section {

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-cadetship--cta-section::before {

			content: '';

			position: absolute;

			top: -30%;

			left: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-cadetship--cta-content {

			position: relative;

			z-index: 1;

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-cadetship--cta-content h2 {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 24px;

			line-height: 1.2;

		}

		

		.ccl-cadetship--cta-content p {

			font-size: 1.25rem;

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			margin-bottom: 36px;

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-cadetship--wrapper {

				--section-padding: 80px;

				--card-padding: 32px;

				--grid-gap: 28px;

			}

			

			.ccl-cadetship--cards {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			}

			

			.ccl-cadetship--timeline::before {

				left: 30px;

			}

			

			.ccl-cadetship--timeline-item {

				padding-left: 80px;

			}

			

			.ccl-cadetship--timeline-marker {

				width: 60px;

				height: 60px;

				font-size: 1.25rem;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-cadetship--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

				--grid-gap: 24px;

			}

			

			.ccl-cadetship--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-cadetship--section {

				padding: var(--section-padding) 20px;

			}

			

			.ccl-cadetship--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-cadetship--cards,

			.ccl-cadetship--qualities {

				grid-template-columns: 1fr;

			}

			

			.ccl-cadetship--section-header {

				margin-bottom: 48px;

			}

			

			.ccl-cadetship--info-box {

				padding: 32px 24px;

			}

			

			.ccl-cadetship--form-container {

				padding: 36px 28px;

			}

			

			.ccl-cadetship--highlight {

				padding: 32px 24px;

			}

			

			.ccl-cadetship--highlight h3 {

				font-size: 1.5rem;

				flex-direction: column;

				gap: 8px;

			}

			

			.ccl-cadetship--timeline::before {

				left: 20px;

			}

			

			.ccl-cadetship--timeline-item {

				padding-left: 70px;

			}

			

			.ccl-cadetship--timeline-marker {

				width: 50px;

				height: 50px;

				font-size: 1.1rem;

			}

			

			.ccl-cadetship--radio-group {

				flex-direction: column;

				gap: 12px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-cadetship--wrapper {

				--section-padding: 48px;

				--card-padding: 24px;

			}

			

			.ccl-cadetship--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-cadetship--section {

				padding: var(--section-padding) 16px;

			}

			

			.ccl-cadetship--btn {

				padding: 14px 28px;

				font-size: 1rem;

				width: 100%;

				justify-content: center;

			}

			

			.ccl-cadetship--card-icon {

				width: 70px;

				height: 70px;

			}

			

			.ccl-cadetship--card-icon i {

				font-size: 1.75rem;

			}

			

			.ccl-cadetship--form-container {

				padding: 28px 20px;

			}

			

			.ccl-cadetship--highlight {

				padding: 28px 20px;

			}

			

			.ccl-cadetship--highlight h3 {

				font-size: 1.35rem;

			}

		}

		.ccl-leaders--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--light-bg: #f8fafc;

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Typography */

			--font-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', 'Inter', sans-serif;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-bounce: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);

			

			/* Base Styles */

			box-sizing: border-box;

			font-family: var(--font-base);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ink);

			background: var(--white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-leaders--wrapper *,

		.ccl-leaders--wrapper *::before,

		.ccl-leaders--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-leaders--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		.ccl-leaders--wrapper a {

			text-decoration: none;

			color: inherit;

		}

		

		/* Hero Section */

		.ccl-leaders--hero {

			position: relative;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 80px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-leaders--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -10%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-leaders--glow 8s ease-in-out infinite;

			border-radius: 50%;

		}

		

		@keyframes ccl-leaders--glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.8; }

		}

		

		.ccl-leaders--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-leaders--hero-kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(255, 255, 255, 0.15);

			backdrop-filter: blur(10px);

			padding: 10px 24px;

			border-radius: 50px;

			color: var(--white);

			font-size: 0.95rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 28px;

			animation: ccl-leaders--fadeInDown 0.8s ease-out;

		}

		

		.ccl-leaders--hero-kicker i {

			font-size: 1.1rem;

		}

		

		@keyframes ccl-leaders--fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-leaders--hero h1 {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1.1;

			margin-bottom: 24px;

			animation: ccl-leaders--fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-leaders--fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-leaders--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			margin-bottom: 36px;

			animation: ccl-leaders--fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-leaders--hero-cta {

			animation: ccl-leaders--fadeInUp 0.8s ease-out 0.6s both;

		}

		

		/* Buttons */

		.ccl-leaders--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 36px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1.05rem;

			cursor: pointer;

			border: none;

			transition: var(--transition-base);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-leaders--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-leaders--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-leaders--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-leaders--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-leaders--btn:hover i {

			transform: translateX(5px);

		}

		

		.ccl-leaders--btn--primary {

			background: var(--white);

			color: var(--primary-blue);

		}

		

		.ccl-leaders--btn--primary:hover {

			transform: translateY(-3px);

			box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);

		}

		

		.ccl-leaders--btn--secondary {

			background: var(--cta-blue);

			color: var(--white);

		}

		

		.ccl-leaders--btn--secondary:hover {

			background: var(--cta-dark);

			transform: translateY(-3px);

			box-shadow: 0 12px 28px rgba(11, 92, 255, 0.4);

		}

		

		/* Section Base */

		.ccl-leaders--section {

			padding: var(--section-padding) 24px;

		}

		

		.ccl-leaders--section--alt {

			background: var(--light-bg);

		}

		

		.ccl-leaders--container {

			max-width: 1280px;

			margin: 0 auto;

		}

		

		/* Section Headers */

		.ccl-leaders--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 64px;

		}

		

		.ccl-leaders--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			color: var(--primary-blue);

			font-size: 0.95rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1px;

			margin-bottom: 16px;

		}

		

		.ccl-leaders--section-kicker::before,

		.ccl-leaders--section-kicker::after {

			content: '';

			width: 32px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-leaders--section-header h2 {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			line-height: 1.15;

			margin-bottom: 20px;

		}

		

		.ccl-leaders--section-header h2 mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.15) 100%);

			background-repeat: no-repeat;

			background-size: 100% 40%;

			background-position: 0 85%;

			color: inherit;

			padding: 0 8px;

		}

		

		.ccl-leaders--section-header p {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		/* Cards Grid */

		.ccl-leaders--cards {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

		}

		

		.ccl-leaders--card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			position: relative;

			overflow: hidden;

			transition: var(--transition-base);

		}

		

		.ccl-leaders--card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--primary-blue);

			transform: translateY(-4px);

			transition: var(--transition-base);

		}

		

		.ccl-leaders--card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);

		}

		

		.ccl-leaders--card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-leaders--card-icon {

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: var(--transition-bounce);

		}

		

		.ccl-leaders--card:hover .ccl-leaders--card-icon {

			transform: rotate(360deg);

			background: linear-gradient(135deg, var(--accent-green), var(--accent-gold));

		}

		

		.ccl-leaders--card-icon i {

			font-size: 2rem;

			color: var(--white);

		}

		

		.ccl-leaders--card h3 {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			margin-bottom: 12px;

			line-height: 1.3;

		}

		

		.ccl-leaders--card p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin-bottom: 20px;

		}

		

		.ccl-leaders--card ul {

			list-style: none;

			margin-bottom: 0;

		}

		

		.ccl-leaders--card ul li {

			font-size: 1rem;

			line-height: 1.8;

			color: var(--muted);

			padding-left: 28px;

			position: relative;

			margin-bottom: 12px;

		}

		

		.ccl-leaders--card ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--accent-green);

		}

		

		/* Info Box */

		.ccl-leaders--info-box {

			background: linear-gradient(135deg, var(--light-bg) 0%, var(--white) 100%);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 48px;

			margin: 48px 0;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-leaders--info-box::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--primary-blue), var(--accent-green));

		}

		

		.ccl-leaders--info-box h3 {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			margin-bottom: 20px;

			display: flex;

			align-items: center;

			gap: 16px;

		}

		

		.ccl-leaders--info-box h3 i {

			color: var(--primary-blue);

		}

		

		.ccl-leaders--info-box p {

			font-size: 1.15rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 16px;

		}

		

		.ccl-leaders--info-box p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-leaders--info-box ul {

			list-style: none;

			margin-top: 20px;

		}

		

		.ccl-leaders--info-box ul li {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--muted);

			padding-left: 32px;

			position: relative;

			margin-bottom: 12px;

		}

		

		.ccl-leaders--info-box ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--accent-green);

			font-size: 1.1rem;

		}

		

		/* Qualities List */

		.ccl-leaders--qualities-section {

			margin-bottom: 48px;

		}

		

		.ccl-leaders--qualities-section:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-leaders--qualities-heading {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--primary-blue);

			margin-bottom: 28px;

			text-align: center;

		}

		

		.ccl-leaders--qualities {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 24px;

		}

		

		.ccl-leaders--quality-item {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			padding: 24px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			transition: var(--transition-base);

		}

		

		.ccl-leaders--quality-item:hover {

			border-color: var(--primary-blue);

			transform: translateX(8px);

		}

		

		.ccl-leaders--quality-icon {

			width: 48px;

			height: 48px;

			min-width: 48px;

			border-radius: 12px;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

		}

		

		.ccl-leaders--quality-icon i {

			color: var(--white);

			font-size: 1.25rem;

		}

		

		.ccl-leaders--quality-content h4 {

			font-size: 1.2rem;

			font-weight: 700;

			margin-bottom: 4px;

		}

		

		.ccl-leaders--quality-content p {

			font-size: 0.95rem;

			color: var(--muted);

			line-height: 1.6;

			margin: 0;

		}

		

		/* Application Form */

		.ccl-leaders--form-section {

			background: var(--white);

			padding: var(--section-padding) 24px;

		}

		

		.ccl-leaders--form-container {

			max-width: 800px;

			margin: 0 auto;

			background: var(--light-bg);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 56px;

		}

		

		.ccl-leaders--form-header {

			text-align: center;

			margin-bottom: 48px;

		}

		

		.ccl-leaders--form-header h2 {

			font-family: var(--font-display);

			font-size: 2.5rem;

			font-weight: 900;

			margin-bottom: 16px;

		}

		

		.ccl-leaders--form-header p {

			font-size: 1.15rem;

			color: var(--muted);

		}

		

		.ccl-leaders--form-group {

			margin-bottom: 28px;

		}

		

		.ccl-leaders--form-label {

			display: block;

			font-weight: 600;

			font-size: 1.05rem;

			margin-bottom: 10px;

			color: var(--ink);

		}

		

		.ccl-leaders--form-label--required::after {

			content: ' *';

			color: #ef4444;

		}

		

		.ccl-leaders--form-input,

		.ccl-leaders--form-textarea,

		.ccl-leaders--form-select {

			width: 100%;

			padding: 14px 18px;

			border: 2px solid var(--soft-border);

			border-radius: 12px;

			font-family: var(--font-base);

			font-size: 1rem;

			color: var(--ink);

			background: var(--white);

			transition: var(--transition-base);

		}

		

		.ccl-leaders--form-input:focus,

		.ccl-leaders--form-textarea:focus,

		.ccl-leaders--form-select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-leaders--form-textarea {

			min-height: 140px;

			resize: vertical;

		}

		

		.ccl-leaders--form-file {

			border: 2px dashed var(--soft-border);

			border-radius: 12px;

			padding: 32px;

			text-align: center;

			background: var(--white);

			transition: var(--transition-base);

			cursor: pointer;

		}

		

		.ccl-leaders--form-file:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.02);

		}

		

		.ccl-leaders--form-file i {

			font-size: 2.5rem;

			color: var(--primary-blue);

			margin-bottom: 12px;

		}

		

		.ccl-leaders--form-file p {

			font-size: 1rem;

			color: var(--muted);

			margin: 0;

		}

		

		.ccl-leaders--form-file p strong {

			color: var(--primary-blue);

		}

		

		.ccl-leaders--radio-group {

			display: flex;

			gap: 24px;

			margin-top: 12px;

		}

		

		.ccl-leaders--radio-label {

			display: flex;

			align-items: center;

			gap: 10px;

			cursor: pointer;

			font-weight: 500;

		}

		

		.ccl-leaders--radio-label input[type="radio"] {

			width: 20px;

			height: 20px;

			cursor: pointer;

		}

		

		.ccl-leaders--form-submit {

			text-align: center;

			margin-top: 40px;

		}

		

		.ccl-leaders--form-note {

			text-align: center;

			font-size: 0.9rem;

			color: var(--muted);

			margin-top: 20px;

		}

		

		/* Highlight Box */

		.ccl-leaders--highlight {

			background: linear-gradient(135deg, var(--accent-gold) 0%, #e89b1e 100%);

			color: var(--white);

			padding: 40px 48px;

			border-radius: 20px;

			text-align: center;

			margin: 48px 0;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-leaders--highlight::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 400px;

			height: 400px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-leaders--highlight-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-leaders--highlight h3 {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			margin-bottom: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

		}

		

		.ccl-leaders--highlight h3 i {

			font-size: 1.75rem;

		}

		

		.ccl-leaders--highlight p {

			font-size: 1.15rem;

			line-height: 1.7;

			margin: 0;

			opacity: 0.95;

		}

		

		/* Eligibility Grid */

		.ccl-leaders--eligibility {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 28px;

			margin-top: 48px;

		}

		

		.ccl-leaders--eligibility-item {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-left: 6px solid var(--accent-green);

			border-radius: 16px;

			padding: 32px;

			transition: var(--transition-base);

		}

		

		.ccl-leaders--eligibility-item:hover {

			transform: translateY(-5px);

			box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);

			border-left-color: var(--primary-blue);

		}

		

		.ccl-leaders--eligibility-item h3 {

			font-family: var(--font-display);

			font-size: 1.5rem;

			font-weight: 800;

			margin-bottom: 12px;

			color: var(--primary-blue);

			display: flex;

			align-items: center;

			gap: 12px;

		}

		

		.ccl-leaders--eligibility-item h3 i {

			font-size: 1.25rem;

		}

		

		.ccl-leaders--eligibility-item p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin: 0;

		}

		

		/* CTA Section */

		.ccl-leaders--cta-section {

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-leaders--cta-section::before {

			content: '';

			position: absolute;

			top: -30%;

			left: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-leaders--cta-content {

			position: relative;

			z-index: 1;

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-leaders--cta-content h2 {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 24px;

			line-height: 1.2;

		}

		

		.ccl-leaders--cta-content p {

			font-size: 1.25rem;

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			margin-bottom: 36px;

		}

		

		/* Scroll Reveal */

		.ccl-leaders--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-leaders--scroll-reveal.ccl-leaders--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-leaders--wrapper {

				--section-padding: 80px;

				--card-padding: 32px;

				--grid-gap: 28px;

			}

			

			.ccl-leaders--cards {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			}

		}

		

		@media (max-width: 768px) {

			.ccl-leaders--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

				--grid-gap: 24px;

			}

			

			.ccl-leaders--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-leaders--section {

				padding: var(--section-padding) 20px;

			}

			

			.ccl-leaders--cards,

			.ccl-leaders--eligibility,

			.ccl-leaders--qualities {

				grid-template-columns: 1fr;

			}

			

			.ccl-leaders--section-header {

				margin-bottom: 48px;

			}

			

			.ccl-leaders--info-box {

				padding: 32px 24px;

			}

			

			.ccl-leaders--form-container {

				padding: 36px 28px;

			}

			

			.ccl-leaders--highlight {

				padding: 32px 24px;

			}

			

			.ccl-leaders--highlight h3 {

				font-size: 1.5rem;

				flex-direction: column;

				gap: 8px;

			}

			

			.ccl-leaders--radio-group {

				flex-direction: column;

				gap: 12px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-leaders--wrapper {

				--section-padding: 48px;

				--card-padding: 24px;

			}

			

			.ccl-leaders--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-leaders--section {

				padding: var(--section-padding) 16px;

			}

			

			.ccl-leaders--btn {

				padding: 14px 28px;

				font-size: 1rem;

				width: 100%;

				justify-content: center;

			}

			

			.ccl-leaders--card-icon {

				width: 70px;

				height: 70px;

			}

			

			.ccl-leaders--card-icon i {

				font-size: 1.75rem;

			}

			

			.ccl-leaders--form-container {

				padding: 28px 20px;

			}

			

			.ccl-leaders--highlight {

				padding: 28px 20px;

			}

			

			.ccl-leaders--highlight h3 {

				font-size: 1.35rem;

			}

		}

		.ccl-careers--wrapper {

			/* CSS Variables */

			--ccl-primary-blue: #1d63ff;

			--ccl-cta-blue: #0b5cff;

			--ccl-cta-dark: #0846c1;

			--ccl-accent-green: #10b981;

			--ccl-accent-gold: #ffa826;

			--ccl-ink: #1e293b;

			--ccl-muted: #64748b;

			--ccl-soft-border: #e5e7eb;

			--ccl-white: #ffffff;

			--ccl-bg-light: #f8fafc;

			

			/* Typography */

			font-family: 'Inter', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-muted);

			background-color: var(--ccl-white);

			

			/* Reset */

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}

		

		.ccl-careers--wrapper *,

		.ccl-careers--wrapper *::before,

		.ccl-careers--wrapper *::after {

			box-sizing: inherit;

		}

		

		.ccl-careers--wrapper main {

			overflow-x: hidden;

		}

		

		/* Typography */

		.ccl-careers--wrapper h1,

		.ccl-careers--wrapper h2,

		.ccl-careers--wrapper h3,

		.ccl-careers--wrapper h4 {

			font-family: 'Inter Tight', sans-serif;

			font-weight: 800;

			color: var(--ccl-ink);

			line-height: 1.2;

			margin: 0;

		}

		

		.ccl-careers--wrapper p {

			margin: 0 0 1rem;

		}

		

		.ccl-careers--wrapper p:last-child {

			margin-bottom: 0;

		}

		

		/* Smooth Scroll */

		.ccl-careers--wrapper {

			scroll-behavior: smooth;

		}

		

		/* Hero Section */

		.ccl-careers--hero {

			position: relative;

			background: linear-gradient(135deg, var(--ccl-primary-blue) 0%, var(--ccl-cta-dark) 100%);

			padding: 120px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-careers--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

			animation: ccl-careers-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-careers-glow {

			0%, 100% { transform: translate(0, 0); }

			50% { transform: translate(30px, 30px); }

		}

		

		.ccl-careers--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-careers--hero-kicker {

			display: inline-block;

			background: rgba(255, 255, 255, 0.2);

			color: var(--ccl-white);

			padding: 8px 20px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 24px;

			animation: ccl-careers-fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-careers-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-careers--hero h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			color: var(--ccl-white);

			margin-bottom: 24px;

			animation: ccl-careers-fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-careers-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-careers--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.6;

			margin-bottom: 20px;

			animation: ccl-careers-fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-careers--hero-subtitle {

			font-size: clamp(1rem, 1.8vw, 1.15rem);

			color: rgba(255, 255, 255, 0.9);

			line-height: 1.6;

			margin-bottom: 32px;

			font-weight: 500;

			animation: ccl-careers-fadeInUp 0.8s ease-out 0.5s backwards;

		}

		

		.ccl-careers--hero-cta {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

			margin-top: 40px;

			animation: ccl-careers-fadeInUp 0.8s ease-out 0.8s backwards;

		}

		

		.ccl-careers--btn--hero {

			padding: 18px 40px;

			font-size: 1.1rem;

			box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);

		}

		

		.ccl-careers--btn--hero.ccl-careers--btn--secondary {

			background: rgba(255, 255, 255, 0.15);

			color: var(--ccl-white);

			border: 2px solid rgba(255, 255, 255, 0.4);

			backdrop-filter: blur(10px);

		}

		

		.ccl-careers--btn--hero.ccl-careers--btn--secondary:hover {

			background: var(--ccl-white);

			color: var(--ccl-primary-blue);

			border-color: var(--ccl-white);

		}

		

		.ccl-careers--job-meta {

			display: flex;

			justify-content: center;

			gap: 32px;

			flex-wrap: wrap;

			margin-top: 40px;

			animation: ccl-careers-fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-careers--meta-item {

			display: flex;

			align-items: center;

			gap: 12px;

			color: var(--ccl-white);

			font-weight: 500;

		}

		

		.ccl-careers--meta-item i {

			font-size: 1.25rem;

			opacity: 0.9;

		}

		

		/* Section Styles */

		.ccl-careers--section {

			padding: 100px 24px;

		}

		

		.ccl-careers--section:nth-child(even) {

			background-color: var(--ccl-bg-light);

		}

		

		.ccl-careers--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-careers--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 64px;

		}

		

		.ccl-careers--kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--ccl-primary-blue);

			font-size: 0.9rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			margin-bottom: 16px;

		}

		

		.ccl-careers--kicker::before,

		.ccl-careers--kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--ccl-primary-blue);

		}

		

		.ccl-careers--section-header h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 24px;

		}

		

		.ccl-careers--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, var(--ccl-accent-gold) 60%);

			color: inherit;

		}

		

		.ccl-careers--lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--ccl-muted);

		}

		

		/* Card Grid */

		.ccl-careers--card-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 32px;

		}

		

		.ccl-careers--card {

			position: relative;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 24px;

			padding: 36px;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-careers--card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--ccl-primary-blue);

			transform: translateY(-4px);

			transition: transform 0.3s ease;

		}

		

		.ccl-careers--card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-careers--card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-careers--card-icon {

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: all 0.3s ease;

		}

		

		.ccl-careers--card:hover .ccl-careers--card-icon {

			transform: rotate(360deg);

			background: linear-gradient(135deg, var(--ccl-accent-green), var(--ccl-primary-blue));

		}

		

		.ccl-careers--card-icon i {

			font-size: 2rem;

			color: var(--ccl-white);

		}

		

		.ccl-careers--card h3 {

			font-size: 1.75rem;

			margin-bottom: 12px;

		}

		

		.ccl-careers--card p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-muted);

		}

		

		/* Two Column Section */

		.ccl-careers--two-col {

			display: grid;

			grid-template-columns: 1fr 1fr;

			gap: 64px;

			align-items: start;

		}

		

		.ccl-careers--content-block h3 {

			font-size: 2rem;

			margin-bottom: 24px;

			color: var(--ccl-ink);

		}

		

		.ccl-careers--content-block p {

			font-size: 1.1rem;

			line-height: 1.8;

			margin-bottom: 24px;

		}

		

		/* List Styles */

		.ccl-careers--list {

			list-style: none;

			padding: 0;

			margin: 0;

		}

		

		.ccl-careers--list li {

			position: relative;

			padding-left: 36px;

			margin-bottom: 20px;

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		.ccl-careers--list li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-accent-green);

			font-size: 1.1rem;

		}

		

		.ccl-careers--list--blue li::before {

			color: var(--ccl-primary-blue);

		}

		

		/* Benefits Grid */

		.ccl-careers--benefits-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 24px;

			margin-top: 48px;

		}

		

		.ccl-careers--benefit-item {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			padding: 24px;

			background: var(--ccl-white);

			border-radius: 16px;

			border: 2px solid var(--ccl-soft-border);

			transition: all 0.3s ease;

		}

		

		.ccl-careers--benefit-item:hover {

			border-color: var(--ccl-primary-blue);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-careers--benefit-icon {

			flex-shrink: 0;

			width: 48px;

			height: 48px;

			border-radius: 12px;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-dark));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 1.25rem;

		}

		

		.ccl-careers--benefit-content h4 {

			font-size: 1.1rem;

			margin-bottom: 8px;

			color: var(--ccl-ink);

		}

		

		.ccl-careers--benefit-content p {

			font-size: 0.95rem;

			color: var(--ccl-muted);

			margin: 0;

		}

		

		/* Application Form */

		.ccl-careers--form-section {

			background: linear-gradient(135deg, var(--ccl-bg-light) 0%, var(--ccl-white) 100%);

		}

		

		.ccl-careers--form-container {

			max-width: 800px;

			margin: 0 auto;

			background: var(--ccl-white);

			padding: 48px;

			border-radius: 24px;

			box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);

			border: 2px solid var(--ccl-soft-border);

		}

		

		.ccl-careers--form-group {

			margin-bottom: 28px;

		}

		

		.ccl-careers--toggle-container {

			display: flex;

			gap: 12px;

			margin-bottom: 20px;

		}

		

		.ccl-careers--toggle-btn {

			flex: 1;

			padding: 14px 20px;

			border: 2px solid var(--ccl-soft-border);

			border-radius: 12px;

			background: var(--ccl-white);

			color: var(--ccl-muted);

			font-family: 'Inter', sans-serif;

			font-size: 0.95rem;

			font-weight: 600;

			cursor: pointer;

			transition: all 0.3s ease;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

		}

		

		.ccl-careers--toggle-btn:hover {

			border-color: var(--ccl-primary-blue);

			color: var(--ccl-primary-blue);

		}

		

		.ccl-careers--toggle-btn--active {

			background: var(--ccl-primary-blue);

			border-color: var(--ccl-primary-blue);

			color: var(--ccl-white);

		}

		

		.ccl-careers--toggle-btn i {

			font-size: 1rem;

		}

		

		.ccl-careers--toggle-content {

			display: none;

		}

		

		.ccl-careers--toggle-content--active {

			display: block;

		}

		

		.ccl-careers--input-group {

			position: relative;

			display: block;

		}

		

		.ccl-careers--input-prefix {

			position: absolute;

			left: 18px;

			top: 50%;

			transform: translateY(-50%);

			color: var(--ccl-ink);

			font-weight: 600;

			font-size: 1.05rem;

			pointer-events: none;

			z-index: 10;

			user-select: none;

		}

		

		.ccl-careers--form-input--with-prefix {

			padding-left: 95px !important;

			width: 100%;

		}

		

		.ccl-careers--field-hint {

			margin-top: 8px;

			font-size: 0.85rem;

			color: var(--ccl-muted);

			font-style: italic;

		}

		

		.ccl-careers--conditional-field {

			animation: ccl-careers-slideDown 0.3s ease-out;

		}

		

		@keyframes ccl-careers-slideDown {

			from {

				opacity: 0;

				transform: translateY(-10px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-careers--form-group {

			margin-bottom: 28px;

		}

		

		.ccl-careers--form-label {

			display: block;

			font-weight: 600;

			color: var(--ccl-ink);

			margin-bottom: 10px;

			font-size: 1rem;

		}

		

		.ccl-careers--form-label .ccl-careers--required {

			color: var(--ccl-primary-blue);

			margin-left: 4px;

		}

		

		.ccl-careers--form-input,

		.ccl-careers--form-select,

		.ccl-careers--form-textarea {

			width: 100%;

			padding: 14px 18px;

			border: 2px solid var(--ccl-soft-border);

			border-radius: 12px;

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			color: var(--ccl-ink);

			transition: all 0.3s ease;

			background: var(--ccl-white);

		}

		

		.ccl-careers--form-input:focus,

		.ccl-careers--form-select:focus,

		.ccl-careers--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-careers--form-textarea {

			resize: vertical;

			min-height: 120px;

		}

		

		.ccl-careers--file-upload {

			position: relative;

			border: 2px dashed var(--ccl-soft-border);

			border-radius: 12px;

			padding: 32px;

			text-align: center;

			transition: all 0.3s ease;

			cursor: pointer;

			background: var(--ccl-bg-light);

		}

		

		.ccl-careers--file-upload:hover {

			border-color: var(--ccl-primary-blue);

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-careers--file-upload input[type="file"] {

			position: absolute;

			opacity: 0;

			width: 100%;

			height: 100%;

			top: 0;

			left: 0;

			cursor: pointer;

		}

		

		.ccl-careers--file-upload i {

			font-size: 2.5rem;

			color: var(--ccl-primary-blue);

			margin-bottom: 12px;

		}

		

		.ccl-careers--file-upload p {

			color: var(--ccl-muted);

			font-size: 0.95rem;

		}

		

		.ccl-careers--file-upload strong {

			color: var(--ccl-primary-blue);

			font-weight: 600;

		}

		

		/* Buttons */

		.ccl-careers--btn {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			padding: 16px 36px;

			border-radius: 12px;

			font-family: 'Inter', sans-serif;

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border: none;

			cursor: pointer;

			transition: all 0.3s ease;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-careers--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-careers--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-careers--btn--primary {

			background: var(--ccl-cta-blue);

			color: var(--ccl-white);

		}

		

		.ccl-careers--btn--primary:hover {

			background: var(--ccl-cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-careers--btn--secondary {

			background: var(--ccl-white);

			color: var(--ccl-primary-blue);

			border: 2px solid var(--ccl-primary-blue);

		}

		

		.ccl-careers--btn--secondary:hover {

			background: var(--ccl-primary-blue);

			color: var(--ccl-white);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-careers--btn--full {

			width: 100%;

			justify-content: center;

		}

		

		/* Scroll Reveal */

		.ccl-careers--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-careers--scroll-reveal.ccl-careers--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Call to Action Box */

		.ccl-careers--cta-box {

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-dark));

			padding: 64px 48px;

			border-radius: 24px;

			text-align: center;

			color: var(--ccl-white);

			margin-top: 64px;

		}

		

		.ccl-careers--cta-box h3 {

			font-size: 2.5rem;

			color: var(--ccl-white);

			margin-bottom: 20px;

		}

		

		.ccl-careers--cta-box p {

			font-size: 1.2rem;

			margin-bottom: 32px;

			opacity: 0.95;

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-careers--wrapper {

				font-size: 15px;

			}

			

			.ccl-careers--section {

				padding: 80px 24px;

			}

			

			.ccl-careers--two-col {

				grid-template-columns: 1fr;

				gap: 48px;

			}

			

			.ccl-careers--card-grid {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

				gap: 28px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-careers--wrapper {

				font-size: 14px;

			}

			

			.ccl-careers--hero {

				padding: 80px 20px 60px;

			}

			

			.ccl-careers--section {

				padding: 60px 20px;

			}

			

			.ccl-careers--section-header {

				margin-bottom: 48px;

			}

			

			.ccl-careers--card-grid,

			.ccl-careers--benefits-grid {

				grid-template-columns: 1fr;

				gap: 24px;

			}

			

			.ccl-careers--card {

				padding: 28px;

			}

			

			.ccl-careers--form-container {

				padding: 32px 24px;

			}

			

			.ccl-careers--toggle-container {

				flex-direction: column;

				gap: 10px;

			}

			

			.ccl-careers--job-meta {

				gap: 20px;

			}

			

			.ccl-careers--hero-cta {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-careers--btn--hero {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-careers--cta-box {

				padding: 48px 32px;

			}

			

			.ccl-careers--kicker::before,

			.ccl-careers--kicker::after {

				width: 24px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-careers--wrapper {

				font-size: 14px;

			}

			

			.ccl-careers--hero {

				padding: 60px 16px 48px;

			}

			

			.ccl-careers--section {

				padding: 48px 16px;

			}

			

			.ccl-careers--card {

				padding: 24px;

			}

			

			.ccl-careers--form-container {

				padding: 24px 20px;

			}

			

			.ccl-careers--btn {

				padding: 14px 28px;

				font-size: 1rem;

			}

			

			.ccl-careers--cta-box {

				padding: 36px 24px;

			}

			

			.ccl-careers--cta-box h3 {

				font-size: 2rem;

			}

		}

		/* ============================================

		   WRAPPER SCOPE - ALL STYLES CONTAINED

		   ============================================ */

		

		.ccl-careereoi--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			

			/* Typography */

			--font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', 'Inter', sans-serif;

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Animation */

			--transition-base: 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-long: 0.6s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Base Resets */

			box-sizing: border-box;

			margin: 0;

			padding: 0;

			font-family: var(--font-body);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ink);

			background: #fafafa;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-careereoi--wrapper *,

		.ccl-careereoi--wrapper *::before,

		.ccl-careereoi--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		

		.ccl-careereoi--hero {

			position: relative;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 120px 24px 100px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-careereoi--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-careereoi-glow 8s ease-in-out infinite alternate;

		}

		

		@keyframes ccl-careereoi-glow {

			0% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			100% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-careereoi--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-careereoi--kicker {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			font-size: 0.95rem;

			font-weight: 600;

			color: rgba(255,255,255,0.9);

			text-transform: uppercase;

			letter-spacing: 1.5px;

			margin-bottom: 24px;

			animation: ccl-careereoi-fadeInDown 0.8s ease-out;

		}

		

		.ccl-careereoi--kicker i {

			font-size: 1.1rem;

		}

		

		@keyframes ccl-careereoi-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-20px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-careereoi--hero-title {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1.1;

			margin-bottom: 28px;

			animation: ccl-careereoi-fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-careereoi-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-careereoi--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			color: rgba(255,255,255,0.95);

			line-height: 1.7;

			margin-bottom: 36px;

			animation: ccl-careereoi-fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-careereoi--job-meta {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 24px;

			margin-top: 40px;

			animation: ccl-careereoi-fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-careereoi--meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			background: rgba(255,255,255,0.15);

			backdrop-filter: blur(10px);

			padding: 12px 24px;

			border-radius: 50px;

			color: var(--white);

			font-weight: 600;

			font-size: 0.95rem;

		}

		

		.ccl-careereoi--meta-item i {

			font-size: 1.2rem;

			opacity: 0.9;

		}

		

		.ccl-careereoi--hero-cta {

			margin-top: 48px;

			animation: ccl-careereoi-fadeInUp 0.8s ease-out 0.8s backwards;

		}

		

		.ccl-careereoi--btn--hero {

			padding: 18px 48px;

			font-size: 1.15rem;

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 10px 30px rgba(0,0,0,0.15);

		}

		

		.ccl-careereoi--btn--hero:hover {

			background: var(--white);

			color: var(--cta-dark);

			transform: translateY(-4px);

			box-shadow: 0 15px 40px rgba(0,0,0,0.25);

		}

		

		.ccl-careereoi--btn--hero i {

			animation: ccl-careereoi-bounce 2s ease-in-out infinite;

		}

		

		@keyframes ccl-careereoi-bounce {

			0%, 100% { transform: translateY(0); }

			50% { transform: translateY(4px); }

		}

		

		/* ============================================

		   SECTION HEADERS

		   ============================================ */

		

		.ccl-careereoi--section {

			padding: var(--section-padding) 24px;

			max-width: 1400px;

			margin: 0 auto;

		}

		

		.ccl-careereoi--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-careereoi--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 700;

			color: var(--primary-blue);

			text-transform: uppercase;

			letter-spacing: 1.5px;

			margin-bottom: 16px;

		}

		

		.ccl-careereoi--section-kicker::before,

		.ccl-careereoi--section-kicker::after {

			content: '';

			width: 30px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-careereoi--section-title {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--ink);

			line-height: 1.2;

			margin-bottom: 20px;

		}

		

		.ccl-careereoi--section-title mark {

			background: linear-gradient(180deg, transparent 60%, var(--accent-green) 60%);

			color: inherit;

			padding: 0 8px;

		}

		

		.ccl-careereoi--section-lead {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.7;

		}

		

		/* ============================================

		   CARD LAYOUTS

		   ============================================ */

		

		.ccl-careereoi--card-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

		}

		

		.ccl-careereoi--card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			transition: all var(--transition-base);

			overflow: hidden;

		}

		

		.ccl-careereoi--card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--primary-blue);

			transform: translateY(-4px);

			transition: transform var(--transition-base);

		}

		

		.ccl-careereoi--card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(0,0,0,0.12);

			border-color: var(--primary-blue);

		}

		

		.ccl-careereoi--card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-careereoi--card-icon {

			width: 85px;

			height: 85px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			border-radius: 50%;

			margin-bottom: 24px;

			transition: all var(--transition-base);

		}

		

		.ccl-careereoi--card-icon i {

			font-size: 2.2rem;

			color: var(--white);

		}

		

		.ccl-careereoi--card:hover .ccl-careereoi--card-icon {

			transform: rotate(10deg) scale(1.05);

			background: linear-gradient(135deg, var(--accent-green), var(--accent-gold));

		}

		

		.ccl-careereoi--card-title {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ink);

			line-height: 1.3;

			margin-bottom: 12px;

		}

		

		.ccl-careereoi--card-text {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.6;

		}

		

		/* ============================================

		   ATTRIBUTES SECTION

		   ============================================ */

		

		.ccl-careereoi--attributes-list {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 24px;

			margin-top: 48px;

		}

		

		.ccl-careereoi--attribute-item {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			background: var(--white);

			padding: 28px;

			border-radius: 16px;

			border: 2px solid var(--soft-border);

			transition: all var(--transition-base);

		}

		

		.ccl-careereoi--attribute-item:hover {

			border-color: var(--accent-green);

			transform: translateX(8px);

		}

		

		.ccl-careereoi--attribute-icon {

			flex-shrink: 0;

			width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--accent-green), #059669);

			border-radius: 12px;

		}

		

		.ccl-careereoi--attribute-icon i {

			font-size: 1.4rem;

			color: var(--white);

		}

		

		.ccl-careereoi--attribute-text {

			flex: 1;

			font-size: 1.1rem;

			font-weight: 600;

			color: var(--ink);

			line-height: 1.5;

		}

		

		/* ============================================

		   BENEFITS SECTION

		   ============================================ */

		

		.ccl-careereoi--benefits {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

		}

		

		.ccl-careereoi--benefit-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			padding: 40px;

			transition: all var(--transition-base);

			position: relative;

		}

		

		.ccl-careereoi--benefit-card::after {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--accent-gold), var(--primary-blue));

			border-radius: 20px 20px 0 0;

			opacity: 0;

			transition: opacity var(--transition-base);

		}

		

		.ccl-careereoi--benefit-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 24px 48px rgba(0,0,0,0.1);

		}

		

		.ccl-careereoi--benefit-card:hover::after {

			opacity: 1;

		}

		

		.ccl-careereoi--benefit-header {

			display: flex;

			align-items: center;

			gap: 20px;

			margin-bottom: 24px;

		}

		

		.ccl-careereoi--benefit-icon {

			width: 70px;

			height: 70px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--accent-gold), #f59e0b);

			border-radius: 16px;

			flex-shrink: 0;

		}

		

		.ccl-careereoi--benefit-icon i {

			font-size: 2rem;

			color: var(--white);

		}

		

		.ccl-careereoi--benefit-title {

			font-family: var(--font-display);

			font-size: 1.8rem;

			font-weight: 800;

			color: var(--ink);

		}

		

		.ccl-careereoi--benefit-description {

			font-size: 1.1rem;

			color: var(--muted);

			line-height: 1.7;

		}

		

		.ccl-careereoi--benefit-list {

			list-style: none;

			margin-top: 24px;

		}

		

		.ccl-careereoi--benefit-list li {

			display: flex;

			align-items: flex-start;

			gap: 12px;

			margin-bottom: 16px;

			font-size: 1.05rem;

			color: var(--ink);

			line-height: 1.6;

		}

		

		.ccl-careereoi--benefit-list li i {

			color: var(--accent-green);

			margin-top: 4px;

			flex-shrink: 0;

		}

		

		/* ============================================

		   VIDEO SECTION

		   ============================================ */

		

		.ccl-careereoi--video-wrapper {

			max-width: 900px;

			margin: 48px auto 0;

			background: var(--white);

			border-radius: 24px;

			overflow: hidden;

			box-shadow: 0 10px 30px rgba(0,0,0,0.1);

		}

		

		.ccl-careereoi--video-placeholder {

			aspect-ratio: 16/9;

			background: linear-gradient(135deg, var(--ink) 0%, var(--muted) 100%);

			display: flex;

			flex-direction: column;

			align-items: center;

			justify-content: center;

			color: var(--white);

			padding: 40px;

			text-align: center;

		}

		

		.ccl-careereoi--video-placeholder i {

			font-size: 4rem;

			margin-bottom: 16px;

			opacity: 0.8;

		}

		

		.ccl-careereoi--video-placeholder p {

			font-size: 1.1rem;

			opacity: 0.9;

		}

		

		/* ============================================

		   FORM SECTION

		   ============================================ */

		

		.ccl-careereoi--form-section {

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: var(--section-padding) 24px;

		}

		

		.ccl-careereoi--form-section .ccl-careereoi--section-header {

			margin-bottom: 48px;

		}

		

		.ccl-careereoi--form-section .ccl-careereoi--section-kicker {

			color: rgba(255,255,255,0.9);

		}

		

		.ccl-careereoi--form-section .ccl-careereoi--section-kicker::before,

		.ccl-careereoi--form-section .ccl-careereoi--section-kicker::after {

			background: rgba(255,255,255,0.9);

		}

		

		.ccl-careereoi--form-section .ccl-careereoi--section-title {

			color: var(--white);

		}

		

		.ccl-careereoi--form-section .ccl-careereoi--section-lead {

			color: rgba(255,255,255,0.9);

		}

		

		.ccl-careereoi--form-container {

			max-width: 800px;

			margin: 0 auto;

			background: var(--white);

			border-radius: 24px;

			padding: 48px;

			box-shadow: 0 20px 60px rgba(0,0,0,0.2);

		}

		

		.ccl-careereoi--form-group {

			margin-bottom: 28px;

		}

		

		.ccl-careereoi--form-label {

			display: block;

			font-weight: 600;

			color: var(--ink);

			margin-bottom: 8px;

			font-size: 1rem;

		}

		

		.ccl-careereoi--form-label-required {

			color: var(--primary-blue);

			margin-left: 4px;

		}

		

		.ccl-careereoi--form-input,

		.ccl-careereoi--form-select,

		.ccl-careereoi--form-textarea {

			width: 100%;

			padding: 14px 18px;

			font-family: var(--font-body);

			font-size: 1rem;

			color: var(--ink);

			background: #fafafa;

			border: 2px solid var(--soft-border);

			border-radius: 12px;

			transition: all var(--transition-base);

		}

		

		.ccl-careereoi--form-input:focus,

		.ccl-careereoi--form-select:focus,

		.ccl-careereoi--form-textarea:focus {

			outline: none;

			border-color: var(--primary-blue);

			background: var(--white);

			box-shadow: 0 0 0 4px rgba(29,99,255,0.1);

		}

		

		.ccl-careereoi--form-textarea {

			min-height: 120px;

			resize: vertical;

		}

		

		.ccl-careereoi--input-group {

			position: relative;

			display: flex;

			align-items: center;

		}

		

		.ccl-careereoi--input-prefix {

			position: absolute;

			left: 18px;

			font-weight: 600;

			color: var(--muted);

			pointer-events: none;

			z-index: 1;

		}

		

		.ccl-careereoi--form-input--with-prefix {

			padding-left: 38px;

		}

		

		.ccl-careereoi--field-hint {

			margin-top: 8px;

			font-size: 0.9rem;

			color: var(--muted);

			font-style: italic;

		}

		

		.ccl-careereoi--form-row {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 24px;

		}

		

		.ccl-careereoi--file-upload {

			position: relative;

			border: 2px dashed var(--soft-border);

			border-radius: 12px;

			padding: 32px;

			text-align: center;

			background: #fafafa;

			transition: all var(--transition-base);

			cursor: pointer;

		}

		

		.ccl-careereoi--file-upload:hover {

			border-color: var(--primary-blue);

			background: rgba(29,99,255,0.02);

		}

		

		.ccl-careereoi--file-upload input[type="file"] {

			position: absolute;

			width: 100%;

			height: 100%;

			top: 0;

			left: 0;

			opacity: 0;

			cursor: pointer;

		}

		

		.ccl-careereoi--file-upload-icon {

			font-size: 2.5rem;

			color: var(--primary-blue);

			margin-bottom: 12px;

		}

		

		.ccl-careereoi--file-upload-text {

			font-size: 1rem;

			color: var(--muted);

			font-weight: 500;

		}

		

		.ccl-careereoi--file-upload-text strong {

			color: var(--primary-blue);

		}

		

		.ccl-careereoi--file-name {

			margin-top: 12px;

			font-size: 0.9rem;

			color: var(--accent-green);

			font-weight: 600;

		}

		

		/* ============================================

		   BUTTONS

		   ============================================ */

		

		.ccl-careereoi--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 12px;

			padding: 16px 32px;

			font-family: var(--font-body);

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border-radius: 12px;

			border: none;

			cursor: pointer;

			transition: all var(--transition-base);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-careereoi--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255,255,255,0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-careereoi--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-careereoi--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-careereoi--btn i {

			position: relative;

			z-index: 1;

			transition: transform var(--transition-base);

		}

		

		.ccl-careereoi--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-careereoi--btn--primary {

			background: var(--cta-blue);

			color: var(--white);

		}

		

		.ccl-careereoi--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(11,92,255,0.3);

		}

		

		.ccl-careereoi--btn--secondary {

			background: var(--accent-green);

			color: var(--white);

		}

		

		.ccl-careereoi--btn--secondary:hover {

			background: #059669;

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(16,185,129,0.3);

		}

		

		.ccl-careereoi--btn--full {

			width: 100%;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATIONS

		   ============================================ */

		

		.ccl-careereoi--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: all var(--transition-long);

		}

		

		.ccl-careereoi--scroll-reveal.ccl-careereoi--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		

		@media (max-width: 1024px) {

			.ccl-careereoi--wrapper {

				--section-padding: 80px;

				--card-padding: 32px;

				--grid-gap: 28px;

			}

			

			.ccl-careereoi--card-grid {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			}

		}

		

		@media (max-width: 768px) {

			.ccl-careereoi--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

				--grid-gap: 24px;

			}

			

			.ccl-careereoi--hero {

				padding: 80px 20px 60px;

			}

			

			.ccl-careereoi--job-meta {

				flex-direction: column;

				align-items: stretch;

			}

			

			.ccl-careereoi--meta-item {

				justify-content: center;

			}

			

			.ccl-careereoi--btn--hero {

				padding: 16px 40px;

				font-size: 1.05rem;

			}

			

			.ccl-careereoi--card-grid,

			.ccl-careereoi--attributes-list {

				grid-template-columns: 1fr;

			}

			

			.ccl-careereoi--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-careereoi--form-container {

				padding: 32px 24px;

			}

			

			.ccl-careereoi--benefit-card {

				padding: 28px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-careereoi--wrapper {

				--section-padding: 48px;

				--card-padding: 24px;

			}

			

			.ccl-careereoi--section {

				padding-left: 16px;

				padding-right: 16px;

			}

			

			.ccl-careereoi--hero {

				padding: 60px 16px 48px;

			}

			

			.ccl-careereoi--form-container {

				padding: 24px 20px;

			}

			

			.ccl-careereoi--card-icon {

				width: 70px;

				height: 70px;

			}

			

			.ccl-careereoi--card-icon i {

				font-size: 1.8rem;

			}

		}

		/* ================================

		   CSS VARIABLES & BASE STYLES

		   Scoped to wrapper only

		   ================================ */

		.ccl-litpara--wrapper {

			/* Brand Colors */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			

			/* Grays */

			--white: #ffffff;

			--gray-50: #f9fafb;

			--gray-100: #f3f4f6;

			--gray-200: #e5e7eb;

			--gray-900: #111827;

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--gap-lg: 32px;

			--gap-md: 24px;

			--gap-sm: 16px;

			

			/* Typography */

			--font-base: 'Inter', sans-serif;

			--font-display: 'Inter Tight', sans-serif;

			

			/* Animations */

			--transition-base: 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Shadows */

			--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);

			--shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);

			--shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);

			--shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);

			

			/* Base Styles */

			font-family: var(--font-base);

			font-size: 16px;

			line-height: 1.6;

			color: var(--muted);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-litpara--wrapper * {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		.ccl-litpara--wrapper main {

			overflow-x: hidden;

		}

		

		/* ================================

		   TYPOGRAPHY

		   ================================ */

		.ccl-litpara--wrapper h1,

		.ccl-litpara--wrapper h2,

		.ccl-litpara--wrapper h3,

		.ccl-litpara--wrapper h4 {

			font-family: var(--font-display);

			color: var(--ink);

			font-weight: 800;

			line-height: 1.2;

			margin-bottom: 1rem;

		}

		

		.ccl-litpara--wrapper h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

		}

		

		.ccl-litpara--wrapper h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

		}

		

		.ccl-litpara--wrapper h3 {

			font-size: clamp(1.5rem, 3vw, 1.75rem);

		}

		

		.ccl-litpara--wrapper p {

			font-size: 1.05rem;

			line-height: 1.7;

			margin-bottom: 1rem;

		}

		

		.ccl-litpara--wrapper mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.15) 100%);

			color: var(--primary-blue);

			padding: 0 0.25rem;

			border-radius: 4px;

		}

		

		/* ================================

		   HERO SECTION

		   ================================ */

		.ccl-litpara--hero {

			position: relative;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			padding: 120px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-litpara--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-litpara--glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-litpara--glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-litpara--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-litpara--kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			animation: ccl-litpara--fadeInDown 0.6s ease-out;

		}

		

		.ccl-litpara--kicker::before,

		.ccl-litpara--kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: rgba(255, 255, 255, 0.4);

		}

		

		.ccl-litpara--hero h1 {

			color: var(--white);

			margin-bottom: 28px;

			animation: ccl-litpara--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		.ccl-litpara--hero-lead {

			font-size: 1.3rem;

			color: rgba(255, 255, 255, 0.95);

			max-width: 800px;

			margin: 0 auto 32px;

			line-height: 1.6;

			animation: ccl-litpara--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-litpara--hero-meta {

			display: flex;

			gap: 32px;

			justify-content: center;

			flex-wrap: wrap;

			margin-top: 40px;

			animation: ccl-litpara--fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-litpara--hero-meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: rgba(255, 255, 255, 0.95);

			font-size: 1rem;

			font-weight: 500;

		}

		

		.ccl-litpara--hero-meta-item i {

			font-size: 1.2rem;

			color: var(--accent-green);

		}

		

		.ccl-litpara--hero-cta {

			margin-top: 48px;

			animation: ccl-litpara--fadeInUp 0.8s ease-out 0.8s backwards;

		}

		

		.ccl-litpara--btn--hero {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);

			font-size: 1.15rem;

			padding: 18px 36px;

		}

		

		.ccl-litpara--btn--hero:hover {

			transform: translateY(-3px);

			box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);

			background: var(--white);

			color: var(--primary-blue);

		}

		

		@keyframes ccl-litpara--fadeInDown {

			from { opacity: 0; transform: translateY(-20px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		@keyframes ccl-litpara--fadeInUp {

			from { opacity: 0; transform: translateY(20px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		/* ================================

		   SECTION COMMON STYLES

		   ================================ */

		.ccl-litpara--section {

			padding: var(--section-padding) 24px;

		}

		

		.ccl-litpara--section--alt {

			background: var(--gray-50);

		}

		

		.ccl-litpara--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-litpara--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-litpara--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			color: var(--primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-litpara--section-kicker::before,

		.ccl-litpara--section-kicker::after {

			content: '';

			width: 32px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-litpara--section-lead {

			font-size: 1.2rem;

			color: var(--muted);

			max-width: 700px;

			margin: 0 auto;

		}

		

		/* ================================

		   INTRO SECTION

		   ================================ */

		.ccl-litpara--intro-content {

			max-width: 900px;

			margin: 0 auto;

			text-align: center;

		}

		

		.ccl-litpara--intro-content p {

			font-size: 1.15rem;

			margin-bottom: 1.5rem;

		}

		

		.ccl-litpara--intro-content p:first-of-type {

			font-size: 1.25rem;

			color: var(--ink);

			font-weight: 500;

		}

		

		.ccl-litpara--highlight-box {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05) 0%, rgba(16, 185, 129, 0.05) 100%);

			border-left: 4px solid var(--primary-blue);

			padding: 32px;

			border-radius: 12px;

			margin: 40px 0;

			text-align: left;

		}

		

		.ccl-litpara--highlight-box p {

			font-size: 1.1rem;

			font-weight: 500;

			color: var(--ink);

		}

		

		/* ================================

		   CARD GRID

		   ================================ */

		.ccl-litpara--card-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--gap-lg);

			margin-top: 48px;

		}

		

		.ccl-litpara--card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			transition: all var(--transition-base);

			overflow: hidden;

		}

		

		.ccl-litpara--card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 0;

			background: linear-gradient(90deg, var(--primary-blue) 0%, var(--accent-green) 100%);

			transition: height var(--transition-base);

		}

		

		.ccl-litpara--card:hover {

			transform: translateY(-10px);

			box-shadow: var(--shadow-xl);

			border-color: transparent;

		}

		

		.ccl-litpara--card:hover::before {

			height: 4px;

		}

		

		.ccl-litpara--card-icon {

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: all var(--transition-base);

		}

		

		.ccl-litpara--card:hover .ccl-litpara--card-icon {

			transform: rotate(10deg) scale(1.05);

			background: linear-gradient(135deg, var(--accent-green) 0%, var(--primary-blue) 100%);

		}

		

		.ccl-litpara--card-icon i {

			font-size: 2rem;

			color: var(--white);

		}

		

		.ccl-litpara--card h3 {

			margin-bottom: 12px;

			color: var(--ink);

		}

		

		.ccl-litpara--card p {

			color: var(--muted);

			margin-bottom: 0;

		}

		

		/* ================================

		   RESPONSIBILITIES LIST

		   ================================ */

		.ccl-litpara--responsibilities {

			max-width: 900px;

			margin: 48px auto 0;

		}

		

		.ccl-litpara--resp-item {

			display: flex;

			gap: 20px;

			padding: 24px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			margin-bottom: 16px;

			transition: all var(--transition-base);

		}

		

		.ccl-litpara--resp-item:hover {

			border-color: var(--primary-blue);

			box-shadow: var(--shadow-md);

			transform: translateX(8px);

		}

		

		.ccl-litpara--resp-icon {

			flex-shrink: 0;

			width: 48px;

			height: 48px;

			border-radius: 12px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(16, 185, 129, 0.1) 100%);

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--primary-blue);

			font-size: 1.3rem;

		}

		

		.ccl-litpara--resp-content p {

			font-size: 1.05rem;

			color: var(--ink);

			font-weight: 500;

			margin: 0;

		}

		

		/* ================================

		   BENEFITS GRID

		   ================================ */

		.ccl-litpara--benefits-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 24px;

			margin-top: 48px;

		}

		

		.ccl-litpara--benefit-item {

			display: flex;

			gap: 16px;

			padding: 24px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			transition: all var(--transition-base);

		}

		

		.ccl-litpara--benefit-item:hover {

			border-color: var(--accent-green);

			box-shadow: var(--shadow-md);

			transform: translateY(-5px);

		}

		

		.ccl-litpara--benefit-icon {

			flex-shrink: 0;

			width: 40px;

			height: 40px;

			border-radius: 10px;

			background: linear-gradient(135deg, var(--accent-green) 0%, var(--primary-blue) 100%);

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--white);

			font-size: 1.1rem;

		}

		

		.ccl-litpara--benefit-text {

			flex: 1;

		}

		

		.ccl-litpara--benefit-text p {

			font-size: 1rem;

			color: var(--ink);

			font-weight: 500;

			margin: 0;

		}

		

		/* ================================

		   IDEAL CANDIDATE SECTION

		   ================================ */

		.ccl-litpara--qualities {

			max-width: 800px;

			margin: 48px auto 0;

		}

		

		.ccl-litpara--quality-item {

			display: flex;

			align-items: flex-start;

			gap: 20px;

			padding: 28px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-left: 4px solid var(--primary-blue);

			border-radius: 12px;

			margin-bottom: 20px;

			transition: all var(--transition-base);

		}

		

		.ccl-litpara--quality-item:hover {

			border-left-color: var(--accent-green);

			box-shadow: var(--shadow-lg);

			transform: translateX(8px);

		}

		

		.ccl-litpara--quality-check {

			flex-shrink: 0;

			width: 32px;

			height: 32px;

			border-radius: 50%;

			background: var(--accent-green);

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--white);

			font-size: 1rem;

			margin-top: 2px;

		}

		

		.ccl-litpara--quality-text p {

			font-size: 1.05rem;

			color: var(--ink);

			font-weight: 500;

			margin: 0;

		}

		

		/* ================================

		   APPLICATION FORM

		   ================================ */

		.ccl-litpara--form-section {

			background: linear-gradient(135deg, var(--gray-50) 0%, var(--white) 100%);

		}

		

		.ccl-litpara--form-container {

			max-width: 700px;

			margin: 0 auto;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 48px;

			box-shadow: var(--shadow-md);

		}

		

		.ccl-litpara--form-intro {

			text-align: center;

			margin-bottom: 40px;

		}

		

		.ccl-litpara--form-intro h2 {

			margin-bottom: 16px;

		}

		

		.ccl-litpara--form-intro p {

			font-size: 1.1rem;

			color: var(--muted);

		}

		

		.ccl-litpara--form-group {

			margin-bottom: 28px;

		}

		

		.ccl-litpara--form-label {

			display: block;

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ink);

			margin-bottom: 8px;

		}

		

		.ccl-litpara--form-label--required::after {

			content: '*';

			color: #ef4444;

			margin-left: 4px;

		}

		

		.ccl-litpara--form-input,

		.ccl-litpara--form-select,

		.ccl-litpara--form-textarea {

			width: 100%;

			padding: 14px 16px;

			font-size: 1rem;

			font-family: var(--font-base);

			color: var(--ink);

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 12px;

			transition: all var(--transition-base);

			outline: none;

		}

		

		.ccl-litpara--form-input:focus,

		.ccl-litpara--form-select:focus,

		.ccl-litpara--form-textarea:focus {

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-litpara--form-textarea {

			min-height: 120px;

			resize: vertical;

		}

		

		.ccl-litpara--form-file-upload {

			border: 2px dashed var(--soft-border);

			border-radius: 12px;

			padding: 32px;

			text-align: center;

			background: var(--gray-50);

			transition: all var(--transition-base);

			cursor: pointer;

			display: block;

		}

		

		.ccl-litpara--form-file-upload:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-litpara--file-upload-content {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 12px;

		}

		

		.ccl-litpara--form-file-upload i {

			font-size: 2.5rem;

			color: var(--primary-blue);

			display: block;

		}

		

		.ccl-litpara--file-upload-text {

			font-size: 0.95rem;

			color: var(--ink);

			margin: 0;

		}

		

		.ccl-litpara--file-upload-text strong {

			font-weight: 600;

		}

		

		.ccl-litpara--form-file-upload .ccl-litpara--form-help {

			font-size: 0.85rem;

			color: var(--muted);

			margin: 0;

		}

		

		.ccl-litpara--form-file-input {

			display: none;

		}

		

		.ccl-litpara--file-name {

			margin-top: 12px;

			padding: 12px 16px;

			background: rgba(16, 185, 129, 0.1);

			border: 1px solid var(--accent-green);

			border-radius: 8px;

			font-size: 0.9rem;

			color: var(--ink);

			display: none;

		}

		

		.ccl-litpara--file-name.ccl-litpara--visible {

			display: block;

		}

		

		.ccl-litpara--file-name i {

			color: var(--accent-green);

			margin-right: 8px;

		}

		

		.ccl-litpara--form-help {

			font-size: 0.85rem;

			color: var(--muted);

			margin-top: 6px;

		}

		

		.ccl-litpara--form-questions {

			background: var(--gray-50);

			border-radius: 12px;

			padding: 24px;

			margin: 32px 0;

		}

		

		.ccl-litpara--form-questions h3 {

			font-size: 1.2rem;

			margin-bottom: 20px;

			color: var(--ink);

		}

		

		.ccl-litpara--form-questions ul {

			list-style: none;

			padding: 0;

		}

		

		.ccl-litpara--form-questions li {

			padding: 12px 0 12px 32px;

			position: relative;

			color: var(--muted);

			font-size: 0.95rem;

		}

		

		.ccl-litpara--form-questions li::before {

			content: '\f059';

			font-family: 'Font Awesome 6 Free';

			font-weight: 400;

			position: absolute;

			left: 0;

			color: var(--primary-blue);

		}

		

		/* ================================

		   BUTTONS

		   ================================ */

		.ccl-litpara--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 32px;

			font-size: 1.05rem;

			font-weight: 600;

			font-family: var(--font-base);

			text-decoration: none;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all var(--transition-base);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-litpara--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-litpara--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-litpara--btn--primary {

			background: linear-gradient(135deg, var(--cta-blue) 0%, var(--cta-dark) 100%);

			color: var(--white);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-litpara--btn--primary:hover {

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(11, 92, 255, 0.4);

		}

		

		.ccl-litpara--btn--secondary {

			background: var(--white);

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-litpara--btn--secondary:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: var(--shadow-md);

		}

		

		.ccl-litpara--btn--full {

			width: 100%;

			justify-content: center;

		}

		

		.ccl-litpara--btn i {

			position: relative;

			z-index: 1;

		}

		

		.ccl-litpara--btn span {

			position: relative;

			z-index: 1;

		}

		

		/* ================================

		   CTA SECTION

		   ================================ */

		.ccl-litpara--cta {

			text-align: center;

			padding: 80px 24px;

			background: linear-gradient(135deg, var(--primary-blue) 0%, var(--cta-dark) 100%);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-litpara--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 100%;

			height: 100%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-litpara--glow 10s ease-in-out infinite;

		}

		

		.ccl-litpara--cta-content {

			position: relative;

			z-index: 1;

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-litpara--cta h2 {

			color: var(--white);

			margin-bottom: 20px;

		}

		

		.ccl-litpara--cta p {

			color: rgba(255, 255, 255, 0.9);

			font-size: 1.2rem;

			margin-bottom: 32px;

		}

		

		/* ================================

		   SCROLL REVEAL ANIMATIONS

		   ================================ */

		.ccl-litpara--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-litpara--scroll-reveal.ccl-litpara--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ================================

		   RESPONSIVE DESIGN

		   ================================ */

		@media (max-width: 1024px) {

			.ccl-litpara--wrapper {

				--section-padding: 80px;

				--card-padding: 32px;

			}

			

			.ccl-litpara--card-grid {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

				gap: 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-litpara--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

				font-size: 15px;

			}

			

			.ccl-litpara--hero {

				padding: 80px 20px 60px;

			}

			

			.ccl-litpara--section {

				padding: 60px 20px;

			}

			

			.ccl-litpara--card-grid,

			.ccl-litpara--benefits-grid {

				grid-template-columns: 1fr;

				gap: 20px;

			}

			

			.ccl-litpara--form-container {

				padding: 32px 24px;

			}

			

			.ccl-litpara--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-litpara--wrapper {

				--section-padding: 48px;

				--card-padding: 24px;

			}

			

			.ccl-litpara--hero {

				padding: 60px 16px 48px;

			}

			

			.ccl-litpara--section {

				padding: 48px 16px;

			}

			

			.ccl-litpara--kicker::before,

			.ccl-litpara--kicker::after,

			.ccl-litpara--section-kicker::before,

			.ccl-litpara--section-kicker::after {

				width: 24px;

			}

			

			.ccl-litpara--form-container {

				padding: 24px 20px;

			}

			

			.ccl-litpara--btn {

				padding: 14px 24px;

				font-size: 1rem;

			}

		}

		/* ============================================

		   CARTER CAPNER LAW - GLOSSARY PAGE STYLES

		   ============================================ */

		

		.ccl-glossary--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--light-bg: #f8fafc;

			

			/* Typography */

			--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', var(--font-primary);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 32px;

			--gap-lg: 32px;

			--gap-md: 24px;

			--gap-sm: 16px;

			

			/* Effects */

			--transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);

			--shadow-md: 0 8px 24px rgba(0, 0, 0, 0.12);

			--shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.18);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			box-sizing: border-box;

			font-family: var(--font-primary);

			color: var(--ink);

			background: var(--white);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-glossary--wrapper *,

		.ccl-glossary--wrapper *::before,

		.ccl-glossary--wrapper *::after {

			box-sizing: inherit;

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		

		.ccl-glossary--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-glossary--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-glossary--glow 15s ease-in-out infinite;

		}

		

		@keyframes ccl-glossary--glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(10%, 10%) scale(1.1); }

		}

		

		.ccl-glossary--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-glossary--kicker {

			display: inline-block;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 20px;

			padding: 8px 20px;

			background: rgba(255, 255, 255, 0.15);

			border-radius: 50px;

			backdrop-filter: blur(10px);

			animation: ccl-glossary--fadeInDown 0.8s ease-out;

		}

		

		.ccl-glossary--hero h1 {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--white);

			margin: 0 0 24px 0;

			line-height: 1.1;

			animation: ccl-glossary--fadeInUp 0.8s ease-out 0.2s both;

		}

		

		.ccl-glossary--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			margin: 0 auto 32px;

			max-width: 750px;

			line-height: 1.7;

			animation: ccl-glossary--fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-glossary--hero-cta {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: var(--white);

			color: var(--cta-blue);

			padding: 16px 32px;

			border-radius: 50px;

			font-weight: 700;

			font-size: 1.05rem;

			text-decoration: none;

			transition: var(--transition);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);

			animation: ccl-glossary--fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-glossary--hero-cta:hover {

			transform: translateY(-3px);

			box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);

			color: var(--cta-dark);

		}

		

		@keyframes ccl-glossary--fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		@keyframes ccl-glossary--fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		/* ============================================

		   CONTENT LAYOUT WITH SIDEBAR

		   ============================================ */

		

		.ccl-glossary--content-wrapper {

			display: flex;

			gap: 48px;

			max-width: 1400px;

			margin: 0 auto;

			padding: var(--section-padding) 24px;

			align-items: flex-start;

		}

		

		/* ============================================

		   ALPHABET NAVIGATION SIDEBAR

		   ============================================ */

		

		.ccl-glossary--alphabet-nav {

			position: sticky;

			top: 150px;

			flex-shrink: 0;

			width: 80px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			padding: 20px 12px;

			box-shadow: var(--shadow-sm);

			transition: var(--transition);

		}

		

		.ccl-glossary--alphabet-nav:hover {

			box-shadow: var(--shadow-md);

			border-color: var(--primary-blue);

		}

		

		.ccl-glossary--alphabet-list {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 6px;

			list-style: none;

			padding: 0;

			margin: 0;

		}

		

		.ccl-glossary--alphabet-link {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 44px;

			height: 44px;

			font-weight: 700;

			font-size: 0.95rem;

			color: var(--muted);

			text-decoration: none;

			border-radius: 10px;

			transition: var(--transition);

			border: 2px solid transparent;

			position: relative;

		}

		

		.ccl-glossary--alphabet-link::after {

			content: '';

			position: absolute;

			left: -16px;

			top: 50%;

			transform: translateY(-50%) scaleX(0);

			width: 6px;

			height: 24px;

			background: var(--primary-blue);

			border-radius: 3px;

			transition: var(--transition);

			transform-origin: left center;

		}

		

		.ccl-glossary--alphabet-link:hover {

			background: var(--light-bg);

			color: var(--primary-blue);

			border-color: var(--primary-blue);

			transform: scale(1.1);

		}

		

		.ccl-glossary--alphabet-link.ccl-glossary--active {

			background: var(--primary-blue);

			color: var(--white);

			border-color: var(--primary-blue);

			transform: scale(1.15);

		}

		

		.ccl-glossary--alphabet-link.ccl-glossary--active::after {

			transform: translateY(-50%) scaleX(1);

		}

		

		.ccl-glossary--alphabet-link.ccl-glossary--disabled {

			opacity: 0.25;

			cursor: not-allowed;

			pointer-events: none;

		}

		

		/* ============================================

		   MOBILE DROPDOWN NAVIGATION (BOTTOM STICKY)

		   ============================================ */

		

		.ccl-glossary--mobile-nav {

			display: none; /* Hidden on desktop */

			position: fixed;

			bottom: 0;

			left: 0;

			right: 0;

			background: var(--white);

			border-top: 2px solid var(--soft-border);

			padding: 16px 20px;

			box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.12);

			z-index: 1000;

			animation: ccl-glossary--slideInUp 0.4s ease-out;

		}

		

		@keyframes ccl-glossary--slideInUp {

			from {

				opacity: 0;

				transform: translateY(100%);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-glossary--mobile-nav-label {

			display: flex;

			align-items: center;

			gap: 10px;

			font-size: 0.9rem;

			font-weight: 600;

			color: var(--ink);

			margin-bottom: 10px;

		}

		

		.ccl-glossary--mobile-nav-label i {

			color: var(--primary-blue);

			font-size: 1.1rem;

		}

		

		.ccl-glossary--mobile-nav-select {

			width: 100%;

			padding: 14px 16px;

			font-family: var(--font-primary);

			font-size: 1rem;

			font-weight: 500;

			color: var(--ink);

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 12px;

			cursor: pointer;

			transition: var(--transition);

			appearance: none;

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231d63ff' d='M6 9L1 4h10z'/%3E%3C/svg%3E");

			background-repeat: no-repeat;

			background-position: right 16px center;

			padding-right: 44px;

		}

		

		.ccl-glossary--mobile-nav-select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-glossary--mobile-nav-select option {

			padding: 12px;

			font-weight: 500;

		}

		

		/* ============================================

		   MAIN CONTENT

		   ============================================ */

		

		.ccl-glossary--main {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-glossary--intro {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 80px;

		}

		

		.ccl-glossary--intro-text {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.8;

			margin: 0 0 32px 0;

		}

		

		.ccl-glossary--contact-banner {

			background: linear-gradient(135deg, var(--light-bg) 0%, var(--white) 100%);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			padding: 28px 32px;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-glossary--contact-text {

			font-size: 1.05rem;

			color: var(--ink);

			margin: 0;

		}

		

		.ccl-glossary--contact-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--cta-blue);

			font-weight: 700;

			font-size: 1.15rem;

			text-decoration: none;

			transition: var(--transition);

		}

		

		.ccl-glossary--contact-link:hover {

			color: var(--cta-dark);

			gap: 12px;

		}

		

		/* ============================================

		   LETTER SECTIONS

		   ============================================ */

		

		.ccl-glossary--letter-section {

			margin-bottom: 80px;

			scroll-margin-top: 80px;

		}

		

		.ccl-glossary--letter-header {

			display: flex;

			align-items: center;

			gap: 24px;

			margin-bottom: 40px;

			padding-bottom: 16px;

			border-bottom: 3px solid var(--primary-blue);

		}

		

		.ccl-glossary--letter-icon {

			width: 80px;

			height: 80px;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			display: flex;

			align-items: center;

			justify-content: center;

			font-family: var(--font-display);

			font-size: 2.5rem;

			font-weight: 900;

			border-radius: 16px;

			box-shadow: var(--shadow-md);

			flex-shrink: 0;

		}

		

		.ccl-glossary--letter-title {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			color: var(--ink);

			margin: 0;

		}

		

		.ccl-glossary--terms-grid {

			display: grid;

			gap: 24px;

		}

		

		/* ============================================

		   TERM CARDS

		   ============================================ */

		

		.ccl-glossary--term-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			padding: var(--card-padding);

			transition: var(--transition);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-glossary--term-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-4px);

			transition: var(--transition);

		}

		

		.ccl-glossary--term-card:hover {

			border-color: var(--primary-blue);

			box-shadow: var(--shadow-md);

			transform: translateY(-4px);

		}

		

		.ccl-glossary--term-card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-glossary--term-name {

			font-family: var(--font-display);

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ink);

			margin: 0 0 12px 0;

			display: flex;

			align-items: center;

			gap: 12px;

		}

		

		.ccl-glossary--term-icon {

			width: 12px;

			height: 12px;

			background: var(--primary-blue);

			border-radius: 50%;

			flex-shrink: 0;

		}

		

		.ccl-glossary--term-definition {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.8;

			margin: 0;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATIONS

		   ============================================ */

		

		.ccl-glossary--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-glossary--scroll-reveal.ccl-glossary--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   BACK TO TOP BUTTON

		   ============================================ */

		

		.ccl-glossary--back-to-top {

			position: fixed;

			bottom: 32px;

			right: 32px;

			width: 56px;

			height: 56px;

			background: var(--primary-blue);

			color: var(--white);

			border: none;

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 1.25rem;

			cursor: pointer;

			box-shadow: var(--shadow-md);

			opacity: 0;

			visibility: hidden;

			transform: translateY(20px);

			transition: var(--transition);

			z-index: 999;

		}

		

		.ccl-glossary--back-to-top.ccl-glossary--visible {

			opacity: 1;

			visibility: visible;

			transform: translateY(0);

		}

		

		.ccl-glossary--back-to-top:hover {

			background: var(--cta-dark);

			transform: translateY(-4px);

			box-shadow: var(--shadow-lg);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		

		@media (max-width: 1024px) {

			.ccl-glossary--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

			}

			

			.ccl-glossary--hero {

				padding: 100px 24px 60px;

			}

			

			.ccl-glossary--content-wrapper {

				gap: 32px;

				padding: 80px 24px;

			}

			

			.ccl-glossary--alphabet-nav {

				width: 70px;

				padding: 16px 10px;

			}

			

			.ccl-glossary--alphabet-link {

				width: 40px;

				height: 40px;

				font-size: 0.9rem;

			}

			

			.ccl-glossary--letter-icon {

				width: 70px;

				height: 70px;

				font-size: 2rem;

			}

			

			.ccl-glossary--letter-title {

				font-size: 1.75rem;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-glossary--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

			}

			

			.ccl-glossary--hero {

				padding: 80px 20px 50px;

			}

			

			/* Hide desktop sidebar navigation on mobile */

			.ccl-glossary--alphabet-nav {

				display: none;

			}

			

			/* Show mobile dropdown navigation */

			.ccl-glossary--mobile-nav {

				display: block;

			}

			

			/* Adjust content wrapper for mobile */

			.ccl-glossary--content-wrapper {

				flex-direction: column;

				gap: 0;

				padding: 0;

			}

			

			.ccl-glossary--main {

				padding: 60px 20px 120px; /* Extra bottom padding for fixed nav */

			}

			

			.ccl-glossary--intro {

				margin-bottom: 60px;

			}

			

			.ccl-glossary--contact-banner {

				padding: 24px;

				text-align: center;

			}

			

			.ccl-glossary--letter-section {

				margin-bottom: 60px;

			}

			

			.ccl-glossary--letter-header {

				gap: 16px;

				margin-bottom: 32px;

			}

			

			.ccl-glossary--letter-icon {

				width: 60px;

				height: 60px;

				font-size: 1.75rem;

			}

			

			.ccl-glossary--letter-title {

				font-size: 1.5rem;

			}

			

			.ccl-glossary--term-name {

				font-size: 1.25rem;

			}

			

			/* Move back to top button up to avoid dropdown */

			.ccl-glossary--back-to-top {

				bottom: 100px; /* Above the fixed dropdown nav */

				right: 24px;

				width: 50px;

				height: 50px;

				font-size: 1.1rem;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-glossary--wrapper {

				--section-padding: 50px;

				--card-padding: 20px;

			}

			

			.ccl-glossary--hero {

				padding: 70px 16px 40px;

			}

			

			.ccl-glossary--kicker {

				font-size: 0.8rem;

				padding: 6px 16px;

			}

			

			.ccl-glossary--mobile-nav {

				padding: 14px 16px;

			}

			

			.ccl-glossary--mobile-nav-label {

				font-size: 0.85rem;

				margin-bottom: 8px;

			}

			

			.ccl-glossary--mobile-nav-select {

				padding: 12px 14px;

				font-size: 0.95rem;

				padding-right: 40px;

			}

			

			.ccl-glossary--main {

				padding: 50px 16px 110px; /* Extra bottom padding */

			}

			

			.ccl-glossary--contact-banner {

				padding: 20px;

				gap: 12px;

			}

			

			.ccl-glossary--contact-text {

				font-size: 0.95rem;

			}

			

			.ccl-glossary--contact-link {

				font-size: 1rem;

			}

			

			.ccl-glossary--letter-header {

				flex-direction: column;

				align-items: flex-start;

				gap: 12px;

			}

			

			.ccl-glossary--letter-icon {

				width: 56px;

				height: 56px;

				font-size: 1.5rem;

			}

			

			.ccl-glossary--back-to-top {

				bottom: 90px; /* Above the mobile nav */

				right: 20px;

				width: 48px;

				height: 48px;

			}

		}

		.ccl-workfeed--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--background-light: #f8fafc;

			

			/* Typography */

			--font-inter: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-inter-tight: 'Inter Tight', var(--font-inter);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 32px;

			--grid-gap: 32px;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Shadows */

			--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);

			--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);

			--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

			--shadow-xl: 0 12px 40px rgba(0, 0, 0, 0.15);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-inter);

			color: var(--ink);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}

		

		.ccl-workfeed--wrapper main {

			background: var(--white);

			overflow-x: hidden;

		}

		

		.ccl-workfeed--wrapper section {

			position: relative;

		}

		

		.ccl-workfeed--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		/* Hero Section */

		.ccl-workfeed--hero {

			position: relative;

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 50%, #0f172a 100%);

			padding: 60px 0px 40px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-workfeed--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: 

				radial-gradient(circle at 20% 50%, rgba(29, 99, 255, 0.15) 0%, transparent 50%),

				radial-gradient(circle at 80% 80%, rgba(11, 92, 255, 0.1) 0%, transparent 50%);

			animation: ccl-workfeed--pulse 8s ease-in-out infinite;

		}

		

		@keyframes ccl-workfeed--pulse {

			0%, 100% { opacity: 0.5; transform: scale(1); }

			50% { opacity: 1; transform: scale(1.05); }

		}

		

		.ccl-workfeed--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-workfeed--kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(29, 99, 255, 0.15);

			backdrop-filter: blur(12px);

			border: 1px solid rgba(29, 99, 255, 0.3);

			padding: 12px 24px;

			border-radius: 100px;

			color: rgba(255, 255, 255, 0.95);

			font-size: 0.875rem;

			font-weight: 700;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 32px;

			animation: ccl-workfeed--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-workfeed--fadeInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-workfeed--kicker i {

			font-size: 1rem;

			color: var(--primary-blue);

		}

		

		.ccl-workfeed--hero h1 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.5rem, 5vw, 4.75rem);

			color: var(--white);

			margin: 0 0 28px;

			line-height: 1.05;

			letter-spacing: -0.02em;

			animation: ccl-workfeed--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-workfeed--fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-workfeed--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.4rem);

			color: rgba(255, 255, 255, 0.85);

			max-width: 750px;

			margin: 0 auto 40px;

			line-height: 1.6;

			font-weight: 400;

			animation: ccl-workfeed--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-workfeed--hero-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* Modern Button Styles */

		.ccl-workfeed--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 18px 32px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1rem;

			text-decoration: none;

			transition: var(--transition-base);

			border: none;

			cursor: pointer;

			position: relative;

			overflow: visible;

			font-family: var(--font-inter);

			white-space: nowrap;

		}

		

		.ccl-workfeed--btn i {

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			font-size: 0.95rem;

		}

		

		.ccl-workfeed--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-workfeed--btn--primary {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.4);

			animation: ccl-workfeed--fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-workfeed--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.5);

		}

		

		.ccl-workfeed--btn--primary:active {

			transform: translateY(0);

		}

		

		.ccl-workfeed--btn--secondary {

			background: rgba(255, 255, 255, 0.12);

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.4);

			backdrop-filter: blur(10px);

		}

		

		.ccl-workfeed--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.2);

			border-color: rgba(255, 255, 255, 0.6);

			transform: translateY(-2px);

		}

		

		.ccl-workfeed--btn--outline {

			background: transparent;

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-workfeed--btn--outline:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-workfeed--btn--white {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-workfeed--btn--white:hover {

			background: var(--white);

			color: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);

		}

		

		/* Feed Section */

		.ccl-workfeed--feed {

			padding: var(--section-padding) 24px;

			background: var(--background-light);

		}

		

		.ccl-workfeed--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-workfeed--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 48px;

		}

		

		.ccl-workfeed--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.875rem;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 16px;

		}

		

		.ccl-workfeed--section-kicker::before,

		.ccl-workfeed--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-workfeed--section-kicker::before {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-workfeed--section-header h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			color: var(--ink);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-workfeed--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 6px;

		}

		

		.ccl-workfeed--section-header p {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Filter Bar */

		.ccl-workfeed--filter-bar {

			background: var(--white);

			border-radius: 16px;

			padding: 20px 28px;

			margin-bottom: 48px;

			box-shadow: var(--shadow-md);

			border: 1px solid var(--soft-border);

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 20px;

			flex-wrap: wrap;

			position: sticky;

			top: 20px;

			z-index: 100;

			backdrop-filter: blur(10px);

			background: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-workfeed--filter-group {

			display: flex;

			align-items: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-workfeed--filter-label {

			font-size: 0.875rem;

			font-weight: 700;

			color: var(--ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-workfeed--filter-label i {

			color: var(--primary-blue);

			font-size: 1rem;

		}

		

		/* Sort Dropdown */

		.ccl-workfeed--sort-select {

			position: relative;

		}

		

		.ccl-workfeed--select {

			appearance: none;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			padding: 12px 40px 12px 16px;

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ink);

			cursor: pointer;

			transition: var(--transition-base);

			font-family: var(--font-inter);

			min-width: 150px;

		}

		

		.ccl-workfeed--select:hover {

			border-color: var(--primary-blue);

			background: var(--background-light);

		}

		

		.ccl-workfeed--select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-workfeed--sort-select::after {

			content: '\f078';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			right: 16px;

			top: 50%;

			transform: translateY(-50%);

			pointer-events: none;

			color: var(--primary-blue);

			font-size: 0.75rem;

		}

		

		/* Layout Toggle */

		.ccl-workfeed--layout-toggle {

			display: flex;

			background: var(--background-light);

			border-radius: 10px;

			padding: 4px;

			gap: 4px;

			border: 1px solid var(--soft-border);

		}

		

		.ccl-workfeed--layout-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 44px;

			height: 44px;

			border-radius: 8px;

			background: transparent;

			border: none;

			cursor: pointer;

			transition: var(--transition-base);

			color: var(--muted);

			font-size: 1.1rem;

		}

		

		.ccl-workfeed--layout-btn:hover {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

		}

		

		.ccl-workfeed--layout-btn.ccl-workfeed--active {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-workfeed--layout-btn.ccl-workfeed--active:hover {

			background: var(--cta-dark);

		}

		

		/* Results Count */

		.ccl-workfeed--results-count {

			font-size: 0.9rem;

			color: var(--muted);

			font-weight: 500;

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-workfeed--results-count strong {

			color: var(--ink);

			font-weight: 700;

		}

		

		/* Article Grid */

		.ccl-workfeed--grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));

			gap: var(--grid-gap);

			margin-bottom: 56px;

			transition: var(--transition-base);

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view {

			grid-template-columns: 1fr;

		}

		

		.ccl-workfeed--article-card {

			position: relative;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 16px;

			padding: var(--card-padding);

			transition: var(--transition-base);

			overflow: hidden;

			opacity: 0;

			transform: translateY(40px);

			display: flex;

			flex-direction: column;

		}

		

		.ccl-workfeed--article-card.ccl-workfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		.ccl-workfeed--article-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 3px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-3px);

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-workfeed--article-card:hover {

			transform: translateY(-6px);

			box-shadow: var(--shadow-lg);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-workfeed--article-card:hover::before {

			transform: translateY(0);

		}

		

		/* List View Specific Styles */

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-card {

			flex-direction: row;

			align-items: flex-start;

			gap: 24px;

			padding: 28px;

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-main {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-sidebar {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 12px;

			min-width: 80px;

		}

		

		.ccl-workfeed--article-meta {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 16px;

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-meta {

			margin-bottom: 12px;

		}

		

		.ccl-workfeed--article-icon {

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 14px;

			font-size: 1.5rem;

			transition: var(--transition-base);

			flex-shrink: 0;

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-icon {

			width: 64px;

			height: 64px;

			font-size: 1.75rem;

		}

		

		.ccl-workfeed--article-card:hover .ccl-workfeed--article-icon {

			transform: rotate(5deg) scale(1.05);

			box-shadow: 0 8px 16px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-workfeed--article-date {

			font-size: 0.875rem;

			color: var(--muted);

			font-weight: 600;

		}

		

		.ccl-workfeed--article-title {

			font-family: var(--font-inter-tight);

			font-weight: 800;

			font-size: 1.35rem;

			color: var(--ink);

			margin: 0 0 12px;

			line-height: 1.3;

			transition: color 0.3s ease;

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-title {

			font-size: 1.5rem;

			margin-bottom: 10px;

		}

		

		.ccl-workfeed--article-card:hover .ccl-workfeed--article-title {

			color: var(--primary-blue);

		}

		

		.ccl-workfeed--article-excerpt {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0 0 20px;

			flex-grow: 1;

		}

		

		.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-excerpt {

			font-size: 1.1rem;

			margin-bottom: 16px;

		}

		

		.ccl-workfeed--article-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--primary-blue);

			font-weight: 700;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			margin-top: auto;

		}

		

		.ccl-workfeed--article-link i {

			transition: transform 0.3s ease;

		}

		

		.ccl-workfeed--article-link:hover {

			color: var(--cta-dark);

			gap: 12px;

		}

		

		.ccl-workfeed--article-link:hover i {

			transform: translateX(4px);

		}

		

		/* Pagination */

		.ccl-workfeed--pagination {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			flex-wrap: wrap;

			padding: 40px 0;

		}

		

		.ccl-workfeed--page-btn {

			min-width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 12px;

			color: var(--ink);

			font-weight: 600;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			padding: 0 16px;

		}

		

		.ccl-workfeed--page-btn:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.05);

			color: var(--primary-blue);

			transform: translateY(-2px);

			box-shadow: var(--shadow-sm);

		}

		

		.ccl-workfeed--page-btn--active {

			background: var(--primary-blue);

			border-color: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-workfeed--page-btn--active:hover {

			transform: none;

			background: var(--cta-dark);

			border-color: var(--cta-dark);

		}

		

		.ccl-workfeed--page-ellipsis {

			color: var(--muted);

			padding: 0 8px;

			font-weight: 600;

		}

		

		/* CTA Section */

		.ccl-workfeed--cta {

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-workfeed--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-workfeed--cta::after {

			content: '';

			position: absolute;

			bottom: -50%;

			left: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-workfeed--cta-content {

			position: relative;

			z-index: 2;

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-workfeed--cta h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2rem, 4vw, 3.25rem);

			color: var(--white);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-workfeed--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.85);

			line-height: 1.7;

			margin: 0 0 36px;

		}

		

		.ccl-workfeed--cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

			margin-top: 8px;

		}

		

		/* Scroll Reveal */

		.ccl-workfeed--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-workfeed--scroll-reveal.ccl-workfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-workfeed--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

				--grid-gap: 28px;

			}

			

			.ccl-workfeed--grid {

				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

			}

			

			.ccl-workfeed--filter-bar {

				padding: 18px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-workfeed--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

				--grid-gap: 24px;

			}

			

			.ccl-workfeed--hero {

				padding: 120px 20px 100px;

			}

			

			.ccl-workfeed--hero-buttons {

				justify-content: center;

			}

			

			.ccl-workfeed--grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-workfeed--section-header {

				margin-bottom: 40px;

			}

			

			/* Mobile Filter Bar */

			.ccl-workfeed--filter-bar {

				flex-direction: column;

				align-items: stretch;

				padding: 20px;

				gap: 16px;

				top: 10px;

			}

			

			.ccl-workfeed--filter-group {

				width: 100%;

				justify-content: space-between;

			}

			

			.ccl-workfeed--filter-label {

				font-size: 0.8rem;

				white-space: nowrap;

			}

			

			.ccl-workfeed--sort-select {

				flex: 1;

			}

			

			.ccl-workfeed--select {

				width: 100%;

				padding: 10px 36px 10px 14px;

				font-size: 0.9rem;

			}

			

			.ccl-workfeed--layout-toggle {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-workfeed--layout-btn {

				flex: 1;

				max-width: 120px;

			}

			

			.ccl-workfeed--results-count {

				justify-content: center;

				padding-top: 8px;

				border-top: 1px solid var(--soft-border);

			}

			

			/* List View on Mobile */

			.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-card {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-sidebar {

				flex-direction: row;

				width: 100%;

				justify-content: flex-start;

			}

			

			.ccl-workfeed--grid.ccl-workfeed--list-view .ccl-workfeed--article-icon {

				width: 56px;

				height: 56px;

				font-size: 1.5rem;

			}

			

			.ccl-workfeed--pagination {

				gap: 6px;

			}

			

			.ccl-workfeed--page-btn {

				min-width: 44px;

				height: 44px;

				font-size: 0.9rem;

				padding: 0 12px;

			}

			

			.ccl-workfeed--cta-buttons {

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-workfeed--wrapper {

				--section-padding: 48px;

				--card-padding: 20px;

			}

			

			.ccl-workfeed--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-workfeed--feed,

			.ccl-workfeed--cta {

				padding-left: 16px;

				padding-right: 16px;

			}

			

			.ccl-workfeed--kicker {

				font-size: 0.75rem;

				padding: 10px 18px;

				gap: 8px;

			}

			

			.ccl-workfeed--article-title {

				font-size: 1.2rem;

			}

			

			.ccl-workfeed--filter-bar {

				padding: 16px;

				border-radius: 12px;

			}

			

			.ccl-workfeed--filter-label {

				font-size: 0.75rem;

			}

			

			.ccl-workfeed--layout-btn {

				font-size: 1rem;

				width: 40px;

				height: 40px;

			}

		}

		/* ============================================

		   CSS VARIABLES & BASE STYLES (SCOPED TO WRAPPER)

		   ============================================ */

		.ccl-workaccident--wrapper {

			/* Brand Colors */

			--ccl-workaccident-primary-blue: #1d63ff;

			--ccl-workaccident-cta-blue: #0b5cff;

			--ccl-workaccident-cta-dark: #0846c1;

			--ccl-workaccident-accent-green: #10b981;

			--ccl-workaccident-accent-gold: #ffa826;

			--ccl-workaccident-ink: #1e293b;

			--ccl-workaccident-muted: #64748b;

			--ccl-workaccident-soft-border: #e5e7eb;

			

			/* Semantic Colors */

			--ccl-workaccident-white: #ffffff;

			--ccl-workaccident-light-bg: #f8fafc;

			--ccl-workaccident-warning-red: #ef4444;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-workaccident-muted);

			

			/* Box Model Reset */

			box-sizing: border-box;

		}

		

		.ccl-workaccident--wrapper *,

		.ccl-workaccident--wrapper *::before,

		.ccl-workaccident--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-workaccident--wrapper main {

			display: block;

		}

		

		/* ============================================

		   TYPOGRAPHY

		   ============================================ */

		.ccl-workaccident--wrapper h1,

		.ccl-workaccident--wrapper h2,

		.ccl-workaccident--wrapper h3,

		.ccl-workaccident--wrapper h4 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			color: var(--ccl-workaccident-ink);

			line-height: 1.2;

		}

		

		.ccl-workaccident--wrapper h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			margin-bottom: 1.5rem;

		}

		

		.ccl-workaccident--wrapper h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 1.25rem;

		}

		

		.ccl-workaccident--wrapper h3 {

			font-size: clamp(1.5rem, 3vw, 1.75rem);

			margin-bottom: 1rem;

		}

		

		.ccl-workaccident--wrapper p {

			margin-bottom: 1rem;

			font-size: 1.05rem;

		}

		

		.ccl-workaccident--wrapper a {

			color: var(--ccl-workaccident-primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-workaccident--wrapper a:hover {

			color: var(--ccl-workaccident-cta-dark);

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		.ccl-workaccident--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-workaccident--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-workaccident-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-workaccident-glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-workaccident--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-workaccident--kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			animation: ccl-workaccident-fadeInDown 0.8s ease-out;

		}

		

		.ccl-workaccident--kicker::before,

		.ccl-workaccident--kicker::after {

			content: '';

			display: block;

			width: 40px;

			height: 2px;

			background: rgba(255, 255, 255, 0.5);

		}

		

		@keyframes ccl-workaccident-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-workaccident--hero h1 {

			color: var(--ccl-workaccident-white);

			margin-bottom: 28px;

			animation: ccl-workaccident-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-workaccident-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-workaccident--hero-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 800px;

			margin: 0 auto 32px;

			animation: ccl-workaccident-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-workaccident--hero-meta {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 24px;

			margin-top: 32px;

			animation: ccl-workaccident-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-workaccident--meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.95rem;

		}

		

		.ccl-workaccident--meta-item i {

			font-size: 1.1rem;

			color: var(--ccl-workaccident-accent-gold);

		}

		

		/* ============================================

		   SECTION STRUCTURE

		   ============================================ */

		.ccl-workaccident--section {

			padding: 100px 24px;

			background: var(--ccl-workaccident-white);

		}

		

		.ccl-workaccident--section:nth-child(even) {

			background: var(--ccl-workaccident-light-bg);

		}

		

		.ccl-workaccident--section-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-workaccident--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-workaccident--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: var(--ccl-workaccident-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-workaccident--section-kicker::before,

		.ccl-workaccident--section-kicker::after {

			content: '';

			display: block;

			width: 30px;

			height: 2px;

			background: var(--ccl-workaccident-primary-blue);

		}

		

		.ccl-workaccident--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, var(--ccl-workaccident-accent-gold) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-workaccident--lead {

			font-size: 1.15rem;

			line-height: 1.7;

			color: var(--ccl-workaccident-muted);

			margin-top: 20px;

		}

		

		/* ============================================

		   TWO-COLUMN LAYOUT WITH SIDEBAR

		   ============================================ */

		.ccl-workaccident--content-layout {

			display: grid;

			grid-template-columns: 1fr 380px;

			gap: 48px;

			align-items: start;

		}

		

		.ccl-workaccident--main-content {

			min-width: 0;

		}

		

		/* ============================================

		   SIDEBAR - ACCIDENT DETAILS

		   ============================================ */

		.ccl-workaccident--sidebar {

			position: sticky;

			top: 150px;

		}

		

		.ccl-workaccident--sidebar-card {

			background: var(--ccl-workaccident-white);

			border: 2px solid var(--ccl-workaccident-soft-border);

			border-radius: 20px;

			padding: 0;

			position: relative;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

		}

		

		.ccl-workaccident--sidebar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-workaccident-primary-blue) 0%, var(--ccl-workaccident-accent-gold) 100%);

		}

		

		.ccl-workaccident--sidebar-header {

			padding: 28px 28px 20px;

			border-bottom: 2px solid var(--ccl-workaccident-soft-border);

		}

		

		.ccl-workaccident--sidebar-title {

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-workaccident-ink);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-workaccident--sidebar-title i {

			color: var(--ccl-workaccident-primary-blue);

			font-size: 1.4rem;

		}

		

		.ccl-workaccident--sidebar-subtitle {

			font-size: 0.9rem;

			color: var(--ccl-workaccident-muted);

			line-height: 1.5;

		}

		

		.ccl-workaccident--sidebar-body {

			padding: 24px 28px 28px;

		}

		

		.ccl-workaccident--detail-item {

			padding: 16px 0;

			border-bottom: 1px solid var(--ccl-workaccident-soft-border);

		}

		

		.ccl-workaccident--detail-item:last-child {

			border-bottom: none;

			padding-bottom: 0;

		}

		

		.ccl-workaccident--detail-item:first-child {

			padding-top: 0;

		}

		

		.ccl-workaccident--detail-label {

			display: flex;

			align-items: center;

			gap: 8px;

			font-size: 0.8rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--ccl-workaccident-muted);

			margin-bottom: 6px;

		}

		

		.ccl-workaccident--detail-label i {

			color: var(--ccl-workaccident-primary-blue);

			font-size: 0.9rem;

		}

		

		.ccl-workaccident--detail-value {

			font-size: 1rem;

			font-weight: 600;

			color: var(--ccl-workaccident-ink);

			line-height: 1.5;

		}

		

		/* Highlight variants for sidebar items */

		.ccl-workaccident--detail-item--highlight {

			background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-workaccident--detail-item--warning {

			background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-workaccident--detail-item--highlight .ccl-workaccident--detail-label i {

			color: var(--ccl-workaccident-primary-blue);

		}

		

		.ccl-workaccident--detail-item--warning .ccl-workaccident--detail-label i {

			color: var(--ccl-workaccident-warning-red);

		}

		

		/* ============================================

		   INTRO BANNER

		   ============================================ */

		.ccl-workaccident--intro-banner {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

			border: 2px solid var(--ccl-workaccident-soft-border);

			border-left: 6px solid var(--ccl-workaccident-primary-blue);

			border-radius: 16px;

			padding: 36px 40px;

			margin-bottom: 48px;

			position: relative;

		}

		

		.ccl-workaccident--intro-banner::before {

			content: '';

			position: absolute;

			top: 20px;

			left: 20px;

			width: 60px;

			height: 60px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(16, 185, 129, 0.1) 100%);

			border-radius: 50%;

			z-index: 0;

		}

		

		.ccl-workaccident--intro-banner-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-workaccident--intro-banner-icon {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 48px;

			height: 48px;

			background: linear-gradient(135deg, var(--ccl-workaccident-primary-blue) 0%, var(--ccl-workaccident-cta-blue) 100%);

			border-radius: 12px;

			margin-bottom: 20px;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-workaccident--intro-banner-icon i {

			color: var(--ccl-workaccident-white);

			font-size: 1.5rem;

		}

		

		.ccl-workaccident--intro-banner h3 {

			font-size: 1.4rem;

			color: var(--ccl-workaccident-ink);

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-workaccident--intro-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-workaccident-muted);

			margin-bottom: 20px;

		}

		

		.ccl-workaccident--intro-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-workaccident--intro-banner strong,

		.ccl-workaccident--intro-banner a {

			color: var(--ccl-workaccident-primary-blue);

			font-weight: 700;

		}

		

		.ccl-workaccident--intro-banner a {

			text-decoration: underline;

			text-decoration-color: rgba(29, 99, 255, 0.3);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-workaccident--intro-banner a:hover {

			color: var(--ccl-workaccident-cta-dark);

			text-decoration-color: var(--ccl-workaccident-cta-dark);

		}

		

		/* ============================================

		   CONTENT SECTIONS

		   ============================================ */

		.ccl-workaccident--content-section {

			background: var(--ccl-workaccident-white);

			border: 2px solid var(--ccl-workaccident-soft-border);

			border-radius: 24px;

			padding: 48px;

			margin-bottom: 32px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-workaccident--content-section::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-workaccident-primary-blue) 0%, var(--ccl-workaccident-accent-gold) 100%);

		}

		

		.ccl-workaccident--content-section h3 {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 24px;

		}

		

		.ccl-workaccident--content-section h3 i {

			color: var(--ccl-workaccident-primary-blue);

			font-size: 1.5rem;

		}

		

		.ccl-workaccident--content-section h4 {

			font-size: 1.3rem;

			color: var(--ccl-workaccident-ink);

			margin-top: 28px;

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-workaccident--content-section p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-workaccident-ink);

			margin-bottom: 20px;

		}

		

		.ccl-workaccident--content-section p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-workaccident--content-section p strong {

			color: var(--ccl-workaccident-ink);

			font-weight: 700;

			font-size: 1.1rem;

		}

		

		.ccl-workaccident--content-section ul {

			list-style: none;

			padding: 0;

			margin: 20px 0;

		}

		

		.ccl-workaccident--content-section ul li {

			position: relative;

			padding-left: 28px;

			margin-bottom: 12px;

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-workaccident-ink);

		}

		

		.ccl-workaccident--content-section ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			top: 2px;

			color: var(--ccl-workaccident-primary-blue);

			font-size: 0.9rem;

		}

		

		/* Quote styling */

		.ccl-workaccident--quote {

			background: var(--ccl-workaccident-light-bg);

			border-left: 4px solid var(--ccl-workaccident-primary-blue);

			padding: 20px 24px;

			margin: 24px 0;

			font-style: italic;

			color: var(--ccl-workaccident-ink);

			border-radius: 0 8px 8px 0;

		}

		

		.ccl-workaccident--quote-source {

			display: block;

			margin-top: 12px;

			font-style: normal;

			font-weight: 600;

			font-size: 0.95rem;

			color: var(--ccl-workaccident-muted);

		}

		

		/* ============================================

		   INFO BANNER

		   ============================================ */

		.ccl-workaccident--info-banner {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 100%);

			border-radius: 20px;

			padding: 40px;

			margin: 48px 0;

			color: var(--ccl-workaccident-white);

			text-align: center;

		}

		

		.ccl-workaccident--info-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			margin-bottom: 24px;

			color: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-workaccident--info-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-workaccident--info-banner a {

			color: var(--ccl-workaccident-accent-gold);

			font-weight: 600;

			text-decoration: underline;

			text-decoration-color: rgba(255, 168, 38, 0.4);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-workaccident--info-banner a:hover {

			color: var(--ccl-workaccident-white);

			text-decoration-color: var(--ccl-workaccident-white);

		}

		

		/* ============================================

		   CONTACT FORM

		   ============================================ */

		.ccl-workaccident--form {

			background: var(--ccl-workaccident-white);

			border: 2px solid var(--ccl-workaccident-soft-border);

			border-radius: 24px;

			padding: 48px;

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-workaccident--form h3 {

			text-align: center;

			margin-bottom: 32px;

		}

		

		.ccl-workaccident--form-row {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

			gap: 24px;

			margin-bottom: 24px;

		}

		

		.ccl-workaccident--form-group {

			display: flex;

			flex-direction: column;

			gap: 8px;

		}

		

		.ccl-workaccident--form-label {

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ccl-workaccident-ink);

		}

		

		.ccl-workaccident--form-label--required::after {

			content: ' *';

			color: var(--ccl-workaccident-warning-red);

		}

		

		.ccl-workaccident--form-input,

		.ccl-workaccident--form-select,

		.ccl-workaccident--form-textarea {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			padding: 14px 18px;

			border: 2px solid var(--ccl-workaccident-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

			color: var(--ccl-workaccident-ink);

			background: var(--ccl-workaccident-white);

		}

		

		.ccl-workaccident--form-input:focus,

		.ccl-workaccident--form-select:focus,

		.ccl-workaccident--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-workaccident-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-workaccident--form-textarea {

			resize: vertical;

			min-height: 150px;

		}

		

		.ccl-workaccident--form-helper {

			font-size: 0.85rem;

			color: var(--ccl-workaccident-muted);

		}

		

		/* ============================================

		   BUTTONS

		   ============================================ */

		.ccl-workaccident--btn {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			padding: 16px 36px;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			display: inline-flex;

			align-items: center;

			gap: 10px;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-workaccident--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-workaccident--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-workaccident--btn--primary {

			background: linear-gradient(135deg, var(--ccl-workaccident-cta-blue) 0%, var(--ccl-workaccident-primary-blue) 100%);

			color: var(--ccl-workaccident-white);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-workaccident--btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-workaccident-cta-dark) 0%, var(--ccl-workaccident-cta-blue) 100%);

			box-shadow: 0 8px 24px rgba(11, 92, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-workaccident--btn--secondary {

			background: var(--ccl-workaccident-white);

			color: var(--ccl-workaccident-primary-blue);

			border: 2px solid var(--ccl-workaccident-primary-blue);

		}

		

		.ccl-workaccident--btn--secondary:hover {

			background: var(--ccl-workaccident-primary-blue);

			color: var(--ccl-workaccident-white);

		}

		

		.ccl-workaccident--btn-group {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			justify-content: center;

			margin-top: 32px;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		   ============================================ */

		.ccl-workaccident--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-workaccident--scroll-reveal.ccl-workaccident--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		@media (max-width: 1200px) {

			.ccl-workaccident--content-layout {

				grid-template-columns: 1fr 340px;

				gap: 36px;

			}

		}

		

		@media (max-width: 1024px) {

			.ccl-workaccident--wrapper {

				font-size: 15px;

			}

			

			.ccl-workaccident--section {

				padding: 80px 20px;

			}

			

			.ccl-workaccident--hero {

				padding: 100px 20px 60px;

			}

			

			.ccl-workaccident--content-layout {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-workaccident--sidebar {

				position: static;

				order: -1;

			}

			

			.ccl-workaccident--content-section {

				padding: 36px;

			}

			

			.ccl-workaccident--form {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-workaccident--wrapper {

				font-size: 14px;

			}

			

			.ccl-workaccident--section {

				padding: 60px 16px;

			}

			

			.ccl-workaccident--hero {

				padding: 80px 16px 50px;

			}

			

			.ccl-workaccident--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-workaccident--sidebar-header {

				padding: 24px 24px 16px;

			}

			

			.ccl-workaccident--sidebar-body {

				padding: 20px 24px 24px;

			}

			

			.ccl-workaccident--sidebar-title {

				font-size: 1.2rem;

			}

			

			.ccl-workaccident--content-section {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-workaccident--form {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-workaccident--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-workaccident--info-banner {

				padding: 32px 24px;

			}

			

			.ccl-workaccident--intro-banner {

				padding: 28px 24px;

				border-radius: 12px;

			}

			

			.ccl-workaccident--intro-banner h3 {

				font-size: 1.2rem;

			}

			

			.ccl-workaccident--intro-banner p {

				font-size: 1rem;

			}

			

			.ccl-workaccident--btn-group {

				flex-direction: column;

			}

			

			.ccl-workaccident--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-workaccident--kicker::before,

			.ccl-workaccident--kicker::after {

				width: 20px;

			}

			

			.ccl-workaccident--section-kicker::before,

			.ccl-workaccident--section-kicker::after {

				width: 20px;

			}

		}

		/* ============================================

		   CSS VARIABLES & BASE STYLES (SCOPED TO WRAPPER)

		   ============================================ */

		.ccl-mvaccident--wrapper {

			/* Brand Colors */

			--ccl-mvaccident-primary-blue: #1d63ff;

			--ccl-mvaccident-cta-blue: #0b5cff;

			--ccl-mvaccident-cta-dark: #0846c1;

			--ccl-mvaccident-accent-green: #10b981;

			--ccl-mvaccident-accent-gold: #ffa826;

			--ccl-mvaccident-ink: #1e293b;

			--ccl-mvaccident-muted: #64748b;

			--ccl-mvaccident-soft-border: #e5e7eb;

			

			/* Semantic Colors */

			--ccl-mvaccident-white: #ffffff;

			--ccl-mvaccident-light-bg: #f8fafc;

			--ccl-mvaccident-warning-red: #ef4444;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-mvaccident-muted);

			

			/* Box Model Reset */

			box-sizing: border-box;

		}

		

		.ccl-mvaccident--wrapper *,

		.ccl-mvaccident--wrapper *::before,

		.ccl-mvaccident--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-mvaccident--wrapper main {

			display: block;

		}

		

		/* ============================================

		   TYPOGRAPHY

		   ============================================ */

		.ccl-mvaccident--wrapper h1,

		.ccl-mvaccident--wrapper h2,

		.ccl-mvaccident--wrapper h3,

		.ccl-mvaccident--wrapper h4 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			color: var(--ccl-mvaccident-ink);

			line-height: 1.2;

		}

		

		.ccl-mvaccident--wrapper h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			margin-bottom: 1.5rem;

		}

		

		.ccl-mvaccident--wrapper h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 1.25rem;

		}

		

		.ccl-mvaccident--wrapper h3 {

			font-size: clamp(1.5rem, 3vw, 1.75rem);

			margin-bottom: 1rem;

		}

		

		.ccl-mvaccident--wrapper p {

			margin-bottom: 1rem;

			font-size: 1.05rem;

		}

		

		.ccl-mvaccident--wrapper a {

			color: var(--ccl-mvaccident-primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-mvaccident--wrapper a:hover {

			color: var(--ccl-mvaccident-cta-dark);

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		.ccl-mvaccident--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-mvaccident--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-mvaccident-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-mvaccident-glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-mvaccident--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-mvaccident--kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			animation: ccl-mvaccident-fadeInDown 0.8s ease-out;

		}

		

		.ccl-mvaccident--kicker::before,

		.ccl-mvaccident--kicker::after {

			content: '';

			display: block;

			width: 40px;

			height: 2px;

			background: rgba(255, 255, 255, 0.5);

		}

		

		@keyframes ccl-mvaccident-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-mvaccident--hero h1 {

			color: var(--ccl-mvaccident-white);

			margin-bottom: 28px;

			animation: ccl-mvaccident-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-mvaccident-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-mvaccident--hero-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 800px;

			margin: 0 auto 32px;

			animation: ccl-mvaccident-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-mvaccident--hero-meta {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 24px;

			margin-top: 32px;

			animation: ccl-mvaccident-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-mvaccident--meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.95rem;

		}

		

		.ccl-mvaccident--meta-item i {

			font-size: 1.1rem;

			color: var(--ccl-mvaccident-accent-gold);

		}

		

		/* ============================================

		   SECTION STRUCTURE

		   ============================================ */

		.ccl-mvaccident--section {

			padding: 100px 24px;

			background: var(--ccl-mvaccident-white);

		}

		

		.ccl-mvaccident--section:nth-child(even) {

			background: var(--ccl-mvaccident-light-bg);

		}

		

		.ccl-mvaccident--section-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-mvaccident--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-mvaccident--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: var(--ccl-mvaccident-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-mvaccident--section-kicker::before,

		.ccl-mvaccident--section-kicker::after {

			content: '';

			display: block;

			width: 30px;

			height: 2px;

			background: var(--ccl-mvaccident-primary-blue);

		}

		

		.ccl-mvaccident--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, var(--ccl-mvaccident-accent-gold) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-mvaccident--lead {

			font-size: 1.15rem;

			line-height: 1.7;

			color: var(--ccl-mvaccident-muted);

			margin-top: 20px;

		}

		

		/* ============================================

		   TWO-COLUMN LAYOUT WITH SIDEBAR

		   ============================================ */

		.ccl-mvaccident--content-layout {

			display: grid;

			grid-template-columns: 1fr 380px;

			gap: 48px;

			align-items: start;

		}

		

		.ccl-mvaccident--main-content {

			min-width: 0;

		}

		

		/* ============================================

		   SIDEBAR - ACCIDENT DETAILS

		   ============================================ */

		.ccl-mvaccident--sidebar {

			position: sticky;

			top: 150px;

		}

		

		.ccl-mvaccident--sidebar-card {

			background: var(--ccl-mvaccident-white);

			border: 2px solid var(--ccl-mvaccident-soft-border);

			border-radius: 20px;

			padding: 0;

			position: relative;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

		}

		

		.ccl-mvaccident--sidebar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-mvaccident-primary-blue) 0%, var(--ccl-mvaccident-accent-gold) 100%);

		}

		

		.ccl-mvaccident--sidebar-header {

			padding: 28px 28px 20px;

			border-bottom: 2px solid var(--ccl-mvaccident-soft-border);

		}

		

		.ccl-mvaccident--sidebar-title {

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-mvaccident-ink);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-mvaccident--sidebar-title i {

			color: var(--ccl-mvaccident-primary-blue);

			font-size: 1.4rem;

		}

		

		.ccl-mvaccident--sidebar-subtitle {

			font-size: 0.9rem;

			color: var(--ccl-mvaccident-muted);

			line-height: 1.5;

		}

		

		.ccl-mvaccident--sidebar-body {

			padding: 24px 28px 28px;

		}

		

		.ccl-mvaccident--detail-item {

			padding: 16px 0;

			border-bottom: 1px solid var(--ccl-mvaccident-soft-border);

		}

		

		.ccl-mvaccident--detail-item:last-child {

			border-bottom: none;

			padding-bottom: 0;

		}

		

		.ccl-mvaccident--detail-item:first-child {

			padding-top: 0;

		}

		

		.ccl-mvaccident--detail-label {

			display: flex;

			align-items: center;

			gap: 8px;

			font-size: 0.8rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--ccl-mvaccident-muted);

			margin-bottom: 6px;

		}

		

		.ccl-mvaccident--detail-label i {

			color: var(--ccl-mvaccident-primary-blue);

			font-size: 0.9rem;

		}

		

		.ccl-mvaccident--detail-value {

			font-size: 1rem;

			font-weight: 600;

			color: var(--ccl-mvaccident-ink);

			line-height: 1.5;

		}

		

		/* Highlight variants for sidebar items */

		.ccl-mvaccident--detail-item--highlight {

			background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-mvaccident--detail-item--warning {

			background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-mvaccident--detail-item--highlight .ccl-mvaccident--detail-label i {

			color: var(--ccl-mvaccident-primary-blue);

		}

		

		.ccl-mvaccident--detail-item--warning .ccl-mvaccident--detail-label i {

			color: var(--ccl-mvaccident-warning-red);

		}

		

		/* ============================================

		   INTRO BANNER

		   ============================================ */

		.ccl-mvaccident--intro-banner {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

			border: 2px solid var(--ccl-mvaccident-soft-border);

			border-left: 6px solid var(--ccl-mvaccident-primary-blue);

			border-radius: 16px;

			padding: 36px 40px;

			margin-bottom: 48px;

			position: relative;

		}

		

		.ccl-mvaccident--intro-banner::before {

			content: '';

			position: absolute;

			top: 20px;

			left: 20px;

			width: 60px;

			height: 60px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(16, 185, 129, 0.1) 100%);

			border-radius: 50%;

			z-index: 0;

		}

		

		.ccl-mvaccident--intro-banner-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-mvaccident--intro-banner-icon {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 48px;

			height: 48px;

			background: linear-gradient(135deg, var(--ccl-mvaccident-primary-blue) 0%, var(--ccl-mvaccident-cta-blue) 100%);

			border-radius: 12px;

			margin-bottom: 20px;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-mvaccident--intro-banner-icon i {

			color: var(--ccl-mvaccident-white);

			font-size: 1.5rem;

		}

		

		.ccl-mvaccident--intro-banner h3 {

			font-size: 1.4rem;

			color: var(--ccl-mvaccident-ink);

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-mvaccident--intro-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-mvaccident-muted);

			margin-bottom: 20px;

		}

		

		.ccl-mvaccident--intro-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-mvaccident--intro-banner strong,

		.ccl-mvaccident--intro-banner a {

			color: var(--ccl-mvaccident-primary-blue);

			font-weight: 700;

		}

		

		.ccl-mvaccident--intro-banner a {

			text-decoration: underline;

			text-decoration-color: rgba(29, 99, 255, 0.3);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-mvaccident--intro-banner a:hover {

			color: var(--ccl-mvaccident-cta-dark);

			text-decoration-color: var(--ccl-mvaccident-cta-dark);

		}

		

		/* ============================================

		   CONTENT SECTIONS

		   ============================================ */

		.ccl-mvaccident--content-section {

			background: var(--ccl-mvaccident-white);

			border: 2px solid var(--ccl-mvaccident-soft-border);

			border-radius: 24px;

			padding: 48px;

			margin-bottom: 32px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-mvaccident--content-section::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-mvaccident-primary-blue) 0%, var(--ccl-mvaccident-accent-gold) 100%);

		}

		

		.ccl-mvaccident--content-section h3 {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 24px;

		}

		

		.ccl-mvaccident--content-section h3 i {

			color: var(--ccl-mvaccident-primary-blue);

			font-size: 1.5rem;

		}

		

		.ccl-mvaccident--content-section h4 {

			font-size: 1.3rem;

			color: var(--ccl-mvaccident-ink);

			margin-top: 28px;

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-mvaccident--content-section p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-mvaccident-ink);

			margin-bottom: 20px;

		}

		

		.ccl-mvaccident--content-section p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-mvaccident--content-section p strong {

			color: var(--ccl-mvaccident-ink);

			font-weight: 700;

			font-size: 1.1rem;

		}

		

		.ccl-mvaccident--content-section ul {

			list-style: none;

			padding: 0;

			margin: 20px 0;

		}

		

		.ccl-mvaccident--content-section ul li {

			position: relative;

			padding-left: 28px;

			margin-bottom: 12px;

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-mvaccident-ink);

		}

		

		.ccl-mvaccident--content-section ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			top: 2px;

			color: var(--ccl-mvaccident-primary-blue);

			font-size: 0.9rem;

		}

		

		/* Quote styling */

		.ccl-mvaccident--quote {

			background: var(--ccl-mvaccident-light-bg);

			border-left: 4px solid var(--ccl-mvaccident-primary-blue);

			padding: 20px 24px;

			margin: 24px 0;

			font-style: italic;

			color: var(--ccl-mvaccident-ink);

			border-radius: 0 8px 8px 0;

		}

		

		.ccl-mvaccident--quote-source {

			display: block;

			margin-top: 12px;

			font-style: normal;

			font-weight: 600;

			font-size: 0.95rem;

			color: var(--ccl-mvaccident-muted);

		}

		

		/* ============================================

		   INFO BANNER

		   ============================================ */

		.ccl-mvaccident--info-banner {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 100%);

			border-radius: 20px;

			padding: 40px;

			margin: 48px 0;

			color: var(--ccl-mvaccident-white);

			text-align: center;

		}

		

		.ccl-mvaccident--info-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			margin-bottom: 24px;

			color: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-mvaccident--info-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-mvaccident--info-banner a {

			color: var(--ccl-mvaccident-accent-gold);

			font-weight: 600;

			text-decoration: underline;

			text-decoration-color: rgba(255, 168, 38, 0.4);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-mvaccident--info-banner a:hover {

			color: var(--ccl-mvaccident-white);

			text-decoration-color: var(--ccl-mvaccident-white);

		}

		

		/* ============================================

		   CONTACT FORM

		   ============================================ */

		.ccl-mvaccident--form {

			background: var(--ccl-mvaccident-white);

			border: 2px solid var(--ccl-mvaccident-soft-border);

			border-radius: 24px;

			padding: 48px;

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-mvaccident--form h3 {

			text-align: center;

			margin-bottom: 32px;

		}

		

		.ccl-mvaccident--form-row {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

			gap: 24px;

			margin-bottom: 24px;

		}

		

		.ccl-mvaccident--form-group {

			display: flex;

			flex-direction: column;

			gap: 8px;

		}

		

		.ccl-mvaccident--form-label {

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ccl-mvaccident-ink);

		}

		

		.ccl-mvaccident--form-label--required::after {

			content: ' *';

			color: var(--ccl-mvaccident-warning-red);

		}

		

		.ccl-mvaccident--form-input,

		.ccl-mvaccident--form-select,

		.ccl-mvaccident--form-textarea {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			padding: 14px 18px;

			border: 2px solid var(--ccl-mvaccident-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

			color: var(--ccl-mvaccident-ink);

			background: var(--ccl-mvaccident-white);

		}

		

		.ccl-mvaccident--form-input:focus,

		.ccl-mvaccident--form-select:focus,

		.ccl-mvaccident--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-mvaccident-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-mvaccident--form-textarea {

			resize: vertical;

			min-height: 150px;

		}

		

		.ccl-mvaccident--form-helper {

			font-size: 0.85rem;

			color: var(--ccl-mvaccident-muted);

		}

		

		/* ============================================

		   BUTTONS

		   ============================================ */

		.ccl-mvaccident--btn {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			padding: 16px 36px;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			display: inline-flex;

			align-items: center;

			gap: 10px;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-mvaccident--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-mvaccident--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-mvaccident--btn--primary {

			background: linear-gradient(135deg, var(--ccl-mvaccident-cta-blue) 0%, var(--ccl-mvaccident-primary-blue) 100%);

			color: var(--ccl-mvaccident-white);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-mvaccident--btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-mvaccident-cta-dark) 0%, var(--ccl-mvaccident-cta-blue) 100%);

			box-shadow: 0 8px 24px rgba(11, 92, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-mvaccident--btn--secondary {

			background: var(--ccl-mvaccident-white);

			color: var(--ccl-mvaccident-primary-blue);

			border: 2px solid var(--ccl-mvaccident-primary-blue);

		}

		

		.ccl-mvaccident--btn--secondary:hover {

			background: var(--ccl-mvaccident-primary-blue);

			color: var(--ccl-mvaccident-white);

		}

		

		.ccl-mvaccident--btn-group {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			justify-content: center;

			margin-top: 32px;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		   ============================================ */

		.ccl-mvaccident--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-mvaccident--scroll-reveal.ccl-mvaccident--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		@media (max-width: 1200px) {

			.ccl-mvaccident--content-layout {

				grid-template-columns: 1fr 340px;

				gap: 36px;

			}

		}

		

		@media (max-width: 1024px) {

			.ccl-mvaccident--wrapper {

				font-size: 15px;

			}

			

			.ccl-mvaccident--section {

				padding: 80px 20px;

			}

			

			.ccl-mvaccident--hero {

				padding: 100px 20px 60px;

			}

			

			.ccl-mvaccident--content-layout {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-mvaccident--sidebar {

				position: static;

				order: -1;

			}

			

			.ccl-mvaccident--content-section {

				padding: 36px;

			}

			

			.ccl-mvaccident--form {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-mvaccident--wrapper {

				font-size: 14px;

			}

			

			.ccl-mvaccident--section {

				padding: 60px 16px;

			}

			

			.ccl-mvaccident--hero {

				padding: 80px 16px 50px;

			}

			

			.ccl-mvaccident--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-mvaccident--sidebar-header {

				padding: 24px 24px 16px;

			}

			

			.ccl-mvaccident--sidebar-body {

				padding: 20px 24px 24px;

			}

			

			.ccl-mvaccident--sidebar-title {

				font-size: 1.2rem;

			}

			

			.ccl-mvaccident--content-section {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-mvaccident--form {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-mvaccident--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-mvaccident--info-banner {

				padding: 32px 24px;

			}

			

			.ccl-mvaccident--intro-banner {

				padding: 28px 24px;

				border-radius: 12px;

			}

			

			.ccl-mvaccident--intro-banner h3 {

				font-size: 1.2rem;

			}

			

			.ccl-mvaccident--intro-banner p {

				font-size: 1rem;

			}

			

			.ccl-mvaccident--btn-group {

				flex-direction: column;

			}

			

			.ccl-mvaccident--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-mvaccident--kicker::before,

			.ccl-mvaccident--kicker::after {

				width: 20px;

			}

			

			.ccl-mvaccident--section-kicker::before,

			.ccl-mvaccident--section-kicker::after {

				width: 20px;

			}

		}

		.ccl-accidentfeed--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--background-light: #f8fafc;

			

			/* Typography */

			--font-inter: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-inter-tight: 'Inter Tight', var(--font-inter);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 32px;

			--grid-gap: 32px;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Shadows */

			--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);

			--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);

			--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

			--shadow-xl: 0 12px 40px rgba(0, 0, 0, 0.15);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-inter);

			color: var(--ink);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}

		

		.ccl-accidentfeed--wrapper main {

			background: var(--white);

			overflow-x: hidden;

		}

		

		.ccl-accidentfeed--wrapper section {

			position: relative;

		}

		

		.ccl-accidentfeed--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		/* Hero Section */

		.ccl-accidentfeed--hero {

			position: relative;

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 50%, #0f172a 100%);

			padding: 60px 0px 40px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-accidentfeed--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: 

				radial-gradient(circle at 20% 50%, rgba(29, 99, 255, 0.15) 0%, transparent 50%),

				radial-gradient(circle at 80% 80%, rgba(11, 92, 255, 0.1) 0%, transparent 50%);

			animation: ccl-accidentfeed--pulse 8s ease-in-out infinite;

		}

		

		@keyframes ccl-accidentfeed--pulse {

			0%, 100% { opacity: 0.5; transform: scale(1); }

			50% { opacity: 1; transform: scale(1.05); }

		}

		

		.ccl-accidentfeed--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-accidentfeed--kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(29, 99, 255, 0.15);

			backdrop-filter: blur(12px);

			border: 1px solid rgba(29, 99, 255, 0.3);

			padding: 12px 24px;

			border-radius: 100px;

			color: rgba(255, 255, 255, 0.95);

			font-size: 0.875rem;

			font-weight: 700;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 32px;

			animation: ccl-accidentfeed--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-accidentfeed--fadeInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-accidentfeed--kicker i {

			font-size: 1rem;

			color: var(--primary-blue);

		}

		

		.ccl-accidentfeed--hero h1 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.5rem, 5vw, 4.75rem);

			color: var(--white);

			margin: 0 0 28px;

			line-height: 1.05;

			letter-spacing: -0.02em;

			animation: ccl-accidentfeed--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-accidentfeed--fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-accidentfeed--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.4rem);

			color: rgba(255, 255, 255, 0.85);

			max-width: 750px;

			margin: 0 auto 40px;

			line-height: 1.6;

			font-weight: 400;

			animation: ccl-accidentfeed--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-accidentfeed--hero-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* Modern Button Styles */

		.ccl-accidentfeed--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 18px 32px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1rem;

			text-decoration: none;

			transition: var(--transition-base);

			border: none;

			cursor: pointer;

			position: relative;

			overflow: visible;

			font-family: var(--font-inter);

			white-space: nowrap;

		}

		

		.ccl-accidentfeed--btn i {

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			font-size: 0.95rem;

		}

		

		.ccl-accidentfeed--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-accidentfeed--btn--primary {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.4);

			animation: ccl-accidentfeed--fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-accidentfeed--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.5);

		}

		

		.ccl-accidentfeed--btn--primary:active {

			transform: translateY(0);

		}

		

		.ccl-accidentfeed--btn--secondary {

			background: rgba(255, 255, 255, 0.12);

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.4);

			backdrop-filter: blur(10px);

		}

		

		.ccl-accidentfeed--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.2);

			border-color: rgba(255, 255, 255, 0.6);

			transform: translateY(-2px);

		}

		

		.ccl-accidentfeed--btn--outline {

			background: transparent;

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-accidentfeed--btn--outline:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-accidentfeed--btn--white {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-accidentfeed--btn--white:hover {

			background: var(--white);

			color: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);

		}

		

		/* Feed Section */

		.ccl-accidentfeed--feed {

			padding: var(--section-padding) 24px;

			background: var(--background-light);

		}

		

		.ccl-accidentfeed--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-accidentfeed--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 48px;

		}

		

		.ccl-accidentfeed--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.875rem;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 16px;

		}

		

		.ccl-accidentfeed--section-kicker::before,

		.ccl-accidentfeed--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-accidentfeed--section-kicker::before {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-accidentfeed--section-header h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			color: var(--ink);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-accidentfeed--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 6px;

		}

		

		.ccl-accidentfeed--section-header p {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Filter Bar */

		.ccl-accidentfeed--filter-bar {

			background: var(--white);

			border-radius: 16px;

			padding: 20px 28px;

			margin-bottom: 48px;

			box-shadow: var(--shadow-md);

			border: 1px solid var(--soft-border);

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 20px;

			flex-wrap: wrap;

			position: sticky;

			top: 20px;

			z-index: 100;

			backdrop-filter: blur(10px);

			background: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-accidentfeed--filter-group {

			display: flex;

			align-items: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-accidentfeed--filter-label {

			font-size: 0.875rem;

			font-weight: 700;

			color: var(--ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-accidentfeed--filter-label i {

			color: var(--primary-blue);

			font-size: 1rem;

		}

		

		/* Sort Dropdown */

		.ccl-accidentfeed--sort-select {

			position: relative;

		}

		

		.ccl-accidentfeed--select {

			appearance: none;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			padding: 12px 40px 12px 16px;

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ink);

			cursor: pointer;

			transition: var(--transition-base);

			font-family: var(--font-inter);

			min-width: 150px;

		}

		

		.ccl-accidentfeed--select:hover {

			border-color: var(--primary-blue);

			background: var(--background-light);

		}

		

		.ccl-accidentfeed--select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-accidentfeed--sort-select::after {

			content: '\f078';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			right: 16px;

			top: 50%;

			transform: translateY(-50%);

			pointer-events: none;

			color: var(--primary-blue);

			font-size: 0.75rem;

		}

		

		/* Layout Toggle */

		.ccl-accidentfeed--layout-toggle {

			display: flex;

			background: var(--background-light);

			border-radius: 10px;

			padding: 4px;

			gap: 4px;

			border: 1px solid var(--soft-border);

		}

		

		.ccl-accidentfeed--layout-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 44px;

			height: 44px;

			border-radius: 8px;

			background: transparent;

			border: none;

			cursor: pointer;

			transition: var(--transition-base);

			color: var(--muted);

			font-size: 1.1rem;

		}

		

		.ccl-accidentfeed--layout-btn:hover {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

		}

		

		.ccl-accidentfeed--layout-btn.ccl-accidentfeed--active {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-accidentfeed--layout-btn.ccl-accidentfeed--active:hover {

			background: var(--cta-dark);

		}

		

		/* Results Count */

		.ccl-accidentfeed--results-count {

			font-size: 0.9rem;

			color: var(--muted);

			font-weight: 500;

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-accidentfeed--results-count strong {

			color: var(--ink);

			font-weight: 700;

		}

		

		/* Article Grid */

		.ccl-accidentfeed--grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));

			gap: var(--grid-gap);

			margin-bottom: 56px;

			transition: var(--transition-base);

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view {

			grid-template-columns: 1fr;

		}

		

		.ccl-accidentfeed--article-card {

			position: relative;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 16px;

			padding: var(--card-padding);

			transition: var(--transition-base);

			overflow: hidden;

			opacity: 0;

			transform: translateY(40px);

			display: flex;

			flex-direction: column;

		}

		

		.ccl-accidentfeed--article-card.ccl-accidentfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		.ccl-accidentfeed--article-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 3px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-3px);

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-accidentfeed--article-card:hover {

			transform: translateY(-6px);

			box-shadow: var(--shadow-lg);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-accidentfeed--article-card:hover::before {

			transform: translateY(0);

		}

		

		/* List View Specific Styles */

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-card {

			flex-direction: row;

			align-items: flex-start;

			gap: 24px;

			padding: 28px;

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-main {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-sidebar {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 12px;

			min-width: 80px;

		}

		

		.ccl-accidentfeed--article-meta {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 16px;

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-meta {

			margin-bottom: 12px;

		}

		

		.ccl-accidentfeed--article-icon {

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 14px;

			font-size: 1.5rem;

			transition: var(--transition-base);

			flex-shrink: 0;

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-icon {

			width: 64px;

			height: 64px;

			font-size: 1.75rem;

		}

		

		.ccl-accidentfeed--article-card:hover .ccl-accidentfeed--article-icon {

			transform: rotate(5deg) scale(1.05);

			box-shadow: 0 8px 16px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-accidentfeed--article-date {

			font-size: 0.875rem;

			color: var(--muted);

			font-weight: 600;

		}

		

		.ccl-accidentfeed--article-title {

			font-family: var(--font-inter-tight);

			font-weight: 800;

			font-size: 1.35rem;

			color: var(--ink);

			margin: 0 0 12px;

			line-height: 1.3;

			transition: color 0.3s ease;

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-title {

			font-size: 1.5rem;

			margin-bottom: 10px;

		}

		

		.ccl-accidentfeed--article-card:hover .ccl-accidentfeed--article-title {

			color: var(--primary-blue);

		}

		

		.ccl-accidentfeed--article-excerpt {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0 0 20px;

			flex-grow: 1;

		}

		

		.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-excerpt {

			font-size: 1.1rem;

			margin-bottom: 16px;

		}

		

		.ccl-accidentfeed--article-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--primary-blue);

			font-weight: 700;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			margin-top: auto;

		}

		

		.ccl-accidentfeed--article-link i {

			transition: transform 0.3s ease;

		}

		

		.ccl-accidentfeed--article-link:hover {

			color: var(--cta-dark);

			gap: 12px;

		}

		

		.ccl-accidentfeed--article-link:hover i {

			transform: translateX(4px);

		}

		

		/* Pagination */

		.ccl-accidentfeed--pagination {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			flex-wrap: wrap;

			padding: 40px 0;

		}

		

		.ccl-accidentfeed--page-btn {

			min-width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 12px;

			color: var(--ink);

			font-weight: 600;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			padding: 0 16px;

		}

		

		.ccl-accidentfeed--page-btn:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.05);

			color: var(--primary-blue);

			transform: translateY(-2px);

			box-shadow: var(--shadow-sm);

		}

		

		.ccl-accidentfeed--page-btn--active {

			background: var(--primary-blue);

			border-color: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-accidentfeed--page-btn--active:hover {

			transform: none;

			background: var(--cta-dark);

			border-color: var(--cta-dark);

		}

		

		.ccl-accidentfeed--page-ellipsis {

			color: var(--muted);

			padding: 0 8px;

			font-weight: 600;

		}

		

		/* CTA Section */

		.ccl-accidentfeed--cta {

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-accidentfeed--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-accidentfeed--cta::after {

			content: '';

			position: absolute;

			bottom: -50%;

			left: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-accidentfeed--cta-content {

			position: relative;

			z-index: 2;

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-accidentfeed--cta h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2rem, 4vw, 3.25rem);

			color: var(--white);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-accidentfeed--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.85);

			line-height: 1.7;

			margin: 0 0 36px;

		}

		

		.ccl-accidentfeed--cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

			margin-top: 8px;

		}

		

		/* Scroll Reveal */

		.ccl-accidentfeed--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-accidentfeed--scroll-reveal.ccl-accidentfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-accidentfeed--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

				--grid-gap: 28px;

			}

			

			.ccl-accidentfeed--grid {

				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

			}

			

			.ccl-accidentfeed--filter-bar {

				padding: 18px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-accidentfeed--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

				--grid-gap: 24px;

			}

			

			.ccl-accidentfeed--hero {

				padding: 120px 20px 100px;

			}

			

			.ccl-accidentfeed--hero-buttons {

				justify-content: center;

			}

			

			.ccl-accidentfeed--grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-accidentfeed--section-header {

				margin-bottom: 40px;

			}

			

			/* Mobile Filter Bar */

			.ccl-accidentfeed--filter-bar {

				flex-direction: column;

				align-items: stretch;

				padding: 20px;

				gap: 16px;

				top: 10px;

			}

			

			.ccl-accidentfeed--filter-group {

				width: 100%;

				justify-content: space-between;

			}

			

			.ccl-accidentfeed--filter-label {

				font-size: 0.8rem;

				white-space: nowrap;

			}

			

			.ccl-accidentfeed--sort-select {

				flex: 1;

			}

			

			.ccl-accidentfeed--select {

				width: 100%;

				padding: 10px 36px 10px 14px;

				font-size: 0.9rem;

			}

			

			.ccl-accidentfeed--layout-toggle {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-accidentfeed--layout-btn {

				flex: 1;

				max-width: 120px;

			}

			

			.ccl-accidentfeed--results-count {

				justify-content: center;

				padding-top: 8px;

				border-top: 1px solid var(--soft-border);

			}

			

			/* List View on Mobile */

			.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-card {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-sidebar {

				flex-direction: row;

				width: 100%;

				justify-content: flex-start;

			}

			

			.ccl-accidentfeed--grid.ccl-accidentfeed--list-view .ccl-accidentfeed--article-icon {

				width: 56px;

				height: 56px;

				font-size: 1.5rem;

			}

			

			.ccl-accidentfeed--pagination {

				gap: 6px;

			}

			

			.ccl-accidentfeed--page-btn {

				min-width: 44px;

				height: 44px;

				font-size: 0.9rem;

				padding: 0 12px;

			}

			

			.ccl-accidentfeed--cta-buttons {

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-accidentfeed--wrapper {

				--section-padding: 48px;

				--card-padding: 20px;

			}

			

			.ccl-accidentfeed--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-accidentfeed--feed,

			.ccl-accidentfeed--cta {

				padding-left: 16px;

				padding-right: 16px;

			}

			

			.ccl-accidentfeed--kicker {

				font-size: 0.75rem;

				padding: 10px 18px;

				gap: 8px;

			}

			

			.ccl-accidentfeed--article-title {

				font-size: 1.2rem;

			}

			

			.ccl-accidentfeed--filter-bar {

				padding: 16px;

				border-radius: 12px;

			}

			

			.ccl-accidentfeed--filter-label {

				font-size: 0.75rem;

			}

			

			.ccl-accidentfeed--layout-btn {

				font-size: 1rem;

				width: 40px;

				height: 40px;

			}

		}

		.ccl-cruisefeed--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--background-light: #f8fafc;

			

			/* Typography */

			--font-inter: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-inter-tight: 'Inter Tight', var(--font-inter);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 32px;

			--grid-gap: 32px;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Shadows */

			--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);

			--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);

			--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

			--shadow-xl: 0 12px 40px rgba(0, 0, 0, 0.15);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-inter);

			color: var(--ink);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}

		

		.ccl-cruisefeed--wrapper main {

			background: var(--white);

			overflow-x: hidden;

		}

		

		.ccl-cruisefeed--wrapper section {

			position: relative;

		}

		

		.ccl-cruisefeed--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		/* Hero Section */

		.ccl-cruisefeed--hero {

			position: relative;

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 50%, #0f172a 100%);

			padding: 60px 0px 40px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-cruisefeed--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: 

				radial-gradient(circle at 20% 50%, rgba(29, 99, 255, 0.15) 0%, transparent 50%),

				radial-gradient(circle at 80% 80%, rgba(11, 92, 255, 0.1) 0%, transparent 50%);

			animation: ccl-cruisefeed--pulse 8s ease-in-out infinite;

		}

		

		@keyframes ccl-cruisefeed--pulse {

			0%, 100% { opacity: 0.5; transform: scale(1); }

			50% { opacity: 1; transform: scale(1.05); }

		}

		

		.ccl-cruisefeed--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-cruisefeed--kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(29, 99, 255, 0.15);

			backdrop-filter: blur(12px);

			border: 1px solid rgba(29, 99, 255, 0.3);

			padding: 12px 24px;

			border-radius: 100px;

			color: rgba(255, 255, 255, 0.95);

			font-size: 0.875rem;

			font-weight: 700;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 32px;

			animation: ccl-cruisefeed--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-cruisefeed--fadeInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-cruisefeed--kicker i {

			font-size: 1rem;

			color: var(--primary-blue);

		}

		

		.ccl-cruisefeed--hero h1 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.5rem, 5vw, 4.75rem);

			color: var(--white);

			margin: 0 0 28px;

			line-height: 1.05;

			letter-spacing: -0.02em;

			animation: ccl-cruisefeed--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-cruisefeed--fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-cruisefeed--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.4rem);

			color: rgba(255, 255, 255, 0.85);

			max-width: 750px;

			margin: 0 auto 40px;

			line-height: 1.6;

			font-weight: 400;

			animation: ccl-cruisefeed--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-cruisefeed--hero-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* Modern Button Styles */

		.ccl-cruisefeed--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 18px 32px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1rem;

			text-decoration: none;

			transition: var(--transition-base);

			border: none;

			cursor: pointer;

			position: relative;

			overflow: visible;

			font-family: var(--font-inter);

			white-space: nowrap;

		}

		

		.ccl-cruisefeed--btn i {

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			font-size: 0.95rem;

		}

		

		.ccl-cruisefeed--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-cruisefeed--btn--primary {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.4);

			animation: ccl-cruisefeed--fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-cruisefeed--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.5);

		}

		

		.ccl-cruisefeed--btn--primary:active {

			transform: translateY(0);

		}

		

		.ccl-cruisefeed--btn--secondary {

			background: rgba(255, 255, 255, 0.12);

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.4);

			backdrop-filter: blur(10px);

		}

		

		.ccl-cruisefeed--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.2);

			border-color: rgba(255, 255, 255, 0.6);

			transform: translateY(-2px);

		}

		

		.ccl-cruisefeed--btn--outline {

			background: transparent;

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-cruisefeed--btn--outline:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-cruisefeed--btn--white {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-cruisefeed--btn--white:hover {

			background: var(--white);

			color: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);

		}

		

		/* Feed Section */

		.ccl-cruisefeed--feed {

			padding: var(--section-padding) 24px;

			background: var(--background-light);

		}

		

		.ccl-cruisefeed--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-cruisefeed--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 48px;

		}

		

		.ccl-cruisefeed--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.875rem;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 16px;

		}

		

		.ccl-cruisefeed--section-kicker::before,

		.ccl-cruisefeed--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-cruisefeed--section-kicker::before {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-cruisefeed--section-header h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			color: var(--ink);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-cruisefeed--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 6px;

		}

		

		.ccl-cruisefeed--section-header p {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Filter Bar */

		.ccl-cruisefeed--filter-bar {

			background: var(--white);

			border-radius: 16px;

			padding: 20px 28px;

			margin-bottom: 48px;

			box-shadow: var(--shadow-md);

			border: 1px solid var(--soft-border);

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 20px;

			flex-wrap: wrap;

			position: sticky;

			top: 20px;

			z-index: 100;

			backdrop-filter: blur(10px);

			background: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-cruisefeed--filter-group {

			display: flex;

			align-items: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-cruisefeed--filter-label {

			font-size: 0.875rem;

			font-weight: 700;

			color: var(--ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-cruisefeed--filter-label i {

			color: var(--primary-blue);

			font-size: 1rem;

		}

		

		/* Sort Dropdown */

		.ccl-cruisefeed--sort-select {

			position: relative;

		}

		

		.ccl-cruisefeed--select {

			appearance: none;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			padding: 12px 40px 12px 16px;

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ink);

			cursor: pointer;

			transition: var(--transition-base);

			font-family: var(--font-inter);

			min-width: 150px;

		}

		

		.ccl-cruisefeed--select:hover {

			border-color: var(--primary-blue);

			background: var(--background-light);

		}

		

		.ccl-cruisefeed--select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-cruisefeed--sort-select::after {

			content: '\f078';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			right: 16px;

			top: 50%;

			transform: translateY(-50%);

			pointer-events: none;

			color: var(--primary-blue);

			font-size: 0.75rem;

		}

		

		/* Layout Toggle */

		.ccl-cruisefeed--layout-toggle {

			display: flex;

			background: var(--background-light);

			border-radius: 10px;

			padding: 4px;

			gap: 4px;

			border: 1px solid var(--soft-border);

		}

		

		.ccl-cruisefeed--layout-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 44px;

			height: 44px;

			border-radius: 8px;

			background: transparent;

			border: none;

			cursor: pointer;

			transition: var(--transition-base);

			color: var(--muted);

			font-size: 1.1rem;

		}

		

		.ccl-cruisefeed--layout-btn:hover {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

		}

		

		.ccl-cruisefeed--layout-btn.ccl-cruisefeed--active {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-cruisefeed--layout-btn.ccl-cruisefeed--active:hover {

			background: var(--cta-dark);

		}

		

		/* Results Count */

		.ccl-cruisefeed--results-count {

			font-size: 0.9rem;

			color: var(--muted);

			font-weight: 500;

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-cruisefeed--results-count strong {

			color: var(--ink);

			font-weight: 700;

		}

		

		/* Article Grid */

		.ccl-cruisefeed--grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));

			gap: var(--grid-gap);

			margin-bottom: 56px;

			transition: var(--transition-base);

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view {

			grid-template-columns: 1fr;

		}

		

		.ccl-cruisefeed--article-card {

			position: relative;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 16px;

			padding: var(--card-padding);

			transition: var(--transition-base);

			overflow: hidden;

			opacity: 0;

			transform: translateY(40px);

			display: flex;

			flex-direction: column;

		}

		

		.ccl-cruisefeed--article-card.ccl-cruisefeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		.ccl-cruisefeed--article-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 3px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-3px);

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-cruisefeed--article-card:hover {

			transform: translateY(-6px);

			box-shadow: var(--shadow-lg);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-cruisefeed--article-card:hover::before {

			transform: translateY(0);

		}

		

		/* List View Specific Styles */

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-card {

			flex-direction: row;

			align-items: flex-start;

			gap: 24px;

			padding: 28px;

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-main {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-sidebar {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 12px;

			min-width: 80px;

		}

		

		.ccl-cruisefeed--article-meta {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 16px;

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-meta {

			margin-bottom: 12px;

		}

		

		.ccl-cruisefeed--article-icon {

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 14px;

			font-size: 1.5rem;

			transition: var(--transition-base);

			flex-shrink: 0;

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-icon {

			width: 64px;

			height: 64px;

			font-size: 1.75rem;

		}

		

		.ccl-cruisefeed--article-card:hover .ccl-cruisefeed--article-icon {

			transform: rotate(5deg) scale(1.05);

			box-shadow: 0 8px 16px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-cruisefeed--article-date {

			font-size: 0.875rem;

			color: var(--muted);

			font-weight: 600;

		}

		

		.ccl-cruisefeed--article-title {

			font-family: var(--font-inter-tight);

			font-weight: 800;

			font-size: 1.35rem;

			color: var(--ink);

			margin: 0 0 12px;

			line-height: 1.3;

			transition: color 0.3s ease;

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-title {

			font-size: 1.5rem;

			margin-bottom: 10px;

		}

		

		.ccl-cruisefeed--article-card:hover .ccl-cruisefeed--article-title {

			color: var(--primary-blue);

		}

		

		.ccl-cruisefeed--article-excerpt {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0 0 20px;

			flex-grow: 1;

		}

		

		.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-excerpt {

			font-size: 1.1rem;

			margin-bottom: 16px;

		}

		

		.ccl-cruisefeed--article-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--primary-blue);

			font-weight: 700;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			margin-top: auto;

		}

		

		.ccl-cruisefeed--article-link i {

			transition: transform 0.3s ease;

		}

		

		.ccl-cruisefeed--article-link:hover {

			color: var(--cta-dark);

			gap: 12px;

		}

		

		.ccl-cruisefeed--article-link:hover i {

			transform: translateX(4px);

		}

		

		/* Pagination */

		.ccl-cruisefeed--pagination {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			flex-wrap: wrap;

			padding: 40px 0;

		}

		

		.ccl-cruisefeed--page-btn {

			min-width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 12px;

			color: var(--ink);

			font-weight: 600;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			padding: 0 16px;

		}

		

		.ccl-cruisefeed--page-btn:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.05);

			color: var(--primary-blue);

			transform: translateY(-2px);

			box-shadow: var(--shadow-sm);

		}

		

		.ccl-cruisefeed--page-btn--active {

			background: var(--primary-blue);

			border-color: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-cruisefeed--page-btn--active:hover {

			transform: none;

			background: var(--cta-dark);

			border-color: var(--cta-dark);

		}

		

		.ccl-cruisefeed--page-ellipsis {

			color: var(--muted);

			padding: 0 8px;

			font-weight: 600;

		}

		

		/* CTA Section */

		.ccl-cruisefeed--cta {

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-cruisefeed--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-cruisefeed--cta::after {

			content: '';

			position: absolute;

			bottom: -50%;

			left: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-cruisefeed--cta-content {

			position: relative;

			z-index: 2;

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-cruisefeed--cta h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2rem, 4vw, 3.25rem);

			color: var(--white);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-cruisefeed--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.85);

			line-height: 1.7;

			margin: 0 0 36px;

		}

		

		.ccl-cruisefeed--cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

			margin-top: 8px;

		}

		

		/* Scroll Reveal */

		.ccl-cruisefeed--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-cruisefeed--scroll-reveal.ccl-cruisefeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-cruisefeed--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

				--grid-gap: 28px;

			}

			

			.ccl-cruisefeed--grid {

				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

			}

			

			.ccl-cruisefeed--filter-bar {

				padding: 18px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-cruisefeed--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

				--grid-gap: 24px;

			}

			

			.ccl-cruisefeed--hero {

				padding: 120px 20px 100px;

			}

			

			.ccl-cruisefeed--hero-buttons {

				justify-content: center;

			}

			

			.ccl-cruisefeed--grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-cruisefeed--section-header {

				margin-bottom: 40px;

			}

			

			/* Mobile Filter Bar */

			.ccl-cruisefeed--filter-bar {

				flex-direction: column;

				align-items: stretch;

				padding: 20px;

				gap: 16px;

				top: 10px;

			}

			

			.ccl-cruisefeed--filter-group {

				width: 100%;

				justify-content: space-between;

			}

			

			.ccl-cruisefeed--filter-label {

				font-size: 0.8rem;

				white-space: nowrap;

			}

			

			.ccl-cruisefeed--sort-select {

				flex: 1;

			}

			

			.ccl-cruisefeed--select {

				width: 100%;

				padding: 10px 36px 10px 14px;

				font-size: 0.9rem;

			}

			

			.ccl-cruisefeed--layout-toggle {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-cruisefeed--layout-btn {

				flex: 1;

				max-width: 120px;

			}

			

			.ccl-cruisefeed--results-count {

				justify-content: center;

				padding-top: 8px;

				border-top: 1px solid var(--soft-border);

			}

			

			/* List View on Mobile */

			.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-card {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-sidebar {

				flex-direction: row;

				width: 100%;

				justify-content: flex-start;

			}

			

			.ccl-cruisefeed--grid.ccl-cruisefeed--list-view .ccl-cruisefeed--article-icon {

				width: 56px;

				height: 56px;

				font-size: 1.5rem;

			}

			

			.ccl-cruisefeed--pagination {

				gap: 6px;

			}

			

			.ccl-cruisefeed--page-btn {

				min-width: 44px;

				height: 44px;

				font-size: 0.9rem;

				padding: 0 12px;

			}

			

			.ccl-cruisefeed--cta-buttons {

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-cruisefeed--wrapper {

				--section-padding: 48px;

				--card-padding: 20px;

			}

			

			.ccl-cruisefeed--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-cruisefeed--feed,

			.ccl-cruisefeed--cta {

				padding-left: 16px;

				padding-right: 16px;

			}

			

			.ccl-cruisefeed--kicker {

				font-size: 0.75rem;

				padding: 10px 18px;

				gap: 8px;

			}

			

			.ccl-cruisefeed--article-title {

				font-size: 1.2rem;

			}

			

			.ccl-cruisefeed--filter-bar {

				padding: 16px;

				border-radius: 12px;

			}

			

			.ccl-cruisefeed--filter-label {

				font-size: 0.75rem;

			}

			

			.ccl-cruisefeed--layout-btn {

				font-size: 1rem;

				width: 40px;

				height: 40px;

			}

		}

		/* ============================================

		   CSS VARIABLES & BASE STYLES (SCOPED TO WRAPPER)

		   ============================================ */

		.ccl-rescue--wrapper {

			/* Brand Colors */

			--ccl-rescue-primary-blue: #1d63ff;

			--ccl-rescue-cta-blue: #0b5cff;

			--ccl-rescue-cta-dark: #0846c1;

			--ccl-rescue-accent-green: #10b981;

			--ccl-rescue-accent-gold: #ffa826;

			--ccl-rescue-ink: #1e293b;

			--ccl-rescue-muted: #64748b;

			--ccl-rescue-soft-border: #e5e7eb;

			

			/* Semantic Colors */

			--ccl-rescue-white: #ffffff;

			--ccl-rescue-light-bg: #f8fafc;

			--ccl-rescue-warning-red: #ef4444;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-rescue-muted);

			

			/* Box Model Reset */

			box-sizing: border-box;

		}

		

		.ccl-rescue--wrapper *,

		.ccl-rescue--wrapper *::before,

		.ccl-rescue--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-rescue--wrapper main {

			display: block;

		}

		

		/* ============================================

		   TYPOGRAPHY

		   ============================================ */

		.ccl-rescue--wrapper h1,

		.ccl-rescue--wrapper h2,

		.ccl-rescue--wrapper h3,

		.ccl-rescue--wrapper h4 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			color: var(--ccl-rescue-ink);

			line-height: 1.2;

		}

		

		.ccl-rescue--wrapper h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			margin-bottom: 1.5rem;

		}

		

		.ccl-rescue--wrapper h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 1.25rem;

		}

		

		.ccl-rescue--wrapper h3 {

			font-size: clamp(1.5rem, 3vw, 1.75rem);

			margin-bottom: 1rem;

		}

		

		.ccl-rescue--wrapper p {

			margin-bottom: 1rem;

			font-size: 1.05rem;

		}

		

		.ccl-rescue--wrapper a {

			color: var(--ccl-rescue-primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-rescue--wrapper a:hover {

			color: var(--ccl-rescue-cta-dark);

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		.ccl-rescue--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #10b981 100%);

			padding: 120px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-rescue--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-rescue-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-rescue-glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-rescue--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-rescue--kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			animation: ccl-rescue-fadeInDown 0.8s ease-out;

		}

		

		.ccl-rescue--kicker::before,

		.ccl-rescue--kicker::after {

			content: '';

			display: block;

			width: 40px;

			height: 2px;

			background: rgba(255, 255, 255, 0.5);

		}

		

		@keyframes ccl-rescue-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-rescue--hero h1 {

			color: var(--ccl-rescue-white);

			margin-bottom: 28px;

			animation: ccl-rescue-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-rescue-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-rescue--hero-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 800px;

			margin: 0 auto 32px;

			animation: ccl-rescue-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-rescue--hero-meta {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 24px;

			margin-top: 32px;

			animation: ccl-rescue-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-rescue--meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.95rem;

		}

		

		.ccl-rescue--meta-item i {

			font-size: 1.1rem;

			color: var(--ccl-rescue-accent-gold);

		}

		

		/* ============================================

		   SECTION STRUCTURE

		   ============================================ */

		.ccl-rescue--section {

			padding: 100px 24px;

			background: var(--ccl-rescue-white);

		}

		

		.ccl-rescue--section:nth-child(even) {

			background: var(--ccl-rescue-light-bg);

		}

		

		.ccl-rescue--section-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-rescue--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-rescue--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: var(--ccl-rescue-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-rescue--section-kicker::before,

		.ccl-rescue--section-kicker::after {

			content: '';

			display: block;

			width: 30px;

			height: 2px;

			background: var(--ccl-rescue-primary-blue);

		}

		

		.ccl-rescue--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, var(--ccl-rescue-accent-green) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-rescue--lead {

			font-size: 1.15rem;

			line-height: 1.7;

			color: var(--ccl-rescue-muted);

			margin-top: 20px;

		}

		

		/* ============================================

		   TWO-COLUMN LAYOUT WITH SIDEBAR

		   ============================================ */

		.ccl-rescue--content-layout {

			display: grid;

			grid-template-columns: 1fr 380px;

			gap: 48px;

			align-items: start;

		}

		

		.ccl-rescue--main-content {

			min-width: 0;

		}

		

		/* ============================================

		   SIDEBAR - INCIDENT DETAILS

		   ============================================ */

		.ccl-rescue--sidebar {

			position: sticky;

			top: 150px;

		}

		

		.ccl-rescue--sidebar-card {

			background: var(--ccl-rescue-white);

			border: 2px solid var(--ccl-rescue-soft-border);

			border-radius: 20px;

			padding: 0;

			position: relative;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

		}

		

		.ccl-rescue--sidebar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-rescue-primary-blue) 0%, var(--ccl-rescue-accent-green) 100%);

		}

		

		.ccl-rescue--sidebar-header {

			padding: 28px 28px 20px;

			border-bottom: 2px solid var(--ccl-rescue-soft-border);

		}

		

		.ccl-rescue--sidebar-title {

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-rescue-ink);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-rescue--sidebar-title i {

			color: var(--ccl-rescue-primary-blue);

			font-size: 1.4rem;

		}

		

		.ccl-rescue--sidebar-subtitle {

			font-size: 0.9rem;

			color: var(--ccl-rescue-muted);

			line-height: 1.5;

		}

		

		.ccl-rescue--sidebar-body {

			padding: 24px 28px 28px;

		}

		

		.ccl-rescue--detail-item {

			padding: 16px 0;

			border-bottom: 1px solid var(--ccl-rescue-soft-border);

		}

		

		.ccl-rescue--detail-item:last-child {

			border-bottom: none;

			padding-bottom: 0;

		}

		

		.ccl-rescue--detail-item:first-child {

			padding-top: 0;

		}

		

		.ccl-rescue--detail-label {

			display: flex;

			align-items: center;

			gap: 8px;

			font-size: 0.8rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--ccl-rescue-muted);

			margin-bottom: 6px;

		}

		

		.ccl-rescue--detail-label i {

			color: var(--ccl-rescue-primary-blue);

			font-size: 0.9rem;

		}

		

		.ccl-rescue--detail-value {

			font-size: 1rem;

			font-weight: 600;

			color: var(--ccl-rescue-ink);

			line-height: 1.5;

		}

		

		/* Highlight variants for sidebar items */

		.ccl-rescue--detail-item--highlight {

			background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-rescue--detail-item--success {

			background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-rescue--detail-item--highlight .ccl-rescue--detail-label i {

			color: var(--ccl-rescue-primary-blue);

		}

		

		.ccl-rescue--detail-item--success .ccl-rescue--detail-label i {

			color: var(--ccl-rescue-accent-green);

		}

		

		/* ============================================

		   INTRO BANNER

		   ============================================ */

		.ccl-rescue--intro-banner {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

			border: 2px solid var(--ccl-rescue-soft-border);

			border-left: 6px solid var(--ccl-rescue-primary-blue);

			border-radius: 16px;

			padding: 36px 40px;

			margin-bottom: 48px;

			position: relative;

		}

		

		.ccl-rescue--intro-banner::before {

			content: '';

			position: absolute;

			top: 20px;

			left: 20px;

			width: 60px;

			height: 60px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(16, 185, 129, 0.1) 100%);

			border-radius: 50%;

			z-index: 0;

		}

		

		.ccl-rescue--intro-banner-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-rescue--intro-banner-icon {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 48px;

			height: 48px;

			background: linear-gradient(135deg, var(--ccl-rescue-primary-blue) 0%, var(--ccl-rescue-cta-blue) 100%);

			border-radius: 12px;

			margin-bottom: 20px;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-rescue--intro-banner-icon i {

			color: var(--ccl-rescue-white);

			font-size: 1.5rem;

		}

		

		.ccl-rescue--intro-banner h3 {

			font-size: 1.4rem;

			color: var(--ccl-rescue-ink);

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-rescue--intro-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-rescue-muted);

			margin-bottom: 20px;

		}

		

		.ccl-rescue--intro-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-rescue--intro-banner strong,

		.ccl-rescue--intro-banner a {

			color: var(--ccl-rescue-primary-blue);

			font-weight: 700;

		}

		

		.ccl-rescue--intro-banner a {

			text-decoration: underline;

			text-decoration-color: rgba(29, 99, 255, 0.3);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-rescue--intro-banner a:hover {

			color: var(--ccl-rescue-cta-dark);

			text-decoration-color: var(--ccl-rescue-cta-dark);

		}

		

		/* ============================================

		   CONTENT SECTIONS

		   ============================================ */

		.ccl-rescue--content-section {

			background: var(--ccl-rescue-white);

			border: 2px solid var(--ccl-rescue-soft-border);

			border-radius: 24px;

			padding: 48px;

			margin-bottom: 32px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-rescue--content-section::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-rescue-primary-blue) 0%, var(--ccl-rescue-accent-green) 100%);

		}

		

		.ccl-rescue--content-section h3 {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 24px;

		}

		

		.ccl-rescue--content-section h3 i {

			color: var(--ccl-rescue-primary-blue);

			font-size: 1.5rem;

		}

		

		.ccl-rescue--content-section h4 {

			font-size: 1.3rem;

			color: var(--ccl-rescue-ink);

			margin-top: 28px;

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-rescue--content-section p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-rescue-ink);

			margin-bottom: 20px;

		}

		

		.ccl-rescue--content-section p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-rescue--content-section p strong {

			color: var(--ccl-rescue-ink);

			font-weight: 700;

			font-size: 1.1rem;

		}

		

		.ccl-rescue--content-section ul {

			list-style: none;

			padding: 0;

			margin: 20px 0;

		}

		

		.ccl-rescue--content-section ul li {

			position: relative;

			padding-left: 28px;

			margin-bottom: 12px;

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-rescue-ink);

		}

		

		.ccl-rescue--content-section ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			top: 2px;

			color: var(--ccl-rescue-accent-green);

			font-size: 0.9rem;

		}

		

		/* ============================================

		   INFO BANNER

		   ============================================ */

		.ccl-rescue--info-banner {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 100%);

			border-radius: 20px;

			padding: 40px;

			margin: 48px 0;

			color: var(--ccl-rescue-white);

			text-align: center;

		}

		

		.ccl-rescue--info-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			margin-bottom: 24px;

			color: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-rescue--info-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-rescue--info-banner a {

			color: var(--ccl-rescue-accent-gold);

			font-weight: 600;

			text-decoration: underline;

			text-decoration-color: rgba(255, 168, 38, 0.4);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-rescue--info-banner a:hover {

			color: var(--ccl-rescue-white);

			text-decoration-color: var(--ccl-rescue-white);

		}

		

		/* ============================================

		   CONTACT FORM

		   ============================================ */

		.ccl-rescue--form {

			background: var(--ccl-rescue-white);

			border: 2px solid var(--ccl-rescue-soft-border);

			border-radius: 24px;

			padding: 48px;

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-rescue--form h3 {

			text-align: center;

			margin-bottom: 32px;

		}

		

		.ccl-rescue--form-row {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

			gap: 24px;

			margin-bottom: 24px;

		}

		

		.ccl-rescue--form-group {

			display: flex;

			flex-direction: column;

			gap: 8px;

		}

		

		.ccl-rescue--form-label {

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ccl-rescue-ink);

		}

		

		.ccl-rescue--form-label--required::after {

			content: ' *';

			color: var(--ccl-rescue-warning-red);

		}

		

		.ccl-rescue--form-input,

		.ccl-rescue--form-select,

		.ccl-rescue--form-textarea {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			padding: 14px 18px;

			border: 2px solid var(--ccl-rescue-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

			color: var(--ccl-rescue-ink);

			background: var(--ccl-rescue-white);

		}

		

		.ccl-rescue--form-input:focus,

		.ccl-rescue--form-select:focus,

		.ccl-rescue--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-rescue-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-rescue--form-textarea {

			resize: vertical;

			min-height: 150px;

		}

		

		.ccl-rescue--form-helper {

			font-size: 0.85rem;

			color: var(--ccl-rescue-muted);

		}

		

		/* ============================================

		   BUTTONS

		   ============================================ */

		.ccl-rescue--btn {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			padding: 16px 36px;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			display: inline-flex;

			align-items: center;

			gap: 10px;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-rescue--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-rescue--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-rescue--btn--primary {

			background: linear-gradient(135deg, var(--ccl-rescue-cta-blue) 0%, var(--ccl-rescue-primary-blue) 100%);

			color: var(--ccl-rescue-white);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-rescue--btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-rescue-cta-dark) 0%, var(--ccl-rescue-cta-blue) 100%);

			box-shadow: 0 8px 24px rgba(11, 92, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-rescue--btn--secondary {

			background: var(--ccl-rescue-white);

			color: var(--ccl-rescue-primary-blue);

			border: 2px solid var(--ccl-rescue-primary-blue);

		}

		

		.ccl-rescue--btn--secondary:hover {

			background: var(--ccl-rescue-primary-blue);

			color: var(--ccl-rescue-white);

		}

		

		.ccl-rescue--btn-group {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			justify-content: center;

			margin-top: 32px;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		   ============================================ */

		.ccl-rescue--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-rescue--scroll-reveal.ccl-rescue--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		@media (max-width: 1200px) {

			.ccl-rescue--content-layout {

				grid-template-columns: 1fr 340px;

				gap: 36px;

			}

		}

		

		@media (max-width: 1024px) {

			.ccl-rescue--wrapper {

				font-size: 15px;

			}

			

			.ccl-rescue--section {

				padding: 80px 20px;

			}

			

			.ccl-rescue--hero {

				padding: 100px 20px 60px;

			}

			

			.ccl-rescue--content-layout {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-rescue--sidebar {

				position: static;

				order: -1;

			}

			

			.ccl-rescue--content-section {

				padding: 36px;

			}

			

			.ccl-rescue--form {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-rescue--wrapper {

				font-size: 14px;

			}

			

			.ccl-rescue--section {

				padding: 60px 16px;

			}

			

			.ccl-rescue--hero {

				padding: 80px 16px 50px;

			}

			

			.ccl-rescue--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-rescue--sidebar-header {

				padding: 24px 24px 16px;

			}

			

			.ccl-rescue--sidebar-body {

				padding: 20px 24px 24px;

			}

			

			.ccl-rescue--sidebar-title {

				font-size: 1.2rem;

			}

			

			.ccl-rescue--content-section {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-rescue--form {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-rescue--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-rescue--info-banner {

				padding: 32px 24px;

			}

			

			.ccl-rescue--intro-banner {

				padding: 28px 24px;

				border-radius: 12px;

			}

			

			.ccl-rescue--intro-banner h3 {

				font-size: 1.2rem;

			}

			

			.ccl-rescue--intro-banner p {

				font-size: 1rem;

			}

			

			.ccl-rescue--btn-group {

				flex-direction: column;

			}

			

			.ccl-rescue--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-rescue--kicker::before,

			.ccl-rescue--kicker::after {

				width: 20px;

			}

			

			.ccl-rescue--section-kicker::before,

			.ccl-rescue--section-kicker::after {

				width: 20px;

			}

		}

		.ccl-aviationfeed--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--background-light: #f8fafc;

			

			/* Typography */

			--font-inter: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-inter-tight: 'Inter Tight', var(--font-inter);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 32px;

			--grid-gap: 32px;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Shadows */

			--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);

			--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);

			--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

			--shadow-xl: 0 12px 40px rgba(0, 0, 0, 0.15);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-inter);

			color: var(--ink);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}

		

		.ccl-aviationfeed--wrapper main {

			background: var(--white);

			overflow-x: hidden;

		}

		

		.ccl-aviationfeed--wrapper section {

			position: relative;

		}

		

		.ccl-aviationfeed--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		/* Hero Section */

		.ccl-aviationfeed--hero {

			position: relative;

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 50%, #0f172a 100%);

			padding: 60px 0px 40px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-aviationfeed--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: 

				radial-gradient(circle at 20% 50%, rgba(29, 99, 255, 0.15) 0%, transparent 50%),

				radial-gradient(circle at 80% 80%, rgba(11, 92, 255, 0.1) 0%, transparent 50%);

			animation: ccl-aviationfeed--pulse 8s ease-in-out infinite;

		}

		

		@keyframes ccl-aviationfeed--pulse {

			0%, 100% { opacity: 0.5; transform: scale(1); }

			50% { opacity: 1; transform: scale(1.05); }

		}

		

		.ccl-aviationfeed--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-aviationfeed--kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(29, 99, 255, 0.15);

			backdrop-filter: blur(12px);

			border: 1px solid rgba(29, 99, 255, 0.3);

			padding: 12px 24px;

			border-radius: 100px;

			color: rgba(255, 255, 255, 0.95);

			font-size: 0.875rem;

			font-weight: 700;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 32px;

			animation: ccl-aviationfeed--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-aviationfeed--fadeInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-aviationfeed--kicker i {

			font-size: 1rem;

			color: var(--primary-blue);

		}

		

		.ccl-aviationfeed--hero h1 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.5rem, 5vw, 4.75rem);

			color: var(--white);

			margin: 0 0 28px;

			line-height: 1.05;

			letter-spacing: -0.02em;

			animation: ccl-aviationfeed--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-aviationfeed--fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-aviationfeed--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.4rem);

			color: rgba(255, 255, 255, 0.85);

			max-width: 750px;

			margin: 0 auto 40px;

			line-height: 1.6;

			font-weight: 400;

			animation: ccl-aviationfeed--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-aviationfeed--hero-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* Modern Button Styles */

		.ccl-aviationfeed--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 18px 32px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1rem;

			text-decoration: none;

			transition: var(--transition-base);

			border: none;

			cursor: pointer;

			position: relative;

			overflow: visible;

			font-family: var(--font-inter);

			white-space: nowrap;

		}

		

		.ccl-aviationfeed--btn i {

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			font-size: 0.95rem;

		}

		

		.ccl-aviationfeed--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-aviationfeed--btn--primary {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.4);

			animation: ccl-aviationfeed--fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-aviationfeed--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.5);

		}

		

		.ccl-aviationfeed--btn--primary:active {

			transform: translateY(0);

		}

		

		.ccl-aviationfeed--btn--secondary {

			background: rgba(255, 255, 255, 0.12);

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.4);

			backdrop-filter: blur(10px);

		}

		

		.ccl-aviationfeed--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.2);

			border-color: rgba(255, 255, 255, 0.6);

			transform: translateY(-2px);

		}

		

		.ccl-aviationfeed--btn--outline {

			background: transparent;

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-aviationfeed--btn--outline:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--btn--white {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-aviationfeed--btn--white:hover {

			background: var(--white);

			color: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);

		}

		

		/* Feed Section */

		.ccl-aviationfeed--feed {

			padding: var(--section-padding) 24px;

			background: var(--background-light);

		}

		

		.ccl-aviationfeed--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-aviationfeed--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 48px;

		}

		

		.ccl-aviationfeed--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.875rem;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 16px;

		}

		

		.ccl-aviationfeed--section-kicker::before,

		.ccl-aviationfeed--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-aviationfeed--section-kicker::before {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-aviationfeed--section-header h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			color: var(--ink);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-aviationfeed--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 6px;

		}

		

		.ccl-aviationfeed--section-header p {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Filter Bar */

		.ccl-aviationfeed--filter-bar {

			background: var(--white);

			border-radius: 16px;

			padding: 20px 28px;

			margin-bottom: 48px;

			box-shadow: var(--shadow-md);

			border: 1px solid var(--soft-border);

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 20px;

			flex-wrap: wrap;

			position: sticky;

			top: 20px;

			z-index: 100;

			backdrop-filter: blur(10px);

			background: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-aviationfeed--filter-group {

			display: flex;

			align-items: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-aviationfeed--filter-label {

			font-size: 0.875rem;

			font-weight: 700;

			color: var(--ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-aviationfeed--filter-label i {

			color: var(--primary-blue);

			font-size: 1rem;

		}

		

		/* Sort Dropdown */

		.ccl-aviationfeed--sort-select {

			position: relative;

		}

		

		.ccl-aviationfeed--select {

			appearance: none;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			padding: 12px 40px 12px 16px;

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ink);

			cursor: pointer;

			transition: var(--transition-base);

			font-family: var(--font-inter);

			min-width: 150px;

		}

		

		.ccl-aviationfeed--select:hover {

			border-color: var(--primary-blue);

			background: var(--background-light);

		}

		

		.ccl-aviationfeed--select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-aviationfeed--sort-select::after {

			content: '\f078';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			right: 16px;

			top: 50%;

			transform: translateY(-50%);

			pointer-events: none;

			color: var(--primary-blue);

			font-size: 0.75rem;

		}

		

		/* Layout Toggle */

		.ccl-aviationfeed--layout-toggle {

			display: flex;

			background: var(--background-light);

			border-radius: 10px;

			padding: 4px;

			gap: 4px;

			border: 1px solid var(--soft-border);

		}

		

		.ccl-aviationfeed--layout-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 44px;

			height: 44px;

			border-radius: 8px;

			background: transparent;

			border: none;

			cursor: pointer;

			transition: var(--transition-base);

			color: var(--muted);

			font-size: 1.1rem;

		}

		

		.ccl-aviationfeed--layout-btn:hover {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

		}

		

		.ccl-aviationfeed--layout-btn.ccl-aviationfeed--active {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--layout-btn.ccl-aviationfeed--active:hover {

			background: var(--cta-dark);

		}

		

		/* Results Count */

		.ccl-aviationfeed--results-count {

			font-size: 0.9rem;

			color: var(--muted);

			font-weight: 500;

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-aviationfeed--results-count strong {

			color: var(--ink);

			font-weight: 700;

		}

		

		/* Article Grid */

		.ccl-aviationfeed--grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));

			gap: var(--grid-gap);

			margin-bottom: 56px;

			transition: var(--transition-base);

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view {

			grid-template-columns: 1fr;

		}

		

		.ccl-aviationfeed--article-card {

			position: relative;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 16px;

			padding: var(--card-padding);

			transition: var(--transition-base);

			overflow: hidden;

			opacity: 0;

			transform: translateY(40px);

			display: flex;

			flex-direction: column;

		}

		

		.ccl-aviationfeed--article-card.ccl-aviationfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		.ccl-aviationfeed--article-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 3px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-3px);

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-aviationfeed--article-card:hover {

			transform: translateY(-6px);

			box-shadow: var(--shadow-lg);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--article-card:hover::before {

			transform: translateY(0);

		}

		

		/* List View Specific Styles */

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-card {

			flex-direction: row;

			align-items: flex-start;

			gap: 24px;

			padding: 28px;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-main {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-sidebar {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 12px;

			min-width: 80px;

		}

		

		.ccl-aviationfeed--article-meta {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 16px;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-meta {

			margin-bottom: 12px;

		}

		

		.ccl-aviationfeed--article-icon {

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 14px;

			font-size: 1.5rem;

			transition: var(--transition-base);

			flex-shrink: 0;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-icon {

			width: 64px;

			height: 64px;

			font-size: 1.75rem;

		}

		

		.ccl-aviationfeed--article-card:hover .ccl-aviationfeed--article-icon {

			transform: rotate(5deg) scale(1.05);

			box-shadow: 0 8px 16px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--article-date {

			font-size: 0.875rem;

			color: var(--muted);

			font-weight: 600;

		}

		

		.ccl-aviationfeed--article-title {

			font-family: var(--font-inter-tight);

			font-weight: 800;

			font-size: 1.35rem;

			color: var(--ink);

			margin: 0 0 12px;

			line-height: 1.3;

			transition: color 0.3s ease;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-title {

			font-size: 1.5rem;

			margin-bottom: 10px;

		}

		

		.ccl-aviationfeed--article-card:hover .ccl-aviationfeed--article-title {

			color: var(--primary-blue);

		}

		

		.ccl-aviationfeed--article-excerpt {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0 0 20px;

			flex-grow: 1;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-excerpt {

			font-size: 1.1rem;

			margin-bottom: 16px;

		}

		

		.ccl-aviationfeed--article-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--primary-blue);

			font-weight: 700;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			margin-top: auto;

		}

		

		.ccl-aviationfeed--article-link i {

			transition: transform 0.3s ease;

		}

		

		.ccl-aviationfeed--article-link:hover {

			color: var(--cta-dark);

			gap: 12px;

		}

		

		.ccl-aviationfeed--article-link:hover i {

			transform: translateX(4px);

		}

		

		/* Severity Indicators - REMOVED */

		

		/* Pagination */

		.ccl-aviationfeed--pagination {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			flex-wrap: wrap;

			padding: 40px 0;

		}

		

		.ccl-aviationfeed--page-btn {

			min-width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 12px;

			color: var(--ink);

			font-weight: 600;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			padding: 0 16px;

		}

		

		.ccl-aviationfeed--page-btn:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.05);

			color: var(--primary-blue);

			transform: translateY(-2px);

			box-shadow: var(--shadow-sm);

		}

		

		.ccl-aviationfeed--page-btn--active {

			background: var(--primary-blue);

			border-color: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--page-btn--active:hover {

			transform: none;

			background: var(--cta-dark);

			border-color: var(--cta-dark);

		}

		

		.ccl-aviationfeed--page-ellipsis {

			color: var(--muted);

			padding: 0 8px;

			font-weight: 600;

		}

		

		/* CTA Section */

		.ccl-aviationfeed--cta {

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviationfeed--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-aviationfeed--cta::after {

			content: '';

			position: absolute;

			bottom: -50%;

			left: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-aviationfeed--cta-content {

			position: relative;

			z-index: 2;

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-aviationfeed--cta h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2rem, 4vw, 3.25rem);

			color: var(--white);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-aviationfeed--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.85);

			line-height: 1.7;

			margin: 0 0 36px;

		}

		

		.ccl-aviationfeed--cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

			margin-top: 8px;

		}

		

		

		/* Scroll Reveal */

		.ccl-aviationfeed--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-aviationfeed--scroll-reveal.ccl-aviationfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-aviationfeed--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

				--grid-gap: 28px;

			}

			

			.ccl-aviationfeed--grid {

				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

			}

			

			.ccl-aviationfeed--filter-bar {

				padding: 18px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-aviationfeed--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

				--grid-gap: 24px;

			}

			

			.ccl-aviationfeed--hero {

				padding: 120px 20px 100px;

			}

			

			.ccl-aviationfeed--hero-buttons {

				justify-content: center;

			}

			

			.ccl-aviationfeed--grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-aviationfeed--section-header {

				margin-bottom: 40px;

			}

			

			/* Mobile Filter Bar */

			.ccl-aviationfeed--filter-bar {

				flex-direction: column;

				align-items: stretch;

				padding: 20px;

				gap: 16px;

				top: 10px;

			}

			

			.ccl-aviationfeed--filter-group {

				width: 100%;

				justify-content: space-between;

			}

			

			.ccl-aviationfeed--filter-label {

				font-size: 0.8rem;

				white-space: nowrap;

			}

			

			.ccl-aviationfeed--sort-select {

				flex: 1;

			}

			

			.ccl-aviationfeed--select {

				width: 100%;

				padding: 10px 36px 10px 14px;

				font-size: 0.9rem;

			}

			

			.ccl-aviationfeed--layout-toggle {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-aviationfeed--layout-btn {

				flex: 1;

				max-width: 120px;

			}

			

			.ccl-aviationfeed--results-count {

				justify-content: center;

				padding-top: 8px;

				border-top: 1px solid var(--soft-border);

			}

			

			/* List View on Mobile */

			.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-card {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-sidebar {

				flex-direction: row;

				width: 100%;

				justify-content: flex-start;

			}

			

			.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-icon {

				width: 56px;

				height: 56px;

				font-size: 1.5rem;

			}

			

			.ccl-aviationfeed--pagination {

				gap: 6px;

			}

			

			.ccl-aviationfeed--page-btn {

				min-width: 44px;

				height: 44px;

				font-size: 0.9rem;

				padding: 0 12px;

			}

			

			.ccl-aviationfeed--cta-buttons {

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-aviationfeed--wrapper {

				--section-padding: 48px;

				--card-padding: 20px;

			}

			

			.ccl-aviationfeed--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-aviationfeed--feed,

			.ccl-aviationfeed--cta {

				padding-left: 16px;

				padding-right: 16px;

			}

			

			.ccl-aviationfeed--kicker {

				font-size: 0.75rem;

				padding: 10px 18px;

				gap: 8px;

			}

			

			.ccl-aviationfeed--article-title {

				font-size: 1.2rem;

			}

			

			.ccl-aviationfeed--filter-bar {

				padding: 16px;

				border-radius: 12px;

			}

			

			.ccl-aviationfeed--filter-label {

				font-size: 0.75rem;

			}

			

			.ccl-aviationfeed--layout-btn {

				font-size: 1rem;

				width: 40px;

				height: 40px;

			}

		}

		/* ============================================

		   CSS VARIABLES & BASE STYLES (SCOPED TO WRAPPER)

		   ============================================ */

		.ccl-aviation--wrapper {

			/* Brand Colors */

			--ccl-aviation-primary-blue: #1d63ff;

			--ccl-aviation-cta-blue: #0b5cff;

			--ccl-aviation-cta-dark: #0846c1;

			--ccl-aviation-accent-green: #10b981;

			--ccl-aviation-accent-gold: #ffa826;

			--ccl-aviation-ink: #1e293b;

			--ccl-aviation-muted: #64748b;

			--ccl-aviation-soft-border: #e5e7eb;

			

			/* Semantic Colors */

			--ccl-aviation-white: #ffffff;

			--ccl-aviation-light-bg: #f8fafc;

			--ccl-aviation-warning-red: #ef4444;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-aviation-muted);

			

			/* Box Model Reset */

			box-sizing: border-box;

		}

		

		.ccl-aviation--wrapper *,

		.ccl-aviation--wrapper *::before,

		.ccl-aviation--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-aviation--wrapper main {

			display: block;

		}

		

		/* ============================================

		   TYPOGRAPHY

		   ============================================ */

		.ccl-aviation--wrapper h1,

		.ccl-aviation--wrapper h2,

		.ccl-aviation--wrapper h3,

		.ccl-aviation--wrapper h4 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			color: var(--ccl-aviation-ink);

			line-height: 1.2;

		}

		

		.ccl-aviation--wrapper h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			margin-bottom: 1.5rem;

		}

		

		.ccl-aviation--wrapper h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 1.25rem;

		}

		

		.ccl-aviation--wrapper h3 {

			font-size: clamp(1.5rem, 3vw, 1.75rem);

			margin-bottom: 1rem;

		}

		

		.ccl-aviation--wrapper p {

			margin-bottom: 1rem;

			font-size: 1.05rem;

		}

		

		.ccl-aviation--wrapper a {

			color: var(--ccl-aviation-primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-aviation--wrapper a:hover {

			color: var(--ccl-aviation-cta-dark);

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		.ccl-aviation--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-aviation--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-aviation-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-aviation-glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-aviation--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-aviation--kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			animation: ccl-aviation-fadeInDown 0.8s ease-out;

		}

		

		.ccl-aviation--kicker::before,

		.ccl-aviation--kicker::after {

			content: '';

			display: block;

			width: 40px;

			height: 2px;

			background: rgba(255, 255, 255, 0.5);

		}

		

		@keyframes ccl-aviation-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-aviation--hero h1 {

			color: var(--ccl-aviation-white);

			margin-bottom: 28px;

			animation: ccl-aviation-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-aviation-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-aviation--hero-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 800px;

			margin: 0 auto 32px;

			animation: ccl-aviation-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-aviation--hero-meta {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 24px;

			margin-top: 32px;

			animation: ccl-aviation-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-aviation--meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.95rem;

		}

		

		.ccl-aviation--meta-item i {

			font-size: 1.1rem;

			color: var(--ccl-aviation-accent-gold);

		}

		

		/* ============================================

		   SECTION STRUCTURE

		   ============================================ */

		.ccl-aviation--section {

			padding: 100px 24px;

			background: var(--ccl-aviation-white);

		}

		

		.ccl-aviation--section:nth-child(even) {

			background: var(--ccl-aviation-light-bg);

		}

		

		.ccl-aviation--section-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-aviation--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-aviation--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: var(--ccl-aviation-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-aviation--section-kicker::before,

		.ccl-aviation--section-kicker::after {

			content: '';

			display: block;

			width: 30px;

			height: 2px;

			background: var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, var(--ccl-aviation-accent-gold) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-aviation--lead {

			font-size: 1.15rem;

			line-height: 1.7;

			color: var(--ccl-aviation-muted);

			margin-top: 20px;

		}

		

		/* ============================================

		   TWO-COLUMN LAYOUT WITH SIDEBAR

		   ============================================ */

		.ccl-aviation--content-layout {

			display: grid;

			grid-template-columns: 1fr 380px;

			gap: 48px;

			align-items: start;

		}

		

		.ccl-aviation--main-content {

			min-width: 0;

		}

		

		/* ============================================

		   SIDEBAR - ACCIDENT DETAILS

		   ============================================ */

		.ccl-aviation--sidebar {

			position: sticky;

			top: 150px;

		}

		

		.ccl-aviation--sidebar-card {

			background: var(--ccl-aviation-white);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 20px;

			padding: 0;

			position: relative;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

		}

		

		.ccl-aviation--sidebar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-aviation-primary-blue) 0%, var(--ccl-aviation-accent-gold) 100%);

		}

		

		.ccl-aviation--sidebar-header {

			padding: 28px 28px 20px;

			border-bottom: 2px solid var(--ccl-aviation-soft-border);

		}

		

		.ccl-aviation--sidebar-title {

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-aviation-ink);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-aviation--sidebar-title i {

			color: var(--ccl-aviation-primary-blue);

			font-size: 1.4rem;

		}

		

		.ccl-aviation--sidebar-subtitle {

			font-size: 0.9rem;

			color: var(--ccl-aviation-muted);

			line-height: 1.5;

		}

		

		.ccl-aviation--sidebar-body {

			padding: 24px 28px 28px;

		}

		

		.ccl-aviation--detail-item {

			padding: 16px 0;

			border-bottom: 1px solid var(--ccl-aviation-soft-border);

		}

		

		.ccl-aviation--detail-item:last-child {

			border-bottom: none;

			padding-bottom: 0;

		}

		

		.ccl-aviation--detail-item:first-child {

			padding-top: 0;

		}

		

		.ccl-aviation--detail-label {

			display: flex;

			align-items: center;

			gap: 8px;

			font-size: 0.8rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--ccl-aviation-muted);

			margin-bottom: 6px;

		}

		

		.ccl-aviation--detail-label i {

			color: var(--ccl-aviation-primary-blue);

			font-size: 0.9rem;

		}

		

		.ccl-aviation--detail-value {

			font-size: 1rem;

			font-weight: 600;

			color: var(--ccl-aviation-ink);

			line-height: 1.5;

		}

		

		/* Highlight variants for sidebar items */

		.ccl-aviation--detail-item--highlight {

			background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-aviation--detail-item--warning {

			background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-aviation--detail-item--success {

			background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-aviation--detail-item--highlight .ccl-aviation--detail-label i {

			color: var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--detail-item--warning .ccl-aviation--detail-label i {

			color: var(--ccl-aviation-warning-red);

		}

		

		.ccl-aviation--detail-item--success .ccl-aviation--detail-label i {

			color: var(--ccl-aviation-accent-green);

		}

		

		/* ============================================

		   CIRCUMSTANCES SECTION

		   ============================================ */

		.ccl-aviation--circumstances {

			background: var(--ccl-aviation-white);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 24px;

			padding: 48px;

			margin-bottom: 48px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviation--circumstances::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-aviation-primary-blue) 0%, var(--ccl-aviation-accent-green) 100%);

		}

		

		.ccl-aviation--circumstances h3 {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 24px;

		}

		

		.ccl-aviation--circumstances h3 i {

			color: var(--ccl-aviation-primary-blue);

			font-size: 1.5rem;

		}

		

		.ccl-aviation--circumstances p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-aviation-ink);

			margin-bottom: 20px;

		}

		

		.ccl-aviation--circumstances p:last-child {

			margin-bottom: 0;

		}

		

		/* ============================================

		   INFO BANNER

		   ============================================ */

		.ccl-aviation--info-banner {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 100%);

			border-radius: 20px;

			padding: 40px;

			margin: 60px 0;

			color: var(--ccl-aviation-white);

			text-align: center;

		}

		

		.ccl-aviation--info-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			margin-bottom: 24px;

			color: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-aviation--info-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-aviation--info-banner a {

			color: var(--ccl-aviation-accent-gold);

			font-weight: 600;

			text-decoration: underline;

			text-decoration-color: rgba(255, 168, 38, 0.4);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-aviation--info-banner a:hover {

			color: var(--ccl-aviation-white);

			text-decoration-color: var(--ccl-aviation-white);

		}

		

		/* Intro Banner - appears before main content */

		.ccl-aviation--intro-banner {

			background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-left: 6px solid var(--ccl-aviation-primary-blue);

			border-radius: 16px;

			padding: 36px 40px;

			margin-bottom: 48px;

			position: relative;

		}

		

		.ccl-aviation--intro-banner::before {

			content: '';

			position: absolute;

			top: 20px;

			left: 20px;

			width: 60px;

			height: 60px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(16, 185, 129, 0.1) 100%);

			border-radius: 50%;

			z-index: 0;

		}

		

		.ccl-aviation--intro-banner-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-aviation--intro-banner-icon {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			width: 48px;

			height: 48px;

			background: linear-gradient(135deg, var(--ccl-aviation-primary-blue) 0%, var(--ccl-aviation-cta-blue) 100%);

			border-radius: 12px;

			margin-bottom: 20px;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-aviation--intro-banner-icon i {

			color: var(--ccl-aviation-white);

			font-size: 1.5rem;

		}

		

		.ccl-aviation--intro-banner h3 {

			font-size: 1.4rem;

			color: var(--ccl-aviation-ink);

			margin-bottom: 16px;

			font-weight: 800;

		}

		

		.ccl-aviation--intro-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-aviation-muted);

			margin-bottom: 20px;

		}

		

		.ccl-aviation--intro-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-aviation--intro-banner strong,

		.ccl-aviation--intro-banner a {

			color: var(--ccl-aviation-primary-blue);

			font-weight: 700;

		}

		

		.ccl-aviation--intro-banner a {

			text-decoration: underline;

			text-decoration-color: rgba(29, 99, 255, 0.3);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-aviation--intro-banner a:hover {

			color: var(--ccl-aviation-cta-dark);

			text-decoration-color: var(--ccl-aviation-cta-dark);

		}

		

		/* ============================================

		   SOURCES

		   ============================================ */

		.ccl-aviation--sources {

			background: var(--ccl-aviation-light-bg);

			border-radius: 16px;

			padding: 32px;

			margin: 48px 0;

		}

		

		.ccl-aviation--sources h4 {

			display: flex;

			align-items: center;

			gap: 10px;

			font-size: 1.1rem;

			margin-bottom: 16px;

			color: var(--ccl-aviation-ink);

		}

		

		.ccl-aviation--sources h4 i {

			color: var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--sources p {

			font-size: 1rem;

			color: var(--ccl-aviation-muted);

		}

		

		/* ============================================

		   CONTACT FORM

		   ============================================ */

		.ccl-aviation--form {

			background: var(--ccl-aviation-white);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 24px;

			padding: 48px;

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-aviation--form h3 {

			text-align: center;

			margin-bottom: 32px;

		}

		

		.ccl-aviation--form-row {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

			gap: 24px;

			margin-bottom: 24px;

		}

		

		.ccl-aviation--form-group {

			display: flex;

			flex-direction: column;

			gap: 8px;

		}

		

		.ccl-aviation--form-label {

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ccl-aviation-ink);

		}

		

		.ccl-aviation--form-label--required::after {

			content: ' *';

			color: var(--ccl-aviation-warning-red);

		}

		

		.ccl-aviation--form-input,

		.ccl-aviation--form-select,

		.ccl-aviation--form-textarea {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			padding: 14px 18px;

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

			color: var(--ccl-aviation-ink);

			background: var(--ccl-aviation-white);

		}

		

		.ccl-aviation--form-input:focus,

		.ccl-aviation--form-select:focus,

		.ccl-aviation--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-aviation-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-aviation--form-textarea {

			resize: vertical;

			min-height: 150px;

		}

		

		.ccl-aviation--form-helper {

			font-size: 0.85rem;

			color: var(--ccl-aviation-muted);

		}

		

		/* ============================================

		   BUTTONS

		   ============================================ */

		.ccl-aviation--btn {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			padding: 16px 36px;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			display: inline-flex;

			align-items: center;

			gap: 10px;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviation--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-aviation--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-aviation--btn--primary {

			background: linear-gradient(135deg, var(--ccl-aviation-cta-blue) 0%, var(--ccl-aviation-primary-blue) 100%);

			color: var(--ccl-aviation-white);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-aviation--btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-aviation-cta-dark) 0%, var(--ccl-aviation-cta-blue) 100%);

			box-shadow: 0 8px 24px rgba(11, 92, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-aviation--btn--secondary {

			background: var(--ccl-aviation-white);

			color: var(--ccl-aviation-primary-blue);

			border: 2px solid var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--btn--secondary:hover {

			background: var(--ccl-aviation-primary-blue);

			color: var(--ccl-aviation-white);

		}

		

		.ccl-aviation--btn-group {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			justify-content: center;

			margin-top: 32px;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		   ============================================ */

		.ccl-aviation--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-aviation--scroll-reveal.ccl-aviation--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		@media (max-width: 1200px) {

			.ccl-aviation--content-layout {

				grid-template-columns: 1fr 340px;

				gap: 36px;

			}

			

			.ccl-aviation--sidebar-card {

				padding: 0;

			}

		}

		

		@media (max-width: 1024px) {

			.ccl-aviation--wrapper {

				font-size: 15px;

			}

			

			.ccl-aviation--section {

				padding: 80px 20px;

			}

			

			.ccl-aviation--hero {

				padding: 100px 20px 60px;

			}

			

			.ccl-aviation--content-layout {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-aviation--sidebar {

				position: static;

				order: -1;

			}

			

			.ccl-aviation--circumstances {

				padding: 36px;

			}

			

			.ccl-aviation--form {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-aviation--wrapper {

				font-size: 14px;

			}

			

			.ccl-aviation--section {

				padding: 60px 16px;

			}

			

			.ccl-aviation--hero {

				padding: 80px 16px 50px;

			}

			

			.ccl-aviation--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-aviation--sidebar-header {

				padding: 24px 24px 16px;

			}

			

			.ccl-aviation--sidebar-body {

				padding: 20px 24px 24px;

			}

			

			.ccl-aviation--sidebar-title {

				font-size: 1.2rem;

			}

			

			.ccl-aviation--circumstances {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-aviation--form {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-aviation--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-aviation--info-banner {

				padding: 32px 24px;

			}

			

			.ccl-aviation--intro-banner {

				padding: 28px 24px;

				border-radius: 12px;

			}

			

			.ccl-aviation--intro-banner h3 {

				font-size: 1.2rem;

			}

			

			.ccl-aviation--intro-banner p {

				font-size: 1rem;

			}

			

			.ccl-aviation--btn-group {

				flex-direction: column;

			}

			

			.ccl-aviation--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-aviation--kicker::before,

			.ccl-aviation--kicker::after {

				width: 20px;

			}

			

			.ccl-aviation--section-kicker::before,

			.ccl-aviation--section-kicker::after {

				width: 20px;

			}

		}

	/* ============================================

	   SCOPED CSS - All styles within wrapper

	   No global selectors that affect the entire site

	   ============================================ */



	.ccl-kb--wrapper {

	  /* CSS Variables */

	  --ccl-kb-primary-blue: #1d63ff;

	  --ccl-kb-cta-blue: #0b5cff;

	  --ccl-kb-cta-dark: #0846c1;

	  --ccl-kb-accent-green: #10b981;

	  --ccl-kb-accent-gold: #ffa826;

	  --ccl-kb-ink: #1e293b;

	  --ccl-kb-muted: #64748b;

	  --ccl-kb-soft-border: #e5e7eb;

	  --ccl-kb-white: #ffffff;

	  --ccl-kb-bg-light: #f8fafc;



	  /* Base Styles */

	  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	  line-height: 1.6;

	  color: var(--ccl-kb-ink);

	  scroll-behavior: smooth;

	}



	/* Reset within wrapper only */

	.ccl-kb--wrapper *,

	.ccl-kb--wrapper *::before,

	.ccl-kb--wrapper *::after {

	  margin: 0;

	  padding: 0;

	  box-sizing: border-box;

	}



	/* Typography */

	.ccl-kb--wrapper h1,

	.ccl-kb--wrapper h2,

	.ccl-kb--wrapper h3,

	.ccl-kb--wrapper h4 {

	  font-family: 'Inter Tight', 'Inter', sans-serif;

	  font-weight: 800;

	  line-height: 1.2;

	  color: var(--ccl-kb-ink);

	}



	/* Hero Section */

	.ccl-kb--hero {

	  position: relative;

	  background: linear-gradient(135deg, var(--ccl-kb-primary-blue) 0%, var(--ccl-kb-cta-dark) 100%);

	  padding: 100px 24px 120px;

	  text-align: center;

	  overflow: hidden;

	}



	.ccl-kb--hero::before {

	  content: '';

	  position: absolute;

	  top: -50%;

	  right: -20%;

	  width: 600px;

	  height: 600px;

	  background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

	  animation: ccl-kb-glow 8s ease-in-out infinite;

	  border-radius: 50%;

	}



	.ccl-kb--hero::after {

	  content: '';

	  position: absolute;

	  bottom: -30%;

	  left: -10%;

	  width: 500px;

	  height: 500px;

	  background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

	  animation: ccl-kb-glow 10s ease-in-out infinite reverse;

	  border-radius: 50%;

	}



	@keyframes ccl-kb-glow {

	  0%, 100% { transform: translate(0, 0) scale(1); }

	  50% { transform: translate(30px, -30px) scale(1.1); }

	}



	.ccl-kb--hero-content {

	  position: relative;

	  z-index: 1;

	  max-width: 950px;

	  margin: 0 auto;

	}



	.ccl-kb--hero-kicker {

	  display: inline-block;

	  font-size: 0.9rem;

	  font-weight: 600;

	  text-transform: uppercase;

	  letter-spacing: 2px;

	  color: rgba(255, 255, 255, 0.9);

	  margin-bottom: 16px;

	  opacity: 0;

	  animation: ccl-kb-fadeInDown 0.8s ease-out 0.2s forwards;

	}



	@keyframes ccl-kb-fadeInDown {

	  from {

		opacity: 0;

		transform: translateY(-20px);

	  }

	  to {

		opacity: 1;

		transform: translateY(0);

	  }

	}



	.ccl-kb--hero-title {

	  font-size: clamp(2.5rem, 6vw, 4.5rem);

	  color: #ffffff !important;

	  margin-bottom: 24px;

	  opacity: 0;

	  animation: ccl-kb-fadeInUp 0.8s ease-out 0.4s forwards;

	}



	@keyframes ccl-kb-fadeInUp {

	  from {

		opacity: 0;

		transform: translateY(30px);

	  }

	  to {

		opacity: 1;

		transform: translateY(0);

	  }

	}



	.ccl-kb--hero-lead {

	  font-size: 1.2rem;

	  color: rgba(255, 255, 255, 0.95);

	  margin-bottom: 40px;

	  opacity: 0;

	  animation: ccl-kb-fadeInUp 0.8s ease-out 0.6s forwards;

	}



	/* Search Box */

	.ccl-kb--search-box {

	  max-width: 650px;

	  margin: 0 auto;

	  opacity: 0;

	  animation: ccl-kb-fadeInUp 0.8s ease-out 0.8s forwards;

	}



	.ccl-kb--search-form {

	  position: relative;

	  display: flex;

	  align-items: center;

	  background: var(--ccl-kb-white);

	  border-radius: 50px;

	  padding: 8px 8px 8px 28px;

	  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);

	  transition: all 0.3s ease;

	}



	.ccl-kb--search-form:focus-within {

	  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.2);

	  transform: translateY(-2px);

	}



	.ccl-kb--search-icon {

	  color: var(--ccl-kb-muted);

	  font-size: 1.25rem;

	  margin-right: 16px;

	}



	.ccl-kb--search-input {

	  flex: 1;

	  border: none;

	  outline: none;

	  font-size: 1.05rem;

	  color: var(--ccl-kb-ink);

	  font-family: 'Inter', sans-serif;

	  background: transparent;

	}



	.ccl-kb--search-input::placeholder {

	  color: var(--ccl-kb-muted);

	}



	.ccl-kb--search-btn {

	  background: var(--ccl-kb-cta-blue);

	  color: var(--ccl-kb-white);

	  border: none;

	  border-radius: 40px;

	  padding: 14px 32px;

	  font-size: 1rem;

	  font-weight: 600;

	  cursor: pointer;

	  transition: all 0.3s ease;

	  font-family: 'Inter', sans-serif;

	}



	.ccl-kb--search-btn:hover {

	  background: var(--ccl-kb-cta-dark);

	  transform: scale(1.05);

	}



	.ccl-kb--search-btn:active {

	  transform: scale(0.98);

	}



	/* Popular Searches */

	.ccl-kb--popular-searches {

	  margin-top: 28px;

	  opacity: 0;

	  animation: ccl-kb-fadeInUp 0.8s ease-out 1s forwards;

	}



	.ccl-kb--popular-label {

	  font-size: 0.9rem;

	  color: rgba(255, 255, 255, 0.85);

	  margin-bottom: 12px;

	  font-weight: 500;

	}



	.ccl-kb--popular-tags {

	  display: flex;

	  flex-wrap: wrap;

	  justify-content: center;

	  gap: 12px;

	}



	.ccl-kb--popular-tag {

	  display: inline-flex;

	  align-items: center;

	  gap: 6px;

	  background: rgba(255, 255, 255, 0.15);

	  color: var(--ccl-kb-white);

	  padding: 8px 18px;

	  border-radius: 25px;

	  font-size: 0.95rem;

	  font-weight: 500;

	  text-decoration: none;

	  transition: all 0.3s ease;

	  backdrop-filter: blur(10px);

	  border: 1px solid rgba(255, 255, 255, 0.2);

	}



	.ccl-kb--popular-tag:hover {

	  background: rgba(255, 255, 255, 0.25);

	  transform: translateY(-2px);

	  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

	}



	.ccl-kb--popular-tag i {

	  font-size: 0.85rem;

	}



	/* Main Content Section */

	.ccl-kb--content {

	  padding: 100px 24px;

	  background: var(--ccl-kb-bg-light);

	}



	.ccl-kb--container {

	  max-width: 1400px;

	  margin: 0 auto;

	}



	/* Section Header */

	.ccl-kb--section-header {

	  text-align: center;

	  max-width: 850px;

	  margin: 0 auto 60px;

	}



	.ccl-kb--section-kicker {

	  display: inline-flex;

	  align-items: center;

	  gap: 16px;

	  font-size: 0.9rem;

	  font-weight: 700;

	  text-transform: uppercase;

	  letter-spacing: 2px;

	  color: var(--ccl-kb-primary-blue);

	  margin-bottom: 16px;

	}



	.ccl-kb--section-kicker::before,

	.ccl-kb--section-kicker::after {

	  content: '';

	  width: 40px;

	  height: 2px;

	  background: var(--ccl-kb-primary-blue);

	}



	.ccl-kb--section-title {

	  font-size: clamp(2.25rem, 4vw, 3.5rem);

	  margin-bottom: 20px;

	  color: var(--ccl-kb-ink);

	}



	.ccl-kb--section-title mark {

	  background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.25) 100%);

	  color: var(--ccl-kb-primary-blue);

	  padding: 0 8px;

	  border-radius: 4px;

	}



	.ccl-kb--section-lead {

	  font-size: 1.15rem;

	  color: var(--ccl-kb-muted);

	  line-height: 1.7;

	}



	/* Filter Bar */

	.ccl-kb--filter-bar {

	  display: flex;

	  justify-content: space-between;

	  align-items: center;

	  margin-bottom: 40px;

	  padding: 20px 28px;

	  background: var(--ccl-kb-white);

	  border-radius: 16px;

	  border: 2px solid var(--ccl-kb-soft-border);

	  flex-wrap: wrap;

	  gap: 16px;

	}



	.ccl-kb--filter-label {

	  font-size: 1rem;

	  font-weight: 600;

	  color: var(--ccl-kb-ink);

	  display: flex;

	  align-items: center;

	  gap: 8px;

	}



	.ccl-kb--view-toggle {

	  display: flex;

	  gap: 8px;

	  background: var(--ccl-kb-bg-light);

	  padding: 6px;

	  border-radius: 12px;

	}



	.ccl-kb--view-btn {

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  gap: 6px;

	  min-width: 44px;

	  height: 44px;

	  padding: 0 16px;

	  border: none;

	  background: transparent;

	  color: var(--ccl-kb-muted);

	  border-radius: 8px;

	  cursor: pointer;

	  transition: all 0.3s ease;

	  font-size: 1rem;

	  font-weight: 500;

	  font-family: 'Inter', sans-serif;

	}



	.ccl-kb--view-btn i {

	  font-size: 1.1rem;

	}



	.ccl-kb--view-btn:hover {

	  background: var(--ccl-kb-white);

	  color: var(--ccl-kb-primary-blue);

	}



	.ccl-kb--view-btn.ccl-kb--active {

	  background: var(--ccl-kb-primary-blue);

	  color: var(--ccl-kb-white);

	  box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

	}



	/* Categories Wrapper - 2 columns */

	.ccl-kb--categories-wrapper {

	  display: grid;

	  grid-template-columns: repeat(2, 1fr);

	  gap: 60px 40px;

	}



	/* Category Section */

	.ccl-kb--category-section {

	  margin-bottom: 0;

	  padding: 32px;

	  background: var(--ccl-kb-white);

	  border-radius: 20px;

	  border: 2px solid var(--ccl-kb-soft-border);

	  position: relative;

	  transition: all 0.3s ease;

	}



	.ccl-kb--category-section:hover {

	  border-color: rgba(29, 99, 255, 0.2);

	  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);

	}



	.ccl-kb--category-header {

	  display: flex;

	  align-items: center;

	  gap: 16px;

	  margin-bottom: 24px;

	  padding-bottom: 20px;

	  border-bottom: 2px solid var(--ccl-kb-soft-border);

	}



	.ccl-kb--category-icon-large {

	  width: 56px;

	  height: 56px;

	  min-width: 56px;

	  border-radius: 14px;

	  background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(11, 92, 255, 0.15) 100%);

	  display: flex;

	  align-items: center;

	  justify-content: center;

	}



	.ccl-kb--category-icon-large i {

	  font-size: 1.5rem;

	  color: var(--ccl-kb-primary-blue);

	}



	.ccl-kb--category-header-text {

	  flex: 1;

	}



	.ccl-kb--category-name {

	  font-size: clamp(1.5rem, 2.5vw, 1.85rem);

	  margin-bottom: 6px;

	  color: var(--ccl-kb-ink);

	  font-weight: 800;

	}



	.ccl-kb--category-description {

	  font-size: 0.95rem;

	  color: var(--ccl-kb-muted);

	  line-height: 1.5;

	}



	.ccl-kb--category-view-all {

	  display: inline-flex;

	  align-items: center;

	  gap: 6px;

	  color: var(--ccl-kb-primary-blue);

	  font-weight: 600;

	  font-size: 0.85rem;

	  text-decoration: none;

	  transition: all 0.3s ease;

	  white-space: nowrap;

	  padding: 8px 16px;

	  border-radius: 20px;

	  border: 2px solid var(--ccl-kb-soft-border);

	}



	.ccl-kb--category-view-all:hover {

	  border-color: var(--ccl-kb-primary-blue);

	  background: rgba(29, 99, 255, 0.05);

	  transform: translateX(5px);

	}



	.ccl-kb--category-view-all i {

	  transition: transform 0.3s ease;

	}



	.ccl-kb--category-view-all:hover i {

	  transform: translateX(5px);

	}



	/* Article Grid */

	.ccl-kb--articles-grid {

	  display: grid;

	  grid-template-columns: 1fr;

	  gap: 16px;

	}



	/* Grid View (Box Layout) */

	.ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--articles-grid {

	  grid-template-columns: repeat(2, 1fr);

	  gap: 12px;

	}



	.ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-card {

	  padding: 16px;

	}



	.ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-title {

	  font-size: 1rem;

	}



	.ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-excerpt {

	  font-size: 0.85rem;

	  display: -webkit-box;

	  -webkit-line-clamp: 2;

	  -webkit-box-orient: vertical;

	  overflow: hidden;

	}



	.ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-meta {

	  margin-bottom: 8px;

	}



	.ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-footer {

	  padding-top: 8px;

	}



	/* List View (Default - Single Column within category) */

	.ccl-kb--categories-wrapper.ccl-kb--list-view .ccl-kb--articles-grid {

	  grid-template-columns: 1fr;

	}



	/* Article Card */

	.ccl-kb--article-card {

	  position: relative;

	  background: var(--ccl-kb-bg-light);

	  border: 2px solid var(--ccl-kb-soft-border);

	  border-radius: 16px;

	  padding: 20px;

	  text-decoration: none;

	  color: var(--ccl-kb-ink);

	  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	  display: flex;

	  flex-direction: column;

	  overflow: hidden;

	}



	.ccl-kb--article-card::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  height: 4px;

	  background: var(--ccl-kb-primary-blue);

	  transform: scaleX(0);

	  transform-origin: left;

	  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	}



	.ccl-kb--article-card:hover {

	  transform: translateY(-8px);

	  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);

	  border-color: rgba(29, 99, 255, 0.3);

	}



	.ccl-kb--article-card:hover::before {

	  transform: scaleX(1);

	}



	.ccl-kb--article-meta {

	  display: flex;

	  align-items: center;

	  gap: 10px;

	  margin-bottom: 12px;

	  font-size: 0.8rem;

	  color: var(--ccl-kb-muted);

	}



	.ccl-kb--article-type {

	  display: inline-flex;

	  align-items: center;

	  gap: 5px;

	  background: rgba(29, 99, 255, 0.1);

	  color: var(--ccl-kb-primary-blue);

	  padding: 3px 10px;

	  border-radius: 10px;

	  font-weight: 600;

	  text-transform: uppercase;

	  letter-spacing: 0.5px;

	  font-size: 0.7rem;

	}



	.ccl-kb--article-date {

	  display: flex;

	  align-items: center;

	  gap: 5px;

	}



	.ccl-kb--article-title {

	  font-size: 1.15rem;

	  margin-bottom: 10px;

	  color: var(--ccl-kb-ink);

	  font-weight: 800;

	  line-height: 1.3;

	}



	.ccl-kb--article-excerpt {

	  font-size: 0.95rem;

	  color: var(--ccl-kb-muted);

	  line-height: 1.5;

	  margin-bottom: 16px;

	  flex: 1;

	  display: -webkit-box;

	  -webkit-line-clamp: 2;

	  -webkit-box-orient: vertical;

	  overflow: hidden;

	}



	.ccl-kb--article-footer {

	  display: flex;

	  align-items: center;

	  justify-content: space-between;

	  padding-top: 12px;

	  border-top: 1px solid var(--ccl-kb-soft-border);

	}



	.ccl-kb--article-read-time {

	  display: flex;

	  align-items: center;

	  gap: 5px;

	  color: var(--ccl-kb-muted);

	  font-size: 0.85rem;

	}



	.ccl-kb--article-link {

	  display: inline-flex;

	  align-items: center;

	  gap: 6px;

	  color: var(--ccl-kb-primary-blue);

	  font-weight: 600;

	  font-size: 0.9rem;

	  transition: all 0.3s ease;

	}



	.ccl-kb--article-link i {

	  transition: transform 0.3s ease;

	}



	.ccl-kb--article-card:hover .ccl-kb--article-link i {

	  transform: translateX(5px);

	}



	/* Featured Article */

	.ccl-kb--featured-article {

	  background: linear-gradient(135deg, rgba(29, 99, 255, 0.05) 0%, rgba(11, 92, 255, 0.08) 100%);

	  border: 2px solid rgba(29, 99, 255, 0.2);

	  position: relative;

	}



	.ccl-kb--featured-article::after {

	  content: 'Featured';

	  position: absolute;

	  top: 16px;

	  right: 16px;

	  background: var(--ccl-kb-accent-gold);

	  color: var(--ccl-kb-white);

	  padding: 6px 14px;

	  border-radius: 20px;

	  font-size: 0.75rem;

	  font-weight: 700;

	  text-transform: uppercase;

	  letter-spacing: 0.5px;

	}



	/* CTA Section */

	.ccl-kb--cta {

	  background: linear-gradient(135deg, var(--ccl-kb-ink) 0%, #0f172a 100%);

	  padding: 100px 24px;

	  text-align: center;

	  position: relative;

	  overflow: hidden;

	}



	.ccl-kb--cta::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  bottom: 0;

	  background: url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><rect width="1" height="1" fill="rgba(255,255,255,0.03)"/></svg>');

	  background-size: 100px 100px;

	  opacity: 0.4;

	}



	.ccl-kb--cta::after {

	  content: '';

	  position: absolute;

	  top: -50%;

	  left: 50%;

	  transform: translateX(-50%);

	  width: 800px;

	  height: 800px;

	  background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

	  pointer-events: none;

	}



	.ccl-kb--cta-content {

	  position: relative;

	  z-index: 1;

	  max-width: 750px;

	  margin: 0 auto;

	}



	.ccl-kb--cta-icon {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  width: 80px;

	  height: 80px;

	  background: rgba(29, 99, 255, 0.15);

	  border: 2px solid rgba(29, 99, 255, 0.3);

	  border-radius: 50%;

	  margin-bottom: 24px;

	  animation: ccl-kb-pulse 2s ease-in-out infinite;

	}



	.ccl-kb--cta-icon i {

	  font-size: 2rem;

	  color: var(--ccl-kb-primary-blue);

	}



	@keyframes ccl-kb-pulse {

	  0%, 100% {

		transform: scale(1);

		box-shadow: 0 0 0 0 rgba(29, 99, 255, 0.4);

	  }

	  50% {

		transform: scale(1.05);

		box-shadow: 0 0 0 20px rgba(29, 99, 255, 0);

	  }

	}



	.ccl-kb--cta-title {

	  font-size: clamp(2rem, 5vw, 3.25rem);

	  color: #ffffff !important;

	  margin-bottom: 20px;

	  line-height: 1.2;

	}



	.ccl-kb--cta-text {

	  font-size: 1.2rem;

	  color: rgba(255, 255, 255, 0.85);

	  margin-bottom: 40px;

	  line-height: 1.8;

	  max-width: 650px;

	  margin-left: auto;

	  margin-right: auto;

	}



	.ccl-kb--cta-buttons {

	  display: flex;

	  gap: 16px;

	  justify-content: center;

	  flex-wrap: wrap;

	  margin-bottom: 32px;

	}



	.ccl-kb--cta-info {

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  gap: 24px;

	  flex-wrap: wrap;

	  margin-top: 40px;

	  padding-top: 32px;

	  border-top: 1px solid rgba(255, 255, 255, 0.1);

	}



	.ccl-kb--cta-info-item {

	  display: flex;

	  align-items: center;

	  gap: 10px;

	  color: rgba(255, 255, 255, 0.8);

	  font-size: 0.95rem;

	}



	.ccl-kb--cta-info-item i {

	  color: var(--ccl-kb-accent-green);

	  font-size: 1.1rem;

	}



	/* Buttons */

	.ccl-kb--btn {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  gap: 10px;

	  padding: 16px 36px;

	  border-radius: 50px;

	  font-size: 1.05rem;

	  font-weight: 600;

	  text-decoration: none;

	  transition: all 0.3s ease;

	  cursor: pointer;

	  border: 2px solid transparent;

	  font-family: 'Inter', sans-serif;

	  position: relative;

	  overflow: hidden;

	}



	.ccl-kb--btn::before {

	  content: '';

	  position: absolute;

	  top: 50%;

	  left: 50%;

	  width: 0;

	  height: 0;

	  border-radius: 50%;

	  background: rgba(255, 255, 255, 0.2);

	  transform: translate(-50%, -50%);

	  transition: width 0.6s, height 0.6s;

	}



	.ccl-kb--btn:hover::before {

	  width: 300px;

	  height: 300px;

	}



	.ccl-kb--btn span {

	  position: relative;

	  z-index: 1;

	}



	.ccl-kb--btn i {

	  position: relative;

	  z-index: 1;

	}



	.ccl-kb--btn--primary {

	  background: var(--ccl-kb-cta-blue);

	  color: var(--ccl-kb-white);

	}



	.ccl-kb--btn--primary:hover {

	  background: var(--ccl-kb-cta-dark);

	  transform: translateY(-2px);

	  box-shadow: 0 10px 30px rgba(11, 92, 255, 0.3);

	}



	.ccl-kb--btn--secondary {

	  background: transparent;

	  color: var(--ccl-kb-white);

	  border-color: rgba(255, 255, 255, 0.3);

	}



	.ccl-kb--btn--secondary:hover {

	  background: rgba(255, 255, 255, 0.1);

	  border-color: var(--ccl-kb-white);

	  transform: translateY(-2px);

	}



	/* Scroll Reveal Animation */

	.ccl-kb--scroll-reveal {

	  opacity: 0;

	  transform: translateY(40px);

	  transition: opacity 0.6s ease, transform 0.6s ease;

	}



	.ccl-kb--scroll-reveal.ccl-kb--revealed {

	  opacity: 1;

	  transform: translateY(0);

	}



	/* Responsive Design */

	@media (max-width: 1024px) {

	  .ccl-kb--hero {

		padding: 80px 24px 100px;

	  }



	  .ccl-kb--content {

		padding: 80px 24px;

	  }



	  .ccl-kb--categories-wrapper {

		grid-template-columns: 1fr;

		gap: 40px;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--list-view .ccl-kb--articles-grid {

		grid-template-columns: 1fr;

	  }



	  .ccl-kb--articles-grid {

		gap: 16px;

	  }

	}



	@media (max-width: 768px) {

	  .ccl-kb--hero {

		padding: 60px 20px 80px;

	  }



	  .ccl-kb--hero-title {

		font-size: 2.5rem;

	  }



	  .ccl-kb--hero-lead {

		font-size: 1.1rem;

	  }



	  .ccl-kb--search-form {

		flex-direction: column;

		padding: 16px;

		border-radius: 20px;

	  }



	  .ccl-kb--search-input {

		width: 100%;

		padding: 12px 0;

		text-align: center;

	  }



	  .ccl-kb--search-btn {

		width: 100%;

		margin-top: 12px;

	  }



	  .ccl-kb--popular-tags {

		flex-direction: column;

		align-items: stretch;

	  }



	  .ccl-kb--popular-tag {

		justify-content: center;

	  }



	  .ccl-kb--content {

		padding: 60px 20px;

	  }



	  .ccl-kb--filter-bar {

		flex-direction: column;

		align-items: stretch;

		padding: 16px 20px;

	  }



	  .ccl-kb--filter-label {

		justify-content: center;

	  }



	  .ccl-kb--view-toggle {

		justify-content: center;

	  }



	  .ccl-kb--categories-wrapper {

		grid-template-columns: 1fr;

		gap: 40px;

	  }



	  .ccl-kb--category-section {

		padding: 24px;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--list-view .ccl-kb--articles-grid {

		grid-template-columns: 1fr;

		gap: 16px;

	  }



	  .ccl-kb--article-card {

		padding: 20px;

	  }



	  .ccl-kb--category-header {

		flex-direction: column;

		align-items: flex-start;

		gap: 16px;

	  }



	  .ccl-kb--category-view-all {

		align-self: stretch;

		justify-content: center;

	  }



	  .ccl-kb--section-title {

		font-size: 2.25rem;

	  }



	  .ccl-kb--section-kicker::before,

	  .ccl-kb--section-kicker::after {

		width: 25px;

	  }



	  .ccl-kb--cta {

		padding: 80px 20px;

	  }



	  .ccl-kb--cta-icon {

		width: 70px;

		height: 70px;

	  }



	  .ccl-kb--cta-icon i {

		font-size: 1.75rem;

	  }



	  .ccl-kb--cta-text {

		font-size: 1.1rem;

		margin-bottom: 32px;

	  }



	  .ccl-kb--cta-buttons {

		flex-direction: column;

	  }



	  .ccl-kb--btn {

		width: 100%;

	  }



	  .ccl-kb--cta-info {

		flex-direction: column;

		gap: 16px;

		margin-top: 32px;

		padding-top: 24px;

	  }

	}



	@media (max-width: 480px) {

	  .ccl-kb--hero {

		padding: 50px 16px 70px;

	  }



	  .ccl-kb--hero-title {

		font-size: 2rem;

	  }



	  .ccl-kb--content {

		padding: 50px 16px;

	  }



	  .ccl-kb--section-header {

		margin-bottom: 40px;

	  }



	  .ccl-kb--article-card {

		padding: 18px;

	  }



	  .ccl-kb--category-section {

		padding: 20px;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-card {

		padding: 12px;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-title {

		font-size: 0.9rem;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-excerpt {

		font-size: 0.8rem;

		-webkit-line-clamp: 2;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-type {

		font-size: 0.65rem;

		padding: 2px 8px;

	  }



	  .ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-read-time,

	  .ccl-kb--categories-wrapper.ccl-kb--grid-view .ccl-kb--article-link {

		font-size: 0.75rem;

	  }



	  .ccl-kb--article-title {

		font-size: 1.1rem;

	  }



	  .ccl-kb--category-icon-large {

		width: 50px;

		height: 50px;

		min-width: 50px;

	  }



	  .ccl-kb--category-icon-large i {

		font-size: 1.3rem;

	  }



	  .ccl-kb--cta {

		padding: 60px 16px;

	  }



	  .ccl-kb--cta-icon {

		width: 64px;

		height: 64px;

		margin-bottom: 20px;

	  }



	  .ccl-kb--cta-icon i {

		font-size: 1.5rem;

	  }



	  .ccl-kb--cta-text {

		font-size: 1rem;

	  }



	  .ccl-kb--category-section {

		margin-bottom: 0;

	  }

	}

	/* ============================================

	   SCOPED CSS - All styles within wrapper

	   No global selectors that affect the entire site

	   ============================================ */



	.ccl-mvinjuries--wrapper {

	  /* CSS Variables */

	  --ccl-mvi-primary-blue: #1d63ff;

	  --ccl-mvi-cta-blue: #0b5cff;

	  --ccl-mvi-cta-dark: #0846c1;

	  --ccl-mvi-accent-green: #10b981;

	  --ccl-mvi-accent-gold: #ffa826;

	  --ccl-mvi-ink: #1e293b;

	  --ccl-mvi-muted: #64748b;

	  --ccl-mvi-soft-border: #e5e7eb;

	  --ccl-mvi-white: #ffffff;

	  --ccl-mvi-bg-light: #f8fafc;



	  /* Base Styles */

	  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	  line-height: 1.6;

	  color: var(--ccl-mvi-ink);

	  scroll-behavior: smooth;

	}



	/* Reset within wrapper only */

	.ccl-mvinjuries--wrapper *,

	.ccl-mvinjuries--wrapper *::before,

	.ccl-mvinjuries--wrapper *::after {

	  margin: 0;

	  padding: 0;

	  box-sizing: border-box;

	}



	/* Typography */

	.ccl-mvinjuries--wrapper h1,

	.ccl-mvinjuries--wrapper h2,

	.ccl-mvinjuries--wrapper h3,

	.ccl-mvinjuries--wrapper h4 {

	  font-family: 'Inter Tight', 'Inter', sans-serif;

	  font-weight: 800;

	  line-height: 1.2;

	  color: var(--ccl-mvi-ink);

	}



	/* Hero Section */

	.ccl-mvinjuries--hero {

	  position: relative;

	  background: linear-gradient(135deg, var(--ccl-mvi-primary-blue) 0%, var(--ccl-mvi-cta-dark) 100%);

	  padding: 120px 24px 140px;

	  text-align: center;

	  overflow: hidden;

	}



	.ccl-mvinjuries--hero::before {

	  content: '';

	  position: absolute;

	  top: -50%;

	  right: -20%;

	  width: 700px;

	  height: 700px;

	  background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

	  animation: ccl-mvi-glow 8s ease-in-out infinite;

	  border-radius: 50%;

	}



	.ccl-mvinjuries--hero::after {

	  content: '';

	  position: absolute;

	  bottom: -30%;

	  left: -10%;

	  width: 600px;

	  height: 600px;

	  background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

	  animation: ccl-mvi-glow 10s ease-in-out infinite reverse;

	  border-radius: 50%;

	}



	@keyframes ccl-mvi-glow {

	  0%, 100% { transform: translate(0, 0) scale(1); }

	  50% { transform: translate(30px, -30px) scale(1.1); }

	}



	.ccl-mvinjuries--hero-content {

	  position: relative;

	  z-index: 1;

	  max-width: 950px;

	  margin: 0 auto;

	}



	.ccl-mvinjuries--breadcrumb {

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  gap: 12px;

	  margin-bottom: 24px;

	  font-size: 0.95rem;

	  opacity: 0;

	  animation: ccl-mvi-fadeInDown 0.8s ease-out 0.2s forwards;

	}



	@keyframes ccl-mvi-fadeInDown {

	  from {

		opacity: 0;

		transform: translateY(-20px);

	  }

	  to {

		opacity: 1;

		transform: translateY(0);

	  }

	}



	.ccl-mvinjuries--breadcrumb a {

	  color: rgba(255, 255, 255, 0.8);

	  text-decoration: none;

	  transition: color 0.3s ease;

	}



	.ccl-mvinjuries--breadcrumb a:hover {

	  color: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--breadcrumb-separator {

	  color: rgba(255, 255, 255, 0.5);

	}



	.ccl-mvinjuries--breadcrumb-current {

	  color: var(--ccl-mvi-white);

	  font-weight: 600;

	}



	.ccl-mvinjuries--hero-icon {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  width: 100px;

	  height: 100px;

	  background: rgba(255, 255, 255, 0.15);

	  border: 3px solid rgba(255, 255, 255, 0.3);

	  border-radius: 50%;

	  margin-bottom: 28px;

	  opacity: 0;

	  animation: ccl-mvi-fadeInScale 0.8s ease-out 0.3s forwards;

	}



	@keyframes ccl-mvi-fadeInScale {

	  from {

		opacity: 0;

		transform: scale(0.8);

	  }

	  to {

		opacity: 1;

		transform: scale(1);

	  }

	}



	.ccl-mvinjuries--hero-icon i {

	  font-size: 2.5rem;

	  color: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--hero-title {

	  font-size: clamp(2.5rem, 6vw, 4.5rem);

	  color: #ffffff !important;

	  margin-bottom: 24px;

	  opacity: 0;

	  animation: ccl-mvi-fadeInUp 0.8s ease-out 0.4s forwards;

	}



	@keyframes ccl-mvi-fadeInUp {

	  from {

		opacity: 0;

		transform: translateY(30px);

	  }

	  to {

		opacity: 1;

		transform: translateY(0);

	  }

	}



	.ccl-mvinjuries--hero-lead {

	  font-size: 1.25rem;

	  color: rgba(255, 255, 255, 0.95);

	  margin-bottom: 0;

	  line-height: 1.8;

	  opacity: 0;

	  animation: ccl-mvi-fadeInUp 0.8s ease-out 0.6s forwards;

	}



	/* Getting Started Section */

	.ccl-mvinjuries--getting-started {

	  padding: 100px 24px;

	  background: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--container {

	  max-width: 1400px;

	  margin: 0 auto;

	}



	.ccl-mvinjuries--intro-box {

	  max-width: 900px;

	  margin: 0 auto 80px;

	  padding: 48px;

	  background: linear-gradient(135deg, rgba(29, 99, 255, 0.03) 0%, rgba(11, 92, 255, 0.05) 100%);

	  border: 2px solid rgba(29, 99, 255, 0.1);

	  border-radius: 24px;

	  position: relative;

	}



	.ccl-mvinjuries--intro-box::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  height: 5px;

	  background: linear-gradient(90deg, var(--ccl-mvi-primary-blue) 0%, var(--ccl-mvi-cta-blue) 100%);

	  border-radius: 24px 24px 0 0;

	}



	.ccl-mvinjuries--intro-title {

	  font-size: clamp(1.75rem, 3vw, 2.25rem);

	  margin-bottom: 20px;

	  color: var(--ccl-mvi-ink);

	  display: flex;

	  align-items: center;

	  gap: 16px;

	}



	.ccl-mvinjuries--intro-title i {

	  color: var(--ccl-mvi-primary-blue);

	  font-size: 1.5rem;

	}



	.ccl-mvinjuries--intro-text {

	  font-size: 1.1rem;

	  color: var(--ccl-mvi-muted);

	  line-height: 1.8;

	  margin-bottom: 32px;

	}



	.ccl-mvinjuries--intro-cta {

	  display: inline-flex;

	  align-items: center;

	  gap: 10px;

	  padding: 16px 36px;

	  background: var(--ccl-mvi-cta-blue);

	  color: var(--ccl-mvi-white);

	  text-decoration: none;

	  border-radius: 50px;

	  font-weight: 600;

	  font-size: 1.05rem;

	  transition: all 0.3s ease;

	  position: relative;

	  overflow: hidden;

	}



	.ccl-mvinjuries--intro-cta::before {

	  content: '';

	  position: absolute;

	  top: 50%;

	  left: 50%;

	  width: 0;

	  height: 0;

	  border-radius: 50%;

	  background: rgba(255, 255, 255, 0.2);

	  transform: translate(-50%, -50%);

	  transition: width 0.6s, height 0.6s;

	}



	.ccl-mvinjuries--intro-cta:hover::before {

	  width: 300px;

	  height: 300px;

	}



	.ccl-mvinjuries--intro-cta span,

	.ccl-mvinjuries--intro-cta i {

	  position: relative;

	  z-index: 1;

	}



	.ccl-mvinjuries--intro-cta:hover {

	  background: var(--ccl-mvi-cta-dark);

	  transform: translateY(-2px);

	  box-shadow: 0 10px 30px rgba(11, 92, 255, 0.3);

	}



	/* Quick Actions Grid */

	.ccl-mvinjuries--quick-actions {

	  display: grid;

	  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

	  gap: 28px;

	  margin-bottom: 80px;

	}



	.ccl-mvinjuries--quick-card {

	  background: var(--ccl-mvi-white);

	  border: 2px solid var(--ccl-mvi-soft-border);

	  border-radius: 20px;

	  padding: 32px;

	  text-align: center;

	  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	  position: relative;

	  overflow: hidden;

	}



	.ccl-mvinjuries--quick-card::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  height: 4px;

	  background: var(--ccl-mvi-primary-blue);

	  transform: scaleX(0);

	  transform-origin: left;

	  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	}



	.ccl-mvinjuries--quick-card:hover {

	  transform: translateY(-10px);

	  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);

	  border-color: rgba(29, 99, 255, 0.3);

	}



	.ccl-mvinjuries--quick-card:hover::before {

	  transform: scaleX(1);

	}



	.ccl-mvinjuries--quick-icon {

	  width: 80px;

	  height: 80px;

	  margin: 0 auto 20px;

	  border-radius: 50%;

	  background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(11, 92, 255, 0.15) 100%);

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  transition: all 0.4s ease;

	}



	.ccl-mvinjuries--quick-card:hover .ccl-mvinjuries--quick-icon {

	  transform: rotate(360deg) scale(1.1);

	  background: linear-gradient(135deg, var(--ccl-mvi-primary-blue) 0%, var(--ccl-mvi-cta-blue) 100%);

	}



	.ccl-mvinjuries--quick-icon i {

	  font-size: 2rem;

	  color: var(--ccl-mvi-primary-blue);

	  transition: color 0.4s ease;

	}



	.ccl-mvinjuries--quick-card:hover .ccl-mvinjuries--quick-icon i {

	  color: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--quick-title {

	  font-size: 1.25rem;

	  margin-bottom: 12px;

	  color: var(--ccl-mvi-ink);

	}



	.ccl-mvinjuries--quick-desc {

	  font-size: 0.95rem;

	  color: var(--ccl-mvi-muted);

	  line-height: 1.6;

	}



	/* Articles Section */

	.ccl-mvinjuries--articles {

	  padding: 100px 24px;

	  background: var(--ccl-mvi-bg-light);

	}



	/* Section Header */

	.ccl-mvinjuries--section-header {

	  text-align: center;

	  max-width: 850px;

	  margin: 0 auto 60px;

	}



	.ccl-mvinjuries--section-kicker {

	  display: inline-flex;

	  align-items: center;

	  gap: 16px;

	  font-size: 0.9rem;

	  font-weight: 700;

	  text-transform: uppercase;

	  letter-spacing: 2px;

	  color: var(--ccl-mvi-primary-blue);

	  margin-bottom: 16px;

	}



	.ccl-mvinjuries--section-kicker::before,

	.ccl-mvinjuries--section-kicker::after {

	  content: '';

	  width: 40px;

	  height: 2px;

	  background: var(--ccl-mvi-primary-blue);

	}



	.ccl-mvinjuries--section-title {

	  font-size: clamp(2.25rem, 4vw, 3.5rem);

	  margin-bottom: 20px;

	  color: var(--ccl-mvi-ink);

	}



	.ccl-mvinjuries--section-title mark {

	  background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.25) 100%);

	  color: var(--ccl-mvi-primary-blue);

	  padding: 0 8px;

	  border-radius: 4px;

	}



	.ccl-mvinjuries--section-lead {

	  font-size: 1.15rem;

	  color: var(--ccl-mvi-muted);

	  line-height: 1.7;

	}



	/* Filter Bar */

	.ccl-mvinjuries--filter-bar {

	  display: flex;

	  justify-content: space-between;

	  align-items: center;

	  margin-bottom: 40px;

	  padding: 20px 28px;

	  background: var(--ccl-mvi-white);

	  border-radius: 16px;

	  border: 2px solid var(--ccl-mvi-soft-border);

	  flex-wrap: wrap;

	  gap: 16px;

	}



	.ccl-mvinjuries--filter-info {

	  font-size: 1rem;

	  font-weight: 600;

	  color: var(--ccl-mvi-ink);

	  display: flex;

	  align-items: center;

	  gap: 8px;

	  flex-wrap: wrap;

	}



	.ccl-mvinjuries--showing-count {

	  font-size: 0.9rem;

	  color: var(--ccl-mvi-muted);

	  font-weight: 500;

	}



	.ccl-mvinjuries--filter-count {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  min-width: 32px;

	  height: 32px;

	  background: var(--ccl-mvi-primary-blue);

	  color: var(--ccl-mvi-white);

	  border-radius: 20px;

	  font-size: 0.9rem;

	  font-weight: 700;

	  padding: 0 12px;

	}



	.ccl-mvinjuries--filter-controls {

	  display: flex;

	  align-items: center;

	  gap: 20px;

	  flex-wrap: wrap;

	}



	.ccl-mvinjuries--view-toggle {

	  display: flex;

	  gap: 8px;

	  background: var(--ccl-mvi-bg-light);

	  padding: 6px;

	  border-radius: 12px;

	}



	.ccl-mvinjuries--view-btn {

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  gap: 6px;

	  min-width: 44px;

	  height: 44px;

	  padding: 0 16px;

	  border: none;

	  background: transparent;

	  color: var(--ccl-mvi-muted);

	  border-radius: 8px;

	  cursor: pointer;

	  transition: all 0.3s ease;

	  font-size: 0.95rem;

	  font-weight: 500;

	  font-family: 'Inter', sans-serif;

	}



	.ccl-mvinjuries--view-btn i {

	  font-size: 1.1rem;

	}



	.ccl-mvinjuries--view-btn:hover {

	  background: var(--ccl-mvi-white);

	  color: var(--ccl-mvi-primary-blue);

	}



	.ccl-mvinjuries--view-btn.ccl-mvinjuries--active {

	  background: var(--ccl-mvi-primary-blue);

	  color: var(--ccl-mvi-white);

	  box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

	}



	.ccl-mvinjuries--sort-select {

	  display: flex;

	  align-items: center;

	  gap: 12px;

	  font-size: 0.95rem;

	  color: var(--ccl-mvi-muted);

	}



	.ccl-mvinjuries--sort-select label {

	  font-weight: 600;

	  color: var(--ccl-mvi-ink);

	}



	.ccl-mvinjuries--sort-select select {

	  padding: 10px 36px 10px 16px;

	  border: 2px solid var(--ccl-mvi-soft-border);

	  border-radius: 12px;

	  background: var(--ccl-mvi-white);

	  color: var(--ccl-mvi-ink);

	  font-family: 'Inter', sans-serif;

	  font-size: 0.95rem;

	  font-weight: 500;

	  cursor: pointer;

	  transition: all 0.3s ease;

	  appearance: none;

	  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 9L1 4h10z'/%3E%3C/svg%3E");

	  background-repeat: no-repeat;

	  background-position: right 12px center;

	}



	.ccl-mvinjuries--sort-select select:hover {

	  border-color: var(--ccl-mvi-primary-blue);

	}



	.ccl-mvinjuries--sort-select select:focus {

	  outline: none;

	  border-color: var(--ccl-mvi-primary-blue);

	  box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

	}



	/* Articles Grid */

	.ccl-mvinjuries--articles-grid {

	  display: grid;

	  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));

	  gap: 32px;

	  margin-bottom: 60px;

	}



	/* Grid View - Compact card layout */

	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view {

	  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));

	  gap: 24px;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-card {

	  padding: 24px;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-header {

	  flex-direction: column;

	  align-items: center;

	  text-align: center;

	  gap: 12px;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-icon {

	  width: 64px;

	  height: 64px;

	  min-width: 64px;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-icon i {

	  font-size: 1.75rem;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-meta {

	  display: flex;

	  flex-direction: column;

	  align-items: center;

	  gap: 8px;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-title {

	  font-size: 1.25rem;

	  text-align: center;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--article-excerpt {

	  font-size: 0.9rem;

	  text-align: center;

	  -webkit-line-clamp: 3;

	  display: -webkit-box;

	  -webkit-box-orient: vertical;

	  overflow: hidden;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--featured-article {

	  grid-column: 1 / -1;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--featured-article .ccl-mvinjuries--article-header {

	  flex-direction: row;

	  text-align: left;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--featured-article .ccl-mvinjuries--article-meta {

	  align-items: flex-start;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--featured-article .ccl-mvinjuries--article-title {

	  text-align: left;

	  font-size: 1.5rem;

	}



	.ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view .ccl-mvinjuries--featured-article .ccl-mvinjuries--article-excerpt {

	  text-align: left;

	  -webkit-line-clamp: 3;

	}



	/* Article Card */

	.ccl-mvinjuries--article-card {

	  position: relative;

	  background: var(--ccl-mvi-white);

	  border: 2px solid var(--ccl-mvi-soft-border);

	  border-radius: 20px;

	  padding: 32px;

	  text-decoration: none;

	  color: var(--ccl-mvi-ink);

	  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	  display: flex;

	  flex-direction: column;

	  overflow: hidden;

	}



	.ccl-mvinjuries--article-card::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  height: 5px;

	  background: var(--ccl-mvi-primary-blue);

	  transform: scaleX(0);

	  transform-origin: left;

	  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	}



	.ccl-mvinjuries--article-card:hover {

	  transform: translateY(-10px);

	  box-shadow: 0 25px 70px rgba(0, 0, 0, 0.15);

	  border-color: rgba(29, 99, 255, 0.3);

	}



	.ccl-mvinjuries--article-card:hover::before {

	  transform: scaleX(1);

	}



	.ccl-mvinjuries--article-header {

	  display: flex;

	  align-items: flex-start;

	  gap: 16px;

	  margin-bottom: 20px;

	}



	.ccl-mvinjuries--article-icon {

	  width: 56px;

	  height: 56px;

	  min-width: 56px;

	  border-radius: 14px;

	  background: linear-gradient(135deg, rgba(29, 99, 255, 0.1) 0%, rgba(11, 92, 255, 0.15) 100%);

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  transition: all 0.4s ease;

	}



	.ccl-mvinjuries--article-card:hover .ccl-mvinjuries--article-icon {

	  transform: rotate(360deg) scale(1.1);

	  background: linear-gradient(135deg, var(--ccl-mvi-primary-blue) 0%, var(--ccl-mvi-cta-blue) 100%);

	}



	.ccl-mvinjuries--article-icon i {

	  font-size: 1.5rem;

	  color: var(--ccl-mvi-primary-blue);

	  transition: color 0.4s ease;

	}



	.ccl-mvinjuries--article-card:hover .ccl-mvinjuries--article-icon i {

	  color: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--article-meta {

	  flex: 1;

	}



	.ccl-mvinjuries--article-type {

	  display: inline-flex;

	  align-items: center;

	  gap: 5px;

	  background: rgba(29, 99, 255, 0.1);

	  color: var(--ccl-mvi-primary-blue);

	  padding: 4px 12px;

	  border-radius: 12px;

	  font-weight: 600;

	  text-transform: uppercase;

	  letter-spacing: 0.5px;

	  font-size: 0.7rem;

	  margin-bottom: 8px;

	}



	.ccl-mvinjuries--article-title {

	  font-size: 1.5rem;

	  margin-bottom: 16px;

	  color: var(--ccl-mvi-ink);

	  font-weight: 800;

	  line-height: 1.3;

	}



	.ccl-mvinjuries--article-excerpt {

	  font-size: 1rem;

	  color: var(--ccl-mvi-muted);

	  line-height: 1.7;

	  margin-bottom: 24px;

	  flex: 1;

	}



	.ccl-mvinjuries--article-footer {

	  display: flex;

	  align-items: center;

	  justify-content: space-between;

	  padding-top: 20px;

	  border-top: 2px solid var(--ccl-mvi-soft-border);

	}



	.ccl-mvinjuries--article-read-time {

	  display: flex;

	  align-items: center;

	  gap: 6px;

	  color: var(--ccl-mvi-muted);

	  font-size: 0.9rem;

	  font-weight: 500;

	}



	.ccl-mvinjuries--article-link {

	  display: inline-flex;

	  align-items: center;

	  gap: 8px;

	  color: var(--ccl-mvi-primary-blue);

	  font-weight: 600;

	  font-size: 0.95rem;

	  transition: all 0.3s ease;

	}



	.ccl-mvinjuries--article-link i {

	  transition: transform 0.3s ease;

	}



	.ccl-mvinjuries--article-card:hover .ccl-mvinjuries--article-link i {

	  transform: translateX(5px);

	}



	/* Featured Article */

	.ccl-mvinjuries--featured-article {

	  grid-column: 1 / -1;

	  background: linear-gradient(135deg, rgba(29, 99, 255, 0.03) 0%, rgba(11, 92, 255, 0.05) 100%);

	  border: 2px solid rgba(29, 99, 255, 0.2);

	}



	.ccl-mvinjuries--featured-article::after {

	  content: 'Featured Guide';

	  position: absolute;

	  top: 20px;

	  right: 20px;

	  background: var(--ccl-mvi-accent-gold);

	  color: var(--ccl-mvi-white);

	  padding: 8px 16px;

	  border-radius: 20px;

	  font-size: 0.75rem;

	  font-weight: 700;

	  text-transform: uppercase;

	  letter-spacing: 0.5px;

	  box-shadow: 0 4px 12px rgba(255, 168, 38, 0.3);

	}



	/* Hidden Articles */

	.ccl-mvinjuries--hidden-article {

	  display: none;

	  opacity: 0;

	  transform: translateY(40px);

	}



	.ccl-mvinjuries--hidden-article.ccl-mvi--show {

	  display: flex;

	  animation: ccl-mvi-fadeInUp 0.6s ease-out forwards;

	}



	/* Load More Container */

	.ccl-mvinjuries--load-more-container {

	  text-align: center;

	  padding: 40px 0;

	}



	.ccl-mvinjuries--load-more-btn {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  gap: 12px;

	  padding: 18px 40px;

	  background: var(--ccl-mvi-white);

	  color: var(--ccl-mvi-primary-blue);

	  border: 2px solid var(--ccl-mvi-primary-blue);

	  border-radius: 50px;

	  font-size: 1.05rem;

	  font-weight: 600;

	  cursor: pointer;

	  transition: all 0.3s ease;

	  font-family: 'Inter', sans-serif;

	  position: relative;

	  overflow: hidden;

	}



	.ccl-mvinjuries--load-more-btn::before {

	  content: '';

	  position: absolute;

	  top: 50%;

	  left: 50%;

	  width: 0;

	  height: 0;

	  border-radius: 50%;

	  background: var(--ccl-mvi-primary-blue);

	  transform: translate(-50%, -50%);

	  transition: width 0.6s, height 0.6s;

	  z-index: 0;

	}



	.ccl-mvinjuries--load-more-btn:hover::before {

	  width: 400px;

	  height: 400px;

	}



	.ccl-mvinjuries--load-more-btn:hover {

	  color: var(--ccl-mvi-white);

	  transform: translateY(-2px);

	  box-shadow: 0 10px 30px rgba(29, 99, 255, 0.3);

	}



	.ccl-mvinjuries--load-more-text,

	.ccl-mvinjuries--load-more-count,

	.ccl-mvinjuries--load-more-btn i {

	  position: relative;

	  z-index: 1;

	}



	.ccl-mvinjuries--load-more-count {

	  color: var(--ccl-mvi-muted);

	  font-size: 0.95rem;

	  font-weight: 500;

	}



	.ccl-mvinjuries--load-more-btn:hover .ccl-mvinjuries--load-more-count {

	  color: rgba(255, 255, 255, 0.8);

	}



	.ccl-mvinjuries--load-more-btn i {

	  transition: transform 0.3s ease;

	}



	.ccl-mvinjuries--load-more-btn:hover i {

	  transform: translateY(3px);

	}



	.ccl-mvinjuries--load-more-btn.ccl-mvi--hidden {

	  display: none;

	}



	/* Related Categories Section */

	.ccl-mvinjuries--related {

	  padding: 100px 24px;

	  background: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--related-grid {

	  display: grid;

	  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

	  gap: 28px;

	}



	.ccl-mvinjuries--related-card {

	  background: var(--ccl-mvi-bg-light);

	  border: 2px solid var(--ccl-mvi-soft-border);

	  border-radius: 20px;

	  padding: 32px;

	  text-decoration: none;

	  color: var(--ccl-mvi-ink);

	  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	  position: relative;

	  overflow: hidden;

	}



	.ccl-mvinjuries--related-card::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  height: 4px;

	  background: var(--ccl-mvi-accent-green);

	  transform: scaleX(0);

	  transform-origin: left;

	  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	}



	.ccl-mvinjuries--related-card:hover {

	  transform: translateY(-10px);

	  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);

	  border-color: rgba(16, 185, 129, 0.3);

	  background: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--related-card:hover::before {

	  transform: scaleX(1);

	}



	.ccl-mvinjuries--related-icon {

	  width: 70px;

	  height: 70px;

	  border-radius: 50%;

	  background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(16, 185, 129, 0.15) 100%);

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  margin-bottom: 20px;

	  transition: all 0.4s ease;

	}



	.ccl-mvinjuries--related-card:hover .ccl-mvinjuries--related-icon {

	  transform: rotate(360deg) scale(1.1);

	  background: linear-gradient(135deg, var(--ccl-mvi-accent-green) 0%, #059669 100%);

	}



	.ccl-mvinjuries--related-icon i {

	  font-size: 1.75rem;

	  color: var(--ccl-mvi-accent-green);

	  transition: color 0.4s ease;

	}



	.ccl-mvinjuries--related-card:hover .ccl-mvinjuries--related-icon i {

	  color: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--related-title {

	  font-size: 1.35rem;

	  margin-bottom: 12px;

	  color: var(--ccl-mvi-ink);

	}



	.ccl-mvinjuries--related-desc {

	  font-size: 0.95rem;

	  color: var(--ccl-mvi-muted);

	  line-height: 1.6;

	  margin-bottom: 20px;

	}



	.ccl-mvinjuries--related-link {

	  display: inline-flex;

	  align-items: center;

	  gap: 8px;

	  color: var(--ccl-mvi-accent-green);

	  font-weight: 600;

	  font-size: 0.95rem;

	  transition: all 0.3s ease;

	}



	.ccl-mvinjuries--related-link i {

	  transition: transform 0.3s ease;

	}



	.ccl-mvinjuries--related-card:hover .ccl-mvinjuries--related-link i {

	  transform: translateX(5px);

	}



	/* CTA Section */

	.ccl-mvinjuries--cta {

	  background: linear-gradient(135deg, var(--ccl-mvi-ink) 0%, #0f172a 100%);

	  padding: 100px 24px;

	  text-align: center;

	  position: relative;

	  overflow: hidden;

	}



	.ccl-mvinjuries--cta::before {

	  content: '';

	  position: absolute;

	  top: 0;

	  left: 0;

	  right: 0;

	  bottom: 0;

	  background: url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><rect width="1" height="1" fill="rgba(255,255,255,0.03)"/></svg>');

	  background-size: 100px 100px;

	  opacity: 0.4;

	}



	.ccl-mvinjuries--cta::after {

	  content: '';

	  position: absolute;

	  top: -50%;

	  left: 50%;

	  transform: translateX(-50%);

	  width: 800px;

	  height: 800px;

	  background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

	  pointer-events: none;

	}



	.ccl-mvinjuries--cta-content {

	  position: relative;

	  z-index: 1;

	  max-width: 800px;

	  margin: 0 auto;

	}



	.ccl-mvinjuries--cta-icon {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  width: 90px;

	  height: 90px;

	  background: rgba(29, 99, 255, 0.15);

	  border: 3px solid rgba(29, 99, 255, 0.3);

	  border-radius: 50%;

	  margin-bottom: 28px;

	  animation: ccl-mvi-pulse 2s ease-in-out infinite;

	}



	.ccl-mvinjuries--cta-icon i {

	  font-size: 2.25rem;

	  color: var(--ccl-mvi-primary-blue);

	}



	@keyframes ccl-mvi-pulse {

	  0%, 100% {

		transform: scale(1);

		box-shadow: 0 0 0 0 rgba(29, 99, 255, 0.4);

	  }

	  50% {

		transform: scale(1.05);

		box-shadow: 0 0 0 20px rgba(29, 99, 255, 0);

	  }

	}



	.ccl-mvinjuries--cta-title {

	  font-size: clamp(2rem, 5vw, 3.5rem);

	  color: #ffffff !important;

	  margin-bottom: 20px;

	  line-height: 1.2;

	}



	.ccl-mvinjuries--cta-text {

	  font-size: 1.2rem;

	  color: rgba(255, 255, 255, 0.85);

	  margin-bottom: 40px;

	  line-height: 1.8;

	}



	.ccl-mvinjuries--cta-buttons {

	  display: flex;

	  gap: 16px;

	  justify-content: center;

	  flex-wrap: wrap;

	  margin-bottom: 40px;

	}



	.ccl-mvinjuries--cta-info {

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  gap: 32px;

	  flex-wrap: wrap;

	  margin-top: 48px;

	  padding-top: 40px;

	  border-top: 1px solid rgba(255, 255, 255, 0.1);

	}



	.ccl-mvinjuries--cta-info-item {

	  display: flex;

	  align-items: center;

	  gap: 12px;

	  color: rgba(255, 255, 255, 0.8);

	  font-size: 1rem;

	}



	.ccl-mvinjuries--cta-info-item i {

	  color: var(--ccl-mvi-accent-green);

	  font-size: 1.25rem;

	}



	/* Buttons */

	.ccl-mvinjuries--btn {

	  display: inline-flex;

	  align-items: center;

	  justify-content: center;

	  gap: 10px;

	  padding: 16px 36px;

	  border-radius: 50px;

	  font-size: 1.05rem;

	  font-weight: 600;

	  text-decoration: none;

	  transition: all 0.3s ease;

	  cursor: pointer;

	  border: 2px solid transparent;

	  font-family: 'Inter', sans-serif;

	  position: relative;

	  overflow: hidden;

	}



	.ccl-mvinjuries--btn::before {

	  content: '';

	  position: absolute;

	  top: 50%;

	  left: 50%;

	  width: 0;

	  height: 0;

	  border-radius: 50%;

	  background: rgba(255, 255, 255, 0.2);

	  transform: translate(-50%, -50%);

	  transition: width 0.6s, height 0.6s;

	}



	.ccl-mvinjuries--btn:hover::before {

	  width: 300px;

	  height: 300px;

	}



	.ccl-mvinjuries--btn span {

	  position: relative;

	  z-index: 1;

	}



	.ccl-mvinjuries--btn i {

	  position: relative;

	  z-index: 1;

	}



	.ccl-mvinjuries--btn--primary {

	  background: var(--ccl-mvi-cta-blue);

	  color: var(--ccl-mvi-white);

	}



	.ccl-mvinjuries--btn--primary:hover {

	  background: var(--ccl-mvi-cta-dark);

	  transform: translateY(-2px);

	  box-shadow: 0 10px 30px rgba(11, 92, 255, 0.3);

	}



	.ccl-mvinjuries--btn--secondary {

	  background: transparent;

	  color: var(--ccl-mvi-white);

	  border-color: rgba(255, 255, 255, 0.3);

	}



	.ccl-mvinjuries--btn--secondary:hover {

	  background: rgba(255, 255, 255, 0.1);

	  border-color: var(--ccl-mvi-white);

	  transform: translateY(-2px);

	}



	/* Scroll Reveal Animation */

	.ccl-mvinjuries--scroll-reveal {

	  opacity: 0;

	  transform: translateY(40px);

	  transition: opacity 0.6s ease, transform 0.6s ease;

	}



	.ccl-mvinjuries--scroll-reveal.ccl-mvi--revealed {

	  opacity: 1;

	  transform: translateY(0);

	}



	/* Responsive Design */

	@media (max-width: 1024px) {

	  .ccl-mvinjuries--hero {

		padding: 100px 24px 120px;

	  }



	  .ccl-mvinjuries--getting-started,

	  .ccl-mvinjuries--articles,

	  .ccl-mvinjuries--related,

	  .ccl-mvinjuries--cta {

		padding: 80px 24px;

	  }



	  .ccl-mvinjuries--articles-grid {

		grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));

		gap: 28px;

	  }



	  .ccl-mvinjuries--quick-actions {

		grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));

	  }

	}



	@media (max-width: 768px) {

	  .ccl-mvinjuries--hero {

		padding: 80px 20px 100px;

	  }



	  .ccl-mvinjuries--hero-title {

		font-size: 2.5rem;

	  }



	  .ccl-mvinjuries--hero-lead {

		font-size: 1.15rem;

	  }



	  .ccl-mvinjuries--breadcrumb {

		flex-direction: column;

		gap: 8px;

	  }



	  .ccl-mvinjuries--getting-started,

	  .ccl-mvinjuries--articles,

	  .ccl-mvinjuries--related,

	  .ccl-mvinjuries--cta {

		padding: 60px 20px;

	  }



	  .ccl-mvinjuries--intro-box {

		padding: 32px 28px;

		margin-bottom: 60px;

	  }



	  .ccl-mvinjuries--intro-title {

		flex-direction: column;

		align-items: flex-start;

		gap: 12px;

		font-size: 1.75rem;

	  }



	  .ccl-mvinjuries--quick-actions {

		grid-template-columns: 1fr;

		gap: 24px;

		margin-bottom: 60px;

	  }



	  .ccl-mvinjuries--articles-grid {

		grid-template-columns: 1fr;

		gap: 24px;

	  }



	  .ccl-mvinjuries--articles-grid.ccl-mvinjuries--grid-view {

		grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));

		gap: 20px;

	  }



	  .ccl-mvinjuries--featured-article {

		grid-column: 1;

	  }



	  .ccl-mvinjuries--article-card {

		padding: 28px;

	  }



	  .ccl-mvinjuries--filter-bar {

		flex-direction: column;

		align-items: stretch;

		padding: 20px;

	  }



	  .ccl-mvinjuries--filter-info {

		justify-content: center;

	  }



	  .ccl-mvinjuries--filter-controls {

		flex-direction: column;

		gap: 16px;

	  }



	  .ccl-mvinjuries--view-toggle {

		justify-content: center;

		width: 100%;

	  }



	  .ccl-mvinjuries--view-btn {

		flex: 1;

	  }



	  .ccl-mvinjuries--sort-select {

		flex-direction: column;

		align-items: stretch;

		gap: 8px;

	  }



	  .ccl-mvinjuries--sort-select label {

		text-align: center;

	  }



	  .ccl-mvinjuries--sort-select select {

		width: 100%;

	  }



	  .ccl-mvinjuries--related-grid {

		grid-template-columns: 1fr;

		gap: 24px;

	  }



	  .ccl-mvinjuries--section-title {

		font-size: 2.25rem;

	  }



	  .ccl-mvinjuries--section-kicker::before,

	  .ccl-mvinjuries--section-kicker::after {

		width: 25px;

	  }



	  .ccl-mvinjuries--cta-icon {

		width: 80px;

		height: 80px;

	  }



	  .ccl-mvinjuries--cta-icon i {

		font-size: 2rem;

	  }



	  .ccl-mvinjuries--cta-text {

		font-size: 1.1rem;

	  }



	  .ccl-mvinjuries--cta-buttons {

		flex-direction: column;

	  }



	  .ccl-mvinjuries--btn {

		width: 100%;

	  }



	  .ccl-mvinjuries--cta-info {

		flex-direction: column;

		gap: 20px;

		margin-top: 32px;

		padding-top: 28px;

	  }



	  .ccl-mvinjuries--load-more-container {

		padding: 32px 0;

	  }



	  .ccl-mvinjuries--load-more-btn {

		width: 100%;

		flex-wrap: wrap;

	  }



	  .ccl-mvinjuries--showing-count {

		display: block;

		width: 100%;

		text-align: center;

		margin-top: 4px;

	  }

	}



	@media (max-width: 480px) {

	  .ccl-mvinjuries--hero {

		padding: 60px 16px 80px;

	  }



	  .ccl-mvinjuries--hero-icon {

		width: 80px;

		height: 80px;

		margin-bottom: 20px;

	  }



	  .ccl-mvinjuries--hero-icon i {

		font-size: 2rem;

	  }



	  .ccl-mvinjuries--hero-title {

		font-size: 2rem;

	  }



	  .ccl-mvinjuries--hero-lead {

		font-size: 1.05rem;

	  }



	  .ccl-mvinjuries--getting-started,

	  .ccl-mvinjuries--articles,

	  .ccl-mvinjuries--related,

	  .ccl-mvinjuries--cta {

		padding: 50px 16px;

	  }



	  .ccl-mvinjuries--intro-box {

		padding: 24px 20px;

	  }



	  .ccl-mvinjuries--article-card {

		padding: 24px;

	  }



	  .ccl-mvinjuries--article-title {

		font-size: 1.25rem;

	  }



	  .ccl-mvinjuries--section-header {

		margin-bottom: 40px;

	  }



	  .ccl-mvinjuries--cta-icon {

		width: 70px;

		height: 70px;

		margin-bottom: 20px;

	  }



	  .ccl-mvinjuries--cta-icon i {

		font-size: 1.75rem;

	  }



	  .ccl-mvinjuries--cta-text {

		font-size: 1rem;

	  }

	}

		/* ===================================

		   WRAPPER & BASE STYLES

		=================================== */

		.ccl-nofault--wrapper {

			/* CSS Variables */

			--ccl-nofault-primary-blue: #1d63ff;

			--ccl-nofault-cta-blue: #0b5cff;

			--ccl-nofault-cta-dark: #0846c1;

			--ccl-nofault-accent-green: #10b981;

			--ccl-nofault-accent-gold: #ffa826;

			--ccl-nofault-ink: #1e293b;

			--ccl-nofault-muted: #64748b;

			--ccl-nofault-border: #e5e7eb;

			--ccl-nofault-white: #ffffff;

			--ccl-nofault-light-bg: #f8fafc;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-nofault-ink);

			background: var(--ccl-nofault-white);

			margin: 0;

			padding: 0;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-nofault--wrapper main {

			overflow-x: hidden;

		}

		

		.ccl-nofault--wrapper h1,

		.ccl-nofault--wrapper h2,

		.ccl-nofault--wrapper h3,

		.ccl-nofault--wrapper h4,

		.ccl-nofault--wrapper h5,

		.ccl-nofault--wrapper h6 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			line-height: 1.2;

			margin: 0;

			color: var(--ccl-nofault-ink);

		}

		

		.ccl-nofault--wrapper p {

			margin: 0 0 1.25rem 0;

		}

		

		.ccl-nofault--wrapper a {

			text-decoration: none;

			transition: all 0.3s ease;

		}

		

		.ccl-nofault--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		/* ===================================

		   HERO SECTION

		=================================== */

		.ccl-nofault--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 40px 20px 60px;

			overflow: hidden;

		}

		

		.ccl-nofault--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

			animation: ccl-nofault-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-nofault-glow {

			0%, 100% { transform: translate(0, 0); }

			50% { transform: translate(20px, 20px); }

		}

		

		.ccl-nofault--hero-content {

			position: relative;

			z-index: 1;

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-nofault--breadcrumbs {

			display: flex;

			align-items: center;

			gap: 8px;

			margin-bottom: 24px;

			font-size: 0.9rem;

			flex-wrap: wrap;

		}

		

		.ccl-nofault--breadcrumb-link {

			color: rgba(255, 255, 255, 0.8);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-nofault--breadcrumb-link:hover {

			color: var(--ccl-nofault-white);

		}

		

		.ccl-nofault--breadcrumb-separator {

			color: rgba(255, 255, 255, 0.5);

			font-size: 0.7rem;

		}

		

		.ccl-nofault--breadcrumb-current {

			color: var(--ccl-nofault-white);

			font-weight: 600;

		}

		

		.ccl-nofault--hero-category {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			padding: 8px 18px;

			border-radius: 50px;

			font-size: 0.85rem;

			font-weight: 700;

			color: var(--ccl-nofault-white);

			margin-bottom: 20px;

			text-transform: uppercase;

			letter-spacing: 0.5px;

		}

		

		.ccl-nofault--hero h1 {

			font-size: clamp(2rem, 5vw, 3.5rem);

			color: var(--ccl-nofault-white);

			margin-bottom: 24px;

			line-height: 1.15;

		}

		

		.ccl-nofault--hero-meta {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 24px;

			flex-wrap: wrap;

			padding-top: 16px;

			border-top: 1px solid rgba(255, 255, 255, 0.2);

		}

		

		.ccl-nofault--hero-meta-item {

			display: flex;

			align-items: center;

			gap: 8px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.9rem;

			font-weight: 500;

		}

		

		.ccl-nofault--hero-meta-item i {

			font-size: 1rem;

			opacity: 0.8;

		}

		

		/* ===================================

		   ARTICLE CONTENT SECTION

		=================================== */

		.ccl-nofault--article {

			padding: 60px 20px;

			background: var(--ccl-nofault-white);

		}

		

		.ccl-nofault--article-container {

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-nofault--article-content {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--ccl-nofault-ink);

		}

		

		.ccl-nofault--article-content h2 {

			font-size: clamp(1.75rem, 3vw, 2.25rem);

			margin: 48px 0 20px 0;

			color: var(--ccl-nofault-ink);

		}

		

		.ccl-nofault--article-content h2:first-child {

			margin-top: 0;

		}

		

		.ccl-nofault--article-content h3 {

			font-size: 1.5rem;

			margin: 36px 0 16px 0;

			color: var(--ccl-nofault-ink);

		}

		

		.ccl-nofault--article-content h4 {

			font-size: 1.25rem;

			margin: 28px 0 12px 0;

			color: var(--ccl-nofault-ink);

		}

		

		.ccl-nofault--article-content p {

			margin-bottom: 1.5rem;

		}

		

		.ccl-nofault--article-content ul,

		.ccl-nofault--article-content ol {

			margin: 24px 0;

			padding-left: 0;

			list-style: none;

		}

		

		.ccl-nofault--article-content ul li,

		.ccl-nofault--article-content ol li {

			padding: 10px 0 10px 36px;

			position: relative;

			line-height: 1.7;

		}

		

		.ccl-nofault--article-content ul li::before {

			content: '\f061';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-nofault-primary-blue);

			font-size: 0.85rem;

		}

		

		.ccl-nofault--article-content ol {

			counter-reset: item;

		}

		

		.ccl-nofault--article-content ol li::before {

			content: counter(item);

			counter-increment: item;

			position: absolute;

			left: 0;

			width: 24px;

			height: 24px;

			background: var(--ccl-nofault-primary-blue);

			color: var(--ccl-nofault-white);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 0.8rem;

			font-weight: 700;

		}

		

		.ccl-nofault--article-content strong {

			color: var(--ccl-nofault-ink);

			font-weight: 700;

		}

		

		.ccl-nofault--article-content a {

			color: var(--ccl-nofault-primary-blue);

			font-weight: 600;

			text-decoration: underline;

		}

		

		.ccl-nofault--article-content a:hover {

			color: var(--ccl-nofault-cta-dark);

		}

		

		/* Highlight Box */

		.ccl-nofault--highlight {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			border-left: 4px solid var(--ccl-nofault-primary-blue);

			border-radius: 12px;

			padding: 28px;

			margin: 32px 0;

		}

		

		.ccl-nofault--highlight h4 {

			display: flex;

			align-items: center;

			gap: 10px;

			font-size: 1.25rem;

			color: var(--ccl-nofault-primary-blue);

			margin: 0 0 12px 0;

		}

		

		.ccl-nofault--highlight h4 i {

			font-size: 1.3rem;

		}

		

		.ccl-nofault--highlight p:last-child {

			margin-bottom: 0;

		}

		

		/* Table Styling */

		.ccl-nofault--table-wrapper {

			margin: 32px 0;

			overflow-x: auto;

		}

		

		.ccl-nofault--table {

			width: 100%;

			border-collapse: separate;

			border-spacing: 0;

			background: var(--ccl-nofault-white);

			border: 2px solid var(--ccl-nofault-border);

			border-radius: 12px;

			overflow: hidden;

		}

		

		.ccl-nofault--table thead {

			background: linear-gradient(135deg, var(--ccl-nofault-primary-blue), var(--ccl-nofault-cta-blue));

		}

		

		.ccl-nofault--table th {

			padding: 16px 20px;

			text-align: left;

			font-size: 1rem;

			font-weight: 700;

			color: var(--ccl-nofault-white);

		}

		

		.ccl-nofault--table tbody tr {

			border-bottom: 1px solid var(--ccl-nofault-border);

			transition: background 0.3s ease;

		}

		

		.ccl-nofault--table tbody tr:last-child {

			border-bottom: none;

		}

		

		.ccl-nofault--table tbody tr:hover {

			background: rgba(29, 99, 255, 0.03);

		}

		

		.ccl-nofault--table td {

			padding: 16px 20px;

			font-size: 1rem;

			color: var(--ccl-nofault-ink);

			line-height: 1.6;

		}

		

		.ccl-nofault--table td:first-child {

			font-weight: 600;

			color: var(--ccl-nofault-primary-blue);

		}

		

		/* Key Takeaways Box */

		.ccl-nofault--takeaways {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.05), rgba(16, 185, 129, 0.1));

			border: 2px solid var(--ccl-nofault-accent-green);

			border-radius: 16px;

			padding: 36px;

			margin: 40px 0;

		}

		

		.ccl-nofault--takeaways h3 {

			display: flex;

			align-items: center;

			gap: 12px;

			font-size: 1.75rem;

			color: var(--ccl-nofault-ink);

			margin: 0 0 24px 0;

		}

		

		.ccl-nofault--takeaways h3 i {

			color: var(--ccl-nofault-accent-green);

			font-size: 1.8rem;

		}

		

		.ccl-nofault--takeaways ul {

			list-style: none;

			padding: 0;

			margin: 0;

		}

		

		.ccl-nofault--takeaways ul li {

			padding: 12px 0 12px 36px;

			position: relative;

			font-size: 1.05rem;

			line-height: 1.7;

			border-bottom: 1px solid rgba(16, 185, 129, 0.2);

		}

		

		.ccl-nofault--takeaways ul li:last-child {

			border-bottom: none;

		}

		

		.ccl-nofault--takeaways ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-nofault-accent-green);

			font-size: 1rem;

		}

		

		/* ===================================

		   RATING SECTION

		=================================== */

		.ccl-nofault--rating {

			background: var(--ccl-nofault-light-bg);

			border-top: 1px solid var(--ccl-nofault-border);

			padding: 48px 20px;

		}

		

		.ccl-nofault--rating-container {

			max-width: 600px;

			margin: 0 auto;

			text-align: center;

		}

		

		.ccl-nofault--rating-title {

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ccl-nofault-ink);

			margin-bottom: 24px;

		}

		

		.ccl-nofault--rating-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			margin-bottom: 20px;

		}

		

		.ccl-nofault--rating-btn {

			display: flex;

			align-items: center;

			gap: 10px;

			padding: 14px 28px;

			background: var(--ccl-nofault-white);

			border: 2px solid var(--ccl-nofault-border);

			border-radius: 50px;

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			color: var(--ccl-nofault-ink);

			cursor: pointer;

			transition: all 0.3s ease;

		}

		

		.ccl-nofault--rating-btn i {

			font-size: 1.3rem;

			transition: all 0.3s ease;

		}

		

		.ccl-nofault--rating-btn:hover {

			transform: translateY(-2px);

			box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-nofault--rating-btn.thumbs-up:hover {

			border-color: var(--ccl-nofault-accent-green);

			background: rgba(16, 185, 129, 0.05);

		}

		

		.ccl-nofault--rating-btn.thumbs-up:hover i {

			color: var(--ccl-nofault-accent-green);

			transform: scale(1.1);

		}

		

		.ccl-nofault--rating-btn.thumbs-down:hover {

			border-color: var(--ccl-nofault-muted);

			background: rgba(100, 116, 139, 0.05);

		}

		

		.ccl-nofault--rating-btn.thumbs-down:hover i {

			color: var(--ccl-nofault-muted);

			transform: scale(1.1);

		}

		

		.ccl-nofault--rating-btn.is-voted {

			cursor: default;

		}

		

		.ccl-nofault--rating-btn.is-voted.thumbs-up {

			background: rgba(16, 185, 129, 0.1);

			border-color: var(--ccl-nofault-accent-green);

		}

		

		.ccl-nofault--rating-btn.is-voted.thumbs-up i {

			color: var(--ccl-nofault-accent-green);

		}

		

		.ccl-nofault--rating-btn.is-voted.thumbs-down {

			background: rgba(100, 116, 139, 0.1);

			border-color: var(--ccl-nofault-muted);

		}

		

		.ccl-nofault--rating-btn.is-voted.thumbs-down i {

			color: var(--ccl-nofault-muted);

		}

		

		.ccl-nofault--rating-count {

			font-size: 0.95rem;

			color: var(--ccl-nofault-muted);

			font-weight: 500;

		}

		

		.ccl-nofault--rating-thanks {

			display: none;

			padding: 12px 20px;

			background: rgba(16, 185, 129, 0.1);

			border-radius: 8px;

			font-size: 1rem;

			color: var(--ccl-nofault-accent-green);

			font-weight: 600;

			margin-top: 16px;

		}

		

		.ccl-nofault--rating-thanks i {

			margin-right: 8px;

		}

		

		.ccl-nofault--rating-thanks.is-visible {

			display: inline-block;

		}

		

		/* ===================================

		   RELATED ARTICLES

		=================================== */

		.ccl-nofault--related {

			background: var(--ccl-nofault-light-bg);

			padding: 64px 20px;

			border-top: 1px solid var(--ccl-nofault-border);

		}

		

		.ccl-nofault--related-container {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-nofault--related-header {

			text-align: center;

			margin-bottom: 48px;

		}

		

		.ccl-nofault--related-title {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 2rem;

			font-weight: 800;

			color: var(--ccl-nofault-ink);

			margin-bottom: 12px;

		}

		

		.ccl-nofault--related-title i {

			color: var(--ccl-nofault-primary-blue);

		}

		

		.ccl-nofault--related-subtitle {

			font-size: 1.05rem;

			color: var(--ccl-nofault-muted);

		}

		

		.ccl-nofault--related-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 24px;

		}

		

		.ccl-nofault--related-card {

			position: relative;

			display: block;

			background: var(--ccl-nofault-white);

			border: 2px solid var(--ccl-nofault-border);

			border-radius: 16px;

			padding: 24px;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-nofault--related-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 3px;

			background: linear-gradient(90deg, var(--ccl-nofault-primary-blue), var(--ccl-nofault-cta-blue));

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.3s ease;

		}

		

		.ccl-nofault--related-card:hover {

			transform: translateY(-4px);

			box-shadow: 0 12px 24px rgba(29, 99, 255, 0.12);

			border-color: var(--ccl-nofault-primary-blue);

		}

		

		.ccl-nofault--related-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-nofault--related-card-icon {

			width: 48px;

			height: 48px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			border-radius: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 16px;

			transition: all 0.3s ease;

		}

		

		.ccl-nofault--related-card-icon i {

			font-size: 1.5rem;

			color: var(--ccl-nofault-primary-blue);

			transition: transform 0.3s ease;

		}

		

		.ccl-nofault--related-card:hover .ccl-nofault--related-card-icon {

			background: linear-gradient(135deg, var(--ccl-nofault-primary-blue), var(--ccl-nofault-cta-blue));

		}

		

		.ccl-nofault--related-card:hover .ccl-nofault--related-card-icon i {

			color: var(--ccl-nofault-white);

			transform: scale(1.1);

		}

		

		.ccl-nofault--related-card-title {

			font-size: 1.15rem;

			font-weight: 700;

			color: var(--ccl-nofault-ink);

			line-height: 1.4;

			margin-bottom: 12px;

			display: flex;

			align-items: flex-start;

			justify-content: space-between;

			gap: 12px;

		}

		

		.ccl-nofault--related-card-arrow {

			flex-shrink: 0;

			color: var(--ccl-nofault-primary-blue);

			font-size: 1rem;

			transition: transform 0.3s ease;

		}

		

		.ccl-nofault--related-card:hover .ccl-nofault--related-card-arrow {

			transform: translateX(4px);

		}

		

		.ccl-nofault--related-card-meta {

			display: flex;

			align-items: center;

			gap: 16px;

			font-size: 0.85rem;

			color: var(--ccl-nofault-muted);

			margin-top: 12px;

			padding-top: 12px;

			border-top: 1px solid var(--ccl-nofault-border);

		}

		

		.ccl-nofault--related-card-meta-item {

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-nofault--related-card-meta-item i {

			font-size: 0.8rem;

			opacity: 0.7;

		}

		

		/* ===================================

		   DISCLAIMER

		=================================== */

		.ccl-nofault--disclaimer {

			background: var(--ccl-nofault-white);

			border-top: 1px solid var(--ccl-nofault-border);

			padding: 64px 20px;

		}

		

		.ccl-nofault--disclaimer-container {

			max-width: 900px;

			margin: 0 auto;

			box-sizing: border-box;

		}

		

		.ccl-nofault--disclaimer-box {

			position: relative;

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.03), rgba(255, 168, 38, 0.06));

			border: 2px solid var(--ccl-nofault-accent-gold);

			border-radius: 20px;

			padding: 0;

			overflow: hidden;

			box-sizing: border-box;

		}

		

		.ccl-nofault--disclaimer-box::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-nofault-accent-gold), #ffd700);

		}

		

		.ccl-nofault--disclaimer-content {

			padding: 40px;

			max-width: 100%;

			box-sizing: border-box;

		}

		

		.ccl-nofault--disclaimer-header {

			display: flex;

			align-items: flex-start;

			gap: 16px;

			margin-bottom: 24px;

		}

		

		.ccl-nofault--disclaimer-icon {

			flex-shrink: 0;

			width: 56px;

			height: 56px;

			background: var(--ccl-nofault-accent-gold);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

		}

		

		.ccl-nofault--disclaimer-icon i {

			color: var(--ccl-nofault-white);

			font-size: 1.6rem;

		}

		

		.ccl-nofault--disclaimer-header-text h3 {

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ccl-nofault-ink);

			margin: 0 0 8px 0;

		}

		

		.ccl-nofault--disclaimer-header-text p {

			font-size: 1rem;

			color: var(--ccl-nofault-muted);

			margin: 0;

		}

		

		.ccl-nofault--disclaimer-text {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-nofault-ink);

			margin-bottom: 32px;

		}

		

		.ccl-nofault--disclaimer-text p {

			margin-bottom: 12px;

		}

		

		.ccl-nofault--disclaimer-text p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-nofault--disclaimer-ctas {

			display: flex;

			gap: 16px;

			padding-top: 28px;

			border-top: 1px solid rgba(255, 168, 38, 0.2);

			flex-wrap: wrap;

			align-items: stretch;

		}

		

		.ccl-nofault--disclaimer-btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 14px 24px;

			border-radius: 50px;

			font-family: 'Inter', sans-serif;

			font-size: 0.95rem;

			font-weight: 700;

			text-decoration: none;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			cursor: pointer;

			position: relative;

			overflow: hidden;

			white-space: nowrap;

			flex: 0 1 auto;

			min-width: 0;

			box-sizing: border-box;

		}

		

		.ccl-nofault--disclaimer-btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s ease, height 0.6s ease;

		}

		

		.ccl-nofault--disclaimer-btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-nofault--disclaimer-btn span,

		.ccl-nofault--disclaimer-btn i {

			position: relative;

			z-index: 1;

		}

		

		.ccl-nofault--disclaimer-btn i {

			font-size: 1rem;

			transition: transform 0.3s ease;

			flex-shrink: 0;

		}

		

		.ccl-nofault--disclaimer-btn--primary {

			background: linear-gradient(135deg, var(--ccl-nofault-primary-blue), var(--ccl-nofault-cta-blue));

			color: var(--ccl-nofault-white);

			border: 2px solid transparent;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-nofault--disclaimer-btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-nofault-cta-dark), var(--ccl-nofault-primary-blue));

			transform: translateY(-3px);

			box-shadow: 0 8px 20px rgba(29, 99, 255, 0.35);

		}

		

		.ccl-nofault--disclaimer-btn--primary:hover i {

			transform: scale(1.15) rotate(-10deg);

		}

		

		.ccl-nofault--disclaimer-btn--primary:active {

			transform: translateY(-1px);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-nofault--disclaimer-btn--secondary {

			background: var(--ccl-nofault-white);

			color: var(--ccl-nofault-primary-blue);

			border: 2px solid var(--ccl-nofault-primary-blue);

			box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);

		}

		

		.ccl-nofault--disclaimer-btn--secondary:hover {

			background: var(--ccl-nofault-primary-blue);

			color: var(--ccl-nofault-white);

			border-color: var(--ccl-nofault-primary-blue);

			transform: translateY(-3px);

			box-shadow: 0 8px 20px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-nofault--disclaimer-btn--secondary:hover i {

			transform: translateX(5px);

		}

		

		.ccl-nofault--disclaimer-btn--secondary:active {

			transform: translateY(-1px);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.15);

		}

		

		/* ===================================

		   RESPONSIVE

		=================================== */

		@media (max-width: 1024px) {

			.ccl-nofault--disclaimer-btn {

				padding: 13px 20px;

				font-size: 0.9rem;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-nofault--wrapper {

				font-size: 15px;

			}

			

			.ccl-nofault--hero {

				padding: 32px 16px 48px;

			}

			

			.ccl-nofault--breadcrumbs {

				font-size: 0.8rem;

			}

			

			.ccl-nofault--hero h1 {

				font-size: clamp(1.75rem, 5vw, 2.5rem);

			}

			

			.ccl-nofault--hero-meta {

				gap: 16px;

			}

			

			.ccl-nofault--article {

				padding: 48px 16px;

			}

			

			.ccl-nofault--article-content {

				font-size: 1.05rem;

			}

			

			.ccl-nofault--rating {

				padding: 40px 16px;

			}

			

			.ccl-nofault--rating-buttons {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-nofault--rating-btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-nofault--related {

				padding: 48px 16px;

			}

			

			.ccl-nofault--related-grid {

				grid-template-columns: 1fr;

				gap: 16px;

			}

			

			.ccl-nofault--related-title {

				font-size: 1.5rem;

			}

			

			.ccl-nofault--disclaimer {

				padding: 48px 16px;

			}

			

			.ccl-nofault--disclaimer-content {

				padding: 28px 20px;

			}

			

			.ccl-nofault--disclaimer-header {

				flex-direction: column;

				align-items: center;

				text-align: center;

			}

			

			.ccl-nofault--disclaimer-header-text h3 {

				font-size: 1.5rem;

			}

			

			.ccl-nofault--disclaimer-ctas {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-nofault--disclaimer-btn {

				width: 100%;

				flex: 1 1 100%;

				padding: 14px 20px;

				font-size: 0.9rem;

			}

			

			.ccl-nofault--table-wrapper {

				margin: 24px -16px;

			}

			

			.ccl-nofault--table th,

			.ccl-nofault--table td {

				padding: 12px 16px;

				font-size: 0.9rem;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-nofault--hero-category {

				padding: 6px 14px;

				font-size: 0.75rem;

			}

			

			.ccl-nofault--hero-meta {

				flex-direction: column;

				gap: 8px;

			}

			

			.ccl-nofault--related-card {

				padding: 20px;

			}

			

			.ccl-nofault--disclaimer-content {

				padding: 24px 16px;

			}

			

			.ccl-nofault--disclaimer-icon {

				width: 48px;

				height: 48px;

			}

			

			.ccl-nofault--disclaimer-icon i {

				font-size: 1.3rem;

			}

			

			.ccl-nofault--disclaimer-header-text h3 {

				font-size: 1.35rem;

			}

			

			.ccl-nofault--disclaimer-btn {

				padding: 13px 16px;

				font-size: 0.85rem;

				gap: 8px;

			}

			

			.ccl-nofault--disclaimer-btn i {

				font-size: 0.9rem;

			}

		}

		/* ===================================

		   WRAPPER SCOPED STYLES

		=================================== */

		.ccl-journal--wrapper {

			/* CSS Variables */

			--ccl-primary-blue: #1d63ff;

			--ccl-cta-blue: #0b5cff;

			--ccl-cta-dark: #0846c1;

			--ccl-accent-green: #10b981;

			--ccl-accent-gold: #ffa826;

			--ccl-ink: #1e293b;

			--ccl-muted: #64748b;

			--ccl-soft-border: #e5e7eb;

			--ccl-white: #ffffff;

			--ccl-bg-light: #f8fafc;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			line-height: 1.6;

			color: var(--ccl-muted);

			background-color: var(--ccl-white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		/* Reset within wrapper */

		.ccl-journal--wrapper * {

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}

		

		.ccl-journal--wrapper main {

			overflow-x: hidden;

		}

		

		/* ===================================

		   HERO SECTION

		=================================== */

		.ccl-journal--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-journal--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-journal-pulse 8s ease-in-out infinite;

		}

		

		.ccl-journal--hero::after {

			content: '';

			position: absolute;

			bottom: -30%;

			left: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-journal-pulse 10s ease-in-out infinite reverse;

		}

		

		@keyframes ccl-journal-pulse {

			0%, 100% { transform: scale(1) translateY(0); opacity: 0.5; }

			50% { transform: scale(1.1) translateY(-20px); opacity: 0.8; }

		}

		

		.ccl-journal--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-journal--hero-kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(255, 255, 255, 0.15);

			backdrop-filter: blur(10px);

			padding: 10px 20px;

			border-radius: 50px;

			color: var(--ccl-white);

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 24px;

			animation: ccl-journal-fadeInDown 0.8s ease-out;

		}

		

		.ccl-journal--hero-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.5rem, 6vw, 4.5rem);

			font-weight: 900;

			line-height: 1.1;

			color: var(--ccl-white);

			margin-bottom: 24px;

			animation: ccl-journal-fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		.ccl-journal--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.3rem);

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 750px;

			margin: 0 auto;

			animation: ccl-journal-fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		@keyframes ccl-journal-fadeInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		@keyframes ccl-journal-fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		/* ===================================

		   SEARCH & FILTER SECTION

		=================================== */

		.ccl-journal--search-section {

			background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);

			padding: 60px 24px 70px;

			border-bottom: 3px solid var(--ccl-primary-blue);

			box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);

		}

		

		.ccl-journal--search-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-journal--search-box {

			position: relative;

			max-width: 700px;

			margin: 0 auto 48px;

		}

		

		.ccl-journal--search-input {

			width: 100%;

			padding: 20px 60px 20px 28px;

			font-size: 1.1rem;

			font-family: 'Inter', sans-serif;

			border: 3px solid var(--ccl-primary-blue);

			border-radius: 50px;

			background: var(--ccl-white);

			color: var(--ccl-ink);

			transition: all 0.3s ease;

			box-shadow: 0 4px 16px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-journal--search-input:focus {

			outline: none;

			border-color: var(--ccl-cta-dark);

			box-shadow: 0 6px 24px rgba(29, 99, 255, 0.3);

			transform: translateY(-2px);

		}

		

		.ccl-journal--search-input::placeholder {

			color: var(--ccl-muted);

		}

		

		.ccl-journal--search-icon {

			position: absolute;

			right: 28px;

			top: 50%;

			transform: translateY(-50%);

			color: var(--ccl-primary-blue);

			font-size: 1.3rem;

			pointer-events: none;

		}

		

		.ccl-journal--filter-label {

			text-align: center;

			font-size: 1rem;

			font-weight: 700;

			color: var(--ccl-ink);

			text-transform: uppercase;

			letter-spacing: 1px;

			margin-bottom: 20px;

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

		}

		

		.ccl-journal--filter-label::before,

		.ccl-journal--filter-label::after {

			content: '';

			width: 40px;

			height: 3px;

			background: linear-gradient(90deg, transparent, var(--ccl-primary-blue));

		}

		

		.ccl-journal--filter-label::after {

			background: linear-gradient(90deg, var(--ccl-primary-blue), transparent);

		}

		

		.ccl-journal--filter-tabs {

			display: flex;

			justify-content: center;

			gap: 14px;

			flex-wrap: wrap;

		}

		

		.ccl-journal--filter-tab {

			padding: 16px 32px;

			font-size: 1rem;

			font-weight: 700;

			color: var(--ccl-ink);

			background: var(--ccl-white);

			border: 3px solid var(--ccl-primary-blue);

			border-radius: 50px;

			cursor: pointer;

			transition: all 0.3s ease;

			font-family: 'Inter', sans-serif;

			box-shadow: 0 3px 8px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-journal--filter-tab:hover {

			border-color: var(--ccl-cta-dark);

			background: var(--ccl-primary-blue);

			color: var(--ccl-white);

			transform: translateY(-3px);

			box-shadow: 0 6px 16px rgba(29, 99, 255, 0.35);

		}

		

		.ccl-journal--filter-tab.active {

			background: var(--ccl-primary-blue);

			border-color: var(--ccl-primary-blue);

			color: var(--ccl-white);

			box-shadow: 0 6px 16px rgba(29, 99, 255, 0.4);

			transform: scale(1.05);

		}

		

		/* ===================================

		   ARTICLES GRID

		=================================== */

		.ccl-journal--articles-section {

			padding: 100px 24px;

			max-width: 1400px;

			margin: 0 auto;

		}

		

		.ccl-journal--results-header {

			display: flex;

			justify-content: space-between;

			align-items: center;

			margin-bottom: 48px;

			flex-wrap: wrap;

			gap: 16px;

		}

		

		.ccl-journal--results-count {

			font-size: 1.05rem;

			color: var(--ccl-muted);

		}

		

		.ccl-journal--controls-group {

			display: flex;

			align-items: center;

			gap: 16px;

		}

		

		.ccl-journal--view-toggle {

			display: flex;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-primary-blue);

			border-radius: 10px;

			overflow: hidden;

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-journal--view-btn {

			width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: transparent;

			border: none;

			color: var(--ccl-primary-blue);

			cursor: pointer;

			transition: all 0.3s ease;

			font-size: 1.2rem;

			border-right: 2px solid var(--ccl-primary-blue);

			font-weight: 700;

		}

		

		.ccl-journal--view-btn:last-child {

			border-right: none;

		}

		

		.ccl-journal--view-btn:hover {

			background: rgba(29, 99, 255, 0.1);

			transform: scale(1.05);

		}

		

		.ccl-journal--view-btn.active {

			background: var(--ccl-primary-blue);

			color: var(--ccl-white);

			box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

		}

		

		.ccl-journal--sort-select {

			padding: 10px 40px 10px 16px;

			font-size: 0.95rem;

			font-family: 'Inter', sans-serif;

			border: 2px solid var(--ccl-soft-border);

			border-radius: 8px;

			background: var(--ccl-white);

			color: var(--ccl-ink);

			cursor: pointer;

			appearance: none;

			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 9L1 4h10z'/%3E%3C/svg%3E");

			background-repeat: no-repeat;

			background-position: right 12px center;

		}

		

		.ccl-journal--articles-grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));

			gap: 32px;

			margin-bottom: 80px;

			transition: all 0.3s ease;

		}

		

		.ccl-journal--articles-grid.list-view {

			grid-template-columns: 1fr;

			gap: 16px;

		}

		

		.ccl-journal--article-card {

			position: relative;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 24px;

			padding: 36px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

			opacity: 0;

			display: flex;

			flex-direction: column;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-card {

			flex-direction: row;

			align-items: center;

			gap: 24px;

			padding: 20px 28px;

			border-radius: 16px;

			background: linear-gradient(90deg, #f8fafc 0%, #ffffff 100%);

			border-left: 4px solid var(--ccl-primary-blue);

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-card:hover {

			background: var(--ccl-white);

			border-left-color: var(--ccl-accent-gold);

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-icon {

			flex-shrink: 0;

			margin-bottom: 0;

			width: 60px;

			height: 60px;

			font-size: 1.5rem;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-content {

			flex: 1;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-meta {

			margin-bottom: 8px;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-title {

			font-size: 1.25rem;

			margin-bottom: 8px;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-excerpt {

			-webkit-line-clamp: 2;

			font-size: 0.95rem;

			margin-bottom: 12px;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-tag {

			font-size: 0.8rem;

			padding: 4px 12px;

		}

		

		.ccl-journal--articles-grid.list-view .ccl-journal--article-date {

			font-size: 0.85rem;

		}

		

		.ccl-journal--article-card.ccl-journal--scroll-reveal {

			opacity: 1;

		}

		

		.ccl-journal--article-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.4s ease;

		}

		

		.ccl-journal--article-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.15);

			border-color: var(--ccl-primary-blue);

		}

		

		.ccl-journal--article-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-journal--article-icon {

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 2rem;

			margin-bottom: 24px;

			transition: all 0.4s ease;

		}

		

		.ccl-journal--article-card:hover .ccl-journal--article-icon {

			transform: rotate(10deg) scale(1.05);

			background: linear-gradient(135deg, var(--ccl-accent-gold), #ff9500);

		}

		

		.ccl-journal--article-meta {

			display: flex;

			gap: 16px;

			margin-bottom: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-journal--article-tag {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			padding: 6px 14px;

			background: rgba(29, 99, 255, 0.1);

			color: var(--ccl-primary-blue);

			border-radius: 50px;

			font-size: 0.85rem;

			font-weight: 600;

		}

		

		.ccl-journal--article-date {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			color: var(--ccl-muted);

			font-size: 0.9rem;

		}

		

		.ccl-journal--article-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: 1.5rem;

			font-weight: 800;

			line-height: 1.3;

			color: var(--ccl-ink);

			margin-bottom: 16px;

			transition: color 0.3s ease;

		}

		

		.ccl-journal--article-card:hover .ccl-journal--article-title {

			color: var(--ccl-primary-blue);

		}

		

		.ccl-journal--article-excerpt {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-muted);

			margin-bottom: 24px;

			display: -webkit-box;

			-webkit-line-clamp: 3;

			-webkit-box-orient: vertical;

			overflow: hidden;

		}

		

		.ccl-journal--article-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--ccl-primary-blue);

			font-weight: 600;

			font-size: 1rem;

			text-decoration: none;

			transition: all 0.3s ease;

		}

		

		.ccl-journal--article-link:hover {

			gap: 12px;

			color: var(--ccl-cta-dark);

		}

		

		.ccl-journal--article-link i {

			transition: transform 0.3s ease;

		}

		

		.ccl-journal--article-card:hover .ccl-journal--article-link i {

			transform: translateX(4px);

		}

		

		/* ===================================

		   PAGINATION

		=================================== */

		.ccl-journal--pagination {

			display: flex;

			justify-content: center;

			align-items: center;

			gap: 12px;

			margin-top: 60px;

		}

		

		.ccl-journal--page-btn {

			min-width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			padding: 0 16px;

			font-size: 1rem;

			font-weight: 600;

			color: var(--ccl-ink);

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s ease;

			text-decoration: none;

			font-family: 'Inter', sans-serif;

		}

		

		.ccl-journal--page-btn:hover {

			border-color: var(--ccl-primary-blue);

			color: var(--ccl-primary-blue);

			transform: translateY(-2px);

		}

		

		.ccl-journal--page-btn.active {

			background: var(--ccl-primary-blue);

			border-color: var(--ccl-primary-blue);

			color: var(--ccl-white);

		}

		

		.ccl-journal--page-btn:disabled {

			opacity: 0.4;

			cursor: not-allowed;

			transform: none;

		}

		

		.ccl-journal--page-ellipsis {

			color: var(--ccl-muted);

			padding: 0 8px;

		}

		

		/* ===================================

		   CTA SECTION

		=================================== */

		.ccl-journal--cta-section {

			background: linear-gradient(135deg, var(--ccl-bg-light) 0%, var(--ccl-white) 100%);

			padding: 100px 24px;

			text-align: center;

			border-top: 1px solid var(--ccl-soft-border);

		}

		

		.ccl-journal--cta-content {

			max-width: 850px;

			margin: 0 auto;

		}

		

		.ccl-journal--cta-icon {

			width: 100px;

			height: 100px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--ccl-accent-green), #059669);

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 2.5rem;

			margin: 0 auto 32px;

			animation: ccl-journal-bounce 2s ease-in-out infinite;

		}

		

		@keyframes ccl-journal-bounce {

			0%, 100% { transform: translateY(0); }

			50% { transform: translateY(-10px); }

		}

		

		.ccl-journal--cta-title {

			font-family: 'Inter Tight', sans-serif;

			font-size: clamp(2.25rem, 5vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ccl-ink);

			margin-bottom: 24px;

		}

		

		.ccl-journal--cta-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--ccl-muted);

			margin-bottom: 36px;

		}

		

		.ccl-journal--cta-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* ===================================

		   BUTTONS

		=================================== */

		.ccl-journal--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 36px;

			font-size: 1.05rem;

			font-weight: 700;

			font-family: 'Inter', sans-serif;

			text-decoration: none;

			border-radius: 50px;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			border: 2px solid transparent;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-journal--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-journal--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-journal--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-journal--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-journal--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-journal--btn--primary {

			background: linear-gradient(135deg, var(--ccl-cta-blue), var(--ccl-primary-blue));

			color: var(--ccl-white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-journal--btn--primary:hover {

			transform: translateY(-3px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.4);

		}

		

		.ccl-journal--btn--secondary {

			background: var(--ccl-white);

			color: var(--ccl-primary-blue);

			border-color: var(--ccl-primary-blue);

		}

		

		.ccl-journal--btn--secondary:hover {

			background: var(--ccl-primary-blue);

			color: var(--ccl-white);

			transform: translateY(-3px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.3);

		}

		

		/* ===================================

		   SCROLL REVEAL

		=================================== */

		.ccl-journal--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-journal--scroll-reveal.revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ===================================

		   RESPONSIVE DESIGN

		=================================== */

		@media (max-width: 1024px) {

			.ccl-journal--wrapper {

				font-size: 16px;

			}

			

			.ccl-journal--hero {

				padding: 100px 24px 80px;

			}

			

			.ccl-journal--articles-section {

				padding: 80px 24px;

			}

			

			.ccl-journal--articles-grid {

				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

				gap: 28px;

			}

			

			.ccl-journal--cta-section {

				padding: 80px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-journal--hero {

				padding: 80px 20px 60px;

			}

			

			.ccl-journal--search-section {

				padding: 40px 20px 50px;

			}

			

			.ccl-journal--articles-section {

				padding: 60px 20px;

			}

			

			.ccl-journal--articles-grid {

				grid-template-columns: 1fr;

				gap: 24px;

			}

			

			.ccl-journal--articles-grid.list-view {

				gap: 12px;

			}

			

			.ccl-journal--article-card {

				padding: 28px;

			}

			

			/* Grid view - keep vertical layout */

			.ccl-journal--articles-grid:not(.list-view) .ccl-journal--article-card {

				flex-direction: column;

			}

			

			.ccl-journal--articles-grid:not(.list-view) .ccl-journal--article-icon {

				margin-bottom: 24px;

			}

			

			/* List view - force horizontal layout */

			.ccl-journal--articles-grid.list-view .ccl-journal--article-card {

				flex-direction: row;

				padding: 16px 20px;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-icon {

				width: 50px;

				height: 50px;

				font-size: 1.3rem;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-title {

				font-size: 1.1rem;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-excerpt {

				font-size: 0.9rem;

			}

			

			.ccl-journal--results-header {

				flex-direction: column;

				align-items: flex-start;

			}

			

			.ccl-journal--controls-group {

				width: 100%;

				justify-content: space-between;

			}

			

			.ccl-journal--pagination {

				flex-wrap: wrap;

			}

			

			.ccl-journal--cta-section {

				padding: 60px 20px;

			}

			

			.ccl-journal--cta-buttons {

				flex-direction: column;

			}

			

			.ccl-journal--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-journal--hero {

				padding: 60px 16px 50px;

			}

			

			.ccl-journal--hero-kicker {

				font-size: 0.8rem;

				padding: 8px 16px;

			}

			

			.ccl-journal--search-section {

				padding: 32px 16px 40px;

			}

			

			.ccl-journal--search-input {

				padding: 18px 52px 18px 22px;

				font-size: 1rem;

			}

			

			.ccl-journal--filter-label {

				font-size: 0.9rem;

			}

			

			.ccl-journal--filter-label::before,

			.ccl-journal--filter-label::after {

				width: 20px;

			}

			

			.ccl-journal--filter-tabs {

				gap: 10px;

			}

			

			.ccl-journal--filter-tab {

				padding: 12px 20px;

				font-size: 0.9rem;

			}

			

			.ccl-journal--articles-section {

				padding: 50px 16px;

			}

			

			.ccl-journal--article-card {

				padding: 24px;

			}

			

			/* Grid view on mobile */

			.ccl-journal--articles-grid:not(.list-view) .ccl-journal--article-icon {

				width: 70px;

				height: 70px;

				font-size: 1.75rem;

			}

			

			.ccl-journal--articles-grid:not(.list-view) .ccl-journal--article-title {

				font-size: 1.35rem;

			}

			

			/* List view on mobile - very compact */

			.ccl-journal--articles-grid.list-view {

				gap: 10px;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-card {

				padding: 14px 18px;

				gap: 16px;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-icon {

				width: 45px;

				height: 45px;

				font-size: 1.1rem;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-title {

				font-size: 1rem;

				margin-bottom: 6px;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-excerpt {

				font-size: 0.85rem;

				margin-bottom: 8px;

				-webkit-line-clamp: 1;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-tag {

				font-size: 0.75rem;

				padding: 3px 10px;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-date {

				font-size: 0.75rem;

			}

			

			.ccl-journal--articles-grid.list-view .ccl-journal--article-link {

				font-size: 0.9rem;

			}

			

			.ccl-journal--view-btn {

				width: 38px;

				height: 38px;

				font-size: 1rem;

			}

			

			.ccl-journal--page-btn {

				min-width: 42px;

				height: 42px;

				font-size: 0.95rem;

			}

			

			.ccl-journal--cta-section {

				padding: 50px 16px;

			}

			

			.ccl-journal--cta-icon {

				width: 80px;

				height: 80px;

				font-size: 2rem;

			}

			

			.ccl-journal--btn {

				padding: 14px 28px;

				font-size: 1rem;

			}

		}

		/* ==========================================

		   WRAPPER SCOPED STYLES

		   ========================================== */

		.ccl-journalsingle-article--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--accent-red: #dc2626;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--light-bg: #f8fafc;

			--gradient-start: #1d63ff;

			--gradient-end: #0b5cff;

			

			/* Typography */

			--font-main: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

			--font-display: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;

			

			/* Spacing */

			--content-spacing: 80px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Transitions */

			--transition-smooth: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-bounce: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);

			

			/* Base Styles */

			font-family: var(--font-main);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ink);

			background-color: var(--white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-journalsingle-article--wrapper * {

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}

		

		.ccl-journalsingle-article--wrapper main {

			overflow-x: hidden;

		}

		

		/* ==========================================

		   HERO SECTION (REQUIRED)

		   ========================================== */

		.ccl-journalsingle-article--hero {

			position: relative;

			background: linear-gradient(135deg, var(--gradient-start) 0%, var(--gradient-end) 100%);

			padding: 140px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-journalsingle-article--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -50%;

			width: 100%;

			height: 100%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-journalsingle-article--glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-journalsingle-article--glow {

			0%, 100% { transform: translate(0, 0); opacity: 0.5; }

			50% { transform: translate(-20px, 20px); opacity: 0.8; }

		}

		

		.ccl-journalsingle-article--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-journalsingle-article--hero-kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 8px 20px;

			background: rgba(255, 255, 255, 0.15);

			backdrop-filter: blur(10px);

			border-radius: 30px;

			color: var(--white);

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 24px;

			animation: ccl-journalsingle-article--fadeInDown 0.8s ease-out;

		}

		

		.ccl-journalsingle-article--hero-kicker i {

			font-size: 1rem;

		}

		

		@keyframes ccl-journalsingle-article--fadeInDown {

			from { opacity: 0; transform: translateY(-20px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-journalsingle-article--hero-title {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			line-height: 1.1;

			color: var(--white);

			margin-bottom: 28px;

			animation: ccl-journalsingle-article--fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-journalsingle-article--fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-journalsingle-article--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 780px;

			margin: 0 auto 32px;

			animation: ccl-journalsingle-article--fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-journalsingle-article--hero-meta {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 24px;

			flex-wrap: wrap;

			color: rgba(255, 255, 255, 0.85);

			font-size: 0.95rem;

			animation: ccl-journalsingle-article--fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-journalsingle-article--hero-meta-item {

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-journalsingle-article--hero-meta-item i {

			opacity: 0.7;

		}

		

		/* ==========================================

		   CONTENT SECTION (REQUIRED - Components Optional)

		   ========================================== */

		.ccl-journalsingle-article--content {

			max-width: 1280px;

			margin: 0 auto;

			padding: 0 24px;

		}

		

		/* Content Block Spacing */

		.ccl-journalsingle-article--block {

			margin-bottom: var(--content-spacing);

		}

		

		.ccl-journalsingle-article--block:last-child {

			margin-bottom: 0;

		}

		

		/* Alert Banner (OPTIONAL) */

		.ccl-journalsingle-article--alert {

			background: linear-gradient(135deg, var(--accent-red), #b91c1c);

			padding: 20px 32px;

			border-radius: 16px;

			margin-top: calc(var(--content-spacing) * -0.5);

			margin-bottom: var(--content-spacing);

		}

		

		.ccl-journalsingle-article--alert-content {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

			color: var(--white);

			text-align: center;

		}

		

		.ccl-journalsingle-article--alert-icon {

			font-size: 1.5rem;

			animation: ccl-journalsingle-article--pulse 2s ease-in-out infinite;

		}

		

		@keyframes ccl-journalsingle-article--pulse {

			0%, 100% { transform: scale(1); }

			50% { transform: scale(1.1); }

		}

		

		.ccl-journalsingle-article--alert-text {

			font-size: 1.05rem;

			font-weight: 600;

			line-height: 1.5;

		}

		

		/* Section Headers (OPTIONAL) */

		.ccl-journalsingle-article--section-header {

			max-width: 850px;

			margin: 0 auto 48px;

			text-align: center;

		}

		

		.ccl-journalsingle-article--section-kicker {

			position: relative;

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.95rem;

			font-weight: 700;

			letter-spacing: 1px;

			text-transform: uppercase;

			margin-bottom: 20px;

		}

		

		.ccl-journalsingle-article--section-kicker::before,

		.ccl-journalsingle-article--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-journalsingle-article--section-kicker::after {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-journalsingle-article--section-title {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ink);

			margin-bottom: 24px;

		}

		

		.ccl-journalsingle-article--section-title mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-journalsingle-article--section-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		/* Hurdles Container (OPTIONAL) */

		.ccl-journalsingle-article--hurdles-container {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 32px;

			overflow: hidden;

		}

		

		.ccl-journalsingle-article--hurdles-header {

			background: linear-gradient(135deg, var(--accent-red), #b91c1c);

			padding: 48px 40px;

			text-align: center;

			color: var(--white);

			position: relative;

		}

		

		.ccl-journalsingle-article--hurdles-header::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse"><path d="M 40 0 L 0 0 0 40" fill="none" stroke="white" stroke-width="0.5" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');

			opacity: 0.3;

		}

		

		.ccl-journalsingle-article--hurdles-header-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-journalsingle-article--hurdles-icon {

			width: 100px;

			height: 100px;

			margin: 0 auto 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			border-radius: 50%;

			font-size: 3rem;

		}

		

		.ccl-journalsingle-article--hurdles-title {

			font-family: var(--font-display);

			font-size: clamp(2rem, 4vw, 2.75rem);

			font-weight: 900;

			margin-bottom: 16px;

			line-height: 1.2;

		}

		

		.ccl-journalsingle-article--hurdles-subtitle {

			font-size: 1.15rem;

			line-height: 1.6;

			opacity: 0.95;

		}

		

		.ccl-journalsingle-article--hurdles-body {

			padding: 48px 40px;

		}

		

		.ccl-journalsingle-article--hurdle {

			margin-bottom: 48px;

			padding-bottom: 48px;

			border-bottom: 2px solid var(--soft-border);

		}

		

		.ccl-journalsingle-article--hurdle:last-child {

			margin-bottom: 0;

			padding-bottom: 0;

			border-bottom: none;

		}

		

		.ccl-journalsingle-article--hurdle-header {

			display: flex;

			align-items: flex-start;

			gap: 24px;

			margin-bottom: 28px;

		}

		

		.ccl-journalsingle-article--hurdle-number {

			flex-shrink: 0;

			width: 70px;

			height: 70px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--accent-red), #b91c1c);

			border-radius: 20px;

			font-family: var(--font-display);

			font-size: 2.5rem;

			font-weight: 900;

			color: var(--white);

			box-shadow: 0 8px 20px rgba(220, 38, 38, 0.25);

		}

		

		.ccl-journalsingle-article--hurdle-title-group {

			flex: 1;

		}

		

		.ccl-journalsingle-article--hurdle-title {

			font-family: var(--font-display);

			font-size: clamp(1.75rem, 3vw, 2.25rem);

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 12px;

			line-height: 1.2;

		}

		

		.ccl-journalsingle-article--hurdle-subtitle {

			font-size: 1.05rem;

			color: var(--accent-red);

			font-weight: 600;

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-journalsingle-article--hurdle-description {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 28px;

		}

		

		.ccl-journalsingle-article--hurdle-impacts {

			background: linear-gradient(135deg, #fef2f2, #fee2e2);

			border-left: 4px solid var(--accent-red);

			padding: 28px;

			border-radius: 16px;

			margin-bottom: 24px;

		}

		

		.ccl-journalsingle-article--hurdle-impacts-title {

			font-family: var(--font-display);

			font-size: 1.15rem;

			font-weight: 800;

			color: #991b1b;

			margin-bottom: 16px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-journalsingle-article--hurdle-impacts-title i {

			font-size: 1.3rem;

		}

		

		.ccl-journalsingle-article--hurdle-impacts-list {

			list-style: none;

		}

		

		.ccl-journalsingle-article--hurdle-impacts-list li {

			padding-left: 32px;

			position: relative;

			margin-bottom: 12px;

			color: #7f1d1d;

			font-size: 1.05rem;

			line-height: 1.6;

			font-weight: 500;

		}

		

		.ccl-journalsingle-article--hurdle-impacts-list li:last-child {

			margin-bottom: 0;

		}

		

		.ccl-journalsingle-article--hurdle-impacts-list li::before {

			content: '×';

			position: absolute;

			left: 8px;

			color: var(--accent-red);

			font-size: 1.5rem;

			font-weight: 900;

			line-height: 1;

		}

		

		.ccl-journalsingle-article--hurdle-consequence {

			background: var(--light-bg);

			border-radius: 12px;

			padding: 24px;

			border: 1px solid var(--soft-border);

		}

		

		.ccl-journalsingle-article--hurdle-consequence-label {

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--muted);

			margin-bottom: 8px;

		}

		

		.ccl-journalsingle-article--hurdle-consequence-text {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ink);

			font-weight: 500;

		}

		

		/* Case Study (OPTIONAL) */

		.ccl-journalsingle-article--case-study {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			overflow: hidden;

		}

		

		.ccl-journalsingle-article--case-header {

			background: linear-gradient(135deg, #0f172a, #1e293b);

			padding: 40px;

			text-align: center;

			color: var(--white);

		}

		

		.ccl-journalsingle-article--case-label {

			display: inline-block;

			padding: 6px 16px;

			background: rgba(239, 68, 68, 0.2);

			border: 1px solid rgba(239, 68, 68, 0.4);

			border-radius: 20px;

			font-size: 0.85rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 16px;

			color: #fca5a5;

		}

		

		.ccl-journalsingle-article--case-title {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			margin-bottom: 12px;

		}

		

		.ccl-journalsingle-article--case-subtitle {

			font-size: 1.05rem;

			opacity: 0.85;

		}

		

		.ccl-journalsingle-article--case-body {

			padding: 40px;

		}

		

		.ccl-journalsingle-article--case-section {

			margin-bottom: 32px;

		}

		

		.ccl-journalsingle-article--case-section:last-child {

			margin-bottom: 0;

		}

		

		.ccl-journalsingle-article--case-section-title {

			font-weight: 700;

			color: var(--ink);

			margin-bottom: 12px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-journalsingle-article--case-section-title i {

			color: var(--primary-blue);

		}

		

		.ccl-journalsingle-article--case-text {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 16px;

		}

		

		.ccl-journalsingle-article--case-highlight {

			background: linear-gradient(135deg, #fef3c7, #fde68a);

			border-left: 4px solid var(--accent-gold);

			padding: 24px;

			border-radius: 12px;

			margin: 24px 0;

		}

		

		.ccl-journalsingle-article--case-highlight-title {

			font-weight: 700;

			color: var(--ink);

			margin-bottom: 12px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-journalsingle-article--case-highlight-title i {

			color: var(--accent-gold);

		}

		

		.ccl-journalsingle-article--case-highlight-text {

			font-size: 1.05rem;

			line-height: 1.7;

			color: #78350f;

		}

		

		/* Framework Cards (OPTIONAL) */

		.ccl-journalsingle-article--framework-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

		}

		

		.ccl-journalsingle-article--framework-card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			transition: var(--transition-smooth);

		}

		

		.ccl-journalsingle-article--framework-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			border-radius: 24px 24px 0 0;

			transform: scaleX(0);

			transform-origin: left;

			transition: var(--transition-smooth);

		}

		

		.ccl-journalsingle-article--framework-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 32px rgba(29, 99, 255, 0.1);

			border-color: var(--primary-blue);

		}

		

		.ccl-journalsingle-article--framework-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-journalsingle-article--framework-icon {

			width: 80px;

			height: 80px;

			margin-bottom: 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

			border-radius: 50%;

			font-size: 2rem;

			color: var(--primary-blue);

			transition: var(--transition-smooth);

		}

		

		.ccl-journalsingle-article--framework-card:hover .ccl-journalsingle-article--framework-icon {

			transform: scale(1.1);

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

		}

		

		.ccl-journalsingle-article--framework-title {

			font-family: var(--font-display);

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 16px;

		}

		

		.ccl-journalsingle-article--framework-text {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin-bottom: 20px;

		}

		

		.ccl-journalsingle-article--framework-stat {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 12px 20px;

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.05));

			border-radius: 12px;

			font-family: var(--font-display);

			font-size: 1.4rem;

			font-weight: 800;

			color: var(--accent-green);

		}

		

		/* Callout Boxes (OPTIONAL) */

		.ccl-journalsingle-article--callout {

			background: linear-gradient(135deg, #fef3c7, #fde68a);

			border: 2px solid #fcd34d;

			border-radius: 24px;

			padding: 40px;

		}

		

		.ccl-journalsingle-article--callout-header {

			display: flex;

			align-items: center;

			gap: 16px;

			margin-bottom: 24px;

		}

		

		.ccl-journalsingle-article--callout-icon {

			width: 60px;

			height: 60px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--accent-gold);

			border-radius: 50%;

			font-size: 1.8rem;

			color: var(--white);

		}

		

		.ccl-journalsingle-article--callout-title {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: #78350f;

		}

		

		.ccl-journalsingle-article--callout-text {

			font-size: 1.05rem;

			line-height: 1.8;

			color: #92400e;

			margin-bottom: 16px;

		}

		

		.ccl-journalsingle-article--callout-question {

			font-weight: 700;

			color: #78350f;

			font-style: italic;

		}

		

		/* Context Box (OPTIONAL) */

		.ccl-journalsingle-article--context {

			background: linear-gradient(135deg, #dbeafe, #bfdbfe);

			border-radius: 24px;

			padding: 48px;

			text-align: center;

		}

		

		.ccl-journalsingle-article--context-icon {

			width: 100px;

			height: 100px;

			margin: 0 auto 28px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			border-radius: 50%;

			font-size: 3rem;

			color: var(--white);

		}

		

		.ccl-journalsingle-article--context-title {

			font-family: var(--font-display);

			font-size: 2rem;

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 20px;

		}

		

		.ccl-journalsingle-article--context-text {

			font-size: 1.15rem;

			line-height: 1.8;

			color: #1e40af;

			max-width: 850px;

			margin: 0 auto;

		}

		

		/* Solution Cards (OPTIONAL) */

		.ccl-journalsingle-article--solutions {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

		}

		

		.ccl-journalsingle-article--solution-card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			transition: var(--transition-smooth);

			overflow: hidden;

		}

		

		.ccl-journalsingle-article--solution-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--accent-green), #059669);

			transform: translateY(-4px);

			transition: var(--transition-smooth);

		}

		

		.ccl-journalsingle-article--solution-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(16, 185, 129, 0.15);

			border-color: var(--accent-green);

		}

		

		.ccl-journalsingle-article--solution-card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-journalsingle-article--solution-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 8px 16px;

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(16, 185, 129, 0.05));

			border-radius: 20px;

			font-size: 0.85rem;

			font-weight: 700;

			color: var(--accent-green);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 24px;

		}

		

		.ccl-journalsingle-article--solution-icon {

			width: 90px;

			height: 90px;

			margin: 0 auto 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--accent-green), #059669);

			border-radius: 50%;

			font-size: 2.5rem;

			color: var(--white);

			transition: var(--transition-bounce);

		}

		

		.ccl-journalsingle-article--solution-card:hover .ccl-journalsingle-article--solution-icon {

			transform: rotate(-10deg) scale(1.08);

		}

		

		.ccl-journalsingle-article--solution-title {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 16px;

			line-height: 1.3;

		}

		

		.ccl-journalsingle-article--solution-description {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin-bottom: 24px;

		}

		

		.ccl-journalsingle-article--solution-details {

			background: var(--light-bg);

			border-radius: 12px;

			padding: 20px;

		}

		

		.ccl-journalsingle-article--solution-details-title {

			font-weight: 700;

			color: var(--ink);

			margin-bottom: 12px;

			font-size: 0.95rem;

		}

		

		.ccl-journalsingle-article--solution-details-text {

			font-size: 0.95rem;

			line-height: 1.6;

			color: var(--muted);

		}

		

		/* CTA Box (OPTIONAL) */

		.ccl-journalsingle-article--cta {

			background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));

			border-radius: 32px;

			padding: 60px 40px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-journalsingle-article--cta::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse"><path d="M 40 0 L 0 0 0 40" fill="none" stroke="white" stroke-width="0.5" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');

			opacity: 0.3;

		}

		

		.ccl-journalsingle-article--cta-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-journalsingle-article--cta-icon {

			width: 100px;

			height: 100px;

			margin: 0 auto 28px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			border-radius: 50%;

			font-size: 3rem;

			color: var(--white);

		}

		

		.ccl-journalsingle-article--cta-title {

			font-family: var(--font-display);

			font-size: clamp(2rem, 4vw, 3rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 20px;

			line-height: 1.2;

		}

		

		.ccl-journalsingle-article--cta-text {

			font-size: 1.2rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 750px;

			margin: 0 auto 36px;

		}

		

		.ccl-journalsingle-article--cta-buttons {

			display: flex;

			gap: 20px;

			justify-content: center;

			flex-wrap: wrap;

		}

		

		/* Buttons */

		.ccl-journalsingle-article--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 16px 36px;

			font-family: var(--font-main);

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border-radius: 12px;

			transition: var(--transition-smooth);

			cursor: pointer;

			border: 2px solid transparent;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-journalsingle-article--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-journalsingle-article--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-journalsingle-article--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-journalsingle-article--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-journalsingle-article--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-journalsingle-article--btn--primary {

			background: var(--white);

			color: var(--primary-blue);

		}

		

		.ccl-journalsingle-article--btn--primary:hover {

			background: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 12px 28px rgba(255, 255, 255, 0.3);

		}

		

		.ccl-journalsingle-article--btn--secondary {

			background: transparent;

			color: var(--white);

			border-color: var(--white);

		}

		

		.ccl-journalsingle-article--btn--secondary:hover {

			background: var(--white);

			color: var(--primary-blue);

			transform: translateY(-2px);

		}

		

		/* ==========================================

		   REFERENCE SECTION (REQUIRED)

		   ========================================== */

		.ccl-journalsingle-article--reference {

			background: var(--light-bg);

			padding: 80px 24px;

		}

		

		.ccl-journalsingle-article--reference-container {

			max-width: 1280px;

			margin: 0 auto;

		}

		

		/* Reference Section Header */

		.ccl-journalsingle-article--reference-header {

			max-width: 850px;

			margin: 0 auto 60px;

			text-align: center;

		}

		

		.ccl-journalsingle-article--reference-header-kicker {

			position: relative;

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.95rem;

			font-weight: 700;

			letter-spacing: 1px;

			text-transform: uppercase;

			margin-bottom: 20px;

		}

		

		.ccl-journalsingle-article--reference-header-kicker::before,

		.ccl-journalsingle-article--reference-header-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-journalsingle-article--reference-header-kicker::after {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-journalsingle-article--reference-header-title {

			font-family: var(--font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			line-height: 1.2;

			color: var(--ink);

			margin-bottom: 24px;

		}

		

		.ccl-journalsingle-article--reference-header-title mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-journalsingle-article--reference-header-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		/* Legal References Grid */

		.ccl-journalsingle-article--references-grid {

			display: grid;

			gap: 28px;

			margin-bottom: 60px;

		}

		

		.ccl-journalsingle-article--reference-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			padding: 32px;

			transition: var(--transition-smooth);

			position: relative;

		}

		

		.ccl-journalsingle-article--reference-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			border-radius: 20px 20px 0 0;

			transform: scaleX(0);

			transform-origin: left;

			transition: var(--transition-smooth);

		}

		

		.ccl-journalsingle-article--reference-card:hover {

			border-color: var(--primary-blue);

			box-shadow: 0 12px 32px rgba(29, 99, 255, 0.12);

			transform: translateY(-4px);

		}

		

		.ccl-journalsingle-article--reference-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-journalsingle-article--reference-card-header {

			display: flex;

			align-items: flex-start;

			gap: 20px;

			margin-bottom: 20px;

		}

		

		.ccl-journalsingle-article--reference-number {

			flex-shrink: 0;

			width: 50px;

			height: 50px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			border-radius: 14px;

			font-family: var(--font-display);

			font-size: 1.5rem;

			font-weight: 900;

			color: var(--white);

		}

		

		.ccl-journalsingle-article--reference-type {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			padding: 6px 14px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

			border-radius: 20px;

			font-size: 0.8rem;

			font-weight: 700;

			color: var(--primary-blue);

			text-transform: uppercase;

			letter-spacing: 0.5px;

		}

		

		.ccl-journalsingle-article--reference-body {

			margin-bottom: 20px;

		}

		

		.ccl-journalsingle-article--reference-title {

			font-family: var(--font-display);

			font-size: 1.4rem;

			font-weight: 800;

			color: var(--ink);

			margin-bottom: 12px;

			line-height: 1.3;

		}

		

		.ccl-journalsingle-article--reference-description {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

			margin-bottom: 16px;

		}

		

		.ccl-journalsingle-article--reference-details {

			background: var(--light-bg);

			border-radius: 12px;

			padding: 20px;

		}

		

		.ccl-journalsingle-article--reference-detail {

			display: flex;

			align-items: flex-start;

			gap: 12px;

			margin-bottom: 12px;

		}

		

		.ccl-journalsingle-article--reference-detail:last-child {

			margin-bottom: 0;

		}

		

		.ccl-journalsingle-article--reference-detail-icon {

			flex-shrink: 0;

			width: 28px;

			height: 28px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			border-radius: 8px;

			color: var(--primary-blue);

			font-size: 0.9rem;

		}

		

		.ccl-journalsingle-article--reference-detail-content {

			flex: 1;

		}

		

		.ccl-journalsingle-article--reference-detail-label {

			font-size: 0.85rem;

			font-weight: 700;

			color: var(--muted);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 4px;

		}

		

		.ccl-journalsingle-article--reference-detail-text {

			font-size: 0.95rem;

			line-height: 1.6;

			color: var(--ink);

		}

		

		.ccl-journalsingle-article--reference-impact {

			margin-top: 16px;

			padding-top: 16px;

			border-top: 1px solid var(--soft-border);

		}

		

		.ccl-journalsingle-article--reference-impact-label {

			font-size: 0.85rem;

			font-weight: 700;

			color: var(--accent-red);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-journalsingle-article--reference-impact-text {

			font-size: 0.95rem;

			line-height: 1.6;

			color: var(--muted);

			font-style: italic;

		}

		

		/* Article Meta */

		.ccl-journalsingle-article--meta {

			background: var(--white);

			border-radius: 24px;

			padding: 48px 40px;

			border: 2px solid var(--soft-border);

		}

		

		.ccl-journalsingle-article--meta-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 32px;

		}

		

		.ccl-journalsingle-article--meta-item {

			display: flex;

			align-items: flex-start;

			gap: 16px;

		}

		

		.ccl-journalsingle-article--meta-icon {

			width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			border-radius: 12px;

			font-size: 1.3rem;

			color: var(--white);

			flex-shrink: 0;

		}

		

		.ccl-journalsingle-article--meta-content {

			flex: 1;

		}

		

		.ccl-journalsingle-article--meta-label {

			font-size: 0.85rem;

			font-weight: 600;

			color: var(--muted);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 6px;

		}

		

		.ccl-journalsingle-article--meta-value {

			font-size: 1.05rem;

			font-weight: 600;

			color: var(--ink);

		}

		

		/* ==========================================

		   SCROLL REVEAL ANIMATIONS

		   ========================================== */

		.ccl-journalsingle-article--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-journalsingle-article--scroll-reveal.ccl-journalsingle-article--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ==========================================

		   RESPONSIVE DESIGN

		   ========================================== */

		@media (max-width: 1024px) {

			.ccl-journalsingle-article--wrapper {

				--content-spacing: 60px;

				--card-padding: 32px;

				--grid-gap: 28px;

			}

			

			.ccl-journalsingle-article--hero {

				padding: 120px 24px 80px;

			}

			

			.ccl-journalsingle-article--framework-grid,

			.ccl-journalsingle-article--solutions {

				grid-template-columns: 1fr;

				max-width: 600px;

				margin-left: auto;

				margin-right: auto;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-journalsingle-article--wrapper {

				--content-spacing: 48px;

				--card-padding: 28px;

				--grid-gap: 24px;

			}

			

			.ccl-journalsingle-article--hero {

				padding: 100px 20px 60px;

			}

			

			.ccl-journalsingle-article--hero-meta {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-journalsingle-article--section-kicker::before,

			.ccl-journalsingle-article--section-kicker::after,

			.ccl-journalsingle-article--reference-header-kicker::before,

			.ccl-journalsingle-article--reference-header-kicker::after {

				width: 20px;

			}

			

			.ccl-journalsingle-article--hurdles-header,

			.ccl-journalsingle-article--hurdles-body {

				padding: 32px 24px;

			}

			

			.ccl-journalsingle-article--hurdle-header {

				flex-direction: column;

				align-items: center;

				text-align: center;

			}

			

			.ccl-journalsingle-article--case-header,

			.ccl-journalsingle-article--case-body {

				padding: 28px 24px;

			}

			

			.ccl-journalsingle-article--context {

				padding: 36px 24px;

			}

			

			.ccl-journalsingle-article--cta {

				padding: 48px 28px;

			}

			

			.ccl-journalsingle-article--cta-buttons {

				flex-direction: column;

			}

			

			.ccl-journalsingle-article--btn {

				width: 100%;

			}

			

			.ccl-journalsingle-article--meta-grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-journalsingle-article--meta {

				padding: 32px 24px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-journalsingle-article--wrapper {

				--content-spacing: 40px;

				--card-padding: 24px;

				font-size: 15px;

			}

			

			.ccl-journalsingle-article--hero {

				padding: 80px 16px 48px;

			}

			

			.ccl-journalsingle-article--content {

				padding: 0 16px;

			}

			

			.ccl-journalsingle-article--hurdle-number {

				width: 60px;

				height: 60px;

				font-size: 2rem;

			}

			

			.ccl-journalsingle-article--framework-icon,

			.ccl-journalsingle-article--solution-icon {

				width: 70px;

				height: 70px;

				font-size: 2rem;

			}

			

			.ccl-journalsingle-article--callout {

				padding: 28px 20px;

			}

			

			.ccl-journalsingle-article--context-icon {

				width: 80px;

				height: 80px;

				font-size: 2.5rem;

			}

		}

		/* ============================================

		   CCL WEBINARS PAGE STYLES

		   ============================================ */

		

		.ccl-webinars--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--off-white: #f9fafb;

			

			/* Typography */

			--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', var(--font-primary);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Base Styles */

			font-family: var(--font-primary);

			color: var(--muted);

			line-height: 1.7;

			font-size: 16px;

			background-color: var(--off-white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-webinars--wrapper * {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		.ccl-webinars--wrapper main {

			overflow-x: hidden;

		}

		

		/* Typography */

		.ccl-webinars--wrapper h1,

		.ccl-webinars--wrapper h2,

		.ccl-webinars--wrapper h3,

		.ccl-webinars--wrapper h4 {

			font-family: var(--font-display);

			color: var(--ink);

			line-height: 1.2;

			font-weight: 800;

		}

		

		.ccl-webinars--wrapper p {

			margin-bottom: 1.25rem;

		}

		

		.ccl-webinars--wrapper p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-webinars--wrapper a {

			color: var(--primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-webinars--wrapper a:hover {

			color: var(--cta-dark);

		}

		

		/* Hero Section */

		.ccl-webinars--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 140px 24px 120px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-webinars--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-webinars-glow 8s ease-in-out infinite;

		}

		

		.ccl-webinars--hero::after {

			content: '';

			position: absolute;

			bottom: -30%;

			left: -10%;

			width: 500px;

			height: 500px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-webinars-glow 10s ease-in-out infinite reverse;

		}

		

		@keyframes ccl-webinars-glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, -30px) scale(1.1); }

		}

		

		.ccl-webinars--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-webinars--hero-kicker {

			display: inline-block;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			color: var(--white);

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			padding: 10px 24px;

			border-radius: 50px;

			margin-bottom: 28px;

			animation: ccl-webinars-fadeInDown 0.8s ease-out;

		}

		

		.ccl-webinars--hero h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			color: var(--white);

			margin-bottom: 28px;

			animation: ccl-webinars-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		.ccl-webinars--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.8;

			max-width: 800px;

			margin: 0 auto;

			animation: ccl-webinars-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		@keyframes ccl-webinars-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		@keyframes ccl-webinars-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(40px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		/* Section Base Styles */

		.ccl-webinars--section {

			padding: var(--section-padding) 24px;

		}

		

		.ccl-webinars--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 64px;

		}

		

		.ccl-webinars--kicker {

			position: relative;

			display: inline-flex;

			align-items: center;

			gap: 16px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.8px;

			color: var(--primary-blue);

			margin-bottom: 20px;

		}

		

		.ccl-webinars--kicker::before,

		.ccl-webinars--kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-webinars--section-header h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 24px;

		}

		

		.ccl-webinars--section-header h2 mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.15) 0%, rgba(29, 99, 255, 0.15) 100%);

			background-repeat: no-repeat;

			background-size: 100% 40%;

			background-position: 0 85%;

			color: inherit;

			padding: 0 8px;

		}

		

		.ccl-webinars--section-lead {

			font-size: 1.2rem;

			line-height: 1.8;

			color: var(--muted);

		}

		

		/* Container */

		.ccl-webinars--container {

			max-width: 1280px;

			margin: 0 auto;

		}

		

		/* Button Styles */

		.ccl-webinars--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			font-family: var(--font-primary);

			font-size: 1rem;

			font-weight: 600;

			padding: 16px 32px;

			border-radius: 8px;

			border: none;

			cursor: pointer;

			transition: all 0.3s ease;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-webinars--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-webinars--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-webinars--btn--primary {

			background: var(--cta-blue);

			color: var(--white);

		}

		

		.ccl-webinars--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-webinars--btn--secondary {

			background: var(--white);

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-webinars--btn--secondary:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-webinars--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-webinars--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-webinars--btn span {

			position: relative;

			z-index: 1;

		}

		

		/* Webinar Cards */

		.ccl-webinars--grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

		}

		

		.ccl-webinars--card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			overflow: hidden;

		}

		

		.ccl-webinars--card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--primary-blue);

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-webinars--card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.12);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-webinars--card:hover::before {

			transform: scaleY(1);

		}

		

		.ccl-webinars--card-video {

			position: relative;

			width: 100%;

			padding-bottom: 56.25%; /* 16:9 aspect ratio */

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

			border-radius: 12px;

			margin-bottom: 24px;

			overflow: hidden;

		}

		

		.ccl-webinars--card-video-placeholder {

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 100%;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.15), rgba(11, 92, 255, 0.08));

		}

		

		.ccl-webinars--card-video-icon {

			width: 80px;

			height: 80px;

			background: var(--white);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			box-shadow: 0 4px 20px rgba(29, 99, 255, 0.2);

			transition: all 0.3s ease;

		}

		

		.ccl-webinars--card:hover .ccl-webinars--card-video-icon {

			transform: scale(1.1);

			box-shadow: 0 6px 30px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-webinars--card-video-icon i {

			font-size: 2rem;

			color: var(--primary-blue);

			margin-left: 4px;

		}

		

		.ccl-webinars--card-badges {

			display: flex;

			gap: 8px;

			flex-wrap: wrap;

			margin-bottom: 16px;

		}

		

		.ccl-webinars--card-badge {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			font-size: 0.8rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			padding: 6px 14px;

			border-radius: 50px;

		}

		

		.ccl-webinars--card-badge--recorded {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

		}

		

		.ccl-webinars--card-badge--cpd {

			background: rgba(255, 168, 38, 0.1);

			color: var(--accent-gold);

		}

		

		.ccl-webinars--card-date {

			display: flex;

			align-items: center;

			gap: 8px;

			font-size: 0.9rem;

			font-weight: 500;

			color: var(--muted);

			margin-bottom: 16px;

		}

		

		.ccl-webinars--card-date i {

			color: var(--primary-blue);

		}

		

		.ccl-webinars--card h3 {

			font-size: 1.75rem;

			margin-bottom: 16px;

			color: var(--ink);

		}

		

		.ccl-webinars--card-meta {

			display: flex;

			align-items: center;

			gap: 20px;

			flex-wrap: wrap;

			font-size: 0.9rem;

			color: var(--muted);

			margin-bottom: 20px;

			padding-bottom: 20px;

			border-bottom: 1px solid var(--soft-border);

		}

		

		.ccl-webinars--card-meta-item {

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-webinars--card-meta i {

			color: var(--primary-blue);

			font-size: 0.85rem;

		}

		

		.ccl-webinars--card-description {

			font-size: 1.05rem;

			line-height: 1.7;

			margin-bottom: 24px;

		}

		

		.ccl-webinars--card-topics {

			display: flex;

			flex-wrap: wrap;

			gap: 8px;

			margin-bottom: 28px;

		}

		

		.ccl-webinars--card-topic {

			font-size: 0.85rem;

			font-weight: 500;

			color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.08);

			padding: 6px 14px;

			border-radius: 6px;

		}

		

		.ccl-webinars--card-presenter {

			display: flex;

			align-items: center;

			gap: 14px;

			padding: 16px;

			background: var(--off-white);

			border-radius: 12px;

			margin-bottom: 24px;

		}

		

		.ccl-webinars--card-presenter-icon {

			width: 48px;

			height: 48px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--white);

			font-size: 1.2rem;

			flex-shrink: 0;

		}

		

		.ccl-webinars--card-presenter-info h4 {

			font-size: 1rem;

			font-weight: 700;

			margin-bottom: 2px;

		}

		

		.ccl-webinars--card-presenter-info p {

			font-size: 0.9rem;

			color: var(--muted);

			margin: 0;

		}

		

		.ccl-webinars--card-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			font-weight: 600;

			color: var(--primary-blue);

			transition: gap 0.3s ease;

		}

		

		.ccl-webinars--card:hover .ccl-webinars--card-link {

			gap: 12px;

		}

		

		/* Featured Webinar */

		.ccl-webinars--featured {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.02));

			border: 3px solid var(--primary-blue);

			position: relative;

		}

		

		.ccl-webinars--featured::after {

			content: 'Featured';

			position: absolute;

			top: 20px;

			right: 20px;

			background: var(--primary-blue);

			color: var(--white);

			font-size: 0.75rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1px;

			padding: 6px 16px;

			border-radius: 50px;

			z-index: 2;

		}

		

		/* Benefits Section */

		.ccl-webinars--benefits {

			background: var(--white);

		}

		

		.ccl-webinars--benefit-card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			text-align: center;

		}

		

		.ccl-webinars--benefit-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--accent-green);

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-webinars--benefit-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(16, 185, 129, 0.12);

			border-color: rgba(16, 185, 129, 0.3);

		}

		

		.ccl-webinars--benefit-card:hover::before {

			transform: scaleY(1);

		}

		

		.ccl-webinars--benefit-icon {

			width: 90px;

			height: 90px;

			margin: 0 auto 24px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.05));

			display: flex;

			align-items: center;

			justify-content: center;

			transition: all 0.4s ease;

		}

		

		.ccl-webinars--benefit-icon i {

			font-size: 2.5rem;

			color: var(--accent-green);

			transition: all 0.4s ease;

		}

		

		.ccl-webinars--benefit-card:hover .ccl-webinars--benefit-icon {

			transform: rotate(10deg) scale(1.1);

		}

		

		.ccl-webinars--benefit-card:hover .ccl-webinars--benefit-icon i {

			color: var(--cta-blue);

		}

		

		.ccl-webinars--benefit-card h3 {

			font-size: 1.5rem;

			margin-bottom: 16px;

		}

		

		.ccl-webinars--benefit-card p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		/* Topics Section */

		.ccl-webinars--topics {

			background: var(--off-white);

		}

		

		.ccl-webinars--topic-card {

			position: relative;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: 32px;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-webinars--topic-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--accent-gold);

			transform: scaleY(0);

			transform-origin: top;

			transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-webinars--topic-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(255, 168, 38, 0.12);

			border-color: rgba(255, 168, 38, 0.3);

		}

		

		.ccl-webinars--topic-card:hover::before {

			transform: scaleY(1);

		}

		

		.ccl-webinars--topic-icon {

			width: 80px;

			height: 80px;

			margin-bottom: 24px;

			border-radius: 20px;

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.15), rgba(255, 168, 38, 0.05));

			display: flex;

			align-items: center;

			justify-content: center;

			transition: all 0.4s ease;

		}

		

		.ccl-webinars--topic-icon i {

			font-size: 2.2rem;

			color: var(--accent-gold);

			transition: all 0.4s ease;

		}

		

		.ccl-webinars--topic-card:hover .ccl-webinars--topic-icon {

			transform: rotate(-5deg) scale(1.05);

		}

		

		.ccl-webinars--topic-card h3 {

			font-size: 1.75rem;

			margin-bottom: 16px;

		}

		

		.ccl-webinars--topic-card p {

			font-size: 1.05rem;

			line-height: 1.7;

			margin-bottom: 20px;

		}

		

		.ccl-webinars--topic-list {

			list-style: none;

			margin-top: 20px;

		}

		

		.ccl-webinars--topic-list li {

			display: flex;

			align-items: start;

			gap: 12px;

			font-size: 0.95rem;

			padding: 10px 0;

			border-bottom: 1px solid var(--soft-border);

		}

		

		.ccl-webinars--topic-list li:last-child {

			border-bottom: none;

		}

		

		.ccl-webinars--topic-list i {

			color: var(--accent-gold);

			margin-top: 4px;

			flex-shrink: 0;

		}

		

		/* CTA Section */

		.ccl-webinars--cta {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-webinars--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -20%;

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-webinars--cta-content {

			position: relative;

			z-index: 1;

			text-align: center;

			max-width: 850px;

			margin: 0 auto;

		}

		

		.ccl-webinars--cta h2 {

			font-size: clamp(2.5rem, 5vw, 3.75rem);

			color: var(--white);

			margin-bottom: 24px;

		}

		

		.ccl-webinars--cta p {

			font-size: 1.25rem;

			color: rgba(255, 255, 255, 0.95);

			margin-bottom: 36px;

		}

		

		.ccl-webinars--cta-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-webinars--cta .ccl-webinars--btn--primary {

			background: var(--white);

			color: var(--primary-blue);

		}

		

		.ccl-webinars--cta .ccl-webinars--btn--primary:hover {

			background: var(--off-white);

			color: var(--cta-dark);

		}

		

		.ccl-webinars--cta .ccl-webinars--btn--secondary {

			background: transparent;

			color: var(--white);

			border-color: var(--white);

		}

		

		.ccl-webinars--cta .ccl-webinars--btn--secondary:hover {

			background: var(--white);

			color: var(--primary-blue);

		}

		

		/* Scroll Reveal */

		.ccl-webinars--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease-out, transform 0.8s ease-out;

		}

		

		.ccl-webinars--scroll-reveal.ccl-webinars--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-webinars--wrapper {

				--section-padding: 80px;

				--card-padding: 32px;

				--grid-gap: 28px;

			}

			

			.ccl-webinars--grid {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			}

		}

		

		@media (max-width: 768px) {

			.ccl-webinars--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

				--grid-gap: 24px;

			}

			

			.ccl-webinars--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-webinars--section {

				padding: var(--section-padding) 20px;

			}

			

			.ccl-webinars--grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-webinars--section-header {

				margin-bottom: 48px;

			}

			

			.ccl-webinars--kicker::before,

			.ccl-webinars--kicker::after {

				width: 24px;

			}

			

			.ccl-webinars--cta-buttons {

				flex-direction: column;

			}

			

			.ccl-webinars--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-webinars--wrapper {

				--section-padding: 48px;

				--card-padding: 24px;

			}

			

			.ccl-webinars--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-webinars--section {

				padding: var(--section-padding) 16px;

			}

			

			.ccl-webinars--hero-kicker {

				font-size: 0.75rem;

				padding: 8px 18px;

			}

			

			.ccl-webinars--kicker {

				font-size: 0.75rem;

			}

			

			.ccl-webinars--kicker::before,

			.ccl-webinars--kicker::after {

				display: none;

			}

			

			.ccl-webinars--card h3 {

				font-size: 1.5rem;

			}

			

			.ccl-webinars--benefit-icon,

			.ccl-webinars--topic-icon {

				width: 70px;

				height: 70px;

			}

			

			.ccl-webinars--benefit-icon i {

				font-size: 2rem;

			}

			

			.ccl-webinars--topic-icon i {

				font-size: 1.8rem;

			}

		}

		

		/* Touch Device Enhancements */

		@media (hover: none) and (pointer: coarse) {

			.ccl-webinars--card:hover,

			.ccl-webinars--benefit-card:hover,

			.ccl-webinars--topic-card:hover {

				transform: none;

			}

			

			.ccl-webinars--card:active,

			.ccl-webinars--benefit-card:active,

			.ccl-webinars--topic-card:active {

				transform: scale(0.98);

			}

		}

		/* ============================================

		   CCL WEBINAR SINGLE PAGE STYLES

		   ============================================ */

		

		.ccl-webinar--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--accent-purple: #8b5cf6;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--off-white: #f9fafb;

			

			/* Typography */

			--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', var(--font-primary);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Base Styles */

			font-family: var(--font-primary);

			color: var(--muted);

			line-height: 1.7;

			font-size: 16px;

			background-color: var(--off-white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-webinar--wrapper * {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		.ccl-webinar--wrapper main {

			overflow-x: hidden;

		}

		

		/* Typography */

		.ccl-webinar--wrapper h1,

		.ccl-webinar--wrapper h2,

		.ccl-webinar--wrapper h3,

		.ccl-webinar--wrapper h4 {

			font-family: var(--font-display);

			color: var(--ink);

			line-height: 1.2;

			font-weight: 800;

		}

		

		.ccl-webinar--wrapper p {

			margin-bottom: 1.25rem;

		}

		

		.ccl-webinar--wrapper p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-webinar--wrapper a {

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-webinar--wrapper a:hover {

			color: var(--cta-dark);

		}

		

		/* Container */

		.ccl-webinar--container {

			max-width: 1280px;

			margin: 0 auto;

			padding: 0 24px;

		}

		

		/* Breadcrumbs */

		.ccl-webinar--breadcrumbs {

			background: var(--white);

			padding: 20px 0;

			border-bottom: 1px solid var(--soft-border);

		}

		

		.ccl-webinar--breadcrumb-list {

			display: flex;

			align-items: center;

			gap: 12px;

			flex-wrap: wrap;

			list-style: none;

			font-size: 0.9rem;

		}

		

		.ccl-webinar--breadcrumb-item {

			display: flex;

			align-items: center;

			gap: 12px;

		}

		

		.ccl-webinar--breadcrumb-item a {

			color: var(--muted);

			transition: color 0.3s ease;

		}

		

		.ccl-webinar--breadcrumb-item a:hover {

			color: var(--primary-blue);

		}

		

		.ccl-webinar--breadcrumb-item.active {

			color: var(--ink);

			font-weight: 600;

		}

		

		.ccl-webinar--breadcrumb-separator {

			color: var(--soft-border);

		}

		

		/* Hero Section */

		.ccl-webinar--hero {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 60px 0 80px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-webinar--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-webinar-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-webinar-glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, -30px) scale(1.1); }

		}

		

		.ccl-webinar--hero-content {

			position: relative;

			z-index: 1;

		}

		

		.ccl-webinar--hero-badges {

			display: flex;

			gap: 10px;

			flex-wrap: wrap;

			margin-bottom: 24px;

			animation: fadeInUp 0.8s ease-out;

		}

		

		.ccl-webinar--hero-badge {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			font-size: 0.85rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			padding: 8px 18px;

			border-radius: 50px;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			color: var(--white);

		}

		

		.ccl-webinar--hero h1 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			color: var(--white);

			margin-bottom: 24px;

			animation: fadeInUp 0.8s ease-out 0.2s both;

		}

		

		.ccl-webinar--hero-meta {

			display: flex;

			align-items: center;

			gap: 24px;

			flex-wrap: wrap;

			color: rgba(255, 255, 255, 0.95);

			font-size: 1rem;

			margin-bottom: 28px;

			animation: fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-webinar--hero-meta-item {

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-webinar--hero-meta i {

			font-size: 1.1rem;

		}

		

		.ccl-webinar--hero-description {

			font-size: 1.2rem;

			line-height: 1.8;

			color: rgba(255, 255, 255, 0.95);

			max-width: 850px;

			animation: fadeInUp 0.8s ease-out 0.6s both;

		}

		

		@keyframes fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		/* Video Section */

		.ccl-webinar--video-section {

			padding: 60px 0;

			background: var(--white);

		}

		

		.ccl-webinar--video-player {

			position: relative;

			width: 100%;

			max-width: 1100px;

			margin: 0 auto;

			padding-bottom: 56.25%; /* 16:9 aspect ratio */

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

			border-radius: 16px;

			overflow: hidden;

			box-shadow: 0 20px 60px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-webinar--video-placeholder {

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 100%;

			display: flex;

			flex-direction: column;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.15), rgba(11, 92, 255, 0.08));

		}

		

		.ccl-webinar--video-play-btn {

			width: 100px;

			height: 100px;

			background: var(--white);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			cursor: pointer;

			transition: all 0.4s ease;

			box-shadow: 0 10px 40px rgba(29, 99, 255, 0.3);

			margin-bottom: 20px;

		}

		

		.ccl-webinar--video-play-btn:hover {

			transform: scale(1.1);

			box-shadow: 0 15px 50px rgba(29, 99, 255, 0.4);

		}

		

		.ccl-webinar--video-play-btn i {

			font-size: 2.5rem;

			color: var(--primary-blue);

			margin-left: 6px;

		}

		

		.ccl-webinar--video-placeholder-text {

			font-size: 1.1rem;

			color: var(--muted);

			font-weight: 600;

		}

		

		/* Content Grid */

		.ccl-webinar--content {

			padding: 80px 0;

			background: var(--off-white);

		}

		

		.ccl-webinar--content-grid {

			display: grid;

			grid-template-columns: 1fr;

			gap: 60px;

			align-items: start;

		}

		

		/* Main Content */

		.ccl-webinar--main-content {

			background: var(--white);

			border-radius: 24px;

			padding: var(--card-padding);

			border: 2px solid var(--soft-border);

		}

		

		.ccl-webinar--section-title {

			font-size: 2rem;

			margin-bottom: 24px;

			padding-bottom: 20px;

			border-bottom: 3px solid var(--primary-blue);

			display: inline-block;

		}

		

		.ccl-webinar--about {

			margin-bottom: 48px;

		}

		

		.ccl-webinar--about p {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--muted);

		}

		

		/* Learning Outcomes */

		.ccl-webinar--outcomes {

			margin-bottom: 48px;

		}

		

		.ccl-webinar--outcome-list {

			list-style: none;

			display: grid;

			gap: 16px;

		}

		

		.ccl-webinar--outcome-item {

			display: flex;

			align-items: start;

			gap: 16px;

			padding: 20px;

			background: var(--off-white);

			border-radius: 12px;

			transition: all 0.3s ease;

		}

		

		.ccl-webinar--outcome-item:hover {

			background: rgba(29, 99, 255, 0.05);

			transform: translateX(8px);

		}

		

		.ccl-webinar--outcome-icon {

			width: 40px;

			height: 40px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--accent-green), rgba(16, 185, 129, 0.8));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--white);

			flex-shrink: 0;

			font-size: 1.1rem;

		}

		

		.ccl-webinar--outcome-text {

			font-size: 1.05rem;

			line-height: 1.6;

			color: var(--ink);

			font-weight: 500;

		}

		

		/* Topics Covered */

		.ccl-webinar--topics {

			margin-bottom: 48px;

		}

		

		.ccl-webinar--topic-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

			gap: 12px;

			margin-top: 24px;

		}

		

		.ccl-webinar--topic-tag {

			display: flex;

			align-items: center;

			gap: 10px;

			padding: 14px 18px;

			background: rgba(29, 99, 255, 0.08);

			border: 2px solid rgba(29, 99, 255, 0.2);

			border-radius: 10px;

			color: var(--primary-blue);

			font-weight: 600;

			font-size: 0.95rem;

			transition: all 0.3s ease;

		}

		

		.ccl-webinar--topic-tag:hover {

			background: rgba(29, 99, 255, 0.15);

			border-color: var(--primary-blue);

			transform: translateY(-2px);

		}

		

		.ccl-webinar--topic-tag i {

			font-size: 0.9rem;

		}

		

		/* Presenter Section */

		.ccl-webinar--presenter {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.02));

			border-radius: 16px;

			padding: 32px;

			border: 2px solid rgba(29, 99, 255, 0.15);

		}

		

		.ccl-webinar--presenter-header {

			display: flex;

			align-items: center;

			gap: 20px;

			margin-bottom: 24px;

		}

		

		.ccl-webinar--presenter-avatar {

			width: 80px;

			height: 80px;

			border-radius: 50%;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--white);

			font-size: 2rem;

			font-weight: 700;

			flex-shrink: 0;

			box-shadow: 0 4px 20px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-webinar--presenter-info h3 {

			font-size: 1.5rem;

			margin-bottom: 6px;

		}

		

		.ccl-webinar--presenter-title {

			font-size: 1rem;

			color: var(--primary-blue);

			font-weight: 600;

		}

		

		.ccl-webinar--presenter-bio {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--muted);

		}

		

		/* Sidebar */

		.ccl-webinar--sidebar {

			position: sticky;

			top: 24px;

		}

		

		.ccl-webinar--info-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			margin-bottom: 24px;

		}

		

		.ccl-webinar--info-card h3 {

			font-size: 1.5rem;

			margin-bottom: 24px;

			padding-bottom: 16px;

			border-bottom: 2px solid var(--soft-border);

		}

		

		.ccl-webinar--info-item {

			display: flex;

			align-items: start;

			gap: 16px;

			padding: 16px 0;

			border-bottom: 1px solid var(--soft-border);

		}

		

		.ccl-webinar--info-item:last-child {

			border-bottom: none;

			padding-bottom: 0;

		}

		

		.ccl-webinar--info-item:first-child {

			padding-top: 0;

		}

		

		.ccl-webinar--info-icon {

			width: 44px;

			height: 44px;

			border-radius: 12px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.15), rgba(29, 99, 255, 0.05));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--primary-blue);

			flex-shrink: 0;

		}

		

		.ccl-webinar--info-content h4 {

			font-size: 0.85rem;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--muted);

			font-weight: 700;

			margin-bottom: 4px;

		}

		

		.ccl-webinar--info-content p {

			font-size: 1.05rem;

			font-weight: 600;

			color: var(--ink);

			margin: 0;

		}

		

		/* Resources Card */

		.ccl-webinar--resources {

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.1), rgba(255, 168, 38, 0.05));

			border-color: rgba(255, 168, 38, 0.3);

		}

		

		.ccl-webinar--resource-list {

			list-style: none;

			display: grid;

			gap: 12px;

		}

		

		.ccl-webinar--resource-link {

			display: flex;

			align-items: center;

			gap: 14px;

			padding: 14px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			transition: all 0.3s ease;

			color: var(--ink);

		}

		

		.ccl-webinar--resource-link:hover {

			border-color: var(--accent-gold);

			transform: translateX(4px);

			box-shadow: 0 4px 12px rgba(255, 168, 38, 0.15);

		}

		

		.ccl-webinar--resource-icon {

			width: 40px;

			height: 40px;

			border-radius: 8px;

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.15), rgba(255, 168, 38, 0.05));

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--accent-gold);

			flex-shrink: 0;

		}

		

		.ccl-webinar--resource-text {

			flex: 1;

		}

		

		.ccl-webinar--resource-text p {

			font-size: 0.95rem;

			font-weight: 600;

			margin: 0;

		}

		

		.ccl-webinar--resource-text span {

			font-size: 0.8rem;

			color: var(--muted);

		}

		

		/* Share Buttons */

		.ccl-webinar--share {

			background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(139, 92, 246, 0.05));

			border-color: rgba(139, 92, 246, 0.3);

		}

		

		.ccl-webinar--share-buttons {

			display: grid;

			grid-template-columns: repeat(2, 1fr);

			gap: 10px;

		}

		

		.ccl-webinar--share-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			padding: 12px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			font-weight: 600;

			font-size: 0.9rem;

			transition: all 0.3s ease;

			cursor: pointer;

		}

		

		.ccl-webinar--share-btn:hover {

			transform: translateY(-2px);

			box-shadow: 0 4px 12px rgba(139, 92, 246, 0.15);

		}

		

		.ccl-webinar--share-btn--linkedin {

			color: #0077b5;

			border-color: #0077b5;

		}

		

		.ccl-webinar--share-btn--linkedin:hover {

			background: #0077b5;

			color: var(--white);

		}

		

		.ccl-webinar--share-btn--twitter {

			color: #1da1f2;

			border-color: #1da1f2;

		}

		

		.ccl-webinar--share-btn--twitter:hover {

			background: #1da1f2;

			color: var(--white);

		}

		

		.ccl-webinar--share-btn--facebook {

			color: #1877f2;

			border-color: #1877f2;

		}

		

		.ccl-webinar--share-btn--facebook:hover {

			background: #1877f2;

			color: var(--white);

		}

		

		.ccl-webinar--share-btn--email {

			color: var(--muted);

			border-color: var(--muted);

		}

		

		.ccl-webinar--share-btn--email:hover {

			background: var(--muted);

			color: var(--white);

		}

		

		/* Related Webinars */

		.ccl-webinar--related {

			padding: 80px 0;

			background: var(--white);

		}

		

		.ccl-webinar--related-header {

			text-align: center;

			max-width: 750px;

			margin: 0 auto 60px;

		}

		

		.ccl-webinar--related-header h2 {

			font-size: clamp(2rem, 3vw, 2.75rem);

			margin-bottom: 16px;

		}

		

		.ccl-webinar--related-header p {

			font-size: 1.15rem;

			color: var(--muted);

		}

		

		.ccl-webinar--related-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));

			gap: 32px;

		}

		

		.ccl-webinar--related-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			padding: 28px;

			transition: all 0.4s ease;

		}

		

		.ccl-webinar--related-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.12);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-webinar--related-card-video {

			position: relative;

			width: 100%;

			padding-bottom: 56.25%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

			border-radius: 12px;

			margin-bottom: 20px;

			overflow: hidden;

		}

		

		.ccl-webinar--related-card-video-placeholder {

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 100%;

			display: flex;

			align-items: center;

			justify-content: center;

		}

		

		.ccl-webinar--related-card-video-icon {

			width: 60px;

			height: 60px;

			background: var(--white);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			box-shadow: 0 4px 20px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-webinar--related-card-video-icon i {

			font-size: 1.5rem;

			color: var(--primary-blue);

			margin-left: 3px;

		}

		

		.ccl-webinar--related-card-badge {

			display: inline-flex;

			align-items: center;

			gap: 6px;

			font-size: 0.75rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			padding: 6px 12px;

			border-radius: 50px;

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

			margin-bottom: 12px;

		}

		

		.ccl-webinar--related-card h3 {

			font-size: 1.35rem;

			margin-bottom: 12px;

			color: var(--ink);

		}

		

		.ccl-webinar--related-card-meta {

			display: flex;

			align-items: center;

			gap: 16px;

			font-size: 0.85rem;

			color: var(--muted);

			margin-bottom: 16px;

		}

		

		.ccl-webinar--related-card-meta i {

			color: var(--primary-blue);

		}

		

		.ccl-webinar--related-card-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			font-weight: 600;

			color: var(--primary-blue);

			transition: gap 0.3s ease;

		}

		

		.ccl-webinar--related-card:hover .ccl-webinar--related-card-link {

			gap: 12px;

		}

		

		/* CTA Section */

		.ccl-webinar--cta {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 80px 24px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-webinar--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -20%;

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-webinar--cta-content {

			position: relative;

			z-index: 1;

			text-align: center;

			max-width: 850px;

			margin: 0 auto;

		}

		

		.ccl-webinar--cta h2 {

			font-size: clamp(2.25rem, 4vw, 3.25rem);

			color: var(--white);

			margin-bottom: 20px;

		}

		

		.ccl-webinar--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.95);

			margin-bottom: 0;

			line-height: 1.7;

		}

		

		.ccl-webinar--cta-buttons {

			display: flex;

			justify-content: center;

			gap: 20px;

			flex-wrap: wrap;

			margin-top: 32px;

		}

		

		/* Button Styles */

		.ccl-webinar--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			font-family: var(--font-primary);

			font-size: 1rem;

			font-weight: 600;

			padding: 16px 32px;

			border-radius: 8px;

			border: none;

			cursor: pointer;

			transition: all 0.3s ease;

			text-decoration: none;

			white-space: nowrap;

		}

		

		.ccl-webinar--btn span {

			display: inline-block;

		}

		

		.ccl-webinar--btn i {

			display: inline-flex;

			align-items: center;

			font-size: 1rem;

			transition: transform 0.3s ease;

		}

		

		.ccl-webinar--btn:hover i {

			transform: translateX(3px);

		}

		

		.ccl-webinar--btn--primary {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 4px 12px rgba(255, 255, 255, 0.2);

		}

		

		.ccl-webinar--btn--primary:hover {

			background: var(--off-white);

			color: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(255, 255, 255, 0.4);

		}

		

		.ccl-webinar--btn--secondary {

			background: transparent;

			color: var(--white);

			border: 2px solid var(--white);

			box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-webinar--btn--secondary:hover {

			background: var(--white);

			color: var(--primary-blue);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(255, 255, 255, 0.3);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-webinar--content-grid {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-webinar--sidebar {

				position: static;

			}

			

			.ccl-webinar--related-grid {

				grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			}

		}

		

		@media (max-width: 768px) {

			.ccl-webinar--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

			}

			

			.ccl-webinar--hero {

				padding: 40px 0 60px;

			}

			

			.ccl-webinar--hero-meta {

				flex-direction: column;

				align-items: start;

				gap: 12px;

			}

			

			.ccl-webinar--content {

				padding: 60px 0;

			}

			

			.ccl-webinar--topic-grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-webinar--share-buttons {

				grid-template-columns: 1fr;

			}

			

			.ccl-webinar--related-grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-webinar--cta-buttons {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-webinar--btn {

				width: 100%;

				justify-content: center;

				min-height: 56px;

			}

		}

		

		@media (max-width: 640px) {

			.ccl-webinar--cta h2 {

				font-size: 2rem;

			}

			

			.ccl-webinar--cta p {

				font-size: 1.1rem;

			}

			

			.ccl-webinar--btn {

				padding: 14px 24px;

				font-size: 0.95rem;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-webinar--wrapper {

				--card-padding: 24px;

			}

			

			.ccl-webinar--hero-badges {

				flex-direction: column;

				align-items: start;

			}

			

			.ccl-webinar--video-play-btn {

				width: 80px;

				height: 80px;

			}

			

			.ccl-webinar--video-play-btn i {

				font-size: 2rem;

			}

			

			.ccl-webinar--presenter-header {

				flex-direction: column;

				text-align: center;

			}

		}

	.ccl-media--wrapper {

	  /* CSS Variables */

	  --primary-blue: #1d63ff;

	  --cta-blue: #0b5cff;

	  --cta-dark: #0846c1;

	  --accent-green: #10b981;

	  --accent-gold: #ffa826;

	  --ink: #1e293b;

	  --muted: #64748b;

	  --soft-border: #e5e7eb;

	  --white: #ffffff;

	  --section-padding: 100px;

	  --card-padding: 36px;

	  --border-radius: 24px;

	  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

	  

	  /* Base Styles */

	  margin: 0;

	  padding: 0;

	  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	  line-height: 1.6;

	  color: var(--ink);

	  background: var(--white);

	  overflow-x: hidden;

	}

	

	.ccl-media--wrapper * {

	  box-sizing: border-box;

	  margin: 0;

	  padding: 0;

	}

	

	/* Hero Section */

	.ccl-media--hero {

	  position: relative;

	  padding: 140px 24px 100px;

	  background: linear-gradient(135deg, #1d63ff 0%, #0846c1 100%);

	  text-align: center;

	  overflow: hidden;

	}

	

	.ccl-media--hero::before {

	  content: '';

	  position: absolute;

	  top: -50%;

	  left: -50%;

	  width: 200%;

	  height: 200%;

	  background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

	  animation: ccl-media--glow 8s ease-in-out infinite;

	}

	

	@keyframes ccl-media--glow {

	  0%, 100% { transform: translate(0, 0); }

	  50% { transform: translate(30px, 30px); }

	}

	

	.ccl-media--hero-content {

	  position: relative;

	  z-index: 1;

	  max-width: 950px;

	  margin: 0 auto;

	}

	

	.ccl-media--kicker {

	  display: inline-flex;

	  align-items: center;

	  gap: 12px;

	  font-size: 0.95rem;

	  font-weight: 600;

	  letter-spacing: 0.5px;

	  color: rgba(255, 255, 255, 0.9);

	  text-transform: uppercase;

	  margin-bottom: 24px;

	  animation: ccl-media--fadeInDown 0.8s ease-out;

	}

	

	.ccl-media--kicker::before,

	.ccl-media--kicker::after {

	  content: '';

	  width: 40px;

	  height: 2px;

	  background: rgba(255, 255, 255, 0.4);

	}

	

	@keyframes ccl-media--fadeInDown {

	  from {

		opacity: 0;

		transform: translateY(-20px);

	  }

	  to {

		opacity: 1;

		transform: translateY(0);

	  }

	}

	

	.ccl-media--hero-title {

	  font-family: 'Inter Tight', sans-serif;

	  font-size: clamp(2.5rem, 6vw, 4.5rem);

	  font-weight: 900;

	  line-height: 1.1;

	  color: var(--white);

	  margin-bottom: 28px;

	  animation: ccl-media--fadeInUp 0.8s ease-out 0.2s both;

	}

	

	@keyframes ccl-media--fadeInUp {

	  from {

		opacity: 0;

		transform: translateY(30px);

	  }

	  to {

		opacity: 1;

		transform: translateY(0);

	  }

	}

	

	.ccl-media--hero-lead {

	  font-size: clamp(1.1rem, 2vw, 1.3rem);

	  line-height: 1.7;

	  color: rgba(255, 255, 255, 0.95);

	  max-width: 750px;

	  margin: 0 auto 32px;

	  animation: ccl-media--fadeInUp 0.8s ease-out 0.4s both;

	}

	

	/* Container & Section Headers */

	.ccl-media--container {

	  max-width: 1200px;

	  margin: 0 auto;

	}

	

	.ccl-media--section-header {

	  text-align: center;

	  max-width: 850px;

	  margin: 0 auto 60px;

	}

	

	.ccl-media--section-kicker {

	  display: inline-flex;

	  align-items: center;

	  gap: 12px;

	  font-size: 0.9rem;

	  font-weight: 600;

	  letter-spacing: 0.5px;

	  color: var(--primary-blue);

	  text-transform: uppercase;

	  margin-bottom: 16px;

	}

	

	.ccl-media--section-kicker::before,

	.ccl-media--section-kicker::after {

	  content: '';

	  width: 30px;

	  height: 2px;

	  background: var(--primary-blue);

	}

	

	.ccl-media--section-title {

	  font-family: 'Inter Tight', sans-serif;

	  font-size: clamp(2.25rem, 4vw, 3.5rem);

	  font-weight: 900;

	  line-height: 1.2;

	  color: var(--ink);

	  margin-bottom: 20px;

	}

	

	.ccl-media--section-title mark {

	  background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

	  color: inherit;

	  padding: 0 4px;

	}

	

	.ccl-media--section-lead {

	  font-size: 1.15rem;

	  line-height: 1.7;

	  color: var(--muted);

	}

	

	/* Statements Section */

	.ccl-media--statements-section {

	  padding: var(--section-padding) 24px;

	  background: var(--white);

	}

	

	.ccl-media--info-banner {

	  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);

	  border: 2px solid #bae6fd;

	  border-radius: 16px;

	  padding: 24px 32px;

	  margin-bottom: 50px;

	  display: flex;

	  align-items: center;

	  gap: 20px;

	}

	

	.ccl-media--info-banner i {

	  font-size: 2rem;

	  color: var(--primary-blue);

	  flex-shrink: 0;

	}

	

	.ccl-media--info-banner p {

	  margin: 0;

	  font-size: 1.05rem;

	  color: var(--ink);

	  line-height: 1.6;

	}

	

	.ccl-media--info-banner a {

	  color: var(--primary-blue);

	  font-weight: 600;

	  text-decoration: none;

	  transition: var(--transition);

	}

	

	.ccl-media--info-banner a:hover {

	  color: var(--cta-dark);

	  text-decoration: underline;

	}

	

	/* Filter Bar */

	.ccl-media--filter-bar {

	  display: flex;

	  flex-wrap: wrap;

	  gap: 16px;

	  justify-content: center;

	  margin-bottom: 50px;

	  padding: 32px 24px;

	  background: #f8fafc;

	  border-radius: 16px;

	}

	

	.ccl-media--filter-btn {

	  display: inline-flex;

	  align-items: center;

	  gap: 10px;

	  padding: 14px 28px;

	  background: var(--white);

	  border: 2px solid var(--soft-border);

	  border-radius: 50px;

	  font-family: 'Inter', sans-serif;

	  font-size: 0.95rem;

	  font-weight: 600;

	  color: var(--ink);

	  cursor: pointer;

	  transition: var(--transition);

	  outline: none;

	}

	

	.ccl-media--filter-btn i {

	  font-size: 1.1rem;

	  transition: var(--transition);

	}

	

	.ccl-media--filter-btn:hover {

	  border-color: var(--primary-blue);

	  color: var(--primary-blue);

	  transform: translateY(-2px);

	  box-shadow: 0 4px 12px rgba(29, 99, 255, 0.15);

	}

	

	.ccl-media--filter-btn:hover i {

	  transform: scale(1.1);

	}

	

	.ccl-media--filter-active {

	  background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

	  border-color: var(--primary-blue);

	  color: var(--white);

	  box-shadow: 0 4px 12px rgba(29, 99, 255, 0.25);

	}

	

	.ccl-media--filter-active:hover {

	  background: linear-gradient(135deg, var(--cta-blue), var(--cta-dark));

	  color: var(--white);

	}

	

	/* Blog Grid */

	.ccl-media--blog-grid {

	  display: grid;

	  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));

	  gap: 32px;

	}

	

	.ccl-media--blog-card {

	  background: var(--white);

	  border: 2px solid var(--soft-border);

	  border-radius: var(--border-radius);

	  padding: 0;

	  overflow: hidden;

	  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

	  display: flex;

	  flex-direction: column;

	  opacity: 1;

	  transform: scale(1);

	}

	

	.ccl-media--blog-card.ccl-media--hidden {

	  opacity: 0;

	  transform: scale(0.9);

	  pointer-events: none;

	  position: absolute;

	  visibility: hidden;

	}

	

	.ccl-media--blog-card:hover {

	  transform: translateY(-8px);

	  box-shadow: 0 16px 40px rgba(29, 99, 255, 0.12);

	  border-color: var(--primary-blue);

	}

	

	/* Blog Card Header */

	.ccl-media--blog-header {

	  padding: 32px 32px 24px;

	  background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);

	  border-bottom: 2px solid var(--soft-border);

	  display: flex;

	  align-items: center;

	  gap: 20px;

	}

	

	.ccl-media--blog-icon {

	  width: 70px;

	  height: 70px;

	  border-radius: 16px;

	  display: flex;

	  align-items: center;

	  justify-content: center;

	  font-size: 2rem;

	  color: var(--white);

	  flex-shrink: 0;

	  transition: var(--transition);

	}

	

	.ccl-media--blog-card:hover .ccl-media--blog-icon {

	  transform: scale(1.05) rotate(-5deg);

	}

	

	.ccl-media--blog-meta {

	  display: flex;

	  flex-direction: column;

	  gap: 8px;

	  flex: 1;

	}

	

	.ccl-media--blog-category {

	  display: inline-block;

	  padding: 6px 14px;

	  border-radius: 20px;

	  font-size: 0.85rem;

	  font-weight: 700;

	  text-transform: uppercase;

	  letter-spacing: 0.5px;

	  width: fit-content;

	}

	

	.ccl-media--cat-legal {

	  background: rgba(29, 99, 255, 0.1);

	  color: var(--primary-blue);

	}

	

	.ccl-media--cat-aviation {

	  background: rgba(8, 70, 193, 0.1);

	  color: var(--cta-dark);

	}

	

	.ccl-media--cat-travel {

	  background: rgba(16, 185, 129, 0.1);

	  color: var(--accent-green);

	}

	

	.ccl-media--blog-date {

	  display: flex;

	  align-items: center;

	  gap: 6px;

	  font-size: 0.9rem;

	  color: var(--muted);

	  font-weight: 500;

	}

	

	.ccl-media--blog-date i {

	  font-size: 0.85rem;

	}

	

	/* Blog Card Content */

	.ccl-media--blog-title {

	  font-family: 'Inter Tight', sans-serif;

	  font-size: 1.5rem;

	  font-weight: 800;

	  line-height: 1.3;

	  color: var(--ink);

	  margin: 0;

	  padding: 24px 32px 16px;

	}

	

	.ccl-media--blog-excerpt {

	  font-size: 1.05rem;

	  line-height: 1.7;

	  color: var(--muted);

	  margin: 0;

	  padding: 0 32px 20px;

	}

	

	.ccl-media--blog-author {

	  display: flex;

	  align-items: center;

	  gap: 8px;

	  padding: 0 32px 16px;

	  font-size: 0.95rem;

	  font-weight: 600;

	  color: var(--ink);

	  font-style: italic;

	}

	

	.ccl-media--blog-author i {

	  color: var(--primary-blue);

	  font-size: 1rem;

	}

	

	.ccl-media--blog-link {

	  display: inline-flex;

	  align-items: center;

	  justify-content: space-between;

	  width: 100%;

	  padding: 20px 32px;

	  background: #f8fafc;

	  border-top: 2px solid var(--soft-border);

	  color: var(--primary-blue);

	  font-weight: 700;

	  text-decoration: none;

	  transition: var(--transition);

	  margin-top: auto;

	}

	

	.ccl-media--blog-link i {

	  font-size: 1.1rem;

	  transition: var(--transition);

	}

	

	.ccl-media--blog-link:hover {

	  background: var(--primary-blue);

	  color: var(--white);

	  padding-left: 40px;

	}

	

	.ccl-media--blog-link:hover i {

	  transform: translateX(6px);

	}

	

	/* Contact Highlight Card (in grid) */

	.ccl-media--contact-highlight {

	  border: 2px solid var(--primary-blue);

	  box-shadow: 0 8px 24px rgba(29, 99, 255, 0.15);

	}

	

	.ccl-media--contact-highlight:hover {

	  transform: translateY(-8px);

	  box-shadow: 0 16px 40px rgba(29, 99, 255, 0.25);

	  border-color: var(--cta-dark);

	}

	

	.ccl-media--contact-subtitle {

	  font-size: 1rem;

	  font-weight: 600;

	  color: var(--primary-blue);

	  margin: 0 0 16px 0;

	  padding: 0;

	}

	

	.ccl-media--contact-description {

	  font-size: 1rem;

	  line-height: 1.6;

	  color: var(--muted);

	  margin: 0 0 24px 0;

	  padding: 0;

	}

	

	.ccl-media--contact-inline-details {

	  display: flex;

	  flex-direction: column;

	  gap: 12px;

	}

	

	.ccl-media--contact-inline-item {

	  display: flex;

	  align-items: center;

	  gap: 12px;

	  padding: 12px 16px;

	  background: #f8fafc;

	  border-radius: 10px;

	  transition: var(--transition);

	}

	

	.ccl-media--contact-inline-item:hover {

	  background: #f1f5f9;

	  transform: translateX(4px);

	}

	

	.ccl-media--contact-inline-item i {

	  font-size: 1.1rem;

	  color: var(--primary-blue);

	  width: 20px;

	  text-align: center;

	  flex-shrink: 0;

	}

	

	.ccl-media--contact-inline-item a {

	  color: var(--ink);

	  text-decoration: none;

	  font-weight: 500;

	  font-size: 0.95rem;

	  transition: var(--transition);

	  word-break: break-word;

	}

	

	.ccl-media--contact-inline-item a:hover {

	  color: var(--primary-blue);

	}

	

	/* Scroll Reveal Animation */

	.ccl-media--scroll-reveal {

	  opacity: 0;

	  transform: translateY(40px);

	  transition: opacity 0.8s ease, transform 0.8s ease;

	}

	

	.ccl-media--scroll-reveal.ccl-media--revealed {

	  opacity: 1;

	  transform: translateY(0);

	}

	

	/* Responsive Design */

	@media (max-width: 1024px) {

	  .ccl-media--wrapper {

		--section-padding: 80px;

	  }

	  

	  .ccl-media--blog-grid {

		grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

		gap: 28px;

	  }

	  

	  .ccl-media--filter-bar {

		gap: 12px;

	  }

	}

	

	@media (max-width: 768px) {

	  .ccl-media--wrapper {

		--section-padding: 60px;

		--card-padding: 28px;

	  }

	  

	  .ccl-media--hero {

		padding: 100px 20px 80px;

	  }

	  

	  .ccl-media--blog-grid {

		grid-template-columns: 1fr;

		gap: 24px;

	  }

	  

	  .ccl-media--filter-bar {

		flex-direction: column;

		gap: 12px;

	  }

	  

	  .ccl-media--filter-btn {

		width: 100%;

		justify-content: center;

	  }

	  

	  .ccl-media--info-banner {

		flex-direction: column;

		text-align: center;

		padding: 20px;

	  }

	  

	  .ccl-media--section-kicker::before,

	  .ccl-media--section-kicker::after {

		width: 20px;

	  }

	  

	  .ccl-media--blog-header {

		padding: 24px 24px 20px;

	  }

	  

	  .ccl-media--blog-title {

		padding: 20px 24px 16px;

		font-size: 1.35rem;

	  }

	  

	  .ccl-media--blog-excerpt,

	  .ccl-media--blog-author {

		padding-left: 24px;

		padding-right: 24px;

	  }

	  

	  .ccl-media--blog-link {

		padding: 18px 24px;

	  }

	}

	

	@media (max-width: 480px) {

	  .ccl-media--wrapper {

		--section-padding: 50px;

	  }

	  

	  .ccl-media--hero {

		padding: 80px 16px 60px;

	  }

	  

	  .ccl-media--statements-section {

		padding: var(--section-padding) 16px;

	  }

	  

	  .ccl-media--kicker::before,

	  .ccl-media--kicker::after {

		width: 20px;

	  }

	  

	  .ccl-media--blog-icon {

		width: 60px;

		height: 60px;

		font-size: 1.75rem;

	  }

	  

	  .ccl-media--filter-bar {

		padding: 20px 16px;

	  }

	  

	  .ccl-media--filter-btn {

		padding: 12px 20px;

		font-size: 0.9rem;

	  }

	  

	  .ccl-media--blog-header {

		flex-direction: column;

		text-align: center;

		padding: 24px 20px;

		gap: 16px;

	  }

	  

	  .ccl-media--blog-meta {

		align-items: center;

	  }

	  

	  .ccl-media--blog-title {

		padding: 20px 20px 12px;

		font-size: 1.25rem;

	  }

	  

	  .ccl-media--blog-excerpt {

		padding: 0 20px 16px;

		font-size: 1rem;

	  }

	  

	  .ccl-media--blog-author {

		padding: 0 20px 12px;

		font-size: 0.9rem;

	  }

	  

	  .ccl-media--blog-link {

		padding: 16px 20px;

		font-size: 0.9rem;

	  }

	  

	  .ccl-media--contact-inline-item {

		padding: 10px 14px;

	  }

	  

	  .ccl-media--contact-inline-item a {

		font-size: 0.9rem;

	  }

	}

	

	/* Smooth Scroll */

	.ccl-media--wrapper {

	  scroll-behavior: smooth;

	}

		/* ============================================

		   CARTER CAPNER LAW - AVIATION ARTICLE 2009

		   Unique Prefix: ccl-aviation09--

		   ============================================ */

		

		.ccl-aviation09--wrapper {

			/* CSS Variables */

			--color-primary-blue: #1d63ff;

			--color-cta-blue: #0b5cff;

			--color-cta-dark: #0846c1;

			--color-accent-green: #10b981;

			--color-accent-gold: #ffa826;

			--color-ink: #1e293b;

			--color-muted: #64748b;

			--color-soft-border: #e5e7eb;

			--color-white: #ffffff;

			--color-bg-light: #f8fafc;

			

			/* Typography */

			--font-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', var(--font-base);

			

			/* Spacing */

			--section-padding: 100px;

			--container-max: 1200px;

			--content-max: 850px;

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-base);

			font-size: 16px;

			line-height: 1.7;

			color: var(--color-ink);

			background: var(--color-white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-aviation09--wrapper * {

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}

		

		.ccl-aviation09--wrapper main {

			overflow-x: hidden;

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		

		.ccl-aviation09--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 140px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-aviation09--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -50%;

			width: 100%;

			height: 100%;

			background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

			animation: ccl-aviation09-pulse 8s ease-in-out infinite;

		}

		

		.ccl-aviation09--hero::after {

			content: '';

			position: absolute;

			bottom: -50%;

			left: -50%;

			width: 100%;

			height: 100%;

			background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);

			animation: ccl-aviation09-pulse 10s ease-in-out infinite reverse;

		}

		

		@keyframes ccl-aviation09-pulse {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(10%, 10%) scale(1.1); }

		}

		

		.ccl-aviation09--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-aviation09--kicker {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 8px 20px;

			background: rgba(255, 255, 255, 0.15);

			backdrop-filter: blur(10px);

			border-radius: 50px;

			color: var(--color-white);

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 24px;

			animation: ccl-aviation09-fadeInDown 0.8s ease-out;

		}

		

		.ccl-aviation09--kicker i {

			font-size: 1rem;

		}

		

		@keyframes ccl-aviation09-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-aviation09--hero h1 {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4rem);

			font-weight: 900;

			color: var(--color-white);

			line-height: 1.15;

			margin-bottom: 24px;

			animation: ccl-aviation09-fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-aviation09-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-aviation09--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.3rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			max-width: 750px;

			margin: 0 auto 32px;

			animation: ccl-aviation09-fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-aviation09--hero-meta {

			display: flex;

			align-items: center;

			justify-content: center;

			flex-wrap: wrap;

			gap: 24px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 1rem;

			animation: ccl-aviation09-fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-aviation09--meta-item {

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-aviation09--meta-item i {

			opacity: 0.8;

		}

		

		/* ============================================

		   ARTICLE CONTENT WITH SIDEBAR LAYOUT

		   ============================================ */

		

		.ccl-aviation09--article {

			padding: var(--section-padding) 24px;

			background: var(--color-white);

		}

		

		.ccl-aviation09--article-layout {

			max-width: var(--container-max);

			margin: 0 auto;

			display: grid;

			grid-template-columns: 1fr 380px;

			gap: 60px;

			align-items: start;

		}

		

		.ccl-aviation09--article-main {

			max-width: 750px;

		}

		

		.ccl-aviation09--article-header {

			text-align: center;

			margin-bottom: 60px;

			padding-bottom: 40px;

			border-bottom: 2px solid var(--color-soft-border);

		}

		

		.ccl-aviation09--article-source {

			display: inline-block;

			padding: 10px 20px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(16, 185, 129, 0.1));

			border-left: 4px solid var(--color-primary-blue);

			border-radius: 8px;

			color: var(--color-ink);

			font-size: 1rem;

			font-weight: 600;

			margin-bottom: 16px;

		}

		

		.ccl-aviation09--article-intro {

			font-size: 1.15rem;

			color: var(--color-muted);

			line-height: 1.8;

			font-style: italic;

		}

		

		.ccl-aviation09--content p {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--color-ink);

			margin-bottom: 28px;

		}

		

		.ccl-aviation09--content p:first-child {

			font-size: 1.2rem;

			font-weight: 500;

			color: var(--color-ink);

		}

		

		.ccl-aviation09--content strong {

			color: var(--color-ink);

			font-weight: 700;

		}

		

		.ccl-aviation09--content em {

			color: var(--color-primary-blue);

			font-style: italic;

		}

		

		/* Pull Quote */

		.ccl-aviation09--pullquote {

			position: relative;

			margin: 48px 0;

			padding: 32px 40px 32px 80px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(16, 185, 129, 0.05));

			border-left: 5px solid var(--color-primary-blue);

			border-radius: 12px;

		}

		

		.ccl-aviation09--pullquote::before {

			content: '\f10d';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 24px;

			top: 32px;

			font-size: 2rem;

			color: var(--color-primary-blue);

			opacity: 0.3;

		}

		

		.ccl-aviation09--pullquote p {

			font-size: 1.3rem;

			font-weight: 600;

			line-height: 1.6;

			color: var(--color-ink);

			margin: 0;

		}

		

		/* Footnote References */

		.ccl-aviation09--content sup {

			font-size: 0.75rem;

			color: var(--color-primary-blue);

			font-weight: 600;

		}

		

		/* Section Divider */

		.ccl-aviation09--divider {

			width: 100px;

			height: 4px;

			background: linear-gradient(90deg, var(--color-primary-blue), var(--color-accent-green));

			border-radius: 2px;

			margin: 60px auto;

		}

		

		/* ============================================

		   SIDEBAR

		   ============================================ */

		

		.ccl-aviation09--sidebar {

			position: relative;

		}

		

		.ccl-aviation09--sidebar-sticky {

			position: sticky;

			top: 24px;

		}

		

		.ccl-aviation09--sidebar-card {

			background: var(--color-white);

			border: 2px solid var(--color-soft-border);

			border-radius: 20px;

			padding: 32px;

			position: relative;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);

		}

		

		.ccl-aviation09--sidebar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--color-primary-blue), var(--color-accent-green));

		}

		

		.ccl-aviation09--sidebar-header {

			text-align: center;

			margin-bottom: 28px;

			padding-bottom: 24px;

			border-bottom: 2px solid var(--color-soft-border);

		}

		

		.ccl-aviation09--sidebar-header h3 {

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 800;

			color: var(--color-ink);

			margin-bottom: 8px;

		}

		

		.ccl-aviation09--sidebar-header p {

			font-size: 0.95rem;

			color: var(--color-muted);

			line-height: 1.5;

		}

		

		.ccl-aviation09--sidebar-author {

			display: flex;

			align-items: center;

			gap: 16px;

			margin-bottom: 24px;

		}

		

		.ccl-aviation09--sidebar-avatar {

			width: 70px;

			height: 70px;

			background: linear-gradient(135deg, var(--color-primary-blue), var(--color-cta-blue));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-family: var(--font-display);

			font-size: 1.75rem;

			font-weight: 900;

			color: var(--color-white);

			flex-shrink: 0;

		}

		

		.ccl-aviation09--sidebar-info h4 {

			font-family: var(--font-display);

			font-size: 1.35rem;

			font-weight: 800;

			color: var(--color-ink);

			margin-bottom: 4px;

			line-height: 1.3;

		}

		

		.ccl-aviation09--sidebar-title {

			font-size: 0.95rem;

			color: var(--color-primary-blue);

			font-weight: 600;

			line-height: 1.4;

		}

		

		.ccl-aviation09--sidebar-contact {

			display: flex;

			flex-direction: column;

			gap: 16px;

			margin-bottom: 24px;

		}

		

		.ccl-aviation09--sidebar-contact-item {

			display: flex;

			align-items: flex-start;

			gap: 12px;

			padding: 12px;

			background: var(--color-bg-light);

			border-radius: 10px;

			transition: background 0.3s ease;

		}

		

		.ccl-aviation09--sidebar-contact-item:hover {

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-aviation09--sidebar-contact-item i {

			width: 24px;

			height: 24px;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--color-primary-blue);

			font-size: 1.1rem;

			margin-top: 2px;

		}

		

		.ccl-aviation09--contact-label {

			font-size: 0.8rem;

			color: var(--color-muted);

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 2px;

		}

		

		.ccl-aviation09--sidebar-contact-item a {

			color: var(--color-ink);

			text-decoration: none;

			font-size: 1rem;

			font-weight: 600;

			transition: color 0.3s ease;

			word-break: break-word;

		}

		

		.ccl-aviation09--sidebar-contact-item a:hover {

			color: var(--color-primary-blue);

		}

		

		.ccl-aviation09--sidebar-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			width: 100%;

			padding: 14px 24px;

			background: var(--color-cta-blue);

			color: var(--color-white);

			font-family: var(--font-base);

			font-size: 1rem;

			font-weight: 700;

			text-decoration: none;

			border-radius: 10px;

			border: 2px solid var(--color-cta-blue);

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviation09--sidebar-btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-aviation09--sidebar-btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-aviation09--sidebar-btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-aviation09--sidebar-btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-aviation09--sidebar-btn:hover {

			background: var(--color-cta-dark);

			border-color: var(--color-cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-aviation09--sidebar-btn:hover i {

			transform: translateX(5px);

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		   ============================================ */

		

		.ccl-aviation09--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-aviation09--scroll-reveal.ccl-aviation09--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		

		@media (max-width: 1024px) {

			.ccl-aviation09--wrapper {

				--section-padding: 80px;

			}

			

			.ccl-aviation09--article-layout {

				grid-template-columns: 1fr 320px;

				gap: 40px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-aviation09--wrapper {

				--section-padding: 60px;

			}

			

			.ccl-aviation09--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-aviation09--kicker {

				font-size: 0.85rem;

				padding: 6px 16px;

			}

			

			.ccl-aviation09--hero-meta {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-aviation09--article {

				padding: 60px 20px;

			}

			

			.ccl-aviation09--article-layout {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-aviation09--sidebar {

				order: 2;

			}

			

			.ccl-aviation09--sidebar-sticky {

				position: relative;

				top: 0;

			}

			

			.ccl-aviation09--pullquote {

				padding: 24px 20px 24px 60px;

			}

			

			.ccl-aviation09--pullquote::before {

				left: 16px;

				font-size: 1.5rem;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-aviation09--wrapper {

				font-size: 15px;

			}

			

			.ccl-aviation09--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-aviation09--content p {

				font-size: 1.05rem;

			}

			

			.ccl-aviation09--pullquote p {

				font-size: 1.15rem;

			}

			

			.ccl-aviation09--sidebar-card {

				padding: 24px;

			}

			

			.ccl-aviation09--sidebar-author {

				flex-direction: column;

				text-align: center;

			}

			

			.ccl-aviation09--sidebar-avatar {

				width: 60px;

				height: 60px;

				font-size: 1.5rem;

			}

		}

		.ccl-aviationfeed--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--background-light: #f8fafc;

			

			/* Typography */

			--font-inter: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-inter-tight: 'Inter Tight', var(--font-inter);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 32px;

			--grid-gap: 32px;

			

			/* Transitions */

			--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Shadows */

			--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);

			--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);

			--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

			--shadow-xl: 0 12px 40px rgba(0, 0, 0, 0.15);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-inter);

			color: var(--ink);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			scroll-behavior: smooth;

		}

		

		.ccl-aviationfeed--wrapper main {

			background: var(--white);

			overflow-x: hidden;

		}

		

		.ccl-aviationfeed--wrapper section {

			position: relative;

		}

		

		.ccl-aviationfeed--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		/* Hero Section */

		.ccl-aviationfeed--hero {

			position: relative;

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 50%, #0f172a 100%);

			padding: 160px 24px 140px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-aviationfeed--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: 

				radial-gradient(circle at 20% 50%, rgba(29, 99, 255, 0.15) 0%, transparent 50%),

				radial-gradient(circle at 80% 80%, rgba(11, 92, 255, 0.1) 0%, transparent 50%);

			animation: ccl-aviationfeed--pulse 8s ease-in-out infinite;

		}

		

		@keyframes ccl-aviationfeed--pulse {

			0%, 100% { opacity: 0.5; transform: scale(1); }

			50% { opacity: 1; transform: scale(1.05); }

		}

		

		.ccl-aviationfeed--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-aviationfeed--kicker {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: rgba(29, 99, 255, 0.15);

			backdrop-filter: blur(12px);

			border: 1px solid rgba(29, 99, 255, 0.3);

			padding: 12px 24px;

			border-radius: 100px;

			color: rgba(255, 255, 255, 0.95);

			font-size: 0.875rem;

			font-weight: 700;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 32px;

			animation: ccl-aviationfeed--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-aviationfeed--fadeInDown {

			from { opacity: 0; transform: translateY(-30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-aviationfeed--kicker i {

			font-size: 1rem;

			color: var(--primary-blue);

		}

		

		.ccl-aviationfeed--hero h1 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.5rem, 5vw, 4.75rem);

			color: var(--white);

			margin: 0 0 28px;

			line-height: 1.05;

			letter-spacing: -0.02em;

			animation: ccl-aviationfeed--fadeInUp 0.8s ease-out 0.2s backwards;

		}

		

		@keyframes ccl-aviationfeed--fadeInUp {

			from { opacity: 0; transform: translateY(30px); }

			to { opacity: 1; transform: translateY(0); }

		}

		

		.ccl-aviationfeed--hero-lead {

			font-size: clamp(1.15rem, 2vw, 1.4rem);

			color: rgba(255, 255, 255, 0.85);

			max-width: 750px;

			margin: 0 auto 40px;

			line-height: 1.6;

			font-weight: 400;

			animation: ccl-aviationfeed--fadeInUp 0.8s ease-out 0.4s backwards;

		}

		

		.ccl-aviationfeed--hero-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* Modern Button Styles */

		.ccl-aviationfeed--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 18px 32px;

			border-radius: 12px;

			font-weight: 700;

			font-size: 1rem;

			text-decoration: none;

			transition: var(--transition-base);

			border: none;

			cursor: pointer;

			position: relative;

			overflow: visible;

			font-family: var(--font-inter);

			white-space: nowrap;

		}

		

		.ccl-aviationfeed--btn i {

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			font-size: 0.95rem;

		}

		

		.ccl-aviationfeed--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-aviationfeed--btn--primary {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.4);

			animation: ccl-aviationfeed--fadeInUp 0.8s ease-out 0.6s backwards;

		}

		

		.ccl-aviationfeed--btn--primary:hover {

			background: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.5);

		}

		

		.ccl-aviationfeed--btn--primary:active {

			transform: translateY(0);

		}

		

		.ccl-aviationfeed--btn--secondary {

			background: rgba(255, 255, 255, 0.12);

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.4);

			backdrop-filter: blur(10px);

		}

		

		.ccl-aviationfeed--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.2);

			border-color: rgba(255, 255, 255, 0.6);

			transform: translateY(-2px);

		}

		

		.ccl-aviationfeed--btn--outline {

			background: transparent;

			color: var(--primary-blue);

			border: 2px solid var(--primary-blue);

		}

		

		.ccl-aviationfeed--btn--outline:hover {

			background: var(--primary-blue);

			color: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 4px 14px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--btn--white {

			background: var(--white);

			color: var(--primary-blue);

			box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-aviationfeed--btn--white:hover {

			background: var(--white);

			color: var(--cta-dark);

			transform: translateY(-2px);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);

		}

		

		/* Feed Section */

		.ccl-aviationfeed--feed {

			padding: var(--section-padding) 24px;

			background: var(--background-light);

		}

		

		.ccl-aviationfeed--container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-aviationfeed--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 48px;

		}

		

		.ccl-aviationfeed--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-size: 0.875rem;

			font-weight: 800;

			text-transform: uppercase;

			letter-spacing: 2px;

			margin-bottom: 16px;

		}

		

		.ccl-aviationfeed--section-kicker::before,

		.ccl-aviationfeed--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: linear-gradient(90deg, transparent, var(--primary-blue));

		}

		

		.ccl-aviationfeed--section-kicker::before {

			background: linear-gradient(90deg, var(--primary-blue), transparent);

		}

		

		.ccl-aviationfeed--section-header h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			color: var(--ink);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-aviationfeed--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

			padding: 0 6px;

		}

		

		.ccl-aviationfeed--section-header p {

			font-size: 1.15rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* Filter Bar */

		.ccl-aviationfeed--filter-bar {

			background: var(--white);

			border-radius: 16px;

			padding: 20px 28px;

			margin-bottom: 48px;

			box-shadow: var(--shadow-md);

			border: 1px solid var(--soft-border);

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 20px;

			flex-wrap: wrap;

			position: sticky;

			top: 20px;

			z-index: 100;

			backdrop-filter: blur(10px);

			background: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-aviationfeed--filter-group {

			display: flex;

			align-items: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		.ccl-aviationfeed--filter-label {

			font-size: 0.875rem;

			font-weight: 700;

			color: var(--ink);

			text-transform: uppercase;

			letter-spacing: 0.5px;

			display: flex;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-aviationfeed--filter-label i {

			color: var(--primary-blue);

			font-size: 1rem;

		}

		

		/* Sort Dropdown */

		.ccl-aviationfeed--sort-select {

			position: relative;

		}

		

		.ccl-aviationfeed--select {

			appearance: none;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 10px;

			padding: 12px 40px 12px 16px;

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ink);

			cursor: pointer;

			transition: var(--transition-base);

			font-family: var(--font-inter);

			min-width: 150px;

		}

		

		.ccl-aviationfeed--select:hover {

			border-color: var(--primary-blue);

			background: var(--background-light);

		}

		

		.ccl-aviationfeed--select:focus {

			outline: none;

			border-color: var(--primary-blue);

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-aviationfeed--sort-select::after {

			content: '\f078';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			right: 16px;

			top: 50%;

			transform: translateY(-50%);

			pointer-events: none;

			color: var(--primary-blue);

			font-size: 0.75rem;

		}

		

		/* Layout Toggle */

		.ccl-aviationfeed--layout-toggle {

			display: flex;

			background: var(--background-light);

			border-radius: 10px;

			padding: 4px;

			gap: 4px;

			border: 1px solid var(--soft-border);

		}

		

		.ccl-aviationfeed--layout-btn {

			display: flex;

			align-items: center;

			justify-content: center;

			width: 44px;

			height: 44px;

			border-radius: 8px;

			background: transparent;

			border: none;

			cursor: pointer;

			transition: var(--transition-base);

			color: var(--muted);

			font-size: 1.1rem;

		}

		

		.ccl-aviationfeed--layout-btn:hover {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

		}

		

		.ccl-aviationfeed--layout-btn.ccl-aviationfeed--active {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--layout-btn.ccl-aviationfeed--active:hover {

			background: var(--cta-dark);

		}

		

		/* Results Count */

		.ccl-aviationfeed--results-count {

			font-size: 0.9rem;

			color: var(--muted);

			font-weight: 500;

			display: flex;

			align-items: center;

			gap: 6px;

		}

		

		.ccl-aviationfeed--results-count strong {

			color: var(--ink);

			font-weight: 700;

		}

		

		/* Article Grid */

		.ccl-aviationfeed--grid {

			display: grid;

			grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));

			gap: var(--grid-gap);

			margin-bottom: 56px;

			transition: var(--transition-base);

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view {

			grid-template-columns: 1fr;

		}

		

		.ccl-aviationfeed--article-card {

			position: relative;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 16px;

			padding: var(--card-padding);

			transition: var(--transition-base);

			overflow: hidden;

			opacity: 0;

			transform: translateY(40px);

			display: flex;

			flex-direction: column;

		}

		

		.ccl-aviationfeed--article-card.ccl-aviationfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		.ccl-aviationfeed--article-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 3px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-3px);

			transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-aviationfeed--article-card:hover {

			transform: translateY(-6px);

			box-shadow: var(--shadow-lg);

			border-color: rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--article-card:hover::before {

			transform: translateY(0);

		}

		

		/* List View Specific Styles */

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-card {

			flex-direction: row;

			align-items: flex-start;

			gap: 24px;

			padding: 28px;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-main {

			flex: 1;

			min-width: 0;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-sidebar {

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 12px;

			min-width: 80px;

		}

		

		.ccl-aviationfeed--article-meta {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 16px;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-meta {

			margin-bottom: 12px;

		}

		

		.ccl-aviationfeed--article-icon {

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 14px;

			font-size: 1.5rem;

			transition: var(--transition-base);

			flex-shrink: 0;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-icon {

			width: 64px;

			height: 64px;

			font-size: 1.75rem;

		}

		

		.ccl-aviationfeed--article-card:hover .ccl-aviationfeed--article-icon {

			transform: rotate(5deg) scale(1.05);

			box-shadow: 0 8px 16px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--article-date {

			font-size: 0.875rem;

			color: var(--muted);

			font-weight: 600;

		}

		

		.ccl-aviationfeed--article-title {

			font-family: var(--font-inter-tight);

			font-weight: 800;

			font-size: 1.35rem;

			color: var(--ink);

			margin: 0 0 12px;

			line-height: 1.3;

			transition: color 0.3s ease;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-title {

			font-size: 1.5rem;

			margin-bottom: 10px;

		}

		

		.ccl-aviationfeed--article-card:hover .ccl-aviationfeed--article-title {

			color: var(--primary-blue);

		}

		

		.ccl-aviationfeed--article-excerpt {

			font-size: 1.05rem;

			color: var(--muted);

			line-height: 1.7;

			margin: 0 0 20px;

			flex-grow: 1;

		}

		

		.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-excerpt {

			font-size: 1.1rem;

			margin-bottom: 16px;

		}

		

		.ccl-aviationfeed--article-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--primary-blue);

			font-weight: 700;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			margin-top: auto;

		}

		

		.ccl-aviationfeed--article-link i {

			transition: transform 0.3s ease;

		}

		

		.ccl-aviationfeed--article-link:hover {

			color: var(--cta-dark);

			gap: 12px;

		}

		

		.ccl-aviationfeed--article-link:hover i {

			transform: translateX(4px);

		}

		

		/* Severity Indicators - REMOVED */

		

		/* Pagination */

		.ccl-aviationfeed--pagination {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			flex-wrap: wrap;

			padding: 40px 0;

		}

		

		.ccl-aviationfeed--page-btn {

			min-width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			border: 1px solid var(--soft-border);

			border-radius: 12px;

			color: var(--ink);

			font-weight: 600;

			font-size: 0.95rem;

			text-decoration: none;

			transition: var(--transition-base);

			padding: 0 16px;

		}

		

		.ccl-aviationfeed--page-btn:hover {

			border-color: var(--primary-blue);

			background: rgba(29, 99, 255, 0.05);

			color: var(--primary-blue);

			transform: translateY(-2px);

			box-shadow: var(--shadow-sm);

		}

		

		.ccl-aviationfeed--page-btn--active {

			background: var(--primary-blue);

			border-color: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-aviationfeed--page-btn--active:hover {

			transform: none;

			background: var(--cta-dark);

			border-color: var(--cta-dark);

		}

		

		.ccl-aviationfeed--page-ellipsis {

			color: var(--muted);

			padding: 0 8px;

			font-weight: 600;

		}

		

		/* CTA Section */

		.ccl-aviationfeed--cta {

			background: linear-gradient(135deg, #0a1929 0%, #1e293b 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviationfeed--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-aviationfeed--cta::after {

			content: '';

			position: absolute;

			bottom: -50%;

			left: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(11, 92, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

		}

		

		.ccl-aviationfeed--cta-content {

			position: relative;

			z-index: 2;

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-aviationfeed--cta h2 {

			font-family: var(--font-inter-tight);

			font-weight: 900;

			font-size: clamp(2rem, 4vw, 3.25rem);

			color: var(--white);

			margin: 0 0 20px;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-aviationfeed--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.85);

			line-height: 1.7;

			margin: 0 0 36px;

		}

		

		.ccl-aviationfeed--cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

			margin-top: 8px;

		}

		

		

		/* Scroll Reveal */

		.ccl-aviationfeed--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-aviationfeed--scroll-reveal.ccl-aviationfeed--is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-aviationfeed--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

				--grid-gap: 28px;

			}

			

			.ccl-aviationfeed--grid {

				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));

			}

			

			.ccl-aviationfeed--filter-bar {

				padding: 18px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-aviationfeed--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

				--grid-gap: 24px;

			}

			

			.ccl-aviationfeed--hero {

				padding: 120px 20px 100px;

			}

			

			.ccl-aviationfeed--hero-buttons {

				justify-content: center;

			}

			

			.ccl-aviationfeed--grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-aviationfeed--section-header {

				margin-bottom: 40px;

			}

			

			/* Mobile Filter Bar */

			.ccl-aviationfeed--filter-bar {

				flex-direction: column;

				align-items: stretch;

				padding: 20px;

				gap: 16px;

				top: 10px;

			}

			

			.ccl-aviationfeed--filter-group {

				width: 100%;

				justify-content: space-between;

			}

			

			.ccl-aviationfeed--filter-label {

				font-size: 0.8rem;

				white-space: nowrap;

			}

			

			.ccl-aviationfeed--sort-select {

				flex: 1;

			}

			

			.ccl-aviationfeed--select {

				width: 100%;

				padding: 10px 36px 10px 14px;

				font-size: 0.9rem;

			}

			

			.ccl-aviationfeed--layout-toggle {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-aviationfeed--layout-btn {

				flex: 1;

				max-width: 120px;

			}

			

			.ccl-aviationfeed--results-count {

				justify-content: center;

				padding-top: 8px;

				border-top: 1px solid var(--soft-border);

			}

			

			/* List View on Mobile */

			.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-card {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-sidebar {

				flex-direction: row;

				width: 100%;

				justify-content: flex-start;

			}

			

			.ccl-aviationfeed--grid.ccl-aviationfeed--list-view .ccl-aviationfeed--article-icon {

				width: 56px;

				height: 56px;

				font-size: 1.5rem;

			}

			

			.ccl-aviationfeed--pagination {

				gap: 6px;

			}

			

			.ccl-aviationfeed--page-btn {

				min-width: 44px;

				height: 44px;

				font-size: 0.9rem;

				padding: 0 12px;

			}

			

			.ccl-aviationfeed--cta-buttons {

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-aviationfeed--wrapper {

				--section-padding: 48px;

				--card-padding: 20px;

			}

			

			.ccl-aviationfeed--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-aviationfeed--feed,

			.ccl-aviationfeed--cta {

				padding-left: 16px;

				padding-right: 16px;

			}

			

			.ccl-aviationfeed--kicker {

				font-size: 0.75rem;

				padding: 10px 18px;

				gap: 8px;

			}

			

			.ccl-aviationfeed--article-title {

				font-size: 1.2rem;

			}

			

			.ccl-aviationfeed--filter-bar {

				padding: 16px;

				border-radius: 12px;

			}

			

			.ccl-aviationfeed--filter-label {

				font-size: 0.75rem;

			}

			

			.ccl-aviationfeed--layout-btn {

				font-size: 1rem;

				width: 40px;

				height: 40px;

			}

		}

		/* ============================================

		   CSS VARIABLES & BASE STYLES (SCOPED TO WRAPPER)

		   ============================================ */

		.ccl-aviation--wrapper {

			/* Brand Colors */

			--ccl-aviation-primary-blue: #1d63ff;

			--ccl-aviation-cta-blue: #0b5cff;

			--ccl-aviation-cta-dark: #0846c1;

			--ccl-aviation-accent-green: #10b981;

			--ccl-aviation-accent-gold: #ffa826;

			--ccl-aviation-ink: #1e293b;

			--ccl-aviation-muted: #64748b;

			--ccl-aviation-soft-border: #e5e7eb;

			

			/* Semantic Colors */

			--ccl-aviation-white: #ffffff;

			--ccl-aviation-light-bg: #f8fafc;

			--ccl-aviation-warning-red: #ef4444;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.6;

			color: var(--ccl-aviation-muted);

			

			/* Box Model Reset */

			box-sizing: border-box;

		}

		

		.ccl-aviation--wrapper main {

			display: block;

		}

		

		/* ============================================

		   TYPOGRAPHY

		   ============================================ */

		.ccl-aviation--wrapper h1,

		.ccl-aviation--wrapper h2,

		.ccl-aviation--wrapper h3,

		.ccl-aviation--wrapper h4 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			color: var(--ccl-aviation-ink);

			line-height: 1.2;

		}

		

		.ccl-aviation--wrapper h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			margin-bottom: 1.5rem;

		}

		

		.ccl-aviation--wrapper h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 1.25rem;

		}

		

		.ccl-aviation--wrapper h3 {

			font-size: clamp(1.5rem, 3vw, 1.75rem);

			margin-bottom: 1rem;

		}

		

		.ccl-aviation--wrapper p {

			margin-bottom: 1rem;

			font-size: 1.05rem;

		}

		

		.ccl-aviation--wrapper a {

			color: var(--ccl-aviation-primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-aviation--wrapper a:hover {

			color: var(--ccl-aviation-cta-dark);

		}

		

		/* ============================================

		   HERO SECTION

		   ============================================ */

		.ccl-aviation--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 80px;

			overflow: hidden;

			text-align: center;

		}

		

		.ccl-aviation--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 600px;

			height: 600px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			border-radius: 50%;

			animation: ccl-aviation-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-aviation-glow {

			0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.3; }

			50% { transform: translate(-30px, 30px) scale(1.1); opacity: 0.5; }

		}

		

		.ccl-aviation--hero-content {

			position: relative;

			z-index: 2;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-aviation--kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.9rem;

			font-weight: 600;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 24px;

			animation: ccl-aviation-fadeInDown 0.8s ease-out;

		}

		

		.ccl-aviation--kicker::before,

		.ccl-aviation--kicker::after {

			content: '';

			display: block;

			width: 40px;

			height: 2px;

			background: rgba(255, 255, 255, 0.5);

		}

		

		@keyframes ccl-aviation-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-aviation--hero h1 {

			color: var(--ccl-aviation-white);

			margin-bottom: 28px;

			animation: ccl-aviation-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-aviation-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-aviation--hero-lead {

			font-size: 1.2rem;

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			max-width: 800px;

			margin: 0 auto 32px;

			animation: ccl-aviation-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-aviation--hero-meta {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 24px;

			margin-top: 32px;

			animation: ccl-aviation-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-aviation--meta-item {

			display: flex;

			align-items: center;

			gap: 10px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 0.95rem;

		}

		

		.ccl-aviation--meta-item i {

			font-size: 1.1rem;

			color: var(--ccl-aviation-accent-gold);

		}

		

		/* ============================================

		   SECTION STRUCTURE

		   ============================================ */

		.ccl-aviation--section {

			padding: 100px 24px;

			background: var(--ccl-aviation-white);

		}

		

		.ccl-aviation--section:nth-child(even) {

			background: var(--ccl-aviation-light-bg);

		}

		

		.ccl-aviation--section-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-aviation--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 60px;

		}

		

		.ccl-aviation--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1.5px;

			color: var(--ccl-aviation-primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-aviation--section-kicker::before,

		.ccl-aviation--section-kicker::after {

			content: '';

			display: block;

			width: 30px;

			height: 2px;

			background: var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--section-header h2 mark {

			background: linear-gradient(180deg, transparent 60%, var(--ccl-aviation-accent-gold) 60%);

			color: inherit;

			padding: 0 4px;

		}

		

		.ccl-aviation--lead {

			font-size: 1.15rem;

			line-height: 1.7;

			color: var(--ccl-aviation-muted);

			margin-top: 20px;

		}

		

		/* ============================================

		   TWO-COLUMN LAYOUT WITH SIDEBAR

		   ============================================ */

		.ccl-aviation--content-layout {

			display: grid;

			grid-template-columns: 1fr 380px;

			gap: 48px;

			align-items: start;

		}

		

		.ccl-aviation--main-content {

			min-width: 0;

		}

		

		/* ============================================

		   SIDEBAR - ACCIDENT DETAILS

		   ============================================ */

		.ccl-aviation--sidebar {

			position: sticky;

			top: 24px;

		}

		

		.ccl-aviation--sidebar-card {

			background: var(--ccl-aviation-white);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 20px;

			padding: 0;

			position: relative;

			overflow: hidden;

			box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

		}

		

		.ccl-aviation--sidebar-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-aviation-primary-blue) 0%, var(--ccl-aviation-accent-gold) 100%);

		}

		

		.ccl-aviation--sidebar-header {

			padding: 28px 28px 20px;

			border-bottom: 2px solid var(--ccl-aviation-soft-border);

		}

		

		.ccl-aviation--sidebar-title {

			font-size: 1.3rem;

			font-weight: 800;

			color: var(--ccl-aviation-ink);

			margin-bottom: 8px;

			display: flex;

			align-items: center;

			gap: 10px;

		}

		

		.ccl-aviation--sidebar-title i {

			color: var(--ccl-aviation-primary-blue);

			font-size: 1.4rem;

		}

		

		.ccl-aviation--sidebar-subtitle {

			font-size: 0.9rem;

			color: var(--ccl-aviation-muted);

			line-height: 1.5;

		}

		

		.ccl-aviation--sidebar-body {

			padding: 24px 28px 28px;

		}

		

		.ccl-aviation--detail-item {

			padding: 16px 0;

			border-bottom: 1px solid var(--ccl-aviation-soft-border);

		}

		

		.ccl-aviation--detail-item:last-child {

			border-bottom: none;

			padding-bottom: 0;

		}

		

		.ccl-aviation--detail-item:first-child {

			padding-top: 0;

		}

		

		.ccl-aviation--detail-label {

			display: flex;

			align-items: center;

			gap: 8px;

			font-size: 0.8rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			color: var(--ccl-aviation-muted);

			margin-bottom: 6px;

		}

		

		.ccl-aviation--detail-label i {

			color: var(--ccl-aviation-primary-blue);

			font-size: 0.9rem;

		}

		

		.ccl-aviation--detail-value {

			font-size: 1rem;

			font-weight: 600;

			color: var(--ccl-aviation-ink);

			line-height: 1.5;

		}

		

		/* Highlight variants for sidebar items */

		.ccl-aviation--detail-item--highlight {

			background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-aviation--detail-item--warning {

			background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-aviation--detail-item--success {

			background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);

			padding: 16px;

			border-radius: 12px;

			border: none;

			margin: 8px 0;

		}

		

		.ccl-aviation--detail-item--highlight .ccl-aviation--detail-label i {

			color: var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--detail-item--warning .ccl-aviation--detail-label i {

			color: var(--ccl-aviation-warning-red);

		}

		

		.ccl-aviation--detail-item--success .ccl-aviation--detail-label i {

			color: var(--ccl-aviation-accent-green);

		}

		

		/* ============================================

		   CIRCUMSTANCES SECTION

		   ============================================ */

		.ccl-aviation--circumstances {

			background: var(--ccl-aviation-white);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 24px;

			padding: 48px;

			margin-bottom: 48px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviation--circumstances::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 6px;

			background: linear-gradient(90deg, var(--ccl-aviation-primary-blue) 0%, var(--ccl-aviation-accent-green) 100%);

		}

		

		.ccl-aviation--circumstances h3 {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 24px;

		}

		

		.ccl-aviation--circumstances h3 i {

			color: var(--ccl-aviation-primary-blue);

			font-size: 1.5rem;

		}

		

		.ccl-aviation--circumstances p {

			font-size: 1.05rem;

			line-height: 1.8;

			color: var(--ccl-aviation-ink);

			margin-bottom: 20px;

		}

		

		.ccl-aviation--circumstances p:last-child {

			margin-bottom: 0;

		}

		

		/* ============================================

		   INFO BANNER

		   ============================================ */

		.ccl-aviation--info-banner {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 100%);

			border-radius: 20px;

			padding: 40px;

			margin: 60px 0;

			color: var(--ccl-aviation-white);

			text-align: center;

		}

		

		.ccl-aviation--info-banner p {

			font-size: 1.05rem;

			line-height: 1.8;

			margin-bottom: 24px;

			color: rgba(255, 255, 255, 0.95);

		}

		

		.ccl-aviation--info-banner p:last-of-type {

			margin-bottom: 0;

		}

		

		.ccl-aviation--info-banner a {

			color: var(--ccl-aviation-accent-gold);

			font-weight: 600;

			text-decoration: underline;

			text-decoration-color: rgba(255, 168, 38, 0.4);

			text-underline-offset: 3px;

			transition: all 0.3s ease;

		}

		

		.ccl-aviation--info-banner a:hover {

			color: var(--ccl-aviation-white);

			text-decoration-color: var(--ccl-aviation-white);

		}

		

		/* ============================================

		   SOURCES

		   ============================================ */

		.ccl-aviation--sources {

			background: var(--ccl-aviation-light-bg);

			border-radius: 16px;

			padding: 32px;

			margin: 48px 0;

		}

		

		.ccl-aviation--sources h4 {

			display: flex;

			align-items: center;

			gap: 10px;

			font-size: 1.1rem;

			margin-bottom: 16px;

			color: var(--ccl-aviation-ink);

		}

		

		.ccl-aviation--sources h4 i {

			color: var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--sources p {

			font-size: 1rem;

			color: var(--ccl-aviation-muted);

		}

		

		/* ============================================

		   CONTACT FORM

		   ============================================ */

		.ccl-aviation--form {

			background: var(--ccl-aviation-white);

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 24px;

			padding: 48px;

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-aviation--form h3 {

			text-align: center;

			margin-bottom: 32px;

		}

		

		.ccl-aviation--form-row {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

			gap: 24px;

			margin-bottom: 24px;

		}

		

		.ccl-aviation--form-group {

			display: flex;

			flex-direction: column;

			gap: 8px;

		}

		

		.ccl-aviation--form-label {

			font-size: 0.95rem;

			font-weight: 600;

			color: var(--ccl-aviation-ink);

		}

		

		.ccl-aviation--form-label--required::after {

			content: ' *';

			color: var(--ccl-aviation-warning-red);

		}

		

		.ccl-aviation--form-input,

		.ccl-aviation--form-select,

		.ccl-aviation--form-textarea {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			padding: 14px 18px;

			border: 2px solid var(--ccl-aviation-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

			color: var(--ccl-aviation-ink);

			background: var(--ccl-aviation-white);

		}

		

		.ccl-aviation--form-input:focus,

		.ccl-aviation--form-select:focus,

		.ccl-aviation--form-textarea:focus {

			outline: none;

			border-color: var(--ccl-aviation-primary-blue);

			box-shadow: 0 0 0 4px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-aviation--form-textarea {

			resize: vertical;

			min-height: 150px;

		}

		

		.ccl-aviation--form-helper {

			font-size: 0.85rem;

			color: var(--ccl-aviation-muted);

		}

		

		/* ============================================

		   BUTTONS

		   ============================================ */

		.ccl-aviation--btn {

			font-family: 'Inter', sans-serif;

			font-size: 1rem;

			font-weight: 700;

			padding: 16px 36px;

			border: none;

			border-radius: 12px;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			display: inline-flex;

			align-items: center;

			gap: 10px;

			text-decoration: none;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-aviation--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-aviation--btn:active::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-aviation--btn--primary {

			background: linear-gradient(135deg, var(--ccl-aviation-cta-blue) 0%, var(--ccl-aviation-primary-blue) 100%);

			color: var(--ccl-aviation-white);

			box-shadow: 0 4px 12px rgba(11, 92, 255, 0.3);

		}

		

		.ccl-aviation--btn--primary:hover {

			background: linear-gradient(135deg, var(--ccl-aviation-cta-dark) 0%, var(--ccl-aviation-cta-blue) 100%);

			box-shadow: 0 8px 24px rgba(11, 92, 255, 0.4);

			transform: translateY(-2px);

		}

		

		.ccl-aviation--btn--secondary {

			background: var(--ccl-aviation-white);

			color: var(--ccl-aviation-primary-blue);

			border: 2px solid var(--ccl-aviation-primary-blue);

		}

		

		.ccl-aviation--btn--secondary:hover {

			background: var(--ccl-aviation-primary-blue);

			color: var(--ccl-aviation-white);

		}

		

		.ccl-aviation--btn-group {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			justify-content: center;

			margin-top: 32px;

		}

		

		/* ============================================

		   SCROLL REVEAL ANIMATION

		   ============================================ */

		.ccl-aviation--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);

		}

		

		.ccl-aviation--scroll-reveal.ccl-aviation--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ============================================

		   RESPONSIVE DESIGN

		   ============================================ */

		@media (max-width: 1200px) {

			.ccl-aviation--content-layout {

				grid-template-columns: 1fr 340px;

				gap: 36px;

			}

			

			.ccl-aviation--sidebar-card {

				padding: 0;

			}

		}

		

		@media (max-width: 1024px) {

			.ccl-aviation--wrapper {

				font-size: 15px;

			}

			

			.ccl-aviation--section {

				padding: 80px 20px;

			}

			

			.ccl-aviation--hero {

				padding: 100px 20px 60px;

			}

			

			.ccl-aviation--content-layout {

				grid-template-columns: 1fr;

				gap: 40px;

			}

			

			.ccl-aviation--sidebar {

				position: static;

				order: -1;

			}

			

			.ccl-aviation--circumstances {

				padding: 36px;

			}

			

			.ccl-aviation--form {

				padding: 36px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-aviation--wrapper {

				font-size: 14px;

			}

			

			.ccl-aviation--section {

				padding: 60px 16px;

			}

			

			.ccl-aviation--hero {

				padding: 80px 16px 50px;

			}

			

			.ccl-aviation--hero-meta {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-aviation--sidebar-header {

				padding: 24px 24px 16px;

			}

			

			.ccl-aviation--sidebar-body {

				padding: 20px 24px 24px;

			}

			

			.ccl-aviation--sidebar-title {

				font-size: 1.2rem;

			}

			

			.ccl-aviation--circumstances {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-aviation--form {

				padding: 28px;

				border-radius: 20px;

			}

			

			.ccl-aviation--form-row {

				grid-template-columns: 1fr;

			}

			

			.ccl-aviation--info-banner {

				padding: 32px 24px;

			}

			

			.ccl-aviation--btn-group {

				flex-direction: column;

			}

			

			.ccl-aviation--btn {

				width: 100%;

				justify-content: center;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-aviation--kicker::before,

			.ccl-aviation--kicker::after {

				width: 20px;

			}

			

			.ccl-aviation--section-kicker::before,

			.ccl-aviation--section-kicker::after {

				width: 20px;

			}

		}

		/* All styles scoped to wrapper */

		.ccl-terms--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--light-bg: #f8fafc;

			

			/* Typography */

			--font-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			--font-display: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--gap: 32px;

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-base);

			font-size: 16px;

			line-height: 1.6;

			color: var(--ink);

			background: var(--white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		/* Reset within wrapper */

		.ccl-terms--wrapper *,

		.ccl-terms--wrapper *::before,

		.ccl-terms--wrapper *::after {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		.ccl-terms--wrapper img {

			max-width: 100%;

			height: auto;

			display: block;

		}

		

		.ccl-terms--wrapper a {

			color: var(--primary-blue);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-terms--wrapper a:hover {

			color: var(--cta-dark);

		}

		

		/* Main Container */

		.ccl-terms--wrapper main {

			width: 100%;

		}

		

		/* Hero Section */

		.ccl-terms--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 120px 24px 100px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-terms--hero::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: radial-gradient(circle at 30% 50%, rgba(255, 255, 255, 0.1) 0%, transparent 60%);

			animation: ccl-terms-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-terms-glow {

			0%, 100% { opacity: 0.5; }

			50% { opacity: 1; }

		}

		

		.ccl-terms--hero-content {

			position: relative;

			max-width: 950px;

			margin: 0 auto;

			z-index: 1;

		}

		

		.ccl-terms--kicker {

			display: inline-block;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 1.5px;

			text-transform: uppercase;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 20px;

			animation: ccl-terms-fadeInDown 0.8s ease-out;

		}

		

		.ccl-terms--kicker i {

			margin-right: 8px;

		}

		

		.ccl-terms--hero h1 {

			font-family: var(--font-display);

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: 24px;

			line-height: 1.1;

			animation: ccl-terms-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		.ccl-terms--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.3rem);

			color: rgba(255, 255, 255, 0.95);

			max-width: 750px;

			margin: 0 auto 32px;

			line-height: 1.7;

			animation: ccl-terms-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-terms--hero-meta {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			font-size: 0.95rem;

			color: rgba(255, 255, 255, 0.85);

			background: rgba(255, 255, 255, 0.1);

			padding: 12px 24px;

			border-radius: 50px;

			backdrop-filter: blur(10px);

			animation: ccl-terms-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		.ccl-terms--hero-meta i {

			color: var(--accent-gold);

		}

		

		@keyframes ccl-terms-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		@keyframes ccl-terms-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		/* Content Wrapper with Sidebar */

		.ccl-terms--content-wrapper {

			max-width: 1400px;

			margin: 0 auto;

			padding: var(--section-padding) 24px;

			display: grid;

			grid-template-columns: 320px 1fr;

			gap: 48px;

			align-items: start;

		}

		

		/* Sidebar */

		.ccl-terms--sidebar {

			position: sticky;

			top: 24px;

			display: flex;

			flex-direction: column;

			gap: 24px;

		}

		

		.ccl-terms--sidebar-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			padding: 24px;

			transition: all 0.3s ease;

		}

		

		.ccl-terms--sidebar-card:hover {

			border-color: rgba(29, 99, 255, 0.3);

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.08);

		}

		

		.ccl-terms--sidebar-header {

			display: flex;

			align-items: center;

			gap: 12px;

			margin-bottom: 20px;

			padding-bottom: 16px;

			border-bottom: 2px solid var(--soft-border);

		}

		

		.ccl-terms--sidebar-header i {

			color: var(--primary-blue);

			font-size: 1.25rem;

		}

		

		.ccl-terms--sidebar-header h3 {

			font-family: var(--font-display);

			font-size: 1.25rem;

			font-weight: 800;

			color: var(--ink);

			margin: 0;

		}

		

		/* Sidebar Navigation */

		.ccl-terms--sidebar-nav {

			display: flex;

			flex-direction: column;

			gap: 4px;

		}

		

		.ccl-terms--sidebar-link {

			display: flex;

			align-items: center;

			gap: 12px;

			padding: 10px 12px;

			color: var(--muted);

			font-size: 0.95rem;

			font-weight: 500;

			border-radius: 8px;

			transition: all 0.3s ease;

			text-decoration: none;

		}

		

		.ccl-terms--sidebar-link i {

			font-size: 0.75rem;

			color: var(--primary-blue);

			transition: transform 0.3s ease;

		}

		

		.ccl-terms--sidebar-link:hover {

			background: rgba(29, 99, 255, 0.05);

			color: var(--primary-blue);

			padding-left: 16px;

		}

		

		.ccl-terms--sidebar-link:hover i {

			transform: translateX(3px);

		}

		

		.ccl-terms--sidebar-link.ccl-terms--active {

			background: rgba(29, 99, 255, 0.1);

			color: var(--primary-blue);

			font-weight: 600;

		}

		

		/* Sidebar Related Links */

		.ccl-terms--sidebar-links {

			display: flex;

			flex-direction: column;

			gap: 12px;

		}

		

		.ccl-terms--sidebar-related {

			display: flex;

			align-items: center;

			gap: 14px;

			padding: 14px;

			background: var(--light-bg);

			border-radius: 10px;

			text-decoration: none;

			transition: all 0.3s ease;

		}

		

		.ccl-terms--sidebar-related:hover {

			background: rgba(29, 99, 255, 0.08);

			transform: translateX(4px);

		}

		

		.ccl-terms--sidebar-related > i {

			width: 40px;

			height: 40px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 10px;

			font-size: 1rem;

			flex-shrink: 0;

		}

		

		.ccl-terms--sidebar-related-title {

			font-weight: 600;

			color: var(--ink);

			font-size: 0.95rem;

			margin-bottom: 2px;

		}

		

		.ccl-terms--sidebar-related-desc {

			font-size: 0.85rem;

			color: var(--muted);

		}

		

		/* Sidebar CTA Card */

		.ccl-terms--sidebar-cta {

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			border: none;

			text-align: center;

			padding: 28px 24px;

		}

		

		.ccl-terms--sidebar-cta:hover {

			transform: translateY(-4px);

			box-shadow: 0 8px 20px rgba(29, 99, 255, 0.25);

		}

		

		.ccl-terms--sidebar-cta-icon {

			width: 60px;

			height: 60px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: rgba(255, 255, 255, 0.2);

			color: var(--white);

			border-radius: 50%;

			font-size: 1.75rem;

			margin: 0 auto 16px;

			backdrop-filter: blur(10px);

		}

		

		.ccl-terms--sidebar-cta h3 {

			font-family: var(--font-display);

			font-size: 1.35rem;

			font-weight: 800;

			color: var(--white);

			margin: 0 0 12px;

		}

		

		.ccl-terms--sidebar-cta p {

			color: rgba(255, 255, 255, 0.95);

			font-size: 0.95rem;

			line-height: 1.6;

			margin: 0 0 20px;

		}

		

		.ccl-terms--sidebar-btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 8px;

			width: 100%;

			padding: 14px 24px;

			background: var(--white);

			color: var(--primary-blue);

			font-weight: 600;

			font-size: 0.95rem;

			border-radius: 10px;

			text-decoration: none;

			transition: all 0.3s ease;

		}

		

		.ccl-terms--sidebar-btn:hover {

			background: rgba(255, 255, 255, 0.95);

			transform: scale(1.05);

			box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);

		}

		

		/* Sidebar Info Card */

		.ccl-terms--sidebar-info {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.08), rgba(16, 185, 129, 0.12));

			border-left: 4px solid var(--accent-green);

			padding: 20px;

		}

		

		.ccl-terms--sidebar-info-icon {

			width: 48px;

			height: 48px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--accent-green), #059669);

			color: var(--white);

			border-radius: 12px;

			font-size: 1.25rem;

			margin: 0 auto 16px;

		}

		

		.ccl-terms--sidebar-info p {

			color: var(--muted);

			font-size: 0.9rem;

			line-height: 1.7;

			margin: 0;

		}

		

		.ccl-terms--sidebar-info p strong {

			color: var(--ink);

		}

		

		/* Content Section */

		.ccl-terms--content {

			min-width: 0;

		}

		

		.ccl-terms--section {

			margin-bottom: 80px;

			scroll-margin-top: 40px;

		}

		

		.ccl-terms--section:last-child {

			margin-bottom: 0;

		}

		

		.ccl-terms--section-header {

			display: flex;

			align-items: center;

			gap: 16px;

			margin-bottom: 28px;

			padding-bottom: 20px;

			border-bottom: 3px solid var(--soft-border);

		}

		

		.ccl-terms--section-icon {

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			border-radius: 14px;

			font-size: 1.5rem;

			flex-shrink: 0;

		}

		

		.ccl-terms--section h2 {

			font-family: var(--font-display);

			font-size: clamp(1.75rem, 3vw, 2.5rem);

			font-weight: 800;

			color: var(--ink);

			line-height: 1.2;

			flex: 1;

		}

		

		.ccl-terms--section h3 {

			font-family: var(--font-display);

			font-size: clamp(1.25rem, 2.5vw, 1.5rem);

			font-weight: 700;

			color: var(--ink);

			margin: 32px 0 16px;

		}

		

		.ccl-terms--section p {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--muted);

			margin-bottom: 20px;

		}

		

		.ccl-terms--section p strong {

			color: var(--ink);

			font-weight: 600;

		}

		

		/* Highlight Boxes */

		.ccl-terms--highlight {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.05));

			border-left: 4px solid var(--primary-blue);

			padding: 24px 28px;

			margin: 28px 0;

			border-radius: 12px;

		}

		

		.ccl-terms--highlight p {

			margin-bottom: 0;

		}

		

		.ccl-terms--warning {

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.05), rgba(255, 168, 38, 0.08));

			border-left: 4px solid var(--accent-gold);

			padding: 24px 28px;

			margin: 28px 0;

			border-radius: 12px;

		}

		

		.ccl-terms--warning p {

			margin-bottom: 0;

		}

		

		.ccl-terms--info {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.05), rgba(16, 185, 129, 0.08));

			border-left: 4px solid var(--accent-green);

			padding: 24px 28px;

			margin: 28px 0;

			border-radius: 12px;

		}

		

		.ccl-terms--info p {

			margin-bottom: 0;

		}

		

		/* List Styling */

		.ccl-terms--section ul {

			list-style: none;

			margin: 20px 0;

		}

		

		.ccl-terms--section ul li {

			position: relative;

			padding-left: 32px;

			margin-bottom: 12px;

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--muted);

		}

		

		.ccl-terms--section ul li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			top: 2px;

			color: var(--accent-green);

			font-size: 0.9rem;

		}

		

		/* Redesigned CTA Section */

		.ccl-terms--cta {

			background: var(--ink);

			padding: 100px 24px;

			text-align: center;

			margin-top: var(--section-padding);

			position: relative;

		}

		

		.ccl-terms--cta-content {

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-terms--cta-kicker {

			display: inline-block;

			font-family: var(--font-base);

			font-size: 0.875rem;

			font-weight: 600;

			letter-spacing: 1.5px;

			text-transform: uppercase;

			color: var(--primary-blue);

			margin-bottom: 16px;

		}

		

		.ccl-terms--cta h2 {

			font-family: var(--font-display);

			font-size: clamp(2rem, 4vw, 3rem);

			font-weight: 800;

			color: var(--white);

			margin-bottom: 16px;

			line-height: 1.2;

			letter-spacing: -0.02em;

		}

		

		.ccl-terms--cta-lead {

			font-family: var(--font-base);

			font-size: clamp(1.05rem, 2vw, 1.2rem);

			font-weight: 400;

			color: #94a3b8;

			margin-bottom: 40px;

			line-height: 1.7;

			max-width: 650px;

			margin-left: auto;

			margin-right: auto;

		}

		

		.ccl-terms--cta-actions {

			display: flex;

			flex-wrap: wrap;

			gap: 16px;

			justify-content: center;

			margin-bottom: 40px;

		}

		

		.ccl-terms--cta-divider {

			width: 60px;

			height: 2px;

			background: var(--primary-blue);

			margin: 40px auto;

			opacity: 0.4;

		}

		

		.ccl-terms--cta-contact {

			display: flex;

			flex-wrap: wrap;

			justify-content: center;

			gap: 32px;

			margin-top: 40px;

		}

		

		.ccl-terms--cta-contact-item {

			display: flex;

			align-items: center;

			gap: 12px;

			color: #94a3b8;

			font-family: var(--font-base);

			font-size: 0.95rem;

			font-weight: 500;

		}

		

		.ccl-terms--cta-contact-item i {

			color: var(--primary-blue);

			font-size: 1rem;

		}

		

		.ccl-terms--cta-contact-item a {

			color: var(--white);

			text-decoration: none;

			transition: color 0.3s ease;

		}

		

		.ccl-terms--cta-contact-item a:hover {

			color: var(--primary-blue);

		}

		

		/* Redesigned Buttons */

		.ccl-terms--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 18px 36px;

			font-family: var(--font-base);

			font-size: 1rem;

			font-weight: 600;

			border: none;

			border-radius: 8px;

			cursor: pointer;

			transition: all 0.3s ease;

			text-decoration: none;

			letter-spacing: 0.01em;

		}

		

		.ccl-terms--btn--primary {

			background: var(--primary-blue);

			color: var(--white);

			box-shadow: 0 2px 8px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-terms--btn--primary:hover {

			background: var(--cta-blue);

			transform: translateY(-2px);

			box-shadow: 0 4px 16px rgba(29, 99, 255, 0.4);

		}

		

		.ccl-terms--btn--secondary {

			background: transparent;

			color: var(--white);

			border: 2px solid rgba(255, 255, 255, 0.2);

		}

		

		.ccl-terms--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.1);

			border-color: rgba(255, 255, 255, 0.4);

			transform: translateY(-2px);

		}

		

		/* Scroll Reveal Animation */

		.ccl-terms--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-terms--scroll-reveal.ccl-terms--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Smooth Scroll */

		.ccl-terms--wrapper {

			scroll-behavior: smooth;

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-terms--wrapper {

				--section-padding: 80px;

				--card-padding: 28px;

				--gap: 24px;

			}

			

			.ccl-terms--content-wrapper {

				grid-template-columns: 1fr;

				gap: 40px;

				padding: var(--section-padding) 24px;

			}

			

			.ccl-terms--sidebar {

				position: static;

				display: grid;

				grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

				gap: 20px;

				order: 2;

			}

			

			.ccl-terms--content {

				order: 1;

			}

			

			.ccl-terms--cta {

				padding: 80px 24px;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-terms--wrapper {

				--section-padding: 60px;

				--card-padding: 24px;

				--gap: 20px;

			}

			

			.ccl-terms--content-wrapper {

				padding: var(--section-padding) 20px;

			}

			

			.ccl-terms--sidebar {

				grid-template-columns: 1fr;

			}

			

			.ccl-terms--cta {

				padding: 70px 20px;

			}

			

			.ccl-terms--cta-actions {

				flex-direction: column;

				width: 100%;

			}

			

			.ccl-terms--btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-terms--cta-contact {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-terms--btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-terms--hero {

				padding: 80px 20px 60px;

			}

			

			.ccl-terms--section {

				margin-bottom: 60px;

			}

			

			.ccl-terms--section-header {

				flex-direction: column;

				align-items: flex-start;

				gap: 12px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-terms--wrapper {

				--section-padding: 48px;

				--card-padding: 20px;

			}

			

			.ccl-terms--content-wrapper {

				padding: var(--section-padding) 16px;

			}

			

			.ccl-terms--sidebar-card {

				padding: 20px;

			}

			

			.ccl-terms--cta {

				padding: 60px 16px;

			}

			

			.ccl-terms--hero {

				padding: 60px 16px 48px;

			}

			

			.ccl-terms--cta {

				padding: 60px 16px;

			}

			

			.ccl-terms--cta-icon-badge {

				width: 60px;

				height: 60px;

				font-size: 1.5rem;

			}

			

			.ccl-terms--cta-note {

				padding: 16px 20px;

			}

			

			.ccl-terms--section-icon {

				width: 48px;

				height: 48px;

				font-size: 1.25rem;

			}

		}

		.ccl-privacy--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-cyan: #06b6d4;

			--accent-purple: #8b5cf6;

			--ink: #0f172a;

			--ink-light: #1e293b;

			--slate: #475569;

			--slate-light: #64748b;

			--border: #e2e8f0;

			--bg: #f8fafc;

			--white: #ffffff;

			

			/* Typography */

			--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

			--font-display: 'Inter Tight', var(--font-primary);

			

			/* Spacing */

			--space-xs: 8px;

			--space-sm: 16px;

			--space-md: 24px;

			--space-lg: 32px;

			--space-xl: 48px;

			--space-2xl: 64px;

			--space-3xl: 96px;

			

			/* Transitions */

			--transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			box-sizing: border-box;

			font-family: var(--font-primary);

			color: var(--ink);

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			background: var(--bg);

		}

		

		.ccl-privacy--wrapper *,

		.ccl-privacy--wrapper *::before,

		.ccl-privacy--wrapper *::after {

			box-sizing: inherit;

			margin: 0;

			padding: 0;

		}

		

		.ccl-privacy--wrapper main {

			overflow-x: hidden;

		}

		

		/* Hero Section - Improved Design */

		.ccl-privacy--hero {

			position: relative;

			background: linear-gradient(135deg, #1d63ff 0%, #0b5cff 50%, #06b6d4 100%);

			padding: clamp(80px, 12vh, 140px) var(--space-lg) clamp(60px, 10vh, 100px);

			overflow: hidden;

		}

		

		.ccl-privacy--hero-background {

			position: absolute;

			inset: 0;

			overflow: hidden;

			opacity: 0.4;

		}

		

		.ccl-privacy--hero-shape {

			position: absolute;

			border-radius: 50%;

			filter: blur(100px);

			animation: ccl-privacy-float 25s ease-in-out infinite;

		}

		

		.ccl-privacy--hero-shape-1 {

			width: 700px;

			height: 700px;

			background: rgba(255, 255, 255, 0.2);

			top: -250px;

			right: -150px;

			animation-delay: 0s;

		}

		

		.ccl-privacy--hero-shape-2 {

			width: 600px;

			height: 600px;

			background: rgba(139, 92, 246, 0.3);

			bottom: -200px;

			left: -100px;

			animation-delay: 8s;

		}

		

		.ccl-privacy--hero-shape-3 {

			width: 500px;

			height: 500px;

			background: rgba(6, 182, 212, 0.25);

			top: 40%;

			left: 50%;

			transform: translate(-50%, -50%);

			animation-delay: 16s;

		}

		

		@keyframes ccl-privacy-float {

			0%, 100% { transform: translate(0, 0) scale(1); }

			33% { transform: translate(40px, -40px) scale(1.05); }

			66% { transform: translate(-30px, 30px) scale(0.95); }

		}

		

		.ccl-privacy--hero-content {

			position: relative;

			z-index: 2;

			max-width: 850px;

			margin: 0 auto;

			text-align: center;

		}

		

		.ccl-privacy--hero-badge {

			display: inline-flex;

			align-items: center;

			gap: var(--space-xs);

			background: rgba(255, 255, 255, 0.25);

			backdrop-filter: blur(20px);

			border: 1px solid rgba(255, 255, 255, 0.3);

			color: var(--white);

			padding: 10px 24px;

			border-radius: 100px;

			font-size: 0.8125rem;

			font-weight: 700;

			letter-spacing: 1px;

			text-transform: uppercase;

			margin-bottom: var(--space-md);

			animation: ccl-privacy-fadeIn 0.6s ease-out;

			box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-privacy--hero-badge i {

			font-size: 1rem;

		}

		

		.ccl-privacy--hero-title {

			font-family: var(--font-display);

			font-size: clamp(2.75rem, 7vw, 5rem);

			font-weight: 900;

			color: var(--white);

			line-height: 1.1;

			margin-bottom: var(--space-md);

			animation: ccl-privacy-fadeIn 0.6s ease-out 0.1s backwards;

			letter-spacing: -0.03em;

			text-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);

		}

		

		.ccl-privacy--hero-title-accent {

			display: inline-block;

			background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.8) 100%);

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

			position: relative;

		}

		

		.ccl-privacy--hero-title-accent::after {

			content: '';

			position: absolute;

			bottom: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: rgba(255, 255, 255, 0.5);

			border-radius: 2px;

		}

		

		.ccl-privacy--hero-subtitle {

			font-size: clamp(1.125rem, 2.5vw, 1.5rem);

			color: rgba(255, 255, 255, 0.9);

			font-weight: 500;

			margin-bottom: var(--space-lg);

			animation: ccl-privacy-fadeIn 0.6s ease-out 0.2s backwards;

		}

		

		.ccl-privacy--hero-divider {

			width: 80px;

			height: 4px;

			background: rgba(255, 255, 255, 0.4);

			margin: 0 auto var(--space-lg);

			border-radius: 2px;

			animation: ccl-privacy-fadeIn 0.6s ease-out 0.3s backwards;

		}

		

		.ccl-privacy--hero-text {

			font-size: 1.0625rem;

			color: rgba(255, 255, 255, 0.85);

			line-height: 1.75;

			max-width: 680px;

			margin: 0 auto;

			animation: ccl-privacy-fadeIn 0.6s ease-out 0.4s backwards;

		}

		

		@keyframes ccl-privacy-fadeIn {

			from {

				opacity: 0;

				transform: translateY(15px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		/* Content Section - Unified Box Design */

		.ccl-privacy--content {

			padding: var(--space-3xl) 0;

		}

		

		.ccl-privacy--content-wrapper {

			max-width: 1400px;

			margin: 0 auto;

			padding: 0 var(--space-lg);

		}

		

		.ccl-privacy--content-box {

			display: grid;

			grid-template-columns: 280px 1fr;

			gap: 0;

			background: var(--white);

			border: 1px solid var(--border);

			border-radius: 24px;

			overflow: hidden;

			box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 20px 60px rgba(0, 0, 0, 0.03);

		}

		

		/* Sidebar - Inside Unified Container */

		.ccl-privacy--sidebar {

			background: var(--bg);

			border-right: 1px solid var(--border);

			padding: var(--space-lg) 0;

		}

		

		.ccl-privacy--sidebar-sticky {

			position: sticky;

			top: var(--space-lg);

			padding: 0 var(--space-md);

		}

		

		.ccl-privacy--sidebar-header {

			display: flex;

			align-items: center;

			gap: 10px;

			padding-bottom: var(--space-md);

			margin-bottom: var(--space-md);

			border-bottom: 1px solid var(--border);

		}

		

		.ccl-privacy--sidebar-header i {

			width: 32px;

			height: 32px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-cyan));

			color: var(--white);

			border-radius: 8px;

			font-size: 0.75rem;

		}

		

		.ccl-privacy--sidebar-header h2 {

			font-family: var(--font-display);

			font-size: 1rem;

			font-weight: 800;

			color: var(--ink);

			letter-spacing: -0.01em;

		}

		

		.ccl-privacy--sidebar-nav {

			display: flex;

			flex-direction: column;

			gap: 2px;

		}

		

		.ccl-privacy--sidebar-link {

			display: flex;

			align-items: center;

			gap: 10px;

			padding: 10px 12px;

			border-radius: 10px;

			text-decoration: none;

			color: var(--slate);

			font-size: 0.8125rem;

			font-weight: 600;

			transition: var(--transition);

			position: relative;

		}

		

		.ccl-privacy--sidebar-link::before {

			content: '';

			position: absolute;

			left: 0;

			top: 50%;

			transform: translateY(-50%);

			width: 2px;

			height: 0;

			background: linear-gradient(180deg, var(--primary-blue), var(--accent-cyan));

			border-radius: 0 2px 2px 0;

			transition: var(--transition);

		}

		

		.ccl-privacy--sidebar-link:hover {

			color: var(--primary-blue);

			background: var(--white);

		}

		

		.ccl-privacy--sidebar-link.ccl-privacy--active {

			color: var(--primary-blue);

			background: var(--white);

			box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);

		}

		

		.ccl-privacy--sidebar-link:hover::before,

		.ccl-privacy--sidebar-link.ccl-privacy--active::before {

			height: 100%;

		}

		

		.ccl-privacy--sidebar-number {

			flex-shrink: 0;

			width: 28px;

			height: 28px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: var(--white);

			color: var(--slate-light);

			border-radius: 8px;

			font-size: 0.75rem;

			font-weight: 700;

			transition: var(--transition);

			border: 1px solid var(--border);

		}

		

		.ccl-privacy--sidebar-link:hover .ccl-privacy--sidebar-number,

		.ccl-privacy--sidebar-link.ccl-privacy--active .ccl-privacy--sidebar-number {

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-cyan));

			color: var(--white);

			transform: scale(1.05);

			border-color: transparent;

		}

		

		.ccl-privacy--sidebar-text {

			flex: 1;

			line-height: 1.3;

		}

		

		/* Main Content Area - Inside Unified Container */

		.ccl-privacy--content-main {

			padding: var(--space-xl);

			min-width: 0;

		}

		

		/* Section Cards */

		.ccl-privacy--section {

			padding: var(--space-xl) 0;

			margin-bottom: var(--space-lg);

			scroll-margin-top: 100px;

			border-bottom: 1px solid var(--border);

		}

		

		.ccl-privacy--section:last-child {

			border-bottom: none;

			margin-bottom: 0;

		}

		

		.ccl-privacy--section-header {

			display: flex;

			align-items: flex-start;

			gap: var(--space-md);

			margin-bottom: var(--space-lg);

		}

		

		.ccl-privacy--section-number {

			flex-shrink: 0;

			width: 56px;

			height: 56px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-cyan));

			color: var(--white);

			border-radius: 14px;

			font-family: var(--font-display);

			font-size: 1.5rem;

			font-weight: 900;

			box-shadow: 0 4px 20px rgba(29, 99, 255, 0.2);

		}

		

		.ccl-privacy--section-title {

			flex: 1;

			font-family: var(--font-display);

			font-size: clamp(1.5rem, 2.5vw, 2rem);

			font-weight: 800;

			color: var(--ink);

			line-height: 1.25;

			letter-spacing: -0.02em;

		}

		

		.ccl-privacy--section-title mark {

			background: linear-gradient(180deg, transparent 65%, rgba(29, 99, 255, 0.15) 65%);

			color: inherit;

			padding: 0 4px;

			border-radius: 3px;

		}

		

		.ccl-privacy--section-content {

			color: var(--slate);

			font-size: 1.0625rem;

			line-height: 1.75;

		}

		

		.ccl-privacy--section-content p {

			margin-bottom: var(--space-md);

		}

		

		.ccl-privacy--section-content p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-privacy--section-content ul {

			list-style: none;

			margin: var(--space-md) 0;

		}

		

		.ccl-privacy--section-content ul li {

			position: relative;

			padding-left: 28px;

			margin-bottom: 12px;

			color: var(--slate);

		}

		

		.ccl-privacy--section-content ul li::before {

			content: '';

			position: absolute;

			left: 0;

			top: 10px;

			width: 6px;

			height: 6px;

			background: var(--primary-blue);

			border-radius: 50%;

			box-shadow: 0 0 0 3px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-privacy--section-content strong {

			color: var(--ink-light);

			font-weight: 700;

		}

		

		/* Highlight Box */

		.ccl-privacy--highlight {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.06), rgba(6, 182, 212, 0.06));

			border-left: 3px solid var(--primary-blue);

			padding: var(--space-md) var(--space-lg);

			border-radius: 10px;

			margin: var(--space-lg) 0;

		}

		

		.ccl-privacy--highlight p {

			color: var(--ink-light);

			font-weight: 600;

			margin-bottom: 0;

		}

		

		/* CTA Section */

		.ccl-privacy--cta {

			background: linear-gradient(135deg, var(--ink) 0%, #1e293b 100%);

			padding: var(--space-3xl) var(--space-lg);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-privacy--cta::before {

			content: '';

			position: absolute;

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(29, 99, 255, 0.15) 0%, transparent 70%);

			top: -400px;

			right: -200px;

		}

		

		.ccl-privacy--cta-container {

			position: relative;

			z-index: 2;

			max-width: 900px;

			margin: 0 auto;

			text-align: center;

		}

		

		.ccl-privacy--cta-icon {

			width: 72px;

			height: 72px;

			margin: 0 auto var(--space-lg);

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-cyan));

			border-radius: 18px;

			display: flex;

			align-items: center;

			justify-content: center;

			font-size: 1.75rem;

			color: var(--white);

			box-shadow: 0 8px 30px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-privacy--cta-title {

			font-family: var(--font-display);

			font-size: clamp(2rem, 4vw, 3rem);

			font-weight: 900;

			color: var(--white);

			margin-bottom: var(--space-md);

			line-height: 1.2;

			letter-spacing: -0.02em;

		}

		

		.ccl-privacy--cta-text {

			font-size: 1.0625rem;

			color: rgba(255, 255, 255, 0.75);

			margin-bottom: var(--space-xl);

			line-height: 1.7;

		}

		

		.ccl-privacy--cta-details {

			display: flex;

			flex-direction: column;

			gap: var(--space-sm);

			align-items: center;

			margin-bottom: var(--space-xl);

		}

		

		.ccl-privacy--cta-detail {

			display: flex;

			align-items: center;

			gap: 12px;

			color: rgba(255, 255, 255, 0.9);

			font-size: 1rem;

			font-weight: 600;

		}

		

		.ccl-privacy--cta-detail i {

			width: 40px;

			height: 40px;

			display: flex;

			align-items: center;

			justify-content: center;

			background: rgba(255, 255, 255, 0.1);

			border-radius: 10px;

			color: var(--accent-cyan);

		}

		

		.ccl-privacy--cta-detail a {

			color: rgba(255, 255, 255, 0.9);

			text-decoration: none;

			transition: var(--transition);

		}

		

		.ccl-privacy--cta-detail a:hover {

			color: var(--white);

		}

		

		.ccl-privacy--btn-group {

			display: flex;

			gap: var(--space-sm);

			justify-content: center;

			flex-wrap: wrap;

		}

		

		/* Buttons */

		.ccl-privacy--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 32px;

			border-radius: 12px;

			font-family: var(--font-primary);

			font-size: 1rem;

			font-weight: 700;

			text-decoration: none;

			border: none;

			cursor: pointer;

			transition: var(--transition);

		}

		

		.ccl-privacy--btn i {

			transition: var(--transition);

		}

		

		.ccl-privacy--btn:hover i {

			transform: translateX(3px);

		}

		

		.ccl-privacy--btn--primary {

			background: linear-gradient(135deg, var(--primary-blue), var(--accent-cyan));

			color: var(--white);

			box-shadow: 0 4px 20px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-privacy--btn--primary:hover {

			transform: translateY(-2px);

			box-shadow: 0 6px 30px rgba(29, 99, 255, 0.4);

		}

		

		.ccl-privacy--btn--secondary {

			background: rgba(255, 255, 255, 0.1);

			backdrop-filter: blur(10px);

			color: var(--white);

			border: 1px solid rgba(255, 255, 255, 0.2);

		}

		

		.ccl-privacy--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.15);

			border-color: rgba(255, 255, 255, 0.3);

		}

		

		/* Scroll Reveal */

		.ccl-privacy--scroll-reveal {

			opacity: 0;

			transform: translateY(20px);

			transition: opacity 0.6s ease-out, transform 0.6s ease-out;

		}

		

		.ccl-privacy--scroll-reveal.ccl-privacy--revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Last Updated */

		.ccl-privacy--last-updated {

			text-align: center;

			padding: var(--space-xl) var(--space-lg);

			background: var(--white);

			border-top: 1px solid var(--border);

		}

		

		.ccl-privacy--last-updated p {

			color: var(--slate-light);

			font-size: 0.9375rem;

		}

		

		.ccl-privacy--last-updated strong {

			color: var(--ink-light);

			font-weight: 700;

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-privacy--content-box {

				grid-template-columns: 240px 1fr;

			}

			

			.ccl-privacy--content-main {

				padding: var(--space-lg);

			}

		}

		

		@media (max-width: 768px) {

			.ccl-privacy--hero {

				padding: clamp(60px, 10vh, 100px) var(--space-md) clamp(50px, 8vh, 80px);

			}

			

			.ccl-privacy--content {

				padding: var(--space-2xl) 0;

			}

			

			.ccl-privacy--content-wrapper {

				padding: 0 var(--space-md);

			}

			

			.ccl-privacy--content-box {

				grid-template-columns: 1fr;

				border-radius: 16px;

			}

			

			.ccl-privacy--sidebar {

				border-right: none;

				border-bottom: 1px solid var(--border);

				padding: var(--space-md);

			}

			

			.ccl-privacy--sidebar-sticky {

				position: relative;

				top: 0;

				padding: 0;

			}

			

			.ccl-privacy--sidebar-nav {

				display: grid;

				grid-template-columns: repeat(2, 1fr);

				gap: var(--space-xs);

			}

			

			.ccl-privacy--content-main {

				padding: var(--space-lg) var(--space-md);

			}

			

			.ccl-privacy--section {

				padding: var(--space-lg) 0;

			}

			

			.ccl-privacy--section-header {

				flex-direction: column;

				gap: var(--space-sm);

			}

			

			.ccl-privacy--btn-group {

				flex-direction: column;

				width: 100%;

			}

			

			.ccl-privacy--btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-privacy--cta-details {

				align-items: flex-start;

				width: 100%;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-privacy--sidebar-nav {

				grid-template-columns: 1fr;

			}

			

			.ccl-privacy--section {

				padding: var(--space-md) 0;

			}

		}

		

		/* Smooth Scroll */

		.ccl-privacy--wrapper {

			scroll-behavior: smooth;

		}

		

		/* Print Styles */

		@media print {

			.ccl-privacy--sidebar,

			.ccl-privacy--cta {

				display: none;

			}

			

			.ccl-privacy--content-box {

				grid-template-columns: 1fr;

				border: none;

			}

			

			.ccl-privacy--section {

				page-break-inside: avoid;

			}

		}

		.ccl-comppayout--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--bg-light: #f9fafb;

			

			/* Typography */

			--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

			--font-display: 'Inter Tight', var(--font-primary);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Animations */

			--transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-bounce: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-primary);

			color: var(--ink);

			font-size: 16px;

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			overflow-x: hidden;

		}

		

		.ccl-comppayout--wrapper *,

		.ccl-comppayout--wrapper *::before,

		.ccl-comppayout--wrapper *::after {

			box-sizing: border-box;

			margin: 0;

			padding: 0;

		}

		

		.ccl-comppayout--wrapper main {

			background: var(--white);

		}

		

		/* Hero Section */

		.ccl-comppayout--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 140px 24px 120px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-comppayout--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-comppayout-glow 8s ease-in-out infinite;

		}

		

		@keyframes ccl-comppayout-glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, -30px) scale(1.1); }

		}

		

		.ccl-comppayout--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-comppayout--kicker {

			display: inline-block;

			background: rgba(255, 255, 255, 0.2);

			color: var(--white);

			padding: 8px 20px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 24px;

			animation: ccl-comppayout-fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-comppayout-fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-comppayout--hero h1 {

			font-family: var(--font-display);

			font-weight: 900;

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			line-height: 1.1;

			color: var(--white);

			margin-bottom: 28px;

			animation: ccl-comppayout-fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-comppayout-fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-comppayout--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			line-height: 1.7;

			color: rgba(255, 255, 255, 0.95);

			margin-bottom: 40px;

			animation: ccl-comppayout-fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-comppayout--hero-cta {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			animation: ccl-comppayout-fadeInUp 0.8s ease-out 0.6s both;

		}

		

		/* Buttons */

		.ccl-comppayout--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 16px 32px;

			font-family: var(--font-primary);

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border-radius: 12px;

			border: 2px solid transparent;

			cursor: pointer;

			transition: var(--transition-smooth);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-comppayout--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.2);

			transform: translate(-50%, -50%);

			transition: width 0.6s, height 0.6s;

		}

		

		.ccl-comppayout--btn:hover::before {

			width: 400px;

			height: 400px;

		}

		

		.ccl-comppayout--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-comppayout--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-comppayout--btn:hover i {

			transform: translateX(5px);

		}

		

		.ccl-comppayout--btn--primary {

			background: var(--white);

			color: var(--primary-blue);

		}

		

		.ccl-comppayout--btn--primary:hover {

			background: var(--white);

			transform: translateY(-2px);

			box-shadow: 0 12px 30px rgba(255, 255, 255, 0.3);

		}

		

		.ccl-comppayout--btn--secondary {

			background: transparent;

			color: var(--white);

			border-color: rgba(255, 255, 255, 0.4);

		}

		

		.ccl-comppayout--btn--secondary:hover {

			background: rgba(255, 255, 255, 0.1);

			border-color: var(--white);

			transform: translateY(-2px);

		}

		

		/* Section Styles */

		.ccl-comppayout--section {

			padding: var(--section-padding) 24px;

		}

		

		.ccl-comppayout--section--alt {

			background: var(--bg-light);

		}

		

		.ccl-comppayout--container {

			max-width: 1320px;

			margin: 0 auto;

		}

		

		.ccl-comppayout--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 80px;

		}

		

		.ccl-comppayout--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 16px;

			color: var(--primary-blue);

			font-weight: 700;

			font-size: 0.95rem;

			text-transform: uppercase;

			letter-spacing: 1px;

			margin-bottom: 20px;

		}

		

		.ccl-comppayout--section-kicker::before,

		.ccl-comppayout--section-kicker::after {

			content: '';

			width: 40px;

			height: 2px;

			background: var(--primary-blue);

		}

		

		.ccl-comppayout--section h2 {

			font-family: var(--font-display);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			line-height: 1.15;

			color: var(--ink);

			margin-bottom: 24px;

		}

		

		.ccl-comppayout--section h2 mark {

			background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

			color: inherit;

		}

		

		.ccl-comppayout--section-lead {

			font-size: 1.2rem;

			line-height: 1.75;

			color: var(--muted);

		}

		

		/* Info Cards */

		.ccl-comppayout--info-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: var(--grid-gap);

			margin-bottom: 60px;

		}

		

		.ccl-comppayout--info-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 24px;

			padding: var(--card-padding);

			position: relative;

			overflow: hidden;

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--info-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: var(--primary-blue);

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.4s ease;

		}

		

		.ccl-comppayout--info-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-comppayout--info-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 60px rgba(29, 99, 255, 0.15);

			border-color: var(--primary-blue);

		}

		

		.ccl-comppayout--info-icon {

			width: 85px;

			height: 85px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			transition: var(--transition-bounce);

		}

		

		.ccl-comppayout--info-icon i {

			font-size: 2.2rem;

			color: var(--primary-blue);

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--info-card:hover .ccl-comppayout--info-icon {

			transform: rotate(10deg) scale(1.1);

		}

		

		.ccl-comppayout--info-card:hover .ccl-comppayout--info-icon i {

			color: var(--cta-dark);

		}

		

		.ccl-comppayout--info-card h3 {

			font-family: var(--font-display);

			font-weight: 800;

			font-size: 1.75rem;

			color: var(--ink);

			margin-bottom: 16px;

			line-height: 1.3;

		}

		

		.ccl-comppayout--info-card p {

			color: var(--muted);

			line-height: 1.7;

			font-size: 1.05rem;

			margin-bottom: 20px;

		}

		

		.ccl-comppayout--info-list {

			list-style: none;

			margin-bottom: 24px;

		}

		

		.ccl-comppayout--info-list li {

			display: flex;

			align-items: flex-start;

			gap: 12px;

			padding: 10px 0;

			color: var(--muted);

			font-size: 1rem;

		}

		

		.ccl-comppayout--info-list li i {

			color: var(--accent-green);

			margin-top: 4px;

			flex-shrink: 0;

		}

		

		/* Injury Categories Grid */

		.ccl-comppayout--category-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 28px;

		}

		

		.ccl-comppayout--category-card {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			padding: 32px;

			text-align: center;

			transition: var(--transition-smooth);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-comppayout--category-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 5px;

			background: linear-gradient(90deg, var(--primary-blue), var(--cta-blue));

			transform: translateY(-5px);

			transition: transform 0.3s ease;

		}

		

		.ccl-comppayout--category-card:hover::before {

			transform: translateY(0);

		}

		

		.ccl-comppayout--category-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 48px rgba(29, 99, 255, 0.12);

			border-color: var(--primary-blue);

		}

		

		.ccl-comppayout--category-icon {

			width: 75px;

			height: 75px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.08), rgba(11, 92, 255, 0.12));

			display: flex;

			align-items: center;

			justify-content: center;

			margin: 0 auto 20px;

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--category-icon i {

			font-size: 1.8rem;

			color: var(--primary-blue);

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--category-card:hover .ccl-comppayout--category-icon {

			transform: scale(1.15);

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.15), rgba(11, 92, 255, 0.2));

		}

		

		.ccl-comppayout--category-card:hover .ccl-comppayout--category-icon i {

			color: var(--cta-dark);

		}

		

		.ccl-comppayout--category-card h3 {

			font-family: var(--font-display);

			font-weight: 800;

			font-size: 1.35rem;

			color: var(--ink);

			margin-bottom: 12px;

		}

		

		.ccl-comppayout--category-count {

			color: var(--muted);

			font-size: 0.95rem;

			font-weight: 600;

			line-height: 1.4;

		}

		

		/* Stats Section */

		.ccl-comppayout--stats-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 32px;

			margin-top: 60px;

		}

		

		.ccl-comppayout--stat-card {

			text-align: center;

			padding: 40px 28px;

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--stat-card:hover {

			transform: translateY(-5px);

			box-shadow: 0 12px 40px rgba(29, 99, 255, 0.1);

			border-color: var(--primary-blue);

		}

		

		.ccl-comppayout--stat-value {

			font-family: var(--font-display);

			font-weight: 900;

			font-size: clamp(2.5rem, 4vw, 3.5rem);

			color: var(--primary-blue);

			margin-bottom: 12px;

			line-height: 1;

		}

		

		.ccl-comppayout--stat-label {

			color: var(--ink);

			font-weight: 700;

			font-size: 1.1rem;

			margin-bottom: 8px;

		}

		

		.ccl-comppayout--stat-description {

			color: var(--muted);

			font-size: 0.95rem;

			line-height: 1.5;

		}

		

		/* Injury Types Detail Section */

		.ccl-comppayout--injury-types-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));

			gap: 32px;

		}

		

		.ccl-comppayout--injury-type-section {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			padding: 32px;

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--injury-type-section:hover {

			transform: translateY(-5px);

			box-shadow: 0 12px 40px rgba(29, 99, 255, 0.1);

			border-color: var(--primary-blue);

		}

		

		.ccl-comppayout--injury-type-header {

			display: flex;

			align-items: center;

			gap: 16px;

			margin-bottom: 24px;

			padding-bottom: 20px;

			border-bottom: 2px solid var(--soft-border);

		}

		

		.ccl-comppayout--injury-type-icon {

			width: 60px;

			height: 60px;

			border-radius: 50%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

		}

		

		.ccl-comppayout--injury-type-icon i {

			font-size: 1.6rem;

			color: var(--primary-blue);

		}

		

		.ccl-comppayout--injury-type-section h3 {

			font-family: var(--font-display);

			font-weight: 800;

			font-size: 1.5rem;

			color: var(--ink);

			margin: 0;

		}

		

		.ccl-comppayout--injury-type-list {

			list-style: none;

			margin: 0;

			padding: 0;

		}

		

		.ccl-comppayout--injury-type-list li {

			display: flex;

			align-items: center;

			gap: 12px;

			padding: 10px 0;

			color: var(--muted);

			font-size: 1rem;

			line-height: 1.5;

			border-bottom: 1px solid var(--soft-border);

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--injury-type-list li:last-child {

			border-bottom: none;

		}

		

		.ccl-comppayout--injury-type-list li:hover {

			color: var(--ink);

			padding-left: 8px;

		}

		

		.ccl-comppayout--injury-type-list li i {

			color: var(--primary-blue);

			font-size: 0.75rem;

			flex-shrink: 0;

		}

		

		.ccl-comppayout--injury-type-note {

			background: var(--bg-light);

			border-left: 4px solid var(--primary-blue);

			padding: 16px 20px;

			margin: 20px 0;

			border-radius: 8px;

		}

		

		.ccl-comppayout--injury-type-note p {

			color: var(--muted);

			font-size: 0.95rem;

			line-height: 1.7;

			margin-bottom: 12px;

		}

		

		.ccl-comppayout--injury-type-note p:last-child {

			margin-bottom: 0;

		}

		

		.ccl-comppayout--injury-type-note strong {

			color: var(--ink);

			font-weight: 700;

		}

		

		/* WorkCover Table */

		.ccl-comppayout--workcover-table {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			overflow: hidden;

		}

		

		.ccl-comppayout--workcover-table .ccl-comppayout--table-row {

			display: grid;

			grid-template-columns: 2fr 1fr 80px;

			gap: 20px;

			padding: 24px 32px;

			align-items: center;

		}

		

		.ccl-comppayout--table-percent {

			text-align: right;

			font-weight: 700;

			color: var(--primary-blue);

			font-size: 1.1rem;

		}

		

		.ccl-comppayout--table-total {

			background: var(--bg-light);

			border-top: 3px solid var(--primary-blue);

		}

		

		.ccl-comppayout--table-total .ccl-comppayout--table-label {

			font-weight: 800;

		}

		

		.ccl-comppayout--table-total .ccl-comppayout--table-value {

			font-size: 1.75rem;

		}

		

		.ccl-comppayout--workcover-note {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			border: 2px solid var(--primary-blue);

			border-radius: 16px;

			padding: 24px 28px;

			margin-top: 40px;

		}

		

		.ccl-comppayout--workcover-note p {

			color: var(--ink);

			font-size: 1rem;

			line-height: 1.7;

			margin: 0;

			display: flex;

			align-items: flex-start;

			gap: 12px;

		}

		

		.ccl-comppayout--workcover-note i {

			color: var(--primary-blue);

			font-size: 1.2rem;

			margin-top: 2px;

			flex-shrink: 0;

		}

		

		/* Payout Table */

		.ccl-comppayout--payout-table {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 20px;

			overflow: hidden;

			margin-top: 40px;

		}

		

		.ccl-comppayout--table-header {

			background: linear-gradient(135deg, var(--primary-blue), var(--cta-blue));

			color: var(--white);

			padding: 28px 32px;

		}

		

		.ccl-comppayout--table-header h3 {

			font-family: var(--font-display);

			font-weight: 800;

			font-size: 1.75rem;

			margin-bottom: 8px;

		}

		

		.ccl-comppayout--table-header p {

			opacity: 0.95;

			font-size: 1.05rem;

		}

		

		.ccl-comppayout--table-row {

			display: grid;

			grid-template-columns: 1fr 1fr;

			gap: 24px;

			padding: 28px 32px;

			border-bottom: 1px solid var(--soft-border);

			transition: background 0.2s ease;

		}

		

		.ccl-comppayout--table-row:last-child {

			border-bottom: none;

		}

		

		.ccl-comppayout--table-row:hover {

			background: var(--bg-light);

		}

		

		.ccl-comppayout--table-label {

			display: flex;

			align-items: center;

			gap: 12px;

			font-weight: 700;

			color: var(--ink);

			font-size: 1.05rem;

		}

		

		.ccl-comppayout--table-label i {

			color: var(--primary-blue);

			font-size: 1.2rem;

		}

		

		.ccl-comppayout--table-value {

			font-family: var(--font-display);

			font-weight: 800;

			font-size: 1.5rem;

			color: var(--primary-blue);

			text-align: right;

		}

		

		/* FAQ Section */

		.ccl-comppayout--faq-list {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-comppayout--faq-item {

			background: var(--white);

			border: 2px solid var(--soft-border);

			border-radius: 16px;

			margin-bottom: 20px;

			overflow: hidden;

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--faq-item:hover {

			border-color: var(--primary-blue);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.08);

		}

		

		.ccl-comppayout--faq-question {

			display: flex;

			align-items: center;

			justify-content: space-between;

			padding: 28px 32px;

			cursor: pointer;

			user-select: none;

			background: transparent;

			border: none;

			width: 100%;

			text-align: left;

			font-family: var(--font-primary);

		}

		

		.ccl-comppayout--faq-question h3 {

			font-family: var(--font-display);

			font-weight: 800;

			font-size: 1.25rem;

			color: var(--ink);

			line-height: 1.4;

			flex: 1;

		}

		

		.ccl-comppayout--faq-toggle {

			width: 36px;

			height: 36px;

			border-radius: 50%;

			background: var(--bg-light);

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			margin-left: 20px;

			transition: var(--transition-smooth);

		}

		

		.ccl-comppayout--faq-toggle i {

			color: var(--primary-blue);

			font-size: 1.1rem;

			transition: transform 0.3s ease;

		}

		

		.ccl-comppayout--faq-item.active .ccl-comppayout--faq-toggle {

			background: var(--primary-blue);

		}

		

		.ccl-comppayout--faq-item.active .ccl-comppayout--faq-toggle i {

			color: var(--white);

			transform: rotate(180deg);

		}

		

		.ccl-comppayout--faq-answer {

			max-height: 0;

			overflow: hidden;

			transition: max-height 0.4s ease, padding 0.4s ease;

		}

		

		.ccl-comppayout--faq-item.active .ccl-comppayout--faq-answer {

			max-height: 500px; /* Adjust as needed for content */

			padding: 0 32px 28px;

		}

		

		/* Show FAQ answers by default on mobile/tablet */

		@media (max-width: 1024px) {

			.ccl-comppayout--faq-answer {

				max-height: none;

				overflow: visible;

				padding: 0 32px 28px;

			}

			

			.ccl-comppayout--faq-question {

				pointer-events: none;

				cursor: default;

			}

			

			.ccl-comppayout--faq-toggle {

				display: none;

			}

			

			.ccl-comppayout--faq-question h3 {

				padding-right: 0;

			}

		}

		

		.ccl-comppayout--faq-answer p {

			color: var(--muted);

			line-height: 1.8;

			font-size: 1.05rem;

		}

		

		/* CTA Section */

		.ccl-comppayout--cta-section {

			background: linear-gradient(135deg, var(--cta-dark) 0%, var(--primary-blue) 50%, var(--cta-blue) 100%);

			padding: 100px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-comppayout--cta-section::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

			animation: ccl-comppayout-glow 10s ease-in-out infinite reverse;

		}

		

		.ccl-comppayout--cta-content {

			position: relative;

			z-index: 1;

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-comppayout--cta-content h2 {

			font-family: var(--font-display);

			font-weight: 900;

			font-size: clamp(2.25rem, 4vw, 3.25rem);

			color: var(--white);

			margin-bottom: 24px;

			line-height: 1.2;

		}

		

		.ccl-comppayout--cta-content p {

			font-size: 1.25rem;

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.7;

			margin-bottom: 40px;

		}

		

		.ccl-comppayout--cta-buttons {

			display: flex;

			align-items: center;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

		}

		

		/* Scroll Reveal Animation */

		.ccl-comppayout--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-comppayout--scroll-reveal.revealed {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* Responsive Design */

		@media (max-width: 1024px) {

			.ccl-comppayout--wrapper {

				--section-padding: 80px;

				--card-padding: 32px;

				--grid-gap: 28px;

			}

			

			.ccl-comppayout--info-grid,

			.ccl-comppayout--category-grid,

			.ccl-comppayout--injury-types-grid {

				grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			}

			

			.ccl-comppayout--table-row {

				gap: 16px;

				padding: 24px;

			}

			

			.ccl-comppayout--workcover-table .ccl-comppayout--table-row {

				grid-template-columns: 1fr;

				gap: 12px;

				text-align: center;

			}

			

			.ccl-comppayout--table-label {

				justify-content: center;

			}

			

			.ccl-comppayout--table-value {

				text-align: center;

			}

			

			.ccl-comppayout--table-percent {

				text-align: center;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-comppayout--wrapper {

				--section-padding: 60px;

				--card-padding: 28px;

				--grid-gap: 24px;

			}

			

			.ccl-comppayout--hero {

				padding: 100px 20px 80px;

			}

			

			.ccl-comppayout--section {

				padding: var(--section-padding) 20px;

			}

			

			.ccl-comppayout--section-header {

				margin-bottom: 60px;

			}

			

			.ccl-comppayout--info-grid,

			.ccl-comppayout--category-grid,

			.ccl-comppayout--stats-grid,

			.ccl-comppayout--injury-types-grid {

				grid-template-columns: 1fr;

			}

			

			.ccl-comppayout--table-row {

				grid-template-columns: 1fr;

				gap: 12px;

				text-align: center;

			}

			

			.ccl-comppayout--table-label {

				justify-content: center;

			}

			

			.ccl-comppayout--table-value {

				text-align: center;

			}

			

			.ccl-comppayout--workcover-table .ccl-comppayout--table-row {

				padding: 20px;

			}

			

			.ccl-comppayout--hero-cta {

				flex-direction: column;

				width: 100%;

			}

			

			.ccl-comppayout--btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-comppayout--cta-buttons {

				flex-direction: column;

				width: 100%;

			}

			

			.ccl-comppayout--faq-question {

				padding: 24px 20px;

			}

			

			.ccl-comppayout--faq-answer {

				padding: 0 20px 24px;

			}

			

			.ccl-comppayout--injury-type-section {

				padding: 24px;

			}

			

			.ccl-comppayout--injury-type-header {

				flex-direction: column;

				align-items: flex-start;

				gap: 12px;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-comppayout--wrapper {

				--section-padding: 48px;

				--card-padding: 24px;

			}

			

			.ccl-comppayout--hero {

				padding: 80px 16px 60px;

			}

			

			.ccl-comppayout--section {

				padding: var(--section-padding) 16px;

			}

			

			.ccl-comppayout--section-kicker::before,

			.ccl-comppayout--section-kicker::after {

				width: 20px;

			}

			

			.ccl-comppayout--info-card,

			.ccl-comppayout--category-card,

			.ccl-comppayout--stat-card,

			.ccl-comppayout--injury-type-section {

				padding: 20px;

			}

			

			.ccl-comppayout--table-header,

			.ccl-comppayout--table-row,

			.ccl-comppayout--workcover-table .ccl-comppayout--table-row {

				padding: 16px;

			}

			

			.ccl-comppayout--injury-type-header {

				padding-bottom: 16px;

			}

			

			.ccl-comppayout--injury-type-icon {

				width: 50px;

				height: 50px;

			}

			

			.ccl-comppayout--injury-type-icon i {

				font-size: 1.3rem;

			}

			

			.ccl-comppayout--injury-type-section h3 {

				font-size: 1.25rem;

			}

			

			.ccl-comppayout--workcover-note {

				padding: 20px;

			}

		}

		

		/* Touch Device Enhancements */

		@media (hover: none) and (pointer: coarse) {

			.ccl-comppayout--info-card:hover,

			.ccl-comppayout--category-card:hover,

			.ccl-comppayout--stat-card:hover {

				transform: none;

			}

			

			.ccl-comppayout--info-card:active {

				transform: scale(0.98);

			}

			

			.ccl-comppayout--category-card:active {

				transform: scale(0.98);

			}

			

			.ccl-comppayout--btn:hover {

				transform: none;

			}

			

			.ccl-comppayout--btn:active {

				transform: scale(0.96);

			}

		}

		

		/* Print Styles */

		@media print {

			.ccl-comppayout--hero,

			.ccl-comppayout--cta-section {

				background: var(--white) !important;

				color: var(--ink) !important;

			}

			

			.ccl-comppayout--hero h1,

			.ccl-comppayout--hero-lead,

			.ccl-comppayout--cta-content h2,

			.ccl-comppayout--cta-content p {

				color: var(--ink) !important;

			}

			

			.ccl-comppayout--btn {

				display: none;

			}

		}

		.ccl-comppayout--wrapper {

			/* CSS Variables */

			--primary-blue: #1d63ff;

			--cta-blue: #0b5cff;

			--cta-dark: #0846c1;

			--accent-green: #10b981;

			--accent-gold: #ffa826;

			--ink: #1e293b;

			--muted: #64748b;

			--soft-border: #e5e7eb;

			--white: #ffffff;

			--bg-light: #f9fafb;

			

			/* Typography */

			--font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

			--font-display: 'Inter Tight', var(--font-primary);

			

			/* Spacing */

			--section-padding: 100px;

			--card-padding: 36px;

			--grid-gap: 32px;

			

			/* Animations */

			--transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			--transition-bounce: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);

			

			/* Base Styles */

			margin: 0;

			padding: 0;

			font-family: var(--font-primary);

			color: var(--ink);

			font-size: 16px;

			line-height: 1.6;

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

			overflow-x: hidden;

		}

		

		.ccl-comppayout--wrapper *,.ccl-comppayout--wrapper *::before,.ccl-comppayout--wrapper *::after{box-sizing:border-box;margin:0;padding:0}

		.ccl-comppayout--wrapper main{background:var(--white)}



		/* Reduced motion (applies if class added by JS) */

		.ccl-comppayout--wrapper.reduced-motion *{

			animation: none !important;

			transition: none !important;

			scroll-behavior: auto !important;

		}

		

		/* Hero Section */

		.ccl-comppayout--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 140px 24px 120px;

			text-align: center;

			overflow: hidden;

		}

		.ccl-comppayout--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-comppayout-glow 8s ease-in-out infinite;

		}

		@keyframes ccl-comppayout-glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, -30px) scale(1.1); }

		}

		.ccl-comppayout--hero-content { position: relative; z-index: 1; max-width: 950px; margin: 0 auto; }

		.ccl-comppayout--kicker {

			display: inline-block; background: rgba(255, 255, 255, 0.2); color: var(--white);

			padding: 8px 20px; border-radius: 50px; font-size: 0.9rem; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; margin-bottom: 24px;

			animation: ccl-comppayout-fadeInDown .8s ease-out;

		}

		@keyframes ccl-comppayout-fadeInDown{from{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}

		.ccl-comppayout--hero h1{

			font-family:var(--font-display);font-weight:900;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.1;color:var(--white);margin-bottom:28px;

			animation:ccl-comppayout-fadeInUp .8s ease-out .2s both;

		}

		@keyframes ccl-comppayout-fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

		.ccl-comppayout--hero-lead{font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.7;color:rgba(255,255,255,.95);margin-bottom:40px;animation:ccl-comppayout-fadeInUp .8s ease-out .4s both}

		.ccl-comppayout--hero-cta{display:inline-flex;align-items:center;gap:12px;animation:ccl-comppayout-fadeInUp .8s ease-out .6s both}



		/* Buttons */

		.ccl-comppayout--btn{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;font-family:var(--font-primary);font-size:1.05rem;font-weight:700;text-decoration:none;border-radius:12px;border:2px solid transparent;cursor:pointer;transition:var(--transition-smooth);position:relative;overflow:hidden}

		.ccl-comppayout--btn::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.2);transform:translate(-50%,-50%);transition:width .6s,height .6s}

		.ccl-comppayout--btn:hover::before{width:400px;height:400px}

		.ccl-comppayout--btn span,.ccl-comppayout--btn i{position:relative;z-index:1}

		.ccl-comppayout--btn i{transition:transform .3s ease}

		.ccl-comppayout--btn:hover i{transform:translateX(5px)}

		.ccl-comppayout--btn--primary{background:var(--white);color:var(--primary-blue)}

		.ccl-comppayout--btn--primary:hover{background:var(--white);transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,255,255,.3)}

		.ccl-comppayout--btn--secondary{background:transparent;color:var(--white);border-color:rgba(255,255,255,.4)}

		.ccl-comppayout--btn--secondary:hover{background:rgba(255,255,255,.1);border-color:var(--white);transform:translateY(-2px)}

		

		/* Section Styles */

		.ccl-comppayout--section{padding:var(--section-padding) 24px}

		.ccl-comppayout--section--alt{background:var(--bg-light)}

		.ccl-comppayout--container{max-width:1320px;margin:0 auto}

		.ccl-comppayout--section-header{text-align:center;max-width:850px;margin:0 auto 80px}

		.ccl-comppayout--section-kicker{display:inline-flex;align-items:center;gap:16px;color:var(--primary-blue);font-weight:700;font-size:.95rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px}

		.ccl-comppayout--section-kicker::before,.ccl-comppayout--section-kicker::after{content:'';width:40px;height:2px;background:var(--primary-blue)}

		.ccl-comppayout--section h2{font-family:var(--font-display);font-weight:900;font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.15;color:var(--ink);margin-bottom:24px}

		.ccl-comppayout--section h2 mark{background:linear-gradient(180deg,transparent 60%,rgba(29,99,255,.2) 60%);color:inherit}

		.ccl-comppayout--section-lead{font-size:1.2rem;line-height:1.75;color:var(--muted)}



		/* Info Cards */

		.ccl-comppayout--info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--grid-gap);margin-bottom:60px}

		.ccl-comppayout--info-card{background:var(--white);border:2px solid var(--soft-border);border-radius:24px;padding:var(--card-padding);position:relative;overflow:hidden;transition:var(--transition-smooth)}

		.ccl-comppayout--info-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--primary-blue);transform:scaleX(0);transform-origin:left;transition:transform .4s ease}

		.ccl-comppayout--info-card:hover::before{transform:scaleX(1)}

		.ccl-comppayout--info-card:hover{transform:translateY(-10px);box-shadow:0 20px 60px rgba(29,99,255,.15);border-color:var(--primary-blue)}

		.ccl-comppayout--info-icon{width:85px;height:85px;border-radius:50%;background:linear-gradient(135deg,rgba(29,99,255,.1),rgba(11,92,255,.15));display:flex;align-items:center;justify-content:center;margin-bottom:24px;transition:var(--transition-bounce)}

		.ccl-comppayout--info-icon i{font-size:2.2rem;color:var(--primary-blue);transition:var(--transition-smooth)}

		.ccl-comppayout--info-card:hover .ccl-comppayout--info-icon{transform:rotate(10deg) scale(1.1)}

		.ccl-comppayout--info-card:hover .ccl-comppayout--info-icon i{color:var(--cta-dark)}

		.ccl-comppayout--info-card h3{font-family:var(--font-display);font-weight:800;font-size:1.75rem;color:var(--ink);margin-bottom:16px;line-height:1.3}

		.ccl-comppayout--info-card p{color:var(--muted);line-height:1.7;font-size:1.05rem;margin-bottom:20px}

		.ccl-comppayout--info-list{list-style:none;margin-bottom:24px}

		.ccl-comppayout--info-list li{display:flex;align-items:flex-start;gap:12px;padding:10px 0;color:var(--muted);font-size:1rem}

		.ccl-comppayout--info-list li i{color:var(--accent-green);margin-top:4px;flex-shrink:0}



		/* Category Grid */

		.ccl-comppayout--category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}

		.ccl-comppayout--category-card{background:var(--white);border:2px solid var(--soft-border);border-radius:20px;padding:32px;text-align:center;transition:var(--transition-smooth);position:relative;overflow:hidden}

		.ccl-comppayout--category-card::before{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--primary-blue),var(--cta-blue));transform:translateY(-5px);transition:transform .3s ease}

		.ccl-comppayout--category-card:hover::before{transform:translateY(0)}

		.ccl-comppayout--category-card:hover{transform:translateY(-8px);box-shadow:0 16px 48px rgba(29,99,255,.12);border-color:var(--primary-blue)}

		.ccl-comppayout--category-icon{width:75px;height:75px;border-radius:50%;background:linear-gradient(135deg,rgba(29,99,255,.08),rgba(11,92,255,.12));display:flex;align-items:center;justify-content:center;margin:0 auto 20px;transition:var(--transition-smooth)}

		.ccl-comppayout--category-icon i{font-size:1.8rem;color:var(--primary-blue);transition:var(--transition-smooth)}

		.ccl-comppayout--category-card:hover .ccl-comppayout--category-icon{transform:scale(1.15);background:linear-gradient(135deg,rgba(29,99,255,.15),rgba(11,92,255,.2))}

		.ccl-comppayout--category-card:hover .ccl-comppayout--category-icon i{color:var(--cta-dark)}

		.ccl-comppayout--category-card h3{font-family:var(--font-display);font-weight:800;font-size:1.35rem;color:var(--ink);margin-bottom:12px}

		.ccl-comppayout--category-count{color:var(--muted);font-size:.95rem;font-weight:600;line-height:1.4}



		/* Injury Types Detail */

		.ccl-comppayout--injury-types-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:32px}

		.ccl-comppayout--injury-type-section{background:var(--white);border:2px solid var(--soft-border);border-radius:20px;padding:32px;transition:var(--transition-smooth)}

		.ccl-comppayout--injury-type-section:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(29,99,255,.1);border-color:var(--primary-blue)}

		.ccl-comppayout--injury-type-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:20px;border-bottom:2px solid var(--soft-border)}

		.ccl-comppayout--injury-type-icon{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,rgba(29,99,255,.1),rgba(11,92,255,.15));display:flex;align-items:center;justify-content:center;flex-shrink:0}

		.ccl-comppayout--injury-type-icon i{font-size:1.6rem;color:var(--primary-blue)}

		.ccl-comppayout--injury-type-section h3{font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--ink);margin:0}

		.ccl-comppayout--injury-type-list{list-style:none;margin:0;padding:0}

		.ccl-comppayout--injury-type-list li{display:flex;align-items:center;gap:12px;padding:10px 0;color:var(--muted);font-size:1rem;line-height:1.5;border-bottom:1px solid var(--soft-border);transition:var(--transition-smooth)}

		.ccl-comppayout--injury-type-list li:last-child{border-bottom:none}

		.ccl-comppayout--injury-type-list li:hover{color:var(--ink);padding-left:8px}

		.ccl-comppayout--injury-type-list li i{color:var(--primary-blue);font-size:.75rem;flex-shrink:0}

		.ccl-comppayout--injury-type-note{background:var(--bg-light);border-left:4px solid var(--primary-blue);padding:16px 20px;margin:20px 0;border-radius:8px}

		.ccl-comppayout--injury-type-note p{color:var(--muted);font-size:.95rem;line-height:1.7;margin-bottom:12px}

		.ccl-comppayout--injury-type-note p:last-child{margin-bottom:0}

		.ccl-comppayout--injury-type-note strong{color:var(--ink);font-weight:700}



		/* Snapshot Cards */

		.ccl-comppayout--stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:32px;margin-top:24px}

		.ccl-comppayout--stat-card{text-align:center;padding:28px;background:var(--white);border:2px solid var(--soft-border);border-radius:20px;transition:var(--transition-smooth)}

		.ccl-comppayout--stat-card:hover{transform:translateY(-5px);box-shadow:0 12px 40px rgba(29,99,255,.1);border-color:var(--primary-blue)}

		.ccl-comppayout--stat-value{font-family:var(--font-display);font-weight:900;font-size:clamp(2rem,3.5vw,3rem);color:var(--primary-blue);margin-bottom:8px;line-height:1}

		.ccl-comppayout--stat-label{color:var(--ink);font-weight:700;font-size:1.05rem;margin-bottom:6px}

		.ccl-comppayout--stat-description{color:var(--muted);font-size:.95rem;line-height:1.5}



		/* Payout/Insight Table (repurposed) */

		.ccl-comppayout--payout-table{background:var(--white);border:2px solid var(--soft-border);border-radius:20px;overflow:hidden;margin-top:40px}

		.ccl-comppayout--table-header{background:linear-gradient(135deg,var(--primary-blue),var(--cta-blue));color:var(--white);padding:28px 32px}

		.ccl-comppayout--table-header h3{font-family:var(--font-display);font-weight:800;font-size:1.75rem;margin-bottom:8px}

		.ccl-comppayout--table-header p{opacity:.95;font-size:1.05rem}

		.ccl-comppayout--table-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:28px 32px;border-bottom:1px solid var(--soft-border);transition:background .2s ease}

		.ccl-comppayout--table-row:last-child{border-bottom:none}

		.ccl-comppayout--table-row:hover{background:var(--bg-light)}

		.ccl-comppayout--table-label{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--ink);font-size:1.05rem}

		.ccl-comppayout--table-label i{color:var(--primary-blue);font-size:1.2rem}

		.ccl-comppayout--table-value{font-family:var(--font-display);font-weight:800;font-size:1.25rem;color:var(--primary-blue);text-align:right}



		/* FAQ */

		.ccl-comppayout--faq-list{max-width:900px;margin:0 auto}

		.ccl-comppayout--faq-item{background:var(--white);border:2px solid var(--soft-border);border-radius:16px;margin-bottom:20px;overflow:hidden;transition:var(--transition-smooth)}

		.ccl-comppayout--faq-item:hover{border-color:var(--primary-blue);box-shadow:0 8px 24px rgba(29,99,255,.08)}

		.ccl-comppayout--faq-question{display:flex;align-items:center;justify-content:space-between;padding:28px 32px;cursor:pointer;user-select:none;background:transparent;border:none;width:100%;text-align:left;font-family:var(--font-primary)}

		.ccl-comppayout--faq-question h3{font-family:var(--font-display);font-weight:800;font-size:1.25rem;color:var(--ink);line-height:1.4;flex:1}

		.ccl-comppayout--faq-toggle{width:36px;height:36px;border-radius:50%;background:var(--bg-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:20px;transition:var(--transition-smooth)}

		.ccl-comppayout--faq-toggle i{color:var(--primary-blue);font-size:1.1rem;transition:transform .3s ease}

		.ccl-comppayout--faq-item.active .ccl-comppayout--faq-toggle{background:var(--primary-blue)}

		.ccl-comppayout--faq-item.active .ccl-comppayout--faq-toggle i{color:var(--white);transform:rotate(180deg)}

		.ccl-comppayout--faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease}

		.ccl-comppayout--faq-item.active .ccl-comppayout--faq-answer{max-height:500px;padding:0 32px 28px}

		/* Show FAQ answers by default on mobile/tablet */

		@media (max-width: 1024px){

			.ccl-comppayout--faq-answer{max-height:none;overflow:visible;padding:0 32px 28px}

			.ccl-comppayout--faq-question{pointer-events:none;cursor:default}

			.ccl-comppayout--faq-toggle{display:none}

			.ccl-comppayout--faq-question h3{padding-right:0}

		}

		.ccl-comppayout--faq-answer p{color:var(--muted);line-height:1.8;font-size:1.05rem}



		/* CTA Section */

		.ccl-comppayout--cta-section{background:linear-gradient(135deg,var(--cta-dark) 0%,var(--primary-blue) 50%,var(--cta-blue) 100%);padding:100px 24px;text-align:center;position:relative;overflow:hidden}

		.ccl-comppayout--cta-section::before{content:'';position:absolute;top:-50%;right:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 70%);animation:ccl-comppayout-glow 10s ease-in-out infinite reverse}

		.ccl-comppayout--cta-content{position:relative;z-index:1;max-width:800px;margin:0 auto}

		.ccl-comppayout--cta-content h2{font-family:var(--font-display);font-weight:900;font-size:clamp(2.25rem,4vw,3.25rem);color:var(--white);margin-bottom:24px;line-height:1.2}

		.ccl-comppayout--cta-content p{font-size:1.25rem;color:rgba(255,255,255,.95);line-height:1.7;margin-bottom:40px}

		.ccl-comppayout--cta-buttons{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}



		/* Scroll Reveal */

		.ccl-comppayout--scroll-reveal{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease}

		.ccl-comppayout--scroll-reveal.revealed{opacity:1;transform:translateY(0)}

		

		/* Responsive */

		@media (max-width: 1024px){

			.ccl-comppayout--wrapper{--section-padding:80px;--card-padding:32px;--grid-gap:28px}

			.ccl-comppayout--info-grid,

			.ccl-comppayout--category-grid,

			.ccl-comppayout--injury-types-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}

			.ccl-comppayout--table-row{gap:16px;padding:24px}

			.ccl-comppayout--table-label{justify-content:center}

			.ccl-comppayout--table-value{text-align:center}

		}

		@media (max-width: 768px){

			.ccl-comppayout--wrapper{--section-padding:60px;--card-padding:28px;--grid-gap:24px}

			.ccl-comppayout--hero{padding:100px 20px 80px}

			.ccl-comppayout--section{padding:var(--section-padding) 20px}

			.ccl-comppayout--section-header{margin-bottom:60px}

			.ccl-comppayout--info-grid,.ccl-comppayout--category-grid,.ccl-comppayout--stats-grid,.ccl-comppayout--injury-types-grid{grid-template-columns:1fr}

			.ccl-comppayout--table-row{grid-template-columns:1fr;gap:12px;text-align:center}

			.ccl-comppayout--table-label{justify-content:center}

			.ccl-comppayout--table-value{text-align:center}

			.ccl-comppayout--hero-cta{flex-direction:column;width:100%}

			.ccl-comppayout--btn{width:100%;justify-content:center}

			.ccl-comppayout--cta-buttons{flex-direction:column;width:100%}

			.ccl-comppayout--injury-type-section{padding:24px}

			.ccl-comppayout--injury-type-header{flex-direction:column;align-items:flex-start;gap:12px}

		}

		@media (max-width: 480px){

			.ccl-comppayout--wrapper{--section-padding:48px;--card-padding:24px}

			.ccl-comppayout--hero{padding:80px 16px 60px}

			.ccl-comppayout--section{padding:var(--section-padding) 16px}

			.ccl-comppayout--section-kicker::before,.ccl-comppayout--section-kicker::after{width:20px}

			.ccl-comppayout--info-card,.ccl-comppayout--category-card,.ccl-comppayout--stat-card,.ccl-comppayout--injury-type-section{padding:20px}

			.ccl-comppayout--table-header,.ccl-comppayout--table-row{padding:16px}

			.ccl-comppayout--injury-type-header{padding-bottom:16px}

			.ccl-comppayout--injury-type-icon{width:50px;height:50px}

			.ccl-comppayout--injury-type-icon i{font-size:1.3rem}

			.ccl-comppayout--injury-type-section h3{font-size:1.25rem}

		}

		/* Touch tweaks */

		@media (hover: none) and (pointer: coarse){

			.ccl-comppayout--info-card:hover,

			.ccl-comppayout--category-card:hover,

			.ccl-comppayout--stat-card:hover{transform:none}

			.ccl-comppayout--info-card:active,

			.ccl-comppayout--category-card:active{transform:scale(.98)}

			.ccl-comppayout--btn:hover{transform:none}

			.ccl-comppayout--btn:active{transform:scale(.96)}

		}



		/* Print */

		@media print{

			.ccl-comppayout--hero,.ccl-comppayout--cta-section{background:var(--white) !important;color:var(--ink) !important}

			.ccl-comppayout--hero h1,.ccl-comppayout--hero-lead,.ccl-comppayout--cta-content h2,.ccl-comppayout--cta-content p{color:var(--ink) !important}

			.ccl-comppayout--btn{display:none}

		}

		/* ===================================

		   WRAPPER SCOPED STYLES

		   =================================== */

		

		.ccl-compguide--wrapper {

			/* CSS Variables */

			--ccl-primary-blue: #1d63ff;

			--ccl-cta-blue: #0b5cff;

			--ccl-cta-dark: #0846c1;

			--ccl-accent-green: #10b981;

			--ccl-accent-gold: #ffa826;

			--ccl-ink: #1e293b;

			--ccl-muted: #64748b;

			--ccl-soft-border: #e5e7eb;

			--ccl-white: #ffffff;

			--ccl-bg-light: #f8fafc;

			

			/* Typography */

			font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

			font-size: 16px;

			line-height: 1.7;

			color: var(--ccl-muted);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-compguide--wrapper * {

			margin: 0;

			padding: 0;

			box-sizing: border-box;

		}

		

		.ccl-compguide--wrapper main {

			overflow-x: hidden;

		}

		

		.ccl-compguide--wrapper h1,

		.ccl-compguide--wrapper h2,

		.ccl-compguide--wrapper h3,

		.ccl-compguide--wrapper h4 {

			font-family: 'Inter Tight', 'Inter', sans-serif;

			font-weight: 800;

			color: var(--ccl-ink);

			line-height: 1.2;

		}

		

		.ccl-compguide--wrapper p {

			line-height: 1.7;

		}

		

		.ccl-compguide--wrapper mark {

			background: linear-gradient(120deg, rgba(29, 99, 255, 0.1) 0%, rgba(29, 99, 255, 0.2) 100%);

			color: var(--ccl-primary-blue);

			padding: 0 8px;

			border-radius: 4px;

		}

		

		.ccl-compguide--wrapper a {

			text-decoration: none;

			color: inherit;

		}

		

		.ccl-compguide--wrapper ul {

			list-style: none;

		}

		

		/* ===================================

		   HERO SECTION

		   =================================== */

		

		.ccl-compguide--hero {

			position: relative;

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

			padding: 140px 24px 120px;

			text-align: center;

			overflow: hidden;

		}

		

		.ccl-compguide--hero::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);

			animation: ccl-compguide--glow 15s ease-in-out infinite;

		}

		

		@keyframes ccl-compguide--glow {

			0%, 100% { transform: translate(0, 0) scale(1); }

			50% { transform: translate(30px, 30px) scale(1.1); }

		}

		

		.ccl-compguide--hero-content {

			position: relative;

			z-index: 1;

			max-width: 950px;

			margin: 0 auto;

		}

		

		.ccl-compguide--hero-kicker {

			display: inline-block;

			background: rgba(255, 255, 255, 0.2);

			backdrop-filter: blur(10px);

			color: var(--ccl-white);

			padding: 8px 20px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 600;

			letter-spacing: 0.5px;

			margin-bottom: 24px;

			animation: ccl-compguide--fadeInDown 0.8s ease-out;

		}

		

		@keyframes ccl-compguide--fadeInDown {

			from {

				opacity: 0;

				transform: translateY(-30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-compguide--hero h1 {

			font-size: clamp(2.5rem, 5vw, 4.5rem);

			color: var(--ccl-white);

			margin-bottom: 28px;

			animation: ccl-compguide--fadeInUp 0.8s ease-out 0.2s both;

		}

		

		@keyframes ccl-compguide--fadeInUp {

			from {

				opacity: 0;

				transform: translateY(30px);

			}

			to {

				opacity: 1;

				transform: translateY(0);

			}

		}

		

		.ccl-compguide--hero-lead {

			font-size: clamp(1.1rem, 2vw, 1.35rem);

			color: rgba(255, 255, 255, 0.95);

			line-height: 1.6;

			margin-bottom: 36px;

			animation: ccl-compguide--fadeInUp 0.8s ease-out 0.4s both;

		}

		

		.ccl-compguide--hero-buttons {

			display: flex;

			justify-content: center;

			gap: 16px;

			flex-wrap: wrap;

			margin-top: 36px;

			animation: ccl-compguide--fadeInUp 0.8s ease-out 0.6s both;

		}

		

		/* ===================================

		   SECTION HEADERS

		   =================================== */

		

		.ccl-compguide--section {

			padding: 100px 24px;

		}

		

		.ccl-compguide--section--alt {

			background: var(--ccl-bg-light);

		}

		

		.ccl-compguide--section-header {

			text-align: center;

			max-width: 850px;

			margin: 0 auto 64px;

		}

		

		.ccl-compguide--section-kicker {

			display: inline-flex;

			align-items: center;

			gap: 12px;

			color: var(--ccl-primary-blue);

			font-size: 0.9rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 1px;

			margin-bottom: 16px;

		}

		

		.ccl-compguide--section-kicker::before,

		.ccl-compguide--section-kicker::after {

			content: '';

			width: 32px;

			height: 2px;

			background: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--section h2 {

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			margin-bottom: 24px;

		}

		

		.ccl-compguide--section-lead {

			font-size: 1.2rem;

			color: var(--ccl-muted);

			line-height: 1.7;

		}

		

		/* ===================================

		   INTRO SECTION

		   =================================== */

		

		.ccl-compguide--intro {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-compguide--intro-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

			gap: 32px;

			margin-top: 48px;

		}

		

		.ccl-compguide--intro-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			padding: 32px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-compguide--intro-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			transform: scaleX(0);

			transform-origin: left;

			transition: transform 0.4s ease;

		}

		

		.ccl-compguide--intro-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-compguide--intro-card-icon {

			width: 60px;

			height: 60px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			border-radius: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 20px;

			color: var(--ccl-primary-blue);

			font-size: 1.8rem;

		}

		

		.ccl-compguide--intro-card h3 {

			font-size: 1.4rem;

			margin-bottom: 12px;

			color: var(--ccl-ink);

		}

		

		.ccl-compguide--intro-card p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		/* ===================================

		   INJURY TYPES GRID

		   =================================== */

		

		.ccl-compguide--types-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-compguide--types-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 32px;

		}

		

		.ccl-compguide--type-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 24px;

			padding: 36px;

			position: relative;

			overflow: hidden;

			transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

			cursor: pointer;

		}

		

		.ccl-compguide--type-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 0;

			background: linear-gradient(180deg, var(--ccl-primary-blue), transparent);

			transition: height 0.4s ease;

		}

		

		.ccl-compguide--type-card:hover {

			transform: translateY(-10px);

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.15);

			border-color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--type-card:hover::before {

			height: 4px;

		}

		

		.ccl-compguide--type-card-icon {

			width: 90px;

			height: 90px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			margin-bottom: 24px;

			color: var(--ccl-primary-blue);

			font-size: 2.2rem;

			transition: all 0.4s ease;

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--type-card:hover .ccl-compguide--type-card-icon {

			transform: rotate(10deg) scale(1.05);

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			color: var(--ccl-white);

		}

		

		.ccl-compguide--type-card h3 {

			font-size: 1.75rem;

			margin-bottom: 12px;

			color: var(--ccl-ink);

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--type-card-subtitle {

			display: block;

			color: var(--ccl-primary-blue);

			font-size: 0.9rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 16px;

		}

		

		.ccl-compguide--type-card-desc {

			font-size: 1.05rem;

			line-height: 1.7;

			margin-bottom: 20px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--type-card-list {

			margin-bottom: 24px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--type-card-list li {

			padding-left: 28px;

			position: relative;

			margin-bottom: 10px;

			font-size: 0.95rem;

			color: var(--ccl-muted);

		}

		

		.ccl-compguide--type-card-list li::before {

			content: '\f00c';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-accent-green);

			font-size: 0.85rem;

		}

		

		.ccl-compguide--type-card-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--ccl-primary-blue);

			font-weight: 700;

			font-size: 1rem;

			transition: gap 0.3s ease;

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--type-card:hover .ccl-compguide--type-card-link {

			gap: 12px;

		}

		

		/* ===================================

		   DAMAGES BREAKDOWN

		   =================================== */

		

		.ccl-compguide--damages-container {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-compguide--damages-intro {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			border-left: 4px solid var(--ccl-primary-blue);

			padding: 32px;

			border-radius: 12px;

			margin-bottom: 48px;

		}

		

		.ccl-compguide--damages-intro p {

			font-size: 1.15rem;

			line-height: 1.8;

			color: var(--ccl-ink);

		}

		

		.ccl-compguide--damages-intro strong {

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--damages-grid {

			display: grid;

			gap: 24px;

		}

		

		.ccl-compguide--damage-item {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			padding: 32px;

			transition: all 0.3s ease;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-compguide--damage-item::before {

			content: '';

			position: absolute;

			left: 0;

			top: 0;

			bottom: 0;

			width: 0;

			background: linear-gradient(180deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			transition: width 0.3s ease;

		}

		

		.ccl-compguide--damage-item:hover {

			border-color: var(--ccl-primary-blue);

			transform: translateX(8px);

		}

		

		.ccl-compguide--damage-item:hover::before {

			width: 4px;

		}

		

		.ccl-compguide--damage-item-header {

			display: flex;

			align-items: flex-start;

			gap: 20px;

			margin-bottom: 16px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--damage-item-number {

			flex-shrink: 0;

			width: 48px;

			height: 48px;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			color: var(--ccl-white);

			border-radius: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			font-weight: 900;

			font-size: 1.4rem;

		}

		

		.ccl-compguide--damage-item-title {

			flex: 1;

		}

		

		.ccl-compguide--damage-item h3 {

			font-size: 1.5rem;

			margin-bottom: 4px;

		}

		

		.ccl-compguide--damage-item-meta {

			color: var(--ccl-primary-blue);

			font-size: 0.9rem;

			font-weight: 600;

		}

		

		.ccl-compguide--damage-item-desc {

			font-size: 1.05rem;

			line-height: 1.7;

			position: relative;

			z-index: 1;

		}

		

		/* ===================================

		   PAYOUT INFO SECTION

		   =================================== */

		

		.ccl-compguide--payout-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-compguide--payout-cards {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));

			gap: 28px;

			margin-bottom: 64px;

		}

		

		.ccl-compguide--payout-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			padding: 32px;

			text-align: center;

			transition: all 0.3s ease;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-compguide--payout-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 4px;

			background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			transform: scaleX(0);

			transform-origin: center;

			transition: transform 0.4s ease;

		}

		

		.ccl-compguide--payout-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 32px rgba(29, 99, 255, 0.12);

			border-color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--payout-card:hover::before {

			transform: scaleX(1);

		}

		

		.ccl-compguide--payout-card-label {

			display: inline-block;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			color: var(--ccl-primary-blue);

			padding: 8px 16px;

			border-radius: 50px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 20px;

		}

		

		.ccl-compguide--payout-card-amount {

			font-size: clamp(2rem, 3vw, 2.8rem);

			font-weight: 900;

			color: var(--ccl-ink);

			margin-bottom: 12px;

			font-family: 'Inter Tight', sans-serif;

		}

		

		.ccl-compguide--payout-card-type {

			font-size: 1.1rem;

			font-weight: 700;

			color: var(--ccl-primary-blue);

			margin-bottom: 8px;

		}

		

		.ccl-compguide--payout-card-desc {

			font-size: 0.95rem;

			color: var(--ccl-muted);

			line-height: 1.6;

		}

		

		.ccl-compguide--payout-note {

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.1), rgba(255, 168, 38, 0.15));

			border-left: 4px solid var(--ccl-accent-gold);

			padding: 28px 32px;

			border-radius: 12px;

			margin-top: 48px;

		}

		

		.ccl-compguide--payout-note-title {

			display: flex;

			align-items: center;

			gap: 12px;

			font-size: 1.2rem;

			font-weight: 800;

			color: var(--ccl-ink);

			margin-bottom: 12px;

		}

		

		.ccl-compguide--payout-note-title i {

			color: var(--ccl-accent-gold);

			font-size: 1.5rem;

		}

		

		.ccl-compguide--payout-note p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-ink);

		}

		

		/* ===================================

		   TPD SECTION

		   =================================== */

		

		.ccl-compguide--tpd-container {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-compguide--tpd-grid {

			display: grid;

			grid-template-columns: 1fr 1fr;

			gap: 40px;

			margin-top: 40px;

		}

		

		.ccl-compguide--tpd-content h3 {

			font-size: 1.8rem;

			margin-bottom: 20px;

		}

		

		.ccl-compguide--tpd-content p {

			font-size: 1.05rem;

			line-height: 1.7;

			margin-bottom: 24px;

		}

		

		.ccl-compguide--tpd-list {

			margin-bottom: 24px;

		}

		

		.ccl-compguide--tpd-list h4 {

			font-size: 1.2rem;

			margin-bottom: 16px;

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--tpd-list ul li {

			padding-left: 32px;

			position: relative;

			margin-bottom: 12px;

			font-size: 1.05rem;

			color: var(--ccl-muted);

		}

		

		.ccl-compguide--tpd-list ul li::before {

			content: '\f058';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-accent-green);

			font-size: 1.2rem;

		}

		

		.ccl-compguide--tpd-visual {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			border-radius: 20px;

			padding: 40px;

			display: flex;

			align-items: center;

			justify-content: center;

		}

		

		.ccl-compguide--tpd-icon {

			width: 200px;

			height: 200px;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 5rem;

			box-shadow: 0 20px 40px rgba(29, 99, 255, 0.3);

		}

		

		/* ===================================

		   CLAIMS PROCESS TIMELINE

		   =================================== */

		

		.ccl-compguide--process-container {

			max-width: 1000px;

			margin: 0 auto;

		}

		

		.ccl-compguide--timeline {

			position: relative;

			padding-left: 60px;

			margin-top: 64px;

		}

		

		.ccl-compguide--timeline::before {

			content: '';

			position: absolute;

			left: 20px;

			top: 0;

			bottom: 0;

			width: 4px;

			background: linear-gradient(180deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		}

		

		.ccl-compguide--timeline-item {

			position: relative;

			margin-bottom: 48px;

		}

		

		.ccl-compguide--timeline-item:last-child {

			margin-bottom: 0;

		}

		

		.ccl-compguide--timeline-marker {

			position: absolute;

			left: -60px;

			top: 0;

		}

		

		.ccl-compguide--timeline-number {

			width: 44px;

			height: 44px;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-weight: 900;

			font-size: 1.3rem;

			box-shadow: 0 4px 12px rgba(29, 99, 255, 0.3);

		}

		

		.ccl-compguide--timeline-content {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			padding: 32px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--timeline-content:hover {

			border-color: var(--ccl-primary-blue);

			transform: translateX(8px);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-compguide--timeline-content h3 {

			font-size: 1.5rem;

			margin-bottom: 12px;

			color: var(--ccl-ink);

		}

		

		.ccl-compguide--timeline-content p {

			font-size: 1.05rem;

			line-height: 1.7;

			margin-bottom: 16px;

		}

		

		.ccl-compguide--timeline-content ul {

			list-style: none;

		}

		

		.ccl-compguide--timeline-content ul li {

			padding-left: 28px;

			position: relative;

			margin-bottom: 8px;

			font-size: 0.95rem;

			color: var(--ccl-muted);

		}

		

		.ccl-compguide--timeline-content ul li::before {

			content: '\f0da';

			font-family: 'Font Awesome 6 Free';

			font-weight: 900;

			position: absolute;

			left: 0;

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--process-note {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.15));

			border-left: 4px solid var(--ccl-accent-green);

			border-radius: 12px;

			padding: 32px;

			margin-top: 48px;

			display: flex;

			gap: 20px;

			align-items: flex-start;

		}

		

		.ccl-compguide--process-note-icon {

			flex-shrink: 0;

			width: 60px;

			height: 60px;

			background: var(--ccl-accent-green);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 1.8rem;

		}

		

		.ccl-compguide--process-note-content h3 {

			font-size: 1.4rem;

			color: var(--ccl-ink);

			margin-bottom: 8px;

		}

		

		.ccl-compguide--process-note-content p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-ink);

		}

		

		/* ===================================

		   IMMEDIATE ACTIONS SECTION

		   =================================== */

		

		.ccl-compguide--actions-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-compguide--actions-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

		}

		

		.ccl-compguide--action-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			padding: 32px;

			position: relative;

			overflow: hidden;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--action-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 32px rgba(29, 99, 255, 0.12);

			border-color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--action-badge {

			display: inline-block;

			padding: 6px 14px;

			border-radius: 50px;

			font-size: 0.8rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 20px;

		}

		

		.ccl-compguide--action-badge--critical {

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.2));

			color: #dc2626;

		}

		

		.ccl-compguide--action-badge--important {

			background: linear-gradient(135deg, rgba(249, 115, 22, 0.1), rgba(249, 115, 22, 0.2));

			color: #ea580c;

		}

		

		.ccl-compguide--action-badge--recommended {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(29, 99, 255, 0.15));

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--action-icon {

			width: 70px;

			height: 70px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-primary-blue);

			font-size: 2rem;

			margin-bottom: 20px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--action-card:hover .ccl-compguide--action-icon {

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			color: var(--ccl-white);

			transform: scale(1.1);

		}

		

		.ccl-compguide--action-card h3 {

			font-size: 1.4rem;

			margin-bottom: 12px;

		}

		

		.ccl-compguide--action-card p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		.ccl-compguide--actions-warning {

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.15));

			border-left: 4px solid #dc2626;

			border-radius: 12px;

			padding: 32px;

			margin-top: 48px;

			display: flex;

			gap: 20px;

			align-items: flex-start;

		}

		

		.ccl-compguide--actions-warning-icon {

			flex-shrink: 0;

			width: 60px;

			height: 60px;

			background: #dc2626;

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 1.8rem;

		}

		

		.ccl-compguide--actions-warning-content h3 {

			font-size: 1.4rem;

			color: var(--ccl-ink);

			margin-bottom: 8px;

		}

		

		.ccl-compguide--actions-warning-content p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-ink);

		}

		

		/* ===================================

		   BARRIERS TO RECOVERY

		   =================================== */

		

		.ccl-compguide--barriers-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-compguide--barriers-intro {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			border-radius: 16px;

			padding: 32px;

			margin-bottom: 48px;

		}

		

		.ccl-compguide--barriers-intro p {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--ccl-ink);

		}

		

		.ccl-compguide--barriers-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

			margin-bottom: 48px;

		}

		

		.ccl-compguide--barrier-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			padding: 32px;

			text-align: center;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--barrier-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 32px rgba(239, 68, 68, 0.12);

			border-color: #dc2626;

		}

		

		.ccl-compguide--barrier-icon {

			width: 80px;

			height: 80px;

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: #dc2626;

			font-size: 2.2rem;

			margin: 0 auto 20px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--barrier-card:hover .ccl-compguide--barrier-icon {

			background: #dc2626;

			color: var(--ccl-white);

			transform: rotate(-10deg) scale(1.1);

		}

		

		.ccl-compguide--barrier-card h3 {

			font-size: 1.5rem;

			margin-bottom: 12px;

		}

		

		.ccl-compguide--barrier-card p {

			font-size: 1.05rem;

			line-height: 1.7;

			text-align: left;

		}

		

		.ccl-compguide--barriers-quote {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			border-left: 4px solid var(--ccl-primary-blue);

			border-radius: 12px;

			padding: 40px;

			position: relative;

		}

		

		.ccl-compguide--barriers-quote i {

			position: absolute;

			top: 30px;

			left: 30px;

			font-size: 3rem;

			color: var(--ccl-primary-blue);

			opacity: 0.2;

		}

		

		.ccl-compguide--barriers-quote p {

			font-size: 1.2rem;

			line-height: 1.8;

			color: var(--ccl-ink);

			font-style: italic;

			padding-left: 60px;

		}

		

		/* ===================================

		   EXPERT ADVICE SECTION

		   =================================== */

		

		.ccl-compguide--expert-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-compguide--expert-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

		}

		

		.ccl-compguide--expert-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			padding: 32px;

			position: relative;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--expert-card:hover {

			border-color: var(--ccl-primary-blue);

			transform: translateY(-6px);

			box-shadow: 0 12px 28px rgba(29, 99, 255, 0.15);

		}

		

		.ccl-compguide--expert-number {

			display: inline-block;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			color: var(--ccl-white);

			padding: 8px 16px;

			border-radius: 50px;

			font-size: 0.9rem;

			font-weight: 900;

			margin-bottom: 16px;

		}

		

		.ccl-compguide--expert-card h3 {

			font-size: 1.4rem;

			margin-bottom: 12px;

		}

		

		.ccl-compguide--expert-card p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		.ccl-compguide--expert-callout {

			background: linear-gradient(135deg, var(--ccl-accent-gold), #f59e0b);

			border-radius: 20px;

			padding: 48px;

			margin-top: 48px;

			text-align: center;

		}

		

		.ccl-compguide--expert-callout-content h3 {

			font-size: 2rem;

			color: var(--ccl-white);

			margin-bottom: 16px;

		}

		

		.ccl-compguide--expert-callout-content p {

			font-size: 1.15rem;

			line-height: 1.8;

			color: rgba(255, 255, 255, 0.95);

		}

		

		/* ===================================

		   COMMON MISTAKES SECTION

		   =================================== */

		

		.ccl-compguide--mistakes-container {

			max-width: 1200px;

			margin: 0 auto;

		}

		

		.ccl-compguide--mistakes-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));

			gap: 28px;

		}

		

		.ccl-compguide--mistake-card {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			padding: 32px;

			text-align: center;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--mistake-card:hover {

			transform: translateY(-8px);

			box-shadow: 0 16px 32px rgba(239, 68, 68, 0.12);

			border-color: #dc2626;

		}

		

		.ccl-compguide--mistake-icon {

			width: 80px;

			height: 80px;

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: #dc2626;

			font-size: 2.5rem;

			margin: 0 auto 20px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--mistake-card:hover .ccl-compguide--mistake-icon {

			background: #dc2626;

			color: var(--ccl-white);

			animation: ccl-compguide--shake 0.5s ease;

		}

		

		@keyframes ccl-compguide--shake {

			0%, 100% { transform: translateX(0); }

			25% { transform: translateX(-10px) rotate(-5deg); }

			75% { transform: translateX(10px) rotate(5deg); }

		}

		

		.ccl-compguide--mistake-card h3 {

			font-size: 1.4rem;

			margin-bottom: 12px;

		}

		

		.ccl-compguide--mistake-card p {

			font-size: 1.05rem;

			line-height: 1.7;

			text-align: left;

		}

		

		/* ===================================

		   COMPARISON TABLE

		   =================================== */

		

		.ccl-compguide--comparison-container {

			max-width: 1100px;

			margin: 0 auto;

		}

		

		.ccl-compguide--comparison-table {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 20px;

			overflow: hidden;

		}

		

		.ccl-compguide--comparison-header {

			display: grid;

			grid-template-columns: 2fr 3fr 3fr;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

			padding: 24px;

			border-bottom: 2px solid var(--ccl-soft-border);

		}

		

		.ccl-compguide--comparison-header h3 {

			font-size: 1.3rem;

			text-align: center;

		}

		

		.ccl-compguide--comparison-col--without h3 {

			color: #dc2626;

		}

		

		.ccl-compguide--comparison-col--with h3 {

			color: var(--ccl-accent-green);

		}

		

		.ccl-compguide--comparison-row {

			display: grid;

			grid-template-columns: 2fr 3fr 3fr;

			border-bottom: 1px solid var(--ccl-soft-border);

			transition: background 0.3s ease;

		}

		

		.ccl-compguide--comparison-row:last-child {

			border-bottom: none;

		}

		

		.ccl-compguide--comparison-row:hover {

			background: rgba(29, 99, 255, 0.02);

		}

		

		.ccl-compguide--comparison-label {

			padding: 28px 24px;

			background: rgba(29, 99, 255, 0.03);

			display: flex;

			align-items: center;

		}

		

		.ccl-compguide--comparison-label h4 {

			font-size: 1.1rem;

			color: var(--ccl-ink);

		}

		

		.ccl-compguide--comparison-col {

			padding: 28px 24px;

			display: flex;

			flex-direction: column;

			align-items: center;

			text-align: center;

			gap: 12px;

		}

		

		.ccl-compguide--comparison-col i {

			font-size: 1.8rem;

			flex-shrink: 0;

		}

		

		.ccl-compguide--comparison-col--without i {

			color: #dc2626;

		}

		

		.ccl-compguide--comparison-col--with i {

			color: var(--ccl-accent-green);

		}

		

		.ccl-compguide--comparison-col p {

			font-size: 0.95rem;

			line-height: 1.6;

		}

		

		.ccl-compguide--comparison-outcome {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(16, 185, 129, 0.15));

			border-left: 4px solid var(--ccl-accent-green);

			border-radius: 12px;

			padding: 32px;

			margin-top: 48px;

			display: flex;

			gap: 20px;

			align-items: flex-start;

		}

		

		.ccl-compguide--comparison-outcome-icon {

			flex-shrink: 0;

			width: 70px;

			height: 70px;

			background: var(--ccl-accent-green);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-size: 2rem;

		}

		

		.ccl-compguide--comparison-outcome-content h3 {

			font-size: 1.6rem;

			color: var(--ccl-ink);

			margin-bottom: 12px;

		}

		

		.ccl-compguide--comparison-outcome-content p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-ink);

			margin-bottom: 16px;

		}

		

		.ccl-compguide--comparison-outcome-content p:last-child {

			margin-bottom: 0;

		}

		

		/* ===================================

		   REDESIGNED SECTIONS CSS

		   =================================== */

		

		/* Payout Bars Layout */

		.ccl-compguide--payout-bars {

			display: flex;

			flex-direction: column;

			gap: 16px;

			margin-bottom: 48px;

		}

		

		.ccl-compguide--payout-bar {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 12px;

			padding: 24px;

			position: relative;

			overflow: hidden;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--payout-bar:hover {

			border-color: var(--ccl-primary-blue);

			transform: translateX(8px);

		}

		

		.ccl-compguide--payout-bar-header {

			display: flex;

			justify-content: space-between;

			align-items: flex-start;

			margin-bottom: 12px;

			flex-wrap: wrap;

			gap: 12px;

		}

		

		.ccl-compguide--payout-bar-label {

			display: flex;

			align-items: center;

			gap: 12px;

			flex-wrap: wrap;

		}

		

		.ccl-compguide--payout-bar-badge {

			display: inline-block;

			padding: 4px 12px;

			border-radius: 50px;

			font-size: 0.75rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

		}

		

		.ccl-compguide--payout-bar--critical .ccl-compguide--payout-bar-badge {

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.15), rgba(239, 68, 68, 0.2));

			color: #dc2626;

		}

		

		.ccl-compguide--payout-bar--severe .ccl-compguide--payout-bar-badge {

			background: linear-gradient(135deg, rgba(249, 115, 22, 0.15), rgba(249, 115, 22, 0.2));

			color: #ea580c;

		}

		

		.ccl-compguide--payout-bar--serious .ccl-compguide--payout-bar-badge {

			background: linear-gradient(135deg, rgba(255, 168, 38, 0.15), rgba(255, 168, 38, 0.2));

			color: var(--ccl-accent-gold);

		}

		

		.ccl-compguide--payout-bar--fatal .ccl-compguide--payout-bar-badge {

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.15), rgba(29, 99, 255, 0.2));

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--payout-bar--moderate .ccl-compguide--payout-bar-badge {

			background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(16, 185, 129, 0.2));

			color: var(--ccl-accent-green);

		}

		

		.ccl-compguide--payout-bar--minor .ccl-compguide--payout-bar-badge {

			background: linear-gradient(135deg, rgba(100, 116, 139, 0.15), rgba(100, 116, 139, 0.2));

			color: var(--ccl-muted);

		}

		

		.ccl-compguide--payout-bar-label h3 {

			font-size: 1.3rem;

			margin: 0;

		}

		

		.ccl-compguide--payout-bar-amount {

			font-size: 2rem;

			font-weight: 900;

			color: var(--ccl-ink);

			font-family: 'Inter Tight', sans-serif;

		}

		

		.ccl-compguide--payout-bar-desc {

			font-size: 0.95rem;

			color: var(--ccl-muted);

			line-height: 1.6;

			margin-bottom: 16px;

		}

		

		.ccl-compguide--payout-bar-fill {

			height: 8px;

			background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			border-radius: 4px;

		}

		

		.ccl-compguide--payout-bar--critical .ccl-compguide--payout-bar-fill { width: 100%; }

		.ccl-compguide--payout-bar--severe .ccl-compguide--payout-bar-fill { width: 58%; }

		.ccl-compguide--payout-bar--serious .ccl-compguide--payout-bar-fill { width: 24%; }

		.ccl-compguide--payout-bar--fatal .ccl-compguide--payout-bar-fill { width: 22%; }

		.ccl-compguide--payout-bar--moderate .ccl-compguide--payout-bar-fill { width: 10%; }

		.ccl-compguide--payout-bar--minor .ccl-compguide--payout-bar-fill { width: 5%; }

		

		/* Process List (formerly timeline) */

		.ccl-compguide--process-list {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-compguide--process-step {

			display: flex;

			gap: 24px;

			margin-bottom: 32px;

			padding-bottom: 32px;

			border-bottom: 1px solid var(--ccl-soft-border);

		}

		

		.ccl-compguide--process-step:last-child {

			border-bottom: none;

			margin-bottom: 0;

			padding-bottom: 0;

		}

		

		.ccl-compguide--process-step-number {

			flex-shrink: 0;

			width: 50px;

			height: 50px;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-white);

			font-weight: 900;

			font-size: 1.5rem;

		}

		

		.ccl-compguide--process-step-content h3 {

			font-size: 1.4rem;

			margin-bottom: 8px;

		}

		

		.ccl-compguide--process-step-content p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		/* Actions Checklist */

		.ccl-compguide--actions-checklist {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-compguide--action-item {

			display: flex;

			gap: 20px;

			margin-bottom: 28px;

			padding: 24px;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--action-item:hover {

			border-color: var(--ccl-primary-blue);

			transform: translateX(6px);

		}

		

		.ccl-compguide--action-item--critical {

			border-left: 4px solid #dc2626;

		}

		

		.ccl-compguide--action-item--important {

			border-left: 4px solid #ea580c;

		}

		

		.ccl-compguide--action-item--recommended {

			border-left: 4px solid var(--ccl-primary-blue);

		}

		

		.ccl-compguide--action-item-marker {

			flex-shrink: 0;

			display: flex;

			flex-direction: column;

			align-items: center;

			gap: 8px;

		}

		

		.ccl-compguide--action-item-marker i {

			font-size: 2rem;

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--action-item--critical .ccl-compguide--action-item-marker i {

			color: #dc2626;

		}

		

		.ccl-compguide--action-item--important .ccl-compguide--action-item-marker i {

			color: #ea580c;

		}

		

		.ccl-compguide--action-item-priority {

			font-size: 0.7rem;

			font-weight: 700;

			text-transform: uppercase;

			padding: 4px 8px;

			border-radius: 4px;

			letter-spacing: 0.5px;

		}

		

		.ccl-compguide--action-item--critical .ccl-compguide--action-item-priority {

			background: rgba(239, 68, 68, 0.15);

			color: #dc2626;

		}

		

		.ccl-compguide--action-item--important .ccl-compguide--action-item-priority {

			background: rgba(249, 115, 22, 0.15);

			color: #ea580c;

		}

		

		.ccl-compguide--action-item--recommended .ccl-compguide--action-item-priority {

			background: rgba(29, 99, 255, 0.15);

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--action-item-content h3 {

			font-size: 1.3rem;

			margin-bottom: 8px;

		}

		

		.ccl-compguide--action-item-content p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		/* Barriers List */

		.ccl-compguide--barriers-list {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-compguide--barrier-item {

			display: flex;

			gap: 20px;

			margin-bottom: 24px;

			padding-bottom: 24px;

			border-bottom: 1px solid var(--ccl-soft-border);

		}

		

		.ccl-compguide--barrier-item:last-child {

			border-bottom: none;

			margin-bottom: 0;

			padding-bottom: 0;

		}

		

		.ccl-compguide--barrier-item-icon {

			flex-shrink: 0;

			width: 50px;

			height: 50px;

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: #dc2626;

			font-size: 1.5rem;

		}

		

		.ccl-compguide--barrier-item-content h3 {

			font-size: 1.4rem;

			margin-bottom: 8px;

			color: var(--ccl-ink);

		}

		

		.ccl-compguide--barrier-item-content p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		/* Expert List */

		.ccl-compguide--expert-list {

			max-width: 900px;

			margin: 0 auto;

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));

			gap: 20px;

		}

		

		.ccl-compguide--expert-item {

			display: flex;

			gap: 16px;

			padding: 20px;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 12px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--expert-item:hover {

			border-color: var(--ccl-primary-blue);

			transform: translateY(-4px);

			box-shadow: 0 8px 20px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-compguide--expert-item-number {

			flex-shrink: 0;

			width: 40px;

			height: 40px;

			background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

			color: var(--ccl-white);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-weight: 900;

			font-size: 1.1rem;

		}

		

		.ccl-compguide--expert-item-content h3 {

			font-size: 1.2rem;

			margin-bottom: 8px;

		}

		

		.ccl-compguide--expert-item-content p {

			font-size: 0.95rem;

			line-height: 1.6;

		}

		

		/* Mistakes List */

		.ccl-compguide--mistakes-list {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-compguide--mistake-item {

			display: flex;

			gap: 20px;

			margin-bottom: 24px;

			padding: 20px;

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-left: 4px solid #dc2626;

			border-radius: 12px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--mistake-item:hover {

			border-color: #dc2626;

			transform: translateX(6px);

		}

		

		.ccl-compguide--mistake-item-icon {

			flex-shrink: 0;

			width: 50px;

			height: 50px;

			background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(239, 68, 68, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: #dc2626;

			font-size: 1.8rem;

		}

		

		.ccl-compguide--mistake-item-content h3 {

			font-size: 1.3rem;

			margin-bottom: 8px;

		}

		

		.ccl-compguide--mistake-item-content p {

			font-size: 1.05rem;

			line-height: 1.7;

		}

		

		/* ===================================

		   FAQ SECTION

		   =================================== */

		

		.ccl-compguide--faq-container {

			max-width: 900px;

			margin: 0 auto;

		}

		

		.ccl-compguide--faq-list {

			display: grid;

			gap: 20px;

		}

		

		.ccl-compguide--faq-item {

			background: var(--ccl-white);

			border: 2px solid var(--ccl-soft-border);

			border-radius: 16px;

			overflow: hidden;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--faq-item.is-active {

			border-color: var(--ccl-primary-blue);

			box-shadow: 0 8px 24px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-compguide--faq-question {

			width: 100%;

			background: none;

			border: none;

			padding: 28px 32px;

			text-align: left;

			cursor: pointer;

			display: flex;

			align-items: center;

			justify-content: space-between;

			gap: 20px;

			transition: all 0.3s ease;

		}

		

		.ccl-compguide--faq-question:hover {

			background: rgba(29, 99, 255, 0.03);

		}

		

		.ccl-compguide--faq-question h3 {

			font-size: 1.25rem;

			color: var(--ccl-ink);

			flex: 1;

		}

		

		.ccl-compguide--faq-icon {

			width: 40px;

			height: 40px;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			color: var(--ccl-primary-blue);

			font-size: 1.2rem;

			transition: all 0.3s ease;

			flex-shrink: 0;

		}

		

		.ccl-compguide--faq-item.is-active .ccl-compguide--faq-icon {

			background: var(--ccl-primary-blue);

			color: var(--ccl-white);

			transform: rotate(180deg);

		}

		

		.ccl-compguide--faq-answer {

			max-height: 0;

			overflow: hidden;

			transition: max-height 0.4s ease, padding 0.4s ease;

		}

		

		.ccl-compguide--faq-item.is-active .ccl-compguide--faq-answer {

			max-height: 500px;

			padding: 0 32px 28px;

		}

		

		.ccl-compguide--faq-answer p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-muted);

		}

		

		/* ===================================

		   CTA SECTION

		   =================================== */

		

		.ccl-compguide--cta {

			background: linear-gradient(135deg, #0846c1 0%, #1d63ff 100%);

			padding: 80px 24px;

			text-align: center;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-compguide--cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -50%;

			width: 200%;

			height: 200%;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);

			animation: ccl-compguide--glow 20s ease-in-out infinite;

		}

		

		.ccl-compguide--cta-content {

			position: relative;

			z-index: 1;

			max-width: 800px;

			margin: 0 auto;

		}

		

		.ccl-compguide--cta h2 {

			font-size: clamp(2rem, 4vw, 3rem);

			color: var(--ccl-white);

			margin-bottom: 20px;

		}

		

		.ccl-compguide--cta p {

			font-size: 1.2rem;

			color: rgba(255, 255, 255, 0.9);

			margin-bottom: 36px;

			line-height: 1.6;

		}

		

		.ccl-compguide--cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

		}

		

		/* ===================================

		   BUTTONS

		   =================================== */

		

		.ccl-compguide--btn {

			display: inline-flex;

			align-items: center;

			justify-content: center;

			gap: 10px;

			padding: 16px 32px;

			font-size: 1.05rem;

			font-weight: 700;

			border-radius: 12px;

			border: none;

			cursor: pointer;

			transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

			text-decoration: none;

			font-family: 'Inter', sans-serif;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-compguide--btn::before {

			content: '';

			position: absolute;

			top: 50%;

			left: 50%;

			width: 0;

			height: 0;

			border-radius: 50%;

			background: rgba(255, 255, 255, 0.3);

			transform: translate(-50%, -50%);

			transition: width 0.6s ease, height 0.6s ease;

		}

		

		.ccl-compguide--btn:hover::before {

			width: 300px;

			height: 300px;

		}

		

		.ccl-compguide--btn span {

			position: relative;

			z-index: 1;

		}

		

		.ccl-compguide--btn i {

			position: relative;

			z-index: 1;

			transition: transform 0.3s ease;

		}

		

		.ccl-compguide--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-compguide--btn--primary {

			background: var(--ccl-white);

			color: var(--ccl-primary-blue);

		}

		

		.ccl-compguide--btn--primary:hover {

			transform: translateY(-2px);

			box-shadow: 0 12px 24px rgba(255, 255, 255, 0.3);

		}

		

		.ccl-compguide--btn--secondary {

			background: transparent;

			color: var(--ccl-white) !important;

			border: 2px solid var(--ccl-white);

		}

		

		.ccl-compguide--btn--secondary:hover {

			background: var(--ccl-white);

			color: var(--ccl-primary-blue) !important;

			transform: translateY(-2px);

		}

		

		.ccl-compguide--btn--secondary span,

		.ccl-compguide--btn--secondary i {

			color: inherit !important;

		}

		

		.ccl-compguide--btn--secondary * {

			color: inherit !important;

		}

		

		/* ===================================

		   SCROLL REVEAL

		   =================================== */

		

		.ccl-compguide--scroll-reveal {

			opacity: 0;

			transform: translateY(40px);

			transition: opacity 0.8s ease, transform 0.8s ease;

		}

		

		.ccl-compguide--scroll-reveal.is-visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ===================================

		   RESPONSIVE

		   =================================== */

		

		@media (max-width: 1024px) {

			.ccl-compguide--wrapper {

				font-size: 15px;

			}

			

			.ccl-compguide--section {

				padding: 80px 20px;

			}

			

			.ccl-compguide--hero {

				padding: 120px 20px 100px;

			}

			

			.ccl-compguide--types-grid,

			.ccl-compguide--intro-grid {

				grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

				gap: 24px;

			}

			

			.ccl-compguide--tpd-grid {

				grid-template-columns: 1fr;

				gap: 32px;

			}

			

			.ccl-compguide--tpd-visual {

				order: -1;

			}

			

			.ccl-compguide--expert-list {

				grid-template-columns: 1fr;

			}

			

			.ccl-compguide--comparison-header,

			.ccl-compguide--comparison-row {

				grid-template-columns: 1fr 2fr 2fr;

			}

		}

		

		@media (max-width: 768px) {

			.ccl-compguide--wrapper {

				font-size: 14px;

			}

			

			.ccl-compguide--section {

				padding: 60px 16px;

			}

			

			.ccl-compguide--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-compguide--hero-buttons {

				flex-direction: column;

				gap: 12px;

			}

			

			.ccl-compguide--hero-buttons .ccl-compguide--btn {

				width: 100%;

			}

			

			.ccl-compguide--section-header {

				margin-bottom: 48px;

			}

			

			.ccl-compguide--types-grid,

			.ccl-compguide--intro-grid {

				grid-template-columns: 1fr;

				gap: 20px;

			}

			

			.ccl-compguide--type-card,

			.ccl-compguide--intro-card {

				padding: 28px;

			}

			

			.ccl-compguide--damage-item {

				padding: 24px;

			}

			

			.ccl-compguide--process-step {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-compguide--process-step-number {

				width: 44px;

				height: 44px;

				font-size: 1.3rem;

			}

			

			.ccl-compguide--action-item,

			.ccl-compguide--barrier-item,

			.ccl-compguide--mistake-item {

				flex-direction: column;

				gap: 16px;

			}

			

			.ccl-compguide--action-item-marker,

			.ccl-compguide--barrier-item-icon,

			.ccl-compguide--mistake-item-icon {

				align-self: flex-start;

			}

			

			.ccl-compguide--expert-list {

				grid-template-columns: 1fr;

			}

			

			.ccl-compguide--payout-bar-header {

				flex-direction: column;

			}

			

			.ccl-compguide--payout-bar-amount {

				font-size: 1.75rem;

			}

			

			.ccl-compguide--process-note,

			.ccl-compguide--actions-warning,

			.ccl-compguide--comparison-outcome {

				flex-direction: column;

				padding: 24px;

			}

			

			.ccl-compguide--expert-callout {

				padding: 32px 24px;

			}

			

			.ccl-compguide--barriers-quote {

				padding: 28px 24px;

			}

			

			.ccl-compguide--barriers-quote i {

				font-size: 2rem;

				top: 20px;

				left: 20px;

			}

			

			.ccl-compguide--barriers-quote p {

				padding-left: 40px;

				font-size: 1.05rem;

			}

			

			.ccl-compguide--comparison-header {

				display: none;

			}

			

			.ccl-compguide--comparison-row {

				grid-template-columns: 1fr;

				gap: 0;

			}

			

			.ccl-compguide--comparison-label {

				background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.08));

				border-bottom: 2px solid var(--ccl-soft-border);

			}

			

			.ccl-compguide--comparison-col::before {

				content: attr(data-label);

				font-weight: 700;

				font-size: 0.85rem;

				text-transform: uppercase;

				letter-spacing: 0.5px;

				margin-bottom: 8px;

			}

			

			.ccl-compguide--comparison-col--without::before {

				content: 'Without Lawyer';

				color: #dc2626;

			}

			

			.ccl-compguide--comparison-col--with::before {

				content: 'With Expert Lawyer';

				color: var(--ccl-accent-green);

			}

		}

		

		@media (max-width: 768px) {

			.ccl-compguide--wrapper {

				font-size: 14px;

			}

			

			.ccl-compguide--section {

				padding: 60px 16px;

			}

			

			.ccl-compguide--hero {

				padding: 100px 16px 80px;

			}

			

			.ccl-compguide--hero-stats {

				gap: 32px;

			}

			

			.ccl-compguide--section-header {

				margin-bottom: 48px;

			}

			

			.ccl-compguide--types-grid,

			.ccl-compguide--intro-grid,

			.ccl-compguide--payout-cards {

				grid-template-columns: 1fr;

				gap: 20px;

			}

			

			.ccl-compguide--type-card,

			.ccl-compguide--intro-card,

			.ccl-compguide--payout-card {

				padding: 28px;

			}

			

			.ccl-compguide--damage-item {

				padding: 24px;

			}

			

			.ccl-compguide--faq-question {

				padding: 20px 24px;

			}

			

			.ccl-compguide--faq-item.is-active .ccl-compguide--faq-answer {

				padding: 0 24px 20px;

			}

			

			.ccl-compguide--cta {

				padding: 60px 16px;

			}

			

			.ccl-compguide--cta-buttons {

				flex-direction: column;

			}

			

			.ccl-compguide--btn {

				width: 100%;

			}

		}

		

		@media (max-width: 480px) {

			.ccl-compguide--hero-buttons {

				gap: 10px;

			}

			

			.ccl-compguide--section-kicker::before,

			.ccl-compguide--section-kicker::after {

				width: 20px;

			}

			

			.ccl-compguide--type-card-icon {

				width: 70px;

				height: 70px;

				font-size: 1.8rem;

			}

			

			.ccl-compguide--tpd-icon {

				width: 150px;

				height: 150px;

				font-size: 4rem;

			}

			

			.ccl-compguide--process-note-icon,

			.ccl-compguide--actions-warning-icon,

			.ccl-compguide--comparison-outcome-icon {

				width: 50px;

				height: 50px;

				font-size: 1.5rem;

			}

			

			.ccl-compguide--process-step-number {

				width: 40px;

				height: 40px;

				font-size: 1.2rem;

			}

			

			.ccl-compguide--action-item-marker i,

			.ccl-compguide--barrier-item-icon,

			.ccl-compguide--mistake-item-icon {

				font-size: 1.5rem;

			}

			

			.ccl-compguide--payout-bar {

				padding: 20px;

			}

			

			.ccl-compguide--payout-bar-amount {

				font-size: 1.5rem;

			}

		}

		/* ===================================

		   WRAPPER & CORE VARIABLES

		   =================================== */

		

		.ccl-roadv2--wrapper {

			/* Brand Colors */

			--ccl-roadv2-primary-blue: #1d63ff;

			--ccl-roadv2-cta-blue: #0b5cff;

			--ccl-roadv2-cta-dark: #0846c1;

			--ccl-roadv2-accent-green: #10b981;

			--ccl-roadv2-accent-gold: #ffa826;

			--ccl-roadv2-ink: #1e293b;

			--ccl-roadv2-muted: #64748b;

			--ccl-roadv2-soft-border: #e5e7eb;

			--ccl-roadv2-white: #ffffff;

			--ccl-roadv2-bg-light: #f8fafc;

			

			/* Typography */

			--ccl-roadv2-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

			--ccl-roadv2-font-display: 'Inter Tight', 'Inter', sans-serif;

			

			/* Layout */

			--ccl-roadv2-container-width: 1320px;

			--ccl-roadv2-section-gap: 120px;

			

			/* Effects */

			--ccl-roadv2-transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);

			--ccl-roadv2-transition-base: 0.35s cubic-bezier(0.4, 0, 0.2, 1);

			--ccl-roadv2-transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);

			

			/* Base Styles */

			font-family: var(--ccl-roadv2-font-primary);

			font-size: 17px;

			line-height: 1.65;

			color: var(--ccl-roadv2-muted);

			background: var(--ccl-roadv2-white);

			-webkit-font-smoothing: antialiased;

			-moz-osx-font-smoothing: grayscale;

		}

		

		.ccl-roadv2--wrapper main {

			overflow-x: hidden;

		}

		

		/* ===================================

		   HERO SECTION - SPLIT DESIGN

		   =================================== */

		

		.ccl-roadv2--hero {

			min-height: 100vh;

			display: grid;

			grid-template-columns: 1fr 1fr;

			background: var(--ccl-roadv2-white);

			position: relative;

		}

		

		/* Left Side - Content */

		.ccl-roadv2--hero-left {

			display: flex;

			flex-direction: column;

			justify-content: center;

			padding: 80px 60px 80px 80px;

			background: linear-gradient(165deg, #f0f4ff 0%, var(--ccl-roadv2-white) 60%);

			position: relative;

		}

		

		.ccl-roadv2--hero-left::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			width: 100%;

			height: 100%;

			background: 

				radial-gradient(circle at 20% 30%, rgba(29, 99, 255, 0.05) 0%, transparent 50%),

				radial-gradient(circle at 80% 70%, rgba(16, 185, 129, 0.03) 0%, transparent 50%);

			pointer-events: none;

		}

		

		.ccl-roadv2--hero-content {

			max-width: 600px;

			position: relative;

			z-index: 2;

		}

		

		.ccl-roadv2--hero-eyebrow {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			padding: 8px 18px;

			background: var(--ccl-roadv2-white);

			border: 2px solid var(--ccl-roadv2-primary-blue);

			border-radius: 100px;

			color: var(--ccl-roadv2-primary-blue);

			font-size: 0.85rem;

			font-weight: 700;

			letter-spacing: 0.5px;

			text-transform: uppercase;

			margin-bottom: 28px;

			width: fit-content;

			box-shadow: 0 4px 16px rgba(29, 99, 255, 0.1);

		}

		

		.ccl-roadv2--hero h1 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(3rem, 5vw, 5rem);

			font-weight: 900;

			line-height: 1.05;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 32px 0;

			letter-spacing: -0.02em;

		}

		

		.ccl-roadv2--hero h1 .ccl-roadv2--highlight {

			background: linear-gradient(135deg, var(--ccl-roadv2-primary-blue), var(--ccl-roadv2-cta-blue));

			-webkit-background-clip: text;

			-webkit-text-fill-color: transparent;

			background-clip: text;

			display: inline-block;

			position: relative;

		}

		

		.ccl-roadv2--hero h1 .ccl-roadv2--highlight::after {

			content: '';

			position: absolute;

			bottom: 8px;

			left: 0;

			right: 0;

			height: 12px;

			background: linear-gradient(90deg, rgba(29, 99, 255, 0.2), rgba(16, 185, 129, 0.2));

			z-index: -1;

		}

		

		.ccl-roadv2--hero-description {

			font-size: 1.2rem;

			line-height: 1.7;

			color: var(--ccl-roadv2-muted);

			margin-bottom: 44px;

		}

		

		.ccl-roadv2--hero-actions {

			display: flex;

			gap: 16px;

			flex-wrap: wrap;

			align-items: center;

		}

		

		/* Right Side - Visual */

		.ccl-roadv2--hero-right {

			background: linear-gradient(135deg, var(--ccl-roadv2-ink) 0%, #0f172a 100%);

			display: flex;

			align-items: center;

			justify-content: center;

			padding: 60px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-roadv2--hero-right::before {

			content: '';

			position: absolute;

			top: -50%;

			left: -50%;

			width: 200%;

			height: 200%;

			background: 

				radial-gradient(circle at 30% 40%, rgba(29, 99, 255, 0.15) 0%, transparent 40%),

				radial-gradient(circle at 70% 60%, rgba(16, 185, 129, 0.1) 0%, transparent 40%);

			animation: ccl-roadv2-rotate 30s linear infinite;

		}

		

		@keyframes ccl-roadv2-rotate {

			from { transform: rotate(0deg); }

			to { transform: rotate(360deg); }

		}

		

		.ccl-roadv2--hero-visual {

			position: relative;

			z-index: 2;

			max-width: 500px;

			text-align: center;

		}

		

		.ccl-roadv2--hero-icon-grid {

			display: grid;

			grid-template-columns: repeat(3, 1fr);

			gap: 24px;

			margin-bottom: 40px;

		}

		

		.ccl-roadv2--hero-icon {

			width: 100px;

			height: 100px;

			background: rgba(255, 255, 255, 0.08);

			backdrop-filter: blur(10px);

			border: 2px solid rgba(255, 255, 255, 0.1);

			border-radius: 20px;

			display: flex;

			align-items: center;

			justify-content: center;

			transition: var(--ccl-roadv2-transition-base);

			animation: ccl-roadv2-float 4s ease-in-out infinite;

			position: relative;

			cursor: pointer;

			text-decoration: none;

		}

		

		.ccl-roadv2--hero-icon::after {

			content: attr(data-tooltip);

			position: absolute;

			bottom: -40px;

			left: 50%;

			transform: translateX(-50%);

			background: var(--ccl-roadv2-white);

			color: var(--ccl-roadv2-ink);

			padding: 8px 16px;

			border-radius: 8px;

			font-size: 0.85rem;

			font-weight: 600;

			white-space: nowrap;

			opacity: 0;

			pointer-events: none;

			transition: var(--ccl-roadv2-transition-base);

			box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);

		}

		

		.ccl-roadv2--hero-icon:hover::after {

			opacity: 1;

			bottom: -45px;

		}

		

		/* Top row icons - show tooltip above */

		.ccl-roadv2--hero-icon:nth-child(1)::after,

		.ccl-roadv2--hero-icon:nth-child(2)::after,

		.ccl-roadv2--hero-icon:nth-child(3)::after {

			bottom: auto;

			top: -40px;

		}

		

		.ccl-roadv2--hero-icon:nth-child(1):hover::after,

		.ccl-roadv2--hero-icon:nth-child(2):hover::after,

		.ccl-roadv2--hero-icon:nth-child(3):hover::after {

			opacity: 1;

			bottom: auto;

			top: -45px;

		}

		

		.ccl-roadv2--hero-icon:nth-child(1) { animation-delay: 0s; }

		.ccl-roadv2--hero-icon:nth-child(2) { animation-delay: 0.5s; }

		.ccl-roadv2--hero-icon:nth-child(3) { animation-delay: 1s; }

		.ccl-roadv2--hero-icon:nth-child(4) { animation-delay: 0.3s; }

		.ccl-roadv2--hero-icon:nth-child(5) { animation-delay: 0.8s; }

		.ccl-roadv2--hero-icon:nth-child(6) { animation-delay: 0.2s; }

		

		@keyframes ccl-roadv2-float {

			0%, 100% { transform: translateY(0); }

			50% { transform: translateY(-12px); }

		}

		

		.ccl-roadv2--hero-icon:hover {

			background: rgba(29, 99, 255, 0.2);

			border-color: var(--ccl-roadv2-primary-blue);

			transform: scale(1.1) translateY(-8px);

		}

		

		.ccl-roadv2--hero-icon i {

			font-size: 2.5rem;

			color: var(--ccl-roadv2-white);

		}

		

		.ccl-roadv2--hero-visual-text {

			color: rgba(255, 255, 255, 0.9);

			font-size: 1.1rem;

			font-weight: 500;

			line-height: 1.6;

		}

		

		/* ===================================

		   BUTTONS

		   =================================== */

		

		.ccl-roadv2--btn {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			padding: 18px 36px;

			font-family: var(--ccl-roadv2-font-primary);

			font-size: 1.05rem;

			font-weight: 700;

			text-decoration: none;

			border-radius: 50px;

			transition: var(--ccl-roadv2-transition-base);

			cursor: pointer;

			border: none;

			position: relative;

			white-space: nowrap;

		}

		

		.ccl-roadv2--btn i {

			transition: transform var(--ccl-roadv2-transition-fast);

		}

		

		.ccl-roadv2--btn:hover i {

			transform: translateX(4px);

		}

		

		.ccl-roadv2--btn--primary {

			background: linear-gradient(135deg, var(--ccl-roadv2-accent-green), #0d9668);

			color: var(--ccl-roadv2-white);

			box-shadow: 0 8px 24px rgba(16, 185, 129, 0.25);

		}

		

		.ccl-roadv2--btn--primary:hover {

			box-shadow: 0 12px 36px rgba(16, 185, 129, 0.35);

			transform: translateY(-2px);

		}

		

		.ccl-roadv2--btn--secondary {

			background: transparent;

			color: var(--ccl-roadv2-ink);

			border: 2px solid var(--ccl-roadv2-ink);

		}

		

		.ccl-roadv2--btn--secondary:hover {

			border-color: var(--ccl-roadv2-primary-blue);

			color: var(--ccl-roadv2-primary-blue);

			background: rgba(29, 99, 255, 0.05);

		}

		

		.ccl-roadv2--btn--phone {

			background: transparent;

			color: var(--ccl-roadv2-ink);

			border: 2px solid var(--ccl-roadv2-ink);

			box-shadow: none;

		}

		

		.ccl-roadv2--btn--phone:hover {

			background: rgba(29, 99, 255, 0.05);

			border-color: var(--ccl-roadv2-primary-blue);

			color: var(--ccl-roadv2-primary-blue);

			transform: translateY(-2px);

		}

		

		/* ===================================

		   ACCIDENT TYPES - MASONRY GRID

		   =================================== */

		

		.ccl-roadv2--accidents-section {

			padding: var(--ccl-roadv2-section-gap) 40px;

			background: var(--ccl-roadv2-white);

		}

		

		.ccl-roadv2--container {

			max-width: var(--ccl-roadv2-container-width);

			margin: 0 auto;

		}

		

		.ccl-roadv2--section-title {

			text-align: center;

			margin-bottom: 72px;

		}

		

		.ccl-roadv2--section-title h2 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(2.5rem, 4vw, 4rem);

			font-weight: 900;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 24px 0;

			line-height: 1.1;

			letter-spacing: -0.02em;

		}

		

		.ccl-roadv2--section-title h2 span {

			color: var(--ccl-roadv2-primary-blue);

		}

		

		.ccl-roadv2--section-subtitle {

			font-size: 1.25rem;

			color: var(--ccl-roadv2-muted);

			max-width: 700px;

			margin: 0 auto;

			line-height: 1.7;

		}

		

		.ccl-roadv2--masonry-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));

			gap: 28px;

			margin-bottom: 60px;

		}

		

		.ccl-roadv2--accident-card {

			background: var(--ccl-roadv2-white);

			border: 2px solid var(--ccl-roadv2-soft-border);

			border-radius: 28px;

			padding: 40px 32px;

			transition: var(--ccl-roadv2-transition-base);

			position: relative;

			overflow: hidden;

		}

		

		.ccl-roadv2--accident-card::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			height: 100%;

			background: linear-gradient(135deg, rgba(29, 99, 255, 0.03) 0%, transparent 50%);

			opacity: 0;

			transition: opacity var(--ccl-roadv2-transition-base);

		}

		

		.ccl-roadv2--accident-card:hover::before {

			opacity: 1;

		}

		

		.ccl-roadv2--accident-card:hover {

			border-color: var(--ccl-roadv2-primary-blue);

			transform: translateY(-8px);

			box-shadow: 0 20px 48px rgba(29, 99, 255, 0.12);

		}

		

		.ccl-roadv2--card-header {

			display: flex;

			align-items: center;

			gap: 20px;

			margin-bottom: 24px;

			position: relative;

			z-index: 1;

		}

		

		.ccl-roadv2--card-icon-wrap {

			width: 72px;

			height: 72px;

			background: linear-gradient(135deg, var(--ccl-roadv2-primary-blue), var(--ccl-roadv2-cta-blue));

			border-radius: 18px;

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			transition: var(--ccl-roadv2-transition-base);

			position: relative;

		}

		

		.ccl-roadv2--card-icon-wrap::after {

			content: '';

			position: absolute;

			inset: -4px;

			background: inherit;

			border-radius: 20px;

			opacity: 0.2;

			filter: blur(12px);

			z-index: -1;

			transition: var(--ccl-roadv2-transition-base);

		}

		

		.ccl-roadv2--accident-card:hover .ccl-roadv2--card-icon-wrap {

			transform: rotate(-8deg) scale(1.05);

		}

		

		.ccl-roadv2--accident-card:hover .ccl-roadv2--card-icon-wrap::after {

			opacity: 0.4;

		}

		

		.ccl-roadv2--card-icon-wrap i {

			font-size: 2rem;

			color: var(--ccl-roadv2-white);

		}

		

		.ccl-roadv2--card-title {

			font-family: var(--ccl-roadv2-font-display);

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ccl-roadv2-ink);

			line-height: 1.3;

			margin: 0;

		}

		

		.ccl-roadv2--card-body {

			position: relative;

			z-index: 1;

		}

		

		.ccl-roadv2--card-text {

			color: var(--ccl-roadv2-muted);

			line-height: 1.7;

			margin-bottom: 20px;

		}

		

		.ccl-roadv2--card-link {

			display: inline-flex;

			align-items: center;

			gap: 8px;

			color: var(--ccl-roadv2-primary-blue);

			font-weight: 700;

			text-decoration: none;

			transition: var(--ccl-roadv2-transition-fast);

		}

		

		.ccl-roadv2--card-link:hover {

			gap: 12px;

		}

		

		/* Featured Cards */

		.ccl-roadv2--accident-card.ccl-roadv2--featured {

			grid-column: span 2;

			background: linear-gradient(135deg, #f8faff 0%, var(--ccl-roadv2-white) 100%);

			border-color: var(--ccl-roadv2-primary-blue);

		}

		

		/* ===================================

		   OUR APPROACH SECTION

		   =================================== */

		

		.ccl-roadv2--approach-section {

			padding: var(--ccl-roadv2-section-gap) 40px;

			background: linear-gradient(135deg, #f8faff 0%, var(--ccl-roadv2-white) 100%);

		}

		

		.ccl-roadv2--approach-content {

			max-width: 1000px;

			margin: 0 auto;

			text-align: center;

		}

		

		.ccl-roadv2--approach-content h2 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(2.5rem, 4vw, 3.75rem);

			font-weight: 900;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 16px 0;

			line-height: 1.1;

		}

		

		.ccl-roadv2--approach-subtitle {

			font-size: clamp(1.35rem, 2vw, 1.65rem);

			font-weight: 700;

			color: var(--ccl-roadv2-primary-blue);

			margin-bottom: 32px;

		}

		

		.ccl-roadv2--approach-description {

			font-size: 1.1rem;

			line-height: 1.8;

			color: var(--ccl-roadv2-muted);

			margin-bottom: 44px;

		}

		

		.ccl-roadv2--approach-cta {

			margin-bottom: 64px;

		}

		

		.ccl-roadv2--why-choose {

			background: var(--ccl-roadv2-white);

			border-radius: 24px;

			padding: 48px 40px;

			box-shadow: 0 8px 32px rgba(29, 99, 255, 0.08);

		}

		

		.ccl-roadv2--why-choose h3 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: 1.85rem;

			font-weight: 800;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 36px 0;

			text-align: center;

		}

		

		.ccl-roadv2--benefits-grid {

			display: grid;

			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

			gap: 28px;

			text-align: left;

		}

		

		.ccl-roadv2--benefit-item {

			display: flex;

			gap: 16px;

			align-items: flex-start;

		}

		

		.ccl-roadv2--benefit-icon {

			width: 44px;

			height: 44px;

			background: linear-gradient(135deg, var(--ccl-roadv2-accent-green), #0d9668);

			border-radius: 12px;

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

		}

		

		.ccl-roadv2--benefit-icon i {

			font-size: 1.25rem;

			color: var(--ccl-roadv2-white);

		}

		

		.ccl-roadv2--benefit-text {

			flex: 1;

			font-size: 1.05rem;

			color: var(--ccl-roadv2-ink);

			font-weight: 600;

			line-height: 1.6;

		}

		

		/* ===================================

		   CTP INVESTIGATION - BANNER STYLE

		   =================================== */

		

		.ccl-roadv2--ctp-banner {

			background: linear-gradient(135deg, var(--ccl-roadv2-ink) 0%, #0f172a 100%);

			padding: 80px 40px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-roadv2--ctp-banner::before {

			content: '';

			position: absolute;

			top: 0;

			left: 0;

			right: 0;

			bottom: 0;

			background: 

				repeating-linear-gradient(

					45deg,

					transparent,

					transparent 60px,

					rgba(29, 99, 255, 0.03) 60px,

					rgba(29, 99, 255, 0.03) 120px

				);

		}

		

		.ccl-roadv2--ctp-content {

			max-width: var(--ccl-roadv2-container-width);

			margin: 0 auto;

			position: relative;

			z-index: 2;

			display: grid;

			grid-template-columns: 1fr auto;

			gap: 48px;

			align-items: center;

		}

		

		.ccl-roadv2--ctp-text {

			max-width: 800px;

		}

		

		.ccl-roadv2--ctp-badge {

			display: inline-flex;

			align-items: center;

			gap: 10px;

			background: linear-gradient(135deg, var(--ccl-roadv2-accent-gold), #ff8800);

			color: var(--ccl-roadv2-white);

			padding: 10px 24px;

			border-radius: 50px;

			font-size: 0.85rem;

			font-weight: 700;

			text-transform: uppercase;

			letter-spacing: 0.5px;

			margin-bottom: 24px;

		}

		

		.ccl-roadv2--ctp-text h3 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(2rem, 3vw, 3rem);

			font-weight: 900;

			color: var(--ccl-roadv2-white);

			margin: 0 0 20px 0;

			line-height: 1.2;

		}

		

		.ccl-roadv2--ctp-text h3 span {

			color: var(--ccl-roadv2-accent-gold);

		}

		

		.ccl-roadv2--ctp-text p {

			color: rgba(255, 255, 255, 0.85);

			font-size: 1.1rem;

			line-height: 1.7;

			margin: 0;

		}

		

		.ccl-roadv2--ctp-actions {

			display: flex;

			flex-direction: column;

			gap: 16px;

			align-items: flex-start;

		}

		

		.ccl-roadv2--btn--light {

			background: var(--ccl-roadv2-white);

			color: var(--ccl-roadv2-ink);

			box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);

		}

		

		.ccl-roadv2--btn--light:hover {

			background: var(--ccl-roadv2-bg-light);

			transform: translateY(-2px);

			box-shadow: 0 12px 36px rgba(0, 0, 0, 0.3);

		}

		

		.ccl-roadv2--btn--outline-light {

			background: transparent;

			color: var(--ccl-roadv2-white);

			border: 2px solid rgba(255, 255, 255, 0.3);

		}

		

		.ccl-roadv2--btn--outline-light:hover {

			border-color: var(--ccl-roadv2-white);

			background: rgba(255, 255, 255, 0.1);

		}

		

		/* ===================================

		   PROCESS SECTION - SIMPLE DESIGN

		   =================================== */

		

		.ccl-roadv2--process-section {

			padding: var(--ccl-roadv2-section-gap) 40px;

			background: var(--ccl-roadv2-white);

		}

		

		.ccl-roadv2--process-intro {

			text-align: center;

			max-width: 700px;

			margin: 0 auto 60px;

		}

		

		.ccl-roadv2--process-intro h2 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(2.25rem, 4vw, 3.5rem);

			font-weight: 900;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 20px 0;

			line-height: 1.1;

		}

		

		.ccl-roadv2--process-intro p {

			font-size: 1.15rem;

			color: var(--ccl-roadv2-muted);

			line-height: 1.7;

		}

		

		.ccl-roadv2--process-list {

			max-width: 900px;

			margin: 0 auto;

			display: flex;

			flex-direction: column;

			gap: 32px;

		}

		

		.ccl-roadv2--process-item {

			display: flex;

			gap: 28px;

			align-items: flex-start;

		}

		

		.ccl-roadv2--process-number {

			width: 60px;

			height: 60px;

			background: linear-gradient(135deg, var(--ccl-roadv2-primary-blue), var(--ccl-roadv2-cta-blue));

			color: var(--ccl-roadv2-white);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			font-family: var(--ccl-roadv2-font-display);

			font-size: 1.75rem;

			font-weight: 900;

			flex-shrink: 0;

		}

		

		.ccl-roadv2--process-content h3 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: 1.5rem;

			font-weight: 800;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 12px 0;

			line-height: 1.3;

		}

		

		.ccl-roadv2--process-content p {

			font-size: 1.05rem;

			color: var(--ccl-roadv2-muted);

			line-height: 1.7;

			margin: 0;

		}

		

		/* ===================================

		   FAQ SECTION

		   =================================== */

		

		.ccl-roadv2--faq-section {

			padding: var(--ccl-roadv2-section-gap) 40px;

			background: var(--ccl-roadv2-bg-light);

		}

		

		.ccl-roadv2--faq-header {

			text-align: center;

			margin-bottom: 56px;

		}

		

		.ccl-roadv2--faq-header h2 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(2.5rem, 4vw, 3.75rem);

			font-weight: 900;

			color: var(--ccl-roadv2-ink);

			margin: 0 0 16px 0;

			line-height: 1.1;

		}

		

		.ccl-roadv2--faq-subtitle {

			font-size: 1.15rem;

			color: var(--ccl-roadv2-muted);

			max-width: 700px;

			margin: 0 auto;

		}

		

		.ccl-roadv2--faq-list {

			max-width: 900px;

			margin: 0 auto;

			display: flex;

			flex-direction: column;

			gap: 20px;

		}

		

		.ccl-roadv2--faq-item {

			background: var(--ccl-roadv2-white);

			border-radius: 16px;

			overflow: hidden;

			border: 2px solid transparent;

			transition: var(--ccl-roadv2-transition-base);

		}

		

		.ccl-roadv2--faq-item:hover {

			border-color: var(--ccl-roadv2-primary-blue);

		}

		

		.ccl-roadv2--faq-question {

			width: 100%;

			display: flex;

			align-items: center;

			justify-content: space-between;

			padding: 24px 28px;

			background: none;

			border: none;

			text-align: left;

			cursor: pointer;

			font-family: var(--ccl-roadv2-font-display);

			font-size: 1.25rem;

			font-weight: 800;

			color: var(--ccl-roadv2-ink);

			line-height: 1.4;

			transition: var(--ccl-roadv2-transition-base);

		}

		

		.ccl-roadv2--faq-question:hover {

			color: var(--ccl-roadv2-primary-blue);

		}

		

		.ccl-roadv2--faq-icon {

			width: 32px;

			height: 32px;

			background: var(--ccl-roadv2-bg-light);

			border-radius: 50%;

			display: flex;

			align-items: center;

			justify-content: center;

			flex-shrink: 0;

			margin-left: 20px;

			transition: var(--ccl-roadv2-transition-base);

		}

		

		.ccl-roadv2--faq-icon i {

			font-size: 0.9rem;

			color: var(--ccl-roadv2-primary-blue);

			transition: transform var(--ccl-roadv2-transition-base);

		}

		

		.ccl-roadv2--faq-item.ccl-roadv2--active .ccl-roadv2--faq-icon {

			background: var(--ccl-roadv2-primary-blue);

		}

		

		.ccl-roadv2--faq-item.ccl-roadv2--active .ccl-roadv2--faq-icon i {

			color: var(--ccl-roadv2-white);

			transform: rotate(180deg);

		}

		

		.ccl-roadv2--faq-answer {

			max-height: 0;

			overflow: hidden;

			transition: max-height 0.4s ease, padding 0.4s ease;

		}

		

		.ccl-roadv2--faq-item.ccl-roadv2--active .ccl-roadv2--faq-answer {

			max-height: 500px;

			padding: 0 28px 24px 28px;

		}

		

		.ccl-roadv2--faq-answer p {

			font-size: 1.05rem;

			line-height: 1.7;

			color: var(--ccl-roadv2-muted);

			margin: 0;

		}

		

		/* ===================================

		   FINAL CTA - SPLIT LAYOUT

		   =================================== */

		

		.ccl-roadv2--final-cta {

			background: linear-gradient(135deg, var(--ccl-roadv2-primary-blue), var(--ccl-roadv2-cta-blue));

			padding: 100px 40px;

			position: relative;

			overflow: hidden;

		}

		

		.ccl-roadv2--final-cta::before {

			content: '';

			position: absolute;

			top: -50%;

			right: -20%;

			width: 800px;

			height: 800px;

			background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 60%);

			animation: ccl-roadv2-pulse 8s ease-in-out infinite;

		}

		

		@keyframes ccl-roadv2-pulse {

			0%, 100% { transform: scale(1); opacity: 0.5; }

			50% { transform: scale(1.2); opacity: 0.8; }

		}

		

		.ccl-roadv2--final-cta-content {

			max-width: var(--ccl-roadv2-container-width);

			margin: 0 auto;

			text-align: center;

			position: relative;

			z-index: 2;

		}

		

		.ccl-roadv2--final-cta h2 {

			font-family: var(--ccl-roadv2-font-display);

			font-size: clamp(2.5rem, 4vw, 4rem);

			font-weight: 900;

			color: var(--ccl-roadv2-white);

			margin: 0 0 24px 0;

			line-height: 1.15;

			letter-spacing: -0.02em;

		}

		

		.ccl-roadv2--final-cta p {

			font-size: 1.25rem;

			color: rgba(255, 255, 255, 0.9);

			max-width: 700px;

			margin: 0 auto 48px;

			line-height: 1.7;

		}

		

		.ccl-roadv2--final-cta-buttons {

			display: flex;

			gap: 16px;

			justify-content: center;

			flex-wrap: wrap;

		}

		

		/* ===================================

		   SCROLL ANIMATIONS

		   =================================== */

		

		.ccl-roadv2--animate-in {

			opacity: 0;

			transform: translateY(30px);

			transition: opacity 0.7s ease, transform 0.7s ease;

		}

		

		.ccl-roadv2--animate-in.ccl-roadv2--visible {

			opacity: 1;

			transform: translateY(0);

		}

		

		/* ===================================

		   RESPONSIVE DESIGN

		   =================================== */

		

		@media (max-width: 1200px) {

			.ccl-roadv2--wrapper {

				--ccl-roadv2-section-gap: 100px;

			}

			

			.ccl-roadv2--hero-left {

				padding: 60px 40px;

			}

			

			.ccl-roadv2--hero-right {

				padding: 40px;

			}

			

			.ccl-roadv2--accident-card.ccl-roadv2--featured {

				grid-column: span 1;

			}

		}

		

		@media (max-width: 968px) {

			.ccl-roadv2--wrapper {

				--ccl-roadv2-section-gap: 80px;

			}

			

			.ccl-roadv2--hero {

				grid-template-columns: 1fr;

				min-height: auto;

			}

			

			.ccl-roadv2--hero-left {

				padding: 60px 32px;

			}

			

			.ccl-roadv2--hero-right {

				min-height: 500px;

				padding: 60px 32px;

			}

			

			.ccl-roadv2--ctp-content {

				grid-template-columns: 1fr;

				text-align: center;

			}

			

			.ccl-roadv2--ctp-actions {

				align-items: stretch;

			}

			

			.ccl-roadv2--accidents-section,

			.ccl-roadv2--process-section {

				padding: 80px 24px;

			}

			

			.ccl-roadv2--approach-section,

			.ccl-roadv2--faq-section {

				padding: 80px 24px;

			}

			

			.ccl-roadv2--ctp-banner {

				padding: 60px 24px;

			}

			

			.ccl-roadv2--final-cta {

				padding: 80px 24px;

			}

		}

		

		@media (max-width: 640px) {

			.ccl-roadv2--wrapper {

				font-size: 16px;

				--ccl-roadv2-section-gap: 60px;

			}

			

			.ccl-roadv2--hero-left,

			.ccl-roadv2--hero-right {

				padding: 40px 20px;

			}

			

			.ccl-roadv2--hero-actions {

				flex-direction: column;

				width: 100%;

			}

			

			.ccl-roadv2--btn {

				width: 100%;

				justify-content: center;

			}

			

			.ccl-roadv2--hero-icon-grid {

				grid-template-columns: repeat(2, 1fr);

				gap: 16px;

			}

			

			.ccl-roadv2--hero-icon {

				width: 80px;

				height: 80px;

			}

			

			.ccl-roadv2--hero-icon i {

				font-size: 2rem;

			}

			

			/* Mobile: Only top 2 icons show tooltip above in 2x3 grid */

			.ccl-roadv2--hero-icon:nth-child(3)::after {

				bottom: -40px;

				top: auto;

			}

			

			.ccl-roadv2--hero-icon:nth-child(3):hover::after {

				bottom: -45px;

				top: auto;

			}

			

			.ccl-roadv2--masonry-grid {

				grid-template-columns: 1fr;

				gap: 20px;

			}

			

			.ccl-roadv2--accident-card {

				padding: 32px 24px;

			}

			

			.ccl-roadv2--card-header {

				gap: 16px;

			}

			

			.ccl-roadv2--card-icon-wrap {

				width: 60px;

				height: 60px;

			}

			

			.ccl-roadv2--card-icon-wrap i {

				font-size: 1.75rem;

			}

			

			.ccl-roadv2--process-item {

				gap: 20px;

			}

			

			.ccl-roadv2--process-number {

				width: 50px;

				height: 50px;

				font-size: 1.5rem;

			}

			

			.ccl-roadv2--final-cta-buttons {

				flex-direction: column;

			}

			

			.ccl-roadv2--accidents-section,

			.ccl-roadv2--process-section {

				padding: 60px 20px;

			}

			

			.ccl-roadv2--approach-section,

			.ccl-roadv2--faq-section {

				padding: 60px 20px;

			}

			

			.ccl-roadv2--why-choose {

				padding: 36px 24px;

			}

			

			.ccl-roadv2--benefits-grid {

				grid-template-columns: 1fr;

				gap: 24px;

			}

			

			.ccl-roadv2--faq-question {

				padding: 20px;

				font-size: 1.1rem;

			}

			

			.ccl-roadv2--faq-icon {

				margin-left: 12px;

			}

			

			.ccl-roadv2--faq-item.ccl-roadv2--active .ccl-roadv2--faq-answer {

				padding: 0 20px 20px 20px;

			}

			

			.ccl-roadv2--ctp-banner {

				padding: 48px 20px;

			}

			

			.ccl-roadv2--final-cta {

				padding: 60px 20px;

			}

		}

	/* ============================================

	   SCOPED STYLES - All within .ccl-moto--wrapper

	   ============================================ */

	

	.ccl-moto--wrapper {

		/* CSS Variables */

		--ccl-primary-blue: #1d63ff;

		--ccl-cta-blue: #0b5cff;

		--ccl-cta-dark: #0846c1;

		--ccl-accent-green: #10b981;

		--ccl-accent-gold: #ffa826;

		--ccl-ink: #1e293b;

		--ccl-muted: #64748b;

		--ccl-soft-border: #e5e7eb;

		--ccl-white: #ffffff;

		--ccl-off-white: #f8fafc;

		

		/* Typography */

		--ccl-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

		--ccl-font-display: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

		

		/* Spacing */

		--ccl-section-padding: 100px;

		--ccl-card-padding: 36px;

		--ccl-gap-large: 32px;

		--ccl-gap-medium: 24px;

		--ccl-gap-small: 16px;

		

		/* Base Styles */

		font-family: var(--ccl-font-primary);

		font-size: 16px;

		line-height: 1.6;

		color: var(--ccl-ink);

		-webkit-font-smoothing: antialiased;

		-moz-osx-font-smoothing: grayscale;

	}

	

	.ccl-moto--wrapper main {

		overflow-x: hidden;

	}

	

	.ccl-moto--wrapper h1,

	.ccl-moto--wrapper h2,

	.ccl-moto--wrapper h3,

	.ccl-moto--wrapper h4,

	.ccl-moto--wrapper h5,

	.ccl-moto--wrapper h6,

	.ccl-moto--wrapper p,

	.ccl-moto--wrapper ul,

	.ccl-moto--wrapper ol {

		box-sizing: border-box;

	}

	

	.ccl-moto--wrapper h1,

	.ccl-moto--wrapper h2,

	.ccl-moto--wrapper h3,

	.ccl-moto--wrapper h4,

	.ccl-moto--wrapper h5,

	.ccl-moto--wrapper h6,

	.ccl-moto--wrapper p {

		margin: 0;

		padding: 0;

	}

	

	.ccl-moto--wrapper h1,

	.ccl-moto--wrapper h2,

	.ccl-moto--wrapper h3,

	.ccl-moto--wrapper h4,

	.ccl-moto--wrapper h5,

	.ccl-moto--wrapper h6 {

		font-family: var(--ccl-font-display);

		font-weight: 800;

		line-height: 1.2;

		color: var(--ccl-ink);

	}

	

	.ccl-moto--wrapper p {

		margin-bottom: 1em;

	}

	

	.ccl-moto--wrapper ul,

	.ccl-moto--wrapper ol {

		margin-bottom: 1em;

		padding-left: 1.5em;

	}

	

	.ccl-moto--wrapper a {

		color: var(--ccl-primary-blue);

		text-decoration: none;

		transition: color 0.3s ease;

	}

	

	.ccl-moto--wrapper a:hover {

		color: var(--ccl-cta-dark);

	}

	

	/* ============================================

	   HERO SECTION

	   ============================================ */

	

	.ccl-moto--hero {

		position: relative;

		background: linear-gradient(135deg, #0846c1 0%, #1d63ff 50%, #0b5cff 100%);

		padding: 100px 24px 100px;

		text-align: center;

		overflow: hidden;

	}

	

	.ccl-moto--hero * {

		text-align: center;

	}

	

	.ccl-moto--hero .ccl-moto--hero-ctas,

	.ccl-moto--hero .ccl-moto--hero-stats {

		display: flex;

		justify-content: center;

	}

	

	.ccl-moto--hero::before {

		content: '';

		position: absolute;

		top: -50%;

		left: -10%;

		width: 500px;

		height: 500px;

		background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

		border-radius: 50%;

		animation: ccl-moto-glow-pulse 8s ease-in-out infinite;

	}

	

	.ccl-moto--hero::after {

		content: '';

		position: absolute;

		bottom: -30%;

		right: -5%;

		width: 400px;

		height: 400px;

		background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);

		border-radius: 50%;

		animation: ccl-moto-glow-pulse 10s ease-in-out infinite 2s;

	}

	

	@keyframes ccl-moto-glow-pulse {

		0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }

		50% { transform: translate(20px, 20px) scale(1.1); opacity: 0.8; }

	}

	

	.ccl-moto--hero-content {

		position: relative;

		z-index: 1;

		max-width: 950px;

		margin: 0 auto;

	}

	

	.ccl-moto--hero-kicker {

		display: inline-flex;

		align-items: center;

		gap: 8px;

		background: rgba(255,255,255,0.15);

		color: var(--ccl-white);

		padding: 8px 20px;

		border-radius: 50px;

		font-size: 0.9rem;

		font-weight: 600;

		letter-spacing: 0.5px;

		margin-bottom: 24px;

		backdrop-filter: blur(10px);

		animation: ccl-moto-fadeInDown 0.8s ease-out;

	}

	

	@keyframes ccl-moto-fadeInDown {

		from { opacity: 0; transform: translateY(-30px); }

		to { opacity: 1; transform: translateY(0); }

	}

	

	.ccl-moto--hero h1 {

		font-size: clamp(2.5rem, 6vw, 4.5rem);

		color: var(--ccl-white);

		margin-bottom: 24px;

		text-align: center;

		animation: ccl-moto-fadeInUp 0.8s ease-out 0.2s backwards;

	}

	

	@keyframes ccl-moto-fadeInUp {

		from { opacity: 0; transform: translateY(30px); }

		to { opacity: 1; transform: translateY(0); }

	}

	

	.ccl-moto--hero-lead {

		font-size: clamp(1.1rem, 2vw, 1.35rem);

		color: rgba(255,255,255,0.95);

		line-height: 1.6;

		margin-bottom: 40px;

		text-align: center;

		animation: ccl-moto-fadeInUp 0.8s ease-out 0.4s backwards;

	}

	

	.ccl-moto--hero-ctas {

		display: flex;

		flex-wrap: wrap;

		gap: 16px;

		justify-content: center;

		margin-bottom: 60px;

		animation: ccl-moto-fadeInUp 0.8s ease-out 0.6s backwards;

	}

	

	.ccl-moto--hero-stats {

		display: flex;

		flex-wrap: wrap;

		gap: 40px;

		justify-content: center;

		animation: ccl-moto-fadeInUp 0.8s ease-out 0.8s backwards;

	}

	

	.ccl-moto--hero-stat {

		display: flex;

		align-items: center;

		gap: 12px;

		color: var(--ccl-white);

	}

	

	.ccl-moto--hero-stat-icon {

		width: 48px;

		height: 48px;

		background: rgba(255,255,255,0.2);

		border-radius: 50%;

		display: flex;

		align-items: center;

		justify-content: center;

		font-size: 1.3rem;

		backdrop-filter: blur(10px);

	}

	

	.ccl-moto--hero-stat-text {

		text-align: left;

	}

	

	.ccl-moto--hero-stat-label {

		display: block;

		font-size: 0.85rem;

		opacity: 0.9;

		font-weight: 500;

	}

	

	.ccl-moto--hero-stat-value {

		display: block;

		font-size: 1.05rem;

		font-weight: 700;

	}

	

	/* ============================================

	   BUTTONS

	   ============================================ */

	

	.ccl-moto--btn {

		display: inline-flex;

		align-items: center;

		gap: 10px;

		padding: 16px 32px;

		border-radius: 8px;

		font-family: var(--ccl-font-primary);

		font-size: 1rem;

		font-weight: 700;

		text-decoration: none;

		border: none;

		cursor: pointer;

		transition: all 0.3s ease;

		position: relative;

		overflow: hidden;

		box-sizing: border-box;

	}

	

	.ccl-moto--btn::before {

		content: '';

		position: absolute;

		top: 50%;

		left: 50%;

		width: 0;

		height: 0;

		border-radius: 50%;

		background: rgba(255,255,255,0.2);

		transform: translate(-50%, -50%);

		transition: width 0.6s ease, height 0.6s ease;

	}

	

	.ccl-moto--btn:active::before {

		width: 300px;

		height: 300px;

	}

	

	.ccl-moto--btn--primary {

		background: var(--ccl-white);

		color: var(--ccl-cta-blue);

		box-shadow: 0 4px 14px rgba(0,0,0,0.15);

	}

	

	.ccl-moto--btn--primary:hover {

		transform: translateY(-2px);

		box-shadow: 0 6px 20px rgba(0,0,0,0.2);

	}

	

	.ccl-moto--btn--secondary {

		background: var(--ccl-white);

		color: var(--ccl-cta-blue);

		border: 2px solid var(--ccl-white);

	}

	

	.ccl-moto--btn--secondary:hover {

		background: transparent;

		color: var(--ccl-white);

	}

	

	.ccl-moto--btn--cta {

		background: var(--ccl-cta-blue);

		color: var(--ccl-white);

		box-shadow: 0 4px 14px rgba(11, 92, 255, 0.3);

	}

	

	.ccl-moto--btn--cta:hover {

		background: var(--ccl-cta-dark);

		transform: translateY(-2px);

		box-shadow: 0 6px 20px rgba(11, 92, 255, 0.4);

	}

	

	.ccl-moto--btn i {

		position: relative;

		z-index: 1;

	}

	

	.ccl-moto--btn span {

		position: relative;

		z-index: 1;

	}

	

	/* ============================================

	   SECTION COMMON STYLES

	   ============================================ */

	

	.ccl-moto--section {

		padding: var(--ccl-section-padding) 24px;

	}

	

	.ccl-moto--section--alt {

		background: var(--ccl-off-white);

	}

	

	.ccl-moto--container {

		max-width: 1380px;

		margin: 0 auto;

	}

	

	.ccl-moto--section-header {

		text-align: center;

		margin-bottom: 60px;

	}

	

	.ccl-moto--section-header *:not(mark) {

		text-align: center;

	}

	

	.ccl-moto--section-kicker {

		display: inline-flex;

		align-items: center;

		gap: 12px;

		color: var(--ccl-primary-blue);

		font-size: 0.95rem;

		font-weight: 700;

		text-transform: uppercase;

		letter-spacing: 1px;

		margin-bottom: 16px;

	}

	

	.ccl-moto--section-kicker::before,

	.ccl-moto--section-kicker::after {

		content: '';

		width: 40px;

		height: 2px;

		background: var(--ccl-primary-blue);

	}

	

	.ccl-moto--section-title {

		font-size: clamp(2.25rem, 5vw, 3.5rem);

		margin-bottom: 20px;

		text-align: center;

	}

	

	.ccl-moto--section-title mark {

		background: linear-gradient(180deg, transparent 60%, rgba(29, 99, 255, 0.2) 60%);

		color: inherit;

	}

	

	.ccl-moto--section-lead {

		font-size: 1.2rem;

		color: var(--ccl-muted);

		line-height: 1.7;

		margin: 0 auto;

		text-align: center;

	}

	

	/* ============================================

	   WHO CAN CLAIM SECTION

	   ============================================ */

	

	.ccl-moto--claim-hero {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(16, 185, 129, 0.05));

		border-radius: 24px;

		padding: 48px;

		margin-top: 48px;

		border: 3px solid var(--ccl-primary-blue);

	}

	

	.ccl-moto--claim-hero-content {

		display: grid;

		grid-template-columns: 1fr 1fr;

		gap: 48px;

		align-items: center;

	}

	

	.ccl-moto--claim-text h3 {

		font-size: 2.5rem;

		color: var(--ccl-primary-blue);

		margin-bottom: 24px;

		display: flex;

		align-items: center;

		gap: 16px;

	}

	

	.ccl-moto--claim-text h3 i {

		font-size: 2.5rem;

	}

	

	.ccl-moto--claim-text p {

		font-size: 1.15rem;

		line-height: 1.8;

		color: var(--ccl-muted);

		margin-bottom: 24px;

	}

	

	.ccl-moto--claim-categories {

		display: grid;

		grid-template-columns: 1fr 1fr;

		gap: 16px;

	}

	

	.ccl-moto--claim-category {

		background: var(--ccl-white);

		padding: 20px;

		border-radius: 12px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.3s ease;

	}

	

	.ccl-moto--claim-category:hover {

		border-color: var(--ccl-primary-blue);

		transform: translateY(-3px);

		box-shadow: 0 8px 20px rgba(0,0,0,0.08);

	}

	

	.ccl-moto--claim-category-icon {

		width: 50px;

		height: 50px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.5rem;

		margin-bottom: 12px;

	}

	

	.ccl-moto--claim-category h4 {

		font-size: 1.1rem;

		margin-bottom: 8px;

		color: var(--ccl-ink);

	}

	

	.ccl-moto--claim-category p {

		font-size: 0.9rem;

		color: var(--ccl-muted);

		margin: 0;

		line-height: 1.5;

	}

	

	.ccl-moto--ctp-breakdown {

		background: var(--ccl-white);

		border-radius: 20px;

		padding: 40px;

		box-shadow: 0 10px 40px rgba(0,0,0,0.08);

	}

	

	.ccl-moto--ctp-breakdown h4 {

		font-size: 1.6rem;

		color: var(--ccl-ink);

		margin-bottom: 24px;

		text-align: center;

		display: flex;

		align-items: center;

		justify-content: center;

		gap: 12px;

	}

	

	.ccl-moto--ctp-breakdown h4 i {

		color: var(--ccl-primary-blue);

		font-size: 1.8rem;

	}

	

	.ccl-moto--ctp-items {

		display: flex;

		flex-direction: column;

		gap: 20px;

	}

	

	.ccl-moto--ctp-item {

		display: flex;

		align-items: start;

		gap: 16px;

		padding: 20px;

		background: var(--ccl-off-white);

		border-radius: 12px;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--ctp-item:hover {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(16, 185, 129, 0.05));

		transform: translateX(5px);

	}

	

	.ccl-moto--ctp-item-icon {

		width: 50px;

		height: 50px;

		min-width: 50px;

		background: var(--ccl-primary-blue);

		border-radius: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.4rem;

	}

	

	.ccl-moto--ctp-item-text h5 {

		font-size: 1.15rem;

		color: var(--ccl-ink);

		margin-bottom: 6px;

	}

	

	.ccl-moto--ctp-item-text p {

		font-size: 0.95rem;

		color: var(--ccl-muted);

		margin: 0;

		line-height: 1.6;

	}

	

	/* ============================================

	   IMMEDIATE ACTION SECTION

	   ============================================ */



	.ccl-moto--action-banner {

		background: linear-gradient(135deg, #fef3c7, #fde68a);

		border: 3px solid var(--ccl-accent-gold);

		border-radius: 24px;

		padding: 40px;

		margin-top: 48px;

		box-shadow: 0 10px 40px rgba(255, 168, 38, 0.15);

	}



	.ccl-moto--action-header {

		text-align: center;

		margin-bottom: 32px;

	}



	.ccl-moto--action-header h4 {

		font-size: 2rem;

		color: #92400e;

		margin-bottom: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		gap: 12px;

	}



	.ccl-moto--action-header h4 i {

		font-size: 2.2rem;

		color: var(--ccl-accent-gold);

	}



	.ccl-moto--action-header p {

		font-size: 1.05rem;

		color: #78350f;

		margin: 0;

	}



	.ccl-moto--action-grid {

		display: grid;

		grid-template-columns: repeat(2, 1fr);

		gap: 20px;

	}



	.ccl-moto--action-card {

		background: var(--ccl-white);

		padding: 24px;

		border-radius: 16px;

		display: flex;

		align-items: start;

		gap: 16px;

		border: 2px solid transparent;

		transition: all 0.3s ease;

		box-shadow: 0 4px 12px rgba(0,0,0,0.08);

	}



	.ccl-moto--action-card:hover {

		border-color: var(--ccl-accent-gold);

		transform: translateY(-3px);

		box-shadow: 0 8px 24px rgba(0,0,0,0.12);

	}



	.ccl-moto--action-number {

		width: 48px;

		height: 48px;

		min-width: 48px;

		background: linear-gradient(135deg, var(--ccl-accent-gold), #f59e0b);

		border-radius: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.5rem;

		font-weight: 900;

		font-family: var(--ccl-font-display);

		box-shadow: 0 4px 12px rgba(255, 168, 38, 0.3);

	}



	.ccl-moto--action-content h5 {

		font-size: 1.15rem;

		color: #92400e;

		margin-bottom: 6px;

		font-weight: 800;

	}



	.ccl-moto--action-content p {

		font-size: 0.95rem;

		color: #78350f;

		margin: 0;

		line-height: 1.6;

	}



	.ccl-moto--action-urgency {

		background: #dc2626;

		color: var(--ccl-white);

		text-align: center;

		padding: 16px 24px;

		border-radius: 12px;

		margin-top: 24px;

		font-weight: 700;

		font-size: 1.05rem;

		display: flex;

		align-items: center;

		justify-content: center;

		gap: 12px;

	}



	.ccl-moto--action-urgency i {

		font-size: 1.3rem;

	}

	

	/* ============================================

	   ELIGIBILITY SECTION

	   ============================================ */



	.ccl-moto--eligibility-layout {

		display: grid;

		grid-template-columns: 1fr 400px;

		gap: 48px;

		margin-top: 48px;

	}



	.ccl-moto--eligibility-main {

		background: transparent;

		padding: 0;

		border-radius: 0;

		border: none;

	}



	.ccl-moto--eligibility-main > h3 {

		font-size: 2rem;

		margin-bottom: 40px;

		color: var(--ccl-primary-blue);

		text-align: center;

		padding-bottom: 20px;

		border-bottom: 3px solid var(--ccl-primary-blue);

	}



	.ccl-moto--eligibility-requirements {

		display: grid;

		grid-template-columns: 1fr;

		gap: 24px;

		margin-bottom: 40px;

	}



	.ccl-moto--requirement-card {

		background: var(--ccl-white);

		padding: 32px;

		border-radius: 20px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.4s ease;

		position: relative;

		overflow: hidden;

	}



	.ccl-moto--requirement-card::before {

		content: '';

		position: absolute;

		left: 0;

		top: 0;

		bottom: 0;

		width: 6px;

		background: linear-gradient(180deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		transform: translateX(-6px);

		transition: transform 0.4s ease;

	}



	.ccl-moto--requirement-card:hover {

		transform: translateX(8px);

		box-shadow: 0 12px 40px rgba(0,0,0,0.12);

		border-color: var(--ccl-primary-blue);

	}



	.ccl-moto--requirement-card:hover::before {

		transform: translateX(0);

	}



	.ccl-moto--requirement-header {

		display: flex;

		align-items: center;

		gap: 20px;

		margin-bottom: 16px;

	}



	.ccl-moto--requirement-icon {

		width: 64px;

		height: 64px;

		min-width: 64px;

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

		border-radius: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-primary-blue);

		font-size: 1.8rem;

		transition: all 0.4s ease;

		border: 2px solid var(--ccl-soft-border);

	}



	.ccl-moto--requirement-card:hover .ccl-moto--requirement-icon {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		transform: scale(1.1) rotate(-5deg);

		border-color: var(--ccl-primary-blue);

	}



	.ccl-moto--requirement-header h4 {

		font-size: 1.4rem;

		color: var(--ccl-ink);

		margin: 0;

	}



	.ccl-moto--requirement-card p {

		color: var(--ccl-muted);

		line-height: 1.8;

		margin: 0;

		font-size: 0.98rem;

	}



	.ccl-moto--eligibility-note {

		background: linear-gradient(135deg, #fffbeb, #fef3c7);

		border: 3px solid var(--ccl-accent-gold);

		border-radius: 20px;

		padding: 32px;

		margin-top: 0;

		position: relative;

		overflow: hidden;

	}



	.ccl-moto--eligibility-note::before {

		content: '';

		position: absolute;

		top: 0;

		left: 0;

		right: 0;

		height: 5px;

		background: linear-gradient(90deg, var(--ccl-accent-gold), #f59e0b);

	}



	.ccl-moto--eligibility-note h4 {

		color: #92400e;

		font-size: 1.3rem;

		margin-bottom: 16px;

		display: flex;

		align-items: center;

		gap: 12px;

	}



	.ccl-moto--eligibility-note h4 i {

		color: var(--ccl-accent-gold);

		font-size: 1.5rem;

	}



	.ccl-moto--eligibility-note p {

		color: #78350f;

		margin: 0;

		line-height: 1.8;

		font-size: 0.98rem;

	}



	.ccl-moto--eligibility-note strong {

		color: #92400e;

		font-weight: 700;

	}



	.ccl-moto--eligibility-note a {

		color: #0846c1;

		font-weight: 700;

		text-decoration: underline;

	}



	.ccl-moto--eligibility-note a:hover {

		color: var(--ccl-primary-blue);

	}



	.ccl-moto--eligibility-sidebar {

		display: flex;

		flex-direction: column;

		gap: 24px;

		position: sticky;

		top: 24px;

		align-self: start;

	}



	.ccl-moto--eligibility-widget {

		background: var(--ccl-white);

		padding: 32px;

		border-radius: 20px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.3s ease;

		overflow: hidden;

	}



	.ccl-moto--eligibility-widget:hover {

		box-shadow: 0 8px 24px rgba(0,0,0,0.08);

		transform: translateY(-3px);

	}



	.ccl-moto--eligibility-widget.highlight {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(16, 185, 129, 0.05));

		border-color: var(--ccl-primary-blue);

		border-width: 3px;

		box-shadow: 0 8px 24px rgba(29, 99, 255, 0.15);

	}



	.ccl-moto--eligibility-widget h4 {

		font-size: 1.3rem;

		color: var(--ccl-primary-blue);

		margin-bottom: 20px;

		display: flex;

		align-items: center;

		gap: 12px;

	}



	.ccl-moto--eligibility-widget h4 i {

		font-size: 1.4rem;

	}



	.ccl-moto--checklist {

		list-style: none;

		padding: 0;

		margin: 0 0 24px 0;

	}



	.ccl-moto--checklist li {

		padding: 14px 0;

		padding-left: 36px;

		position: relative;

		color: var(--ccl-ink);

		font-weight: 600;

		font-size: 0.95rem;

		border-bottom: 1px solid var(--ccl-soft-border);

	}



	.ccl-moto--checklist li:last-child {

		border-bottom: none;

	}



	.ccl-moto--checklist li::before {

		content: '\f00c';

		font-family: 'Font Awesome 6 Free';

		font-weight: 900;

		position: absolute;

		left: 0;

		color: var(--ccl-accent-green);

		font-size: 1.1rem;

	}



	.ccl-moto--eligibility-widget .ccl-moto--btn {

		width: 100%;

		justify-content: center;

		font-size: 1rem;

		box-sizing: border-box;

		max-width: 100%;

	}

	

	.ccl-moto--eligibility-widget .ccl-moto--btn--cta {

		background: var(--ccl-cta-blue);

		color: var(--ccl-white) !important;

		box-shadow: 0 4px 14px rgba(11, 92, 255, 0.3);

	}



	.ccl-moto--eligibility-widget .ccl-moto--btn--cta:hover {

		background: var(--ccl-cta-dark);

		color: var(--ccl-white) !important;

	}



	.ccl-moto--eligibility-widget .ccl-moto--btn--cta i,

	.ccl-moto--eligibility-widget .ccl-moto--btn--cta span {

		color: var(--ccl-white);

	}

	

	/* ============================================

	   SCENARIOS SECTION

	   ============================================ */

	

	.ccl-moto--scenarios-grid {

		display: grid;

		grid-template-columns: repeat(2, 1fr);

		gap: 28px;

		margin-top: 48px;

	}

	

	.ccl-moto--scenario-card {

		background: var(--ccl-white);

		border-radius: 20px;

		overflow: hidden;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

		position: relative;

	}

	

	.ccl-moto--scenario-card::before {

		content: '';

		position: absolute;

		top: 0;

		left: 0;

		right: 0;

		height: 5px;

		background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		transform: translateY(-5px);

		transition: transform 0.4s ease;

	}

	

	.ccl-moto--scenario-card:hover {

		transform: translateY(-8px);

		box-shadow: 0 16px 40px rgba(0,0,0,0.12);

		border-color: var(--ccl-primary-blue);

	}

	

	.ccl-moto--scenario-card:hover::before {

		transform: translateY(0);

	}

	

	.ccl-moto--scenario-header {

		padding: 32px;

		display: flex;

		align-items: center;

		gap: 20px;

	}

	

	.ccl-moto--scenario-icon {

		width: 70px;

		height: 70px;

		min-width: 70px;

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

		border-radius: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		font-size: 2rem;

		color: var(--ccl-primary-blue);

		transition: all 0.4s ease;

	}

	

	.ccl-moto--scenario-card:hover .ccl-moto--scenario-icon {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		transform: scale(1.1) rotate(5deg);

	}

	

	.ccl-moto--scenario-title h3 {

		font-size: 1.5rem;

		color: var(--ccl-ink);

		margin: 0;

	}

	

	.ccl-moto--scenario-body {

		padding: 0 32px 32px;

	}

	

	.ccl-moto--scenario-body p {

		color: var(--ccl-muted);

		line-height: 1.7;

		margin: 0;

	}

	

	/* ============================================

	   INJURIES SECTION

	   ============================================ */

	

	.ccl-moto--injuries-showcase {

		display: grid;

		grid-template-columns: 1fr 1fr;

		gap: 40px;

		margin-top: 48px;

	}

	

	.ccl-moto--injuries-categories {

		display: flex;

		flex-direction: column;

		gap: 20px;

	}

	

	.ccl-moto--injury-category {

		background: var(--ccl-white);

		border-radius: 16px;

		padding: 24px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.3s ease;

	}

	

	.ccl-moto--injury-category:hover {

		border-color: var(--ccl-primary-blue);

		box-shadow: 0 8px 24px rgba(0,0,0,0.08);

	}

	

	.ccl-moto--injury-category-header {

		display: flex;

		align-items: center;

		gap: 16px;

		margin-bottom: 16px;

	}

	

	.ccl-moto--injury-category-icon {

		width: 56px;

		height: 56px;

		min-width: 56px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 14px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.6rem;

	}

	

	.ccl-moto--injury-category h4 {

		font-size: 1.3rem;

		color: var(--ccl-ink);

		margin: 0;

	}

	

	.ccl-moto--injury-list {

		display: grid;

		grid-template-columns: 1fr 1fr;

		gap: 12px;

		padding-left: 0;

		list-style: none;

		margin: 0;

	}

	

	.ccl-moto--injury-list li {

		padding: 8px 12px;

		padding-left: 32px;

		background: var(--ccl-off-white);

		border-radius: 8px;

		position: relative;

		color: var(--ccl-muted);

		font-size: 0.95rem;

		font-weight: 500;

	}

	

	.ccl-moto--injury-list li::before {

		content: '\f0a4';

		font-family: 'Font Awesome 6 Free';

		font-weight: 900;

		position: absolute;

		left: 10px;

		top: 10px;

		color: var(--ccl-primary-blue);

		font-size: 0.8rem;

	}

	

	.ccl-moto--injury-highlight {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(16, 185, 129, 0.05));

		border: 3px solid var(--ccl-primary-blue);

		border-radius: 24px;

		padding: 40px;

		display: flex;

		flex-direction: column;

		justify-content: center;

	}

	

	.ccl-moto--injury-highlight-content h3 {

		font-size: 2rem;

		color: var(--ccl-primary-blue);

		margin-bottom: 20px;

		display: flex;

		align-items: center;

		gap: 12px;

	}

	

	.ccl-moto--injury-highlight-content h3 i {

		font-size: 2.2rem;

	}

	

	.ccl-moto--injury-highlight-content p {

		font-size: 1.1rem;

		color: var(--ccl-muted);

		line-height: 1.8;

		margin-bottom: 24px;

	}

	

	.ccl-moto--injury-stats {

		display: grid;

		grid-template-columns: 1fr 1fr;

		gap: 20px;

	}

	

	.ccl-moto--injury-stat {

		background: var(--ccl-white);

		padding: 24px;

		border-radius: 12px;

		text-align: center;

	}

	

	.ccl-moto--injury-stat-icon {

		width: 50px;

		height: 50px;

		background: var(--ccl-primary-blue);

		border-radius: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.4rem;

		margin: 0 auto 12px;

	}

	

	.ccl-moto--injury-stat strong {

		display: block;

		font-size: 1.1rem;

		color: var(--ccl-ink);

		margin-bottom: 4px;

	}

	

	.ccl-moto--injury-stat span {

		font-size: 0.9rem;

		color: var(--ccl-muted);

	}

	

	/* ============================================

	   WHAT YOU CAN CLAIM SECTION

	   ============================================ */

	

	.ccl-moto--damages-showcase {

		display: grid;

		grid-template-columns: 1.2fr 1fr;

		gap: 40px;

		margin-top: 48px;

	}

	

	.ccl-moto--damages-main {

		display: flex;

		flex-direction: column;

		gap: 24px;

	}

	

	.ccl-moto--damage-card {

		background: var(--ccl-white);

		border-radius: 20px;

		padding: 32px;

		border: 2px solid var(--ccl-soft-border);

		display: flex;

		gap: 24px;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--damage-card:hover {

		border-color: var(--ccl-primary-blue);

		box-shadow: 0 10px 30px rgba(0,0,0,0.1);

		transform: translateY(-5px);

	}

	

	.ccl-moto--damage-icon-wrap {

		display: flex;

		flex-direction: column;

		align-items: center;

		gap: 8px;

	}

	

	.ccl-moto--damage-icon {

		width: 70px;

		height: 70px;

		min-width: 70px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.8rem;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--damage-card:hover .ccl-moto--damage-icon {

		transform: scale(1.1) rotate(5deg);

	}

	

	.ccl-moto--damage-content h4 {

		font-size: 1.5rem;

		color: var(--ccl-ink);

		margin-bottom: 12px;

	}

	

	.ccl-moto--damage-content p {

		color: var(--ccl-muted);

		line-height: 1.7;

		margin: 0;

	}

	

	.ccl-moto--damages-sidebar {

		display: flex;

		flex-direction: column;

		gap: 24px;

	}

	

	.ccl-moto--damages-summary {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 24px;

		padding: 36px;

		color: var(--ccl-white);

	}

	

	.ccl-moto--damages-summary h4 {

		color: var(--ccl-white);

		font-size: 1.6rem;

		margin-bottom: 20px;

		display: flex;

		align-items: center;

		gap: 12px;

	}

	

	.ccl-moto--damages-summary h4 i {

		font-size: 1.8rem;

	}

	

	.ccl-moto--damages-summary p {

		color: rgba(255,255,255,0.95);

		line-height: 1.7;

		margin-bottom: 24px;

	}

	

	.ccl-moto--damages-summary .ccl-moto--btn {

		width: 100%;

		justify-content: center;

	}

	

	.ccl-moto--property-highlight {

		background: var(--ccl-white);

		border: 3px solid var(--ccl-primary-blue);

		border-radius: 20px;

		padding: 32px;

	}

	

	.ccl-moto--property-highlight h4 {

		font-size: 1.3rem;

		color: var(--ccl-primary-blue);

		margin-bottom: 16px;

		display: flex;

		align-items: center;

		gap: 12px;

	}

	

	.ccl-moto--property-highlight h4 i {

		font-size: 1.5rem;

	}

	

	.ccl-moto--property-highlight p {

		color: var(--ccl-muted);

		line-height: 1.7;

		margin: 0;

	}

	

	/* ============================================

	   TIME LIMITS SECTION

	   ============================================ */



	.ccl-moto--timelimits-wrapper {

		margin-top: 48px;

		position: relative;

	}



	.ccl-moto--timeline-container {

		position: relative;

		max-width: 900px;

		margin: 0 auto;

	}



	.ccl-moto--timeline-container::before {

		content: '';

		position: absolute;

		left: 40px;

		top: 60px;

		bottom: 60px;

		width: 4px;

		background: linear-gradient(180deg, #dc2626, #ef4444, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 2px;

	}



	.ccl-moto--timeline-item {

		position: relative;

		padding-left: 120px;

		margin-bottom: 32px;

	}



	.ccl-moto--timeline-badge {

		position: absolute;

		left: 0;

		top: 0;

		width: 80px;

		height: 80px;

		background: var(--ccl-white);

		border-radius: 50%;

		display: flex;

		flex-direction: column;

		align-items: center;

		justify-content: center;

		font-family: var(--ccl-font-display);

		font-weight: 900;

		box-shadow: 0 8px 24px rgba(0,0,0,0.15);

		z-index: 2;

		border: 4px solid var(--ccl-white);

	}



	.ccl-moto--timeline-badge.urgent {

		background: linear-gradient(135deg, #dc2626, #ef4444);

		color: var(--ccl-white);

		animation: ccl-moto-pulse 2s ease-in-out infinite;

	}



	.ccl-moto--timeline-badge.important {

		background: linear-gradient(135deg, #f59e0b, var(--ccl-accent-gold));

		color: var(--ccl-white);

	}



	.ccl-moto--timeline-badge.standard {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

	}



	@keyframes ccl-moto-pulse {

		0%, 100% { transform: scale(1); box-shadow: 0 8px 24px rgba(220, 38, 38, 0.3); }

		50% { transform: scale(1.05); box-shadow: 0 12px 32px rgba(220, 38, 38, 0.5); }

	}



	.ccl-moto--timeline-time {

		font-size: 1.6rem;

		line-height: 1;

		margin-bottom: 4px;

	}



	.ccl-moto--timeline-label {

		font-size: 0.7rem;

		text-transform: uppercase;

		letter-spacing: 0.5px;

		opacity: 0.9;

	}



	.ccl-moto--timeline-content {

		background: var(--ccl-white);

		padding: 28px 32px;

		border-radius: 20px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.3s ease;

		box-shadow: 0 4px 12px rgba(0,0,0,0.05);

	}



	.ccl-moto--timeline-item:hover .ccl-moto--timeline-content {

		transform: translateY(-5px);

		box-shadow: 0 12px 32px rgba(0,0,0,0.12);

		border-color: var(--ccl-primary-blue);

	}



	.ccl-moto--timeline-content h4 {

		font-size: 1.4rem;

		color: var(--ccl-ink);

		margin-bottom: 12px;

		display: flex;

		align-items: center;

		gap: 10px;

	}



	.ccl-moto--timeline-content h4 i {

		color: var(--ccl-primary-blue);

		font-size: 1.2rem;

	}



	.ccl-moto--timeline-item.urgent .ccl-moto--timeline-content h4 i {

		color: #dc2626;

	}



	.ccl-moto--timeline-content p {

		color: var(--ccl-muted);

		line-height: 1.7;

		margin: 0;

		font-size: 0.98rem;

	}



	.ccl-moto--timeline-urgency-tag {

		display: inline-block;

		padding: 6px 14px;

		border-radius: 6px;

		font-size: 0.8rem;

		font-weight: 700;

		text-transform: uppercase;

		letter-spacing: 0.5px;

		margin-bottom: 12px;

	}



	.ccl-moto--timeline-urgency-tag.critical {

		background: #fee2e2;

		color: #dc2626;

	}



	.ccl-moto--timeline-urgency-tag.high {

		background: #fef3c7;

		color: #92400e;

	}



	.ccl-moto--timeline-urgency-tag.medium {

		background: #dbeafe;

		color: #1e40af;

	}



	.ccl-moto--timelimits-cta {

		background: linear-gradient(135deg, #dc2626, #ef4444);

		padding: 40px;

		border-radius: 24px;

		text-align: center;

		margin-top: 48px;

		color: var(--ccl-white);

		box-shadow: 0 12px 40px rgba(220, 38, 38, 0.3);

		position: relative;

		overflow: hidden;

	}



	.ccl-moto--timelimits-cta::before {

		content: '';

		position: absolute;

		top: -50%;

		right: -10%;

		width: 300px;

		height: 300px;

		background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

		border-radius: 50%;

	}



	.ccl-moto--timelimits-cta h4 {

		font-size: 2rem;

		color: var(--ccl-white);

		margin-bottom: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		gap: 12px;

		position: relative;

		z-index: 1;

	}



	.ccl-moto--timelimits-cta h4 i {

		font-size: 2.2rem;

		animation: ccl-moto-hourglass-spin 3s ease-in-out infinite;

	}



	@keyframes ccl-moto-hourglass-spin {

		0%, 100% { transform: rotate(0deg); }

		50% { transform: rotate(180deg); }

	}



	.ccl-moto--timelimits-cta p {

		font-size: 1.1rem;

		color: rgba(255,255,255,0.95);

		margin-bottom: 28px;

		line-height: 1.7;

		position: relative;

		z-index: 1;

	}



	.ccl-moto--timelimits-cta strong {

		color: var(--ccl-white);

		font-weight: 800;

	}



	.ccl-moto--timelimits-cta .ccl-moto--btn {

		position: relative;

		z-index: 1;

	}

	

	/* ============================================

	   PROCESS SECTION

	   ============================================ */



	.ccl-moto--process-steps {

		margin-top: 48px;

		position: relative;

		max-width: 1000px;

		margin-left: auto;

		margin-right: auto;

	}



	.ccl-moto--process-step {

		display: grid;

		grid-template-columns: 100px 1fr;

		gap: 32px;

		margin-bottom: 40px;

		position: relative;

	}



	.ccl-moto--process-step:not(:last-child)::after {

		content: '';

		position: absolute;

		left: 50px;

		top: 100px;

		bottom: -40px;

		width: 3px;

		background: linear-gradient(180deg, var(--ccl-primary-blue), rgba(29, 99, 255, 0.3));

		z-index: 0;

	}



	.ccl-moto--process-number {

		width: 100px;

		height: 100px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		border-radius: 50%;

		display: flex;

		align-items: center;

		justify-content: center;

		font-size: 2.5rem;

		font-weight: 900;

		font-family: var(--ccl-font-display);

		box-shadow: 0 12px 32px rgba(29, 99, 255, 0.35);

		position: relative;

		z-index: 1;

		transition: all 0.4s ease;

	}



	.ccl-moto--process-step:hover .ccl-moto--process-number {

		transform: scale(1.1) rotate(5deg);

		box-shadow: 0 16px 40px rgba(29, 99, 255, 0.45);

	}



	.ccl-moto--process-content {

		background: var(--ccl-white);

		padding: 36px;

		border-radius: 20px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.4s ease;

		position: relative;

		overflow: hidden;

	}



	.ccl-moto--process-content::before {

		content: '';

		position: absolute;

		top: 0;

		left: -100%;

		width: 100%;

		height: 100%;

		background: linear-gradient(90deg, transparent, rgba(29, 99, 255, 0.03), transparent);

		transition: left 0.6s ease;

	}



	.ccl-moto--process-step:hover .ccl-moto--process-content {

		transform: translateX(10px);

		box-shadow: 0 12px 40px rgba(0,0,0,0.12);

		border-color: var(--ccl-primary-blue);

	}



	.ccl-moto--process-step:hover .ccl-moto--process-content::before {

		left: 100%;

	}



	.ccl-moto--process-content h3 {

		font-size: 1.7rem;

		margin-bottom: 16px;

		color: var(--ccl-primary-blue);

		display: flex;

		align-items: center;

		gap: 12px;

		position: relative;

	}



	.ccl-moto--process-icon {

		width: 48px;

		height: 48px;

		min-width: 48px;

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

		border-radius: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-primary-blue);

		font-size: 1.3rem;

		transition: all 0.3s ease;

	}



	.ccl-moto--process-step:hover .ccl-moto--process-icon {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		transform: rotate(-5deg);

	}



	.ccl-moto--process-content p {

		color: var(--ccl-muted);

		line-height: 1.8;

		margin: 0;

		font-size: 1rem;

		position: relative;

	}



	.ccl-moto--process-highlight {

		display: inline-block;

		background: rgba(29, 99, 255, 0.1);

		color: var(--ccl-primary-blue);

		padding: 3px 8px;

		border-radius: 4px;

		font-weight: 600;

		font-size: 0.95rem;

	}



	.ccl-moto--process-completion {

		background: linear-gradient(135deg, var(--ccl-accent-green), #059669);

		color: var(--ccl-white);

		padding: 32px;

		border-radius: 20px;

		text-align: center;

		margin-top: 40px;

		box-shadow: 0 12px 32px rgba(16, 185, 129, 0.25);

	}



	.ccl-moto--process-completion h4 {

		font-size: 1.8rem;

		color: var(--ccl-white);

		margin-bottom: 12px;

		display: flex;

		align-items: center;

		justify-content: center;

		gap: 12px;

	}



	.ccl-moto--process-completion h4 i {

		font-size: 2rem;

	}



	.ccl-moto--process-completion p {

		font-size: 1.05rem;

		color: rgba(255,255,255,0.95);

		margin: 0 0 24px 0;

		line-height: 1.7;

	}

	

	/* ============================================

	   EVIDENCE SECTION

	   ============================================ */

	

	.ccl-moto--evidence-masonry {

		display: grid;

		grid-template-columns: repeat(3, 1fr);

		gap: 24px;

		margin-top: 48px;

	}

	

	.ccl-moto--evidence-card-new {

		background: var(--ccl-white);

		border-radius: 20px;

		overflow: hidden;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.3s ease;

		display: flex;

		flex-direction: column;

	}

	

	.ccl-moto--evidence-card-new:hover {

		border-color: var(--ccl-primary-blue);

		transform: translateY(-5px);

		box-shadow: 0 12px 32px rgba(0,0,0,0.1);

	}

	

	.ccl-moto--evidence-card-header {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

		padding: 28px;

		display: flex;

		align-items: center;

		gap: 16px;

		border-bottom: 2px solid var(--ccl-soft-border);

	}

	

	.ccl-moto--evidence-icon-new {

		width: 64px;

		height: 64px;

		min-width: 64px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 1.8rem;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--evidence-card-new:hover .ccl-moto--evidence-icon-new {

		transform: scale(1.1) rotate(5deg);

	}

	

	.ccl-moto--evidence-card-header h4 {

		font-size: 1.3rem;

		color: var(--ccl-ink);

		margin: 0;

	}

	

	.ccl-moto--evidence-card-body {

		padding: 24px 28px;

		flex-grow: 1;

	}

	

	.ccl-moto--evidence-list {

		list-style: none;

		padding: 0;

		margin: 0;

	}

	

	.ccl-moto--evidence-list li {

		padding: 12px 0;

		padding-left: 32px;

		position: relative;

		color: var(--ccl-muted);

		font-size: 0.95rem;

		line-height: 1.5;

		border-bottom: 1px solid var(--ccl-off-white);

	}

	

	.ccl-moto--evidence-list li:last-child {

		border-bottom: none;

	}

	

	.ccl-moto--evidence-list li::before {

		content: '\f00c';

		font-family: 'Font Awesome 6 Free';

		font-weight: 900;

		position: absolute;

		left: 0;

		color: var(--ccl-accent-green);

		font-size: 0.9rem;

	}

	

	.ccl-moto--evidence-cta-box {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 24px;

		padding: 48px;

		text-align: center;

		margin-top: 48px;

		color: var(--ccl-white);

	}

	

	.ccl-moto--evidence-cta-box h4 {

		font-size: 2rem;

		color: var(--ccl-white);

		margin-bottom: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		gap: 16px;

	}

	

	.ccl-moto--evidence-cta-box h4 i {

		font-size: 2.2rem;

	}

	

	.ccl-moto--evidence-cta-box p {

		font-size: 1.15rem;

		color: rgba(255,255,255,0.95);

		line-height: 1.7;

		margin-bottom: 32px;

		max-width: 700px;

		margin-left: auto;

		margin-right: auto;

	}

	

	/* ============================================

	   FEES SECTION

	   ============================================ */

	

	.ccl-moto--fees-content {

		background: var(--ccl-white);

		padding: 48px;

		border-radius: 20px;

		border: 2px solid var(--ccl-soft-border);

		margin-top: 48px;

	}

	

	.ccl-moto--fees-highlight {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(11, 92, 255, 0.1));

		padding: 32px;

		border-radius: 16px;

		border-left: 5px solid var(--ccl-primary-blue);

		margin-bottom: 32px;

	}

	

	.ccl-moto--fees-highlight h3 {

		font-size: 1.8rem;

		color: var(--ccl-primary-blue);

		margin-bottom: 12px;

	}

	

	.ccl-moto--fees-highlight p {

		font-size: 1.1rem;

		color: var(--ccl-ink);

		margin: 0;

	}

	

	.ccl-moto--fees-list {

		display: grid;

		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

		gap: 16px;

		margin-top: 32px;

	}

	

	.ccl-moto--fees-item {

		display: flex;

		align-items: flex-start;

		gap: 12px;

		padding: 16px;

		background: var(--ccl-off-white);

		border-radius: 12px;

	}

	

	.ccl-moto--fees-item i {

		color: var(--ccl-accent-green);

		font-size: 1.2rem;

		margin-top: 4px;

	}

	

	.ccl-moto--fees-item span {

		color: var(--ccl-muted);

		font-size: 0.95rem;

	}

	

	.ccl-moto--footnote {

		font-size: 0.85rem;

		color: var(--ccl-muted);

		margin-top: 12px;

	}

	

	.ccl-moto--asterisk {

		color: var(--ccl-primary-blue);

		font-weight: 700;

	}

	

	.ccl-moto--alert {

		background: #fff8e1;

		border-left: 4px solid var(--ccl-accent-gold);

		padding: 20px;

		border-radius: 8px;

		margin-top: 32px;

		border: 2px solid #ffd54f;

	}

	

	.ccl-moto--alert h4 {

		font-size: 1.1rem;

		color: #6d4c00;

		margin-bottom: 8px;

		display: flex;

		align-items: center;

		gap: 10px;

	}

	

	.ccl-moto--alert p {

		color: #6d4c00;

		margin: 0;

		font-size: 0.95rem;

	}

	

	.ccl-moto--alert a {

		color: #0846c1;

		font-weight: 600;

	}

	

	/* ============================================

	   WHY CHOOSE US SECTION

	   ============================================ */

	

	.ccl-moto--why-showcase {

		margin-top: 48px;

	}

	

	.ccl-moto--why-hero-card {

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.05), rgba(16, 185, 129, 0.05));

		border: 3px solid var(--ccl-primary-blue);

		border-radius: 24px;

		padding: 48px;

		margin-bottom: 40px;

	}

	

	.ccl-moto--why-hero-content {

		display: grid;

		grid-template-columns: auto 1fr;

		gap: 32px;

		align-items: center;

	}

	

	.ccl-moto--why-hero-icon {

		width: 120px;

		height: 120px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 24px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 4rem;

		box-shadow: 0 12px 40px rgba(29, 99, 255, 0.3);

	}

	

	.ccl-moto--why-hero-text h3 {

		font-size: 2.5rem;

		color: var(--ccl-primary-blue);

		margin-bottom: 16px;

	}

	

	.ccl-moto--why-hero-text p {

		font-size: 1.15rem;

		color: var(--ccl-muted);

		line-height: 1.8;

		margin: 0;

	}

	

	.ccl-moto--why-features-grid {

		display: grid;

		grid-template-columns: repeat(2, 1fr);

		gap: 24px;

		margin-bottom: 40px;

	}

	

	.ccl-moto--why-feature-card {

		background: var(--ccl-white);

		border-radius: 20px;

		padding: 32px;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.3s ease;

		display: flex;

		gap: 20px;

	}

	

	.ccl-moto--why-feature-card:hover {

		border-color: var(--ccl-primary-blue);

		transform: translateY(-5px);

		box-shadow: 0 12px 32px rgba(0,0,0,0.1);

	}

	

	.ccl-moto--why-feature-icon {

		width: 70px;

		height: 70px;

		min-width: 70px;

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.15));

		border-radius: 16px;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-primary-blue);

		font-size: 2rem;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--why-feature-card:hover .ccl-moto--why-feature-icon {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		transform: scale(1.1) rotate(5deg);

	}

	

	.ccl-moto--why-feature-content h4 {

		font-size: 1.3rem;

		color: var(--ccl-ink);

		margin-bottom: 12px;

	}

	

	.ccl-moto--why-feature-content p {

		color: var(--ccl-muted);

		line-height: 1.7;

		margin: 0;

		font-size: 0.95rem;

	}

	

	/* ============================================

	   COMPARISON TABLES

	   ============================================ */

	

	.ccl-moto--comparison-table {

		display: grid;

		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

		gap: 24px;

		margin-top: 48px;

	}

	

	.ccl-moto--comparison-column {

		background: var(--ccl-white);

		border: 2px solid var(--ccl-soft-border);

		border-radius: 20px;

		overflow: hidden;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--comparison-column:hover {

		transform: translateY(-5px);

		box-shadow: 0 12px 40px rgba(0,0,0,0.1);

	}

	

	.ccl-moto--comparison-column.featured {

		border-color: var(--ccl-primary-blue);

		border-width: 3px;

		transform: scale(1.05);

	}

	

	.ccl-moto--comparison-header {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		padding: 24px;

		text-align: center;

	}

	

	.ccl-moto--comparison-header h4 {

		font-size: 1.4rem;

		margin-bottom: 8px;

		color: var(--ccl-white);

	}

	

	.ccl-moto--comparison-header p {

		font-size: 0.9rem;

		opacity: 0.9;

		margin: 0;

	}

	

	.ccl-moto--comparison-body {

		padding: 28px;

	}

	

	.ccl-moto--comparison-body ul {

		list-style: none;

		padding: 0;

		margin: 0;

	}

	

	.ccl-moto--comparison-body li {

		padding: 12px 0;

		border-bottom: 1px solid var(--ccl-soft-border);

		display: flex;

		align-items: center;

		gap: 12px;

	}

	

	.ccl-moto--comparison-body li:last-child {

		border-bottom: none;

	}

	

	.ccl-moto--comparison-body li i {

		color: var(--ccl-accent-green);

		font-size: 1.1rem;

	}

	

	/* ============================================

	   FAQ SECTION

	   ============================================ */

	

	.ccl-moto--faq-list {

		margin-top: 48px;

		max-width: 900px;

		margin-left: auto;

		margin-right: auto;

	}

	

	.ccl-moto--faq-item {

		background: var(--ccl-white);

		border: 2px solid var(--ccl-soft-border);

		border-radius: 16px;

		margin-bottom: 20px;

		overflow: hidden;

		transition: all 0.3s ease;

	}

	

	.ccl-moto--faq-item:hover {

		border-color: var(--ccl-primary-blue);

	}

	

	.ccl-moto--faq-question {

		width: 100%;

		background: transparent;

		border: none;

		padding: 24px 28px;

		text-align: left;

		cursor: pointer;

		display: flex;

		justify-content: space-between;

		align-items: center;

		font-family: var(--ccl-font-display);

		font-size: 1.15rem;

		font-weight: 800;

		color: var(--ccl-ink);

		transition: all 0.3s ease;

	}

	

	.ccl-moto--faq-question:hover {

		color: var(--ccl-primary-blue);

	}

	

	.ccl-moto--faq-icon {

		width: 32px;

		height: 32px;

		min-width: 32px;

		background: var(--ccl-off-white);

		border-radius: 50%;

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-primary-blue);

		transition: all 0.3s ease;

	}

	

	.ccl-moto--faq-item.active .ccl-moto--faq-icon {

		background: var(--ccl-primary-blue);

		color: var(--ccl-white);

		transform: rotate(180deg);

	}

	

	.ccl-moto--faq-answer {

		max-height: 0;

		overflow: hidden;

		transition: max-height 0.3s ease;

	}

	

	.ccl-moto--faq-item.active .ccl-moto--faq-answer {

		max-height: 1000px;

	}

	

	.ccl-moto--faq-answer-content {

		padding: 0 28px 24px;

		color: var(--ccl-muted);

		line-height: 1.7;

	}

	

	.ccl-moto--faq-answer-content p {

		margin-bottom: 12px;

	}

	

	.ccl-moto--faq-answer-content p:last-child {

		margin-bottom: 0;

	}

	

	/* ============================================

	   RESOURCES SECTION

	   ============================================ */



	.ccl-moto--resources-showcase {

		display: grid;

		grid-template-columns: 1fr 1fr;

		gap: 32px;

		margin-top: 48px;

	}



	.ccl-moto--resource-card-new {

		background: var(--ccl-white);

		border-radius: 24px;

		overflow: hidden;

		border: 2px solid var(--ccl-soft-border);

		transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

		display: flex;

		flex-direction: column;

		position: relative;

	}



	.ccl-moto--resource-card-new::before {

		content: '';

		position: absolute;

		top: 0;

		left: 0;

		right: 0;

		height: 5px;

		background: linear-gradient(90deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		transform: translateY(-5px);

		transition: transform 0.4s ease;

	}



	.ccl-moto--resource-card-new:hover {

		transform: translateY(-8px);

		box-shadow: 0 20px 60px rgba(0,0,0,0.15);

		border-color: var(--ccl-primary-blue);

	}



	.ccl-moto--resource-card-new:hover::before {

		transform: translateY(0);

	}



	.ccl-moto--resource-visual {

		height: 180px;

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		display: flex;

		align-items: center;

		justify-content: center;

		color: var(--ccl-white);

		font-size: 4rem;

		position: relative;

		overflow: hidden;

	}



	.ccl-moto--resource-visual::before {

		content: '';

		position: absolute;

		top: -50%;

		right: -50%;

		width: 200%;

		height: 200%;

		background: radial-gradient(circle, rgba(255,255,255,0.15) 0%, transparent 70%);

		animation: ccl-moto-glow-pulse 8s ease-in-out infinite;

	}



	.ccl-moto--resource-visual i {

		position: relative;

		z-index: 1;

		transition: all 0.4s ease;

	}



	.ccl-moto--resource-card-new:hover .ccl-moto--resource-visual i {

		transform: scale(1.15) rotate(-5deg);

	}



	.ccl-moto--resource-card-new:nth-child(1) .ccl-moto--resource-visual {

		background: linear-gradient(135deg, #0891b2, #06b6d4);

	}



	.ccl-moto--resource-card-new:nth-child(2) .ccl-moto--resource-visual {

		background: linear-gradient(135deg, #059669, #10b981);

	}



	.ccl-moto--resource-card-new:nth-child(3) .ccl-moto--resource-visual {

		background: linear-gradient(135deg, #7c3aed, #a78bfa);

	}



	.ccl-moto--resource-card-new:nth-child(4) .ccl-moto--resource-visual {

		background: linear-gradient(135deg, #dc2626, #f87171);

	}



	.ccl-moto--resource-content-new {

		padding: 32px;

		flex-grow: 1;

		display: flex;

		flex-direction: column;

	}



	.ccl-moto--resource-badge {

		display: inline-block;

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

		color: var(--ccl-primary-blue);

		padding: 8px 16px;

		border-radius: 8px;

		font-size: 0.8rem;

		font-weight: 700;

		text-transform: uppercase;

		letter-spacing: 0.5px;

		margin-bottom: 16px;

		align-self: flex-start;

		border: 1px solid rgba(29, 99, 255, 0.2);

	}



	.ccl-moto--resource-card-new:nth-child(1) .ccl-moto--resource-badge {

		background: linear-gradient(135deg, rgba(8, 145, 178, 0.1), rgba(6, 182, 212, 0.05));

		color: #0891b2;

		border-color: rgba(8, 145, 178, 0.2);

	}



	.ccl-moto--resource-card-new:nth-child(2) .ccl-moto--resource-badge {

		background: linear-gradient(135deg, rgba(5, 150, 105, 0.1), rgba(16, 185, 129, 0.05));

		color: #059669;

		border-color: rgba(5, 150, 105, 0.2);

	}



	.ccl-moto--resource-card-new:nth-child(3) .ccl-moto--resource-badge {

		background: linear-gradient(135deg, rgba(124, 58, 237, 0.1), rgba(167, 139, 250, 0.05));

		color: #7c3aed;

		border-color: rgba(124, 58, 237, 0.2);

	}



	.ccl-moto--resource-card-new:nth-child(4) .ccl-moto--resource-badge {

		background: linear-gradient(135deg, rgba(220, 38, 38, 0.1), rgba(248, 113, 113, 0.05));

		color: #dc2626;

		border-color: rgba(220, 38, 38, 0.2);

	}



	.ccl-moto--resource-content-new h4 {

		font-size: 1.5rem;

		color: var(--ccl-ink);

		margin-bottom: 12px;

		line-height: 1.3;

	}



	.ccl-moto--resource-content-new p {

		color: var(--ccl-muted);

		line-height: 1.7;

		margin-bottom: 24px;

		flex-grow: 1;

		font-size: 0.98rem;

	}



	.ccl-moto--resource-link-new {

		display: inline-flex;

		align-items: center;

		gap: 10px;

		color: var(--ccl-primary-blue);

		font-weight: 700;

		font-size: 1.05rem;

		text-decoration: none;

		transition: all 0.3s ease;

		align-self: flex-start;

		padding: 10px 20px 10px 0;

	}



	.ccl-moto--resource-link-new:hover {

		gap: 16px;

		color: var(--ccl-cta-dark);

	}



	.ccl-moto--resource-link-new i {

		width: 32px;

		height: 32px;

		background: linear-gradient(135deg, rgba(29, 99, 255, 0.1), rgba(11, 92, 255, 0.05));

		border-radius: 50%;

		display: flex;

		align-items: center;

		justify-content: center;

		font-size: 0.9rem;

		transition: all 0.3s ease;

	}



	.ccl-moto--resource-link-new:hover i {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		color: var(--ccl-white);

		transform: translateX(4px);

	}



	.ccl-moto--resource-card-new:first-child {

		grid-column: 1 / -1;

		display: grid;

		grid-template-columns: 300px 1fr;

	}



	.ccl-moto--resource-card-new:first-child .ccl-moto--resource-visual {

		height: 100%;

		min-height: 300px;

	}



	.ccl-moto--resource-card-new:first-child .ccl-moto--resource-content-new {

		padding: 40px;

	}



	.ccl-moto--resource-card-new:first-child h4 {

		font-size: 2rem;

	}



	.ccl-moto--resource-card-new:first-child p {

		font-size: 1.1rem;

	}



	.ccl-moto--resources-cta {

		background: linear-gradient(135deg, var(--ccl-primary-blue), var(--ccl-cta-blue));

		border-radius: 24px;

		padding: 48px;

		text-align: center;

		margin-top: 48px;

		color: var(--ccl-white);

		position: relative;

		overflow: hidden;

	}



	.ccl-moto--resources-cta::before {

		content: '';

		position: absolute;

		top: -50%;

		left: -10%;

		width: 400px;

		height: 400px;

		background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);

		border-radius: 50%;

	}



	.ccl-moto--resources-cta h3 {

		font-size: 2.2rem;

		color: var(--ccl-white);

		margin-bottom: 16px;

		position: relative;

		z-index: 1;

	}



	.ccl-moto--resources-cta p {

		font-size: 1.15rem;

		color: rgba(255,255,255,0.95);

		margin-bottom: 28px;

		position: relative;

		z-index: 1;

		line-height: 1.7;

	}



	.ccl-moto--resources-cta .ccl-moto--btn {

		position: relative;

		z-index: 1;

	}

	

	/* ============================================

	   FOCUS STYLES

	   ============================================ */

	

	.ccl-moto--wrapper a:focus,

	.ccl-moto--wrapper button:focus,

	.ccl-moto--wrapper input:focus,

	.ccl-moto--wrapper textarea:focus,

	.ccl-moto--wrapper select:focus {

		outline: 3px solid var(--ccl-primary-blue);

		outline-offset: 2px;

	}

	

	.ccl-moto--wrapper .ccl-moto--btn:focus {

		outline: 3px solid var(--ccl-ink);

		outline-offset: 3px;

	}

	

	/* ============================================

	   SCROLL REVEAL ANIMATION

	   ============================================ */

	

	.ccl-moto--scroll-reveal {

		opacity: 0;

		transform: translateY(40px);

		transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);

	}

	

	.ccl-moto--scroll-reveal.revealed {

		opacity: 1;

		transform: translateY(0);

	}

	

	/* ============================================

	   RESPONSIVE DESIGN

	   ============================================ */

	

	@media (max-width: 1024px) {

		.ccl-moto--wrapper {

			--ccl-section-padding: 80px;

			--ccl-card-padding: 28px;

			--ccl-gap-large: 28px;

		}

		

		.ccl-moto--hero {

			padding: 80px 24px 80px;

		}

		

		.ccl-moto--eligibility-layout,

		.ccl-moto--damages-showcase {

			grid-template-columns: 1fr;

			gap: 32px;

		}

		

		.ccl-moto--comparison-table {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--comparison-column.featured {

			transform: scale(1);

		}

		

		.ccl-moto--claim-hero-content,

		.ccl-moto--injuries-showcase,

		.ccl-moto--scenarios-grid {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--claim-categories {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--evidence-masonry {

			grid-template-columns: repeat(2, 1fr);

		}

		

		.ccl-moto--why-features-grid {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--resources-showcase {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--resource-card-new:first-child {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--resource-card-new:first-child .ccl-moto--resource-visual {

			min-height: 200px;

		}

	}

	

	@media (max-width: 768px) {

		.ccl-moto--wrapper {

			--ccl-section-padding: 60px;

			--ccl-card-padding: 24px;

			--ccl-gap-large: 24px;

		}

		

		.ccl-moto--hero {

			padding: 80px 20px 60px;

		}

		

		.ccl-moto--hero-ctas {

			flex-direction: column;

			width: 100%;

		}

		

		.ccl-moto--hero-ctas .ccl-moto--btn {

			justify-content: center;

		}

		

		.ccl-moto--hero-stats {

			gap: 24px;

		}

		

		.ccl-moto--section-header {

			margin-bottom: 40px;

		}

		

		.ccl-moto--process-step {

			grid-template-columns: 1fr;

			gap: 20px;

		}

		

		.ccl-moto--process-number {

			margin: 0 auto;

		}

		

		.ccl-moto--process-step:not(:last-child)::after {

			left: 50%;

			transform: translateX(-50%);

		}

		

		.ccl-moto--eligibility-main,

		.ccl-moto--fees-content,

		.ccl-moto--claim-hero {

			padding: 32px 24px;

		}

		

		.ccl-moto--injury-list {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--injury-stats {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--evidence-masonry {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--why-hero-content {

			grid-template-columns: 1fr;

			text-align: center;

		}

		

		.ccl-moto--why-hero-icon {

			margin: 0 auto;

		}

		

		.ccl-moto--action-grid {

			grid-template-columns: 1fr;

		}

		

		.ccl-moto--action-banner {

			padding: 32px 24px;

		}

		

		.ccl-moto--action-header h4 {

			font-size: 1.6rem;

			flex-direction: column;

		}

		

		.ccl-moto--requirement-card {

			padding: 24px;

		}

		

		.ccl-moto--requirement-header {

			flex-direction: column;

			align-items: flex-start;

			gap: 16px;

		}

		

		.ccl-moto--eligibility-note {

			padding: 24px;

		}

		

		.ccl-moto--eligibility-main > h3 {

			font-size: 1.6rem;

		}

		

		.ccl-moto--timeline-container::before {

			left: 30px;

		}

		

		.ccl-moto--timeline-item {

			padding-left: 90px;

		}

		

		.ccl-moto--timeline-badge {

			width: 60px;

			height: 60px;

		}

		

		.ccl-moto--timeline-time {

			font-size: 1.2rem;

		}

		

		.ccl-moto--timeline-label {

			font-size: 0.6rem;

		}

		

		.ccl-moto--timeline-content {

			padding: 20px 24px;

		}

		

		.ccl-moto--timeline-content h4 {

			font-size: 1.2rem;

		}

		

		.ccl-moto--timelimits-cta {

			padding: 32px 24px;

		}

		

		.ccl-moto--timelimits-cta h4 {

			font-size: 1.6rem;

			flex-direction: column;

		}

		

		.ccl-moto--process-step {

			grid-template-columns: 70px 1fr;

			gap: 20px;

			margin-bottom: 32px;

		}

		

		.ccl-moto--process-number {

			width: 70px;

			height: 70px;

			font-size: 2rem;

		}

		

		.ccl-moto--process-step:not(:last-child)::after {

			left: 35px;

			top: 70px;

			bottom: -32px;

		}

		

		.ccl-moto--process-content {

			padding: 24px;

		}

		

		.ccl-moto--process-content h3 {

			font-size: 1.3rem;

			flex-direction: column;

			align-items: flex-start;

		}

		

		.ccl-moto--process-step:hover .ccl-moto--process-content {

			transform: translateX(5px);

		}

		

		.ccl-moto--resource-visual {

			height: 160px;

			font-size: 3rem;

		}

		

		.ccl-moto--resource-content-new {

			padding: 24px;

		}

		

		.ccl-moto--resource-card-new:first-child .ccl-moto--resource-content-new {

			padding: 28px;

		}

		

		.ccl-moto--resource-content-new h4 {

			font-size: 1.3rem;

		}

		

		.ccl-moto--resource-card-new:first-child h4 {

			font-size: 1.6rem;

		}

		

		.ccl-moto--resources-cta {

			padding: 36px 24px;

		}

		

		.ccl-moto--resources-cta h3 {

			font-size: 1.8rem;

		}

	}

	

	@media (max-width: 480px) {

		.ccl-moto--wrapper {

			--ccl-section-padding: 50px;

			--ccl-card-padding: 20px;

			font-size: 15px;

		}

		

		.ccl-moto--section {

			padding: var(--ccl-section-padding) 16px;

		}

		

		.ccl-moto--hero {

			padding: 60px 16px 50px;

		}

		

		.ccl-moto--section-kicker::before,

		.ccl-moto--section-kicker::after {

			width: 30px;

		}

		

		.ccl-moto--btn {

			padding: 14px 24px;

			font-size: 0.95rem;

		}

		

		.ccl-moto--hero-stat {

			flex-direction: column;

			text-align: center;

		}

		

		.ccl-moto--process-step {

			grid-template-columns: 1fr;

			gap: 16px;

		}

		

		.ccl-moto--process-number {

			margin: 0 auto;

		}

		

		.ccl-moto--process-step:not(:last-child)::after {

			left: 50%;

			transform: translateX(-50%);

		}

	}

/* Footer */

	#top{position:absolute;top:0;left:0}



	/* Scope & Inter — but don't override Font Awesome */

	.ccl-footer-2024,

	.ccl-footer-2024 :where(*) {

	  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

	  box-sizing: border-box;

	}

	/* Restore Font Awesome font-family */

	.ccl-footer-2024 :where(.fa, .fa-solid, .fa-regular) {

	  font-family: "Font Awesome 6 Free" !important;

	  font-weight: var(--fa-style, 900) !important; /* 900 solid, 400 regular */

	}

	.ccl-footer-2024 :where(.fa-regular) { font-weight: 400 !important; }

	.ccl-footer-2024 :where(.fa-brands)  {

	  font-family: "Font Awesome 6 Brands" !important;

	  font-weight: 400 !important;

	}



	/* Strong focus-visible for a11y */

	.ccl-footer-2024 :where(a,button,input){outline:0}

	.ccl-footer-2024 :where(a:focus-visible,button:focus-visible,input:focus-visible){

	  box-shadow:0 0 0 3px rgba(37,99,235,.45);

	  border-color:rgba(37,99,235,.6);

	}



	/* Shell */

	.ccl-footer-2024{

	  position:relative;color:var(--text);

	  background:

		radial-gradient(1100px 700px at 85% -20%,rgba(37,99,235,.14),transparent),

		radial-gradient(800px 500px at 10% -10%,rgba(37,99,235,.1),transparent),

		var(--footer-bg);

	  border-top:0; /* removed subtle outer divider */

	  overflow:hidden;

	  --primary:#2563eb; --primary-600:#1d4ed8;

	  --gold:#f5c65d; --gold-600:#e3b24a;

	  --footer-bg:#0A101E; --panel:#0f172a;

	  --text:#e2e8f0; --subtle:#94a3b8; --muted:#334155;

	  --r-sm:8px; --r-md:12px; --r-lg:16px;

	  --ring:0 0 0 4px rgba(37,99,235,.18);

	  --shadow-md:0 10px 24px rgba(0,0,0,.28);

	  --glow:0 0 20px rgba(37,99,235,.15);

	  --btn-h:38px;

	}

	.ccl-footer-2024::after{

	  content:"";position:absolute;inset:0;pointer-events:none;

	  background:

		linear-gradient(180deg,rgba(255,255,255,.04),transparent 18%),

		linear-gradient(0deg,rgba(255,255,255,.03),transparent 40%);

	  mix-blend-mode:overlay;

	}

	.ccl-footer__wrap{max-width:1320px;margin:0 auto;padding:0 24px;position:relative;z-index:1}



	/* 1) Claim band */

	.ccl-footer__claim-band{padding:18px 0;border-bottom:1px solid rgba(148,163,184,.18);background:linear-gradient(180deg,rgba(255,255,255,.02),transparent)}

	.ccl-footer__claim-row{display:grid;grid-template-columns:1fr 1.6fr;gap:24px;align-items:center}

	.ccl-footer__claim-left{display:flex;gap:16px;align-items:center;flex-wrap:wrap}

	.ccl-footer__pill{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(37,99,235,.18),rgba(245,198,93,.18));border:1px solid rgba(148,163,184,.22)}

	.ccl-footer__claim-title{font-size:18px;font-weight:800;margin:0}

	.ccl-footer__claim-sub{margin:0;color:var(--subtle);font-size:13px}



	/* Unified button system */

	.ccl-footer__btn,

	.ccl-footer__ghost{height:var(--btn-h)}

	.ccl-footer__btn{display:inline-flex;align-items:center;gap:8px;padding:0 16px;border-radius:12px;border:1px solid transparent;font-weight:800;font-size:13px;text-decoration:none;cursor:pointer;transition:.25s;line-height:1}

	.ccl-footer__btn i,.ccl-footer__ghost i{font-size:.95em}

	.ccl-footer__btn--primary{background:var(--primary);color:#fff;border-color:var(--primary)}

	.ccl-footer__btn--primary:hover{background:var(--primary-600);border-color:var(--primary-600);transform:translateY(-1px);box-shadow:var(--glow)}

	.ccl-footer__btn--ghost{background:rgba(255,255,255,.04);color:var(--text);border:1px solid rgba(148,163,184,.22)}

	.ccl-footer__btn--ghost:hover{border-color:rgba(148,163,184,.42);transform:translateY(-1px)}



	.ccl-footer__claim-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:center}

	.ccl-footer__stat{background:linear-gradient(135deg,rgba(15,23,42,.9),rgba(10,16,30,.95));border:1px solid rgba(148,163,184,.22);border-radius:12px;padding:10px 12px;display:grid;gap:2px;transition:transform .2s}

	.ccl-footer__stat:hover{transform:translateY(-2px)}

	.ccl-footer__stat-key{color:var(--subtle);font-size:11px}

	.ccl-footer__stat-value{font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

	.ccl-footer__obfuscated{color:transparent;background:linear-gradient(90deg,rgba(255,255,255,.25),rgba(255,255,255,.8),rgba(255,255,255,.25));-webkit-background-clip:text;background-clip:text;background-size:200% 100%;animation:ccl-footer-shimmer 2.4s ease-in-out infinite}

	.ccl-footer__stat--total .ccl-footer__stat-value{background:linear-gradient(90deg,rgba(245,198,93,.2),rgba(245,198,93,.9),rgba(245,198,93,.2));-webkit-background-clip:text;background-clip:text}

	.ccl-footer__claim-progress{grid-column:1/-1;height:6px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden;border:1px solid rgba(148,163,184,.16)}

	.ccl-footer__claim-progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--primary),#60a5fa 45%,var(--gold) 100%);width:0%;animation:ccl-footer-loadBar 2.1s cubic-bezier(.22,.8,.3,1) forwards .25s}

	@keyframes ccl-footer-shimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}

	@keyframes ccl-footer-loadBar{to{width:82%}}



	/* 2) Footer main links — alignment */

	.ccl-footer__main{padding:40px 0 20px}

	.ccl-footer__grid{display:grid;gap:32px;grid-template-columns:1.3fr 1fr 1fr 1fr;align-items:start}

	.ccl-footer__col{display:flex;flex-direction:column;gap:12px;align-items:flex-start;min-width:0}

	.ccl-footer__logo{height:42px;margin-bottom:10px}

	.ccl-footer__tagline{max-width:46ch;color:var(--subtle);font-size:14px;margin:4px 0 8px;line-height:1.5}

	.ccl-footer__social{display:flex;gap:10px;flex-wrap:wrap;margin-top:2px}

	.ccl-footer__social-link{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.18);transition:.25s;color:var(--text);text-decoration:none}

	.ccl-footer__social-link:hover{background:var(--primary);border-color:var(--primary);transform:translateY(-1px);box-shadow:var(--shadow-md);color:#fff}

	.ccl-footer__col-heading{font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:var(--subtle);font-size:12px;margin-bottom:6px;position:relative;padding-bottom:8px}

	.ccl-footer__col-heading::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--primary),transparent 70%);opacity:.85;border-radius:2px}

	.ccl-footer__links{list-style:none;display:grid;gap:4px;padding:0;margin:0}

	.ccl-footer__link{

	  display:flex;align-items:center;gap:10px;

	  color:#cfd9eb;text-decoration:none;font-weight:500;font-size:14px;

	  padding:8px 8px;border-radius:8px;transition:.25s;line-height:1.25;

	}

	.ccl-footer__link i{width:1.25em;text-align:center;opacity:.95;flex:0 0 1.25em}

	.ccl-footer__link:hover{color:#fff;transform:translateX(4px);background:rgba(255,255,255,.03)}



	/* 3) Mid split: map + offices */

	.ccl-footer__mid{padding:28px 0;border-top:0}

	.ccl-footer__split{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:start}



	.ccl-footer__map-card{background:linear-gradient(135deg,rgba(15,23,42,.9),rgba(10,16,30,.95));border:1px solid rgba(148,163,184,.22);border-radius:16px;padding:16px;box-shadow:var(--shadow-md)}

	.ccl-footer__map-head{display:flex;gap:8px;align-items:center;margin-bottom:12px}

	.ccl-footer__pill-sm{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(37,99,235,.18),rgba(245,198,93,.18));border:1px solid rgba(148,163,184,.22)}

	.ccl-footer__map-title{font-weight:800;margin:0;font-size:15px}

	.ccl-footer__map-wrap{border-radius:12px;overflow:hidden;border:1px solid rgba(148,163,184,.22);background:#0b1326}

	.ccl-footer__map-iframe{display:block;width:100%;height:260px;border:0}



	/* Toolbar grid so GPS button aligns with inputs */

	.ccl-footer__map-toolbar{

	  display:grid;

	  grid-template-columns: var(--btn-h) 1fr;

	  gap:8px; align-items:stretch; margin-top:12px;

	}

	.ccl-footer__icon-btn{

	  height:var(--btn-h);width:var(--btn-h);

	  display:grid;place-items:center;border-radius:10px;

	  border:1px solid rgba(148,163,184,.22);

	  background:rgba(255,255,255,.04);cursor:pointer;transition:.2s;color:var(--text);

	  line-height:1;

	}

	.ccl-footer__icon-btn:hover{background:rgba(255,255,255,.08)}



	.ccl-footer__map-form{

	  display:grid; grid-template-columns: 1fr auto auto; gap:8px; align-items:stretch;

	}

	.ccl-footer__map-input{

	  min-height:var(--btn-h);border-radius:10px;border:1px solid rgba(148,163,184,.22);

	  background:rgba(255,255,255,.04);color:var(--text);padding:0 12px;font-size:14px;outline:none;transition:.2s

	}

	.ccl-footer__map-input:focus{border-color:var(--primary);box-shadow:var(--ring)}

	.ccl-footer__status{color:#b6c2d4;font-size:12px;margin-top:6px;min-height:16px}



	.ccl-footer__locations{background:linear-gradient(135deg,rgba(15,23,42,.85),rgba(10,16,30,.95));border:1px solid rgba(148,163,184,.22);border-radius:16px;padding:16px;box-shadow:var(--shadow-md)}

	.ccl-footer__locations-heading{font-weight:800;font-size:12px;text-transform:uppercase;color:var(--subtle);margin:0 0 12px}

	.ccl-footer__office{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:12px 10px;border-top:1px dashed rgba(148,163,184,.18);border-radius:8px;transition:.2s}

	.ccl-footer__office:first-of-type{border-top:none}

	.ccl-footer__office:hover{background:rgba(255,255,255,.03)}

	.ccl-footer__office-icon{color:var(--gold)}

	.ccl-footer__office-name{margin:0 0 2px;font-size:14px}

	.ccl-footer__office-address{margin:0;color:#bcd1ea;font-size:13px}

	.ccl-footer__chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}

	.ccl-footer__chip{display:inline-flex;gap:6px;align-items:center;background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.22);border-radius:999px;padding:0 10px;height:34px;font-weight:700;font-size:12px;text-decoration:none;color:#e5ecf8;transition:.2s;cursor:pointer;line-height:1}

	.ccl-footer__chip:hover{background:rgba(255,255,255,.08);transform:translateY(-1px)}

	.ccl-footer__distance{display:none;color:#93c5fd;font-weight:800;font-size:11px;margin-top:2px}

	.ccl-footer__office--active{background:rgba(255,255,255,.05);border:1px solid rgba(37,99,235,.3);box-shadow:0 0 0 1px rgba(37,99,235,.2)}



	/* 4) Ribbon with mini callback form */

	.ccl-footer__ribbon-wrap{padding:12px 0}

	.ccl-footer__ribbon{background:linear-gradient(90deg,rgba(245,198,93,.16),rgba(37,99,235,.16));border:1px solid rgba(148,163,184,.22);border-radius:14px;padding:16px 20px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:var(--shadow-md)}

	.ccl-footer__badge{background:var(--gold);color:#0b1022;font-weight:900;padding:8px 14px;border-radius:999px;display:inline-flex;gap:8px;align-items:center;white-space:nowrap;max-width:max-content}

	.ccl-footer__ribbon-content{display:flex;flex-direction:column;gap:6px;flex:1;align-items:flex-start;min-width:240px}

	.ccl-footer__ribbon-text{font-size:14px;color:var(--text);margin:0;line-height:1.4}

	.ccl-footer__ribbon-subtext{font-size:12px;color:var(--subtle);margin:0}

	.ccl-footer__ghost{background:rgba(255,255,255,.04);color:var(--text);border:1px solid rgba(148,163,184,.22);height:var(--btn-h);padding:0 14px;border-radius:10px;font-weight:800;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:.25s;white-space:nowrap}

	.ccl-footer__ghost:hover{border-color:rgba(148,163,184,.42);transform:translateY(-1px)}



	.ccl-footer__callback{

	  display:grid;grid-template-columns: 1.2fr 1.2fr auto;gap:8px;align-items:stretch;min-width:320px;

	}

	.ccl-footer__field{

	  min-height:var(--btn-h);border-radius:10px;border:1px solid rgba(148,163,184,.22);

	  background:rgba(255,255,255,.04);color:var(--text);padding:0 12px;font-size:14px;outline:none;transition:.2s

	}

	.ccl-footer__field:focus{border-color:var(--primary);box-shadow:var(--ring)}



	/* 5) Compliance bar */

	.ccl-footer__compliance{

	  padding:10px 0 0;color:#94a3b8;font-size:12px

	}

	.ccl-footer__compliance .sep{opacity:.6;margin:0 6px}



	/* 6) Subfooter + back-to-top */

	.ccl-footer__sub{background:#060B15;border-top:1px solid rgba(148,163,184,.18);padding:16px 0;margin-top:16px}

	.ccl-footer__subwrap{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#97a6ba;font-size:13px}

	.ccl-footer__sublink{color:#b6c2d4;text-decoration:none;transition:color .2s}

	.ccl-footer__sublink:hover{text-decoration:underline;color:#fff}

	.ccl-footer__top{display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(148,163,184,.22);border-radius:999px;height:34px;padding:0 12px;text-decoration:none;color:#cfd9eb;background:rgba(255,255,255,.03)}

	.ccl-footer__top:hover{background:rgba(255,255,255,.06)}



	/* Responsive */

	@media (max-width:1100px){.ccl-footer__grid{grid-template-columns:1fr 1fr}}

	@media (max-width:900px){

	  .ccl-footer__claim-row{grid-template-columns:1fr;gap:16px}

	  .ccl-footer__claim-stats{grid-template-columns:repeat(2,1fr)}

	  .ccl-footer__split{grid-template-columns:1fr}

	}

	@media (max-width:768px){

	  .ccl-footer__grid{grid-template-columns:1fr}

	  .ccl-footer__claim-left{flex-direction:column;align-items:flex-start}

	  .ccl-footer__claim-stats{grid-template-columns:1fr}

	  .ccl-footer__subwrap{flex-direction:column;text-align:center}

	  .ccl-footer__ribbon{flex-direction:column;text-align:center;gap:16px}

	  .ccl-footer__ribbon-content{align-items:center}

	  .ccl-footer__callback{grid-template-columns:1fr;min-width:unset;width:100%}

	}

	@media (max-width:600px){

	  .ccl-footer__map-toolbar{grid-template-columns:1fr}

	  .ccl-footer__map-form{grid-template-columns:1fr}

	}

	@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

	.ccl-footer__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ========================================

   5. MOBILE DRAWER

   ======================================== */



.mobile-nav {

	display: block;

	position: fixed;

	top: 0;

	right: -100%;

	height: 100%;

	width: min(84%, 340px);

	background: #fff;

	box-shadow: -4px 0 24px rgba(0, 0, 0, .12);

	z-index: 1000;

	padding: 24px;

	transition: right .28s ease;

	overflow-y: auto;

}



.mobile-nav.active {

	right: 0;

}



.mobile-nav-header {

	display: flex;

	justify-content: space-between;

	align-items: center;

	padding-bottom: 16px;

	margin-bottom: 16px;

	border-bottom: 1px solid var(--line);

}



.mobile-nav-header .cc-logo img {

	height: 36px;

}



.mobile-nav .close-btn {

	position: static;

	background: none;

	border: 0;

	font-size: 28px;

	cursor: pointer;

}



.mobile-nav ul {

	list-style: none;

	margin: 0;

	padding: 0;

}



.mobile-nav>ul>li>a,

.mobile-nav>ul>li>button {

	display: flex;

	justify-content: space-between;

	align-items: center;

	padding: 14px 0;

	font-size: 18px;

	font-weight: 700;

	width: 100%;

	background: none;

	border: none;

	text-align: left;

	cursor: pointer;

}



.mobile-nav .chevron-icon {

	transition: transform .2s;

}



.mobile-nav .submenu-toggle[aria-expanded="true"] .chevron-icon {

	transform: rotate(90deg);

}



.mobile-nav .submenu {

	list-style: none;

	padding-left: 16px;

	max-height: 0;

	overflow: hidden;

	transition: max-height .3s;

}



.mobile-nav .submenu li a {

	display: block;

	padding: 10px 0;

	font-size: 16px;

	font-weight: 500;

}



.mobile-cta {

	margin-top: 24px;

}



.mobile-cta .btn {

	width: 100%;

}



/* ========================================

   6. FOOTER

   ======================================== */





/* ========================================

   7. RESPONSIVE MEDIA QUERIES

   ======================================== */



/* Motion Reduction */

@media (prefers-reduced-motion: reduce) {

	.headline .hi.shine::before {

		animation: none;

	}

	.ticker-track {

		animation: none;

	}

}



/* ----------------------------------------

   Max-width 420px

   ---------------------------------------- */

@media (max-width: 420px) {

	.metrics {

		grid-template-columns: 1fr;

	}

}



/* ----------------------------------------

   Min-width 420px

   ---------------------------------------- */

@media (min-width: 420px) {

	.metrics {

		grid-template-columns: repeat(2, 1fr);

	}

	.headline {

		font-size: clamp(30px, 6.5vw, 36px);

	}

}



/* ----------------------------------------

   Max-width 480px

   ---------------------------------------- */

@media (max-width: 480px) {

	.ccl-notes-grid {

		grid-template-columns: 1fr;

	}

	.ccl-cta-actions {

		min-width: auto;

	}

	.crv-details {

		flex-direction: column;

		gap: 6px;

	}

	.crv-detail-item {

		flex-direction: column;

		gap: 2px;

	}

	.crv-detail-value {

		text-align: left;

	}

	.crv-gate__radios {

		flex-direction: column;

		align-items: center;

	}

}



/* ----------------------------------------

   Max-width 520px

   ---------------------------------------- */

@media (max-width: 520px) {

	.svc-cats {

		grid-template-columns: 1fr;

	}

}



/* ----------------------------------------

   Min-width 560px

   ---------------------------------------- */

@media (min-width: 560px) {

	:root {

		--container-pad: 22px;

	}

	.metrics {

		grid-template-columns: repeat(3, 1fr);

	}

}



/* ----------------------------------------

   Max-width 620px

   ---------------------------------------- */

@media (max-width: 620px) {

	.svalt-item {

		grid-template-columns: 48px 1fr auto;

	}

	.svalt-ico {

		width: 48px;

		height: 48px;

		font-size: 18px;

	}

}



/* ----------------------------------------

   Max-width 640px

   ---------------------------------------- */

@media (max-width: 640px) {

	.metrics {

		grid-template-columns: repeat(2, minmax(0, 1fr));

	}

	.metric {

		border-left: none;

		border-top: 1px dashed var(--line);

	}

	.metric:first-child {

		border-top: none;

	}

	.crv-cases {

		grid-template-columns: 1fr;

	}

}



/* ----------------------------------------

   Max-width 680px

   ---------------------------------------- */

@media (max-width: 680px) {

	.metrics {

		grid-template-columns: repeat(2, minmax(0, 1fr));

	}

	.metric {

		border-left: none;

		border-top: 1px dashed var(--line);

	}

	.metric:first-child {

		border-top: none;

	}

	.metrics--leadwide {

		grid-template-columns: 1fr;

	}

	.metrics--leadwide .metric:first-child {

		border-bottom: 1px dashed var(--line);

	}

	.metrics--leadwide .metric:nth-child(n+2) {

		border-top: 1px dashed var(--line);

		border-right: none;

		border-left: none;

	}

}



/* ----------------------------------------

   Max-width 720px

   ---------------------------------------- */

@media (max-width: 720px) {

	.svc-subgrid {

		grid-template-columns: 1fr;

	}

	.svalt-list {

		grid-template-columns: 1fr;

	}

	.title-accent--underline {

		white-space: inherit !important;

	}

	.about-intro {

		padding: 50px 0;

	}

}



/* ----------------------------------------

   Max-width 767.98px

   ---------------------------------------- */

@media (max-width: 767.98px) {

	.hero-actions {

		justify-content: center;

	}

}



/* ----------------------------------------

   Max-width 768px

   ---------------------------------------- */

@media (max-width: 768px) {

	.hero-cta .btn {

		width: 100%;

		max-width: 280px;

	}

	.ccl-comparison-section {

		padding: 60px 0;

	}

	.ccl-comparison-title {

		font-size: 32px;

	}

	.ccl-card-header {

		flex-direction: column;

		align-items: flex-start;

		gap: 16px;

	}

	.ccl-provider-rating {

		text-align: left;

	}

	.ccl-card-features,

	.ccl-card-header,

	.ccl-card-cta {

		padding-left: 20px;

		padding-right: 20px;

	}

	.ccl-cta-content {

		grid-template-columns: 1fr;

		gap: 30px;

	}

	.ccl-comparison-cta-section {

		padding: 30px 20px;

	}

	.ccl-cta-benefits {

		justify-content: center;

	}

	.crv-section {

		padding: 60px 0;

	}

	.crv-hero__title--prime {

		font-size: 32px;

	}

	.crv-toolbar {

		flex-direction: column;

		gap: 12px;

		align-items: flex-start;

	}

	.crv-actions {

		justify-content: center;

	}

	.crv-gate {

		align-items: flex-start;

	}

	.crv-gate__panel {

		padding: 30px 20px;

	}

	.crv-gate__title {

		font-size: 28px;

	}

	.crv-sidebar {

		position: relative;

	}

	.crv-filter-select {

		display: block;

	}

	.crv-filter-buttons {

		display: none;

	}

}



/* ----------------------------------------

   Min-width 769px

   ---------------------------------------- */

@media (min-width: 769px) {

	:root {

		--container-pad: 26px;

		--ticker-speed: 28s;

		--header-h: 72px;

	}

	.headline {

		font-size: clamp(34px, 5.6vw, 44px);

	}

	.hero-right {

		align-items: flex-end;

		text-align: right;

	}

	.btn-row {

		justify-content: flex-end;

	}

}



/* ----------------------------------------

   Max-width 800px

   ---------------------------------------- */

@media only screen and (max-width: 800px) {

	#process .process-wrap .process-item {

		padding: 50px 15px 38px 85px;

	}

	#process .process-wrap .process-item:nth-child(2n) {

		padding: 50px 85px 38px 15px;

		text-align: left !important;

	}

	#process .process-wrap .process-item:nth-child(2n) .process-info {

		float: left !important;

	}

	#process .process-wrap .process-item-inner .process-info p {

		font-size: 15px;

	}

	#process .process-wrap .process-item-inner .process-info h3 {

		font-size: 22px;

	}

	#process .process-wrap .process-item .image-icon {

		display: none;

	}

	#process .process-wrap .process-item .process-info {

		border-radius: 10px;

		padding: 18px 16px;

	}

	.ccl-comparison-cta-section {

		display: none;

	}

	.ccl-comparison-section {

		padding: 60px 0 0;

	}

	.ccl-comparison-cards-grid {

		margin-bottom: 30px;

	}

}



/* ----------------------------------------

   Max-width 991.98px

   ---------------------------------------- */

@media (max-width: 991.98px) {

	.about-hero--overlay .about-hero__aside {

		position: static;

		width: 100%;

		margin-top: 12px;

	}

	.about__section {

		padding: 50px 0 50px;

	}

}



/* ----------------------------------------

   Min-width 992px

   ---------------------------------------- */

@media (min-width: 992px) {

	.about-hero__grid {

		grid-template-columns: 1.25fr 0.75fr;

		gap: 32px;

	}

	.about-intro__grid {

		grid-template-columns: 1fr 1.5fr;

		gap: 60px;

	}

	.ccl-content-grid {

		grid-template-columns: 1fr 1fr;

		gap: 80px;

		align-items: start;

	}

	.crv-hero__grid {

		grid-template-columns: 1fr;

		gap: 32px;

	}

	.crv-grid {

		grid-template-columns: 280px 1fr;

		gap: 40px;

	}

}



/* ----------------------------------------

   Max-width 994px

   ---------------------------------------- */

@media (max-width: 994px) {

	.metrics .metric .value {

		font-weight: 800;

		font-size: 16px;

		line-height: 1.1;

		letter-spacing: .06em;

	}

	.hero-micro {

		flex-wrap: nowrap;

	}

	.metrics--band {

		background: #fff;

		border: 1px solid var(--soft-bd);

		border-radius: 14px;

		box-shadow: 0 8px 24px rgba(0, 0, 0, .06);

	}

}



/* ----------------------------------------

   Min-width 1024px

   ---------------------------------------- */

@media (min-width: 1024px) {

	.hero-grid {

		grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);

	}

	.headline {

		font-size: clamp(38px, 5vw, 52px);

	}

}



/* ----------------------------------------

   Max-width 1024px

   ---------------------------------------- */

@media (max-width: 1024px) {

	.metrics {

		grid-template-columns: inherit;

	}

	.ccl-comparison-cards-grid {

		grid-template-columns: 1fr;

		gap: 40px;

	}

}



/* ----------------------------------------

   Min-width 768px and Max-width 1040px

   ---------------------------------------- */

@media (min-width: 768px) and (max-width: 1040px) {

	.hero-grid {

		align-items: center;

	}

	.hero-right {

		align-self: center;

	}

	.metrics .metric {

		border: 0 !important;

	}

	.metrics--band::after {

		display: none !important;

	}

}



/* ----------------------------------------

   Min-width 1025px

   ---------------------------------------- */

@media (min-width: 1025px) {

	.metrics {

		display: grid;

		grid-template-columns: repeat(5, minmax(0, 1fr));

		column-gap: 0;

		row-gap: 0;

	}

	.metrics--band {

		grid-template-columns: repeat(5, minmax(0, 1fr));

		position: relative;

		padding: 14px 16px;

	}

	.metrics--leadwide {

		grid-template-columns: repeat(5, minmax(0, 1fr));

	}

	.metrics--leadwide .metric:first-child {

		grid-column: auto;

		border-bottom: none;

	}

	.metrics .metric {

		padding: 14px 16px;

		border: none !important;

		display: grid;

		justify-items: center;

		align-content: center;

		text-align: center;

		gap: 8px;

	}

	.metrics .metric .stat {

		display: flex;

		justify-content: center;

		align-items: flex-end;

		gap: 6px;

	}

	.metrics .metric .sub {

		max-width: 30ch;

	}

	.metrics .metric.review {

		grid-auto-flow: row;

		gap: 6px;

		text-align: center;

	}

	.metrics .metric.review .review-source,

	.metrics .metric.review .review-details {

		display: grid;

		justify-items: center;

		gap: 6px;

	}

	.metrics .metric.review .m-label {

		margin: 0;

	}

	.metrics--band::after {

		content: "";

		position: absolute;

		top: 14px;

		bottom: 14px;

		left: 16px;

		right: 16px;

		pointer-events: none;

		z-index: 0;

		background-image: repeating-linear-gradient(to bottom, rgba(0, 0, 0, .16) 0 6px, transparent 6px 12px), repeating-linear-gradient(to bottom, rgba(0, 0, 0, .16) 0 6px, transparent 6px 12px), repeating-linear-gradient(to bottom, rgba(0, 0, 0, .16) 0 6px, transparent 6px 12px), repeating-linear-gradient(to bottom, rgba(0, 0, 0, .16) 0 6px, transparent 6px 12px);

		background-size: 1px 100%, 1px 100%, 1px 100%, 1px 100%;

		background-position: 20% 0, 40% 0, 60% 0, 80% 0;

		background-repeat: no-repeat;

	}

	.metrics--band .metric {

		position: relative;

		z-index: 1;

	}

}



/* ----------------------------------------

   Max-width 1180px

   ---------------------------------------- */

@media (max-width: 1180px) {

	.svc-wrap {

		grid-template-columns: 1fr;

	}

}



/* ----------------------------------------

   Max-width 1199.98px

   ---------------------------------------- */

@media (max-width: 1199.98px) {

	.cc-nav,

	.cc-call,

	.cc-actions .btn {

		display: none;

	}

	.nav-toggle {

		display: block;

	}

	.cc-logo img {

		height: 40px;

	}

	.cc-navbar {

		height: 70px;

	}

}



/* ----------------------------------------

   Min-width 1200px

   ---------------------------------------- */

@media (min-width: 1200px) {

	:root {

		--container-pad: 40px;

		--header-h: 86px;

		--ticker-speed: 24s;

	}

	.metrics {

		grid-template-columns: repeat(5, 1fr);

	}

	.headline {

		font-size: 56px;

	}

	.nav-toggle {

		display: none;

	}

}



/* ----------------------------------------

   Min-width 1366px

   ---------------------------------------- */

@media (min-width: 1366px) {

	.about__section:before {

		left: 2.5%;

		right: 2.5%;

	}

}



/* 2) Rock-solid on mobile: use fixed to avoid iOS sticky quirks */

@media (max-width: 1199.98px){

  .cc-header{

	position: fixed;        /* force pin on mobile */

	top: 0; left: 0; right: 0;

	z-index: 1600;

  }

  /* prevent content jump under the fixed header (70px = .cc-navbar height on mobile) */

  body{ padding-top: 70px; }

}





/* --- Mobile menu fixes --- */

@media (max-width: 1199.98px){

  /* Put the drawer above the fixed header */

  .mobile-nav{ z-index: 2001; }



  /* While the drawer is open, hide the header's square toggle button */

  body.no-scroll .cc-header .nav-toggle{ visibility: hidden; }



  /* Tidy drawer header + close button */

  .mobile-nav-header{

	position: sticky; top: 0; background:#fff;

	border-bottom: 1px solid var(--line); z-index: 2;

  }

  .mobile-nav .close-btn{

	appearance: none; background:#fff; border:1px solid var(--line);

	width:40px; height:40px; border-radius:12px;

	display:grid; place-items:center; font-size:20px; color:var(--ink);

  }

.topbar--compact.tb-follow{

  position: static !important;

  top: auto !important;

}

}