/* ==========================================================================
   Growth Strategy — "The Terrain". Page base layer (.cgs-*).
   Data-journalism on light paper: fine survey grid, charts drawn in code, mono field
   annotations. Tokens from core.css only. Section styles: assets/css/brand/growth-strategy/<id>.css
   ========================================================================== */
.cgs{
  --cgs-grid:linear-gradient(var(--line-2) 1px,transparent 1px),linear-gradient(90deg,var(--line-2) 1px,transparent 1px);
  --cgs-grid-s:24px 24px;
  --cgs-head-mb:clamp(44px,5.4vw,80px);
  --cgs-hero-t:clamp(136px,16vh,196px);
  --cgs-sticky:clamp(96px,12vh,128px);
  overflow-x:clip;
}
.cgs :focus-visible{outline:2px solid var(--blue);outline-offset:3px}

/* survey paper: a fine grid that fades at the edges */
.cgs-survey{position:absolute;inset:0;pointer-events:none;background-image:var(--cgs-grid);background-size:var(--cgs-grid-s);mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 78%);-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 78%);opacity:.9}

/* section head — a field-survey header: index number + eyebrow over the heading, lead aside */
.cgs-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(20px,2.4vw,32px);row-gap:20px;align-items:end;margin-bottom:var(--cgs-head-mb)}
.cgs-head__t{grid-column:1 / span 7;display:flex;flex-direction:column;gap:18px;min-width:0}
.cgs-head__t .h2{max-width:19ch}
.cgs-head__l{grid-column:9 / 13;display:flex;flex-direction:column;align-items:flex-start;gap:18px;min-width:0}
.cgs-head__l .lead{max-width:46ch}
.cgs-head--solo .cgs-head__t{grid-column:1 / span 8}
.cgs-eye{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);line-height:1.2}
.cgs-eye b{font-weight:500;color:var(--blue)}
.cgs-eye i{font-style:normal;width:28px;height:1px;background:var(--line-3)}
@media (max-width:900px){
  .cgs-head{grid-template-columns:minmax(0,1fr)}
  .cgs-head__t,.cgs-head__l,.cgs-head--solo .cgs-head__t{grid-column:1 / -1}
}

/* mono annotation text used across the charts */
.cgs-note{font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);line-height:1.4}
/* the visible "Illustrative" stamp on any made-up figure */
.cgs-illus{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border:1px dashed var(--line-3);border-radius:var(--r-xs);font-family:var(--f);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:var(--paper);line-height:1;white-space:nowrap}
.cgs-illus::before{content:"";width:5px;height:5px;border-radius:50%;border:1px solid var(--muted)}

/* documentary photo frame: square-cornered print with a caption line underneath */
.cgs-photo{position:relative;margin:0;overflow:hidden;border-radius:var(--r-sm);background:var(--paper-4);max-width:100%}
.cgs-photo img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(.35) contrast(1.02)}
.cgs-cap{margin-top:10px;font-family:var(--f);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);line-height:1.5}

@media (prefers-reduced-motion:reduce){
  .cgs *,.cgs *::before,.cgs *::after{transition-duration:0s;animation-duration:0s;animation-iteration-count:1}
}