/* =============================================================================
   Chiratae Ventures — main stylesheet
   Plain, hand-authored CSS. No build step, no framework dependency.
   Brand tokens (fonts, colours) match the original site exactly —
   only structure, spacing and implementation are new.
   ============================================================================= */

:root{
  /* brand — unchanged from the original site */
  --red:#B0232F;
  --red-dark:#8f1c26;
  --ink:#151515;
  --text:#5b5b5b;
  --text-soft:#7a7a7a;
  --line:#e7e7e7;
  --bg-alt:#f7f7f7;
  --white:#ffffff;

  /* type — Buttler (display) + Inter (body). Syne has been removed sitewide;
     --font-accent now just points at Inter so every existing rule that used
     it (eyebrows, stat numbers, tags, dates) keeps working unchanged. */
  --font-display:'Buttler','Playfair Display',Georgia,serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --font-accent:var(--font-body);

  --container:1200px;
  --radius:0;
  --shadow-1:0 1px 2px rgba(0,0,0,.05), 0 4px 12px rgba(0,0,0,.05);
  --shadow-2:0 4px 10px rgba(0,0,0,.08), 0 24px 56px rgba(0,0,0,.12);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body{
  margin:0;
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.7;
  color:var(--text);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block }
a{ color:inherit; text-decoration:none }
ul{ margin:0; padding:0; list-style:none }
button{ font:inherit; background:none; border:0; cursor:pointer; color:inherit }

h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--ink);
  font-weight:400;
  line-height:1.1;
  margin:0 0 .4em;
}
h1{ font-size:clamp(2.4rem,5.4vw,4.6rem); letter-spacing:-.01em }
h2{ font-size:clamp(1.8rem,3.2vw,2.6rem) }
h3{ font-size:clamp(1.2rem,1.8vw,1.5rem) }
p{ margin:0 0 1em }
p:last-child{ margin-bottom:0 }

.container{ max-width:var(--container); margin-inline:auto; padding-inline:24px }
.section{ padding-block:clamp(48px,6vw,88px) }
.section--alt{ background:var(--bg-alt) }
.section-head{ max-width:640px; margin-bottom:clamp(28px,3vw,44px) }
.section-head--center{ margin-inline:auto; text-align:center }
.eyebrow{
  display:block;
  font-family:var(--font-accent);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:12px;
}

/* ---------------------------------------------------------------- buttons -- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 30px;
  border-radius:0;
  font-weight:600;
  font-size:.86rem;
  letter-spacing:.03em;
  text-transform:uppercase;
  transition:transform .28s var(--ease), box-shadow .28s var(--ease), background .25s ease, color .25s ease;
}
.btn--primary{ background:var(--red); color:#fff }
.btn--primary:hover{ background:var(--red-dark); transform:translateY(-2px); box-shadow:var(--shadow-2) }
.btn--outline{ border:1.5px solid var(--ink); color:var(--ink) }
.btn--outline:hover{ background:var(--ink); color:#fff }

/* ----------------------------------------------------------------- header -- */
.site-header{
  position:sticky; top:0; z-index:500;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--line);
}
.announce{
  background:var(--red); color:#fff; text-align:center;
  font-size:.82rem; padding:9px 16px;
}
.announce a{ text-decoration:underline; font-weight:600 }
.nav{
  display:flex; align-items:center; justify-content:space-between;
  height:76px; gap:24px;
}
.nav-logo img{ height:40px; width:auto }
.nav-list{ display:flex; align-items:center; gap:clamp(10px,1.4vw,22px) }
.nav-list > li{ position:relative }
.nav-list a{
  display:inline-block; padding:10px 2px; font-size:.86rem; font-weight:500;
  color:var(--ink); position:relative; white-space:nowrap;
}
.nav-list > li > a::after{
  content:''; position:absolute; left:0; bottom:4px; height:1.5px; width:0;
  background:var(--red); transition:width .3s var(--ease);
}
.nav-list > li:hover > a::after{ width:100% }
.nav-drop{
  position:absolute; top:100%; left:0; min-width:200px;
  background:#fff; border:1px solid var(--line); border-radius:0;
  box-shadow:var(--shadow-2); padding:8px; margin-top:10px;
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .22s ease, transform .22s ease, visibility .22s;
}
.nav-list > li:hover .nav-drop{ opacity:1; visibility:visible; transform:none }
.nav-drop a{ display:block; padding:9px 12px; border-radius:0; font-size:.84rem }
.nav-drop a:hover{ background:var(--bg-alt); color:var(--red) }
.nav-cta{ display:flex; align-items:center; gap:16px }
.nav-toggle{ display:none; padding:8px }

@media (max-width:980px){
  .nav-list, .nav-cta .btn{ display:none }
  .nav-toggle{ display:block }
}

/* mobile drawer */
.drawer{
  position:fixed; inset:0 0 0 auto; width:min(340px,86vw); background:#fff;
  transform:translateX(100%); transition:transform .35s var(--ease);
  z-index:800; padding:26px; overflow-y:auto; box-shadow:-14px 0 40px rgba(0,0,0,.15);
}
.drawer.is-open{ transform:none }
.drawer-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:22px }
.drawer-close{ font-size:1.8rem; line-height:1 }
.drawer nav a{ display:block; padding:12px 0; border-bottom:1px solid var(--line); font-weight:500 }
.drawer-sub{ padding-left:14px }
.drawer-sub a{ font-size:.9rem; color:var(--text-soft); border-bottom:none; padding:8px 0 }
.scrim{
  position:fixed; inset:0; background:rgba(0,0,0,.4);
  opacity:0; visibility:hidden; transition:.3s; z-index:700;
}
.scrim.is-open{ opacity:1; visibility:visible }

/* ------------------------------------------------------------------- hero -- */
.hero{ padding-block:clamp(48px,7vw,96px) clamp(16px,2vw,32px); text-align:center }
.hero h1{ max-width:16ch; margin-inline:auto }
.hero .btn{ margin-top:22px }
.hero-lede{ max-width:52ch; margin:14px auto 0; font-size:1.05rem }

