/* ============================================================
   DSL V7 — Blue Monochrome · Light Gray · Editorial
   Cabin (body) · Source Sans Pro (titles) · Inline nav · Ticker
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#ededec;
  --blue:#0014F9;
  --lime:#D4E510;
  --dark:#1a1a2e;
  --fg:#4a4a5a;
  --fg-light:#5e5e6e;
  --border:#e0e0de;
  --sans:Cabin,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --title:Cabin,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --pad:clamp(16px,2vw,32px);
}

html{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.6;scroll-behavior:smooth}
/* Hide body until Cabin is ready to eliminate font-swap flash.
   JS sets body.fonts-loaded once document.fonts resolves (max 800ms fallback). */
body{background:var(--bg);overflow-x:hidden;visibility:hidden;min-height:100vh;min-height:100dvh}
body.fonts-loaded{visibility:visible}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%;height:auto}
ul{list-style:none}
button{font-family:var(--sans);cursor:pointer;border:none;background:none}

/* ── Skip to content (screen readers + keyboard nav) ── */
.skip-link{
  position:absolute;top:-100%;left:0;z-index:9999;
  padding:12px 20px;background:var(--blue);color:#fff;
  font-size:16px;font-weight:600;
  text-decoration:none;
}
.skip-link:focus{top:0}

/* ── Focus ring for keyboard navigation ── */
:focus-visible{
  outline:3px solid var(--blue);
  outline-offset:3px;
}
:focus:not(:focus-visible){outline:none}

/* ═══ TYPOGRAPHY ═══ */
h1,h2,h3,h4,h5,h6{font-family:var(--title);line-height:1.1;font-weight:700;margin:0;color:var(--blue)}
h1{font-size:clamp(48px,6vw,110px);letter-spacing:-.02em}
h2{font-size:clamp(32px,3.5vw,64px);letter-spacing:-.015em}
h3{font-size:clamp(22px,2vw,36px)}
h4{font-size:clamp(18px,1.4vw,26px)}
h5{font-size:clamp(14px,1.1vw,20px);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
h6{font-size:clamp(12px,.8vw,13px);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--fg)}
p{font-size:clamp(17px,1.15vw,19px);line-height:1.7;max-width:65ch}

/* ═══ TOP NAV (grid of bordered cells) ═══ */
.topnav{
  display:flex;align-items:stretch;
  position:sticky;top:0;z-index:500;
  background:var(--bg);
  border:1px solid rgba(0,20,249,.7);
  margin:clamp(6px,0.5vw,10px) clamp(6px,0.5vw,10px) 0;
  transform:translateZ(0); /* promote to compositor layer — prevents scroll jank */
}
.topnav > *{
  display:flex;align-items:center;
  padding:12px clamp(14px,1.8vw,28px);
  border-right:1px solid rgba(0,20,249,.7);
  font-size:clamp(13px,1vw,16px);
  color:var(--fg);white-space:nowrap;
  transition:color .15s;
}
.topnav > *:last-child{border-right:none}
.topnav-logo{
  font-weight:700;color:var(--dark);letter-spacing:.02em;
  gap:8px;min-width:clamp(140px,16vw,260px);
}
.topnav-logo-text{display:inline}
.topnav-logo-img{height:22px;width:auto;display:block}
.topnav-link{cursor:pointer}
.topnav-link:hover{color:var(--blue)}
.topnav-search{
  margin-left:auto;border-right:1px solid rgba(0,20,249,.7) !important;
  border-left:1px solid rgba(0,20,249,.7);
  gap:12px;
  flex:1;
}
.topnav-search svg{width:24px;height:24px;stroke:var(--fg);fill:none;stroke-width:2;cursor:pointer}
.topnav-search svg:hover{stroke:var(--blue)}
.btn-join{
  padding:12px clamp(20px,2.5vw,40px);
  background:var(--blue);color:#fff;
  font-size:clamp(13px,1vw,16px);font-weight:600;
  border:none;cursor:pointer;transition:background .15s;
  border-right:none !important;
  margin-left:0;
}
.btn-join:hover{background:#2a38cc}

/* Hamburger — hidden on desktop */
.topnav-hamburger{
  display:none;
  align-items:center;justify-content:center;
  width:48px;
  padding:12px 14px;
  border-left:1px solid rgba(0,20,249,.7);
  background:none;color:var(--dark);
  cursor:pointer;
}
.topnav-hamburger svg{width:22px;height:22px;stroke:var(--dark);stroke-width:2;fill:none;stroke-linecap:round}

/* ── Mobile nav drawer ── */
.mobile-nav{
  display:flex; /* always in layout — visibility hides it; display:none blocks CSS transitions */
  flex-direction:column;
  position:fixed;top:0;right:0;bottom:0;
  width:min(80vw,320px);
  background:var(--bg);
  border-left:1px solid rgba(0,20,249,.7);
  z-index:600;
  padding:0;
  transform:translateX(100%);
  visibility:hidden;
  pointer-events:none;
  transition:transform .25s ease, visibility 0s .25s;
}
.mobile-nav.open{
  transform:translateX(0);
  visibility:visible;
  pointer-events:auto;
  transition:transform .25s ease, visibility 0s 0s;
}
.mobile-nav-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;
  border-bottom:1px solid rgba(0,20,249,.2);
}
.mobile-nav-close{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;
  background:none;border:none;cursor:pointer;
}
.mobile-nav-close svg{width:20px;height:20px;stroke:var(--dark);stroke-width:2;fill:none;stroke-linecap:round}
.mobile-nav-links{display:flex;flex-direction:column;padding:12px 0}
.mobile-nav-links a{
  display:block;
  padding:14px 24px;
  font-size:18px;font-weight:600;color:var(--dark);
  border-bottom:1px solid rgba(0,20,249,.08);
  transition:color .15s,background .15s;
}
.mobile-nav-links a:hover{color:var(--blue);background:rgba(0,20,249,.04)}
/* Mobile nav footer — search + join */
.mobile-nav-footer{
  margin-top:auto;
  padding:20px 24px 32px;
  border-top:1px solid rgba(0,20,249,.12);
  display:flex;flex-direction:column;gap:12px;
}
.mobile-nav-search{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;
  border:1px solid rgba(0,20,249,.6);
  background:#fff;
}
.mobile-nav-search svg{
  width:24px;height:24px;flex-shrink:0;
  stroke:var(--fg);fill:none;stroke-width:2;
}
.mobile-nav-search-input{
  border:none;background:none;outline:none;
  font-family:var(--sans);font-size:15px;color:var(--fg);
  width:100%;
}
.mobile-nav-search-input::placeholder{color:#aaa}
.mobile-nav-join{
  display:block;text-align:center;
  padding:13px 20px;
  background:var(--blue);color:#fff;
  font-size:15px;font-weight:600;
  transition:background .15s;
}
.mobile-nav-join:hover{background:#2a38cc}

/* Overlay behind drawer */
.mobile-nav-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.3);
  z-index:590;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.mobile-nav-overlay.open{opacity:1;pointer-events:auto}

@media(max-width:700px){
  /* Remove margin so sticky nav doesn't jump */
  .topnav{margin:0;}
  /* Hide desktop-only nav items but keep logo */
  .topnav-link,.topnav-search,.btn-join{display:none}
  /* Logo: show SVG + text, keep compact */
  .topnav-logo{min-width:unset;flex:1}
  .topnav-logo-text{display:inline}
  /* Hamburger pushed to far right */
  .topnav-hamburger{display:flex;margin-left:auto;border-left:1px solid rgba(0,20,249,.7)}
}

/* Homepage logos — above "Celebrating 10+ Years" in hero */
.homepage-logos{
  margin-bottom:clamp(16px,2vw,28px);
}

/* ═══ TICKER / MARQUEE ═══ */
.ticker{
  padding:10px 0;overflow:hidden;
  border-bottom:1px solid rgba(0,20,249,.12);
}
.ticker-inner{
  display:flex;white-space:nowrap;
  animation:marquee 30s linear infinite;
  will-change:transform;
}
.ticker-inner span{
  font-size:clamp(12px,.85vw,14px);color:var(--fg);
  padding-right:3vw;
}
.ticker-inner a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ═══ YEAR TIMELINE NAV ═══ */
.year-nav{
  display:flex;align-items:center;
  justify-content:space-between;
  padding:10px var(--pad);gap:0;
  border-bottom:1px solid rgba(0,20,249,.12);
  overflow-x:auto;
}
.year-nav a{
  font-size:clamp(13px,1vw,16px);color:var(--fg);
  padding:4px 12px;white-space:nowrap;transition:color .15s;
  position:relative;
}
.year-nav a:hover,.year-nav a.active{color:var(--blue)}
.year-nav a.active{font-weight:600}
.year-nav .dot{
  width:4px;height:4px;border-radius:50%;
  background:var(--blue);opacity:.3;flex-shrink:0;
}

/* ═══ SPLIT HERO (awards landing) ═══ */
.split{
  display:flex;min-height:80vh;
  padding:var(--pad);gap:var(--pad);
}
@media(max-width:900px){.split{flex-direction:column;min-height:auto}}
.split-left{
  width:40%;flex-shrink:0;
  display:flex;flex-direction:column;
  justify-content:center;padding-right:2vw;
}
@media(max-width:900px){.split-left{width:100%}}
.split-left .year-label{
  font-size:clamp(16px,1.2vw,22px);color:var(--blue);
  font-weight:500;margin-bottom:.5em;
}
.split-left h1{margin-bottom:.2em;line-height:.95}
.awards-archive-label{
  font-size:clamp(12px,.9vw,15px);
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--fg-light);
  margin:0 0 1em;
}
.split-left .desc{
  color:var(--fg);font-size:clamp(17px,1.15vw,19px);
  line-height:1.65;margin-bottom:1.5em;max-width:40ch;
}
.split-left .anchor-links a{
  display:block;font-size:clamp(18px,1.6vw,30px);
  color:var(--blue);text-decoration:underline;
  text-underline-offset:4px;margin-bottom:.4em;
  transition:opacity .15s;
}
.split-left .anchor-links a:hover{opacity:.7}
.split-right{
  flex:1;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(3px,.3vw,6px);
  align-content:start;
}
@media(max-width:600px){.split-right{grid-template-columns:repeat(2,1fr)}}
.grid-tile{
  display:block;position:relative;aspect-ratio:1;overflow:hidden;
  background:#d0d0d0;cursor:pointer;
  text-decoration:none;
}
.grid-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.grid-tile:hover img{transform:scale(1.05)}
.grid-tile .tile-label{
  position:absolute;bottom:0;left:0;right:0;
  padding:8px 10px;
  background:linear-gradient(transparent,rgba(0,0,0,.6));
  color:#fff;font-size:clamp(11px,.75vw,13px);
  display:flex;justify-content:space-between;align-items:flex-end;
}
.grid-tile .tile-label .arrow{font-size:14px}

