/* =============================================================================
   Country detail page (/services/{slug}) - warm editorial, sibling of the
   directory. Reuses the directory's token system (same values), scoped to
   .cdx-page. System fonts only. Self-contained reveal via [data-reveal].
   ============================================================================= */

.cdx-page{
	/* ---- Color (matches the directory) ---- */
	--cd-ink:#141210; --cd-ink-2:#29231c; --cd-canvas:#f4f0e8; --cd-surface:#ffffff;
	--cd-text:#1c1a17; --cd-muted:#6f6960; --cd-border:#e7e0d1;
	--cd-accent:#b1532e; --cd-accent-2:#c8643b;
	--cd-accent-08:rgba(177,83,46,.08); --cd-accent-14:rgba(177,83,46,.14); --cd-accent-18:rgba(177,83,46,.18);
	--cd-on-dark:#f3ece1; --cd-on-dark-mut:rgba(243,236,225,.72); --cd-white-30:rgba(255,255,255,.30); --cd-white-55:rgba(255,255,255,.55);
	/* ---- Type ---- */
	--cd-fs-h1:clamp(30px,4.2vw,50px); --cd-fs-h2:clamp(26px,3.2vw,38px);
	--cd-fs-body-lg:17px; --cd-fs-body:15.5px; --cd-fs-label:12px; --cd-ls-label:.14em;
	/* ---- Space / radius / shadow / motion ---- */
	--cd-s2:8px; --cd-s3:12px; --cd-s4:16px; --cd-s5:24px; --cd-s6:32px; --cd-s7:48px; --cd-s8:64px; --cd-s9:96px;
	--cd-r-pill:999px; --cd-r-card:18px; --cd-r-chip:10px; --cd-r-flag:6px;
	--cd-shadow-rest:0 1px 2px rgba(28,26,23,.04), 0 6px 18px rgba(28,26,23,.06);
	--cd-shadow-hover:0 10px 22px rgba(120,60,30,.10), 0 26px 52px rgba(80,40,20,.16);
	--cd-ring:0 0 0 3px rgba(177,83,46,.30);
	--cd-ease:cubic-bezier(.2,.7,.2,1); --cd-dur:220ms; --cd-dur-fast:140ms;

	background:var(--cd-canvas); color:var(--cd-text); overflow:hidden;
}

.cdx-wrap{ max-width:1180px; margin:0 auto; padding:0 var(--cd-s5); }
.cdx-narrow{ max-width:820px; }
.cdx-sec{ padding:56px 0; background:var(--cd-canvas); }
.cdx-sec--alt{ background:var(--cd-surface); }
/* Trim the .site-content wrapper gap on country pages, but keep enough top
   clearance that the breadcrumb clears the fixed header (~72px+ tall). */
/* Clear the ~81px fixed header from the body itself (deterministic - does not
   rely on the global body padding, which isn't applying on these virtual pages). */
body.country-detail{ padding-top:92px !important; }
body.country-detail .site-content{ padding-top:0; padding-bottom:0; }

/* shared bits */
.cdx-accent{ color:var(--cd-accent); }
.cdx-eyebrow{
	display:inline-block; font-size:var(--cd-fs-label); font-weight:700; letter-spacing:var(--cd-ls-label);
	text-transform:uppercase; color:var(--cd-accent); background:var(--cd-accent-08);
	border:1px solid var(--cd-accent-18); padding:7px 14px; border-radius:var(--cd-r-pill); margin-bottom:var(--cd-s4);
}
.cdx-h1{ font-size:var(--cd-fs-h1); line-height:1.06; letter-spacing:-.015em; font-weight:800; color:var(--cd-text); margin:0 0 var(--cd-s4); }
.cdx-h2{ font-size:var(--cd-fs-h2); line-height:1.12; letter-spacing:-.01em; font-weight:800; color:var(--cd-text); margin:0 0 var(--cd-s3); }
.cdx-sub{ color:var(--cd-muted); font-size:var(--cd-fs-body-lg); line-height:1.55; margin:0; max-width:60ch; }
.cdx-body{ color:var(--cd-muted); font-size:var(--cd-fs-body-lg); line-height:1.62; margin:0 0 var(--cd-s4); max-width:68ch; }
.cdx-head{ text-align:center; max-width:720px; margin:0 auto var(--cd-s6); }
.cdx-head .cdx-sub{ margin:0 auto; }
.cdx-ic{ width:22px; height:22px; }

