/**
 * Scoped presentation for migrated long-form article modules.
 * This replaces old CSS pasted directly into post content.
 */

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]){
	--ccm-bg:#07111f;
	--ccm-card:#0d1b31;
	--ccm-card-2:#12233d;
	--ccm-text:#eef4ff;
	--ccm-muted:#a9b8d3;
	--ccm-line:rgba(255,255,255,.11);
	--ccm-accent:#8dc8ff;
	--ccm-accent-2:#74e4c9;
	--ccm-warn:#ffbe78;
	--ccm-danger:#ff9f9f;
	position:relative;
	margin:24px 0;
	padding:clamp(18px,4vw,40px) 0;
	color:var(--ccm-text);
	background:linear-gradient(180deg,#07111f 0%,#081321 100%);
	border:1px solid var(--ccm-line);
	border-radius:28px;
	overflow:hidden;
	font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;
	line-height:1.72;
}

.cc-content{
	max-width:1080px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) *,
.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) *::before,
.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) *::after{
	box-sizing:border-box;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) img{
	display:block;
	max-width:100%;
	height:auto;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) a{
	color:inherit;
	text-decoration:none;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-shell"], [class*="-shell "]){
	width:min(1180px,calc(100% - 28px));
	margin:0 auto;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-hero"], [class*="-hero "]){
	display:grid;
	grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
	gap:18px;
	align-items:stretch;
	padding:clamp(22px,4vw,40px);
	border:1px solid var(--ccm-line);
	border-radius:26px;
	background:linear-gradient(180deg,rgba(13,27,49,.96),rgba(8,16,29,.96));
	box-shadow:0 22px 54px rgba(2,8,20,.24);
	overflow:hidden;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-section"], [class*="-section "]){
	margin-top:18px;
	padding:22px;
	border:1px solid var(--ccm-line);
	border-radius:24px;
	background:linear-gradient(180deg,rgba(13,27,49,.94),rgba(8,16,29,.94));
	box-shadow:0 18px 44px rgba(2,8,20,.18);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-copy"], [class*="-copy "]){
	display:grid;
	align-content:center;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-kicker"], [class*="-kicker "]){
	display:inline-flex;
	align-items:center;
	gap:10px;
	width:fit-content;
	margin:0 0 16px;
	color:#dcecff;
	font-size:12px;
	font-weight:800;
	letter-spacing:0;
	text-transform:uppercase;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-kicker"], [class*="-kicker "])::before{
	content:"";
	width:10px;
	height:10px;
	border-radius:999px;
	background:linear-gradient(135deg,var(--ccm-accent),var(--ccm-accent-2));
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is(h1,h2,h3){
	margin:0;
	color:#fff;
	line-height:1.08;
	letter-spacing:0;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) h1{
	max-width:12ch;
	font-size:clamp(2.15rem,4.8vw,4.6rem);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) h2{
	font-size:clamp(1.5rem,2.8vw,2.5rem);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) h3{
	font-size:1.08rem;
	line-height:1.28;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is(p,li){
	color:var(--ccm-muted);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) p{
	margin:12px 0 0;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) strong{
	color:#fff;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-lead"], [class*="-lead "]){
	max-width:74ch;
	margin-top:18px;
	color:#c8d7ef;
	font-size:1.04rem;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-actions"], [class*="-actions "]){
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-top:24px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-btn"], [class*="-btn "]){
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:48px;
	padding:0 18px;
	border:1px solid rgba(255,255,255,.16);
	border-radius:14px;
	background:rgba(255,255,255,.06);
	color:#f7fbff;
	font-weight:800;
	box-shadow:0 12px 26px rgba(0,0,0,.14);
	transition:transform .18s ease,background .18s ease;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-btn"], [class*="-btn "]):hover{
	transform:translateY(-2px);
	background:rgba(255,255,255,.1);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) [class*="-btn--primary"]{
	border-color:transparent;
	background:linear-gradient(135deg,var(--ccm-accent),var(--ccm-accent-2));
	color:#05111f;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-chip-row"], [class*="-chip-row "], [class$="-tag-row"], [class*="-tag-row "]){
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:18px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-chip"], [class*="-chip "], [class$="-tag"], [class*="-tag "], [class$="-badge"], [class*="-badge "]){
	display:inline-flex;
	align-items:center;
	width:fit-content;
	min-height:30px;
	padding:0 10px;
	border:1px solid var(--ccm-line);
	border-radius:999px;
	background:rgba(255,255,255,.05);
	color:#e8f1ff;
	font-size:.82rem;
	font-weight:800;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-metrics"], [class*="-metrics "]){
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:14px;
	margin-top:24px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class*="-grid-2"], [class*="-grid-3"], [class*="-grid-4"]){
	display:grid;
	gap:16px;
	margin-top:18px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) [class*="-grid-2"]{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) [class*="-grid-3"]{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) [class*="-grid-4"]{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-metric"], [class*="-metric "], [class$="-card"], [class*="-card "], [class$="-step"], [class*="-step "], [class$="-service"], [class*="-service "], [class$="-path"], [class*="-path "], [class$="-warning"], [class*="-warning "], [class$="-check"], [class*="-check "], [class$="-linkcard"], [class*="-linkcard "]){
	display:grid;
	gap:12px;
	min-height:100%;
	padding:18px;
	border:1px solid var(--ccm-line);
	border-radius:18px;
	background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));
	box-shadow:0 14px 32px rgba(2,8,20,.14);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-warning"], [class*="-warning "]){
	border-color:rgba(255,159,159,.24);
	background:linear-gradient(180deg,rgba(255,159,159,.08),rgba(255,255,255,.03));
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-media"], [class*="-media "]){
	position:relative;
	overflow:hidden;
	min-height:360px;
	border:1px solid var(--ccm-line);
	border-radius:22px;
	background:#0b1728;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-media"], [class*="-media "]) img{
	width:100%;
	height:100%;
	min-height:360px;
	object-fit:cover;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class*="-overlay"], [class*="-mini-stack"]){
	display:grid;
	gap:12px;
	margin-top:14px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class*="-mini-card"], [class*="-note"]){
	padding:14px;
	border:1px solid var(--ccm-line);
	border-radius:16px;
	background:rgba(255,255,255,.05);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-list"], [class*="-list "]){
	display:grid;
	gap:8px;
	margin:10px 0 0;
	padding:0;
	list-style:none;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-list"], [class*="-list "]) li{
	position:relative;
	padding-left:20px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-list"], [class*="-list "]) li::before{
	content:"";
	position:absolute;
	left:0;
	top:.68em;
	width:8px;
	height:8px;
	border-radius:999px;
	background:var(--ccm-accent-2);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-link-row"], [class*="-link-row "]){
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:auto;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-link"], [class*="-link "]){
	color:var(--ccm-accent);
	font-weight:800;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-faq"], [class*="-faq "]){
	display:grid;
	gap:12px;
	margin-top:18px;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) details{
	padding:16px;
	border:1px solid var(--ccm-line);
	border-radius:16px;
	background:rgba(255,255,255,.04);
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) summary{
	cursor:pointer;
	color:#fff;
	font-weight:800;
}

