/* =============================================================================
   Countries by Region — visual-polish pass. Warm editorial / premium consultancy.
   Everything theme-able lives in the .cd-section token block below (the section's
   single :root). Palette = site's ink + cream + rust (#b1532e). System fonts only.
   Reuses the site's [data-reveal] / .is-visible IntersectionObserver (animations.js).

   Token philosophy: colors, the type scale, radii, shadows, motion, section rhythm
   (margins/gaps/padding) are tokens. A few component-intrinsic micro-values
   (e.g. a 7px pill inset, 1px hairlines, 50% circles, gradient/mask internals)
   stay literal by design — they are not part of the shared scale.
   ============================================================================= */

.cd-section{
	/* ---- Color ---- */
	--cd-ink:        #141210;          /* warm near-black: card-top base, CTA base */
	--cd-ink-2:      #29231c;          /* lifted warm black for the card-top gradient */
	--cd-canvas:     #f4f0e8;          /* cream section background */
	--cd-surface:    #ffffff;          /* card body — crisp white on cream */
	--cd-text:       #1c1a17;          /* body copy / heading ink */
	--cd-muted:      #6f6960;          /* descriptions, captions, inactive pill text (site --color-muted) */
	--cd-border:     #e7e0d1;          /* warm low-contrast border */
	--cd-accent:     #b1532e;          /* brand rust */
	--cd-accent-2:   #c8643b;          /* brand rust (lifted) — gradient partner */
	--cd-accent-08:  rgba(177,83,46,.08); /* chip / eyebrow / pill-count fill on light */
	--cd-accent-14:  rgba(177,83,46,.14); /* badge fill on dark */
	--cd-accent-18:  rgba(177,83,46,.18); /* eyebrow hairline */
	--cd-accent-42:  rgba(177,83,46,.42); /* badge outline */
	--cd-on-dark:    #f3ece1;          /* warm off-white text on ink */
	--cd-on-dark-mut:rgba(243,236,225,.72);
	--cd-white-16:   rgba(255,255,255,.16); /* active-pill count chip */
	--cd-white-30:   rgba(255,255,255,.30); /* ghost button border */
	--cd-white-55:   rgba(255,255,255,.55); /* ghost button border (hover) */

	/* ---- Type scale ---- */
	--cd-fs-display: clamp(30px, 3.6vw, 44px);
	--cd-lh-display: 1.08;
	--cd-ls-display: -0.015em;
	--cd-fs-h3:      18px;   /* card name */
	--cd-fs-body-lg: 17px;   /* lead, CTA lead */
	--cd-fs-input:   16px;   /* search field (16px avoids iOS zoom) */
	--cd-fs-body:    15px;   /* buttons, view-details base */
	--cd-fs-sm:      14px;   /* description, link, pill */
	--cd-fs-caption: 13px;   /* show-more caption */
	--cd-fs-xs:      12.5px; /* stat chips */
	--cd-fs-label:   12px;   /* eyebrow */
	--cd-fs-2xs:     11px;   /* count badges, region-header count */
	--cd-ls-label:   .14em;

	/* ---- Space scale ---- */
	--cd-s1:4px; --cd-s2:8px; --cd-s3:12px; --cd-s4:16px; --cd-s5:24px;
	--cd-s6:32px; --cd-s7:48px; --cd-s8:64px; --cd-s9:96px;

	/* ---- Radius ---- */
	--cd-r-pill:999px; --cd-r-card:20px; --cd-r-chip:10px; --cd-r-flag:6px;

	/* ---- Shadow ---- */
	--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);

	/* ---- Motion ---- */
	--cd-ease: cubic-bezier(.2,.7,.2,1);
	--cd-dur-fast: 140ms;
	--cd-dur: 220ms;

	background:var(--cd-canvas);
	color:var(--cd-text);
	padding:var(--cd-s9) 0 var(--cd-s8); /* bottom space before the footer (CTA removed) */
	overflow:hidden; /* contain motifs + decorative glows → no x-scroll */
}

.cd-wrap{ max-width:1200px; margin:0 auto; padding:0 var(--cd-s5); }

/* visually-hidden (a11y) */
.cd-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* =========================== Intro ======================================= */
.cd-intro{ text-align:center; max-width:760px; margin:0 auto var(--cd-s7); }
.cd-eyebrow{
	display:inline-flex; align-items:center;
	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);
}
.cd-title{
	font-size:var(--cd-fs-display); line-height:var(--cd-lh-display);
	letter-spacing:var(--cd-ls-display); font-weight:800;
	color:var(--cd-text); margin:0 0 var(--cd-s4);
}
.cd-title .cd-accent{ color:var(--cd-accent); }
.cd-lead{ color:var(--cd-muted); font-size:var(--cd-fs-body-lg); line-height:1.55; margin:0 auto; max-width:58ch; }