/* ═══ EXPLORE INTERACTIVE ═══ */
.explore-section{
  padding:clamp(36px,4vw,64px) var(--pad) clamp(40px,4.5vw,72px);
  border-top:1px solid rgba(0,20,249,.12);
}
.explore-sentence{
  font-size:clamp(20px,2.4vw,42px);
  font-weight:600;color:var(--blue);
  line-height:1.2;
}
.explore-static{
  transition:opacity .3s;
}
.explore-static.dimmed{
  opacity:.2;
}
.explore-word{
  position:relative;display:inline-flex;align-items:center;gap:.2em;
  cursor:pointer;text-decoration:underline;
  text-underline-offset:.15em;text-decoration-thickness:2px;
  text-decoration-color:rgba(0,20,249,.35);
  user-select:none;
}
.explore-word:hover,.explore-word.open{
  text-decoration-color:var(--blue);
}
.explore-caret{
  width:clamp(10px,.7vw,16px);height:auto;
  stroke:var(--blue);transition:transform .2s;
  flex-shrink:0;margin-top:.1em;
}
.explore-word.open .explore-caret{transform:rotate(180deg)}
.explore-dropdown{
  display:none;
  position:absolute;top:calc(100% + .4em);left:0;
  background:#fff;border:1.5px solid var(--blue);
  min-width:max-content;z-index:100;
  list-style:none;padding:0;margin:0;
  box-shadow:0 8px 24px rgba(0,20,249,.12);
}
.explore-word.open .explore-dropdown{display:block}
.explore-dropdown li{
  padding:.55em 1.2em;
  font-size:clamp(14px,1.1vw,20px);font-weight:600;
  color:var(--blue);cursor:pointer;
  transition:background .12s;
  white-space:nowrap;
}
.explore-dropdown li:hover{background:var(--blue);color:#fff}

.explore-results{
  margin-top:clamp(20px,2.5vw,36px);
}
.explore-label{
  font-size:clamp(12px,.85vw,14px);font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--fg-light);margin-bottom:clamp(16px,2vw,28px);
}
.explore-reshuffle{
  font-family:var(--sans);font-size:inherit;font-weight:700;
  color:var(--blue);text-transform:uppercase;letter-spacing:.06em;
  cursor:pointer;text-decoration:underline;text-underline-offset:3px;
  background:none;border:none;padding:0;
}
.explore-reshuffle:hover{opacity:.7}
.explore-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:clamp(8px,1vw,16px);
}
.explore-card{
  display:block;text-decoration:none;color:inherit;
}
.explore-img{
  width:100%;aspect-ratio:3/4;overflow:hidden;background:#d8d8d5;
  margin-bottom:.6em;
}
.explore-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.explore-card:hover .explore-img img{transform:scale(1.05)}
.explore-card-title{
  font-size:clamp(12px,.85vw,15px);font-weight:600;
  color:var(--blue);line-height:1.3;margin-bottom:.2em;
}
.explore-card-year{
  font-size:clamp(11px,.75vw,13px);color:var(--fg-light);
}
.explore-empty{
  font-size:clamp(14px,1vw,18px);color:var(--fg-light);
}
@media(max-width:900px){.explore-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.explore-grid{grid-template-columns:repeat(2,1fr)};.explore-sentence{font-size:clamp(22px,6vw,36px)}}

/* ═══ PROJECT DETAIL ═══ */
/* ── Detail page back + badge ── */
.detail-back{
  display:flex;align-items:center;gap:1.5em;
  padding:clamp(12px,1.5vw,20px) clamp(24px,8vw,160px);
}
.detail-back a{
  font-size:clamp(12px,.85vw,14px);font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;color:var(--fg-light);
}
.detail-back a:hover{color:var(--blue)}
.prize-badge{
  display:inline-block;
  padding:4px 12px;
  font-size:clamp(10px,.7vw,12px);font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;
}
.prize-badge--breakthrough{
  background:var(--blue);color:#fff;
}
.prize-badge--jury{
  background:transparent;color:var(--blue);
  border:1.5px solid var(--blue);
}

/* ── Detail title ── */
.detail-title{
  padding:0 clamp(24px,8vw,160px) clamp(16px,1.5vw,24px);
}
.detail-title h1{font-size:clamp(36px,5.5vw,100px);line-height:1.05;color:var(--blue)}

/* ── Detail meta row ── */
.detail-meta{
  display:flex;flex-wrap:wrap;align-items:flex-start;gap:clamp(20px,2.5vw,48px);
  padding:clamp(20px,2vw,32px) clamp(24px,8vw,160px);
  border-top:1px solid rgba(0,20,249,.14);
  border-bottom:1px solid rgba(0,20,249,.14);
  margin-bottom:clamp(32px,4vw,64px);
}
.detail-meta .meta-col{display:flex;flex-direction:column;gap:.35em}
.meta-label{
  font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;color:var(--fg-light);
}
.detail-meta .meta-col span:not(.meta-label){
  font-size:clamp(13px,.95vw,16px);color:var(--fg);font-weight:500;
}
#launch-btn-wrap{margin-right:2%}
.btn-launch{
  display:inline-flex;align-items:center;gap:.4em;
  padding:9px 20px;
  background:var(--blue);color:#fff;
  font-size:clamp(11px,.8vw,14px);font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;
  text-decoration:none;white-space:nowrap;
}
.btn-launch:hover{opacity:.85}

/* ── Detail body ── */
.detail-body{
  padding:0 clamp(24px,8vw,160px);
  font-size:clamp(17px,1.15vw,19px);
}
.detail-body p{
  line-height:1.8;color:var(--fg);margin-bottom:1.4em;max-width:72ch;
}
.detail-body h2{font-size:clamp(22px,2vw,36px);margin:2em 0 .6em;max-width:72ch}
.detail-body h3{font-size:clamp(20px,1.7vw,30px);margin:1.8em 0 .5em;max-width:72ch}
.detail-body h4{font-size:clamp(18px,1.4vw,24px);margin:1.5em 0 .4em;max-width:72ch}
.detail-body h5{font-size:clamp(16px,1.2vw,20px);font-weight:600;color:var(--blue);margin:1.5em 0 .4em;max-width:72ch;text-transform:none;letter-spacing:0}
.detail-body h6{font-size:clamp(11px,.8vw,13px);text-transform:uppercase;letter-spacing:.1em;color:var(--fg-light);margin:1.5em 0 .3em}
.detail-body ul,.detail-body ol{padding-left:1.5em;margin-bottom:1.4em;max-width:72ch}
.detail-body li{font-size:clamp(17px,1.15vw,19px);line-height:1.8;color:var(--fg);margin-bottom:.4em}
.detail-body strong{font-weight:700}
.detail-body em{font-style:italic}
.detail-body a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}

/* ── Blockquotes — single unified rule ── */
.detail-body blockquote{
  margin:2.5em 0 2em;
  padding:0;border:none;
  max-width:72ch;
}
.detail-body blockquote .bq-text{
  font-size:clamp(20px,1.7vw,28px);
  font-style:normal;
  font-weight:400;
  line-height:1.45;
  color:var(--blue);
  margin:0;
  max-width:none;
}
.detail-body blockquote .bq-attr{
  font-size:clamp(12px,.85vw,14px);
  font-style:normal;
  font-weight:600;
  color:var(--fg-light);
  margin:.5em 0 0;
  text-transform:uppercase;
  letter-spacing:.06em;
  max-width:none;
}

/* Simple Quote — compact, left-bordered, consistent across all screen sizes */
.detail-body blockquote.bq-simple,
.article-content blockquote.bq-simple{
  border-left:3px solid var(--blue);
  padding-left:1.2em;
  margin:1.5em 0;
  background:none;
}
.detail-body blockquote.bq-simple .bq-text,
.article-content blockquote.bq-simple .bq-text{
  font-size:clamp(16px,1.1vw,19px);
  color:var(--blue);
  font-style:normal;
  font-weight:400;
  line-height:1.6;
  margin:0;
  max-width:none;
}
.detail-body blockquote.bq-simple .bq-attr,
.article-content blockquote.bq-simple .bq-attr{
  font-size:clamp(12px,.85vw,13px);
  font-style:normal;
  font-weight:600;
  color:var(--fg-light);
  margin:.4em 0 0;
  text-transform:uppercase;
  letter-spacing:.06em;
  max-width:none;
}