/* buttons (match the site: 999px pill, translateY lift) */
.cdx-btn{
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	font:inherit; font-size:15px; font-weight:600; text-decoration:none; white-space:nowrap;
	padding:13px 26px; border-radius:var(--cd-r-pill); cursor:pointer; border:1px solid transparent;
	transition:transform var(--cd-dur) var(--cd-ease), background var(--cd-dur) var(--cd-ease), color var(--cd-dur) var(--cd-ease), box-shadow var(--cd-dur) var(--cd-ease), border-color var(--cd-dur) var(--cd-ease);
}
.cdx-btn--solid{ background:var(--cd-ink); color:#fff; }
.cdx-btn--solid:hover{ background:linear-gradient(135deg,var(--cd-accent),var(--cd-accent-2)); color:#fff; transform:translateY(-2px); box-shadow:0 12px 28px rgba(177,83,46,.34); }
.cdx-btn--ghost-ink{ background:transparent; color:var(--cd-text); border-color:var(--cd-border); }
.cdx-btn--ghost-ink:hover{ border-color:var(--cd-accent); color:var(--cd-accent); transform:translateY(-2px); }
.cdx-btn--ghost{ background:transparent; color:#fff; border-color:var(--cd-white-30); }
.cdx-btn--ghost:hover{ background:rgba(255,255,255,.08); border-color:var(--cd-white-55); transform:translateY(-2px); }
.cdx-btn:focus-visible{ outline:none; box-shadow:var(--cd-ring); }

/* 1. breadcrumb */
.cdx-crumb{ background:var(--cd-canvas); padding:16px 0 4px; }
.cdx-crumb .cdx-wrap{ display:flex; align-items:center; gap:8px; font-size:14px; color:var(--cd-text); flex-wrap:wrap; }
.cdx-crumb a{ color:var(--cd-muted); text-decoration:none; }
.cdx-crumb a:hover{ color:var(--cd-accent); }
.cdx-crumb b{ color:var(--cd-text); }

/* 2. hero */
.cdx-hero{ padding-top:28px; }
.cdx-hero__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:var(--cd-s8); align-items:center; }
.cdx-hero__intro{ color:var(--cd-muted); font-size:var(--cd-fs-body-lg); line-height:1.6; margin:0 0 var(--cd-s5); max-width:54ch; }
.cdx-hero__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:var(--cd-s5); }
.cdx-chip{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--cd-text);
	background:var(--cd-accent-08); border:1px solid var(--cd-border); padding:7px 12px; border-radius:var(--cd-r-chip); }
.cdx-chip__ic{ width:15px; height:15px; color:var(--cd-accent); flex:0 0 auto; }
.cdx-hero__cta{ display:flex; gap:12px; flex-wrap:wrap; }

/* market snapshot card (dark) */
.cdx-snap{ background:linear-gradient(165deg,var(--cd-ink-2),var(--cd-ink)); color:var(--cd-on-dark);
	border-radius:var(--cd-r-card); padding:var(--cd-s6); box-shadow:var(--cd-shadow-hover); }
.cdx-snap__head{ display:flex; align-items:center; gap:14px; margin-bottom:var(--cd-s5); padding-bottom:var(--cd-s5); border-bottom:1px solid rgba(243,236,225,.14); }
.cdx-flag{ display:inline-block; width:44px; height:32px; border-radius:var(--cd-r-flag); overflow:hidden; object-fit:cover; background-size:cover; box-shadow:0 0 0 1px rgba(255,255,255,.2), 0 2px 8px rgba(0,0,0,.35); flex:0 0 auto; }
.cdx-snap__eyebrow{ display:block; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#f0c9b6; }
.cdx-snap__country{ display:block; font-size:20px; font-weight:700; color:#fff; }
.cdx-snap__grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--cd-s5) var(--cd-s4); }
.cdx-snap__label{ display:block; font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--cd-on-dark-mut); margin-bottom:4px; }
.cdx-snap__value{ display:block; font-size:14.5px; font-weight:600; color:#fff; line-height:1.4; }

/* 4. process flow */
.cdx-process{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,1fr); gap:var(--cd-s4); }
.cdx-step{ position:relative; text-align:center; padding:0 6px; }
.cdx-step:not(:last-child)::before{ content:""; position:absolute; top:27px; left:50%; width:100%; height:2px; background:var(--cd-border); z-index:0; }
.cdx-step__ic{ position:relative; z-index:1; width:56px; height:56px; margin:0 auto var(--cd-s3); border-radius:50%;
	display:grid; place-items:center; background:var(--cd-surface); border:1px solid var(--cd-border); color:var(--cd-accent); box-shadow:var(--cd-shadow-rest); }
.cdx-sec--alt .cdx-step__ic{ background:var(--cd-canvas); }
.cdx-step__num{ display:block; font-size:12px; font-weight:800; letter-spacing:.1em; color:var(--cd-accent); margin-bottom:4px; }
.cdx-step__title{ margin:0 0 6px; font-size:16px; font-weight:700; color:var(--cd-text); }
.cdx-step__desc{ margin:0; font-size:13.5px; line-height:1.5; color:var(--cd-muted); }