/* =========================== Search ===================================== */
.cd-search{ position:relative; max-width:580px; margin:0 auto var(--cd-s6); }
.cd-search__ic{
	position:absolute; left:18px; top:50%; transform:translateY(-50%);
	width:20px; height:20px; color:var(--cd-muted); pointer-events:none;
}
.cd-search__input{
	width:100%; box-sizing:border-box; height:54px;
	padding:0 52px 0 48px; font:inherit; font-size:var(--cd-fs-input); color:var(--cd-text);
	background:var(--cd-surface); border:1px solid var(--cd-border);
	border-radius:var(--cd-r-pill); box-shadow:var(--cd-shadow-rest);
	transition:border-color var(--cd-dur) var(--cd-ease), box-shadow var(--cd-dur) var(--cd-ease);
}
.cd-search__input::placeholder{ color:var(--cd-muted); }
.cd-search__input::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }
.cd-search__input:focus{ outline:none; border-color:var(--cd-accent); box-shadow:var(--cd-ring); }
.cd-search__clear{
	position:absolute; right:8px; top:50%; transform:translateY(-50%);
	width:40px; height:40px; display:grid; place-items:center; /* ≥40px hit area */
	border:0; border-radius:50%; cursor:pointer; line-height:0;
	background:var(--cd-accent-08); color:var(--cd-accent);
	transition:background var(--cd-dur-fast) var(--cd-ease);
}
.cd-search__clear svg{ width:16px; height:16px; }
.cd-search__clear:hover{ background:var(--cd-accent-14); }
.cd-search__clear:focus-visible{ outline:none; box-shadow:var(--cd-ring); }
.cd-search__clear[hidden]{ display:none; }