/* Epigraph variant — centered h5 subtitles (no italic, no quotes) */
.detail-body blockquote.bq-epigraph{
  border-left:3px solid var(--blue);
  padding-left:1.2em;
  margin:2em 0;
  max-width:60ch;
}
.detail-body blockquote.bq-epigraph .bq-text{
  font-style:normal;
  font-size:clamp(15px,1.1vw,18px);
  line-height:1.7;
  color:var(--fg);
}

/* Section labels (h5 converted) — "IN THE MEDIA", "Q&A WITH..." etc */
.detail-body .body-section-label{
  font-size:clamp(11px,.8vw,13px);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--fg-light);
  margin:2.5em 0 .6em;
  max-width:72ch;
}

/* Orphan attribution — right-aligned <p> not attached to a quote */
.detail-body .bq-orphan-attr{
  font-size:clamp(12px,.85vw,14px);
  font-weight:600;
  color:var(--fg-light);
  text-transform:uppercase;
  letter-spacing:.06em;
  margin:.3em 0 1.5em;
  max-width:72ch;
}

/* Images and video — constrained to text width */
.detail-body img{
  max-width:72ch;width:100%;height:auto;display:block;
  margin:clamp(24px,3vw,48px) 0;
}
/* Special Jury Prize seal — floats right inside .detail-body, before
   detail-body-inner, so its top aligns with the first line of description text */