/* card grids */
.cdx-grid{ display:grid; gap:var(--cd-s5); align-items:stretch; }
.cdx-grid--4{ grid-template-columns:repeat(4,1fr); }
.cdx-grid--3{ grid-template-columns:repeat(3,1fr); }
.cdx-card{ display:flex; flex-direction:column; background:var(--cd-surface); border:1px solid var(--cd-border);
	border-radius:var(--cd-r-card); padding:var(--cd-s5); box-shadow:var(--cd-shadow-rest);
	transition:transform var(--cd-dur) var(--cd-ease), box-shadow var(--cd-dur) var(--cd-ease), border-color var(--cd-dur) var(--cd-ease); }
.cdx-sec--alt .cdx-card{ background:var(--cd-canvas); }
.cdx-card:hover{ transform:translateY(-5px); box-shadow:var(--cd-shadow-hover); }
.cdx-card__ic{ width:46px; height:46px; border-radius:13px; display:grid; place-items:center; margin-bottom:var(--cd-s4);
	background:var(--cd-accent-08); color:var(--cd-accent); }
.cdx-card__ic .cdx-ic{ width:22px; height:22px; }
.cdx-card__title{ margin:0 0 8px; font-size:16.5px; font-weight:700; color:var(--cd-text); }
.cdx-card__desc{ margin:0; font-size:14px; line-height:1.55; color:var(--cd-muted); }
/* dark solution cards */
.cdx-card--dark{ background:linear-gradient(165deg,var(--cd-ink-2),var(--cd-ink)) !important; border-color:transparent; color:var(--cd-on-dark); }
.cdx-card--dark .cdx-card__ic{ background:var(--cd-accent-14); color:#f6d8c8; }
.cdx-card--dark .cdx-card__title{ color:#fff; }
.cdx-card--dark .cdx-card__desc{ color:var(--cd-on-dark-mut); }

/* 8. quick facts */
.cdx-facts{ display:grid; grid-template-columns:1fr 1.05fr; gap:var(--cd-s8); align-items:start; }
.cdx-facts__intro .cdx-btn{ margin-top:var(--cd-s4); }
.cdx-facts__table{ background:var(--cd-surface); border:1px solid var(--cd-border); border-radius:var(--cd-r-card); padding:6px var(--cd-s5); box-shadow:var(--cd-shadow-rest); }
.cdx-sec--alt .cdx-facts__table{ background:var(--cd-canvas); }
.cdx-frow{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:var(--cd-s4); padding:15px 0; border-bottom:1px solid var(--cd-border); }
.cdx-frow:last-child{ border-bottom:0; }
.cdx-frow__ic{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:var(--cd-accent-08); color:var(--cd-accent); }
.cdx-frow__ic .cdx-ic{ width:17px; height:17px; }
.cdx-frow__label{ font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--cd-muted); }
.cdx-frow__value{ font-size:14.5px; font-weight:600; color:var(--cd-text); text-align:right; }

/* 10. faq */
.cdx-faq{ border:1px solid var(--cd-border); border-radius:var(--cd-r-card); overflow:hidden; background:var(--cd-surface); }
.cdx-sec .cdx-faq{ background:var(--cd-surface); }
.cdx-faq__item{ border-bottom:1px solid var(--cd-border); }
.cdx-faq__item:last-child{ border-bottom:0; }
.cdx-faq__q{ margin:0; }
.cdx-faq__btn{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; text-align:left;
	font:inherit; font-size:16px; font-weight:600; color:var(--cd-text); background:transparent; border:0; cursor:pointer; padding:20px var(--cd-s5); }
.cdx-faq__btn:hover{ color:var(--cd-accent); }
.cdx-faq__btn:focus-visible{ outline:none; box-shadow:var(--cd-ring); border-radius:8px; }
.cdx-faq__chev{ flex:0 0 auto; width:26px; height:26px; display:grid; place-items:center; font-size:22px; line-height:0; color:var(--cd-accent);
	background:var(--cd-accent-08); border-radius:50%; transition:transform var(--cd-dur) var(--cd-ease); }
.cdx-faq__btn[aria-expanded="true"] .cdx-faq__chev{ transform:rotate(45deg); }
.cdx-faq__panel{ padding:0 var(--cd-s5) 20px; }
.cdx-faq__panel p{ margin:0; color:var(--cd-muted); font-size:15px; line-height:1.6; max-width:70ch; }
.cdx-faq__panel[hidden]{ display:none; }
.cdx-faq__foot{ text-align:center; margin:var(--cd-s5) 0 0; color:var(--cd-muted); font-size:15px; }
.cdx-faq__foot a{ color:var(--cd-accent); font-weight:600; text-decoration:none; }
.cdx-faq__foot a:hover{ text-decoration:underline; }

/* 11. cta band */
.cdx-cta{ position:relative; isolation:isolate; overflow:hidden; background:linear-gradient(165deg,var(--cd-ink-2),var(--cd-ink)); color:var(--cd-on-dark); padding:var(--cd-s8) 0; }
.cdx-cta::before{ content:""; position:absolute; z-index:0; top:-40%; right:-8%; width:55vw; height:120%; pointer-events:none;
	background:radial-gradient(closest-side, rgba(200,100,59,.30), rgba(177,83,46,0) 70%); }
.cdx-cta__inner{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:var(--cd-s6); flex-wrap:wrap; }
.cdx-cta__title{ margin:0 0 10px; font-size:clamp(24px,3vw,34px); font-weight:800; line-height:1.16; color:#fff; }
.cdx-cta__sub{ margin:0; color:var(--cd-on-dark-mut); font-size:16px; line-height:1.55; max-width:54ch; }
.cdx-cta__btns{ display:flex; gap:12px; flex-wrap:wrap; }

/* 12. explore */
.cdx-explore__label{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--cd-accent); margin:var(--cd-s6) 0 var(--cd-s4); }
.cdx-mini-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.cdx-mini{ display:flex; align-items:center; gap:12px; padding:12px 14px; background:var(--cd-surface); border:1px solid var(--cd-border);
	border-radius:13px; text-decoration:none; transition:transform var(--cd-dur-fast) var(--cd-ease), border-color var(--cd-dur) var(--cd-ease), box-shadow var(--cd-dur) var(--cd-ease); }
.cdx-sec--alt .cdx-mini{ background:var(--cd-canvas); }
.cdx-mini:hover{ transform:translateY(-2px); border-color:var(--cd-accent); box-shadow:var(--cd-shadow-rest); }
.cdx-mini__flag{ width:28px; height:20px; border-radius:4px; overflow:hidden; object-fit:cover; background-size:cover; flex:0 0 auto; box-shadow:0 0 0 1px rgba(28,26,23,.08); }
.cdx-mini__txt{ display:flex; flex-direction:column; min-width:0; flex:1 1 auto; }
.cdx-mini__name{ font-size:14px; font-weight:700; color:var(--cd-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cdx-mini__region{ font-size:11px; color:var(--cd-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cdx-mini__arrow{ color:var(--cd-accent); flex:0 0 auto; transition:transform var(--cd-dur) var(--cd-ease); }
.cdx-mini:hover .cdx-mini__arrow{ transform:translateX(3px); }
.cdx-explore__back{ margin:var(--cd-s7) 0 0; }
.cdx-explore__back a{ color:var(--cd-accent); font-weight:700; text-decoration:none; }
.cdx-explore__back a:hover{ text-decoration:underline; }

/* reveal */
[data-reveal]{ opacity:0; transform:translateY(18px); }
[data-reveal].is-visible{ opacity:1; transform:translateY(0); transition:opacity .55s var(--cd-ease), transform .55s var(--cd-ease); }

/* ---- Responsive ---- */
@media (max-width:1023px){
	.cdx-sec{ padding:44px 0; }
	.cdx-hero__grid{ grid-template-columns:1fr; gap:var(--cd-s6); }
	.cdx-process{ grid-template-columns:repeat(2,1fr); gap:var(--cd-s5); }
	.cdx-step:not(:last-child)::before{ display:none; }
	.cdx-grid--4{ grid-template-columns:repeat(2,1fr); }
	.cdx-grid--3{ grid-template-columns:repeat(2,1fr); }
	.cdx-facts{ grid-template-columns:1fr; gap:var(--cd-s6); }
	.cdx-mini-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:639px){
	.cdx-process{ grid-template-columns:1fr; }
	.cdx-grid--4, .cdx-grid--3{ grid-template-columns:1fr; }
	.cdx-snap__grid{ grid-template-columns:1fr 1fr; }
	.cdx-mini-grid{ grid-template-columns:1fr; }
	.cdx-cta__inner{ flex-direction:column; align-items:flex-start; }
	.cdx-cta__btns{ width:100%; }
	.cdx-cta__btns .cdx-btn{ flex:1 1 auto; }
	.cdx-frow__value{ text-align:left; }
}

@media (prefers-reduced-motion: reduce){
	.cdx-page *, .cdx-page *::before, .cdx-page *::after{ transition:none !important; animation:none !important; }
	[data-reveal]{ opacity:1 !important; transform:none !important; }
}