.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-final"], [class*="-final "]){
	position:relative;
	margin-top:18px;
	padding:clamp(22px,4vw,38px);
	border:1px solid var(--ccm-line);
	border-radius:26px;
	background:linear-gradient(135deg,rgba(141,200,255,.12),rgba(116,228,201,.08)),#0b1728;
	overflow:hidden;
}

.cc-content :is(.wrap,.container),
.cc-content > article:not([class]){
	max-width:100%;
	margin:24px 0;
	padding:clamp(18px,3vw,30px);
	border:1px solid rgba(8,20,36,.1);
	border-radius:18px;
	background:#fff;
	color:#1d2939;
	box-shadow:0 18px 40px rgba(8,20,36,.08);
}

.cc-content :is(.wrap,.container, article:not([class])) :is(h1,h2,h3){
	color:#111827;
	line-height:1.16;
	letter-spacing:0;
}

.cc-content :is(.wrap,.container, article:not([class])) h1{
	font-size:clamp(2rem,4vw,3.6rem);
}

.cc-content :is(.wrap,.container, article:not([class])) :is(.lead, blockquote){
	color:#41516b;
	font-size:1.05rem;
}

.cc-content :is(.wrap,.container, article:not([class])) :is(.cta,.toc,.faq,.note){
	padding:16px;
	border:1px solid #dbe5f3;
	border-radius:14px;
	background:#f7fbff;
}

.cc-content :is(.wrap,.container, article:not([class])) .cta{
	border-left:4px solid #2563eb;
}

.cc-content :is(.wrap,.container, article:not([class])) table{
	width:100%;
	border-collapse:collapse;
}

.cc-content :is(.wrap,.container, article:not([class])) :is(th,td){
	padding:10px;
	border:1px solid #dbe5f3;
	text-align:left;
}

.cc-content :is(.wrap,.container, article:not([class])) th{
	background:#f5f8fc;
}

.cc-content :is(.wrap,.container, article:not([class])) .table-wrap{
	overflow-x:auto;
}

@media (max-width:1100px){
	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) [class*="-grid-4"]{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
}

@media (max-width:860px){
	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-hero"], [class*="-hero "]),
	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class*="-grid-2"], [class*="-grid-3"], [class*="-grid-4"], [class$="-metrics"], [class*="-metrics "]){
		grid-template-columns:1fr;
	}

	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) h1{
		max-width:none;
		font-size:clamp(2rem,10vw,3rem);
	}
}

@media (max-width:620px){
	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]){
		margin:18px -6px;
		border-radius:20px;
	}

	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-shell"], [class*="-shell "]){
		width:calc(100% - 16px);
	}

	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-hero"], [class*="-hero "], [class$="-section"], [class*="-section "]){
		padding:18px;
		border-radius:18px;
	}

	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-actions"], [class*="-actions "]){
		flex-direction:column;
	}

	.cc-content :is([class^="cc"][class$="-page"], [class^="cc"][class*="-page "]) :is([class$="-btn"], [class*="-btn "]){
		width:100%;
	}

	.cc-content :is(.wrap,.container),
	.cc-content > article:not([class]){
		margin:18px 0;
		padding:16px;
		border-radius:14px;
	}
}