.detail-body img.jury-prize-seal{
  float:right;
  width:clamp(274px,21.95vw,384px);
  max-width:none;
  height:auto;
  display:block;
  margin:0 calc(-1 * clamp(12px,4vw,80px)) 24px 32px;
  clear:right;
}
.detail-body-inner{max-width:72ch;overflow:hidden}
.body-image{max-width:72ch;margin:clamp(32px,4vw,64px) 0}
.body-image img{margin:0;width:100%;height:auto}
.body-image figcaption{font-size:13px;color:var(--fg-light);line-height:1.5;margin-top:8px;font-style:italic}
.body-image--float{max-width:none;margin-top:4px;margin-bottom:8px}
.body-image--float img{display:block;width:100%;height:auto}
.body-image--centered{display:block;margin-left:auto;margin-right:auto;width:100%}
hr.body-divider{border:none;border-top:2px solid var(--blue);margin:clamp(32px,4vw,64px) 0}
.body-credits{display:block;line-height:1.7;margin:clamp(24px,3vw,48px) 0}
.body-code{max-width:72ch;margin:clamp(24px,3vw,48px) 0;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#f8fafc}
.body-code-lang{padding:6px 16px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-light);border-bottom:1px solid var(--border);background:#f1f5f9}
.body-code pre{margin:0;padding:16px 20px;overflow-x:auto}
.body-code code{font-family:'Courier New',Courier,monospace;font-size:14px;line-height:1.65;color:var(--fg);white-space:pre}
.body-gallery{display:grid;grid-template-columns:repeat(3,1fr);column-gap:12px;row-gap:12px;align-items:start;margin:clamp(32px,4vw,64px) 0}
.detail-body .body-gallery--fw{
  margin-left:calc(-1 * clamp(24px,8vw,160px));
  margin-right:calc(-1 * clamp(24px,8vw,160px));
}
.body-gallery:not(:has(figure)){display:none}
.body-gallery--2col{grid-template-columns:repeat(2,1fr)}
.body-gallery--3col{grid-template-columns:repeat(3,1fr)}
.body-gallery--4col{grid-template-columns:repeat(4,1fr)}
.body-gallery figure{margin:0;overflow:hidden;border-radius:4px}
.body-gallery figure .gi{aspect-ratio:4/3;overflow:hidden;border-radius:4px}
.body-gallery-ratio--square figure .gi{aspect-ratio:1/1}
.body-gallery-ratio--landscape figure .gi{aspect-ratio:4/3}
.body-gallery-ratio--wide figure .gi{aspect-ratio:16/9}
.body-gallery-ratio--portrait figure .gi{aspect-ratio:3/4}
.body-gallery figure img{width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none}
.body-gallery figure figcaption{font-size:11px;color:var(--fg-light);line-height:1.4;padding:4px 2px;font-style:italic}
.body-gallery figcaption.gallery-caption{grid-column:1/-1;font-size:13px;color:var(--fg-light);line-height:1.5;font-style:italic;margin-top:4px;padding-top:8px;border-top:1px solid var(--border)}
.video-embed{
  position:relative;max-width:72ch;width:100%;
  aspect-ratio:16/9;
  margin:clamp(32px,4vw,64px) 0;
  background:#000;
}
.video-embed iframe{
  position:absolute;top:0;left:0;
  width:100%;height:100%;border:none;
}

/* ── Legacy styles kept for other uses ── */
.detail-hero{width:100%;max-height:70vh;overflow:hidden}
.detail-hero img{width:100%;height:100%;object-fit:cover}
.tag-pill{
  display:inline-block;padding:4px 10px;
  border:1.5px solid var(--blue);color:var(--blue);
  font-size:clamp(10px,.7vw,13px);font-weight:600;
  text-transform:uppercase;letter-spacing:.03em;
  margin:0 4px 4px 0;
}

.blue-section{
  background:var(--blue);
  padding:clamp(40px,4vw,80px) var(--pad);
}
.blue-section img{width:100%;max-width:700px;margin:0 auto;display:block}
.blue-section blockquote{
  color:#fff;font-size:clamp(18px,2vw,36px);
  font-weight:600;line-height:1.3;text-transform:uppercase;
  max-width:900px;margin:0 auto;text-align:center;
  padding:clamp(20px,2vw,40px) 0;
}

/* ═══ MEGA FOOTER ═══ */
.mega-footer{
  padding:clamp(48px,5vw,80px) var(--pad) 0;
  border-top:1px solid rgba(0,20,249,.12);
}
.mega-footer-grid{
  display:flex;gap:var(--pad);flex-wrap:wrap;
  padding-bottom:clamp(40px,4vw,80px);
}
.mega-footer-col{min-width:140px;flex:1}
.mega-footer-col h5{color:var(--blue);margin-bottom:.8em;font-size:clamp(11px,.75vw,13px)}
.mega-footer-col a{
  display:block;font-size:clamp(14px,1.1vw,20px);
  color:var(--blue);margin-bottom:.3em;transition:opacity .15s;
}
.mega-footer-col a:hover{opacity:.6}
.mega-footer-ctas{
  display:flex;flex-direction:column;gap:8px;
  min-width:180px;
}
.cta-card{
  padding:clamp(16px,1.5vw,24px);
  display:flex;flex-direction:column;
  justify-content:space-between;
  min-height:clamp(100px,8vw,140px);
  font-size:clamp(14px,1.1vw,20px);font-weight:600;
  transition:opacity .15s;cursor:pointer;
}
.cta-card:hover{opacity:.85}
.cta-card.blue{background:var(--blue);color:#fff}
.cta-card.lime{background:var(--lime);color:var(--dark);margin-bottom:clamp(24px,3vw,48px)}
.cta-card .arrow{font-size:clamp(18px,1.5vw,28px);margin-top:.5em}

.mega-footer-bottom{
  display:flex;flex-direction:column;align-items:center;
  padding:clamp(32px,4vw,56px) 0 clamp(32px,4vw,56px);
  border-top:1px solid rgba(0,20,249,.12);
  gap:24px;
}
.mega-footer-logos{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(21px,2.6vw,42px);flex-wrap:wrap;
}
.mega-footer-columbia-logo{
  height:clamp(98px,11.2vw,168px);
  width:auto;opacity:.8;
}
.mega-footer-dsl-logo{
  height:clamp(60px,6.8vw,102px);
  width:auto;opacity:.8;
}
.mega-footer-bottom-links{
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:center;
}
.mega-footer-bottom:empty{display:none}
.mega-footer-bottom a{
  font-size:clamp(12px,1vw,18px);font-weight:600;
  text-transform:uppercase;color:var(--blue);
  letter-spacing:.03em;transition:opacity .15s;
}
.mega-footer-bottom a:hover{opacity:.6}

.mega-wordmark{
  font-size:clamp(80px,14vw,280px);
  font-weight:700;color:var(--blue);
  text-align:center;line-height:.85;
  padding:clamp(16px,1vw,24px) 0 0;
  overflow:hidden;
  /* clip bottom — show ~70% of letters */
  max-height:clamp(65px,10vw,200px);
}

/* ═══ HOMEPAGE SECTIONS ═══ */
.hero-split{
  display:flex;gap:var(--pad);padding:var(--pad);
  min-height:clamp(460px,62vh,760px);
}
@media(max-width:900px){.hero-split{flex-direction:column}}
.hero-split .hero-text{
  flex:0.8;display:flex;flex-direction:column;justify-content:flex-end;
  padding-bottom:var(--pad);
}
.hero-split .hero-text .subtitle{
  font-size:clamp(12px,.9vw,16px);color:var(--blue);
  font-weight:500;margin-bottom:.5em;
}
.hero-split .hero-text h1{line-height:.95;margin-bottom:0}
.hero-split .hero-img{
  flex:1.2;overflow:hidden;
  position:relative;
  height:clamp(460px,62vh,760px);
  background:var(--blue);
}
@media(max-width:900px){
  /* Lock hero image to fixed px height on mobile/tablet — vh units recalculate as
     the browser address bar shows/hides during scroll, causing a zoom/resize effect.
     flex:none stops flex-grow from overriding the fixed height.
     Must come AFTER the desktop .hero-split .hero-img rule to win the cascade. */
  .hero-split{min-height:unset}
  .hero-split .hero-img{height:320px;flex:none}
}
.hero-split .hero-img img{width:100%;height:100%;object-fit:cover;transition:opacity .5s ease}
.hero-split .hero-img::after{
  content:'';position:absolute;inset:0;
  background:rgba(0,20,249,.45);
  mix-blend-mode:multiply;
  pointer-events:none;
  z-index:1;
}
/* Rotating hero feature */
.hero-feature-link{display:block;width:100%;height:100%;position:relative;text-decoration:none}
.hero-feature-link img{display:block;width:100%;height:100%;object-fit:cover;transition:opacity .5s ease}
.hero-feature-caption{
  position:absolute;bottom:0;left:0;right:0;
  padding:clamp(16px,2vw,28px);
  background:linear-gradient(to top,rgba(0,0,0,.75) 0%,rgba(0,0,0,.2) 70%,transparent 100%);
  z-index:2;
}
.hero-feature-year{
  display:block;
  font-size:clamp(10px,.75vw,13px);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--lime);
  margin-bottom:.3em;
}
.hero-feature-title{
  display:block;
  font-size:clamp(15px,1.3vw,22px);
  font-weight:700;
  color:#fff;
  line-height:1.2;
}

/* ─── Featured label bar (between hero and quick links) ─── */
.featured-bar{
  display:flex;align-items:center;
  padding:clamp(6px,0.5vw,10px) var(--pad);
  gap:clamp(8px,1vw,16px);
}
.featured-bar .featured-label{
  font-size:clamp(11px,.8vw,14px);
  font-weight:600;text-transform:uppercase;color:var(--fg);
  letter-spacing:.04em;white-space:nowrap;
}
.featured-bar .featured-line{
  flex:1;height:1px;background:rgba(0,20,249,.2);
}

/* ─── Quick Links row ─── */
.quick-links{
  display:flex;align-items:flex-end;gap:clamp(30px,5vw,80px);
  padding:clamp(20px,2vw,32px) var(--pad);
  border-bottom:1px solid rgba(0,20,249,.12);
  overflow-x:auto;
  overflow-y:hidden;
  touch-action:pan-x;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.quick-links::-webkit-scrollbar{display:none;}
.quick-link{
  display:flex;flex-direction:column;gap:8px;
  flex-shrink:0;
  font-size:clamp(11px,.8vw,14px);font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;color:var(--fg);
  transition:color .15s;
}
.quick-link:hover{color:var(--blue)}
.quick-link .ql-imgs{
  display:flex;gap:clamp(3px,.3vw,6px);
}
.quick-link .ql-imgs img{
  width:clamp(80px,8vw,140px);height:clamp(100px,10vw,160px);
  min-width:80px;min-height:100px;
  object-fit:cover;
  flex-shrink:0;
}
.quick-link .ql-label{
  font-size:clamp(11px,.8vw,14px);font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;color:var(--fg);
  margin-top:4px;
}
.quick-links .ql-pair{
  display:flex;align-items:flex-end;
  gap:clamp(8px,1vw,16px);
  flex-shrink:0;
}
.quick-links .ql-ctas{
  display:flex;gap:clamp(4px,.4vw,8px);
  flex-shrink:0;
}
.quick-links .ql-cta{
  width:clamp(80px,8vw,130px);height:clamp(100px,10vw,160px);
  min-width:80px;min-height:100px;flex-shrink:0;
  padding:clamp(10px,1vw,16px);display:flex;flex-direction:column;
  justify-content:space-between;font-weight:600;
  font-size:clamp(13px,1vw,18px);
}
.quick-links .ql-cta.blue{background:var(--blue);color:#fff}
.quick-links .ql-cta.lime{background:var(--lime);color:var(--dark)}
.quick-links .ql-cta .arrow{font-size:clamp(16px,1.2vw,24px)}

.section-header{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:0 var(--pad);margin-bottom:clamp(16px,1.5vw,24px);
}
.section-header h2{font-size:clamp(20px,2vw,40px);font-weight:600}
.section-header a{font-size:clamp(11px,.8vw,14px);color:var(--blue);font-weight:500}

.card-row{
  display:flex;gap:clamp(16px,2vw,28px);
  padding:0 var(--pad);overflow-x:auto;
}
.article-card{
  flex:1;min-width:clamp(180px,18vw,260px);
  display:block;text-decoration:none;color:inherit;
}
.article-card img{
  width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:12px;
}
.article-card h4, .article-card p, .article-card .card-cat, .article-card .card-tags {
  padding:0 4px;
}
.article-card .card-cat{
  font-size:clamp(9px,.6vw,11px);font-weight:600;
  text-transform:uppercase;color:var(--fg);letter-spacing:.04em;
  margin-bottom:4px;
}
.article-card h4{font-size:clamp(14px,1.1vw,20px);margin-bottom:4px}
.article-card .card-tags{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:4px}
.article-card .card-tags span{
  font-size:clamp(8px,.55vw,11px);padding:2px 6px;
  border:1px solid var(--blue);color:var(--blue);
  text-transform:uppercase;font-weight:600;
}
.article-card p{font-size:clamp(15px,1vw,16px);color:var(--fg);line-height:1.6}

.proto-split{
  display:flex;gap:var(--pad);padding:0 var(--pad);
}
@media(max-width:900px){.proto-split{flex-direction:column}}
.proto-split .proto-img{flex:1;overflow:hidden}
.proto-split .proto-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.proto-split .proto-list{flex:1;display:flex;flex-direction:column;gap:clamp(8px,.6vw,12px)}
.proto-item{
  display:flex;gap:clamp(8px,.8vw,16px);align-items:flex-start;
  text-decoration:none;color:inherit;
}
a.proto-item:hover h4{text-decoration:underline;}
.proto-item img{
  width:clamp(60px,6vw,100px);aspect-ratio:1;object-fit:cover;flex-shrink:0;
}
.proto-item h4{margin-bottom:2px}
.proto-item p{font-size:clamp(15px,1vw,16px);color:var(--fg);line-height:1.6}

.member-row{
  display:flex;gap:clamp(8px,.6vw,12px);
  padding:0 var(--pad) clamp(8px,.6vw,12px);
  overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:var(--blue) transparent;
}
.member-row::-webkit-scrollbar{height:4px}
.member-row::-webkit-scrollbar-thumb{background:var(--blue);border-radius:2px}
.member-card{
  width:clamp(120px,12vw,180px);flex:0 0 clamp(120px,12vw,180px);text-align:center;
  scroll-snap-align:start;text-decoration:none;display:block;
  transition:transform .2s;
}
.member-card:hover{transform:translateY(-4px)}
.member-card img{
  display:block;width:100%;height:clamp(160px,16vw,240px);
  object-fit:cover;object-position:center top;
  margin-bottom:6px;background:#d8d8d6;
}
.member-card .name{font-size:clamp(11px,.8vw,14px);color:var(--fg);font-weight:600}
.member-card .role{font-size:clamp(9px,.65vw,12px);color:var(--blue);font-weight:500;margin-top:2px}
.member-card .card-tags{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;margin-top:4px}
.member-card .card-tags span{
  font-size:clamp(7px,.5vw,10px);padding:2px 5px;
  border:1px solid var(--blue);color:var(--blue);
  text-transform:uppercase;font-weight:600;
}

.cs-banner{
  position:relative;overflow:hidden;margin:0 var(--pad);
}
.cs-banner img{
  width:100%;aspect-ratio:16/7;object-fit:cover;display:block;
}
.cs-banner-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.3) 55%, rgba(0,0,0,.05) 100%);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(20px,3vw,48px);
}
.cs-banner-overlay h6{
  color:rgba(255,255,255,.8);font-size:clamp(10px,.7vw,12px);
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:.4em;
}
.cs-banner-overlay h3{
  color:#fff;font-size:clamp(18px,2vw,32px);line-height:1.25;
  margin-bottom:.6em;max-width:60ch;
}
.cs-banner-overlay p{
  color:rgba(255,255,255,.85);font-size:clamp(14px,1vw,17px);
  line-height:1.6;max-width:52ch;margin-bottom:1.2em;
}
.cs-read-more{
  display:inline-block;padding:10px 24px;
  background:#fff;color:var(--blue);
  font-size:clamp(12px,.85vw,14px);font-weight:700;
  letter-spacing:.04em;text-decoration:none;
  transition:opacity .15s;align-self:flex-start;
}
.cs-read-more:hover{opacity:.85}
.cs-photo-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(4px,.4vw,8px);
  margin:clamp(12px,1.2vw,20px) 0;
}
.cs-photo{
  overflow:hidden;
  aspect-ratio:1;
}
.cs-photo img{
  width:100%;height:100%;
  object-fit:cover;display:block;
  transition:transform .4s;
}
.cs-photo:hover img{transform:scale(1.04)}