/* --------------------------------------------------------- founder marquee -- */
.marquee{ width:100%; overflow:hidden; padding-block:clamp(16px,2vw,26px); position:relative }
.marquee::before,.marquee::after{
  content:''; position:absolute; top:0; bottom:0; width:min(120px,10vw); z-index:2; pointer-events:none;
}
.marquee::before{ left:0; background:linear-gradient(to right,#fff,transparent) }
.marquee::after{ right:0; background:linear-gradient(to left,#fff,transparent) }
.marquee-track{
  display:flex; gap:20px; width:max-content;
  animation:marquee-scroll 50s linear infinite;
}
.marquee-track:hover{ animation-play-state:paused }
@keyframes marquee-scroll{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* full-bleed overlay card — photo fills the card, name/logo sit on a bottom
   gradient scrim (same recipe as the Team, Spotlight and News overlay cards). */
.founder-card{
  position:relative; flex:0 0 auto; width:280px; aspect-ratio:4/5;
  border-radius:0; overflow:hidden; box-shadow:var(--shadow-1);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.founder-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2) }
.founder-photo{ position:absolute; inset:0; overflow:hidden; background:#eee }
.founder-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease) }
.founder-card:hover .founder-photo img{ transform:scale(1.04) }
.founder-info{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.78) 100%);
}
.founder-name{ font-size:.8rem; font-weight:600; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
/* A white chip rather than an invert filter: some of these logo PNGs are
   transparent cutouts, others are flat opaque rectangles with a baked-in
   white fill — inverting made the opaque ones vanish into a blank white
   block. A white background behind all of them renders correctly either way. */
/* fixed 92x32 chip — 8px of horizontal breathing room on each side, and the
   logo itself scales via object-fit:contain to whichever of that inner
   76x32 area it hits first (max height or max width), never cropped or
   stretched, regardless of the source logo's own aspect ratio. */
.founder-logo{
  width:92px; height:32px; padding:0 8px; box-sizing:border-box; flex:0 0 auto;
  object-fit:contain; background:#fff; border-radius:0; box-shadow:0 1px 3px rgba(0,0,0,.25);
}

/* ------------------------------------------------------------------ stats --
   Sits inside the page's normal centred .container like every other
   section (no longer a full-bleed 100vw breakout). */
.stats{
  display:grid; grid-template-columns:repeat(6,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:0; overflow:hidden;
}
/* same 92:32 rectangle as .founder-logo/.unicorn-logo, kept only as a
   starting point — min-height/min-width per breakpoint below are the real
   floor, so the box never gets so flat the number/label get cramped, even
   though the row is now full-bleed and each column is much wider. */
.stat{
  background:#fff; padding:8px 12px; box-sizing:border-box; text-align:center;
  aspect-ratio:92/32; min-height:56px; min-width:120px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.stat-num{ font-family:var(--font-accent); font-weight:700; color:var(--ink); line-height:1.1; font-size:1.1rem }
.stat-label{ margin-top:2px; color:var(--text-soft); line-height:1.2; font-size:.65rem }

/* mobile — phones, <480px: 2 columns */
@media (max-width:480px){
  .stat{ min-height:56px; min-width:120px }
  .stat-num{ font-size:1.1rem }
  .stat-label{ font-size:.65rem }
}
/* pad / tablet — 481-768px: 3 columns */
@media (min-width:481px) and (max-width:768px){
  .stat{ min-height:64px; min-width:140px }
  .stat-num{ font-size:1.35rem }
  .stat-label{ font-size:.7rem }
}
/* small screen / small laptop — 769-1024px: 3 columns */
@media (min-width:769px) and (max-width:1024px){
  .stat{ min-height:76px; min-width:150px }
  .stat-num{ font-size:1.6rem }
  .stat-label{ font-size:.76rem }
}
/* desktop — 1025-1439px: 6 columns */
@media (min-width:1025px) and (max-width:1439px){
  .stat{ min-height:88px; min-width:165px }
  .stat-num{ font-size:1.85rem }
  .stat-label{ font-size:.8rem }
}
/* large screens — 1440px+: 6 columns, roomiest */
@media (min-width:1440px){
  .stat{ min-height:100px; min-width:185px }
  .stat-num{ font-size:2.1rem }
  .stat-label{ font-size:.85rem }
}

/* ------------------------------------------------------------------ cards -- */
.grid{ display:grid; gap:24px }
.grid-3{ grid-template-columns:repeat(3,1fr) }
.card{
  display:flex; flex-direction:column; text-align:left; color:inherit; text-decoration:none;
  border-radius:0; overflow:hidden; background:#fff;
  border:1px solid var(--line); box-shadow:var(--shadow-1);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:rgba(0,0,0,.15) }
.card-media{ position:relative; aspect-ratio:16/9.5; overflow:hidden; background:var(--bg-alt) }
.card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease) }
.card:hover .card-media img{ transform:scale(1.05) }
/* programs: proportional scaling */
.program-card .card-media{ aspect-ratio:auto }
.program-card .card-media img{ height:auto }
.card-body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1 }
.card-body h3{
  font-size:1.02rem; line-height:1.38; margin:0 0 10px; color:var(--ink); font-weight:600;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card-body p{
  font-size:.88rem; line-height:1.5; color:var(--text-soft); margin:0 0 16px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; flex:1;
}
.card-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px }
.card-link{
  font-family:var(--font-accent); font-size:.78rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--red);
  display:inline-flex; align-items:center; gap:4px; margin-top:auto;
}
.card:hover .card-link{ color:var(--red-dark) }