/* =========================== Filter pills =============================== */
.cd-pills{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 auto var(--cd-s7); max-width:1000px; }
.cd-pill{
	display:inline-flex; align-items:center; gap:var(--cd-s2); min-height:40px;
	font:inherit; font-size:var(--cd-fs-sm); font-weight:600; line-height:1; color:var(--cd-text);
	background:var(--cd-surface); border:1px solid var(--cd-border);
	border-radius:var(--cd-r-pill); padding:9px 15px; cursor:pointer;
	transition:background var(--cd-dur) var(--cd-ease), color var(--cd-dur) var(--cd-ease),
		border-color var(--cd-dur) var(--cd-ease), transform var(--cd-dur-fast) var(--cd-ease),
		box-shadow var(--cd-dur) var(--cd-ease);
}
.cd-pill:hover{ border-color:var(--cd-accent); transform:translateY(-1px); box-shadow:var(--cd-shadow-rest); }
.cd-pill__n{
	display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px;
	font-size:var(--cd-fs-2xs); font-weight:700; border-radius:var(--cd-r-pill);
	background:var(--cd-accent-08); color:var(--cd-accent);
}
.cd-pill.is-active{ background:var(--cd-ink); color:var(--cd-on-dark); border-color:var(--cd-ink); }
.cd-pill.is-active .cd-pill__n{ background:var(--cd-white-16); color:#fff; }
.cd-pill:focus-visible{ outline:none; box-shadow:var(--cd-ring); }

/* =========================== Region groups ============================== */
.cd-group{ margin-bottom:var(--cd-s7); }
.cd-group[hidden]{ display:none; }
.cd-group__head{
	display:flex; align-items:center; justify-content:space-between; gap:var(--cd-s4);
	margin-bottom:var(--cd-s5); padding-bottom:var(--cd-s3);
	border-bottom:1px solid var(--cd-border);
}
.cd-group__title{ display:flex; align-items:center; gap:var(--cd-s3); margin:0; font-size:clamp(18px,2vw,22px); font-weight:700; color:var(--cd-text); }
.cd-group__bar{ width:4px; height:1.05em; border-radius:3px; background:linear-gradient(var(--cd-accent),var(--cd-accent-2)); flex:0 0 auto; }
.cd-group__n{
	font-size:var(--cd-fs-2xs); font-weight:700; letter-spacing:.1em; text-transform:uppercase;
	color:var(--cd-accent); background:var(--cd-accent-08);
	padding:5px 11px; border-radius:var(--cd-r-pill); white-space:nowrap;
}

/* =========================== Card grid (4→3→2→1) ======================== */
.cd-grid{ display:grid; gap:var(--cd-s5); grid-template-columns:repeat(4,1fr); align-items:stretch; justify-content:start; }
@media (max-width:1279px){ .cd-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:1023px){ .cd-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:639px){  .cd-grid{ grid-template-columns:1fr; } }

/* =========================== Card ======================================= */
.cd-card{
	position:relative; display:flex; flex-direction:column;
	background:var(--cd-surface); border:1px solid var(--cd-border);
	border-radius:var(--cd-r-card); overflow:hidden; box-shadow:var(--cd-shadow-rest);
	text-decoration:none; color:inherit; cursor:pointer; /* whole card is the link now */
	transition:transform var(--cd-dur) var(--cd-ease), box-shadow var(--cd-dur) var(--cd-ease), border-color var(--cd-dur) var(--cd-ease);
}
.cd-card[hidden]{ display:none; }
/* outline (not box-shadow) so the focus ring isn't clipped by overflow:hidden */
.cd-card:focus-visible{ outline:2px solid var(--cd-accent); outline-offset:2px; }
/* accent hairline cue on hover */
.cd-card::before{
	content:""; position:absolute; top:0; left:0; right:0; height:3px; z-index:4;
	background:linear-gradient(90deg, var(--cd-accent), var(--cd-accent-2));
	opacity:0; transform:scaleX(.4); transform-origin:left;
	transition:opacity var(--cd-dur) var(--cd-ease), transform var(--cd-dur) var(--cd-ease);
}
.cd-card:hover{ transform:translateY(-6px); box-shadow:var(--cd-shadow-hover); border-color:var(--cd-border); }
.cd-card:hover::before{ opacity:1; transform:scaleX(1); }

/* --- staggered reveal (hooks the site's animations.js observer) --- */
.cd-card[data-reveal]{ opacity:0; transform:translateY(18px); }
.cd-card[data-reveal].is-visible{ opacity:1; transform:translateY(0); transition:opacity .55s var(--cd-ease), transform .55s var(--cd-ease); }

/* top zone (dark, gradient + motif) */
.cd-card__top{
	position:relative; isolation:isolate; overflow:hidden;
	padding:var(--cd-s5) var(--cd-s5) 18px;
	background:linear-gradient(165deg, var(--cd-ink-2) 0%, var(--cd-ink) 78%);
}
/* faint diagonal line texture, top-right */
.cd-card__top::after{
	content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.07;
	background-image:repeating-linear-gradient(135deg, #fff 0 1px, transparent 1px 9px);
	-webkit-mask-image:radial-gradient(120px 120px at 100% 0, #000 0%, transparent 70%);
	        mask-image:radial-gradient(120px 120px at 100% 0, #000 0%, transparent 70%);
}
/* soft radial accent glow (the one intentional motif) */
.cd-card__deco{
	position:absolute; top:-54px; right:-54px; width:170px; height:170px; z-index:0;
	border-radius:50%; pointer-events:none; opacity:.7;
	background:radial-gradient(circle at 32% 32%, rgba(200,100,59,.62), rgba(177,83,46,0) 68%);
}
.cd-flag{
	position:relative; z-index:1; display:inline-block; width:36px; height:26px;
	border-radius:var(--cd-r-flag); overflow:hidden; object-fit:cover; background-size:cover;
	box-shadow:0 0 0 1px rgba(255,255,255,.20), 0 2px 8px rgba(0,0,0,.35);
}
.cd-card__name{ position:relative; z-index:1; margin:var(--cd-s4) 0 0; font-size:var(--cd-fs-h3); font-weight:700; color:#fff; letter-spacing:-.005em; }
.cd-card__badge{
	position:relative; z-index:1; display:inline-block; margin-top:10px; max-width:100%;
	font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
	color:#f6d8c8; background:var(--cd-accent-14); border:1px solid var(--cd-accent-42);
	padding:5px 10px; border-radius:var(--cd-r-pill);
	white-space:nowrap; overflow:hidden; text-overflow:ellipsis; /* never wrap to 2 lines */
}

/* body zone */
.cd-card__body{ display:flex; flex-direction:column; flex:1 1 auto; padding:var(--cd-s5); }
.cd-card__desc{
	margin:0 0 var(--cd-s4); color:var(--cd-muted); font-size:var(--cd-fs-sm); line-height:1.55;
	display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.cd-card__chips{ display:flex; flex-wrap:wrap; gap:var(--cd-s2); margin-top:auto; }
.cd-chip{
	display:inline-flex; align-items:center; gap:6px; max-width:100%;
	font-size:var(--cd-fs-xs); font-weight:600; color:var(--cd-text); line-height:1;
	background:var(--cd-accent-08); border:1px solid var(--cd-border);
	padding:7px 11px; border-radius:var(--cd-r-chip);
}
.cd-chip__ic{ width:14px; height:14px; color:var(--cd-accent); flex:0 0 auto; }
/* nowrap text, but ellipsis as a safety net so an extreme-long label can't escape a narrow card */
.cd-chip__t{ white-space:nowrap; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.cd-card__link{
	display:inline-flex; align-items:center; gap:7px; margin-top:auto;
	font-size:var(--cd-fs-sm); font-weight:700; color:var(--cd-accent); text-decoration:none;
}
.cd-card__link:hover{ text-decoration:underline; text-underline-offset:3px; }
.cd-card__arrow{ transition:transform var(--cd-dur) var(--cd-ease); }
.cd-card__link:hover .cd-card__arrow{ transform:translateX(4px); }
.cd-card__link:focus-visible{ outline:none; box-shadow:var(--cd-ring); border-radius:var(--cd-r-flag); }

/* =========================== No results ================================= */
.cd-empty{ text-align:center; color:var(--cd-muted); padding:var(--cd-s7) 0; font-size:var(--cd-fs-body); }
.cd-empty[hidden]{ display:none; }

/* =========================== Show more / less =========================== */
.cd-more{ text-align:center; margin:var(--cd-s2) 0; }
.cd-more__btn{
	display:inline-flex; align-items:center; gap:9px;
	font:inherit; font-size:var(--cd-fs-body); font-weight:600; color:var(--cd-text);
	background:var(--cd-surface); border:1px solid var(--cd-border); border-radius:var(--cd-r-pill);
	padding:14px 28px; cursor:pointer; box-shadow:var(--cd-shadow-rest);
	transition:border-color var(--cd-dur) var(--cd-ease), transform var(--cd-dur-fast) var(--cd-ease), box-shadow var(--cd-dur) var(--cd-ease);
}
.cd-more__btn:hover{ border-color:var(--cd-accent); transform:translateY(-2px); box-shadow:var(--cd-shadow-hover); }
.cd-more__btn:focus-visible{ outline:none; box-shadow:var(--cd-ring); }
.cd-more__ic{ transition:transform var(--cd-dur) var(--cd-ease); }
.cd-more__btn[aria-expanded="true"] .cd-more__ic{ transform:rotate(180deg); }
.cd-more__cap{ margin:var(--cd-s4) 0 0; color:var(--cd-muted); font-size:var(--cd-fs-caption); }
.cd-more__cap[hidden]{ display:none; }

/* =========================== Closing CTA band =========================== */
.cd-cta{
	position:relative; isolation:isolate; overflow:hidden;
	background:linear-gradient(165deg, var(--cd-ink-2) 0%, var(--cd-ink) 80%);
	color:var(--cd-on-dark); margin-top:var(--cd-s8); padding:var(--cd-s8) 0;
}
/* warm accent glow */
.cd-cta::before{
	content:""; position:absolute; z-index:0; top:-40%; right:-10%; width:60vw; height:120%;
	pointer-events:none;
	background:radial-gradient(closest-side, rgba(200,100,59,.30), rgba(177,83,46,0) 70%);
}
/* faint oversized contour ring */
.cd-cta::after{
	content:""; position:absolute; z-index:0; left:-120px; bottom:-220px; width:420px; height:420px;
	pointer-events:none; border-radius:50%; border:1px solid rgba(243,236,225,.10);
	box-shadow:0 0 0 40px rgba(243,236,225,.04);
}
.cd-cta__inner{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:var(--cd-s6); flex-wrap:wrap; }
.cd-cta__title{ margin:0 0 10px; font-size:clamp(24px,3vw,34px); font-weight:800; line-height:1.16; letter-spacing:-.01em; color:#fff; }
.cd-cta__lead{ margin:0; color:var(--cd-on-dark-mut); font-size:var(--cd-fs-body-lg); line-height:1.55; max-width:52ch; }
.cd-cta__btns{ display:flex; gap:var(--cd-s3); flex-wrap:wrap; }
.cd-btn{
	display:inline-flex; align-items:center; justify-content:center;
	font:inherit; font-size:var(--cd-fs-body); font-weight:600; text-decoration:none; white-space:nowrap;
	padding:14px 30px; border-radius:var(--cd-r-pill);
	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);
}
.cd-btn--solid{ background:#fff; color:var(--cd-ink); }
.cd-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,.40); }
.cd-btn--ghost{ background:transparent; color:#fff; border:1px solid var(--cd-white-30); }
.cd-btn--ghost:hover{ background:rgba(255,255,255,.08); border-color:var(--cd-white-55); transform:translateY(-2px); }
.cd-btn:focus-visible{ outline:none; box-shadow:var(--cd-ring); }

/* =========================== Responsive ================================= */
@media (max-width:767px){
	.cd-section{ padding-top:var(--cd-s7); }
	.cd-cta__inner{ flex-direction:column; align-items:flex-start; text-align:left; }
	.cd-cta__btns{ width:100%; }
	.cd-btn{ flex:1 1 auto; }
}

/* =========================== Reduced motion ============================= */
@media (prefers-reduced-motion: reduce){
	.cd-section *,
	.cd-section *::before,
	.cd-section *::after{ transition:none !important; animation:none !important; }
	.cd-card[data-reveal]{ opacity:1 !important; transform:none !important; }
}