/* ── Read More button (awards split-left) ────────────────── */
.btn-read-more{
  display:inline-block;
  margin-top:1.4em;
  padding:clamp(10px,.8vw,14px) clamp(22px,2vw,32px);
  background:var(--blue);
  color:#fff;
  font-weight:700;
  font-size:clamp(12px,.9vw,15px);
  letter-spacing:.05em;
  text-decoration:none;
  border-radius:2px;
  transition:opacity .2s;
}
.btn-read-more:hover{opacity:.88}

/* ── Breakthroughs About Page ────────────────────────────── */
.ba-header{
  padding-top:clamp(40px,5vw,80px);
  padding-bottom:clamp(32px,3.5vw,56px);
  border-bottom:1px solid var(--border);
}
.ba-back{
  display:inline-block;
  font-size:clamp(12px,.85vw,14px);
  color:var(--fg-light);
  text-decoration:none;
  margin-bottom:1.5em;
  letter-spacing:.04em;
}
.ba-back:hover{color:var(--blue)}
.ba-title{
  font-size:clamp(36px,5vw,80px);
  font-weight:700;
  line-height:1.05;
  margin:0 0 .4em;
  max-width:16ch;
}
.ba-subtitle{
  font-size:clamp(14px,1.1vw,17px);
  color:var(--fg-light);
  margin:0;
}
.ba-mission{border-bottom:1px solid var(--border)}
.ba-mission-layout{display:flex;gap:clamp(40px,6vw,100px);align-items:flex-start}
.ba-year-nav{
  flex-shrink:0;
  display:flex;flex-direction:column;gap:.15em;
  padding-top:.35em;
}
.ba-year-nav a{
  font-size:clamp(22px,2vw,32px);font-weight:700;line-height:1.2;
  color:var(--border);text-decoration:none;
  transition:color .15s;letter-spacing:-.01em;
}
.ba-year-nav a:hover{color:var(--blue)}
@media(max-width:600px){.ba-mission-layout{flex-direction:column}.ba-year-nav{flex-direction:row;flex-wrap:wrap;gap:.4em .8em}.ba-year-nav a{font-size:clamp(16px,4vw,22px)}}
.ba-mission-inner{max-width:72ch;text-align:justify}
.ba-lead{
  font-size:clamp(18px,1.5vw,24px);
  line-height:1.55;
  font-weight:400;
  color:var(--fg);
  margin:0 0 1.2em;
}
.ba-mission-inner p{
  font-size:clamp(15px,1.1vw,18px);
  line-height:1.75;
  color:var(--fg);
  margin:0 0 1em;
}

/* History rows */
.ba-history{
  display:flex;
  flex-direction:column;
  gap:0;
}
.ba-year-row{
  display:grid;
  grid-template-columns:clamp(60px,7vw,100px) 1fr;
  gap:clamp(24px,3vw,48px);
  padding:clamp(24px,2.5vw,40px) 0;
  border-bottom:1px solid var(--border);
  align-items:start;
}
.ba-year-num{
  font-size:clamp(20px,2vw,28px);
  font-weight:700;
  color:var(--blue);
  padding-top:.15em;
}
.ba-prize{
  font-size:clamp(14px,1vw,16px);
  margin:0 0 .25em;
  color:var(--fg);
}
.ba-dozen-label{
  font-size:clamp(10px,.75vw,12px);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--fg-light);
  margin:.8em 0 .3em;
}
.ba-dozen{
  font-size:clamp(13px,.95vw,15px);
  color:var(--fg-light);
  line-height:1.6;
  margin:0 0 .6em;
}
.ba-note{
  font-size:clamp(12px,.85vw,14px);
  color:var(--fg-light);
  font-style:italic;
  margin:0;
  line-height:1.6;
}

/* Align section headers flush-left inside section-pad on about page */
.ba-jury-section .section-header,
.ba-history-section .section-header{padding:0}

/* Jury */
.ba-jury-section{border-top:1px solid var(--border)}
.ba-jury-intro{
  font-size:clamp(14px,1.05vw,17px);
  color:var(--fg-light);
  max-width:60ch;
  margin:0 0 clamp(24px,2.5vw,40px);
}
.ba-jury-grid{
  list-style:none;
  margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(24px,2.5vw,40px) clamp(48px,6vw,96px);
}
.ba-jury-grid li{
  display:flex;
  flex-direction:column;
  gap:.2em;
  padding-bottom:clamp(12px,1.2vw,18px);
  border-bottom:1px solid var(--border);
}
.ba-jury-name{
  font-size:clamp(14px,1vw,16px);
  font-weight:600;
  color:var(--fg);
}
.ba-jury-role{
  font-size:clamp(11px,.8vw,13px);
  color:var(--fg-light);
  line-height:1.45;
}

/* ── Student Quote Slider ────────────────────────────────── */
.student-quote-section{
  padding:clamp(60px,6vw,100px) clamp(32px,4vw,60px) clamp(40px,4vw,64px);
  margin:0 var(--pad) clamp(48px,6vw,96px);
  background:var(--blue);
  border-radius:4px;
  overflow:hidden;
}
.student-quote-track{
  display:grid; /* grid stacking: all slides in the same cell */
}
/* Stack all slides in grid cell 1/1 so container height = tallest slide */
.student-quote-slide{
  grid-area:1/1;
  opacity:0;
  pointer-events:none;
  transition:opacity .4s ease;
}
.student-quote-slide.active{
  opacity:1;
  pointer-events:auto;
}
@keyframes sq-fade{from{opacity:0}to{opacity:1}}
.sq-dots{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:center;
  margin-top:clamp(24px,2.5vw,36px);
}
.sq-dot{
  background:rgba(255,255,255,.3);
  border:none;
  width:8px;height:8px;
  border-radius:50%;
  cursor:pointer;
  padding:0;
  transition:background .2s,transform .2s;
}
.sq-dot.active{background:#fff;transform:scale(1.25)}
.student-quote-inner{
  max-width:1000px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:clamp(40px,5vw,80px);
}
.student-quote-img{
  flex:0 0 clamp(120px,14vw,180px);
}
.student-quote-img img{
  width:clamp(120px,14vw,180px);
  height:clamp(120px,14vw,180px);
  border-radius:50%;
  object-fit:cover;
  object-position:top;
  display:block;
  border:3px solid rgba(255,255,255,.2);
}
.student-quote-content{flex:1}
.student-bq{margin:0;padding:0;border:none}
.student-bq-text{
  font-size:clamp(18px,1.5vw,24px);
  font-style:italic;
  font-weight:400;
  line-height:1.55;
  color:#fff;
  margin:0 0 1.2em;
}
.student-bq-attr{
  display:flex;
  flex-direction:column;
  gap:.2em;
}
.student-bq-name{
  font-size:clamp(14px,1vw,16px);
  font-weight:700;
  color:#fff;
  letter-spacing:.04em;
}
.student-bq-role{
  font-size:clamp(11px,.8vw,13px);
  font-weight:500;
  color:rgba(255,255,255,.6);
  text-transform:uppercase;
  letter-spacing:.08em;
}
@media(max-width:600px){
  .student-quote-inner{flex-direction:column;text-align:center;align-items:center}
  .student-bq-attr{align-items:center}
}


.about-grid{
  padding:0 var(--pad);
  display:flex;gap:clamp(40px,5vw,80px);align-items:flex-start;
}
.about-grid .about-right{flex:1;min-width:0}
.about-logos-sidebar{
  display:flex;flex-direction:row;align-items:center;
  gap:clamp(12px,1.5vw,24px);
  padding-top:clamp(8px,1vw,16px);
  flex-shrink:0;
  margin-left:clamp(32px,8vw,128px);
}
.about-soa-logo{
  height:clamp(115px,12vw,179px);width:auto;max-width:100%;
}
.about-dsl-logo{
  height:clamp(96px,10.4vw,154px);width:auto;max-width:100%;
}
/* Safari: SVGs ignore height clamp — cap with max-height */
@supports (-webkit-touch-callout:none),(-webkit-appearance:none) and (not (overflow:-webkit-marquee)){
  .about-soa-logo{max-height:179px}
  .about-dsl-logo{max-height:154px}
  .sub-mission .about-soa-logo{max-height:131px;height:131px}
  .sub-mission .about-dsl-logo{max-height:113px;height:113px}
}
@media(max-width:900px){
  .about-grid{flex-direction:column}
  .about-logos-sidebar{
    justify-content:center;
    width:100%;margin-left:0;
    margin-top:clamp(20px,4vw,32px);
    gap:clamp(20px,5vw,40px);
  }
  .about-soa-logo{height:auto !important;width:38%;max-height:none !important}
  .about-dsl-logo{height:auto !important;width:28%;max-height:none !important}
}
.about-text-only .about-body-row{
  display:flex;align-items:center;gap:clamp(32px,5vw,80px);
}
.about-text-only .about-lead{
  flex:1;
  font-size:clamp(17px,1.5vw,24px);font-weight:500;line-height:1.6;
  color:var(--fg);margin:0;
}
.about-text-only .btn-read-more{flex-shrink:0}
@media(max-width:600px){
  .about-text-only .about-body-row{flex-direction:column;align-items:flex-start;gap:16px}
  .about-grid{margin-bottom:5px}
}

/* ── Timeline ── */
.timeline-section{border-top:1px solid rgba(0,20,249,.12)}
.timeline-header{
  padding:0 var(--pad) clamp(32px,4vw,56px);
}
.timeline-header h2{font-size:clamp(20px,2vw,32px)}
.timeline{
  padding:0 var(--pad);
  position:relative;
}
/* Vertical rule */
.timeline::before{
  content:'';
  position:absolute;
  top:0;bottom:0;
  left:calc(var(--pad) + clamp(56px,6vw,100px) + clamp(16px,2vw,32px));
  width:1px;
  background:rgba(0,20,249,.18);
}
.timeline-item{
  display:grid;
  grid-template-columns:clamp(56px,6vw,100px) clamp(32px,3vw,48px) 1fr;
  align-items:start;
  gap:0;
  padding-bottom:clamp(24px,3vw,44px);
  /* scroll animation */
  opacity:0;
  transform:translateY(20px);
  transition:opacity .5s ease, transform .5s ease;
}
.timeline-item.visible{
  opacity:1;
  transform:translateY(0);
}
.timeline-year{
  font-size:clamp(12px,.85vw,15px);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--blue);
  padding-top:.15em;
  text-align:right;
  padding-right:clamp(16px,2vw,32px);
  white-space:nowrap;
}
.timeline-bar{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-top:.35em;
}
.timeline-dot{
  width:9px;height:9px;
  border-radius:50%;
  background:var(--blue);
  flex-shrink:0;
}
.timeline-text{
  font-size:clamp(15px,1.1vw,19px);
  line-height:1.6;
  color:var(--fg);
  padding-left:clamp(16px,2vw,32px);
}
@media(max-width:600px){
  .timeline::before{left:calc(20px + clamp(48px,15vw,72px) + 24px)}
  .timeline-item{grid-template-columns:clamp(48px,15vw,72px) 24px 1fr}
}