/* advisory spotlight — full-bleed overlay card, same recipe as founder-card */
.spotlight-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px }
.spotlight{
  position:relative; aspect-ratio:3/4;
  border-radius:0; overflow:hidden; box-shadow:var(--shadow-1);
}
.spotlight-photo{ position:absolute; inset:0 }
.spotlight-photo img{ width:100%; height:100%; object-fit:cover }
.spotlight-info{
  position:absolute; left:0; right:0; bottom:0; padding:18px;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.8) 100%);
}
.spotlight-role{
  display:block; font-family:var(--font-accent); font-size:.7rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.8);
}
.spotlight-name{ font-family:var(--font-display); font-weight:400; font-size:1.2rem; color:#fff; margin-top:4px }

/* ----------------------------------------------------------------- footer -- */
.site-footer{ background:var(--ink); color:#a8a8a8; padding-block:56px 24px; font-size:.88rem }
.footer-grid{ display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:32px; margin-bottom:40px }
.footer-brand img{ height:34px; margin-bottom:14px; filter:brightness(0) invert(1) }
.footer-col h4{ color:#fff; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px }
.footer-col a{ display:block; padding:6px 0; color:#a8a8a8 }
.footer-col a:hover{ color:#fff }
.socials{ display:flex; gap:10px; margin-top:16px }
.socials a{
  width:34px; height:34px; border:1px solid #333; border-radius:0;
  display:grid; place-items:center; transition:.25s;
}
.socials a:hover{ background:var(--red); border-color:var(--red) }
.footer-bottom{ border-top:1px solid #2a2a2a; padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px }

/* ------------------------------------------------------------- utilities -- */
/* a slower, gentler deceleration than the UI-wide --ease (built for quick
   hover/press feedback) — dedicated to viewport reveals so they read as a
   slow, soft drift into place rather than a snappy UI transition. */
:root{
  --ease-reveal: cubic-bezier(.16,1,.3,1);
}

/* =============================================================================
   HIERARCHICAL SECTION REVEAL SYSTEM (Rhythmic Blank-to-Appearance Viewport Reveal)
   Unrevealed state: completely blank (opacity 0, translated down, softly blurred)
   In-view state: rhythmic cascade, lifting into place with sharp crisp resolution
   Level 1: Eyebrow / Category Tag / Section Label  (Delay: 0.08s)
   Level 2: Main Section Title / Heading (h1, h2)   (Delay: 0.38s)
   Level 3: Subtitle / Lede Paragraph / Copy        (Delay: 0.68s)
   Level 4: Action Buttons / Filter Tabs / Controls (Delay: 0.98s)
   Level 5: Cards / Grid Items / Stats / Unicorns   (Delay: 1.15s - 2.8s+ sequential stagger)
   ============================================================================= */

/* Base single element reveal: completely blank until in viewport */
.reveal {
  opacity: 0;
  transform: translateY(38px) scale(0.97);
  filter: blur(4px);
  transition: opacity 1s var(--ease-reveal), transform 1s var(--ease-reveal), filter 1s var(--ease-reveal);
  will-change: opacity, transform, filter;
}
.reveal.is-in {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

/* Hero hierarchy: eyebrow -> title -> lede -> actions */
.hero > .eyebrow,
.hero > h1,
.hero > .hero-lede,
.hero > p,
.hero > .btn,
.hero > .hero-actions,
.hero > .media-hero-stats,
.companies-hero .companies-hero-copy > .eyebrow,
.companies-hero .companies-hero-copy > h1,
.companies-hero .companies-hero-copy > p {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 1.1s var(--ease-reveal), transform 1.1s var(--ease-reveal);
  will-change: opacity, transform;
}
.hero.is-in > .eyebrow,
.companies-hero.is-in .companies-hero-copy > .eyebrow { transition-delay: .06s; }
.hero.is-in > h1,
.companies-hero.is-in .companies-hero-copy > h1 { transition-delay: .22s; }
.hero.is-in > .hero-lede,
.hero.is-in > p,
.companies-hero.is-in .companies-hero-copy > p { transition-delay: .38s; }
.hero.is-in > .btn,
.hero.is-in > .hero-actions,
.hero.is-in > .media-hero-stats { transition-delay: .54s; }
.hero.is-in > .eyebrow,
.hero.is-in > h1,
.hero.is-in > .hero-lede,
.hero.is-in > p,
.hero.is-in > .btn,
.hero.is-in > .hero-actions,
.hero.is-in > .media-hero-stats,
.companies-hero.is-in .companies-hero-copy > .eyebrow,
.companies-hero.is-in .companies-hero-copy > h1,
.companies-hero.is-in .companies-hero-copy > p {
  opacity: 1;
  transform: translateY(0);
}

/* Section-head hierarchy */
.section-head > .eyebrow,
.section-head > h2,
.section-head > p {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 1.1s var(--ease-reveal), transform 1.1s var(--ease-reveal);
  will-change: opacity, transform;
}
.section-head.is-in > .eyebrow { transition-delay: .06s; }
.section-head.is-in > h2 { transition-delay: .24s; }
.section-head.is-in > p { transition-delay: .42s; }
.section-head.is-in > .eyebrow,
.section-head.is-in > h2,
.section-head.is-in > p {
  opacity: 1;
  transform: translateY(0);
}

/* Section controls (tabs, filters, view toggles) */
.team-tabs.reveal,
.company-filters.reveal,
.view-toggle.reveal,
.companies-toolbar.reveal,
.media-toolbar.reveal,
.news-year-wrap.reveal,
.press-year-wrap.reveal {
  opacity: 0;
  transform: translateY(22px);
  filter: none;
  transition: opacity 1.05s var(--ease-reveal), transform 1.05s var(--ease-reveal);
  transition-delay: .6s;
}
.team-tabs.reveal.is-in,
.company-filters.reveal.is-in,
.view-toggle.reveal.is-in,
.companies-toolbar.reveal.is-in,
.media-toolbar.reveal.is-in,
.news-year-wrap.reveal.is-in,
.press-year-wrap.reveal.is-in {
  opacity: 1;
  transform: translateY(0);
}

/* Revealed via a keyframe animation (not a transition): card-specific rules
   defined later (hover lift, shadow) redefine `transition` and were silently
   dropping the opacity transition, so cards snapped to opacity 1 instantly
   and only appeared to slide up. An animation can't be overridden that way,
   and `backwards` fill keeps the from-state during the stagger delay. */
@keyframes reveal-in {
  from { opacity: 0; transform: translateY(38px) scale(0.97); filter: blur(4px); }
  to   { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
.reveal-group > *.is-in,
.grid-team > *.is-in,
.grid-programs > *.is-in,
.grid-reports > *.is-in,
.grid-companies > *.is-in,
.grid-3 > *.is-in,
.grid-media > *.is-in,
.stats > *.is-in,
.unicorn-logos > *.is-in,
.spotlight-grid > *.is-in,
.news-panel > *.is-in,
.press-panel > *.is-in,
.news-item.is-in,
.press-item.is-in,
.team-card.is-in,
.company-card.is-in,
.program-card.is-in,
.report-card.is-in,
.article-card.is-in,
.video-card.is-in,
.card-3.is-in,
.card.is-in,
.stat-item.is-in,
.spotlight-card.is-in,
.media-card.is-in,
.media-stat-box.is-in {
  opacity: 1;
  transform: none;
  filter: none;
  animation: reveal-in .9s var(--ease-reveal) var(--reveal-delay, 0s) backwards;
}

/* NOTE: there used to be a `.grid-programs:not(.is-in) > *, ...{ transition-
   delay:0s }` reset block here. Items in these grids are observed and
   revealed individually (main.js adds .is-in straight to each item, never
   to the parent), so the parent's `:not(.is-in)` condition was always true
   — that rule was unconditionally forcing every grid item's transition-
   delay to 0s, silently cancelling the stagger set via --reveal-delay for
   every grid on the site (team, companies, programs, reports, stats,
   unicorn logos, spotlight). Removed rather than fixed forward, since
   nothing in the current architecture ever puts these parents in a
   genuine "not revealed yet, please reset" state. */

@media (prefers-reduced-motion:reduce){
  .hero > .eyebrow, .hero > h1, .hero > .hero-lede, .hero > p, .hero > .btn, .hero > .hero-actions,
  .section-head > .eyebrow, .section-head > h2, .section-head > p,
  .team-tabs.reveal, .company-filters.reveal, .view-toggle.reveal,
  .reveal, .reveal-group > *, .grid-team > *, .grid-programs > *, .grid-reports > *, .grid-3 > *, .stats > *, .unicorn-logos > *, .spotlight-grid > * {
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* .stats column counts follow the 5-tier breakpoint scheme defined with the
   rest of the .stat sizing above (mobile/tablet/small-screen/desktop/large),
   not this section's other max-width:860/600 breaks. */
@media (max-width:1024px){ .stats{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:480px){ .stats{ grid-template-columns:1fr 1fr } }

@media (max-width:860px){
  .footer-grid{ grid-template-columns:1fr 1fr }
  .grid-3{ grid-template-columns:1fr 1fr }
  .spotlight-grid{ grid-template-columns:repeat(2,1fr) }
}
@media (max-width:600px){
  .grid-3{ grid-template-columns:1fr }
  .footer-grid{ grid-template-columns:1fr }
  .spotlight-grid{ grid-template-columns:1fr }
  .spotlight{ max-width:320px; margin-inline:auto }
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important }
  .reveal, .reveal-group > *{ opacity:1; transform:none }
}

/* ------------------------------------------------------------- unicorn logos -- */
.unicorn-logos{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:clamp(28px,3vw,44px);
}
/* same 92:32 rectangle as .founder-logo, just scaled up responsively to the
   grid column's own width (via aspect-ratio instead of a fixed px size) —
   same 8px-minimum side padding, same contain-fit logo sizing. */
.unicorn-logo{
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:92/32; padding:8px; box-sizing:border-box;
  background:#fff; border:1px solid var(--line); border-radius:0;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.unicorn-logo:hover{ transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:transparent }
.unicorn-logo img{
  max-width:100%; max-height:100%; width:auto; height:auto;
  object-fit:contain; filter:grayscale(1) opacity(.75);
  transition:filter .3s ease;
}
.unicorn-logo:hover img{ filter:none }
@media (max-width:860px){ .unicorn-logos{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:600px){ .unicorn-logos{ grid-template-columns:repeat(2,1fr) } }

/* --------------------------------------------------------- program icons -- */
.grid-programs{ grid-template-columns:repeat(3,1fr) }
/* full-bleed overlay card — same recipe as founder-card, spotlight and
   news-item: image fills the card, heading + copy sit on a bottom scrim. */
.program-card{
  position:relative; display:block; aspect-ratio:1/1; text-align:left;
  border-radius:0; overflow:hidden; background:#F7F3EC;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.program-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-2) }
.program-card .card-media{ position:absolute; inset:0; background:#F7F3EC; overflow:hidden }
.program-card .card-media img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; transition:transform .5s var(--ease) }
.program-card:hover .card-media img{ transform:scale(1.045) }
/* solid brand-cream panel, not a dark gradient — keeps the image fully
   visible above it instead of fading it out under a black scrim. */
.program-card .card-body{
  position:absolute; left:0; right:0; bottom:0; z-index:2; padding:16px 20px 20px;
  background:#F7F3EC;
}
.program-card h3{ color:var(--red); font-size:1.15rem; margin-bottom:4px }
.program-card p{
  color:var(--text); margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
@media (max-width:860px){ .grid-programs{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:600px){ .grid-programs{ grid-template-columns:1fr } }

/* ================================================================= about-us == */
.text-red{ color:var(--red); font-style:normal }

.about-hero{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,60px); align-items:center }
.about-hero-media img{ border-radius:0; box-shadow:var(--shadow-2) }
.about-hero-copy p{ font-size:1.02rem }

.about-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,60px); align-items:center }
.about-split--reverse .about-split-media{ order:2 }
.about-split-media img{ border-radius:0; box-shadow:var(--shadow-1); width:100% }
.about-split-copy h2{ margin-bottom:22px }

.stats--4{ grid-template-columns:repeat(4,1fr) }
.stats--4 .stat{ padding:20px 14px }
.stats--4 .stat-num{ font-size:clamp(1.5rem,2.4vw,2.1rem) }

.sector-cloud{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:14px 22px; max-width:820px; margin-inline:auto; text-align:center;
}
.sector-tag{
  font-family:var(--font-accent); font-weight:700; color:var(--ink);
  font-size:1.1rem; letter-spacing:.01em;
}
.sector-tag--sm{ font-size:.9rem; color:var(--text-soft) }
.sector-tag--lg{ font-size:1.5rem }
.sector-tag--xl{ font-size:2rem; color:var(--red) }
.sector-tag a{ color:inherit }
.sector-tag a:hover{ color:var(--red); text-decoration:underline }

.about-cta{ text-align:center; margin-top:clamp(28px,3vw,40px) }

.impact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:24px }
.impact-item{
  background:#fff; border:1px solid var(--line); border-radius:0;
  padding:14px 12px; text-align:center; font-size:.86rem; font-weight:600; color:var(--ink);
}

.video-embed{ position:relative; width:100%; aspect-ratio:16/9; border-radius:0; overflow:hidden; box-shadow:var(--shadow-2) }
.video-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0 }

.table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius) }
.statutory-table{ width:100%; border-collapse:collapse; font-size:.88rem; min-width:640px }
.statutory-table th{
  text-align:left; background:var(--bg-alt); color:var(--ink); font-weight:700;
  padding:14px 18px; border-bottom:1px solid var(--line); white-space:nowrap;
}
.statutory-table td{ padding:14px 18px; border-bottom:1px solid var(--line); vertical-align:top }
.statutory-table tr:last-child td{ border-bottom:0 }
.table-sub{ display:block; font-size:.78rem; color:var(--text-soft) }

@media (max-width:860px){
  .about-hero,.about-split{ grid-template-columns:1fr }
  .about-split--reverse .about-split-media{ order:0 }
  .stats--4{ grid-template-columns:1fr 1fr }
  .impact-grid{ grid-template-columns:1fr 1fr }
}
@media (max-width:600px){
  .impact-grid{ grid-template-columns:1fr }
}

/* ===================================================================== team == */
.team-tabs{
  display:flex; flex-wrap:wrap; gap:10px; justify-content:center;
  margin-bottom:clamp(28px,3vw,40px);
}
.team-tab{
  padding:11px 24px; border-radius:0; border:1.5px solid var(--line);
  font-size:.86rem; font-weight:600; color:var(--text-soft);
  transition:.25s;
}
.team-tab:hover{ border-color:var(--red); color:var(--red) }
.team-tab.is-active{ background:var(--red); border-color:var(--red); color:#fff }

.team-panel{ display:none }
.team-panel.is-active{ display:block }

.grid-team{
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
@media (max-width: 1080px){
  .grid-team{ grid-template-columns:repeat(3,1fr); gap:18px; }
}
@media (max-width: 720px){
  .grid-team{ grid-template-columns:repeat(2,1fr); gap:14px; }
}
@media (max-width: 480px){
  .grid-team{ grid-template-columns:1fr; gap:14px; }
}

.team-card{
  position:relative;
  aspect-ratio:3/4;
  border-radius:0;
  overflow:hidden;
  background:#1e1e1e;
  box-shadow:var(--shadow-1);
  border:1px solid rgba(0,0,0,0.06);
  cursor:pointer;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:flex-start;
  text-align:left;
  padding:20px 18px;
  width:100%;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.team-card::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(10,10,10,.45) 60%, rgba(10,10,10,.92) 100%);
  pointer-events:none;
  z-index:1;
  transition:background .35s var(--ease);
}
.team-card:not(.team-card--static):hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-2);
  border-color:rgba(187,19,42,0.35);
}
.team-card:not(.team-card--static):hover::after{
  background:linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(10,10,10,.5) 55%, rgba(10,10,10,.96) 100%);
}
.team-card--static{ cursor:default; }

.team-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border-radius:0;
  margin:0;
  background:#f3efe8;
  z-index:0;
}
.team-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
  display:block;
  transition:transform .5s var(--ease);
}
.team-card:hover .team-photo img{
  transform:scale(1.06);
}

.team-title{
  position:relative;
  z-index:2;
  font-family:var(--font-accent, ui-sans-serif, system-ui);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:rgba(255,255,255,.82);
  line-height:1.35;
  margin-bottom:2px;
  display:block;
  order:1;
}

.team-name{
  position:relative;
  z-index:2;
  font-family:var(--font-display);
  font-weight:400;
  font-size:1.24rem;
  color:#fff;
  line-height:1.22;
  margin:0;
  display:block;
  order:2;
}

.regional-heading{ margin:clamp(32px,4vw,48px) 0 20px; text-align:center }

.team-modal-backdrop{
  position:fixed; inset:0; background:rgba(12,8,8,.6); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); z-index:900;
  opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s;
}
.team-modal-backdrop.is-open{ opacity:1; visibility:visible }

/* full-width, two-column "dossier" popup — a fixed photo panel on the left,
   scrollable content on the right — rather than the old small centred card. */
.team-modal{
  display:none; position:fixed; z-index:901; top:50%; left:50%;
  transform:translate(-50%,-50%) scale(.95); width:min(1040px,94vw); height:min(660px,88vh);
  overflow:hidden; background:#fff; border-radius:0; box-shadow:0 50px 100px -25px rgba(0,0,0,.4), 0 0 0 1px rgba(0,0,0,.04);
  opacity:0; transition:opacity .4s var(--ease-reveal), transform .4s var(--ease-reveal);
}
.team-modal.is-open{ display:grid; grid-template-columns:380px 1fr; opacity:1; transform:translate(-50%,-50%) scale(1) }
.team-modal-close{
  position:absolute; top:18px; right:18px; z-index:5; width:40px; height:40px; border-radius:0;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem; line-height:1;
  background:rgba(255,255,255,.92); color:var(--ink); box-shadow:var(--shadow-1);
  transition:background .25s ease, color .25s ease, transform .3s var(--ease);
}
.team-modal-close:hover{ background:var(--red); color:#fff; transform:rotate(90deg) }
.team-modal-photo{
  position:relative; width:100%; height:100%; margin:0; overflow:hidden;
  background:linear-gradient(165deg, var(--ink) 0%, #3a1015 130%);
}
.team-modal-photo img{ width:100%; height:100%; object-fit:cover }
.team-modal-photo::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg, rgba(0,0,0,.4) 0%, transparent 45%);
}
.team-modal-body{ overflow-y:auto; padding:clamp(30px,4vw,52px); text-align:left }
.team-modal-body h3{ font-size:1.7rem; margin-bottom:4px }
.team-modal-title{ color:var(--red); font-weight:600; font-size:.9rem; margin-bottom:22px }
.team-modal-quote{
  position:relative; font-family:var(--font-display); font-size:1.3rem; line-height:1.4;
  color:var(--ink); border:0; padding:6px 0 6px 32px; margin:0 0 24px; max-width:52ch;
}
.team-modal-quote::before{
  content:'\201C'; position:absolute; left:0; top:-4px; font-family:var(--font-display);
  font-size:2.8rem; line-height:1; color:var(--red); opacity:.55;
}
.team-modal-bio{ text-align:left; font-size:.94rem; line-height:1.7 }
.team-modal-bio p{ margin-bottom:14px }
.team-modal-social{ display:flex; gap:10px; justify-content:flex-start; flex-wrap:wrap; margin-top:26px }
.team-modal-social a{
  font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink); padding:9px 18px; border-radius:0; border:1.5px solid var(--line);
  transition:background .22s ease, color .22s ease, border-color .22s ease;
}
.team-modal-social a:hover{ background:var(--red); border-color:var(--red); color:#fff }
@media (max-width:760px){
  .team-modal{ width:94vw; height:90vh; border-radius:0 }
  .team-modal.is-open{ grid-template-columns:1fr; grid-template-rows:220px 1fr }
  .team-modal-photo::after{ background:linear-gradient(0deg, rgba(0,0,0,.25) 0%, transparent 60%) }
}

/* ================================================================ companies == */
.companies-hero{
  position:relative; display:flex; align-items:center; justify-content:space-between; gap:40px;
  padding-block:clamp(40px,6vw,72px) clamp(20px,3vw,32px); text-align:left;
}
.companies-hero-copy{ max-width:520px; position:relative; z-index:2 }
.companies-hero-copy h1{ margin-bottom:14px; max-width:14ch }
.companies-hero-art{ position:absolute; right:0; top:50%; transform:translateY(-50%); width:420px; height:420px; max-width:38vw; pointer-events:none }
.companies-hero-blob{ position:absolute; inset:0; border-radius:0; background:radial-gradient(circle at 35% 35%, rgba(176,35,47,.14), rgba(176,35,47,.05) 55%, transparent 72%) }
.companies-hero-blob::before{ content:''; position:absolute; inset:15%; border-radius:0; border:1px solid rgba(176,35,47,.25) }
.companies-hero-dot{ position:absolute; top:16%; left:62%; width:12px; height:12px; border-radius:0; background:var(--red) }
.companies-hero-doodle{
  position:absolute; top:4%; right:6%; font-family:var(--font-display); font-style:italic; font-size:1.2rem;
  color:var(--red); line-height:1.25; text-align:right; transform:rotate(-6deg); white-space:nowrap;
}
@media (max-width:860px){
  .companies-hero{ flex-direction:column; align-items:flex-start; text-align:left }
  .companies-hero-art{ display:none }
}

.companies-toolbar{
  display:flex; align-items:center; justify-content:center; gap:16px;
  margin-bottom:clamp(20px,2vw,28px); flex-wrap:wrap;
}
.companies-search{ flex:1 1 auto; min-width:240px; max-width:480px; margin:0 }
.companies-search input{
  width:100%; padding:14px 20px; border-radius:0; border:1.5px solid var(--line);
  font:inherit; font-size:.94rem; color:var(--ink);
}
.companies-search input:focus{ outline:none; border-color:var(--red) }

.view-toggle{ display:flex; gap:4px; background:var(--bg-alt); border-radius:0; padding:4px; flex:0 0 auto }
.view-toggle-btn{
  display:flex; align-items:center; gap:6px; padding:9px 16px; border-radius:0;
  font-size:.82rem; font-weight:600; color:var(--text-soft); transition:.25s;
}
.view-toggle-btn:hover{ color:var(--ink) }
.view-toggle-btn.is-active{ background:var(--red); color:#fff; box-shadow:var(--shadow-1) }
.view-toggle-btn svg{ flex:0 0 auto }
@media (max-width:600px){
  .companies-toolbar{ flex-direction:column; align-items:stretch }
  .companies-search{ flex:0 0 auto; max-width:none; min-width:0 }
  .view-toggle{ justify-content:center }
}

.company-filters{
  display:flex; flex-wrap:wrap; gap:8px; justify-content:center;
  margin-bottom:clamp(28px,3vw,40px);
}
.company-filter{
  padding:9px 18px; border-radius:0; border:1.5px solid var(--line);
  font-size:.8rem; font-weight:600; color:var(--text-soft); white-space:nowrap;
  transition:.25s;
}
.company-filter:hover{ border-color:var(--red); color:var(--red) }
.company-filter.is-active{ background:var(--red); border-color:var(--red); color:#fff }

.company-empty{ text-align:center; color:var(--text-soft); padding:40px 0 }

/* bento grid: most cards are 1 column, every 8th is a "feature" card spanning
   2 — combined with the grid's natural wrapping this is what produces rows
   that read as 3, 4 or 2 cards depending on where the wide ones land. */
.grid-companies{ grid-template-columns:repeat(4,1fr) }
.grid-companies .company-card:nth-of-type(8n+1){ grid-column:span 2 }
.company-card{
  position:relative; display:flex; flex-direction:column; border-radius:0;
  border:1px solid var(--line); background:#fff; overflow:hidden;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.company-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:transparent }
.company-card-arrow{
  position:absolute; right:14px; bottom:14px; z-index:2; width:36px; height:36px; border-radius:0;
  background:#fff; box-shadow:var(--shadow-1); color:var(--red);
  display:flex; align-items:center; justify-content:center;
  transition:background .25s ease, color .25s ease, transform .25s var(--ease);
}
.company-card:hover .company-card-arrow{ background:var(--red); color:#fff; transform:translateX(3px) }

/* companies with a real representative photo instead of a flat logo-colour
   tint — a left-to-right white fade keeps the name/description legible
   while the photo shows through on the right, echoing the reference layout.
   Photos: agrostar-bg.jpg by Jörg Bauer, blowhorn-bg.jpg by Caleb Ruiter —
   both via unsplash.com, free to use under the Unsplash License. */
.company-card--photo{ background-size:cover; background-position:center; min-height:280px }
.company-card--photo::after{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(100deg, #fff 0%, #fff 56%, rgba(255,255,255,.86) 65%, rgba(255,255,255,0) 78%);
}
.company-card--photo .company-card-head,
.company-card--photo .company-body{ position:relative; z-index:1 }
.company-card--photo .company-card-head{ justify-content:flex-start }
.company-card--photo .company-logo img{ background:#fff; border-radius:0; padding:8px 12px; box-shadow:var(--shadow-1); max-height:52px }
/* header row: name + year/place on the left, logo on the right — logos are
   pre-processed to transparent PNGs (background stripped via a flood-fill
   from the source JPG's corners) so they sit cleanly on the card's own
   inline background — a pastel tint sampled from the logo colour. */
.company-card-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
  padding:18px 18px 0;
}
.company-heading{ min-width:0 }
.company-heading h3{ font-size:1rem; margin-bottom:2px }
.company-heading .company-meta{ font-size:.76rem; color:var(--text-soft); margin-bottom:0 }
.company-logo{
  height:auto; display:flex; align-items:center; justify-content:flex-end;
  padding:0; background:transparent; flex:0 0 auto;
}
.company-logo img{ max-width:190px; max-height:64px; object-fit:contain; object-position:right center }
.grid-companies .company-card:nth-of-type(8n+1) .company-logo img{ max-height:80px; max-width:320px }
/* feature cards get a faint topographic contour-line pattern instead of a
   flat tint, for extra richness — echoes the reference's lead card. */
.grid-companies .company-card:nth-of-type(8n+1)::before{
  content:''; position:absolute; z-index:0; pointer-events:none; inset:0;
  background-image:repeating-radial-gradient(circle at 88% 15%, transparent 0, transparent 17px, rgba(15,23,42,.025) 18px, rgba(15,23,42,.025) 19px);
}
.grid-companies .company-card:nth-of-type(8n+1) .company-card-head,
.grid-companies .company-card:nth-of-type(8n+1) .company-body{ position:relative; z-index:1 }

/* every 8th-plus-4 card gets a soft accent blob (colour sampled from its own
   logo) in the corner, so the grid doesn't read as uniformly flat. */
.grid-companies .company-card:nth-of-type(8n+5)::before{
  content:''; position:absolute; z-index:0; pointer-events:none;
  width:62%; aspect-ratio:1/1; right:-18%; bottom:-28%; border-radius:0;
  background:radial-gradient(circle, var(--accent, var(--red)) 0%, transparent 70%);
  opacity:.08;
}
.grid-companies .company-card:nth-of-type(8n+5) .company-card-head,
.grid-companies .company-card:nth-of-type(8n+5) .company-body{ position:relative; z-index:1 }
.company-body{ padding:10px 18px 20px; flex:1 1 auto; display:flex; flex-direction:column }
.company-desc{ font-size:.84rem; margin-bottom:10px; flex:1 1 auto }
.company-tags{ display:flex; flex-wrap:wrap; gap:6px; margin-top:auto }
.company-tags span{
  position:relative; z-index:1;
  font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  color:var(--red); background:rgba(255,255,255,.85); padding:4px 9px; border-radius:0;
}
.company-card--logo-only .company-card-head{ justify-content:center; text-align:center }
.company-card--logo-only .company-body{ text-align:center; align-items:center }

/* fallback for logos with no usable colour (pure black/white/grayscale) —
   a faint dot pattern in brand red instead of a flat tint. */
.company-card--pattern{
  background-color:#FBFBFB;
  background-image:radial-gradient(rgba(176,35,47,.08) 1.5px, transparent 1.5px);
  background-size:14px 14px;
}

/* closing CTA tile, sits at the end of the grid regardless of filtering —
   a soft blush gradient with a minimal mountain-and-sun motif, echoing the
   reference's closing tile rather than a dark block. */
.companies-cta{
  grid-column:span 2; position:relative; overflow:hidden; border-radius:0;
  background:linear-gradient(135deg, #FDE9EA 0%, #F8CDD2 55%, #F3B7BF 100%);
  padding:clamp(26px,4vw,40px); display:flex; flex-direction:column; justify-content:flex-end;
  min-height:220px;
}
.companies-cta::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 260'%3E%3Ccircle cx='330' cy='55' r='30' fill='white' fill-opacity='0.55'/%3E%3Cpath d='M0 260 L110 150 L165 205 L245 105 L400 260 Z' fill='white' fill-opacity='0.32'/%3E%3Cpath d='M120 260 L235 165 L400 260 Z' fill='white' fill-opacity='0.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:bottom right; background-size:75% auto;
}
.companies-cta .eyebrow{ position:relative; color:var(--red-dark); opacity:.85; margin-bottom:10px }
.companies-cta h3{ position:relative; color:var(--ink); font-size:clamp(1.25rem,2vw,1.6rem); margin-bottom:0; max-width:20ch }
.companies-cta-arrow{
  position:absolute; right:22px; bottom:22px; width:44px; height:44px; border-radius:0;
  background:#fff; box-shadow:var(--shadow-1);
  display:flex; align-items:center; justify-content:center; color:var(--red);
  transition:background .25s ease, color .25s ease, transform .25s var(--ease);
}
.companies-cta:hover .companies-cta-arrow{ background:var(--red); color:#fff; transform:translateX(3px) }

@media (max-width:980px){ .grid-companies{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:768px){
  .grid-companies{ grid-template-columns:repeat(2,1fr) }
  .grid-companies .company-card:nth-of-type(8n+1){ grid-column:span 2 }
}
@media (max-width:480px){
  .grid-companies{ grid-template-columns:1fr }
  .grid-companies .company-card:nth-of-type(8n+1){ grid-column:1 }
  .companies-cta{ grid-column:1 }
}

.company-table-wrap{ margin-bottom:clamp(28px,3vw,40px) }
.company-table{ width:100%; border-collapse:collapse; font-size:.88rem; min-width:640px }
.company-table th{
  text-align:left; background:var(--bg-alt); color:var(--ink); font-weight:700;
  padding:12px 16px; border-bottom:1px solid var(--line); white-space:nowrap;
  font-size:.78rem; text-transform:uppercase; letter-spacing:.04em;
}
.company-table td{ padding:12px 16px; border-bottom:1px solid var(--line); vertical-align:middle }
.company-table tr:last-child td{ border-bottom:0 }
.company-table tr:hover td{ background:var(--bg-alt) }
.company-table-name{ display:flex; align-items:center; gap:10px; font-weight:700; color:var(--ink); white-space:nowrap }
.company-table-logo{ width:32px; height:32px; border-radius:0; background:var(--bg-alt); display:flex; align-items:center; justify-content:center; overflow:hidden; flex:0 0 auto }
.company-table-logo img{ max-width:100%; max-height:100%; object-fit:contain }
.company-table-desc{ color:var(--text-soft); max-width:420px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.company-table-sector{
  font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  color:var(--red); background:rgba(176,35,47,.08); padding:4px 9px; border-radius:0; white-space:nowrap;
}
.company-table-more{
  font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  color:var(--red); white-space:nowrap;
}
.company-table-more:hover{ color:var(--red-dark) }
.company-table-more:disabled{ color:var(--line); cursor:default }

button.company-card{ font:inherit; text-align:left; width:100%; cursor:pointer }

.company-modal-backdrop{
  position:fixed; inset:0; background:rgba(12,8,8,.6); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); z-index:900;
  opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s;
}
.company-modal-backdrop.is-open{ opacity:1; visibility:visible }

/* full-width, two-column popup — a colour panel (tinted with the same
   pastel sampled from the company's own logo, via --modal-bg) holding a
   large centred logo on the left, scrollable detail on the right. */
.company-modal{
  display:none; position:fixed; z-index:901; top:50%; left:50%;
  transform:translate(-50%,-50%) scale(.95); width:min(980px,94vw); height:min(620px,86vh);
  overflow:hidden; background:#fff; border-radius:0; box-shadow:0 50px 100px -25px rgba(0,0,0,.4), 0 0 0 1px rgba(0,0,0,.04);
  opacity:0; transition:opacity .4s var(--ease-reveal), transform .4s var(--ease-reveal);
}
.company-modal.is-open{ display:block; opacity:1; transform:translate(-50%,-50%) scale(1) }
.company-modal-close{
  position:absolute; top:18px; right:18px; z-index:5; width:40px; height:40px; border-radius:0;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem; line-height:1;
  background:rgba(255,255,255,.92); color:var(--ink); box-shadow:var(--shadow-1);
  transition:background .25s ease, color .25s ease, transform .3s var(--ease);
}
.company-modal-close:hover{ background:var(--red); color:#fff; transform:rotate(90deg) }
.company-modal-inner{ display:grid; grid-template-columns:320px 1fr; height:100% }
.company-modal-inner .company-logo{
  position:relative; height:100%; max-height:none; margin:0; padding:40px;
  display:flex; align-items:center; justify-content:center; flex:none;
  background:var(--modal-bg, var(--bg-alt));
  background-image:repeating-radial-gradient(circle at 82% 12%, transparent 0, transparent 17px, rgba(15,23,42,.05) 18px, rgba(15,23,42,.05) 19px);
}
.company-modal-inner .company-logo img{ max-height:150px; max-width:220px; object-fit:contain }
/* .company-body is display:flex/flex-direction:column on the grid card (so
   .company-tags{ margin-top:auto } pins tags to the bottom of equal-height
   cards) — reset to a plain block flow here, or that same auto-margin
   shoves the tags to the bottom of this tall, independently-scrolling panel
   instead of sitting right under the meta line. */
.company-modal-inner .company-body{
  display:block; padding:clamp(30px,4vw,52px); overflow-y:auto; height:100%;
}
.company-modal-inner h3{ font-size:1.5rem }
.company-modal-inner .company-meta{ font-size:.86rem; margin-bottom:14px }
.company-modal-inner .company-tags{ margin-bottom:6px }
.company-modal-inner .company-desc{ font-size:.94rem; line-height:1.7 }
.company-modal-link{
  display:inline-block; margin-top:20px; font-size:.8rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.05em; color:#fff;
  background:var(--red); padding:11px 22px; border-radius:0;
  transition:background .22s ease, transform .22s var(--ease);
}
.company-modal-link:hover{ background:var(--red-dark); transform:translateY(-2px) }
.company-modal-desc{ font-size:.94rem; line-height:1.7; margin-top:16px }
.company-modal-desc p{ margin-bottom:14px }
.company-modal-social{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px }
.company-modal-social a{
  font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink); padding:8px 16px; border-radius:0; border:1.5px solid var(--line);
  transition:background .22s ease, color .22s ease, border-color .22s ease;
}
.company-modal-social a:hover{ background:var(--red); border-color:var(--red); color:#fff }
@media (max-width:760px){
  .company-modal{ width:94vw; height:90vh; border-radius:0 }
  .company-modal-inner{ grid-template-columns:1fr; grid-template-rows:180px 1fr }
  .company-modal-inner .company-logo{ padding:24px }
  .company-modal-inner .company-logo img{ max-height:90px }
}

/* ===================================================================== videos == */
.grid-videos{ grid-template-columns:repeat(3,1fr); gap:24px }
.video-card{
  display:flex; flex-direction:column; text-align:left; border-radius:0;
  overflow:hidden; border:1px solid var(--line); background:#fff; cursor:pointer;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
  color:inherit; text-decoration:none; width:100%;
}
.video-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:rgba(0,0,0,.15) }
.video-thumb{ position:relative; aspect-ratio:16/9.5; overflow:hidden; background:#000; display:block }
.video-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); opacity:.9 }
.video-card:hover .video-thumb img{ transform:scale(1.05); opacity:1 }
.video-play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.35); transition:background .3s ease;
}
.video-card:hover .video-play{ background:rgba(0,0,0,.48) }
.video-play::before{
  content:''; position:absolute; width:48px; height:48px; border-radius:50%;
  background:var(--red); box-shadow:0 4px 14px rgba(0,0,0,.35); transition:transform .3s ease; z-index:-1;
}
.video-card:hover .video-play::before{ transform:scale(1.12) }
.video-card-body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1 }
.video-title{
  padding:0; font-size:1.02rem; font-weight:600; color:var(--ink); line-height:1.38; margin:0 0 10px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

.video-modal-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.8); z-index:900;
  opacity:0; visibility:hidden; transition:.3s;
}
.video-modal-backdrop.is-open{ opacity:1; visibility:visible }
.video-modal{
  display:none; position:fixed; z-index:901; top:50%; left:50%;
  transform:translate(-50%,-50%); width:min(920px,92vw);
}
.video-modal.is-open{ display:block }
.video-modal-frame{ position:relative; width:100%; aspect-ratio:16/9; background:#000; border-radius:0; overflow:hidden; box-shadow:var(--shadow-2) }
.video-modal-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0 }
.video-modal-close{
  position:absolute; top:-42px; right:0; font-size:2rem; line-height:1; color:#fff;
}
.video-modal-close:hover{ color:var(--red) }
.video-modal-title{ color:#fff; margin-top:14px; font-size:.92rem; text-align:center }

@media (max-width:980px){ .grid-videos{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:600px){ .grid-videos{ grid-template-columns:1fr } }

/* ==================================================================== esg-impact == */
.responsible-investing{ max-width:760px; margin:0 auto; font-size:1rem }
.opim-row{ display:flex; align-items:center; gap:32px; flex-wrap:wrap; margin:28px 0 16px }
.opim-row img{ max-height:56px; width:auto }
.opim-link{
  display:inline-block; font-size:.85rem; font-weight:600; color:var(--red);
  border-bottom:1.5px solid var(--red); padding-bottom:2px;
}
.opim-link:hover{ color:var(--red-dark); border-color:var(--red-dark) }

/* ==================================================================== legal/compliance == */
.legal-panel{ width:100%; max-width:100% }
.legal-panel h3{ margin-top:36px; font-size:1.2rem }
.legal-panel h3:first-child{ margin-top:0 }
.legal-panel p{ font-size:.95rem }
.legal-panel ol{ padding-left:1.3em; margin:0 0 1em; font-size:.95rem }
.legal-panel ol li{ margin-bottom:8px }
.legal-panel .table-wrap{ margin:20px 0 24px; width:100%; overflow-x:auto }
.legal-kv-table{ width:100% }
.legal-kv-table td:first-child{ font-weight:700; color:var(--ink); width:28%; white-space:nowrap }
.legal-footnote{ font-size:.82rem; color:var(--text-soft); margin-top:-10px }
.legal-downloads{ font-size:.92rem; line-height:2 }
.legal-download-unavailable{ color:var(--text-soft); font-style:italic }

/* ==================================================================== combined media hub == */
.media-hero-stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;
}
.media-stat-box{
  background:var(--bg-alt); padding:18px 22px; border:1px solid var(--line);
  display:flex; flex-direction:column; gap:4px;
}
.media-stat-num{ font-family:var(--font-heading); font-size:1.7rem; font-weight:700; color:var(--ink); line-height:1 }
.media-stat-lbl{ font-family:var(--font-accent); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft) }

.media-spotlight{
  display:grid; grid-template-columns:1.2fr 1fr; gap:36px; background:var(--bg-alt);
  border:1px solid var(--line); margin-bottom:48px; overflow:hidden;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.media-spotlight:hover{ transform:translateY(-3px); box-shadow:var(--shadow-2) }
.media-spotlight-media{ position:relative; overflow:hidden; min-height:300px; background:#000 }
.media-spotlight-media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease) }
.media-spotlight:hover .media-spotlight-media img{ transform:scale(1.04) }
.media-spotlight-body{ padding:clamp(24px,3.5vw,44px); display:flex; flex-direction:column; justify-content:center }
.media-spotlight-meta{ display:flex; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap }
.media-spotlight-title{ font-size:clamp(1.3rem,2vw,1.75rem); line-height:1.25; margin-bottom:14px; color:var(--ink) }
.media-spotlight-desc{ font-size:.98rem; color:var(--text); line-height:1.6; margin-bottom:24px }

.media-toolbar{
  display:flex; flex-direction:column; gap:20px; margin-bottom:36px;
}
.media-toolbar-top{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.media-filters{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.media-filter-btn{
  background:#fff; border:1.5px solid var(--line); color:var(--ink);
  padding:8px 18px; font-family:var(--font-accent); font-size:.78rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; cursor:pointer;
  transition:all .2s ease;
}
.media-filter-btn:hover{ border-color:var(--ink); color:var(--ink) }
.media-filter-btn.is-active{ background:var(--red); border-color:var(--red); color:#fff }

.media-toolbar-right{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-left:auto;
}

.media-year-select,
.news-year-select{
  display:inline-flex; align-items:center; gap:10px;
}
.media-year-select label,
.news-year-select label{
  font-family:var(--font-accent); font-size:.78rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--text-soft);
  white-space:nowrap;
}
.media-year-select select,
.news-year-select select{
  padding:9px 34px 9px 14px; border-radius:0; border:1.5px solid var(--line);
  font:inherit; font-size:.88rem; font-weight:600; color:var(--ink); background:#fff;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235b5b5b' stroke-width='1.6' fill='none' fill-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
  cursor:pointer; transition:border-color .2s ease;
}
.media-year-select select:focus,
.news-year-select select:focus{ outline:none; border-color:var(--red) }

.news-year-wrap,
.press-year-wrap{
  display:flex; justify-content:flex-end; align-items:center;
  margin-bottom:clamp(28px,3vw,40px); width:100%;
}

.media-search-box{
  position:relative; min-width:260px; max-width:100%;
}
.media-search-box input{
  width:100%; padding:9px 38px 9px 14px; border:1.5px solid var(--line);
  font:inherit; font-size:.88rem; color:var(--ink); background:#fff;
  transition:border-color .2s ease;
}
.media-search-box input:focus{ outline:none; border-color:var(--red) }
.media-search-icon{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  pointer-events:none; color:var(--text-soft); font-size:.9rem;
}

.media-count-bar{
  font-size:.84rem; color:var(--text-soft); font-weight:500;
  display:flex; align-items:center; justify-content:space-between;
}

.grid-media{
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px;
}

.media-card{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  overflow:hidden; text-align:left; color:inherit; text-decoration:none;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.media-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:rgba(0,0,0,.15) }
.media-card-media{ position:relative; aspect-ratio:16/9.5; overflow:hidden; background:var(--bg-alt) }
.media-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease) }
.media-card:hover .media-card-media img{ transform:scale(1.05) }

.media-play-overlay{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.35); transition:background .3s ease;
}
.media-card:hover .media-play-overlay{ background:rgba(0,0,0,.48) }
.media-play-icon{
  width:46px; height:46px; border-radius:50%; background:var(--red); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.1rem;
  box-shadow:0 4px 12px rgba(0,0,0,.3); transition:transform .3s ease;
}
.media-card:hover .media-play-icon{ transform:scale(1.12) }

.media-card-body{
  padding:20px 22px 24px; display:flex; flex-direction:column; flex:1;
}
.media-card-top{
  display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px;
}
.media-badge{
  display:inline-block; font-family:var(--font-accent); font-size:.65rem; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; padding:3px 9px;
  border-radius:2px; line-height:1.3;
}
.media-badge--article{ background:#f3e8ff; color:#6b21a8 }
.media-badge--news{ background:#e0f2fe; color:#0369a1 }
.media-badge--press{ background:#ffe4e6; color:#be123c }
.media-badge--video{ background:#fef3c7; color:#b45309 }
.media-badge--report{ background:#dcfce7; color:#15803d }

.media-card-date{
  font-family:var(--font-accent); font-size:.72rem; font-weight:600;
  color:var(--text-soft); letter-spacing:.04em;
}
.media-card h3{
  font-size:1.02rem; line-height:1.38; margin:0 0 10px; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.media-card p{
  font-size:.88rem; line-height:1.5; color:var(--text-soft); margin:0 0 16px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  flex:1;
}
.media-card-link{
  font-family:var(--font-accent); font-size:.78rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--red);
  display:inline-flex; align-items:center; gap:4px; margin-top:auto;
}
.media-card:hover .media-card-link{ color:var(--red-dark) }

.media-empty{
  padding:60px 20px; text-align:center; background:var(--bg-alt); border:1px dashed var(--line);
}
.media-empty h4{ font-size:1.2rem; margin-bottom:8px }
.media-empty p{ color:var(--text-soft); margin-bottom:16px }

.media-loader{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:12px; padding:44px 0; width:100%;
}
.media-loader-spinner{
  width:32px; height:32px; border:3px solid rgba(234,46,73,0.18);
  border-top-color:var(--red); border-radius:50%;
  animation:mediaSpin .65s linear infinite;
}
@keyframes mediaSpin{ to{ transform:rotate(360deg); } }
.media-loader-text{
  font-family:var(--font-accent); font-size:.76rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft);
}

.media-end{
  text-align:center; padding:48px 0 20px;
  font-family:var(--font-accent); font-size:.78rem; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft);
  display:flex; align-items:center; justify-content:center; gap:16px;
}
.media-end::before,
.media-end::after{
  content:""; height:1px; width:60px; background:var(--line);
}

.media-sentinel{
  height:24px; width:100%; pointer-events:none; visibility:hidden;
}

@media (max-width:1024px){
  .grid-media{ grid-template-columns:repeat(2,1fr) }
  .media-spotlight{ grid-template-columns:1fr }
  .media-hero-stats{ grid-template-columns:repeat(2,1fr) }
}
@media (max-width:640px){
  .grid-media{ grid-template-columns:1fr }
  .media-hero-stats{ grid-template-columns:1fr }
  .media-toolbar-right{ width:100%; justify-content:space-between; margin-left:0 }
  .media-search-box{ width:100% }
}

/* ======================================================================= reports == */
.grid-reports{ grid-template-columns:repeat(4,1fr); gap:24px }
.report-card{ display:flex; flex-direction:column; text-align:left; text-decoration:none; color:inherit }
.report-card .card-media{ aspect-ratio:4/3.2; overflow:hidden; background:var(--bg-alt) }
.report-card .card-body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1 }
.report-card h3{
  font-size:1.02rem; line-height:1.38; margin:0 0 10px; font-weight:600; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.report-card[title]{ cursor:default }
.report-card[title]:hover{ transform:none; box-shadow:var(--shadow-1) }

@media (max-width:980px){ .grid-reports{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:768px){ .grid-reports{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:480px){ .grid-reports{ grid-template-columns:1fr } }

/* ================================================================= report detail == */
.report-detail-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,4vw,64px); align-items:start }
.report-detail-media img{ width:100%; border-radius:0; box-shadow:var(--shadow-2) }
.report-detail-copy h1{ margin-bottom:16px }
.report-detail-copy > p{ font-size:1.02rem; margin-bottom:32px }

.report-form-wrap{ background:var(--bg-alt); border-radius:0; padding:clamp(22px,3vw,32px) }
.report-form-wrap h3{ margin-bottom:18px; font-size:1.1rem }
.report-form{ display:flex; flex-direction:column; gap:12px }
.report-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
.report-form input{
  width:100%; padding:12px 16px; border-radius:0; border:1.5px solid var(--line);
  font:inherit; font-size:.9rem; color:var(--ink); background:#fff;
}
.report-form input:focus{ outline:none; border-color:var(--red) }
.report-form .btn{ margin-top:6px; align-self:flex-start }
.report-form-note{ font-size:.85rem; color:var(--text-soft); margin-top:6px }

@media (max-width:860px){
  .report-detail-grid{ grid-template-columns:1fr }
  .report-form-row{ grid-template-columns:1fr }
}

/* ============================================================== press/news lists == */
.press-list{ max-width:880px; margin:0 auto; display:flex; flex-direction:column; gap:18px }
.press-item{
  display:flex; flex-direction:column; padding:24px 28px; background:#fff; border:1px solid var(--line);
  text-decoration:none; color:inherit; text-align:left;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.press-item:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:rgba(0,0,0,.15) }
.press-date{ font-family:var(--font-accent); font-size:.72rem; font-weight:600; letter-spacing:.04em; color:var(--text-soft) }
.press-item h3{
  margin:0 0 10px; font-size:1.08rem; line-height:1.4; font-weight:600; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.press-item p{
  font-size:.88rem; line-height:1.55; color:var(--text-soft); margin:0 0 16px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

.news-year-select{ display:flex; align-items:center; gap:12px; justify-content:center; margin-bottom:clamp(28px,3vw,40px) }
.news-year-select label{ font-size:.85rem; font-weight:600; color:var(--text-soft) }
.news-year-select select{
  padding:10px 34px 10px 16px; border-radius:0; border:1.5px solid var(--line);
  font:inherit; font-size:.9rem; color:var(--ink); background:#fff;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235b5b5b' stroke-width='1.6' fill='none' fill-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
}
.news-year-select select:focus{ outline:none; border-color:var(--red) }

.news-panel{ display:none; grid-template-columns:repeat(3,1fr); gap:24px }
.news-panel.is-active{ display:grid }
.press-panel{ display:none }
.press-panel.is-active{ display:block }

.news-item{
  display:flex; flex-direction:column; text-align:left; text-decoration:none; color:inherit;
  border-radius:0; overflow:hidden; border:1px solid var(--line); background:#fff;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.news-item:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:rgba(0,0,0,.15) }
.news-thumb{ position:relative; aspect-ratio:16/9.5; overflow:hidden; background:var(--bg-alt); display:block }
.news-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease) }
.news-item:hover .news-thumb img{ transform:scale(1.05) }
.news-body{
  padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; background:#fff;
}
.news-item h3{
  font-size:1.02rem; margin:0 0 10px; line-height:1.38; color:var(--ink); font-weight:600;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

@media (max-width:980px){ .news-panel{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:600px){ .news-panel{ grid-template-columns:1fr } }

/* ========================================================== program detail == */
.sector-list-item{ padding:26px 0; border-bottom:1px solid var(--line) }
.sector-list-item:first-child{ padding-top:0 }
.sector-list-item:last-child{ border-bottom:0 }
.sector-icon{
  width:52px; height:52px; border-radius:0; background:var(--red); color:#fff;
  display:flex; align-items:center; justify-content:center; margin-bottom:16px; flex:0 0 auto;
}
.sector-icon svg{ width:24px; height:24px }
.sector-list-item h3{ margin-bottom:8px }
.sector-list-item p{ font-size:.95rem; margin:0; max-width:60ch }

.highlight-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px }
.highlight-box{ background:var(--bg-alt); border-radius:0; padding:clamp(24px,3vw,32px) }
.highlight-box h3{ margin-bottom:10px }
.highlight-box p{ font-size:.95rem; margin-bottom:18px }
.highlight-box ul{ display:flex; flex-direction:column; gap:12px }
.highlight-box li{ display:flex; align-items:center; gap:10px; font-size:.9rem; font-weight:600; color:var(--ink) }
.highlight-box li svg{ flex:0 0 auto; color:var(--red) }

.step-item{ display:flex; gap:20px; padding:26px 0; border-bottom:1px solid var(--line) }
.step-item:first-child{ padding-top:0 }
.step-item:last-child{ border-bottom:0 }
.step-num{
  flex:0 0 auto; width:44px; height:44px; border-radius:0; border:1.5px solid var(--red); color:var(--red);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:1.1rem;
}
.step-item h3{ font-size:1.05rem; margin-bottom:4px }
.step-sub{ display:block; font-size:.76rem; color:var(--red); font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px }
.step-item p{ font-size:.92rem; margin:0; max-width:60ch }

.timeline-box{ background:var(--ink); color:#fff; border-radius:0; padding:clamp(28px,4vw,44px); text-align:center }
.timeline-box h3{ color:#fff; margin-bottom:28px }
.timeline-list{ display:flex; flex-wrap:wrap; justify-content:center; gap:clamp(24px,4vw,56px) }
.timeline-item{ min-width:160px }
.timeline-date{ display:block; font-size:.85rem; color:rgba(255,255,255,.6); margin-bottom:6px }
.timeline-label{ font-weight:600 }

.name-chips{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center }
.name-chip{ padding:9px 18px; border:1.5px solid var(--line); border-radius:0; font-size:.86rem; font-weight:600; color:var(--ink) }

/* ---- image slideshow (e.g. McGovern Awards past recipients) --------------- */
.slideshow{ max-width:360px; margin:0 auto }
.slideshow-frame{ position:relative; aspect-ratio:3/4; border-radius:0; overflow:hidden; box-shadow:var(--shadow-1) }
.slideshow-slide{
  position:absolute; inset:0; opacity:0; transition:opacity .5s var(--ease); pointer-events:none;
}
.slideshow-slide.is-active{ opacity:1; pointer-events:auto }
.slideshow-slide img{ width:100%; height:100%; object-fit:cover; display:block }
.slideshow-caption{
  position:absolute; left:0; right:0; bottom:0; padding:16px 20px; z-index:2;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.75) 100%);
}
.slideshow-name{ font-family:var(--font-display); font-weight:400; font-size:1.1rem; color:#fff }
.slideshow-arrow{
  position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:0;
  background:#fff; box-shadow:var(--shadow-2); display:flex; align-items:center; justify-content:center;
  color:var(--ink); z-index:3; transition:color .2s ease;
}
.slideshow-arrow:hover{ color:var(--red) }
.slideshow-prev{ left:-18px }
.slideshow-next{ right:-18px }
.slideshow-dots{ display:flex; flex-wrap:wrap; justify-content:center; gap:7px; margin-top:16px }
.slideshow-dot{ width:7px; height:7px; border-radius:0; background:var(--line); transition:background .2s ease, transform .2s ease }
.slideshow-dot.is-active{ background:var(--red); transform:scale(1.3) }
@media (max-width:480px){
  .slideshow-prev{ left:6px }
  .slideshow-next{ right:6px }
}

.program-gallery{ grid-template-columns:repeat(3,1fr) }
.program-gallery img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:0; box-shadow:var(--shadow-1) }

@media (max-width:768px){
  .highlight-grid{ grid-template-columns:1fr }
  .program-gallery{ grid-template-columns:1fr }
}

/* =============================================================================
   PAW MARK CURSOR & DYNAMIC FOOTPRINT TRAIL SYSTEM
   Replaces default mouse arrow with official Chiratae Cheetah paw mark
   (from the top of the 'i' in the Chiratae logo) facing movement direction,
   with 2-3 trailing paw marks walking behind.
   ============================================================================= */
html.cv-paw-cursor-active,
html.cv-paw-cursor-active *,
html.cv-paw-cursor-active body,
html.cv-paw-cursor-active a,
html.cv-paw-cursor-active button,
html.cv-paw-cursor-active [role="button"],
html.cv-paw-cursor-active input,
html.cv-paw-cursor-active textarea,
html.cv-paw-cursor-active select,
html.cv-paw-cursor-active .btn,
html.cv-paw-cursor-active .card,
html.cv-paw-cursor-active .hero-card,
html.cv-paw-cursor-active .stat-card,
html.cv-paw-cursor-active .unicorn-item,
html.cv-paw-cursor-active .partner-card,
html.cv-paw-cursor-active .insight-card {
  cursor: none !important;
}



/* Fluid Cursor — NexStudio exact specification */
fluid-cursor,
.fluid-cursor,
.cv-paw-cursor {
  z-index: 2000;
  pointer-events: none;
  opacity: 0;
  mix-blend-mode: difference;
  will-change: transform, opacity;
  width: 0;
  height: 0;
  transition: opacity .18s;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  color: #ffffff !important;
  fill: #ffffff !important;
}

.cv-paw-cursor[data-visible="true"],
.fluid-cursor[data-visible="true"] {
  display: block;
  opacity: 1 !important;
}

.cv-paw-cursor__body,
.fluid-cursor__body {
  position: absolute;
  top: 0;
  left: 0;
  width: 26px;
  height: 26px;
  will-change: transform;
  transform-origin: 50% 50%;
  transform: translate(-50%, -50%);
  display: block;
  color: #ffffff !important;
  fill: #ffffff !important;
}

.cv-paw-cursor__body svg,
.cv-paw-cursor__body path,
.fluid-cursor__body svg,
.fluid-cursor__body path {
  width: 100%;
  height: 100%;
  fill: #ffffff !important;
  color: #ffffff !important;
  display: block;
}

.cv-paw-trail {
  z-index: 1990;
  pointer-events: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 20px;
  height: 25px;
  opacity: 1;
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  transition: opacity 1.2s cubic-bezier(.22,.61,.36,1), transform 1.2s cubic-bezier(.22,.61,.36,1);
  mix-blend-mode: difference;
  color: #ffffff !important;
  fill: #ffffff !important;
}

.cv-paw-trail svg,
.cv-paw-trail path {
  width: 100%;
  height: 100%;
  fill: #ffffff !important;
  color: #ffffff !important;
  display: block;
}

.cv-paw-trail.cv-fading {
  opacity: 0 !important;
}