/* CACS OJS Theme — Concept C: Central Asia International
 * Ported into the live theme from the approved static reference
 *   docs/design/cacs-public-v2/concept-c-central-asia-international/concept.css
 * (R16 static SVG map, R17 zero light-section animation).
 *
 * Scoping rule: this file is loaded LAST so equal-specificity rules win the
 * cascade. Only the header, the homepage content wrapper, and the footer carry
 * the `.cacs-cc` class, so the generic element selectors below (a, img, *, h1-4,
 * .container, section) never touch OJS article/about/login/admin pages — those
 * keep their existing theme styling. Unique component classes (.hero, .why-card,
 * .board-card, .site-header …) exist only in this theme's own Concept C markup.
 */

:root{
  --cacs-navy-950:#001B38;
  --cacs-navy-900:#002D5E;
  --cacs-navy-800:#0B3E6E;
  --cacs-navy-700:#1B5484;

  --cacs-teal-700:#016E80;
  --cacs-teal-600:#0192A6;
  --cacs-teal-500:#2FADC0;

  --cacs-cyan-400:#6BC9DA;

  --cacs-gray-600:#6E747A;
  --cacs-gray-500:#A2A0A2;
  --cacs-gray-300:#D3D5D7;
  --cacs-gray-100:#F0F2F3;

  --cacs-white:#FFFFFF;
  --cacs-surface:#FFFFFF;
  --cacs-background:#FBFCFC;

  --ok-green:#1E7A4C;
  --err-red:#B3261E;

  --cc-serif: Georgia, 'Times New Roman', serif;
  --cc-sans: 'Segoe UI', -apple-system, Roboto, Arial, sans-serif;

  --sp-1:.4rem; --sp-2:.7rem; --sp-3:1.1rem; --sp-4:1.6rem;
  --sp-5:2.2rem; --sp-6:3rem; --sp-7:4.5rem; --sp-8:5.5rem;

  --radius-s:4px; --radius-m:10px;
  --shadow-card:0 1px 2px rgba(0,27,56,.06), 0 8px 24px rgba(0,27,56,.06);
  --shadow-lift:0 4px 8px rgba(0,27,56,.08), 0 16px 40px rgba(0,27,56,.10);
}

body{overflow-x:hidden;max-width:100vw}

/* Homepage only: let the full-bleed Concept C sections sit flush under the
   sticky header. Neutralizes the default OJS content-wrapper spacing/width on
   the index page (body.pkp_page_index) so other pages are unaffected.

   ROOT CAUSE of the prior "right white column": layout.css caps
   .pkp_structure_content at `width:min(100% - 2*gutter, --cacs-container)`
   (~1152px) and centers it with `margin-inline:auto`. Zeroing only the margin
   (as before) left that 1152px box pinned to the left edge, stranding the
   remaining ~430px as empty white space on the right. The Concept C homepage
   is a full-width banded layout (each section paints edge-to-edge; the inner
   `.cacs-cc .container` re-centers content at 1240px), so the wrapper itself
   must be 100% wide with no max-width. Scoped to body.pkp_page_index only, so
   article/about/login/archives keep their reading-width container. */
body.pkp_page_index .pkp_structure_content,
body.pkp_page_index .pkp_structure_main{padding:0 !important;margin:0 !important;width:100% !important;max-width:none !important}
body.pkp_page_index .pkp_structure_content{display:block !important}

.cacs-cc *{box-sizing:border-box}
.cacs-cc{font-family:var(--cc-sans);color:var(--cacs-navy-900);line-height:1.55;-webkit-font-smoothing:antialiased}
.cacs-cc-home{background:var(--cacs-background)}
.cacs-cc img{max-width:100%;display:block}
.cacs-cc a{color:inherit;text-decoration:none}
.cacs-cc .container{max-width:1240px;margin:0 auto;padding:0 var(--sp-5)}
.cacs-cc h1,.cacs-cc h2,.cacs-cc h3,.cacs-cc h4{font-family:var(--cc-serif);color:var(--cacs-navy-900);margin:0;text-wrap:balance;font-weight:400}
.cacs-cc-home section{padding:var(--sp-8) 0}
.cacs-cc-home .section-alt{background:var(--cacs-gray-100)}

.cacs-cc .eyebrow{display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cacs-teal-700);margin-bottom:var(--sp-2)}
.cacs-cc .eyebrow::before{content:"";width:6px;height:6px;background:var(--cacs-teal-600);transform:rotate(45deg);flex:none}
.cacs-cc .section-head{max-width:640px;margin-bottom:var(--sp-6)}
.cacs-cc .section-head h2{font-size:2.25rem;margin-bottom:.6rem}
.cacs-cc .section-head p{color:var(--cacs-gray-600);font-size:1.02rem;line-height:1.65;margin:0}
.cacs-cc .section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.cacs-cc .section-head.center .eyebrow{justify-content:center}