.awards-banner{
  position:relative;overflow:hidden;
  margin:0 var(--pad);
}
.awards-banner img{width:100%;aspect-ratio:16/7;object-fit:cover}
.awards-banner .overlay{
  position:absolute;inset:0;
  background:rgba(0,20,249,.5);
  display:flex;padding:var(--pad);
  gap:var(--pad);align-items:flex-end;
}
.awards-banner .overlay h2{color:#fff;flex:1}
.awards-banner .overlay .award-info{
  color:#fff;text-align:right;
  font-size:clamp(13px,1vw,18px);line-height:1.4;
}
.awards-banner .overlay .award-info .join-btn{
  display:inline-block;margin-top:.5em;padding:8px 20px;
  background:#fff;color:var(--blue);font-weight:600;
  font-size:clamp(12px,.9vw,15px);
}

/* solid awards banner (no image) */
.awards-banner--solid{
  background:var(--blue);
  border-radius:4px;
}
.awards-banner-content{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:clamp(32px,4vw,64px);
  padding:clamp(40px,5vw,72px) clamp(32px,4vw,60px);
}
.awards-banner-left{flex:1}
.awards-edition{
  font-size:clamp(11px,.8vw,13px);
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.6);
  margin:0 0 .6em;
  max-width:none;
}
h2.awards-title,.awards-title{
  font-size:clamp(28px,3.5vw,56px);
  font-weight:700;
  color:#fff;
  line-height:1.1;
  margin:0 0 .5em;
}
.awards-date{
  font-size:clamp(14px,1.1vw,18px);
  color:rgba(255,255,255,.85);
  margin:0;
  max-width:none;
}
.awards-banner-right{
  flex:0 0 auto;
  text-align:right;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:clamp(12px,1.2vw,18px);
}
.awards-presenters-label{
  font-size:clamp(10px,.75vw,12px);
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin:0;
  max-width:none;
}
.awards-presenters{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:.2em;
}
.awards-presenters li{
  font-size:clamp(13px,1vw,16px);
  color:#fff;
  font-weight:500;
}
.btn-rsvp{
  display:inline-block;
  padding:clamp(10px,.8vw,14px) clamp(22px,2vw,32px);
  background:#fff;
  color:var(--blue);
  font-weight:700;
  font-size:clamp(12px,.9vw,15px);
  letter-spacing:.05em;
  text-decoration:none;
  border-radius:2px;
  transition:opacity .2s;
}
.btn-rsvp:hover{opacity:.88}
@media(max-width:700px){
  .awards-banner-content{flex-direction:column;align-items:flex-start}
  .awards-banner-right{align-items:flex-start;text-align:left}
}

/* ═══ PROMO BANNER (from block editor) ═══ */
.promo-banner{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:clamp(32px,4vw,64px);
  padding:clamp(40px,5vw,72px) clamp(32px,4vw,60px);
  border-radius:4px;
  margin:clamp(32px,3vw,56px) 0;
  color:#fff;
  width:100%;
  box-sizing:border-box;
}
.promo-left{flex:1}
.promo-label{
  font-size:clamp(11px,.8vw,13px);
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.6);
  margin:0 0 .6em;
  max-width:none;
}
h2.promo-title,.promo-title{
  font-size:clamp(28px,3.5vw,56px);
  font-weight:700;
  color:#fff;
  line-height:1.1;
  margin:0 0 .5em;
  max-width:none;
}
.promo-subtitle{
  font-size:clamp(14px,1.1vw,18px);
  color:rgba(255,255,255,.85);
  margin:0;
  max-width:none;
}
.promo-right{
  flex:0 0 auto;
  text-align:right;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:clamp(12px,1.2vw,18px);
}
.promo-right-label{
  font-size:clamp(10px,.75vw,12px);
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin:0;
  max-width:none;
}
.promo-names{display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.promo-name{
  font-size:clamp(13px,1vw,16px);
  color:#fff;
  font-weight:500;
}
.promo-cta{
  display:inline-block;
  padding:clamp(10px,.8vw,14px) clamp(22px,2vw,32px);
  background:#fff;
  color:#111;
  font-weight:700;
  font-size:clamp(12px,.9vw,15px);
  letter-spacing:.05em;
  text-decoration:none;
  border-radius:2px;
  margin-top:clamp(8px,.6vw,12px);
  transition:opacity .2s;
}
.promo-cta:hover{opacity:.88}
@media(max-width:700px){
  .promo-banner{flex-direction:column;align-items:flex-start}
  .promo-right{align-items:flex-start;text-align:left}
}
/* Constrain promo banner to text column width in article/detail context */
.detail-body .promo-banner,
.article-content .promo-banner{max-width:72ch}

/* Override .detail-body and .article-content scoped rules that conflict with promo-banner */
.detail-body .promo-banner h2,
.article-content .promo-banner h2,
.detail-body h2.promo-title,
.article-content h2.promo-title,
.detail-body .promo-title,
.article-content .promo-title{
  font-size:clamp(28px,3.5vw,56px);font-weight:700;color:#fff;
  line-height:1.1;margin:0 0 .5em;max-width:none;
}
.detail-body .promo-banner p,
.article-content .promo-banner p,
.detail-body .promo-label,
.article-content .promo-label,
.detail-body .promo-subtitle,
.article-content .promo-subtitle,
.detail-body .promo-right-label,
.article-content .promo-right-label{
  max-width:none;color:inherit;line-height:inherit;margin-bottom:0;
}
.detail-body .promo-banner li,
.article-content .promo-banner li{font-size:clamp(13px,1vw,16px);color:#fff;margin-bottom:0;line-height:inherit}
.detail-body .promo-banner a:not(.promo-cta),
.article-content .promo-banner a:not(.promo-cta){color:#fff;text-decoration:none}

.subscribe-row{
  display:flex;gap:var(--pad);padding:0 var(--pad);flex-wrap:wrap;align-items:flex-end;
}
.subscribe-row .sub-cards{display:flex;flex-direction:column;gap:clamp(8px,.6vw,12px);flex:1;min-width:200px}
.subscribe-row .sub-mission{flex:1;min-width:280px;display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.sub-mission .about-logos-sidebar{
  padding-top:clamp(34px,4.2vw,58px);
  margin-right:clamp(24px,8vw,96px);
}
.sub-mission .about-soa-logo{height:clamp(85px,8.9vw,131px)}
.sub-mission .about-dsl-logo{height:clamp(71px,7.6vw,113px)}

/* ═══ UTILITIES ═══ */
.container{width:100%;padding:0 var(--pad)}
.section-pad{padding:clamp(24px,3vw,48px) var(--pad)}
.text-blue{color:var(--blue)}
.text-center{text-align:center}
.fade-in{opacity:0;transform:translateY(20px);transition:opacity .6s,transform .6s}
.fade-in.visible{opacity:1;transform:translateY(0)}

/* ═══ RESPONSIVE ═══ */
@media(max-width:700px){
  .mega-footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,56px) clamp(20px,5vw,40px)}
  .mega-footer-ctas{grid-column:1/-1;flex-direction:row;align-items:flex-start;gap:8px}
  .cta-card{flex:1;padding:12px;font-size:12px;min-height:0}
  .cta-card .arrow{font-size:14px;margin-top:.15em}
  .cta-card.lime{margin-bottom:clamp(24px,3vw,48px)}
  .detail-meta{flex-direction:column;gap:clamp(16px,2vw,24px)}
  .about-pillars{grid-template-columns:1fr!important}
  .team-grid{grid-template-columns:repeat(2,1fr)!important}
}

/* ═══ ABOUT PAGE ═══ */
.about-pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(16px,2vw,32px);padding:0 var(--pad)}
.about-pillar{background:rgba(0,20,249,.04);padding:clamp(20px,2vw,32px);border-left:3px solid var(--blue)}
.about-pillar h4{margin-bottom:.4em}
.about-pillar p{font-size:clamp(16px,1.05vw,17px);color:var(--fg);line-height:1.65}

/* ═══ TEAM PAGE ═══ */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:clamp(16px,2vw,32px);padding:0 var(--pad)}
.team-card{text-align:center}
.team-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;margin-bottom:.5em;filter:grayscale(.2)}
.team-card .name{font-weight:600;font-size:clamp(13px,1vw,16px);color:var(--dark)}
.team-card .role{font-size:clamp(11px,.75vw,13px);color:var(--blue)}
.team-card .bio{font-size:clamp(11px,.7vw,12px);color:var(--fg);line-height:1.4;margin-top:.3em}