.cacs-cc .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:.7rem 1.5rem;font-size:.95rem;font-weight:600;border-radius:var(--radius-s);border:1px solid transparent;cursor:pointer;white-space:nowrap;font-family:var(--cc-sans);text-align:center;transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease,border-color .15s ease}
.cacs-cc .btn-primary{background:var(--cacs-teal-600);color:#fff;box-shadow:0 1px 2px rgba(0,27,56,.08),0 6px 16px rgba(1,146,166,.22)}
.cacs-cc .btn-primary:hover{background:var(--cacs-teal-700);transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,27,56,.1),0 10px 22px rgba(1,146,166,.3)}
.cacs-cc .btn-primary:active{transform:translateY(0);box-shadow:0 1px 2px rgba(0,27,56,.1)}
.cacs-cc .btn-outline{background:transparent;border-color:var(--cacs-navy-700);color:var(--cacs-navy-900)}
.cacs-cc .btn-outline:hover{background:var(--cacs-navy-900);color:#fff;border-color:var(--cacs-navy-900);transform:translateY(-1px)}
.cacs-cc .btn-outline-light{background:transparent;border-color:rgba(255,255,255,.55);color:#fff}
.cacs-cc .btn-outline-light:hover{background:rgba(255,255,255,.12);border-color:#fff;transform:translateY(-1px)}
.cacs-cc .btn:focus-visible{outline:2px solid var(--cacs-teal-500);outline-offset:2px}
.cacs-cc .btn-sm{min-height:40px;padding:.5rem 1.05rem;font-size:.9375rem}

/* ===== HEADER ===== */
.site-header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 1px 0 var(--cacs-gray-300)}
.site-header .header-main{padding:.6rem 0}
.site-header .header-main .container{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.site-header .brand{display:flex;align-items:center;gap:.7rem;flex:none}
.site-header .brand img{width:205px;height:auto;object-fit:contain;display:block}
.header-main-right{display:flex;align-items:center;gap:1.3rem}
.header-search{display:flex;align-items:center;gap:.4rem;border:1px solid var(--cacs-gray-300);border-radius:999px;padding:.4rem .5rem .4rem 1rem;width:220px}
.header-search input{border:none;outline:none;font-size:.9rem;flex:1;font-family:var(--cc-sans);color:var(--cacs-navy-900);background:transparent;min-width:0}
.header-search:focus-within{border-color:var(--cacs-teal-600)}
.header-search svg{flex:none;color:var(--cacs-gray-600)}
.header-search button{background:none;border:none;padding:0;margin:0;display:flex;color:var(--cacs-gray-600);cursor:pointer}
.lang-switch{display:flex;gap:.55rem}
.lang-switch a{background:none;border:none;color:var(--cacs-gray-600);font-size:.9375rem;font-weight:600;cursor:pointer;padding:0;font-family:var(--cc-sans)}
.lang-switch a.active{color:var(--cacs-teal-700)}
.header-text-link{font-size:.92rem;font-weight:600;color:var(--cacs-navy-800);white-space:nowrap}
.header-text-link:hover{color:var(--cacs-teal-700)}
/* Scoped under .cacs-cc so this reset out-specifies the theme's own
   components.css `button:not(.pkp_site_nav_toggle)` rule (specificity 0,1,1),
   which otherwise paints these icon buttons with the red --cacs-color-action
   background and its 44px min-height. Without the extra class these two icon
   buttons rendered as solid red squares in the mobile header. */
.cacs-cc .search-icon-btn,.cacs-cc .menu-toggle{display:none;background:none;border:none;min-height:auto;padding:.3rem;cursor:pointer;color:var(--cacs-navy-900)}
/* components.css also has `button:not(.pkp_site_nav_toggle):hover` (0,2,1),
   which re-applied the red background on hover/focus (e.g. the open "X" state
   right after a tap). Match that specificity here so the reset holds in every
   interaction state. */
.cacs-cc .search-icon-btn:hover,.cacs-cc .search-icon-btn:focus,.cacs-cc .menu-toggle:hover,.cacs-cc .menu-toggle:focus{background:none;border:none;color:var(--cacs-teal-700)}
.cacs-cc .menu-toggle{flex-direction:column;justify-content:center;gap:5px;width:34px;height:34px}
.menu-toggle span{display:block;width:22px;height:2px;background:var(--cacs-navy-900);transition:transform .2s,opacity .2s}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open span:nth-child(2){opacity:0}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-search{display:none;overflow:hidden;max-height:0;transition:max-height .2s ease}
.mobile-search.open{max-height:80px}
.mobile-search .container{display:flex;align-items:center;gap:.5rem;border:1px solid var(--cacs-gray-300);border-radius:8px;padding:.6rem .9rem;margin-bottom:.8rem}
.mobile-search input{border:none;outline:none;flex:1;font-size:.9rem;font-family:var(--cc-sans);min-width:0}
.mobile-search svg{flex:none;color:var(--cacs-gray-600)}
.primary-nav{background:var(--cacs-navy-900)}
.primary-nav ul{list-style:none;display:flex;gap:1.9rem;margin:0;padding:0;height:3rem;align-items:center;overflow-x:auto;scrollbar-width:none}
.primary-nav ul::-webkit-scrollbar{display:none}
.primary-nav a{color:#DCE7F0;font-size:.92rem;font-weight:500;padding:.4rem 0;border-bottom:2px solid transparent;white-space:nowrap;flex:none}
.primary-nav a:hover,.primary-nav a.active{color:#fff;border-color:var(--cacs-cyan-400)}
.mobile-nav{display:none}

/* ===== HERO ===== */
.hero{position:relative;background:linear-gradient(180deg,var(--cacs-navy-950) 0%,var(--cacs-navy-900) 100%);overflow:hidden;padding:var(--sp-7) 0}
.hero::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(circle,rgba(255,255,255,.16) 1px,transparent 1.4px);
  background-size:16px 16px;mask-image:linear-gradient(115deg,transparent 0%,transparent 38%,#000 62%,#000 100%);}
.hero .container.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;grid-template-areas:"copy media" "stats media";gap:var(--sp-6) var(--sp-7);align-items:start}
.hero-copy{grid-area:copy}
.hero-media{grid-area:media;position:relative;align-self:center}
.hero-stats{grid-area:stats;display:flex;border-top:1px solid rgba(255,255,255,.14);padding-top:var(--sp-4);align-self:start}
.hero-badges{display:flex;gap:.6rem;margin-bottom:var(--sp-4);flex-wrap:wrap}
.hero-badge{display:flex;align-items:center;gap:.4rem;font-size:.875rem;font-weight:600;letter-spacing:.03em;color:#BFE3EC;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);padding:.4rem .8rem;border-radius:999px;white-space:nowrap}
.hero-badge svg{color:var(--cacs-cyan-400);flex:none}
.hero h1{color:#fff;font-size:3.35rem;line-height:1.12;letter-spacing:-.01em;margin-bottom:var(--sp-4)}
.hero h1 em{font-style:normal;color:var(--cacs-cyan-400)}
.hero p.lead{color:#D3E0EA;font-size:1.15rem;max-width:52ch;margin-bottom:var(--sp-5);line-height:1.75}
.hero-ctas{display:flex;gap:1rem;flex-wrap:wrap}
.hero-stats div{flex:1;padding-right:var(--sp-4);border-right:1px solid rgba(255,255,255,.12);display:flex;align-items:center;gap:.6rem}
.hero-stats div:last-child{border-right:none}
.hero-stats div svg{color:var(--cacs-teal-500);flex:none}
.hero-stat-text{display:flex;flex-direction:column}
.hero-stat-text strong{display:block;color:var(--cacs-cyan-400);font-family:var(--cc-serif);font-size:1.85rem;font-weight:400;line-height:1.1}
.hero-stat-text span{color:#93A9BA;font-size:.9375rem;text-transform:uppercase;letter-spacing:.05em}
.hero-media::before{content:"";position:absolute;inset:-18%;background:radial-gradient(circle,rgba(107,201,218,.32) 0%,rgba(1,146,166,.14) 42%,transparent 72%);z-index:0;pointer-events:none}
.hero-media-frame{position:relative;z-index:1;border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.16),0 40px 70px -24px rgba(0,6,18,.7),0 0 60px -10px rgba(1,146,166,.35);background:linear-gradient(160deg,rgba(107,201,218,.3),rgba(1,146,166,.06));padding:3px}
.hero-media-frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(0,20,45,.32) 0%,transparent 18%,transparent 68%,rgba(0,10,28,.55) 100%);border-radius:16px}
.hero-media-frame img{width:100%;height:430px;object-fit:cover;display:block;border-radius:13px}
.hero-network-svg{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);pointer-events:none;z-index:3}
.hero-media-caption{position:absolute;left:0;right:0;bottom:0;z-index:4;background:linear-gradient(0deg,rgba(0,14,34,.92) 0%,rgba(0,14,34,.72) 65%,transparent 100%);border-bottom-left-radius:13px;border-bottom-right-radius:13px;padding:2.2rem 1.3rem 1.1rem;display:flex;align-items:center;gap:.6rem}
.hero-media-caption strong{color:#fff;font-size:.9375rem;font-weight:600;white-space:nowrap}
.hero-media-caption span{color:#B7CBD9;font-size:.875rem}

/* ===== HERO IMAGE SLIDER (admin-configured, 2+ slides) ===== */
.hero-slider .hero-slide{margin:0}
.hero-slider .hero-slide a{display:block;line-height:0}
.hero-slider .hero-slide img{width:100%;height:430px;object-fit:cover;display:block;border-radius:13px}
.hero-slider .hero-media-caption{padding:2.2rem 1.3rem 1.1rem}
.hero-slider .hero-media-caption span{color:#fff;font-size:.9375rem;font-weight:600}
.hero-slider-controls{position:absolute;left:0;right:0;bottom:.9rem;z-index:5;display:flex;align-items:center;justify-content:center;gap:.9rem;padding:0 1rem}
.hero-slider-arrow{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(0,14,34,.45);color:#fff;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.hero-slider-arrow:hover,.hero-slider-arrow:focus-visible{background:rgba(0,14,34,.75);border-color:#fff}
.hero-slider-dots{display:flex;align-items:center;gap:.5rem}
.hero-slider-dot{width:.5rem;height:.5rem;border-radius:50%;border:none;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:background .2s ease,transform .2s ease}
.hero-slider-dot.is-active{background:var(--cacs-cyan-400);transform:scale(1.3)}
@media (prefers-reduced-motion:reduce){.hero-slider .hero-slide{transition:none}}

/* PHASE-08F4A: hero slide video layer (native <video> or the YouTube
   iframe) — sits directly on top of the poster <img> at identical size, so
   removing it on a real playback error (theme.js) always reveals the same
   poster underneath. Poster stays in the DOM the whole time; never a
   separate "loading" gap. */
.hero-slider .hero-slide{position:relative}
.hero-slide__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;display:block;border-radius:13px;pointer-events:none}
/* PHASE-08F4A: per-slide overlay strength (brief §7/§10) - a dedicated
   layer on the slide itself (not the shared .hero-media-frame::after,
   which is one fixed strength for the static single-image fallback only). */
.hero-slide::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:13px}
.hero-slide--overlay-light::after{background:linear-gradient(180deg,rgba(0,20,45,.14) 0%,transparent 30%,transparent 60%,rgba(0,10,28,.32) 100%)}
.hero-slide--overlay-medium::after{background:linear-gradient(180deg,rgba(0,20,45,.28) 0%,transparent 22%,transparent 65%,rgba(0,10,28,.55) 100%)}
.hero-slide--overlay-dark::after{background:linear-gradient(180deg,rgba(0,10,24,.5) 0%,transparent 16%,transparent 55%,rgba(0,6,16,.78) 100%)}
.hero-slide__title{display:block;color:#fff;font-size:1.05rem;font-weight:700;margin-bottom:.15rem}
.hero-slide__cta{margin-top:.6rem;align-self:flex-start}
.hero-slider .hero-media-caption{z-index:4;flex-direction:column;align-items:flex-start}

/* PHASE-08F4A1 §4: YouTube/Vimeo poster-first play control + injected
   embed. .hero-slide__embed is a SEPARATE class from .hero-slide__video on
   purpose - the direct/upload <video> stays pointer-events:none (it's pure
   decoration), but the visitor must be able to click inside an embedded
   YouTube/Vimeo player once they've opted in, so the injected iframe needs
   real pointer events. */
.hero-slide__play{position:absolute;inset:0;z-index:5;margin:auto;width:64px;height:64px;border-radius:50%;background:rgba(0,20,45,.55);border:2px solid rgba(255,255,255,.85);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.hero-slide__play:hover,.hero-slide__play:focus-visible{background:var(--cacs-teal-600,#0192A6);border-color:#fff}
.hero-slide__embed{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;border-radius:13px;z-index:2}
.hero-slide__stop{position:absolute;top:.6rem;right:.6rem;z-index:6;width:32px;height:32px;border-radius:50%;background:rgba(0,10,28,.65);color:#fff;border:1px solid rgba(255,255,255,.5);cursor:pointer;font-size:.85rem;line-height:1}
.hero-slide__stop:hover,.hero-slide__stop:focus-visible{background:var(--err-red,#B3261E);border-color:#fff}

/* ===== FEATURED VIDEO (admin URL; hidden entirely when unset) ===== */
.cacs-featured-video-frame{position:relative;width:100%;max-width:860px;margin:0 auto;aspect-ratio:16/9;border-radius:var(--radius-m);overflow:hidden;box-shadow:var(--shadow-lift);background:#000}
.cacs-featured-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cacs-featured-video-card{display:flex;flex-direction:column;align-items:center;gap:.9rem;max-width:520px;margin:0 auto;padding:var(--sp-6) var(--sp-4);border-radius:var(--radius-m);border:1px solid var(--cacs-gray-300);background:linear-gradient(160deg,var(--cacs-navy-900),var(--cacs-navy-950));color:#fff;text-decoration:none;transition:box-shadow .2s ease,transform .2s ease}
.cacs-featured-video-card:hover,.cacs-featured-video-card:focus-visible{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.cacs-featured-video-play{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:50%;border:1px solid rgba(255,255,255,.5);color:#fff}
.cacs-featured-video-label{font-family:var(--cc-sans);font-size:1.05rem;font-weight:700}
.cacs-featured-video-caption{text-align:center;color:var(--cacs-gray-600);font-size:.9375rem;margin-top:var(--sp-3)}

/* PHASE-08F4B1 §4: Featured Content - references a real live submission. */
.cacs-featured-content__card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-6);align-items:center;background:#fff;border:1px solid var(--cacs-gray-300);border-radius:var(--radius-m);overflow:hidden;box-shadow:var(--shadow-lift)}
.cacs-featured-content__image{width:100%;height:100%;min-height:260px;object-fit:cover}
.cacs-featured-content__body{padding:var(--sp-5) var(--sp-5) var(--sp-5) 0}
.cacs-featured-content__card:not(:has(.cacs-featured-content__image)) .cacs-featured-content__body{padding:var(--sp-5)}
.cacs-featured-content__body h2{margin:.4rem 0 .8rem}
.cacs-featured-content__body p{color:var(--cacs-gray-600);margin-bottom:var(--sp-4)}

/* PHASE-08F4B1 §6: Partners - brand/sponsor logos (distinct from the
   Signature Network country-stat chips in .partner-row-light). */
.cacs-partners-logos__grid{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--sp-6)}
.cacs-partners-logos__item{display:flex;align-items:center;justify-content:center}
.cacs-partners-logos__item img{max-height:56px;max-width:160px;object-fit:contain;filter:grayscale(1);opacity:.75;transition:filter .2s ease,opacity .2s ease}
.cacs-partners-logos__item:hover img{filter:none;opacity:1}

/* PHASE-08F4B1 §7: Additional Blocks - 3 fixed types only. */
.cacs-block-text-image__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-6);align-items:center}
.cacs-block-text-image__image{width:100%;border-radius:var(--radius-m);object-fit:cover}
.cacs-block-text-image__body p{color:var(--cacs-gray-600);margin:.6rem 0 1rem}
.cacs-block-cta{background:linear-gradient(160deg,var(--cacs-navy-900),var(--cacs-navy-950));color:#fff}
.cacs-block-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);flex-wrap:wrap}
.cacs-block-cta__inner p{color:rgba(255,255,255,.8);margin-top:.4rem}
.cacs-block-stats__inner{display:flex;align-items:center;gap:var(--sp-5);justify-content:center;text-align:left}
.cacs-block-stats__value{font-size:2.6rem;font-weight:700;color:var(--cacs-teal-600,#0192A6);font-family:var(--cc-serif,Georgia,serif)}

/* ===== JOURNAL HIGHLIGHTS ===== */
/* NOTE: `.highlights` is also a class in the DEFAULT OJS theme's compiled
   stylesheet, which sets `margin:-0.714rem -1.43rem` (a negative full-bleed
   nudge for its own homepage block). That collided with this Concept C section
   of the same name: our rule set only the background, so the default theme's
   negative inline margins bled through and pushed this section ~34px past the
   viewport (the desktop horizontal-overflow bug). Explicitly zero the margin
   here so no default-theme value leaks in. Scoped-safe: only affects the
   homepage, which is the only place a `.highlights` section exists. */
.highlights{margin:0;background:#fff;border-bottom:1px solid var(--cacs-gray-300)}
.highlights .container{display:grid;grid-template-columns:repeat(6,1fr);gap:0}
.highlight-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:var(--sp-5) var(--sp-2);border-left:1px solid var(--cacs-gray-300)}
.highlight-item:first-child{border-left:none}
.highlight-item svg{color:var(--cacs-teal-600)}
.highlight-item span{font-size:.9375rem;font-weight:600;color:var(--cacs-navy-900);line-height:1.35}

/* ===== CURRENT ISSUE ===== */
.issue{display:grid;grid-template-columns:.62fr 1.38fr;gap:var(--sp-7);align-items:stretch}
.issue-cover{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--cacs-navy-900),var(--cacs-navy-950));border-radius:var(--radius-m);padding:var(--sp-5);color:#fff;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow-card);min-height:360px}
.issue-cover img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;z-index:0}
.issue-cover::after{content:"";position:absolute;inset:0;opacity:.5;background-image:radial-gradient(circle,rgba(255,255,255,.1) 1px,transparent 1.3px);background-size:16px 16px;mask-image:radial-gradient(circle at 30% 55%,#000 0%,transparent 65%);pointer-events:none}
.issue-cover>*{position:relative;z-index:1}
.issue-cover-top span{display:block;font-size:.875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--cacs-cyan-400);margin-bottom:.3rem}
.issue-cover-top strong{font-family:var(--cc-serif);font-size:1.3rem;font-weight:400;display:block;line-height:1.3}
.issue-cover-mark{width:52px;height:52px;border-radius:50%;border:2px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;align-self:flex-start}
.issue-cover-volume{position:relative;display:flex;align-items:baseline;gap:.5rem;font-family:var(--cc-serif);font-size:4.2rem;line-height:1;color:rgba(255,255,255,.16);font-weight:400}
.issue-cover-volume span{font-size:1rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.22)}
.issue-cover-volume em{font-style:normal;font-family:var(--cc-sans);font-size:.9rem;color:rgba(255,255,255,.22);align-self:center}
.issue-cover-status{display:inline-flex;align-self:flex-start;align-items:center;gap:.4rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:.3rem .7rem;border-radius:999px;font-size:.875rem;color:#BFE3EC}
.issue-detail h3{font-size:1.5rem;margin-bottom:.6rem}
.issue-detail>p{color:var(--cacs-gray-600);margin-bottom:var(--sp-4);max-width:70ch}
.issue-actions{display:flex;gap:.8rem;margin-bottom:var(--sp-5);flex-wrap:wrap}
.issue-toc{list-style:none;margin:0;padding:0;border-top:1px solid var(--cacs-gray-300)}
.issue-toc li{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--cacs-gray-300);font-size:.88rem}
.issue-toc li span.t{color:var(--cacs-navy-900);font-weight:600}
.issue-toc li span.a{color:var(--cacs-gray-600);font-size:.9rem;display:block;margin-top:.15rem;font-weight:400}

/* ===== LATEST RESEARCH ===== */
.research-tabs{display:flex;gap:.4rem;margin-bottom:var(--sp-5);border-bottom:1px solid var(--cacs-gray-300)}
.research-tabs button{background:none;border:none;padding:.7rem 1.1rem;font-size:.9375rem;font-weight:600;color:var(--cacs-gray-600);cursor:pointer;border-bottom:2px solid transparent;font-family:var(--cc-sans)}
.research-tabs button.active{color:var(--cacs-navy-900);border-color:var(--cacs-teal-600)}
.research-tabs button[disabled]{opacity:.55;cursor:not-allowed}
.article-list .article-row{display:grid;grid-template-columns:5.5rem 1fr auto;gap:var(--sp-4);align-items:start;padding:var(--sp-4) 0;border-bottom:1px solid var(--cacs-gray-300)}
.article-list .article-row:first-child{padding-top:0}
.article-type{font-size:.875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--cacs-teal-700);background:rgba(1,146,166,.08);padding:.3rem .5rem;border-radius:var(--radius-s);text-align:center}
.article-main h3{font-family:var(--cc-sans);font-weight:700;font-size:1.15rem;color:var(--cacs-navy-900);margin-bottom:.35rem;line-height:1.4}
.article-main h3 a{color:inherit}
.article-main h3 a:hover{color:var(--cacs-teal-700)}
.article-meta{color:var(--cacs-gray-600);font-size:.9rem;margin-bottom:.4rem}
.article-tags{display:flex;gap:.5rem;flex-wrap:wrap}
.article-tags span{font-size:.875rem;color:var(--cacs-gray-600);border:1px solid var(--cacs-gray-300);border-radius:999px;padding:.15rem .55rem}
.article-tags span.oa{color:var(--ok-green);border-color:var(--ok-green)}
.article-actions{display:flex;flex-direction:column;gap:.5rem;align-items:flex-end}
.article-actions a{font-size:.9375rem;font-weight:600;color:var(--cacs-teal-700);padding:.35rem .15rem;min-height:44px;display:inline-flex;align-items:center}
.article-actions a:hover{text-decoration:underline}

/* ===== RESEARCH NETWORK (signature section) ===== */
/* Phase 07A map "double background" fix, round 2: the previous fix unified
   the section/card navy tones but kept a cyan-tinted border plus a large
   55px-blur box-shadow on .cacs-network-map - against two close-but-not-
   identical navy tones that combination still rendered as a visible seam/
   halo around the card (most noticeable along the right edge). Removed the
   border and shadow entirely. Also re-measured the actual PNG artwork's own
   edge pixels (signature-network-world-map-approved.png averages ~#011A3F
   at its corners/margins, sampled directly, not #0A2447 as this section
   previously used) and matched the section background to that exact tone,
   so there is no residual colour delta at the rounded-corner clip boundary
   where the image meets the section. Map artwork unchanged. */
.network-section-light{position:relative;overflow:hidden;padding:var(--sp-6) 0;
  background:#011A3F}
.network-section-light .container{position:relative}
.section-head-light{max-width:850px}
.eyebrow-light{display:flex;align-items:center;gap:.5rem;font-size:.9375rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--cacs-cyan-400);margin-bottom:var(--sp-2)}
.eyebrow-light::before{content:"";width:6px;height:6px;background:var(--cacs-cyan-400);transform:rotate(45deg);flex:none}
.section-head-light h2{font-size:2.75rem;line-height:1.14;color:#FFFFFF;margin-bottom:.7rem}
.section-head-light p{font-size:1.15rem;line-height:1.65;color:#B9CBDC;max-width:850px;margin:0}

.cacs-network-map{
  position:relative;isolation:isolate;contain:layout paint;margin-top:var(--sp-5);
  box-sizing:border-box;width:100%;max-width:1040px;margin-inline:auto;
  aspect-ratio:1694/929;border-radius:20px;overflow:hidden;
  background:#011A3F;
}
.cacs-network-map__surface{position:relative;width:100%;height:100%}
.cacs-network-map__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;z-index:2;user-select:none;-webkit-user-drag:none}

.network-reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.network-section-light.in-view .network-reveal{opacity:1;transform:translateY(0)}
.network-section-light.in-view .network-reveal.d1{transition-delay:0s}
.network-section-light.in-view .network-reveal.d2{transition-delay:.15s}
.network-section-light.in-view .network-reveal.d3{transition-delay:.32s}
.network-section-light.in-view .network-reveal.d4{transition-delay:.42s}
.network-section-light.in-view .network-reveal.d5{transition-delay:.52s}

.partner-row-light{display:flex;gap:1rem;margin-top:var(--sp-4);flex-wrap:wrap}
.partner-chip-light{flex:1 1 0;min-width:150px;min-height:92px;display:flex;align-items:center;gap:.9rem;
  background:rgba(255,255,255,.045);border:1px solid rgba(94,203,221,.16);border-radius:15px;padding:1.15rem 1.1rem;
  transition:border-color .18s ease,transform .2s ease,box-shadow .2s ease}
.partner-chip-light:hover{border-color:rgba(94,203,221,.5);transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(0,0,0,.35)}
.count-badge-light{flex:none;width:34px;height:34px;border-radius:50%;background:linear-gradient(155deg,var(--cacs-teal-500),var(--cacs-teal-700));color:#fff;font-family:var(--cc-serif);font-size:.95rem;font-weight:400;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 4px rgba(94,203,221,.14)}
.partner-chip-light strong{display:block;font-size:1.05rem;font-weight:700;color:#FFFFFF;letter-spacing:-.01em;white-space:nowrap}
.partner-chip-light span{font-size:.9375rem;color:#9DB8CC;text-transform:uppercase;letter-spacing:.03em}

@media (prefers-reduced-motion: reduce){
  .network-reveal{opacity:1 !important;transform:none !important;transition:none !important}
}

/* ===== WHY PUBLISH ===== */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.why-card{background:#fff;border:1px solid var(--cacs-gray-300);border-radius:var(--radius-m);padding:var(--sp-4);box-shadow:var(--shadow-card);transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.why-card:hover{box-shadow:var(--shadow-lift);border-color:var(--cacs-teal-500);transform:translateY(-2px)}
.why-card svg{color:var(--cacs-teal-600);margin-bottom:.9rem}
.why-card h3{font-family:var(--cc-sans);font-size:1.2rem;font-weight:700;margin-bottom:.4rem}
.why-card p{color:var(--cacs-gray-600);font-size:1rem;margin:0;line-height:1.6}

/* ===== RESEARCH AREAS ===== */
.areas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--cacs-gray-300);border:1px solid var(--cacs-gray-300);border-radius:var(--radius-m);overflow:hidden}
.area-card{background:#fff;padding:var(--sp-4);display:flex;flex-direction:column;gap:.6rem}
.area-card svg{color:var(--cacs-navy-800)}
.area-card strong{font-size:1.05rem;font-weight:700;color:var(--cacs-navy-900)}

/* ===== ANNOUNCEMENTS ===== */
.announce-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:var(--sp-4)}
.announce-card{border:1px solid var(--cacs-gray-300);border-radius:var(--radius-m);padding:var(--sp-4);background:#fff;display:flex;flex-direction:column;transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.announce-card:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.announce-card.featured{background:linear-gradient(160deg,var(--cacs-navy-900),var(--cacs-navy-950));color:#fff;border-color:transparent}
.announce-tag{font-size:.875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--cacs-teal-700);margin-bottom:.6rem}
.announce-card.featured .announce-tag{color:var(--cacs-cyan-400)}
.announce-card.featured h3{color:#fff}
.announce-card h3{font-family:var(--cc-sans);font-size:1.2rem;font-weight:700;margin-bottom:.5rem;line-height:1.4}
.announce-card p{font-size:1rem;color:var(--cacs-gray-600);margin:0 0 var(--sp-3);flex:1}
.announce-card.featured p{color:#C4D3DE}
.announce-card time{font-size:.875rem;color:var(--cacs-gray-500)}
.announce-card.featured time{color:#93A9BA}
.announce-empty{border:1px dashed var(--cacs-gray-300);border-radius:var(--radius-m);padding:var(--sp-5);text-align:center;color:var(--cacs-gray-600);font-size:.9rem;grid-column:1/-1}
.cacs-empty-state{display:flex;flex-direction:column;align-items:center;gap:.85rem;border:1px dashed var(--cacs-gray-300);border-radius:var(--radius-m);padding:var(--sp-6) var(--sp-5);text-align:center;color:var(--cacs-gray-600);max-width:480px;margin:0 auto}
.cacs-empty-state svg{color:var(--cacs-teal-600)}
.cacs-empty-state p{margin:0;font-size:.9375rem;line-height:1.5}

/* ===== EDITORIAL BOARD ===== */
.board-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--sp-4)}
.board-card{background:#fff;border:1px solid var(--cacs-gray-300);border-radius:10px;overflow:hidden;box-shadow:var(--shadow-card);transition:box-shadow .22s ease,border-color .22s ease,transform .22s ease;display:flex;flex-direction:column}
.board-card:hover{box-shadow:var(--shadow-lift);border-color:var(--cacs-teal-500);transform:translateY(-3px)}
.board-card img{width:100%;height:318px;object-fit:cover;object-position:center 16%;display:block;transition:transform .5s ease;background:var(--cacs-gray-100)}
.board-card:hover img{transform:scale(1.025)}
.board-card__placeholder{width:100%;height:318px;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--cacs-gray-100),#E4E9EC)}
.board-card__placeholder svg{width:78px;height:78px;color:var(--cacs-gray-500)}
.board-card-avatar{width:100%;height:150px;display:flex;align-items:center;justify-content:center;background:linear-gradient(155deg,var(--cacs-navy-900),var(--cacs-teal-700));color:#fff;font-family:var(--cc-serif);font-size:2.75rem;font-weight:400;letter-spacing:.04em}
.board-card-body{padding:var(--sp-4);border-top:3px solid transparent;transition:border-color .2s ease;position:relative;flex:1;display:flex;flex-direction:column}
.board-card-body::before{content:"";position:absolute;top:0;left:var(--sp-4);right:var(--sp-4);height:1px;background:var(--cacs-gray-300)}
.board-card:hover .board-card-body{border-color:var(--cacs-teal-600)}
.board-card-body strong{display:block;font-family:var(--cc-serif);font-size:1.2rem;font-weight:400;color:var(--cacs-navy-900)}
.board-card-body .role{display:block;font-size:.9375rem;font-weight:600;color:var(--cacs-teal-700);margin:.3rem 0 .4rem}
.board-card-body .inst{display:block;font-size:.9375rem;color:var(--cacs-gray-600);line-height:1.45}
.board-card-body .country{display:flex;align-items:center;gap:.35rem;margin-top:.6rem;font-size:.875rem;color:var(--cacs-gray-500)}

/* ===== PATHWAY CARDS (Get Involved) ===== */
.pathway-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.pathway-card{border:1px solid var(--cacs-gray-300);border-radius:var(--radius-m);padding:var(--sp-5);background:#fff;transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.pathway-card:hover{box-shadow:var(--shadow-lift);border-color:var(--cacs-teal-500);transform:translateY(-3px)}
.pathway-card-icon{width:52px;height:52px;border-radius:50%;background:rgba(1,146,166,.09);display:flex;align-items:center;justify-content:center;margin-bottom:1.1rem}
.pathway-card-icon svg{color:var(--cacs-teal-600)}
.pathway-card h3{font-family:var(--cc-sans);font-size:1.3rem;font-weight:700;margin-bottom:.55rem}
.pathway-card p{color:var(--cacs-gray-600);font-size:.94rem;line-height:1.6;margin-bottom:var(--sp-4)}
.pathway-card ul{list-style:none;margin:0 0 var(--sp-4);padding:0;display:flex;flex-direction:column;gap:.6rem}
.pathway-card ul a{font-size:.9375rem;color:var(--cacs-navy-800);font-weight:600}
.pathway-card ul a:hover{color:var(--cacs-teal-700)}
.pathway-card .btn{width:100%;justify-content:center}

/* ===== POLICIES ===== */
.policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5)}
.policy-col h3{font-family:var(--cc-sans);font-size:.95rem;font-weight:700;margin-bottom:.8rem;display:flex;align-items:center;gap:.5rem}
.policy-col h3 svg{color:var(--cacs-teal-600);flex:none}
.policy-col p{font-size:1rem;color:var(--cacs-gray-600);line-height:1.65;margin:0}

/* ===== NEWS & EVENTS ===== */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.news-card{border:1px solid var(--cacs-gray-300);border-radius:var(--radius-m);overflow:hidden;background:#fff;box-shadow:var(--shadow-card);transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.news-card:hover{box-shadow:var(--shadow-lift);border-color:var(--cacs-teal-500);transform:translateY(-2px)}
.news-card img{display:block;width:100%;height:auto}
.news-card-body{padding:var(--sp-3) var(--sp-4) var(--sp-4)}
.news-meta{display:flex;gap:.6rem;align-items:center;font-size:.875rem;color:var(--cacs-gray-500);margin-bottom:.5rem}
.news-meta .cat{color:var(--cacs-teal-700);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.news-card h3{font-family:var(--cc-sans);font-size:1.15rem;font-weight:700;margin-bottom:.5rem;line-height:1.4}
.news-card p{font-size:1rem;color:var(--cacs-gray-600);margin-bottom:.7rem}
.news-card a{font-size:.9375rem;font-weight:600;color:var(--cacs-teal-700)}

/* Single real item: a 3-col grid with one narrow card left a huge blank
   gap. Render one wide feature card instead - image left, content right. */
.news-grid--single{grid-template-columns:1fr;max-width:900px}
.news-grid--single .news-card{display:flex;flex-direction:row;align-items:stretch}
.news-grid--single .news-card img{width:42%;flex:0 0 42%;height:auto;object-fit:cover}
.news-grid--single .news-card-body{flex:1;display:flex;flex-direction:column;justify-content:center;padding:var(--sp-5) var(--sp-6)}
.news-grid--single .news-card h3{font-size:1.4rem}
.news-grid--single .news-card p{font-size:1.05rem}

/* ===== NEWSLETTER ===== */
.newsletter{background:linear-gradient(160deg,var(--cacs-navy-900),var(--cacs-navy-950));color:#fff}
.newsletter .container{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-6);flex-wrap:wrap}
.newsletter h2{color:#fff;font-size:1.6rem;margin-bottom:.4rem}
.newsletter p{color:#B9CBD9;margin:0;font-size:.9rem;max-width:44ch}
.newsletter-form{display:flex;gap:.6rem;flex:none}
.newsletter-form input{padding:.75rem 1rem;border-radius:var(--radius-s);border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;font-size:.9375rem;min-width:260px;font-family:var(--cc-sans)}
.newsletter-form input::placeholder{color:#8FA6BC}

/* ===== FOOTER ===== */
/* PHASE-08F4B4B: compacted - shorter top padding, tighter column gap, one
   fewer implied grid slot (4 columns matching the actual 4 rendered blocks,
   was a 5-slot grid regularly holding 6 blocks and wrapping an extra one
   onto its own row, the main source of the excess footer height). */
.site-footer{background:var(--cacs-navy-950);color:#B9CBD9;padding-top:var(--sp-5)}
.site-footer .footer-top{display:grid;grid-template-columns:1.3fr .9fr 1.1fr 1.7fr;gap:var(--sp-5);padding-bottom:var(--sp-4);border-bottom:1px solid rgba(255,255,255,.1)}
.footer-brand-panel{background:#fff;border-radius:var(--radius-m);padding:.6rem var(--sp-3);display:inline-flex;align-items:center;margin-bottom:var(--sp-3)}
.footer-brand-panel img{width:140px;height:auto;object-fit:contain;display:block}
/* Clamped to 2 lines - a long admin-entered about paragraph no longer
   stretches the whole footer's height by itself. */
.footer-brand p{font-size:.9rem;line-height:1.55;color:#A9C0CF;max-width:34ch;margin:0 0 .6rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.footer-partner-mark{max-height:32px!important;margin-top:.3rem!important}
.footer-social{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.6rem}
.footer-social a,.footer-social .social-disabled{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#B9CBD9;background:transparent;transition:border-color .18s ease,color .18s ease,background-color .18s ease,transform .18s ease}
.footer-social a svg,.footer-social .social-disabled svg{width:15px;height:15px}
.footer-social a:hover,.footer-social a:focus-visible{border-color:var(--cacs-teal-500);background:var(--cacs-teal-600);color:#fff;transform:translateY(-2px)}
.footer-social a:focus-visible{outline:2px solid var(--cacs-cyan-400);outline-offset:2px}
/* Non-configured channel: icon stays visible for layout parity but reads as
   inactive and is not keyboard/pointer interactive (it is a <span>, not <a>). */
.footer-social .social-disabled{opacity:.45;cursor:default}
.footer-col h4{font-size:.8125rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;margin-bottom:.85rem}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.footer-col a{font-size:.875rem;color:#B9CBD9}
.footer-col a:hover{color:var(--cacs-cyan-400)}
/* Dense 2-column policy index - was one long 9-item single column, now a
   compact block matching the height of the other three columns. */
.footer-policies-grid{display:grid!important;grid-template-columns:1fr 1fr;column-gap:var(--sp-4);row-gap:.55rem}
.footer-policies-grid a{line-height:1.4}
.footer-contact-summary{margin-top:.6rem}
.footer-contact-summary a{font-size:.875rem;color:#B9CBD9}
.footer-contact-summary a:hover{color:var(--cacs-cyan-400)}
.footer-quicklinks{list-style:none;margin:.6rem 0 0;padding:.6rem 0 0;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:.45rem}
.footer-quicklinks li a{font-size:.875rem;color:#B9CBD9}
.footer-quicklinks li a:hover{color:var(--cacs-cyan-400)}
.legal-bar{background:var(--cacs-navy-950);border-top:1px solid rgba(255,255,255,.08);margin-top:var(--sp-4)}
.legal-bar .container{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-3) 0;flex-wrap:wrap;gap:.8rem}
.legal-bar span{font-size:.85rem;color:#93A9BA}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .hero .container.hero-grid{grid-template-columns:1fr;grid-template-areas:"copy" "media" "stats"}
  .hero-media{align-self:auto}
  .issue{grid-template-columns:1fr}
  .site-footer .footer-top{grid-template-columns:1fr 1fr}
  .areas-grid{grid-template-columns:repeat(2,1fr)}
}
/* Intermediate desktop range (769-1100px): the full inline search box makes the
   header row too wide and causes horizontal overflow before the mobile header
   takes over at 768px. Hide the inline search box (search remains reachable via
   the Articles nav item / footer) and tighten action spacing. */
@media (max-width:1100px){
  .header-search{display:none}
  .header-main-right{gap:.9rem}
}
@media (max-width:900px){
  .primary-nav ul{gap:1.2rem}
  .primary-nav a{font-size:.875rem}
  .highlights .container{grid-template-columns:repeat(3,1fr)}
  .highlight-item:nth-child(4){border-left:none}
  .partner-chip-light{flex-basis:calc(33.333% - .67rem)}
  .why-grid,.pathway-grid,.policy-grid,.news-grid{grid-template-columns:1fr 1fr}
  .announce-grid{grid-template-columns:1fr}
  .board-grid{grid-template-columns:1fr 1fr}
}

/* --- Mobile header rebuild: real hamburger nav, no horizontal scroll/clip --- */
@media (max-width:768px){
  .site-header .brand img{width:138px}
  .site-header .header-main{padding:.65rem 0}
  .header-search,.lang-switch,.header-text-link{display:none}
  .header-main-right>.btn-primary{display:none}
  .header-main-right{gap:.4rem}
  .cacs-cc .search-icon-btn,.cacs-cc .menu-toggle{display:flex;align-items:center;justify-content:center}
  .mobile-search{display:block}
  .primary-nav{display:none}
  .mobile-nav{display:block;max-height:0;overflow:hidden;background:var(--cacs-navy-900);transition:max-height .28s ease}
  .mobile-nav.open{max-height:calc(100vh - 62px);overflow-y:auto}
  .mobile-nav ul{list-style:none;margin:0;padding:var(--sp-3) var(--sp-4) 0;display:flex;flex-direction:column}
  .mobile-nav a{display:block;padding:.85rem 0;color:#DCE7F0;font-size:.95rem;font-weight:500;border-bottom:1px solid rgba(255,255,255,.08)}
  .mobile-nav a.active{color:var(--cacs-cyan-400)}
  .mobile-nav-divider{height:1px;background:rgba(255,255,255,.1);margin:var(--sp-1) var(--sp-4) 0}
  .mobile-nav-lang{display:flex;gap:1rem;padding:var(--sp-3) var(--sp-4) 0}
  .mobile-nav-lang a{background:none;border:none;color:#93A9BA;font-size:.85rem;font-weight:600;cursor:pointer;font-family:var(--cc-sans)}
  .mobile-nav-lang a.active{color:var(--cacs-cyan-400)}
  .mobile-nav-actions{display:flex;flex-direction:column;gap:.7rem;padding:var(--sp-4)}
  .mobile-nav-actions .btn{width:100%;justify-content:center;min-height:44px}
  .mobile-nav-actions .btn-outline{border-color:rgba(255,255,255,.35);color:#fff}
}

@media (max-width:700px){
  .footer-brand-panel img{width:142px}
  .cacs-cc .container{padding:0 var(--sp-4)}
  .cacs-cc-home section{padding:var(--sp-6) 0}
  .hero{padding:var(--sp-6) 0}
  .hero h1{font-size:2.3rem}
  .hero-badges{gap:.5rem}
  .hero-badge{font-size:.8125rem;padding:.32rem .65rem}
  .hero-ctas{flex-direction:column}
  .hero-ctas .btn{width:100%;justify-content:center;min-height:44px}
  .hero-media-frame img{height:230px}
  .hero-media-caption{flex-direction:column;align-items:flex-start;gap:.15rem;left:.8rem;right:.8rem;bottom:.8rem;padding:.6rem .8rem}
  .hero-slider .hero-slide img{height:230px}
  .cacs-featured-video-frame{max-width:100%}
  .cacs-featured-content__card{grid-template-columns:1fr}
  .cacs-featured-content__body{padding:var(--sp-5)}
  .cacs-block-text-image__grid{grid-template-columns:1fr}
  .cacs-block-cta__inner{flex-direction:column;align-items:flex-start}
  .cacs-block-stats__inner{flex-direction:column;text-align:center}
  .hero-stats{flex-wrap:wrap;row-gap:var(--sp-4)}
  .hero-stats div{flex:0 0 50%;border-right:none;padding-right:0;margin-bottom:.4rem}
  .hero-stat-text strong{font-size:1.5rem}
  .cacs-cc .section-head h2{font-size:1.7rem}
  .section-head-light h2{font-size:2.1rem}
  .section-head-light p{font-size:1rem}
  .cacs-network-map{border-radius:16px}
  .partner-row-light{gap:.7rem}
  .partner-chip-light{flex-basis:calc(50% - .35rem);padding:1.05rem 1.1rem}
  .count-badge-light{width:30px;height:30px;font-size:.88rem}
  .highlights .container{grid-template-columns:1fr 1fr}
  .highlight-item:nth-child(odd){border-left:none}
  .why-grid,.pathway-grid,.policy-grid,.news-grid,.board-grid{grid-template-columns:1fr}
  .news-grid--single .news-card{flex-direction:column}
  .news-grid--single .news-card img{width:100%;flex-basis:auto}
  .areas-grid{grid-template-columns:1fr 1fr}
  .site-footer .footer-top{grid-template-columns:1fr}
  .newsletter .container{flex-direction:column;align-items:flex-start}
  .newsletter-form{width:100%}
  .newsletter-form input{min-width:0;flex:1}
  .article-list .article-row{grid-template-columns:1fr;gap:.6rem}
  .article-actions{flex-direction:row;align-items:center}
  .legal-bar .container{flex-direction:column;align-items:flex-start}
}

@media (max-width:480px){
  .cacs-network-map{border-radius:14px}
  .partner-chip-light{flex-basis:100%}
  .footer-policies-grid{grid-template-columns:1fr}
}