/* ─── Team Jump Nav ─── */
.team-jumpnav{
  display:flex;gap:clamp(6px,.5vw,10px);
  padding:0 var(--pad) clamp(16px,2vw,32px);
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:var(--blue) transparent;
  border-bottom:1px solid rgba(0,20,249,.12);
}
.team-jumpnav::-webkit-scrollbar{height:3px}
.team-jumpnav::-webkit-scrollbar-thumb{background:var(--blue);border-radius:2px}
.jump-thumb{
  flex:0 0 auto;width:clamp(40px,4vw,56px);height:clamp(40px,4vw,56px);
  border-radius:50%;overflow:hidden;
  border:2px solid transparent;transition:all .2s;
  opacity:.7;
}
.jump-thumb:hover{opacity:1;border-color:var(--blue);transform:scale(1.1)}
.jump-thumb img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;background:#d8d8d6}

/* ─── Team Profile Sections ─── */
.team-profiles{padding:0 var(--pad)}
.team-profile{
  display:flex;gap:clamp(20px,3vw,48px);
  padding:clamp(24px,3vw,48px) 0;
  border-bottom:1px solid rgba(0,20,249,.08);
  scroll-margin-top:80px;
}
.team-profile:last-child{border-bottom:none}
.tp-photo{
  flex:0 0 auto;
  width:clamp(120px,14vw,220px);
}
.tp-photo img{
  width:100%;aspect-ratio:1;object-fit:cover;object-position:center top;
  border-radius:4px;filter:grayscale(.15);background:#d8d8d6;
  transition:filter .3s;
}
.team-profile:hover .tp-photo img{filter:grayscale(0)}
.tp-info{flex:1;min-width:0}
.tp-info h6{margin-bottom:.2em}
.tp-faculty{font-size:clamp(12px,.85vw,14px);color:var(--fg-light);margin:0 0 .4em;font-style:italic}
.tp-info h3{margin-bottom:.5em;font-weight:600}
.member-faculty{font-size:11px;color:var(--fg-light);font-style:italic;margin-top:2px}
.tp-info p{
  font-size:clamp(16px,1.05vw,17px);color:var(--fg);
  line-height:1.65;max-width:65ch;
}
.tp-social{
  display:flex;gap:clamp(12px,1vw,20px);
  margin-top:clamp(10px,1vw,16px);
}
.tp-social a{
  font-size:clamp(12px,.85vw,14px);
  color:var(--blue);font-weight:600;
  text-decoration:underline;text-underline-offset:3px;
  transition:opacity .15s;
}
.tp-social a:hover{opacity:.6}
@media(max-width:600px){
  .team-profile{flex-direction:column;gap:clamp(12px,2vw,20px)}
  .tp-photo{width:clamp(100px,30vw,160px)}
}

/* ═══ HERO TYPES (detail + article pages) ═══ */

/* Article image hero — taller than award hero */
.art-hero{
  width:100%;
  min-height:60vh;
  max-height:85vh;
  overflow:hidden;
  background:#1a1a2e;
}
.art-hero img{
  width:100%;height:100%;
  min-height:60vh;
  max-height:85vh;
  object-fit:cover;
  display:block;
}

/* Award full-width image hero */
.hero-img-wrap{
  width:100%;
  max-height:75vh;
  overflow:hidden;
  background:#1a1a2e;
}
.hero-img-wrap img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  max-height:75vh;
}

/* ── Audio block ── */
.body-audio{
  margin:clamp(24px,3vw,48px) 0;
}
.body-audio audio{
  width:100%;
  max-width:72ch;
  display:block;
}
.body-audio--soundcloud iframe{
  display:block;
  width:100%;
  height:166px;
  border:none;
}
.body-audio .audio-caption{
  font-size:clamp(13px,.9vw,15px);
  color:var(--fg-light);
  margin-top:8px;
  max-width:72ch;
}

/* Video embed hero (YouTube/Vimeo iframes) */
.hero-video-wrap{
  width:100%;
  background:#000;
}
.hero-video-inner{
  position:relative;
  padding-bottom:56.25%; /* 16:9 */
  height:0;
  max-width:1400px;
  margin:0 auto;
}
.hero-video-inner iframe{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  border:0;
}

/* Video slide items inside slider */
.slide-video-item {
  position:relative;
  width:100%;
  aspect-ratio:16/9;
}
.slide-vid-thumb {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background:center/cover no-repeat #111;
  display:flex;
  align-items:center;
  justify-content:center;
}
.slide-play-btn {
  background:rgba(0,0,0,.5);
  border:3px solid rgba(255,255,255,.8);
  border-radius:50%;
  width:72px;height:72px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:background .2s,transform .2s;
}
.slide-play-btn:hover {
  background:rgba(0,0,0,.7);
  transform:scale(1.08);
}
/* Slider thumb strip — video items with no thumbnail */
.slider-thumb[data-video] {
  background:#111;
}

/* Local uploaded video hero — full viewport */
.hero-local-video-wrap{
  position:relative;
  width:100%;
  height:100vh;
  background:#000;
  overflow:hidden;
}
.hero-local-video-wrap video{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  object-fit:cover;
}
/* Custom play button overlay */
.hero-play-btn{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:88px;height:88px;
  border-radius:50%;
  background:rgba(0,0,0,.55);
  border:3px solid rgba(255,255,255,.85);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:background .2s,transform .2s;
  z-index:10;
}
.hero-play-btn:hover{
  background:rgba(0,0,0,.75);
  transform:translate(-50%,-50%) scale(1.08);
}
.hero-play-btn svg{
  width:36px;height:36px;
  fill:#fff;
  margin-left:5px; /* optical centre for triangle */
}
.hero-local-video-wrap.playing .hero-play-btn{
  display:none;
}

/* Image slider hero */
/* ── Hero Slider ─────────────────────────────────────────────────────────── */
.hero-slider{
  width:100%;
  position:relative;
}
.slider-track{
  width:100%;
  position:relative;
}
.slider-track .slide{
  position:absolute;
  top:0;left:0;right:0;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}
.slider-track .slide.active{
  position:relative;
  opacity:1;
  pointer-events:auto;
}
.slider-track .slide img{
  width:100%;height:auto;
  display:block;
}

/* ── Filmstrip bar — overlaid at bottom of image ─────────────────────────── */
.slider-bar{
  position:absolute;bottom:0;left:0;right:0;
  display:flex;
  align-items:flex-end;
  gap:12px;
  padding:clamp(32px,6vw,72px) clamp(16px,3vw,48px) clamp(12px,1.5vw,20px);
  background:linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.72) 100%);
  pointer-events:none;
}
.slider-thumbs{
  display:flex;
  gap:4px;
  flex:1;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  pointer-events:all;
}
.slider-thumbs::-webkit-scrollbar{display:none}
.slider-thumb{
  flex:0 0 auto;
  width:clamp(40px,5vw,64px);
  aspect-ratio:4/3;
  min-height:48px;
  border:2px solid rgba(255,255,255,.25);
  border-radius:2px;
  padding:0;cursor:pointer;
  overflow:hidden;
  background:rgba(0,0,0,.3);
  opacity:.55;
  transition:opacity .2s,border-color .2s;
  pointer-events:all;
}
.slider-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.slider-thumb:hover{opacity:.85;border-color:rgba(255,255,255,.6)}
.slider-thumb.active{opacity:1;border-color:#fff}

/* ── Counter + arrows ────────────────────────────────────────────────────── */
.slider-controls{
  display:flex;align-items:center;gap:8px;flex-shrink:0;pointer-events:all;
}
.slider-counter{
  font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.6);
  font-weight:600;white-space:nowrap;min-width:3em;text-align:center;
}
.slider-btn,
.slider-arrow{
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.25);
  color:rgba(255,255,255,.85);
  width:36px;height:36px;border-radius:2px;
  font-size:22px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,border-color .15s;
  padding:0;flex-shrink:0;pointer-events:all;
}
.slider-btn:hover,
.slider-arrow:hover{background:rgba(0,0,0,.6);border-color:rgba(255,255,255,.7)}

/* ═══ DETAIL PAGE — related ═══ */
.related-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:clamp(8px,.8vw,16px);
  padding:0 var(--pad);
}
@media(max-width:900px){.related-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.related-grid{grid-template-columns:repeat(2,1fr)}}

.related-card{
  display:block;text-decoration:none;
  transition:opacity .2s;
}
.related-card:hover{opacity:.8}
.related-img{overflow:hidden;background:#d0d0d0}
.related-img img{
  width:100%;aspect-ratio:4/3;
  object-fit:cover;display:block;
  transition:transform .4s;
}
.related-card:hover .related-img img{transform:scale(1.04)}
.related-img.placeholder{aspect-ratio:4/3;background:var(--blue);opacity:.15}
.related-title{
  font-size:clamp(12px,.9vw,15px);
  color:var(--blue);font-weight:600;
  margin-top:.4em;line-height:1.3;
}
.related-year{
  font-size:clamp(10px,.7vw,12px);
  color:var(--fg);margin-top:.15em;
}

/* ═══ ARTICLE DETAIL PAGE ═══ */
.article-subtitle{
  font-size:clamp(16px,1.4vw,24px);
  color:var(--fg);line-height:1.4;
  max-width:70ch;
  padding:0 var(--pad);
  margin-top:.5em;
}
.article-byline{
  display:flex;align-items:center;
  gap:8px;
  padding:clamp(8px,.8vw,14px) var(--pad);
  font-size:clamp(12px,.85vw,14px);
  color:var(--fg);
  border-bottom:1px solid rgba(0,20,249,.12);
}
.byline-sep{color:var(--blue);margin:0 4px}
.article-body{
  display:grid;
  grid-template-columns:1fr 320px;
  gap:clamp(24px,3vw,48px);
  padding:clamp(24px,3vw,48px) var(--pad);
  align-items:start;
}
.article-body.no-sidebar{
  grid-template-columns:1fr;
  max-width:800px;
}
.article-content p{
  font-size:clamp(18px,1.2vw,20px);
  line-height:1.8;color:var(--fg);
  margin-bottom:1.4em;max-width:70ch;
}
.article-content h2{
  font-size:clamp(24px,2.2vw,40px);
  margin:1.5em 0 .5em;
}
.article-content h3{
  font-size:clamp(18px,1.6vw,28px);
  margin:1.2em 0 .4em;
}
.article-content img{
  width:100%;margin:1.5em 0;
  display:block;
}
.article-content blockquote{
  border-left:3px solid var(--blue);
  padding-left:clamp(16px,2vw,24px);
  margin:1.5em 0;
  font-size:clamp(16px,1.2vw,20px);
  color:var(--blue);font-style:normal;
  max-width:70ch;
}
.article-sidebar{
  position:sticky;top:80px;
}
.pull-quote{
  border-left:3px solid var(--blue);
  padding:clamp(16px,2vw,24px);
  background:rgba(0,20,249,.04);
}
.pull-quote p{
  font-size:clamp(16px,1.3vw,22px);
  color:var(--blue);font-weight:600;
  line-height:1.4;font-style:normal;
  margin-bottom:.5em;
  max-width:none;
}
.pull-quote cite{
  font-size:clamp(12px,.85vw,14px);
  color:var(--fg);font-style:normal;
  font-weight:600;
}
@media(max-width:900px){
  .article-body{grid-template-columns:1fr}
  .article-sidebar{position:static}
}

/* ═══ MOBILE NAV ═══ */
@media(max-width:600px){
  .topnav-link.hide-tablet{display:none}
}
@media(max-width:900px){
  .topnav-link.hide-tablet{display:none}
}

/* ═══ DETAIL PAGE MOBILE ═══ */
@media(max-width:600px){
  .detail-back,.detail-title,.detail-meta,.detail-body{padding-left:20px;padding-right:20px}
  #launch-btn-wrap{margin-left:0 !important}
  .detail-body img.jury-prize-seal{float:none;width:clamp(120px,40vw,160px);max-width:100%;margin:0 auto 24px}
  .related-grid{grid-template-columns:repeat(2,1fr)}
  .slider-thumbs{display:none}
  .article-body{grid-template-columns:1fr}
  .article-sidebar{display:none}
  .mega-footer-wordmark{font-size:clamp(48px,18vw,100px)}

  /* Pull Quote: smaller on mobile, no border (use Simple Quote block for mobile-friendly quotes) */
  .detail-body blockquote:not(.bq-simple):not(.bq-epigraph){
    border-left:none;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .detail-body blockquote:not(.bq-simple) .bq-text{
    font-size:clamp(15px,4vw,17px);
    color:var(--blue);
  }
  .article-content blockquote:not(.bq-simple){
    border-left:none;
    padding-left:0;
    font-size:clamp(15px,4vw,17px);
  }
  /* Media Quote: 30% smaller than standard mobile pull quote */
  .detail-body blockquote.bq-media .bq-text,
  .article-content blockquote.bq-media .bq-text{
    font-size:clamp(11px,2.8vw,12px);
  }
}

/* ═══ SEARCH MODAL ═══ */
.search-modal{
  position:fixed;inset:0;z-index:700;
  background:rgba(237,237,236,.96);
  backdrop-filter:blur(10px);
  display:flex;flex-direction:column;align-items:center;
  padding:15vh var(--pad) 0;
  opacity:0;pointer-events:none;
  transition:opacity .18s ease;
}
.search-modal.open{opacity:1;pointer-events:auto}
.search-modal-inner{width:100%;max-width:700px}
.search-input-row{
  display:flex;align-items:center;gap:12px;
  border-bottom:2px solid var(--blue);
  padding-bottom:14px;margin-bottom:28px;
}
.search-input-icon{
  width:22px;height:22px;flex-shrink:0;
  stroke:var(--blue);fill:none;stroke-width:2;
}
.search-input{
  flex:1;border:none;background:none;outline:none;
  font-family:var(--sans);font-size:clamp(20px,2.5vw,28px);
  font-weight:500;color:var(--dark);
}
.search-input::placeholder{color:rgba(74,74,90,.35)}
.search-overlay-close{
  position:absolute;top:20px;right:24px;
  background:none;border:none;cursor:pointer;
  font-size:22px;color:var(--fg);opacity:.45;
  padding:6px 10px;transition:opacity .15s;
  line-height:1;
}
.search-overlay-close:hover{opacity:1}
.search-clear-btn{
  background:none;border:none;cursor:pointer;
  font-size:16px;color:var(--fg);opacity:.4;
  padding:4px 6px;transition:opacity .15s;
  flex-shrink:0;line-height:1;
}
.search-clear-btn:hover{opacity:.8}
.search-hint{
  font-size:12px;color:var(--fg);opacity:.4;
  text-align:right;margin-bottom:8px;
}
.search-results{max-height:55vh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.search-loading,.search-empty{
  padding:20px 0;font-size:15px;color:var(--fg);opacity:.55;
}
.search-result{
  display:grid;grid-template-columns:48px 1fr;gap:12px;
  align-items:start;
  padding:14px 0;
  border-bottom:1px solid rgba(0,20,249,.1);
  text-decoration:none;color:inherit;
  transition:background .12s;
}
.search-result:hover{background:rgba(0,20,249,.04);margin:0 -12px;padding:14px 12px}
.search-result:last-child{border-bottom:none}
.search-result-thumb{
  width:48px;height:48px;object-fit:cover;
  display:block;background:rgba(0,20,249,.08);
  flex-shrink:0;
}
.search-result-thumb-empty{
  width:48px;height:48px;
  background:rgba(0,20,249,.08);flex-shrink:0;
}
.search-result-body{min-width:0}
.search-result-top{
  display:flex;align-items:center;gap:8px;margin-bottom:3px;
}
.search-result-type{
  font-size:10px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;padding:2px 6px;
}
.search-result-type--breakthrough{background:var(--blue);color:#fff}
.search-result-type--article{background:var(--lime);color:var(--dark)}
.search-result-title{
  font-size:clamp(14px,1.1vw,16px);font-weight:600;
  color:var(--dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.search-result-sub{
  font-size:12px;color:var(--fg);opacity:.6;margin-bottom:4px;
}
.search-result-excerpt{
  font-size:13px;color:var(--fg);line-height:1.5;
}
.search-result-excerpt mark{
  background:rgba(0,20,249,.15);color:var(--blue);
  font-weight:600;border-radius:2px;padding:0 2px;
}
@media(max-width:600px){
  .search-modal{
    padding-top:0;
    justify-content:flex-start;
    align-items:stretch;
  }
  .search-modal-inner{
    padding:16px 16px 0;
    width:100%;
    max-width:100%;
  }
  .search-results{max-height:calc(100vh - 140px)}
  .search-result{grid-template-columns:40px 1fr}
  .search-result-thumb,.search-result-thumb-empty{width:40px;height:40px}
}

/* ═══ PROGRAMS PAGE ═══ */
.courses-grid{
  padding:0 var(--pad);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:start;
}

/* ═══ MOBILE — No float wrapping, single column ═══ */
@media(max-width:600px){
  /* Remove all float wrapping in content bodies — images always stack full-width */
  .body-image--float,
  .detail-body figure,
  .detail-body .body-image,
  .article-body figure,
  .article-body .body-image {
    float:none !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    clear:both;
  }
  /* Jury / contributor grid: 2-col → 1-col */
  .ba-jury-grid{grid-template-columns:1fr}
  /* Case-study photo grid: 3-col → 2-col */
  .cs-photo-grid{grid-template-columns:repeat(2,1fr)}
  /* Subscribe row: stack + left-align */
  .subscribe-row{flex-direction:column}
  .subscribe-row .sub-mission{align-items:flex-start;text-align:left}
  .sub-mission .about-logos-sidebar{padding-top:0;margin-right:0}
  .sub-mission .about-soa-logo{height:auto !important;width:38%;max-height:none !important}
  .sub-mission .about-dsl-logo{height:auto !important;width:28%;max-height:none !important}
  /* Programs: courses grid → 1-col, tighten gap to match card spacing */
  .courses-grid{grid-template-columns:1fr !important;gap:16px !important}
}
