/* ============================================================
   THE PIANO SOCIETY AT NYU — v3
   Multi-view router · triggered top bar · day/night toggle
   Bolder, more iconic Washington Square Arch line-art
   ============================================================ */
:root{
  --paper:#FFFFFF;
  --paper-2:#FFFFFF;
  --ink:#191919;
  --violet:#57068C;
  --violet-deep:#191919;
  --plum:#47105F;
  --violet-2:#6C1AA3;
  --accent:#8F35C8;
  --electric:#A855F7;
  --stone:#9A78AE;
  --dusty:#B89AC8;
  --lilac:#DCC9E8;
  --line:#DCC9E8;
  --line-strong:#B89AC8;
  --card:#FFFFFF;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Archivo", system-ui, sans-serif;
  --mono:"Space Mono", ui-monospace, monospace;
  --gutter:clamp(1.25rem, 4vw, 4rem);
  --ease-key:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-y:scroll;scrollbar-gutter:stable;scrollbar-color:rgba(87,6,140,.82) transparent}
html::-webkit-scrollbar{width:12px}
html::-webkit-scrollbar-track{background:transparent}
html::-webkit-scrollbar-thumb{background:rgba(87,6,140,.82);background-clip:content-box;border:3px solid transparent;border-radius:99px}
html::-webkit-scrollbar-corner{background:transparent}
html.instant-scroll{scroll-behavior:auto!important}
body{
  background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:1rem;line-height:1.6;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  transition:background .5s ease, color .5s ease;
}
::selection{background:var(--violet);color:var(--paper)}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;cursor:pointer;color:inherit}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px}
.skip-link{position:fixed;top:.75rem;left:.75rem;z-index:200;padding:.75rem 1rem;background:#FFFFFF;color:var(--violet);font:700 .85rem/1.2 var(--sans);transform:translateY(-200%);border:2px solid var(--violet);border-radius:4px}
.skip-link:focus{transform:none}
main:focus{outline:none}

.eyebrow{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--violet);display:flex;align-items:center;gap:1rem;
}
.eyebrow::after{content:"";height:1px;width:3.5rem;background:var(--line-strong)}
.mono{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase}
.serif-i{font-family:var(--serif);font-style:italic;font-weight:400}

/* ============================================================
   THE ARCH — shared line-art (bolder, more iconic)
   ============================================================ */
.arch path, .arch circle{stroke:var(--violet);fill:none;stroke-linecap:round;stroke-linejoin:round}
.arch .s4{stroke-width:4.6}
.arch .s3{stroke-width:3}
.arch .s2{stroke-width:2}
.arch .s1{stroke-width:1.2}
.arch .fv{fill:var(--violet);stroke:none}

/* ============================================================
   INTRO — drawn arch over a keyboard, flown through
   ============================================================ */
#intro{position:fixed;inset:0;z-index:100;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:var(--violet);transition:opacity .8s ease}
#intro.gone{display:none}
.intro-arch{
  position:relative;z-index:3;
  width:min(60vh,80vw);
  transform-origin:50% 60%;
  transition:transform 1.15s cubic-bezier(.7,0,.9,.4), opacity .9s ease .25s;
  filter:drop-shadow(0 24px 60px rgba(53,2,79,.35));
}
.intro-arch path, .intro-arch circle{stroke:var(--paper)}
.intro-arch .fv{fill:var(--paper);stroke:none}
.intro-arch path, .intro-arch circle{
  stroke-dasharray:1;stroke-dashoffset:1;
  animation:draw 1s var(--ease-key) forwards;
}
.intro-arch .fv{animation:pop .5s var(--ease-key) forwards;opacity:0;transform-origin:center}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
.intro-arch .d0{animation-delay:.05s}.intro-arch .d1{animation-delay:.16s}
.intro-arch .d2{animation-delay:.28s}.intro-arch .d3{animation-delay:.4s}
.intro-arch .d4{animation-delay:.52s}.intro-arch .d5{animation-delay:.64s}
.intro-arch .d6{animation-delay:.76s}.intro-arch .d7{animation-delay:.88s}
.intro-arch .d8{animation-delay:1s}.intro-arch .d9{animation-delay:1.12s}
.intro-caption{
  position:absolute;bottom:8vh;left:0;right:0;z-index:3;text-align:center;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:var(--paper);
  transition:opacity .4s ease;
}
.intro-caption strong{color:var(--lilac)}
#skipIntro{
  position:absolute;top:1.4rem;right:1.6rem;z-index:5;
  background:none;border:1px solid rgba(255,255,255,.6);padding:.45rem .9rem;border-radius:99px;color:var(--paper);
  font-family:var(--mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;transition:all .25s ease;
}
#skipIntro:hover{background:var(--paper);border-color:var(--paper);color:var(--violet)}
#intro.zoom .intro-arch{transform:scale(42);opacity:0}
#intro.zoom .intro-caption{opacity:0}
#intro.zoom #skipIntro{opacity:0;pointer-events:none}
#intro.exit{pointer-events:none;opacity:0}

/* ============================================================
   FLOATING CONTROLS + TRIGGERED TOP BAR
   ============================================================ */
.float{
  position:fixed;top:1.1rem;z-index:70;
  opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:opacity .5s ease .2s, transform .5s var(--ease-key) .2s;
}
body.ready .float{opacity:1;transform:none;pointer-events:auto}
.float-logo{left:1.1rem;display:flex;align-items:center;gap:.75rem}
.page-tag{font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--violet);white-space:nowrap;pointer-events:none;opacity:0;transform:translateX(-6px);transition:opacity .4s ease,transform .4s var(--ease-key)}
.page-tag.show{opacity:1;transform:none}
@media(max-width:640px){.page-tag{display:none}}
.view-pad{height:clamp(4rem,7vw,5rem)}
.float-logo a{
  display:flex;align-items:center;gap:.6rem;text-decoration:none;
  background:var(--paper);border:1px solid var(--line-strong);border-radius:99px;
  padding:.4rem .9rem .4rem .45rem;
  transition:transform .2s ease, box-shadow .2s ease;
}
.float-logo a:hover{transform:translateY(2px);box-shadow:3px 3px 0 var(--lilac)}
.brand-logo{display:block;width:auto;height:2rem}
.float-logo .brand-logo{height:1.9rem}
/* logo variant by background brightness (violet on light, white on dark) */
.logo-white{display:none}
.logo-violet{display:block}
/* nav overlay + footer have inverted (dark-in-day) backgrounds */
.nav-top .logo-violet,.foot-brand .logo-violet{display:none}
.nav-top .logo-white,.foot-brand .logo-white{display:block}
.float-logo span{font-family:var(--mono);font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;line-height:1.5}
.float-right{right:1.1rem;display:flex;gap:.55rem;align-items:center;z-index:90}
body.nav-open .float-right{opacity:1;transform:none;pointer-events:auto}
#navClose{display:none}
.icon-btn{
  display:grid;place-items:center;width:2.65rem;height:2.65rem;border-radius:99px;
  background:var(--paper);border:1px solid var(--line-strong);
  transition:all .25s var(--ease-key);
}
.icon-btn:hover{background:var(--violet);border-color:var(--violet);color:var(--paper);transform:translateY(2px)}
.icon-btn svg{width:1.05rem;height:1.05rem}
#menuBtn{
  display:flex;align-items:center;gap:.7rem;
  background:var(--violet);color:var(--paper);
  border:1px solid var(--violet);border-radius:99px;
  padding:.65rem 1.25rem;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;
  transition:all .25s var(--ease-key);
}
#menuBtn:hover{background:var(--ink);border-color:var(--ink);transform:translateY(2px)}
#menuBtn .menu-ic{position:relative;width:18px;height:18px;display:grid;place-items:center}
#menuBtn .lines{display:flex;flex-direction:column;gap:4px}
#menuBtn .lines i{display:block;width:16px;height:1.6px;background:var(--paper);transition:all .3s var(--ease-key)}
#menuBtn .menu-ring{position:absolute;inset:-7px;width:32px;height:32px;transform:rotate(-90deg);opacity:0;transition:opacity .2s ease}
#menuBtn.holding .menu-ring{opacity:1}
#menuBtn .mr-track{fill:none;stroke:rgba(255,255,255,.28);stroke-width:2.4}
#menuBtn .mr-fill{fill:none;stroke:var(--paper);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:100.5;stroke-dashoffset:100.5}
#menuBtn.holding .mr-fill{stroke-dashoffset:0;transition:stroke-dashoffset 1.6s linear}

/* Triggered top bar — only visible when scrolled/triggered */
#topbar{
  position:fixed;top:0;left:0;right:0;z-index:65;
  display:flex;align-items:center;justify-content:center;gap:1rem;
  padding:.7rem calc(var(--gutter) + 3.5rem);
  background:color-mix(in srgb, var(--paper) 86%, transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  transform:translateY(-105%);
  transition:transform .5s var(--ease-key);
}
#topbar.show{transform:none}
#topbar .tb-brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
#topbar .tb-brand .brand-logo{height:1.7rem}
#topbar .tb-brand span{font-family:var(--mono);font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.4}
.tb-nav{display:flex;gap:.2rem;align-items:center}
.tb-nav a{
  text-decoration:none;position:relative;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  padding:.5rem .8rem;border-radius:99px;color:var(--ink);transition:color .2s,background .2s;
}
.tb-nav a::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.28rem;height:1.5px;background:var(--violet);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-key)}
.tb-nav a:hover{color:var(--violet)}
.tb-nav a:hover::after{transform:scaleX(1)}
.tb-nav a.current{background:var(--violet);color:var(--paper)}
.tb-nav a.current::after{display:none}
.tb-nav a.current:hover{color:var(--paper)}
.tb-right{display:flex;gap:.55rem;align-items:center}
.tb-cta{
  text-decoration:none;background:var(--violet);color:var(--paper);
  font-family:var(--mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;
  padding:.6rem 1.05rem;border-radius:99px;border:1px solid var(--violet);transition:all .22s var(--ease-key);
}
.tb-cta:hover{background:var(--ink);border-color:var(--ink);transform:translateY(2px)}
.tb-toggle{display:grid;place-items:center;width:2.3rem;height:2.3rem;border-radius:99px;background:transparent;border:1px solid var(--line-strong);transition:all .22s ease}
.tb-toggle:hover{border-color:var(--violet);color:var(--violet)}
.tb-toggle svg{width:1rem;height:1rem}
@media (max-width:900px){.tb-nav,.tb-cta{display:none}}

/* ============================================================
   NAV OVERLAY — the top layer, only when triggered
   ============================================================ */
#nav{
  position:fixed;inset:0;z-index:80;
  background:var(--violet);color:var(--paper);
  display:flex;flex-direction:column;
  clip-path:inset(0 0 100% 0);
  transition:clip-path .6s var(--ease-key);
  visibility:hidden;
}
#nav.open{clip-path:inset(0 0 0 0);visibility:visible}
.nav-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem var(--gutter);
  border-bottom:1px solid rgba(255,255,255,.3);
}
.nav-top .brand{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.nav-top .brand-logo{height:2.4rem}
.nav-top span{font-family:var(--mono);font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;line-height:1.6}
#navClose{
  background:transparent;border:1px solid var(--paper);border-radius:99px;
  padding:.6rem 1.2rem;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;
  transition:all .25s ease;
}
#navClose:hover{background:var(--paper);color:var(--violet)}
.nav-top-r{display:flex;align-items:center;gap:1rem}
.nav-hint{font-family:var(--mono);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.nav-hint b{font-size:.8rem}
#nav.locked .nav-hint{display:none}
@media (max-width:620px){.nav-hint{display:none}}
.nav-links{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 var(--gutter)}
.nav-links a{
  display:flex;align-items:baseline;gap:1.5rem;
  text-decoration:none;
  font-family:var(--serif);font-weight:500;
  font-size:clamp(1.9rem,5.4vw,3.9rem);line-height:1.04;
  padding:.5rem 0;
  border-bottom:1px solid rgba(255,255,255,.25);
  opacity:0;transform:translateY(14px);
  transition:opacity .5s ease, transform .5s var(--ease-key), padding-left .3s var(--ease-key), color .2s;
}
#nav.open .nav-links a{opacity:1;transform:none}
#nav.open .nav-links a:nth-child(1){transition-delay:.1s}
#nav.open .nav-links a:nth-child(2){transition-delay:.15s}
#nav.open .nav-links a:nth-child(3){transition-delay:.2s}
#nav.open .nav-links a:nth-child(4){transition-delay:.25s}
#nav.open .nav-links a:nth-child(5){transition-delay:.3s}
#nav.open .nav-links a:nth-child(6){transition-delay:.35s}
.nav-links a:hover{padding-left:1.2rem;color:var(--lilac)}
.nav-links a.current{padding-left:1.5rem;color:var(--paper)}
.nav-links a.current::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:6px;height:60%;background:var(--lilac);border-radius:99px}
.nav-links a{position:relative}
.nav-links a.current em{color:var(--paper)}
.nav-links a.current .hint{color:var(--lilac)}
.nav-links em{font-family:var(--mono);font-style:normal;font-size:.66rem;letter-spacing:.2em;color:var(--lilac)}
.nav-links .hint{margin-left:auto;font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.nav-bottom{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  padding:1.2rem var(--gutter) 1.6rem;
  border-top:1px solid rgba(255,255,255,.3);
  font-family:var(--mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;
}
.nav-bottom .socials{display:flex;gap:1.6rem;flex-wrap:wrap}
.nav-bottom a{text-decoration:none;color:rgba(255,255,255,.85)}
.nav-bottom a:hover{color:#FFFFFF;text-decoration:underline;text-underline-offset:4px}

/* ============================================================
   PAGE WIPE TRANSITION
   ============================================================ */
#wipe{
  position:fixed;inset:0;z-index:90;background:var(--violet);
  display:flex;align-items:center;justify-content:center;
  transform:translateX(-105%);pointer-events:none;
  transition:transform .55s var(--ease-key);
}
#wipe.cover{transform:translateX(0)}
#wipe.uncover{transform:translateX(105%);transition:transform .55s var(--ease-key)}
#wipe .wipe-mark{width:min(26vh,150px);opacity:.9}
#wipe .wipe-mark path,#wipe .wipe-mark circle{stroke:var(--paper)}
#wipe .wipe-mark .fv{fill:var(--paper)}

/* ============================================================
   VIEWS (router)
   ============================================================ */
.view{display:none}
.view.active{display:block;animation:viewIn .5s var(--ease-key)}
@keyframes viewIn{from{opacity:0}to{opacity:1}}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  min-height:92svh;display:flex;flex-direction:column;justify-content:center;gap:1.5rem;
  position:relative;padding:5rem var(--gutter) 2rem;
  max-width:1440px;margin:0 auto;
  overflow-x:clip;
}
.hero .hero-top{margin-bottom:0}
.hero .hero-meta{margin-top:1.4rem}
.hero-color{
  position:absolute;right:calc(var(--gutter) - 1rem);top:16%;
  width:min(38vw,440px);height:min(46vh,460px);pointer-events:none;
  animation:floaty 9s ease-in-out infinite;
}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.hero-color span{position:absolute;border-radius:12px;display:block}
.hero-color .hc-a{inset:0;background:var(--violet) url("brand/pattern-arch.svg") repeat;background-size:130px}
.hero-color .hc-b{right:-7%;bottom:-8%;width:62%;height:58%;background:var(--lilac)}
.hero-top{position:relative;z-index:2;max-width:34rem;margin-bottom:2.6rem}
.hero-top p{font-size:1.05rem;max-width:26rem;margin-top:1.1rem}
.hero-actions{display:flex;gap:.9rem;margin-top:1.9rem;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:.65rem;text-decoration:none;
  font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  padding:.95rem 1.5rem;border-radius:2px;border:1px solid var(--violet);
  transition:all .22s var(--ease-key);background:transparent;
}
.btn-solid{background:var(--violet);color:var(--paper)}
.btn-solid:hover{background:var(--ink);border-color:var(--ink);transform:translateY(2px)}
.btn-ghost{color:var(--violet)}
.btn-ghost:hover{background:var(--violet);color:var(--paper);transform:translateY(2px)}
.btn .arr{transition:transform .25s var(--ease-key)}
.btn:hover .arr{transform:translateX(4px)}
.hero-mega{
  position:relative;z-index:2;
  font-family:var(--serif);font-weight:500;
  font-size:clamp(3.4rem,12.5vw,12rem);
  line-height:.86;letter-spacing:-.02em;text-transform:uppercase;
  color:var(--violet);
}
.hero-mega .row{display:flex;align-items:baseline;gap:2vw;flex-wrap:wrap}
.hero-mega .at{
  font-family:var(--serif);font-style:italic;font-weight:400;text-transform:none;
  font-size:clamp(1.4rem,3.4vw,3.2rem);color:var(--ink);letter-spacing:0;
}
.hero-meta{
  position:relative;z-index:2;
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  border-top:1px solid var(--violet);
  margin-top:2.2rem;padding:1rem 0 1.1rem;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--stone);
}
.hero-meta b{color:var(--violet);font-weight:400}
.ticker{background:var(--violet);color:var(--paper);overflow:hidden;white-space:nowrap}
.ticker-in{
  display:inline-block;padding:.75rem 0;
  font-family:var(--mono);font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;
  animation:tick 30s linear infinite;
}
.ticker-in .dot{color:var(--violet);background:var(--paper);border-radius:99px;padding:0 .45rem;margin:0 1.4rem}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Home preview cards linking to other views */
.home-grid{max-width:1200px;width:calc(100% - var(--gutter)*2);margin:clamp(2.5rem,5vw,4rem) auto clamp(3rem,6vw,5rem);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.4rem)}
.home-card{
  background:var(--card);border:1px solid var(--line);padding:clamp(1.5rem,3vw,2.4rem);display:flex;flex-direction:column;gap:.7rem;min-height:15rem;
  text-decoration:none;position:relative;overflow:hidden;transition:background .3s ease,border-color .3s ease,transform .3s var(--ease-key);
}
.home-card:hover{border-color:var(--violet);transform:translateY(-3px)}
.home-card:hover{background:var(--violet);color:var(--paper)}
.home-card .hc-no{font-family:var(--mono);font-size:.6rem;letter-spacing:.24em;color:var(--violet)}
.home-card:hover .hc-no{color:var(--lilac)}
.home-card h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.05;margin-top:auto}
.home-card p{font-size:.86rem;color:var(--stone)}
.home-card:hover p{color:rgba(255,255,255,.85)}
.home-card .go{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;display:inline-flex;gap:.5rem;align-items:center}
.home-card .go .arr{transition:transform .25s var(--ease-key)}
.home-card:hover .go .arr{transform:translateX(5px)}
@media (max-width:860px){.home-grid{grid-template-columns:1fr}}

/* highlighted gallery entrance on home */
.gallery-highlight{
  display:grid;grid-template-columns:1.15fr .85fr;gap:0;
  max-width:1200px;width:calc(100% - var(--gutter)*2);margin:0 auto clamp(3.5rem,7vw,6rem);
  border:1px solid var(--violet);text-decoration:none;overflow:hidden;
  position:relative;background:var(--violet);color:var(--paper);
  transition:box-shadow .3s ease, transform .3s var(--ease-key);
}
.gallery-highlight:hover{transform:translateY(-4px);box-shadow:10px 12px 0 var(--lilac)}
.gh-frames{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:1px;background:rgba(255,255,255,.35)}
.ghf{position:relative;min-height:9rem;display:flex;align-items:flex-end;padding:.9rem;overflow:hidden}
.ghf em{font-size:1rem;line-height:1.15;position:relative;z-index:2}
.ghf::before{content:"";position:absolute;inset:9px;border:1px solid rgba(255,255,255,.5)}
.ghf.f-violet{background:var(--violet)} .ghf.f-violet em{color:var(--paper)}
.ghf.f-violet2{background:var(--violet-2)} .ghf.f-violet2 em{color:var(--paper)}
.ghf.f-ink{background:var(--ink)} .ghf.f-ink em{color:var(--lilac)}
.ghf.f-lilac{background:var(--lilac)} .ghf.f-lilac em{color:var(--violet-deep)}
.gh-copy{padding:clamp(1.6rem,3.2vw,2.6rem);display:flex;flex-direction:column;gap:.8rem;justify-content:center;
  background-image:url("brand/pattern-arch.svg");background-size:120px}
.gh-tag{font-family:var(--mono);font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--lilac)}
.gh-copy h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1.02}
.gh-copy h3 em{font-style:italic;color:var(--lilac)}
.gh-copy p{font-size:.95rem;max-width:26rem;color:rgba(255,255,255,.85)}
.gh-go{margin-top:.4rem;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;display:inline-flex;gap:.6rem;align-items:center}
.gallery-highlight:hover .gh-go .arr{transform:translateX(6px);transition:transform .25s var(--ease-key)}
@media (max-width:860px){.gallery-highlight{grid-template-columns:1fr}.gh-frames{order:2}}

/* arch-shaped section transition (violet <-> ivory) */
.arch-transition{position:absolute;left:0;right:0;bottom:-1px;height:clamp(70px,9vw,120px);line-height:0;pointer-events:none}
.arch-transition svg{width:100%;height:100%;display:block}
.arch-transition .at-fill{fill:var(--paper)}
.arch-transition.to-dark .at-fill{fill:var(--ink)}
.arch-transition .at-line{fill:none;stroke:var(--violet);stroke-width:2.5;vector-effect:non-scaling-stroke}

/* ============================================================
   KEY STRIP
   ============================================================ */
.keystrip{display:flex;height:4.2rem;border-bottom:1px solid var(--line-strong);border-top:1px solid var(--line-strong);position:relative;background:var(--paper);cursor:pointer}
.keystrip .k{flex:1;border-right:1px solid var(--line);position:relative;background:var(--paper);transition:background .18s ease,transform .18s ease}
.keystrip .k:last-child{border-right:none}
.keystrip .k.b{position:absolute;top:0;height:60%;width:3.2%;background:var(--ink);flex:none;z-index:2;border:none}
.keystrip .k.pressed{background:var(--lilac);transform:translateY(3px)}
.keystrip .k.b.pressed{background:var(--violet);transform:translateY(3px)}
.keystrip .label{
  position:absolute;right:var(--gutter);bottom:.55rem;z-index:3;
  font-family:var(--mono);font-size:.56rem;letter-spacing:.3em;text-transform:uppercase;color:var(--stone);pointer-events:none;
}

/* ============================================================
   SECTIONS
   ============================================================ */
section.block{padding:clamp(3.5rem,7vw,6rem) var(--gutter)}
.view-head{padding:clamp(4rem,6.5vw,5rem) var(--gutter) 0;max-width:1200px;margin:0 auto}
.view-head.slim{padding-bottom:0}
.view-head .kicker{font-family:var(--mono);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--violet)}
.view-head h1{font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,2.7vw,2.3rem);line-height:1.04;margin:.6rem 0 .9rem;letter-spacing:-.005em}
.view-head h1 em{font-style:italic;color:var(--violet)}
.view-head .lead{max-width:44rem;font-size:clamp(1.1rem,1.7vw,1.4rem);line-height:1.5;color:var(--ink)}
.wrap{max-width:1200px;margin:0 auto}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:clamp(2rem,4vw,3rem);flex-wrap:wrap}
.sec-head h2{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(2rem,4.2vw,3.2rem);line-height:1.02;max-width:22ch;margin-top:1rem;
}
.sec-head h2 em{font-style:italic;font-weight:400;color:var(--violet)}
.sec-link{
  text-decoration:none;font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;
  border-bottom:1px solid var(--violet);color:var(--violet);padding-bottom:.25rem;white-space:nowrap;transition:all .2s;
  background:none;
}
.sec-link:hover{color:var(--ink);border-color:var(--ink)}
.rev{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease-key),transform .8s var(--ease-key)}
.rev.in{opacity:1;transform:none}
.rev.dd1{transition-delay:.08s}.rev.dd2{transition-delay:.16s}.rev.dd3{transition-delay:.24s}

/* ============================================================
   TABS (generic)
   ============================================================ */
.tabs{display:flex;gap:0;border:1px solid var(--violet);width:max-content;max-width:100%;overflow-x:auto;margin-bottom:0}
.tabs button{
  background:transparent;border:none;border-right:1px solid var(--violet);
  padding:.95rem 1.6rem;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;
  transition:all .2s ease;white-space:nowrap;
}
.tabs button:last-child{border-right:none}
.tabs button:hover{background:var(--lilac)}
.tabs button[aria-selected="true"]{background:var(--violet);color:var(--paper)}
.tabwrap{border:1px solid var(--violet);border-top:none}
.tabpane{display:none;padding:clamp(1.5rem,3.5vw,2.6rem);background:var(--card)}
.tabpane.on{display:block;animation:fadein .45s var(--ease-key)}
@keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ============================================================
   EVENTS — featured + accordion
   ============================================================ */
.featured{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.2rem,3vw,2.4rem);margin-bottom:2.8rem;background:none}
.poster{
  position:relative;overflow:hidden;min-height:300px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  background:var(--violet) url("brand/pattern-arch.svg") repeat;background-size:110px;color:var(--paper);
}
.poster::after{content:"";position:absolute;inset:12px;border:1px solid currentColor;opacity:.4;pointer-events:none}
.poster .num{font-family:var(--serif);font-size:clamp(6rem,13vw,12rem);line-height:1;transition:transform .8s var(--ease-key)}
.poster .cap{position:absolute;left:1.1rem;bottom:1rem;font-family:var(--mono);font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;opacity:.8}
.featured:hover .poster .num{transform:scale(1.06) translateY(-4px)}
.featured-body{padding:clamp(1.5rem,3vw,2.6rem);display:flex;flex-direction:column;gap:1.6rem}
.tag{
  display:inline-block;font-family:var(--mono);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;
  background:var(--violet);color:var(--paper);border-radius:99px;padding:.32rem .85rem;
}
.featured-body h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.8rem,3.2vw,2.7rem);line-height:1.05;margin:.9rem 0 .7rem}
.meta-list{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;display:grid}
.meta-list div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px dotted var(--line)}
.meta-list div:last-child{border-bottom:none}
.meta-list span:first-child{color:var(--stone)}
.acc{border:1px solid var(--violet);border-bottom:none}
.acc-item{border-bottom:1px solid var(--violet)}
.acc-head{
  width:100%;display:grid;grid-template-columns:3.2rem 1fr auto 2.4rem;align-items:center;gap:1rem;
  background:transparent;border:none;text-align:left;
  padding:1.15rem 1.3rem;transition:background .2s ease;
}
.acc-head:hover{background:var(--lilac)}
.acc-item.open .acc-head{background:var(--violet);color:var(--paper)}
.acc-head .rn{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--violet)}
.acc-item.open .acc-head .rn{color:var(--paper)}
.acc-head .t{font-family:var(--serif);font-weight:600;font-size:clamp(1.15rem,2.4vw,1.6rem);line-height:1.15}
.acc-head .d{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--stone);text-align:right}
.acc-item.open .acc-head .d{color:var(--lilac)}
.acc-head .pm{font-family:var(--serif);font-size:1.6rem;line-height:1;text-align:center;transition:transform .35s var(--ease-key)}
.acc-item.open .acc-head .pm{transform:rotate(45deg)}
.acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease-key)}
.acc-item.open .acc-body{grid-template-rows:1fr}
.acc-body > div{overflow:hidden}
.acc-in{display:grid;grid-template-columns:1.4fr 1fr;gap:2rem;padding:1.4rem 1.3rem 1.7rem;border-top:1px dashed var(--line-strong)}
.acc-in p{font-size:.94rem;max-width:38rem}
.acc-in .btn{margin-top:1.1rem}
@media (max-width:760px){
  .acc-head{grid-template-columns:2.2rem 1fr 1.6rem}
  .acc-head .d{display:none}
  .acc-in{grid-template-columns:1fr}
}
/* series cards */
.series-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.series-card{border:1px solid var(--violet);padding:1.6rem 1.4rem;background:var(--card);display:flex;flex-direction:column;gap:.6rem;transition:transform .25s var(--ease-key),box-shadow .25s ease}
.series-card:hover{transform:translateY(-4px);box-shadow:6px 6px 0 var(--lilac)}
.series-card .sc-k{font-family:var(--mono);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--violet)}
.series-card h4{font-family:var(--serif);font-weight:600;font-size:1.4rem;line-height:1.1}
.series-card p{font-size:.88rem;color:var(--stone)}
@media (max-width:860px){.series-grid{grid-template-columns:1fr}}

/* ---- filterable events (invisible tables) ---- */
.ev-filters{display:flex;flex-direction:column;gap:.9rem;margin:0 0 2rem}
.filter-row{display:flex;align-items:center;gap:.8rem 1rem;flex-wrap:wrap}
.filter-label{font-family:var(--mono);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--stone);min-width:4.5rem}
.filter-row .chips{margin:0}
.filter-row .chips button{padding:.45rem 1rem;font-size:.58rem;display:inline-flex;align-items:center;gap:.4rem}
.filter-row .chips button .ev-ico{width:.95em;height:.95em}
.ev-count{font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-left:auto}
/* list + calendar on/off toggles (independent) */
.ev-views{display:inline-flex;gap:.4rem}
.ev-views button{border:none;border-radius:99px;background:var(--lilac);color:var(--violet);padding:.5rem 1rem;font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;transition:all .2s}
.ev-views button[aria-pressed="true"]{background:var(--violet);color:var(--paper)}
.ev-views button::before{content:"○ ";opacity:.7}
.ev-views button[aria-pressed="true"]::before{content:"● "}
.ev-wd{font-size:1.5rem!important;font-family:var(--serif);font-style:italic}
.ev-weekly .ev-date .ev-mon{color:var(--stone)}
.cal-day.has.wk{background:var(--violet-2)}
.ev-year-group{margin-top:1.4rem}
.ev-year{display:flex;align-items:center;gap:1rem;font-family:var(--serif);font-weight:500;font-size:1.6rem;color:var(--violet);margin:.4rem 0 .2rem}
.ev-year::after{content:"";flex:1;height:1px;background:var(--line)}
.ev-card{display:grid;grid-template-columns:5rem 1fr auto;gap:1.4rem;align-items:start;
  padding:1.3rem .4rem;border-bottom:1px solid var(--line);transition:background .2s ease,padding .2s ease}
.ev-card:hover{background:var(--lilac);padding-left:1rem;padding-right:1rem}
.ev-date{display:flex;flex-direction:column;line-height:1;padding-top:.15rem}
.ev-date .ev-mon{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--violet)}
.ev-date .ev-day{font-family:var(--serif);font-size:2.1rem;font-weight:500}
.ev-date .ev-yr{font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;color:var(--stone)}
.ev-main{min-width:0}
.ev-top{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:.35rem}
.ev-type{font-family:var(--mono);font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;background:var(--violet);color:var(--paper);padding:.24rem .7rem;border-radius:99px}
.ev-when{font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.ev-card.is-past .ev-type{background:transparent;color:var(--violet);border:1px solid var(--violet)}
.ev-main h4{font-family:var(--serif);font-weight:600;font-size:clamp(1.2rem,2.2vw,1.55rem);line-height:1.12}
.ev-main p{font-size:.9rem;color:var(--stone);margin-top:.3rem;max-width:44rem}
.ev-meta{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-top:.6rem;font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.ev-meta span{color:var(--stone)}
.event-location-link{color:inherit;text-decoration-line:underline;text-decoration-color:var(--dusty);text-decoration-thickness:1px;text-underline-offset:3px;transition:color .2s ease,text-decoration-color .2s ease}
.event-location-link:hover,.event-location-link:focus-visible{color:var(--violet);text-decoration-color:var(--violet)}
.ev-cta{align-self:center}
.ev-cta .btn{padding:.7rem 1.1rem}
.ev-empty{padding:2rem .4rem;color:var(--stone);font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}
.linklike{background:none;border:none;color:var(--violet);text-decoration:underline;text-underline-offset:3px;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer}
@media (max-width:720px){
  .ev-card{grid-template-columns:3.6rem 1fr;gap:.9rem}
  .ev-cta{grid-column:2;justify-self:start;margin-top:.4rem}
  .ev-date .ev-day{font-size:1.7rem}
}

/* ============================================================
   ABOUT
   ============================================================ */
.about-hero{background:var(--violet) url("brand/pattern-arch.svg") repeat;background-size:150px;color:var(--paper);position:relative}
.about-hero .kicker{color:var(--lilac)}
.about-in{max-width:1200px;margin:0 auto}
.about-in .lead2{max-width:40rem;color:rgba(255,255,255,.9);font-size:1.05rem}
.fold-toggle{
  margin-top:2rem;display:inline-flex;align-items:center;gap:.8rem;
  background:transparent;border:1px solid var(--paper);border-radius:99px;
  padding:.75rem 1.4rem;color:inherit;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;
  transition:all .25s ease;
}
.fold-toggle:hover{background:var(--paper);color:var(--violet)}
.fold-toggle .pm{font-family:var(--serif);font-size:1.2rem;line-height:1;transition:transform .35s var(--ease-key)}
.fold-toggle[aria-expanded="true"] .pm{transform:rotate(45deg)}
.facts-fold{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease-key)}
.facts-fold.open{grid-template-rows:1fr}
.facts-fold > div{overflow:hidden}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem 2rem;margin-top:2rem}
.facts div{padding:0 1.4rem 0 0;border-left:2px solid var(--lilac);padding-left:1rem}
.facts .n{font-family:var(--serif);font-size:2.6rem;font-weight:500;line-height:1;color:var(--paper)}
.facts .l{font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--lilac);display:block;margin-top:.5rem}
@media (max-width:760px){.facts{grid-template-columns:1fr 1fr}}
/* values + team */
.values{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem}
.values .desc p{font-size:.98rem;max-width:38rem;margin-bottom:1rem}
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:clamp(1.3rem,2.6vw,2.1rem)}
/* board as a top-to-down list */
.team-list{display:flex;flex-direction:column}
.team-row{display:flex;gap:clamp(1.2rem,3vw,2rem);align-items:center;padding:1.3rem 0;border-bottom:1px dotted var(--line)}
.team-row:last-child{border-bottom:none}
.tr-photo{width:clamp(4.5rem,8vw,6rem);min-width:clamp(4.5rem,8vw,6rem);aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--lilac)}
.tr-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease-key)}
.team-row:hover .tr-photo img{transform:scale(1.06)}
.tr-info{flex:1;min-width:0}
.tr-head{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.tr-head b{font-family:var(--serif);font-weight:600;font-size:clamp(1.25rem,2.4vw,1.7rem);line-height:1.1}
.tr-role{font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--violet)}
.tr-major{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--stone);display:block;margin:.35rem 0 .3rem}
.team-row .bio{font-size:.95rem;color:var(--ink);line-height:1.4;max-width:52rem}
.gal-none{padding:2rem .4rem;color:var(--stone);font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}
/* about: large mission + values, keyword styling */
.about-lead{margin-bottom:clamp(3rem,6vw,4.5rem);text-align:center}
.about-lead .eyebrow{justify-content:center}
.about-lead .eyebrow::after{display:none}
.mission-block{margin-bottom:clamp(2.5rem,4.5vw,3.6rem)}
.mission-text{font-family:var(--serif);font-weight:500;font-size:clamp(1.9rem,4vw,3rem);line-height:1.55;margin:0 auto;text-align:center;text-wrap:balance}
.mission-text em{font-style:italic;color:var(--violet)}
.about-lead u{text-decoration:underline;text-decoration-color:var(--violet);text-underline-offset:5px;text-decoration-thickness:2px}
.values-block{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.5rem)}
.values-block .eyebrow{grid-column:1/-1;margin-bottom:.2rem}
.vrow2{display:flex;flex-direction:column;gap:.5rem}
.vrow2 b{font-family:var(--serif);font-weight:600;font-size:clamp(1.35rem,2.3vw,1.9rem);line-height:1.12}
.vrow2 b em{font-style:italic;color:var(--violet)}
.vrow2 span{font-size:.98rem;color:var(--stone);line-height:1.4}
@media(max-width:760px){.values-block{grid-template-columns:1fr;gap:1.4rem}}
.team-card{background:none;padding:0}
.team-card .photo{aspect-ratio:3/4;overflow:hidden;border-radius:7px;margin-bottom:.7rem;background:var(--lilac)}
.team-card .photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s var(--ease-key)}
.team-card:hover .photo img{transform:scale(1.06)}
.team-card b{font-family:var(--serif);font-weight:600;font-size:1.12rem;display:block;line-height:1.15}
.team-card span{font-family:var(--mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;color:var(--violet);display:block;margin-top:.3rem}
.team-card .bio{font-size:.82rem;color:var(--stone);margin-top:.4rem;line-height:1.35}
.about-cols{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);align-items:start;margin-bottom:clamp(2.5rem,5vw,4rem)}
.about-cols .eyebrow{margin-bottom:1rem}
.big-lead{font-family:var(--serif);font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.28;max-width:24ch}
.big-lead em{font-style:italic;color:var(--violet)}
.value-list .vrow{padding:.9rem 0;border-bottom:1px dotted var(--line);display:flex;flex-direction:column;gap:.2rem}
.value-list .vrow:last-child{border-bottom:none}
.value-list .vrow b{font-family:var(--serif);font-weight:600;font-size:1.2rem}
.value-list .vrow span{font-size:.9rem;color:var(--stone)}
@media(max-width:760px){.about-cols{grid-template-columns:1fr}}
@media (max-width:860px){.values{grid-template-columns:1fr}}

/* ============================================================
   GET INVOLVED — tabs
   ============================================================ */
.panel{display:none;grid-template-columns:1.2fr .8fr;gap:clamp(1.5rem,4vw,3.5rem)}
.panel.on{display:grid;animation:fadein .45s var(--ease-key)}
.panel h4{font-family:var(--serif);font-weight:600;font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.08}
.panel h4 .gl{font-style:italic;font-weight:400;color:var(--violet);margin-right:.6rem}
.panel .desc{margin-top:.9rem;font-size:.96rem;max-width:36rem}
.panel .note{margin-top:1rem;color:var(--stone)}
.panel .btn{margin-top:1.6rem}
.panel-side{border-left:1px solid var(--line-strong);padding-left:clamp(1.2rem,3vw,2.4rem)}
.panel-side h5{font-family:var(--mono);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--violet);margin-bottom:.6rem}
.steps{list-style:none}
.steps li{display:flex;gap:1rem;align-items:baseline;padding:.8rem 0;border-bottom:1px solid var(--line)}
.steps li:last-child{border-bottom:none}
.steps .sn{font-family:var(--mono);font-size:.62rem;color:var(--violet);letter-spacing:.1em}
.steps .st b{display:block;font-family:var(--serif);font-size:1.12rem;font-weight:600}
.steps .st span{font-size:.85rem;color:var(--ink)}
@media (max-width:860px){
  .panel{grid-template-columns:1fr}
  .panel-side{border-left:none;border-top:1px solid var(--line-strong);padding-left:0;padding-top:1.4rem}
}

/* ============================================================
   GALLERY — chips + grid/story toggle
   ============================================================ */
.gallery-view{background:var(--paper-2)}
.chips{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:0}
.chips button{
  background:transparent;border:1px solid var(--violet);border-radius:99px;
  padding:.55rem 1.2rem;color:var(--violet);
  font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  transition:all .2s ease;
}
.chips button:hover{background:var(--lilac)}
.chips button[aria-selected="true"]{background:var(--violet);color:var(--paper)}
.view-toggle{display:inline-flex;border:1px solid var(--violet);border-radius:99px;overflow:hidden}
.view-toggle button{background:transparent;border:none;padding:.5rem 1rem;font-family:var(--mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;transition:all .2s}
.view-toggle button[aria-pressed="true"]{background:var(--violet);color:var(--paper)}
.gallery-page-title{margin:0;color:var(--ink);font-family:var(--serif);font-size:clamp(2.5rem,5vw,4rem);font-weight:500;line-height:1.05}
.gal-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin:1.6rem 0}
.story{display:none;grid-template-columns:1fr 1fr;border-radius:10px;overflow:hidden;background:var(--paper-2)}
.story.on{display:grid;animation:fadein .45s var(--ease-key)}
.story-art{position:relative;min-height:280px;display:flex;align-items:flex-end;border-right:1px solid var(--violet);overflow:hidden}
.story-art .big{position:absolute;top:1.2rem;left:1.3rem;right:1.3rem;font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.8vw,2.2rem);line-height:1.2}
.sa-violet{background:var(--violet)} .sa-violet .big{color:var(--paper)}
.sa-ink{background:var(--ink)} .sa-ink .big{color:var(--lilac)}
.sa-lilac{background:var(--lilac)} .sa-lilac .big{color:var(--violet-deep)}
.keysmini{display:flex;width:100%;height:32%}
.keysmini i{flex:1;border-right:1px solid var(--line);background:var(--paper);position:relative}
.keysmini i:nth-child(2)::after,.keysmini i:nth-child(3)::after,.keysmini i:nth-child(5)::after,
.keysmini i:nth-child(6)::after,.keysmini i:nth-child(7)::after{
  content:"";position:absolute;top:0;left:-24%;width:48%;height:55%;background:var(--ink);
}
.story-body{padding:clamp(1.4rem,3vw,2.4rem);display:flex;flex-direction:column;gap:.9rem}
.story-body .when{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--violet)}
.story-body h4{font-family:var(--serif);font-weight:600;font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.08}
.story-body p{font-size:.95rem;max-width:34rem}
.story-body .row{margin-top:auto;display:flex;gap:.9rem;flex-wrap:wrap;padding-top:1.2rem}
/* grid mode */
/* gallery grid = poster-shaped rectangles */
.gallery-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:clamp(.9rem,2vw,1.4rem)}
.frame{position:relative;aspect-ratio:2/3;background:var(--card);overflow:hidden;display:flex;align-items:flex-end;padding:1.1rem;transition:transform .3s var(--ease-key)}
.frame:hover{transform:translateY(-4px)}
.frame .fc{position:relative;z-index:2;font-family:var(--mono);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase}
.gallery-items .frame .fbig{position:absolute;top:1.1rem;left:1.1rem;right:1.1rem;bottom:auto;z-index:2;font-family:var(--serif);font-style:italic;font-size:1.35rem;line-height:1.14}
.gallery-items .frame .fc{align-self:flex-end}
/* gallery list mode */
.gallery-items.as-list{display:flex;flex-direction:column;gap:.7rem}
.gallery-items.as-list .frame{aspect-ratio:auto;flex-direction:row;align-items:center;gap:1.2rem;padding:0;min-height:5.5rem;border-radius:8px}
.gallery-items.as-list .frame img.ph{position:relative;width:8rem;min-width:8rem;height:5.5rem;inset:auto}
.gallery-items.as-list .frame::after{display:none}
.gallery-items.as-list .frame .fbig{position:relative;top:auto;left:auto;right:auto;color:var(--ink)!important;font-size:1.35rem;flex:1}
.gallery-items.as-list .frame .fc{color:var(--violet)!important;padding-right:1.2rem;white-space:nowrap}
@media (max-width:560px){.gallery-items.as-list .frame .fc{display:none}}

/* ============================================================
   CONTACT / JOIN
   ============================================================ */
.join-view{background:var(--ink);color:var(--paper)}
.join-view .kicker{color:var(--lilac)}
.join-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,6vw,5rem);max-width:1200px;margin:0 auto}
.join-grid h2{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.03;margin:0 0 1.2rem}
.join-grid h2 em{font-style:italic;color:var(--lilac)}
.join-grid .lead{color:rgba(255,255,255,.82);max-width:32rem}
.nl-form{display:flex;margin-top:1.8rem;max-width:30rem;border:1px solid var(--paper)}
.nl-form input{flex:1;min-width:0;background:transparent;border:none;outline:none;color:inherit;padding:1rem 1.1rem;font:inherit;font-size:.95rem}
.nl-form input::placeholder{color:rgba(255,255,255,.5)}
.nl-form button{background:var(--violet);color:var(--paper);border:none;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;padding:0 1.4rem;transition:all .2s ease}
.nl-form button:hover{background:var(--paper);color:var(--violet)}
.nl-note{font-size:.78rem;color:rgba(255,255,255,.6);margin-top:.8rem;max-width:30rem}
.nl-ok{display:none;margin-top:1.8rem;border:1px solid var(--violet);background:var(--violet);color:var(--paper);padding:1rem 1.2rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase}
.contact-list{border-top:1px solid rgba(255,255,255,.35)}
.contact-list a{display:flex;justify-content:space-between;align-items:center;gap:1rem;text-decoration:none;padding:1.05rem .2rem;border-bottom:1px solid rgba(255,255,255,.35);transition:background .2s ease,padding .25s var(--ease-key)}
.contact-list a:hover{background:var(--violet);color:var(--paper);padding-left:.8rem;padding-right:.5rem}
.contact-list .name{font-family:var(--serif);font-size:1.35rem;font-weight:500}
.contact-list .ext{font-family:var(--mono);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--lilac)}
.join-mail{margin-top:1.6rem;font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lilac)}
.join-mail a{color:var(--paper)}
/* FAQ accordion (reuses acc but on dark) */
.faq{margin-top:2.5rem;border:1px solid rgba(255,255,255,.35);border-bottom:none}
.faq-item{border-bottom:1px solid rgba(255,255,255,.35)}
.faq-head{width:100%;display:flex;justify-content:space-between;gap:1rem;align-items:center;background:transparent;border:none;text-align:left;padding:1.1rem .2rem;color:inherit;font-family:var(--serif);font-size:1.15rem;font-weight:500}
.faq-head .pm{font-family:var(--serif);font-size:1.4rem;transition:transform .35s var(--ease-key);color:var(--lilac)}
.faq-item.open .faq-head .pm{transform:rotate(45deg)}
.faq-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease-key)}
.faq-item.open .faq-body{grid-template-rows:1fr}
.faq-body > div{overflow:hidden}
.faq-body p{padding:0 .2rem 1.1rem;font-size:.92rem;color:rgba(255,255,255,.8);max-width:40rem}

/* ============================================================
   PAGER (connects views)
   ============================================================ */
.pager{max-width:1200px;width:calc(100% - var(--gutter)*2);margin:clamp(2.5rem,5vw,4rem) auto clamp(3rem,6vw,5rem);display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.4rem)}
.pager a{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:1.6rem 1.5rem;text-decoration:none;display:flex;flex-direction:column;gap:.4rem;transition:background .25s ease,border-color .25s ease}
.pager a:hover{border-color:var(--violet)}
.pager a:hover{background:var(--violet);color:var(--paper)}
.pager .pg-k{font-family:var(--mono);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--stone)}
.pager a:hover .pg-k{color:var(--lilac)}
.pager .pg-t{font-family:var(--serif);font-size:clamp(1.4rem,2.6vw,2rem);font-weight:500}
.pager .next{text-align:right;align-items:flex-end}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--ink);color:var(--paper);padding:0 var(--gutter) 1.8rem;border-top:1px solid rgba(255,255,255,.22)}
.foot-grid{max-width:1200px;margin:0 auto;padding:2.6rem 0;display:flex;justify-content:space-between;gap:2.5rem;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.22)}
.foot-brand{display:flex;align-items:center;gap:1rem}
.foot-brand .brand-logo{height:2.9rem}
.foot-brand p{font-size:.85rem;color:rgba(255,255,255,.7);max-width:18rem}
.foot-links{display:flex;gap:3rem;flex-wrap:wrap}
footer h6{font-family:var(--mono);font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:var(--lilac);margin-bottom:.9rem}
footer ul{list-style:none}
footer ul li{margin-bottom:.45rem}
footer ul a,footer ul button{text-decoration:none;font-size:.88rem;color:rgba(255,255,255,.82);background:none;border:none;padding:0;text-align:left}
footer ul a:hover,footer ul button:hover{color:var(--violet);text-decoration:underline;text-underline-offset:3px}
.foot-legal{max-width:1200px;margin:1.4rem auto 0;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-family:var(--mono);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.foot-legal a{color:inherit;text-decoration:none}
.foot-legal a:hover{color:var(--violet)}

@media (max-width:1000px){
  .featured{grid-template-columns:1fr}
  .poster{min-height:220px}
  .join-grid{grid-template-columns:1fr}
}
@media (max-width:680px){
  .hero-color{opacity:.7;width:60vw;height:32vh;right:-8vw;top:auto;bottom:8%}
  .float-logo span{display:none}
  #menuBtn{padding:.6rem 1rem}
  .pager{grid-template-columns:1fr}
  .pager .next{text-align:left;align-items:flex-start}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  #intro{display:none!important}
  body.ready .float, .float{opacity:1;transform:none;transition:none}
  .rev{opacity:1;transform:none;transition:none}
  .ticker-in,.hero-color{animation:none}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ============================================================
   INVISIBLE BRACKETS — no outline borders; fills & tone instead
   ============================================================ */
#topbar{border-bottom:none;box-shadow:0 6px 24px rgba(53,2,79,.06)}
/* buttons */
.btn{border:none}
.btn-solid{background:var(--violet);color:var(--paper)}
.btn-ghost{background:var(--lilac);color:var(--violet)}
.btn-ghost:hover{background:var(--violet);color:var(--paper)}
#menuBtn{border:none}
.float-logo a{border:none;box-shadow:0 3px 18px rgba(53,2,79,.10)}
.tb-cta{border:none}
.tb-toggle{border:none;background:var(--lilac);color:var(--violet)}
.tb-toggle:hover{background:var(--violet);color:var(--paper)}
.fold-toggle{border:none;background:rgba(255,255,255,.18);color:var(--paper)}
.fold-toggle:hover{background:var(--paper);color:var(--violet)}
#navClose{border:none;background:rgba(255,255,255,.18)}
#navClose:hover{background:var(--paper);color:var(--violet)}
/* tabs -> pill group */
.tabs{border:none;gap:.5rem;overflow:visible}
.tabs button{border:none;border-radius:99px;background:var(--lilac);padding:.7rem 1.35rem}
.tabs button:hover{background:var(--violet);color:var(--paper)}
.tabs button[aria-selected="true"]{background:var(--violet);color:var(--paper)}
.tabwrap{border:none;padding-top:1.7rem}
.tabpane{padding:0;background:none}
.panel{padding:0}
/* chips (filters + gallery) */
.chips button{border:none;background:var(--lilac);color:var(--violet)}
.chips button:hover{background:var(--violet);color:var(--paper)}
.chips button[aria-selected="true"]{background:var(--violet);color:var(--paper)}
/* segmented toggle */
.view-toggle{border:none;background:var(--lilac);border-radius:99px;padding:.22rem;gap:.15rem}
.view-toggle button{border-radius:99px;color:var(--violet)}
.view-toggle button[aria-pressed="true"]{background:var(--violet);color:var(--paper)}
/* cards -> tonal fill, no outline */
.home-card{border:none;background:var(--paper-2)}
.home-card:hover{background:var(--violet);color:var(--paper)}
.pager a{border:none;background:var(--paper-2)}
.pager a:hover{background:var(--violet);color:var(--paper)}
.series-card{border:none;background:var(--paper-2)}
.gallery-highlight{border:none}
.panel-side{border-left:none;padding-left:0}
/* newsletter -> filled, no frame */
.nl-form{border:none;background:rgba(255,255,255,.12);border-radius:6px;overflow:hidden}
/* remove decorative inner outline frames */
.poster::after,.frame::before,.ghf::before{display:none}
/* soften list dividers (keep only faint hairlines, no boxes) */
.meta-list div{border-bottom:1px dotted var(--line)}

/* ============================================================
   REAL PHOTOS — gallery, featured, highlight, stories
   ============================================================ */
img.ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.frame{background:var(--ink);border-radius:8px;overflow:hidden}
.story-art{border-radius:8px 0 0 8px}
@media (max-width:860px){.story-art{border-radius:8px 8px 0 0}}
.frame::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(53,2,79,.82),rgba(53,2,79,.02) 62%)}
.frame .fbig,.frame .fc{position:relative;z-index:2;color:var(--paper)}
.story-art{background:var(--ink)}
.story-art .keysmini{display:none}
.story-art::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(53,2,79,.62),rgba(53,2,79,.08))}
.story-art .big{position:relative;z-index:2;color:var(--paper)}
.poster .num,.poster .cap{position:relative;z-index:2}
.poster::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(53,2,79,.9),rgba(53,2,79,.42))}
.gh-frames .ghf{background:var(--ink)}
.gh-frames .ghf::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(53,2,79,.72),rgba(53,2,79,.05) 62%)}
.gh-frames .ghf em{position:relative;z-index:2;color:var(--paper)}

/* ============================================================
   EVENT TYPE ICONS + CALENDAR VIEW
   ============================================================ */
.ev-ico{width:1.05em;height:1.05em;vertical-align:-.15em;flex:none}
.ev-type{display:inline-flex;align-items:center;gap:.4rem}
.ev-type .ev-ico{color:currentColor}
/* calendar */
.ev-cal{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.6rem}
.cal-month{background:var(--paper-2);border-radius:10px;padding:1.1rem 1.1rem 1.3rem}
.cal-month h4{font-family:var(--serif);font-weight:600;font-size:1.15rem;margin-bottom:.7rem;display:flex;justify-content:space-between;align-items:baseline}
.cal-month h4 span{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-dow{font-family:var(--mono);font-size:.5rem;letter-spacing:.06em;text-transform:uppercase;color:var(--stone);text-align:center;padding:.2rem 0}
.cal-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.62rem;color:var(--stone);border-radius:6px;position:relative}
.cal-day.other{opacity:.25}
.cal-day.has{background:var(--violet);color:var(--paper);cursor:pointer;font-weight:700}
.cal-day.has:hover{background:var(--ink)}
.cal-day .cal-ico{position:absolute;bottom:1px;right:2px;width:9px;height:9px;color:var(--paper)}
.cal-legend{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin:1.2rem 0 0}
.cal-legend span{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--stone)}
.cal-legend .ev-ico{color:var(--violet)}
@media (max-width:520px){.ev-cal{grid-template-columns:1fr}}

/* ============================================================
   HOME HIGHLIGHTS — horizontal scroll to the Gallery
   ============================================================ */
.hl-strip{width:calc(100% - var(--gutter)*2);margin:0 var(--gutter) clamp(3rem,6vw,5rem)}
.hl-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.1rem}
.hl-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x proximity;padding:.2rem .2rem 1rem;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--violet) transparent}
.hl-track::-webkit-scrollbar{height:7px}
.hl-track::-webkit-scrollbar-thumb{background:var(--violet);border-radius:99px}
.hl-track::-webkit-scrollbar-track{background:var(--line)}
.hl-card{flex:1 0 clamp(220px,18vw,300px);aspect-ratio:4/5;position:relative;border-radius:10px;overflow:hidden;
  scroll-snap-align:start;text-decoration:none;background:var(--ink)}
.hl-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(53,2,79,.82),rgba(53,2,79,.03) 62%)}
.hl-card .ph{transition:transform .55s var(--ease-key)}
.hl-card:hover .ph{transform:scale(1.06)}
.hl-cap{position:absolute;left:1rem;right:1rem;bottom:1rem;z-index:2;color:var(--paper);display:flex;flex-direction:column;gap:.25rem}
.hl-cap em{font-family:var(--serif);font-style:italic;font-size:1.25rem;line-height:1.1}
.hl-cap small{font-family:var(--mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;color:var(--lilac)}
.frame{cursor:pointer;border:none;padding:0;text-align:left;width:100%}

/* home mid-page About band */
.home-about{background:var(--violet) url("brand/pattern-arch.svg") repeat;background-size:150px;color:var(--paper);text-align:center;padding:clamp(3.5rem,7vw,6rem) var(--gutter);margin:0 0 clamp(2.5rem,5vw,4rem)}
/* home bottom subscribe band */
.home-sub{background:var(--ink);color:var(--paper);padding:clamp(3.5rem,7vw,5.5rem) var(--gutter);text-align:center;margin-top:clamp(2.5rem,5vw,4rem)}
.home-sub-in{max-width:40rem;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.home-sub .eyebrow{color:var(--lilac);justify-content:center}
.home-sub .eyebrow::after{display:none}
.home-sub h2{font-family:var(--serif);font-weight:500;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.08;margin:.6rem 0 1.6rem}
.home-sub h2 em{font-style:italic;color:var(--lilac)}
.home-sub .nl-form{margin:0 auto;width:100%;max-width:30rem}
.home-sub .nl-ok{color:var(--paper)}
.hs-note{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:1rem}
.hs-note a{color:var(--lilac)}
.home-about .eyebrow{color:var(--lilac);justify-content:center}
.home-about .eyebrow::after{display:none}
.home-about h2{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4.5vw,3.4rem);line-height:1.05;margin:.7rem auto 1rem;max-width:20ch}
.home-about h2 em{font-style:italic;color:var(--lilac)}
.home-about .lead2{max-width:42rem;margin:0 auto;color:rgba(255,255,255,.9);font-size:1.02rem}
.home-about .facts{max-width:860px;margin:2.4rem auto;grid-template-columns:repeat(4,1fr);text-align:left}
.home-about .btn{margin-top:.4rem}
@media(max-width:760px){.home-about .facts{grid-template-columns:1fr 1fr}}

/* ============================================================
   GALLERY DETAIL MODAL
   ============================================================ */
.gal-modal{position:fixed;inset:0;z-index:95;display:none;align-items:center;justify-content:center;padding:var(--gutter)}
.gal-modal.open{display:flex}
.gm-backdrop{position:absolute;inset:0;background:rgba(53,2,79,.62);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:opacity .52s ease}
.gm-panel{position:relative;z-index:2;background:var(--paper);border-radius:12px;overflow:hidden;
  display:grid;grid-template-columns:1.1fr .9fr;max-width:920px;width:100%;max-height:88vh;
  box-shadow:0 30px 80px rgba(53,2,79,.4);animation:gmIn .4s var(--ease-key)}
@keyframes gmIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.gm-media{background:var(--violet-deep);min-height:260px;position:relative;overflow:hidden;isolation:isolate}
.gm-media img{width:100%;height:100%;object-fit:cover;display:block}
/* Transform-driven vertical carousel: edge clones preserve up/down travel,
   then reset invisibly after the transition completes. */
.gm-carousel{position:relative;z-index:1;height:100%;width:100%;overflow:hidden;cursor:grab;touch-action:pan-x}
.gm-carousel.dragging{cursor:grabbing}
.gm-track{display:flex;flex-direction:column;width:100%;height:100%;will-change:transform;transform:translate3d(0,-100%,0)}
.gm-track.is-moving{transition:transform .72s cubic-bezier(.65,0,.35,1)}
.gm-carousel.dragging .gm-track{transition:none!important}
.gm-slide{flex:0 0 100%;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}
.gm-nav{position:absolute;right:.75rem;left:auto;z-index:3;width:2.3rem;height:2.3rem;border-radius:99px;border:none;
  background:rgba(255,255,255,.92);color:var(--ink);font-size:1.4rem;line-height:1;display:grid;place-items:center;cursor:pointer;
  box-shadow:0 2px 12px rgba(53,2,79,.28);transition:background .2s,color .2s}
.gm-nav:hover{background:var(--violet);color:var(--paper)}
.gm-prev{top:calc(50% - 2.55rem)}.gm-next{top:calc(50% + .25rem)}
.gm-dots{position:absolute;right:3.55rem;left:auto;top:50%;bottom:auto;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:.4rem;align-items:center}
.gm-dot{width:.5rem;height:.5rem;border-radius:99px;border:none;background:rgba(255,255,255,.55);cursor:pointer;padding:0;transition:height .25s,background .25s}
.gm-dot.on{background:var(--paper);height:1.4rem}
/* event poster modal — show the whole poster */
.ev-modal .gm-media{background:var(--paper-2)}
.ev-modal .gm-media img{width:100%;height:100%;object-fit:contain;object-position:center}
.ev-modal .gm-body .meta-list{margin:.2rem 0 .4rem}
.ev-modal .gm-body .btn{align-self:flex-start;margin-top:.4rem}
/* soonest events are clickable — poster affordance */
.ev-clickable{cursor:pointer}
.ev-clickable:hover .ev-main h4{color:var(--violet)}
.ev-poster-badge{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--mono);font-size:.5rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--violet);background:var(--lilac);padding:.2rem .55rem .2rem .2rem;border-radius:99px;white-space:nowrap}
.ev-poster-badge img{width:1.15rem;height:1.55rem;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(53,2,79,.25)}
.ev-clickable:hover .ev-poster-badge{background:var(--violet);color:var(--paper)}
.ev-clickable:focus-visible{outline:2px solid var(--violet);outline-offset:3px}

/* ---- (5) Gallery list mode: grouped by year → Fall/Spring semester ---- */
.gal-list{display:block}
.gal-list[hidden]{display:none!important}
.gallery-items[hidden]{display:none!important}
.gal-sem{font-family:var(--mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--stone);margin:1.3rem 0 .2rem}
.gal-row{display:grid;grid-template-columns:4.2rem 1fr auto;gap:1.2rem;align-items:center;width:100%;text-align:left;
  background:none;border:none;border-bottom:1px solid var(--line);padding:1rem .3rem;cursor:pointer;transition:background .2s ease,padding .2s ease}
.gal-row:hover{background:var(--lilac);padding-left:.8rem;padding-right:.8rem}
.gal-thumb{width:4.2rem;height:5.4rem;object-fit:cover;border-radius:6px;background:var(--paper-2)}
.gal-row-main{min-width:0}
.gal-row-main b{font-family:var(--serif);font-weight:600;font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.15;display:block}
.gal-row-meta{display:block;margin-top:.3rem;font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.gal-row-go{font-family:var(--mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--violet);white-space:nowrap}
.gal-row:hover .gal-row-go{color:var(--violet)}
@media (max-width:560px){.gal-row{grid-template-columns:3.4rem 1fr}.gal-row-go{display:none}}
.gm-body{padding:clamp(1.6rem,3vw,2.4rem);display:flex;flex-direction:column;gap:.7rem;overflow-y:auto}
.gm-meta{font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--violet)}
.gm-body h3{font-family:var(--serif);font-weight:600;font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.1}
.gm-desc{font-size:.96rem;line-height:1.55}
.gm-body .btn{margin-top:.6rem;align-self:flex-start}
.gm-close{position:absolute;top:.8rem;left:.9rem;right:auto;z-index:4;width:2.2rem;height:2.2rem;border-radius:99px;border:none;
  background:var(--paper);color:var(--ink);font-size:1rem;display:grid;place-items:center;box-shadow:0 2px 10px rgba(53,2,79,.2)}
.gm-close:hover{background:var(--violet);color:var(--paper)}
@media (max-width:720px){.gm-panel{grid-template-columns:1fr;max-height:92vh}.gm-media{min-height:180px;max-height:34vh}}

/* Shared-cover transition: the selected archive cover becomes the modal media,
   then returns to the same tile on close. */
.gallery-cover-flight{
  position:fixed;z-index:99;display:block;margin:0;pointer-events:none;
  overflow:hidden;background:transparent;transform:translateZ(0);
  box-shadow:0 18px 55px rgba(25,25,25,.22);will-change:left,top,width,height,border-radius,box-shadow;
}
.gallery-cover-flight > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;background:transparent}
.gallery-cover-flight.is-cover-flight > .gallery-flight-image{object-fit:contain}
.gallery-cover-flight > .gallery-flight-return{object-fit:cover;opacity:0}
.gallery-cover-flight.has-dissolve > .gallery-flight-image{animation:galleryFlightPosterOut .34s .34s ease both}
.gallery-cover-flight.has-dissolve > .gallery-flight-return{animation:galleryFlightReturn .38s .32s ease both}
@keyframes galleryFlightPosterOut{to{opacity:0;filter:blur(5px)}}
@keyframes galleryFlightReturn{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:none}}
body.gallery-closing #topbar{z-index:105}
#galModal.shared-transition .gm-panel{animation:none;pointer-events:none}
#galModal.shared-transition .gm-carousel,
#galModal.shared-transition .gm-nav,
#galModal.shared-transition .gm-dots{opacity:0}
#galModal.shared-transition .gm-body{opacity:1;transform:translateX(-.8rem);clip-path:inset(0 100% 0 0)}
#galModal.shared-transition .gm-body > *{opacity:0;transform:translateY(.7rem)}
#galModal.shared-transition .gm-close{opacity:0;transform:scale(.8)}
#galModal.shared-opening .gm-backdrop{opacity:0}
#galModal.shared-opening .gm-panel{background:transparent;box-shadow:none}
#galModal.shared-opening.shared-active .gm-backdrop{opacity:1}
#galModal.shared-closing .gm-backdrop{opacity:0}
#galModal.shared-closing .gm-panel{background:transparent;box-shadow:none}
#galModal .gm-panel{transition:background-color .4s ease,box-shadow .4s ease}
#galModal .gm-body{
  transition:opacity .4s ease,transform .56s var(--ease-key),clip-path .64s var(--ease-key);
}
#galModal .gm-body > *{transition:opacity .28s ease,transform .4s var(--ease-key)}
#galModal .gm-close{transition:opacity .32s ease,transform .48s var(--ease-key)}
#galModal.shared-reveal .gm-body{animation:galleryInfoSurface .62s cubic-bezier(.22,1,.36,1) both}
#galModal.shared-reveal .gm-close{animation:galleryCloseReveal .44s .18s cubic-bezier(.22,1,.36,1) both}
#galModal.shared-reveal .gm-body > *{animation:galleryInfoItem .5s cubic-bezier(.22,1,.36,1) both}
#galModal.shared-reveal .gm-body > :nth-child(1){animation-delay:.08s}
#galModal.shared-reveal .gm-body > :nth-child(2){animation-delay:.13s}
#galModal.shared-reveal .gm-body > :nth-child(3){animation-delay:.18s}
#galModal.shared-reveal .gm-body > :nth-child(4){animation-delay:.23s}
#galModal.shared-reveal .gm-body > :nth-child(5){animation-delay:.28s}
@keyframes galleryInfoSurface{from{opacity:1;transform:translateX(-.8rem);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes galleryInfoItem{from{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:none}}
@keyframes galleryCloseReveal{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@media(max-width:720px){
  #galModal.shared-transition .gm-body{transform:translateY(-.65rem);clip-path:inset(0 0 100% 0)}
  @keyframes galleryInfoSurface{from{opacity:1;transform:translateY(-.65rem);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
}
@media(prefers-reduced-motion:reduce){
  .gallery-cover-flight{display:none}
  #galModal .gm-backdrop,#galModal .gm-panel,#galModal .gm-body,#galModal .gm-close{transition:none!important;animation:none!important}
}

/* ============================================================
   v4 REFINEMENTS
   ============================================================ */

/* ---- (6) Featured next event = clean poster, no filter/overlay text ---- */
.featured{grid-template-columns:1fr 1.12fr;align-items:center;gap:clamp(1.6rem,3vw,2.6rem);max-width:1120px;margin-left:auto;margin-right:auto}
.poster{width:clamp(300px,30vw,410px);aspect-ratio:2/3;justify-self:end;min-height:0;background:var(--paper-2);border-radius:12px;box-shadow:0 18px 44px rgba(53,2,79,.16);display:block}
.poster::before,.poster::after{display:none!important}   /* strip violet gradient + inner frame */
.poster .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.featured-body{justify-content:center;padding:clamp(.5rem,2vw,1.5rem) clamp(.5rem,2vw,1rem)}
@media (max-width:1000px){.featured{grid-template-columns:1fr}.poster{width:min(340px,78vw);justify-self:center}}

/* ---- (3) E-board members: large, alternating left/right for symmetry ---- */
.team-list{gap:clamp(2.8rem,6vw,5.5rem);margin-top:1.4rem}
.team-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4.5vw,4rem);align-items:center;padding:0;border-bottom:none}
.team-row:nth-child(even) .tr-photo{order:2}
.tr-photo{width:100%;min-width:0;aspect-ratio:4/5;max-height:clamp(340px,46vh,470px);border-radius:14px;box-shadow:0 16px 40px rgba(53,2,79,.14)}
.tr-info{max-width:38rem}
.team-row:nth-child(even) .tr-info{margin-left:auto}
.tr-head{align-items:baseline;gap:1rem}
.tr-head b{font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.02}
.tr-role{font-size:.64rem;letter-spacing:.2em;color:var(--violet)}
.tr-major{font-size:.66rem;letter-spacing:.1em;margin:.7rem 0 .2rem}
.team-row .bio{font-size:clamp(1.02rem,1.35vw,1.18rem);line-height:1.62;margin-top:.9rem;max-width:36rem}
@media (max-width:760px){
  .team-row,.team-row:nth-child(even){grid-template-columns:1fr}
  .team-row:nth-child(even) .tr-photo{order:0}
  .tr-photo{max-width:22rem;aspect-ratio:4/5}
}

/* ---- (4) Contact & Join: light theme, consistent with the rest ---- */
.contact-view{background:var(--paper);color:var(--ink)}
.contact-view .join-grid h2 em{color:var(--violet)}
.contact-view .join-grid .lead{color:var(--ink)}
.contact-view .nl-form{border:none;background:var(--paper-2);border-radius:6px;overflow:hidden}
.contact-view .nl-form input::placeholder{color:var(--stone)}
.contact-view .nl-form button{background:var(--violet);color:var(--paper)}
.contact-view .nl-form button:hover{background:var(--ink);color:var(--paper)}
.contact-view .nl-note{color:var(--stone)}
.contact-view .nl-ok{border-color:var(--violet);background:var(--violet);color:var(--paper)}
.contact-view .contact-list{border-top:1px solid var(--line)}
.contact-view .contact-list a{border-bottom:1px solid var(--line);justify-content:flex-start;gap:.9rem}
.contact-view .contact-list a:hover{background:var(--violet);color:var(--paper)}
.contact-view .contact-list .ext{color:var(--violet);margin-left:auto}
.contact-view .contact-list a:hover .ext{color:var(--lilac)}
.contact-list .ci{width:1.6rem;height:1.6rem;flex:none;display:grid;place-items:center;color:var(--violet)}
.contact-list .ci svg{width:100%;height:100%;display:block}
.engage-nyu-logo{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
.contact-list .ci.engage-ci{overflow:hidden;border-radius:50%;background:#FFFFFF}
.contact-view .contact-list a:hover .ci{color:var(--paper)}
.contact-view .contact-list a:hover .ci-brand{color:inherit}   /* keep brand colours on hover */
/* footer social logos (bottom) */
.fb-text{display:flex;flex-direction:column;gap:1rem}
.foot-social{display:flex;gap:.9rem;align-items:center}
.foot-social a{width:1.7rem;height:1.7rem;display:grid;place-items:center;color:rgba(255,255,255,.8);transition:transform .2s var(--ease-key),color .2s}
.foot-social a:hover{transform:translateY(-2px);color:var(--paper)}
.foot-social svg{width:100%;height:100%;display:block}
.foot-social .engage-nyu-logo{width:100%;height:100%;filter:grayscale(1);opacity:.8;transition:opacity .2s}
.foot-social a:hover .engage-nyu-logo{opacity:1}
.contact-view .join-mail{color:var(--stone)}
.contact-view .join-mail a{color:var(--violet)}
.contact-view .faq{border:none;border-top:1px solid var(--line);margin-top:2.5rem}
.contact-view .faq-item{border-bottom:1px solid var(--line)}
.contact-view .faq-head{color:var(--ink)}
.contact-view .faq-head .pm{color:var(--violet)}
.contact-view .faq-body p{color:var(--ink)}

/* ---- (7) Intro animation for titles (home hero, mission, section heads) ---- */
@keyframes titleIntro{from{opacity:0;transform:translateY(26px);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
.title-intro{animation:titleIntro 1s var(--ease-key) both}
.hero-mega.title-intro{animation-duration:1.15s}
.view.active .title-intro{animation:titleIntro 1s var(--ease-key) both}

/* ---- (9) Bottom pager: underline the target, no violet box ---- */
.pager a{background:transparent!important;border:none;border-radius:0;padding:1.5rem .2rem}
.pager a:hover{background:transparent!important;color:var(--violet)}
.pager a:hover .pg-k{color:var(--violet)}
.pager .pg-t{display:inline-block;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;text-decoration-thickness:2px;transition:text-decoration-color .25s var(--ease-key),color .2s}
.pager a:hover .pg-t{text-decoration-color:var(--violet);color:var(--violet)}
.pager{border-top:1px solid var(--line);padding-top:clamp(1.5rem,3vw,2.2rem)}

/* ---- (1) Calendar toggle: single on/off pill ---- */
.ev-views button{padding-left:1.1rem;padding-right:1.1rem}

/* ============================================================
   v5 REFINEMENTS
   ============================================================ */

/* ---- (5,6,7) Persistent top bar = the only nav; brand + links, no menu ---- */
#topbar{justify-content:space-between;gap:1.4rem;padding:.55rem var(--gutter);
  transform:none;transition:none;box-shadow:0 1px 0 var(--line),0 6px 24px rgba(53,2,79,.05)}
#topbar .tb-brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
#topbar .tb-brand .brand-logo{height:2rem;width:auto;display:block}
#topbar .tb-brand span{font-family:var(--mono);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.35;color:var(--ink)}
#topbar .tb-brand:hover span{color:var(--violet)}
.tb-nav{flex-wrap:wrap;justify-content:flex-end}
/* legacy controls fully retired */
.float,#menuBtn,#nav,#wipe{display:none!important}
@media (max-width:900px){#topbar .tb-nav{display:flex}}
@media (max-width:620px){
  #topbar{flex-direction:column;align-items:flex-start;gap:.35rem;padding:.5rem var(--gutter)}
  #topbar .tb-brand span{display:none}
  .tb-nav a{padding:.4rem .55rem;font-size:.56rem}
}

/* ---- (9) Remove transition / reveal / intro-title animations ---- */
.view.active{animation:none}
.rev{opacity:1!important;transform:none!important;transition:none!important}
.title-intro{animation:none!important}
.tabpane.on,.panel.on,.story.on{animation:none}

/* ---- (1) A real switch: turning the calendar off truly hides it ---- */
.ev-cal[hidden]{display:none!important}

/* ---- (3) Keep every e-board member's head clearly framed ---- */
.tr-photo img{object-position:50% 18%}

/* ---- Poster covers: keep the tile title/date legible over any poster ---- */
.gallery-items .frame .fbig,.gallery-items .frame .fc{text-shadow:none}
.gallery-items .frame::after{background:linear-gradient(to top,rgba(53,2,79,.9),rgba(53,2,79,.15) 55%,rgba(53,2,79,.25))}

/* ---- (4) Mission statement: centered pear/diamond, airy line spacing ---- */
.mission-block{text-align:center}
.mission-block .eyebrow{justify-content:center}
.mission-block .eyebrow::after{display:none}
.mission-text u{text-decoration-thickness:2px;text-underline-offset:5px;text-decoration-color:var(--violet)}

/* ---- (7) Search: top-bar button + overlay ---- */
.tb-search{display:inline-flex;align-items:center;gap:.45rem;background:var(--lilac);color:var(--violet);border:none;border-radius:99px;
  padding:.5rem .85rem;margin-left:.5rem;font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.tb-search:hover{background:var(--violet);color:var(--paper)}
.tb-search svg{width:.95rem;height:.95rem}
@media (max-width:620px){.tb-search span{display:none}.tb-search{padding:.5rem}}
.search-modal{position:fixed;inset:0;z-index:95;display:none;align-items:flex-start;justify-content:center;padding:clamp(3rem,10vh,7rem) var(--gutter) 2rem}
.search-modal.open{display:flex}
.sm-backdrop{position:absolute;inset:0;background:rgba(53,2,79,.55);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.sm-panel{position:relative;z-index:2;width:100%;max-width:620px;background:var(--paper);border-radius:14px;overflow:hidden;
  box-shadow:0 30px 80px rgba(53,2,79,.4);animation:gmIn .3s var(--ease-key)}
.sm-inputwrap{display:flex;align-items:center;gap:.7rem;padding:.9rem 1rem;border-bottom:1px solid var(--line)}
.sm-ic{width:1.2rem;height:1.2rem;color:var(--violet);flex:none}
#searchInput{flex:1;min-width:0;border:none;outline:none;background:none;font-family:var(--sans);font-size:1.05rem;color:var(--ink)}
#searchInput::placeholder{color:var(--stone)}
.sm-close{border:none;background:var(--paper-2);color:var(--stone);border-radius:6px;padding:.35rem .55rem;font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.sm-close:hover{background:var(--violet);color:var(--paper)}
.sm-results{max-height:min(60vh,26rem);overflow-y:auto;padding:.5rem}
.sm-hint{padding:1.1rem 1rem;color:var(--stone);font-size:.9rem}
.sm-result{display:flex;flex-direction:column;gap:.15rem;width:100%;text-align:left;background:none;border:none;border-radius:8px;padding:.7rem .85rem;cursor:pointer;transition:background .15s}
.sm-result:hover,.sm-result.active{background:var(--lilac)}
.sm-r-label{font-family:var(--serif);font-weight:600;font-size:1.1rem;color:var(--ink);line-height:1.15}
.sm-r-sub{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--violet)}

/* ============================================================
   HOME HERO — artwork-led arrangement (above the fold only)
   ============================================================ */
#v-home .hero.hero-with-art{
  min-height:100svh;max-width:none;margin:0;padding:0;
  display:grid;grid-template-columns:minmax(0,1fr);place-items:stretch;
  position:relative;isolation:isolate;overflow:hidden;
}
#v-home .hero-main-art{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center center;z-index:-2;
}
#v-home .hero-art-wash{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.93) 29%,rgba(255,255,255,.46) 48%,rgba(255,255,255,0) 66%);
}
#v-home .hero-content{
  width:min(100%,1440px);margin:0 auto;padding:clamp(7rem,12vh,9rem) var(--gutter) 2rem;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
}
#v-home .hero-content .eyebrow{margin-bottom:clamp(1.1rem,2.4vh,2rem)}
#v-home .hero-content .hero-mega{
  max-width:7.2ch;font-size:clamp(4.2rem,9.6vw,9.2rem);line-height:.84;
  text-shadow:none;
}
#v-home .hero-content .hero-mega .row{display:block}
#v-home .hero-content .hero-mega .at{display:inline-block;margin-left:.18em;vertical-align:baseline}
#v-home .hero-content .hero-meta{
  width:min(47rem,56vw);margin-top:clamp(1.8rem,4vh,3.2rem);
  background:color-mix(in srgb,var(--paper) 76%,transparent);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}
@media(max-width:760px){
  #v-home .hero.hero-with-art{min-height:auto;display:flex;flex-direction:column;background:var(--paper)}
  #v-home .hero-main-art{position:relative;inset:auto;order:2;height:44svh;min-height:310px;object-position:61% center;z-index:auto}
  #v-home .hero-art-wash{display:none}
  #v-home .hero-content{order:1;padding:clamp(6.2rem,16vh,7.4rem) var(--gutter) 2.2rem;min-height:58svh}
  #v-home .hero-content .hero-mega{font-size:clamp(3.8rem,19vw,6.2rem);max-width:none}
#v-home .hero-content .hero-meta{width:100%;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* ============================================================
   SECOND PASS — compact hero, triggered navigation, about page
   ============================================================ */
#topbar{
  padding-right:4.4rem;
  transform:translateY(-112%);
  transition:transform .48s var(--ease-key),box-shadow .25s ease;
}
#topbar.show{transform:translateY(0)}
.nav-toggle{
  position:fixed;z-index:100;top:1rem;right:1rem;width:2.8rem;height:2.8rem;
  display:grid;place-items:center;border:0;border-radius:50%;background:var(--violet);color:var(--paper);
  opacity:0;pointer-events:none;box-shadow:0 8px 24px rgba(53,2,79,.18);transition:opacity .35s ease,background .2s ease,transform .2s var(--ease-key);
}
body.ready .nav-toggle{opacity:1;pointer-events:auto}
.nav-toggle:hover{background:var(--ink);transform:translateY(2px)}
.nav-toggle span,.nav-toggle::before,.nav-toggle::after{content:"";display:block;width:1rem;height:1.5px;background:currentColor;transition:.25s var(--ease-key)}
.nav-toggle span{margin:.2rem 0}.nav-toggle[aria-expanded="true"] span{opacity:0}
.nav-toggle[aria-expanded="true"]::before{transform:translateY(.35rem) rotate(45deg)}
.nav-toggle[aria-expanded="true"]::after{transform:translateY(-.35rem) rotate(-45deg)}

#v-home .hero.hero-with-art{
  min-height:min(82svh,820px);display:grid;grid-template-columns:minmax(340px,.82fr) minmax(520px,1.18fr);
  align-items:center;gap:clamp(1rem,3vw,3rem);padding:clamp(5.6rem,10vh,7rem) var(--gutter) clamp(2rem,5vh,3.6rem);
  background:linear-gradient(135deg,var(--paper) 0 64%,var(--paper-2) 64% 100%);overflow:hidden;
}
#v-home .hero-main-art{
  position:relative;inset:auto;grid-column:2;grid-row:1;width:100%;height:auto;max-height:68svh;
  object-fit:contain;object-position:center;z-index:auto;border-radius:2px;
  filter:drop-shadow(0 22px 34px rgba(53,2,79,.12));
}
#v-home .hero-art-wash{display:none}
#v-home .hero-content{
  grid-column:1;grid-row:1;width:auto;margin:0;padding:0;min-width:0;align-self:center;
}
#v-home .hero-content .eyebrow{margin-bottom:1.35rem;color:var(--coral,#A855F7)}
#v-home .hero-content .hero-mega{
  max-width:6.5ch;margin:0;font-size:clamp(4.5rem,8.1vw,8.3rem);line-height:.79;
  letter-spacing:-.055em;text-transform:none;color:var(--ink);text-shadow:none;
}
#v-home .hero-content .hero-mega .row:first-child{color:var(--violet);font-style:italic;font-weight:400}
#v-home .hero-content .hero-mega .row:nth-child(2){color:var(--ink);font-weight:600}
#v-home .hero-content .hero-mega .at{font-size:clamp(1.25rem,2.5vw,2.4rem);color:var(--violet);letter-spacing:-.02em}
#v-home .hero-content .hero-meta{
  width:100%;margin-top:1.8rem;padding:.85rem 0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  gap:.55rem 1rem;font-size:.56rem;letter-spacing:.16em;
}

.keystrip{
  height:clamp(8.5rem,14vw,11.5rem);isolation:isolate;background:var(--violet-deep);
  border-color:var(--violet-deep);cursor:default;overflow:hidden;
}
.keystrip .k{appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;border-right:1px solid rgba(87,6,140,.26);border-radius:0;background:var(--paper);cursor:pointer}
.keystrip .k:hover,.keystrip .k:focus-visible{background:var(--lilac)}
.keystrip .k.b{width:4.4%;height:62%;background:var(--violet-deep);border:0;border-radius:0 0 5px 5px;box-shadow:0 5px 0 rgba(53,2,79,.16)}
.keystrip .k.b:hover,.keystrip .k.b:focus-visible,.keystrip .k.b.pressed{background:var(--coral,#A855F7)}
.keystrip .k.pressed{background:#FFFFFF;transform:translateY(4px)}
.keystrip .note-label{position:absolute;left:50%;bottom:.7rem;transform:translateX(-50%);font:700 .56rem var(--mono);letter-spacing:.12em;color:var(--violet);pointer-events:none}
.keystrip .scale-play{position:absolute;right:1rem;bottom:1rem;z-index:4;border:1px solid var(--violet);border-radius:99px;background:var(--paper);color:var(--violet);padding:.55rem .85rem;font:700 .56rem var(--mono);letter-spacing:.12em;text-transform:uppercase}
.keystrip .scale-play:hover{background:var(--violet);color:var(--paper)}

@media(max-width:900px){
  #topbar{padding-right:4rem}
  #v-home .hero.hero-with-art{grid-template-columns:1fr 1.1fr;min-height:76svh}
  #v-home .hero-content .hero-mega{font-size:clamp(4rem,10vw,6.7rem)}
}
@media(max-width:760px){
  #topbar{padding-right:3.8rem}
  .nav-toggle{top:.7rem;right:.7rem;width:2.55rem;height:2.55rem}
  #v-home .hero.hero-with-art{min-height:auto;display:flex;padding:0;background:var(--paper)}
  #v-home .hero-content{order:1;min-height:auto;padding:clamp(6.2rem,15vh,7.2rem) var(--gutter) 2rem}
  #v-home .hero-main-art{order:2;width:100%;height:auto;min-height:0;max-height:none;padding:0 var(--gutter) 1.2rem;filter:none}
  #v-home .hero-content .hero-mega{font-size:clamp(4rem,18vw,6rem)}
  #v-home .hero-content .hero-meta{display:grid;grid-template-columns:1fr 1fr}
  .keystrip{height:9rem}.keystrip .scale-play{right:.65rem;bottom:.55rem}.keystrip .note-label{display:none}
}

/* Focused refinements: seamless hero, restored About layout, accessible social links */
#v-home .hero.hero-with-art{
  min-height:min(78svh,760px);grid-template-columns:minmax(330px,.78fr) minmax(520px,1.22fr);
  gap:0;background:var(--paper);padding-bottom:clamp(1rem,3vh,2rem);
}
#v-home .hero-main-art{
  width:calc(100% + 3vw);margin-left:-3vw;border-radius:0;filter:none;mix-blend-mode:multiply;
}
#v-home .hero-content{z-index:2}
#v-home .hero-content .hero-mega{font-size:clamp(4.7rem,8.5vw,8.7rem)}

.home-about{
  position:relative;isolation:isolate;
  background-color:#191919;background-image:url("brand/about-pattern-v3.png");
  background-size:cover;background-position:center;
}
.home-about::before{content:"";position:absolute;inset:1rem;border:1px solid rgba(255,255,255,.22);pointer-events:none;z-index:-1}

/* Preserve the original About page layout; typography receives only a light polish. */
#v-about .mission-text{letter-spacing:-.025em;line-height:.97}
#v-about .vrow2 b{letter-spacing:-.02em}
#v-about .tr-head b{letter-spacing:-.025em}
#v-about .tr-role{letter-spacing:.18em}
#v-about .team-row .bio{line-height:1.66}

.contact-view .contact-list a{
  min-height:4rem;padding:.9rem .75rem;text-decoration:none;border-radius:4px;
}
.contact-view .contact-list a .name{font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.contact-view .contact-list a:focus-visible{outline:3px solid var(--violet);outline-offset:3px;background:var(--lilac);color:var(--ink)}
.contact-view .contact-list a:focus-visible .ext{color:var(--violet-deep)}
.contact-list .ci{width:1.8rem;height:1.8rem;color:var(--violet);overflow:visible}
.contact-list .ci svg{width:1.8rem;height:1.8rem;overflow:visible}
.contact-list .ext{font-size:.62rem;letter-spacing:.14em;color:var(--violet-deep)}
.foot-social a{color:var(--paper)}
.foot-social a.fs-brand{color:var(--paper)}

@media(max-width:760px){
  #v-home .hero.hero-with-art{min-height:auto;background:var(--paper)}
  #v-home .hero-main-art{width:100%;margin:0;mix-blend-mode:multiply;padding-bottom:0}
  .contact-view .contact-list a{align-items:center;flex-wrap:wrap}
  .contact-list .ext{width:100%;margin-left:2.7rem!important}
}

/* ============================================================
   FINAL PASS — immersive home hero + invisible top-edge nav
   ============================================================ */

/* Homepage art now fills the whole home view as a background, with the
   title set into the collage's negative space (upper-left). */
#v-home .hero.hero-with-art{
  display:block;position:relative;isolation:isolate;overflow:hidden;
  min-height:100svh;width:100%;max-width:none;margin:0;padding:0;gap:0;
  grid-template-columns:none;background:var(--paper);
}
#v-home .hero-main-art{
  position:absolute;inset:0;width:100%;height:100%;max-height:none;margin:0;
  object-fit:cover;object-position:64% center;
  border-radius:0;filter:none;mix-blend-mode:normal;z-index:-2;
}
/* natural fade: only a light, symmetric fade on the left & right edges so the
   sides never feel heavy — the centre of the art stays the focus — plus a soft
   dissolve into the page at the very bottom and a subtle top wash for the title */
#v-home .hero-art-wash{
  display:block;position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.70) 0%, rgba(255,255,255,0) 17%, rgba(255,255,255,0) 83%, rgba(255,255,255,.70) 100%),
    linear-gradient(to bottom, rgba(255,255,255,.34) 0%, rgba(255,255,255,0) 34%),
    linear-gradient(to top, var(--paper) 0%, rgba(255,255,255,0) 17%);
}
#v-home .hero-content{
  position:relative;z-index:2;grid-column:auto;grid-row:auto;
  width:min(100%,1500px);margin:0 auto;min-height:100svh;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  padding:clamp(5rem,9vh,7rem) var(--gutter) clamp(3rem,7vh,5rem);
  padding-left:clamp(1.5rem,11vw,13rem);
  transform:translateY(-4vh);
}
#v-home .hero-content .eyebrow{color:var(--violet);margin-bottom:clamp(1rem,2.4vh,1.9rem)}
#v-home .hero-content .hero-mega{
  max-width:10ch;margin:0;
  font-size:clamp(5.2rem,12.5vw,12.5rem);line-height:.82;letter-spacing:-.05em;
  text-shadow:none;
}
#v-home .hero-content .hero-mega .row:first-child{color:var(--violet);font-style:italic;font-weight:400}
#v-home .hero-content .hero-mega .row:nth-child(2){color:var(--ink);font-weight:600}
#v-home .hero-content .hero-mega .at{font-size:clamp(1.4rem,3vw,3rem);color:var(--violet);font-style:italic;letter-spacing:-.02em}

@media(max-width:760px){
  #v-home .hero.hero-with-art{min-height:100svh;display:block;background:var(--paper)}
  #v-home .hero-main-art{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-height:none;padding:0;margin:0;object-position:66% center;mix-blend-mode:normal}
  #v-home .hero-art-wash{display:block;background:
    linear-gradient(to top, var(--paper) 3%, rgba(255,255,255,0) 40%),
    linear-gradient(to bottom, rgba(255,255,255,.5) 0%, rgba(255,255,255,0) 42%)}
  #v-home .hero-content{order:0;min-height:100svh;justify-content:flex-start;align-items:flex-start;
    padding:clamp(6rem,15vh,7.6rem) var(--gutter) 2rem;padding-left:var(--gutter);transform:none}
  #v-home .hero-content .hero-mega{font-size:clamp(4rem,16vw,6.4rem);max-width:none}
}

/* ============================================================
   ABOUT — scrolling past-event backdrop, dominant mission
   ============================================================ */
#v-about .about-opener{
  position:relative;isolation:isolate;overflow:hidden;overflow:clip;contain:paint;color:var(--ink);
  min-height:100svh;display:flex;align-items:center;justify-content:center;
  padding:clamp(6rem,12vh,8.5rem) var(--gutter) clamp(3rem,7vh,5rem);
}
/* dimmed marquee rows of past events */
#v-about .about-bg{
  --about-row-gap:clamp(.6rem,1.4vw,1.1rem);
  --about-half-gap:clamp(.3rem,.7vw,.55rem);
  position:absolute;inset:0;z-index:-2;pointer-events:none;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  width:100%;max-width:100%;overflow:hidden;overflow:clip;contain:paint;clip-path:inset(0);
  gap:var(--about-row-gap);
}
#v-about .about-opener::before{             /* paper veil keeps the text dominant */
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.82),rgba(255,255,255,.82)),
    radial-gradient(ellipse 60% 56% at 50% 50%, rgba(255,255,255,.5) 0%, rgba(255,255,255,.92) 100%);
}
#v-about .about-row{display:flex;gap:var(--about-row-gap);width:max-content;flex:none;will-change:transform;backface-visibility:hidden;transform:translate3d(0,0,0)}
#v-about .about-row img{
  height:clamp(120px,19vh,196px);width:clamp(180px,28.5vh,294px);flex:none;
  border-radius:7px;object-fit:cover;filter:grayscale(.12);background:#FFFFFF;
}
#v-about .about-row--l{animation:aboutMarqueeL 72s linear infinite}
#v-about .about-row--r{animation:aboutMarqueeR 90s linear infinite}
#v-about .about-row--slow{animation-duration:108s}
@keyframes aboutMarqueeL{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-50% - var(--about-half-gap)),0,0)}}
@keyframes aboutMarqueeR{from{transform:translate3d(calc(-50% - var(--about-half-gap)),0,0)}to{transform:translate3d(0,0,0)}}

#v-about .about-lead{
  position:relative;z-index:2;max-width:1100px;margin:0 auto;text-align:center;
}
#v-about .about-lead .eyebrow{justify-content:center;margin-bottom:clamp(1.2rem,3vh,2.2rem)}
#v-about .about-lead .eyebrow::after{display:none}
/* the mission is the dominant element */
#v-about .mission-text{
  font-family:var(--serif);font-weight:500;color:var(--ink);
  font-size:clamp(2.2rem,5vw,4.1rem);line-height:1.08;letter-spacing:-.028em;
  max-width:19ch;margin:0 auto;text-wrap:balance;
  text-shadow:none;
}
#v-about .mission-text em{font-style:italic;color:var(--violet)}
#v-about .mission-text u{text-decoration-thickness:2px;text-underline-offset:6px;text-decoration-color:var(--violet)}
/* values: small, plain, no enclosing lines, under the main text */
#v-about .values-block{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.6vw,2.4rem);
  border:none;max-width:840px;margin:clamp(2rem,4.5vh,3rem) auto 0;
}
#v-about .values-block .vrow2{
  border:none;padding:0;text-align:center;align-items:center;gap:.35rem;
}
#v-about .values-block .v-no{font-family:var(--mono);font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;color:var(--violet)}
#v-about .values-block .vrow2 b{font-family:var(--serif);font-weight:600;color:var(--ink);font-size:clamp(1rem,1.4vw,1.22rem);line-height:1.2;letter-spacing:-.01em}
#v-about .values-block .vrow2 b em{font-style:italic;color:var(--violet)}
#v-about .values-block .v-d{font-size:.86rem;color:var(--stone);line-height:1.45;max-width:26ch;margin:0 auto}

@media (prefers-reduced-motion: reduce){
  #v-about .about-row{animation:none}
}
@media(max-width:760px){
  #v-about .about-opener{min-height:100svh;padding-top:clamp(6rem,15vh,7.5rem)}
  #v-about .about-row img{height:clamp(96px,15vh,140px);width:clamp(150px,24vh,224px)}
  #v-about .mission-text{font-size:clamp(2rem,8vw,3rem)}
  #v-about .values-block{grid-template-columns:1fr;gap:1.5rem;max-width:420px}
}

/* Nav is hidden; an invisible thin strip along the top edge reveals it. */
.nav-toggle{display:none!important}
#navHotzone{
  position:fixed;top:0;left:0;right:0;z-index:64;height:16px;width:100%;
  border:0;padding:0;margin:0;background:transparent;cursor:pointer;
  -webkit-appearance:none;appearance:none;
}
#navHotzone::after{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:46px;height:3px;border-radius:0 0 4px 4px;background:var(--violet);
  opacity:0;transition:opacity .25s ease;
}
#navHotzone:hover::after{opacity:.45}
#navHotzone:focus-visible{outline:none}
#navHotzone:focus-visible::after{opacity:.7;height:4px}

/* ============================================================
   HOME HIGHLIGHTS — "See it all" cards on both ends, subtle side fade
   ============================================================ */
/* a soft, barely-there fade at each edge (not a hard cut, not obvious either) */
#v-home .hl-track{
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 2%, #000 98%, transparent 100%);
  mask-image:linear-gradient(to right, transparent 0, #000 2%, #000 98%, transparent 100%);
}
/* ============================================================
   HOME HERO — gentle dim + title lifted for breathing room
   ============================================================ */
#v-home .hero-art-wash{
  background:
    linear-gradient(90deg, rgba(255,255,255,.70) 0%, rgba(255,255,255,0) 17%, rgba(255,255,255,0) 83%, rgba(255,255,255,.70) 100%),
    linear-gradient(to bottom, rgba(255,255,255,.34) 0%, rgba(255,255,255,0) 34%),
    linear-gradient(to top, var(--paper) 0%, rgba(255,255,255,0) 17%),
    linear-gradient(rgba(53,2,79,.10), rgba(53,2,79,.10));
}
#v-home .hero-content{justify-content:flex-start;padding-top:clamp(6rem,15vh,9.5rem);transform:none}
@media(max-width:760px){
  #v-home .hero-content{justify-content:flex-start;padding-top:clamp(6rem,15vh,7.6rem)}
}

/* ============================================================
   EVENTS FEATURED — poster left-aligned to the filter row; no Cost row
   ============================================================ */
#v-events .featured{max-width:none;margin-left:0;margin-right:0}
/* poster's left edge lines up with the "All" filter button (past the "Type" label) */
#v-events .poster{justify-self:start;margin-left:calc(4.5rem + 1rem)}
@media (max-width:1000px){#v-events .poster{margin-left:0}}
/* the two remaining meta rows fill the height the third (Cost) used to */
#v-events .featured .meta-list div{padding:1.05rem 0}

/* ============================================================
   GALLERY GRID — muted "archive" tiles; the active one pops to full colour
   (grid only, never list) — desaturated wash, like the reference
   ============================================================ */
#galItems .frame{transition:transform .35s var(--ease-key), box-shadow .35s var(--ease-key)}
/* desaturated + lightened = the hazy, muted default */
#galItems .frame .ph{filter:grayscale(.85) brightness(1.07) contrast(.92);transition:filter .45s var(--ease-key)}
/* a soft lilac wash over the top completes the faded look */
#galItems .frame::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;display:block;
  background:rgba(220,201,232,.34);
  transition:opacity .45s var(--ease-key);
}
/* the active (hovered / focused) tile clears to full colour and lifts out */
#galItems .frame:hover,#galItems .frame:focus-visible{
  transform:scale(1.05) rotate(-1.8deg);z-index:5;
  box-shadow:0 24px 52px rgba(53,2,79,.32);
}
#galItems .frame:hover::before,#galItems .frame:focus-visible::before{opacity:0}
#galItems .frame:hover .ph,#galItems .frame:focus-visible .ph{filter:none}

/* "at NYU" lifted off the busy collage for legibility */
#v-home .hero-content .hero-mega .at{
  color:var(--violet-deep,#191919);
  text-shadow:none;
}

/* ============================================================
   RESPONSIVE COMPOSITION — final layout guardrails
   Fluid sizing, safe wrapping, and compact-screen reflow.
   ============================================================ */
html{font-size:clamp(15px,.25vw + 14px,17px)}
body{min-width:0}
:where(main,section,article,header,footer,nav,div){min-width:0}
:where(h1,h2,h3,h4,p,a,span){overflow-wrap:break-word}

@media (max-width:1100px){
  :root{--gutter:clamp(1.25rem,4.5vw,3rem)}
  .home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .series-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-highlight,.join-grid,.values,.about-cols{gap:clamp(1.5rem,4vw,3rem)}
}

@media (max-width:820px){
  section.block{padding-block:clamp(3rem,9vw,4.5rem)}
  .view-head{padding-top:clamp(4.5rem,12vw,6rem)}
  .home-grid,.series-grid,.gallery-highlight,.featured,.join-grid,
  .values,.about-cols,.panel,.story,.gm-panel{grid-template-columns:minmax(0,1fr)}
  .story-art{border-right:0;border-bottom:1px solid var(--violet)}
  .sec-head{align-items:flex-start;gap:1rem}
  .gallery-items{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-grid{flex-direction:column}
  .foot-links{width:100%;justify-content:space-between;gap:2rem}
}

@media (max-width:600px){
  :root{--gutter:clamp(1rem,5vw,1.4rem)}
  #topbar{justify-content:flex-start;padding:.55rem var(--gutter);overflow-x:auto}
  #topbar .tb-nav{width:max-content;flex:none}
  #topbar .tb-nav a{padding:.55rem .65rem;font-size:.54rem;letter-spacing:.1em}

  #v-home .hero-content{
    padding:clamp(5.5rem,12vh,7rem) var(--gutter) 2rem;
    min-height:100svh;
  }
  #v-home .hero-content .hero-mega{
    font-size:clamp(3.15rem,15.5vw,5.4rem);line-height:.86;max-width:8.5ch;
  }
  #v-home .hero-content .hero-mega .at{font-size:clamp(1.15rem,6vw,1.8rem)}
  #v-home .hero-content .hero-meta{grid-template-columns:1fr;gap:.75rem}
  #v-home .hero-main-art{object-position:62% center}

  .home-grid,.series-grid,.gallery-items,.pager{grid-template-columns:minmax(0,1fr)}
  .gallery-items{gap:1rem}
  .frame{aspect-ratio:4/5}
  .facts,.home-about .facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.25rem .75rem}
  .team-row,.team-row:nth-child(even){grid-template-columns:minmax(0,1fr)}
  .tr-photo{width:min(100%,22rem);justify-self:center}

  .tabs{width:100%;scroll-snap-type:x proximity}
  .tabs button{flex:0 0 auto;padding:.8rem 1rem;scroll-snap-align:start}
  .filter-row{align-items:flex-start}
  .filter-label{width:100%;min-width:0}
  .ev-count{width:100%;margin-left:0}
  .ev-card{grid-template-columns:3rem minmax(0,1fr);padding-inline:0}
  .acc-head{padding:1rem .8rem;gap:.65rem}
  .acc-in{padding:1.2rem .8rem 1.4rem}

  .nl-form{flex-direction:column}
  .nl-form button{min-height:3rem;padding:.8rem 1rem}
  .contact-list a{align-items:flex-start}
  .foot-brand{align-items:flex-start}
  .foot-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-legal{flex-direction:column}
}

@media (max-width:380px){
  #v-home .hero-content .hero-mega{font-size:clamp(2.85rem,15vw,3.65rem)}
  .facts,.home-about .facts,.foot-links{grid-template-columns:minmax(0,1fr)}
  .chips{gap:.5rem}
  .chips button,.filter-row .chips button{padding:.45rem .7rem;letter-spacing:.12em}
  .meta-list div{flex-direction:column;gap:.2rem}
  .gallery-items.as-list .frame img.ph{width:5.5rem;min-width:5.5rem}
}

/* Home additions: upcoming events and expanded program material */
.home-featured{background:var(--paper-2);padding:clamp(3.5rem,7vw,6rem) var(--gutter)}
.home-featured .wrap{max-width:1200px}
.home-featured-head{display:flex;align-items:end;justify-content:space-between;gap:1.5rem;margin-bottom:2rem}
.home-featured-head h2,.home-programs-head h2{font-family:var(--serif);font-weight:500;font-size:clamp(2.4rem,5vw,4rem);line-height:.95;letter-spacing:-.025em}
.home-featured-head h2 em,.home-programs-head h2 em{color:var(--violet);font-weight:400}
.upcoming-stack{display:flex;flex-direction:column}
.upcoming-card{display:grid;grid-template-columns:clamp(9rem,20vw,15rem) minmax(0,1fr) auto;align-items:center;gap:clamp(1.2rem,3vw,2.5rem);padding:1.2rem 0;border-top:1px solid var(--line);text-decoration:none;scroll-margin-top:8rem}
.upcoming-card:last-child{border-bottom:1px solid var(--line)}
.upcoming-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px}
.upcoming-date{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--violet)}
.upcoming-card h3{margin:.2rem 0 .35rem;font-family:var(--serif);font-size:clamp(1.55rem,3vw,2.25rem);font-weight:600;line-height:1}
.upcoming-card p{max-width:43rem;color:var(--stone);font-size:.9rem}
.upcoming-arrow{font-family:var(--serif);font-size:2rem;color:var(--violet);transition:transform .25s var(--ease-key)}
.upcoming-card:hover .upcoming-arrow{transform:translateX(6px)}

.home-programs{padding:clamp(3.5rem,7vw,6rem) var(--gutter);background:var(--paper)}
.home-programs-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,32rem);gap:2rem;align-items:end;margin-bottom:2rem}
.home-programs-head .lead{margin:0}
.home-programs .tabs{margin-bottom:.4rem}
.home-programs .tabwrap{padding-top:1.2rem}
.home-programs .panel{grid-template-columns:minmax(12rem,.7fr) minmax(18rem,1.2fr) minmax(14rem,.8fr);gap:clamp(1.3rem,3vw,2.6rem);align-items:stretch;background:var(--card);padding:clamp(1rem,2vw,1.5rem);border-radius:12px}
.program-visual{position:relative;min-height:19rem;border-radius:9px;overflow:hidden;background:var(--ink)}
.program-visual img{width:100%;height:100%;object-fit:cover}
.program-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(53,2,79,.65),transparent 65%)}
.program-visual span{position:absolute;z-index:2;left:1rem;right:1rem;bottom:1rem;color:var(--paper);font-family:var(--mono);font-size:.58rem;letter-spacing:.15em;text-transform:uppercase}
.program-copy{display:flex;flex-direction:column;justify-content:center;padding:.5rem 0}
.program-kicker{display:inline-flex;align-self:flex-start;margin-bottom:.8rem;padding:.35rem .65rem;border-radius:99px;background:var(--lilac);color:var(--violet);font:700 .56rem var(--mono);letter-spacing:.14em;text-transform:uppercase}
.program-highlight{display:inline;padding:.08em .2em;background:linear-gradient(transparent 58%,#DCC9E8 58%);font-weight:600}
.home-programs .panel-side{display:flex;flex-direction:column;justify-content:center;padding:1rem;background:rgba(255,255,255,.72);border-radius:9px}
#v-events .ev-card.home-event-target{background:var(--lilac);box-shadow:inset 5px 0 0 var(--violet)}
#v-events .ev-card[id]{scroll-margin-top:8rem}

/* Home section hierarchy and expanded Discover More grid */
.home-featured-head{display:block}
.home-featured-head .eyebrow::after{display:none}
.home-featured .section-end-link,
.hl-strip .section-end-link{display:flex;justify-content:center;margin-top:clamp(1.5rem,3vw,2.4rem)}
.home-featured .section-end-link .sec-link,
.hl-strip .section-end-link .sec-link{display:inline-flex;align-items:center;justify-content:center;min-height:3.5rem;padding:.9rem 1.5rem;border:1px solid var(--violet);border-radius:99px;background:#FFFFFF;color:var(--violet);font:700 clamp(.72rem,1vw,.9rem) var(--mono);letter-spacing:.13em;text-transform:uppercase;text-decoration:none;transition:background .2s ease,color .2s ease,transform .2s ease}
.home-featured .section-end-link .sec-link:hover,
.hl-strip .section-end-link .sec-link:hover{background:var(--violet);color:#FFFFFF;transform:translateY(-2px)}
#v-home .hl-head{display:block;margin-bottom:clamp(1.3rem,3vw,2.2rem)}
#v-home .hl-head .eyebrow,
.home-programs-head .eyebrow,
.home-featured-head h2{font-family:var(--serif);font-size:clamp(2.4rem,6vw,5.5rem);font-weight:500;line-height:.94;letter-spacing:-.035em;text-transform:none;color:#191919}
#v-home .hl-head .eyebrow::after{display:none}
.home-programs-head{display:block;margin-bottom:clamp(1.8rem,4vw,3rem)}
.home-programs-head .eyebrow::after{display:none}
.home-featured-head h2 em{font-style:normal;color:#191919}
.home-featured .upcoming-stack{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(18rem,.85fr);grid-template-rows:repeat(2,minmax(16rem,1fr));gap:clamp(1rem,2vw,1.5rem)}
.home-featured .upcoming-card{position:relative;isolation:isolate;display:block;min-height:17rem;padding:0;border:0;border-radius:0;overflow:hidden;background:#191919;color:#FFFFFF}
.home-featured .upcoming-card:first-child{grid-row:1/3;min-height:36rem}
.home-featured .upcoming-card::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(25,25,25,.88) 0%,rgba(25,25,25,.2) 62%,rgba(25,25,25,.05) 100%);transition:background .35s ease}
.home-featured .upcoming-card img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border-radius:0;object-fit:cover;transition:transform .55s var(--ease-key)}
.home-featured .upcoming-copy{position:absolute;left:clamp(1.2rem,3vw,2rem);right:clamp(1.2rem,3vw,2rem);bottom:clamp(1.2rem,3vw,2rem);z-index:2;display:block;transition:transform .35s var(--ease-key)}
.home-featured .upcoming-date{color:#FFFFFF}
.home-featured .upcoming-card h3{color:#FFFFFF;font-size:clamp(1.7rem,3.4vw,3rem)}
.home-featured .upcoming-card:not(:first-child) h3{font-size:clamp(1.45rem,2.2vw,2rem)}
.home-featured .upcoming-card p{color:#FFFFFF;opacity:.9}
.home-featured .upcoming-arrow{position:absolute;right:1.4rem;top:1.2rem;z-index:2;color:#FFFFFF}
.home-featured .upcoming-card:hover img,
.home-featured .upcoming-card:focus-visible img{transform:scale(1.045)}
.home-featured .upcoming-card:hover::before,
.home-featured .upcoming-card:focus-visible::before{background:linear-gradient(to top,rgba(87,6,140,.92) 0%,rgba(25,25,25,.18) 68%,rgba(25,25,25,.03) 100%)}
.home-featured .upcoming-card:hover .upcoming-copy,
.home-featured .upcoming-card:focus-visible .upcoming-copy{transform:translateY(-.35rem)}
@media(max-width:760px){
  .home-featured .upcoming-stack{grid-template-columns:1fr;grid-template-rows:none}
  .home-featured .upcoming-card,
  .home-featured .upcoming-card:first-child{grid-row:auto;min-height:clamp(19rem,92vw,29rem)}
  .home-featured .upcoming-card p{display:block}
}
.discover-grid{display:grid;grid-template-columns:1fr;gap:clamp(3rem,8vw,7rem);max-width:1120px;margin:0 auto}
.home-programs .program-card{display:grid;grid-template-columns:minmax(18rem,1.05fr) minmax(16rem,.95fr);gap:clamp(2rem,6vw,6rem);align-items:center;padding:0;background:#FFFFFF;border:0;border-radius:0}
.home-programs .program-card:nth-child(even) .program-visual{order:2}
.home-programs .program-card:nth-child(even) .program-copy{order:1;padding-left:clamp(1rem,4vw,4rem)}
.home-programs .program-visual{width:100%;min-height:0;aspect-ratio:1;border-radius:0;background:#FFFFFF}
.home-programs .program-visual img{width:100%;height:100%;object-fit:cover}
.home-programs .program-copy{justify-content:center;align-items:flex-start;padding-right:clamp(1rem,4vw,4rem)}
.home-programs .program-copy h4{font-size:clamp(2rem,4vw,3.6rem);line-height:.98}
.home-programs .program-copy .desc{margin-top:1.2rem;font-size:clamp(.95rem,1.3vw,1.08rem);line-height:1.65;max-width:34rem}
.home-programs .program-copy .note{font-size:.62rem;line-height:1.6}
.home-programs .program-copy .btn{align-self:flex-start;margin-top:1.5rem;padding:.85rem 1.1rem;font-size:.62rem}
@media(max-width:760px){
  .discover-grid{gap:3.5rem}
  .home-programs .program-card{grid-template-columns:1fr;gap:1.5rem}
  .home-programs .program-card:nth-child(even) .program-visual,
  .home-programs .program-card:nth-child(even) .program-copy{order:initial}
  .home-programs .program-copy,
  .home-programs .program-card:nth-child(even) .program-copy{padding:0}
}

/* Temporary full-bleed arch hero */
#v-home .hero.hero-with-art{position:relative;isolation:isolate;display:block;min-height:100svh;padding:0;overflow:hidden;background:var(--violet-deep)}
#v-home .hero-main-art{position:absolute;inset:0;z-index:0;width:100%;height:100%;min-height:0;max-height:none;margin:0;padding:0;object-fit:cover;object-position:center;mix-blend-mode:normal;filter:none}
#v-home .hero-art-wash{display:none}
#v-home .hero-content{position:relative;z-index:2;min-height:100svh;color:#FFFFFF;padding-left:clamp(1.5rem,9vw,10rem)}
#v-home .hero-content .eyebrow{color:var(--lilac);text-shadow:none}
#v-home .hero-content .eyebrow::after{background:var(--accent)}
#v-home .hero-content .hero-mega{filter:none;text-shadow:none}
#v-home .hero-content .hero-mega .row:first-child{color:#FFFFFF}
#v-home .hero-content .hero-mega .row:nth-child(2){color:var(--paper-2)}
#v-home .hero-content .hero-mega .at{color:var(--lilac);text-shadow:none}
#v-home .hero-content .btn-ghost{background:#FFFFFF;color:var(--violet-deep)}
#v-home .hero-content .btn-ghost:hover{background:var(--electric);color:var(--violet-deep)}

/* Palette role refinements */
.btn-solid:hover,.tb-cta:hover,#menuBtn:hover{background:var(--plum);border-color:var(--plum)}
.btn-ghost{background:var(--violet-2);color:#FFFFFF}
.btn-ghost:hover{background:var(--plum);color:#FFFFFF}
.tabs button[aria-selected="true"],.chips button[aria-selected="true"],.view-toggle button[aria-pressed="true"]{background:var(--violet-2);color:#FFFFFF}
.tabs button:hover,.chips button:hover{background:var(--plum);color:#FFFFFF}
.tb-nav a::after,.sec-link::after{background:var(--accent)}
.tb-search:hover,.icon-btn:hover{background:var(--plum);color:#FFFFFF}
.ev-ico,.upcoming-arrow{color:var(--accent)}
.keystrip .k.b:hover,.keystrip .k.b:focus-visible,.keystrip .k.b.pressed{background:var(--electric)}
.program-kicker,.tag{background:var(--lilac);color:var(--violet)}
.program-highlight{background:linear-gradient(transparent 58%,var(--lilac) 58%)}

/* Keep photography natural: remove grayscale and color-wash layers */
#app img,#app .ph,#v-about .about-row img,#galItems .frame .ph{filter:none!important;mix-blend-mode:normal!important}
.frame::after,.story-art::after,.gh-frames .ghf::after,.poster::before,.hl-card::after,.program-visual::after{display:none!important}
.frame .fbig,.frame .fc,.story-art .big,.gh-frames .ghf em,.hl-cap,.program-visual span{text-shadow:none}
#v-home .hero-content .hero-mega{-webkit-text-stroke:0;text-shadow:none}

/* Pure whites and unshaded type */
body *{text-shadow:none!important;-webkit-text-stroke:0!important}
#v-home .hero-content .hero-mega .row:first-child,
#v-home .hero-content .hero-mega .row:nth-child(2),
#v-home .hero-content .hero-mega .at{color:#FFFFFF}

/* Highlights: equal visible columns that fill every viewport */
#v-home .hl-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3rem)/4);gap:1rem;padding:.2rem 0 1rem;-webkit-mask-image:none;mask-image:none}
#v-home .hl-card{width:100%;min-width:0;flex:none}
@media(min-width:1800px){#v-home .hl-track{grid-auto-columns:calc((100% - 4rem)/5)}}
@media(max-width:1100px){#v-home .hl-track{grid-auto-columns:calc((100% - 2rem)/3)}}
@media(max-width:720px){#v-home .hl-track{grid-auto-columns:calc((100% - 1rem)/2)}}
@media(max-width:440px){#v-home .hl-track{grid-auto-columns:100%}}

/* Piano-key palette: white fields, black type, NYU violet emphasis */
.gallery-view,.gallery-view section.block,.home-featured,.home-programs,
.story,.home-card,.pager a,.series-card,.cal-month,.contact-view .nl-form,
.sm-close,.ev-modal .gm-media{background:#FFFFFF}
.home-sub,footer{background:#191919}

/* Rebuilt welcome statement */
#v-home .hero-content .hero-welcome-title{display:flex;flex-direction:column;align-items:flex-start;gap:.02em;max-width:12ch;text-transform:none;color:#FFFFFF;line-height:.82}
#v-home .hero-welcome-title .hero-welcome{font-family:var(--serif);font-size:1em;font-style:italic;font-weight:500;color:#FFFFFF;letter-spacing:-.055em}
#v-home .hero-welcome-title .hero-bridge{margin:.35rem 0 .45rem .25rem;font:700 clamp(.62rem,1vw,.82rem) var(--mono);letter-spacing:.22em;text-transform:uppercase;color:#FFFFFF}
#v-home .hero-welcome-title .hero-society{display:inline-block;padding:.07em .14em .1em;background:var(--violet);color:#FFFFFF;font-family:var(--serif);font-size:.72em;font-weight:600;letter-spacing:-.045em;line-height:.88;white-space:nowrap}
#v-home .hero-welcome-title .hero-at-nyu{margin:.35rem 0 0 .18rem;color:#FFFFFF;font-family:var(--serif);font-size:.32em;font-style:italic;font-weight:500;letter-spacing:0}

/* Violet top bar with inverted controls */
#topbar{background:var(--violet);color:#FFFFFF;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 5px 20px rgba(25,25,25,.16)}
#topbar .tb-brand span,#topbar .tb-brand:hover span{color:#FFFFFF}
#topbar .tb-nav a{color:#FFFFFF}
#topbar .tb-nav a:hover{color:#FFFFFF;background:rgba(255,255,255,.14)}
#topbar .tb-nav a::after{background:#FFFFFF}
#topbar .tb-nav a.current,#topbar .tb-nav a.current:hover{background:#FFFFFF;color:var(--violet)}
#topbar .tb-search{background:#FFFFFF;color:var(--violet)}
#topbar .tb-search:hover{background:#191919;color:#FFFFFF}

/* Scroll-aware header: transparent at each view's origin, violet after scrolling. */
#topbar{
  transform:none!important;
  border-bottom:1px solid transparent;
  transition:background-color .22s ease,color .22s ease,box-shadow .22s ease,border-color .22s ease;
}
#topbar .tb-brand span,
#topbar .tb-brand .brand-logo,
#topbar .tb-nav a,
#topbar .tb-search{
  transition:color .22s ease,background-color .22s ease,border-color .22s ease,filter .22s ease;
}
#topbar.bar-transparent{background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
#topbar.bar-home-hero .tb-brand span,
#topbar.bar-home-hero .tb-brand:hover span,
#topbar.bar-home-hero .tb-nav a{color:#FFFFFF}
#topbar.bar-home-hero .brand-logo{filter:brightness(0) saturate(100%) invert(14%) sepia(94%) saturate(4919%) hue-rotate(277deg) brightness(74%) contrast(112%)}
#topbar.bar-home-hero .tb-nav a:hover{color:#FFFFFF;background:rgba(255,255,255,.14)}
#topbar.bar-home-hero .tb-nav a::after{background:#FFFFFF}
#topbar.bar-home-hero .tb-nav a.current,
#topbar.bar-home-hero .tb-nav a.current:hover{color:#FFFFFF;background:rgba(255,255,255,.18)}
#topbar.bar-home-hero .tb-search{color:#FFFFFF;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.62)}
#topbar.bar-home-hero .tb-search:hover{color:#191919;background:#FFFFFF;border-color:#FFFFFF}
#topbar.bar-light-origin .tb-brand span,
#topbar.bar-light-origin .tb-brand:hover span,
#topbar.bar-light-origin .tb-nav a{color:#191919}
#topbar.bar-light-origin .brand-logo{filter:brightness(0)}
#topbar.bar-light-origin .tb-nav a:hover{color:#191919;background:rgba(25,25,25,.08)}
#topbar.bar-light-origin .tb-nav a::after{background:#191919}
#topbar.bar-light-origin .tb-nav a.current,
#topbar.bar-light-origin .tb-nav a.current:hover{color:#191919;background:rgba(25,25,25,.1)}
#topbar.bar-light-origin .tb-search{color:#191919;background:transparent;border:1px solid rgba(25,25,25,.5)}
#topbar.bar-light-origin .tb-search:hover{color:#FFFFFF;background:#191919;border-color:#191919}
#navHotzone{display:none!important}

/* Larger persistent header and controls */
#topbar{padding:1rem 5.4rem 1rem var(--gutter);gap:2.4rem}
#topbar .tb-brand{gap:1rem}
#topbar .tb-brand .brand-logo{height:3.25rem}
#topbar .tb-brand span{font-size:.78rem;letter-spacing:.17em;line-height:1.4}
.tb-nav{gap:.5rem}
.tb-nav a{font-size:.78rem;padding:.8rem 1.1rem}
.tb-search{font-size:.78rem;padding:.8rem 1.15rem;gap:.65rem}
.tb-search svg{width:1.35rem;height:1.35rem}

@media(max-width:900px){
  .home-programs .panel{grid-template-columns:minmax(11rem,.65fr) minmax(0,1.35fr)}
  .home-programs .panel-side{grid-column:1/-1}
  #topbar{padding-right:4.8rem}
}
@media(max-width:700px){
  .home-featured-head,.home-programs-head{display:block}
  .home-featured-head .sec-link,.home-programs-head .lead{display:block;margin-top:1rem}
  .upcoming-card{grid-template-columns:7rem minmax(0,1fr);gap:1rem}
  .upcoming-card img{aspect-ratio:1}
  .upcoming-card p{display:none}
  .upcoming-arrow{display:none}
  .home-programs .panel{grid-template-columns:minmax(0,1fr)}
  .program-visual{min-height:15rem}
  .home-programs .panel-side{grid-column:auto}
  #v-home .hero-main-art{object-position:54% center}
}
@media(max-width:600px){
  #topbar{padding:.85rem 4rem .85rem var(--gutter);overflow-x:hidden;gap:.55rem}
  #topbar .tb-brand .brand-logo{height:2.8rem}
  #topbar .tb-nav{width:100%;max-width:100%;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:.15rem}
  #topbar .tb-nav a{font-size:.68rem;padding:.66rem .82rem}
  .tb-search{font-size:.68rem;padding:.66rem}
  .tb-search svg{width:1.2rem;height:1.2rem}
}

@media (max-height:620px) and (min-width:761px){
  #v-home .hero-content{padding-top:5rem;padding-bottom:2rem}
  #v-home .hero-content .hero-mega{font-size:clamp(4.2rem,10vh,6.5rem)}
}

/* Centered, type-led Home hero: emphasis comes from scale and type, not boxes. */
#v-home .hero-content{
  width:min(100%,1440px);margin:0 auto;padding:clamp(7rem,14vh,10rem) var(--gutter) clamp(3rem,8vh,6rem);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transform:none;
}
#v-home .hero-content > .eyebrow{justify-content:center;margin:0 0 clamp(1.2rem,3vh,2rem);color:#FFFFFF}
#v-home .hero-content > .eyebrow::after{display:none}
#v-home .hero-content .hero-welcome-title{align-items:center;max-width:15ch;margin:0 auto;line-height:.82}
#v-home .hero-welcome-title .hero-welcome{font-size:.72em;font-style:italic;font-weight:400;letter-spacing:-.04em}
#v-home .hero-welcome-title .hero-bridge{margin:.7rem 0;font-size:clamp(.65rem,1vw,.9rem);letter-spacing:.3em}
#v-home .hero-welcome-title .hero-society{padding:0;background:transparent;color:#FFFFFF;font-size:1em;font-weight:650;line-height:.82;white-space:nowrap}
#v-home .hero-welcome-title .hero-at-nyu{margin:.75rem 0 0;font-family:var(--mono);font-size:.17em;font-style:normal;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:#A855F7}
@media(max-width:600px){
  #v-home .hero-content{padding-left:var(--gutter);padding-right:var(--gutter)}
  #v-home .hero-content .hero-welcome-title{font-size:clamp(3.15rem,15vw,5.3rem)}
  #v-home .hero-welcome-title .hero-society{font-size:.88em}
}

/* The original Search control stretches left and becomes the only type field. */
.tb-nav{align-items:center}
.tb-search-shell{position:relative;flex:0 0 auto;width:8.8rem;height:3.1rem;margin-left:.5rem;border-radius:99px;background:transparent;transition:width .4s var(--ease-key),background-color .22s ease}
.tb-search-shell.open{width:clamp(20rem,36vw,34rem);background:#FFFFFF}
.tb-search-shell.closing{transition:width .4s var(--ease-key) .12s,background-color .22s ease .12s}
#topbar .tb-search-shell .tb-search{position:absolute;inset:0;width:100%;height:100%;margin:0;justify-content:center;white-space:nowrap;background:transparent;color:inherit;border:1px solid currentColor;transition:opacity .18s ease,color .2s ease,background .2s ease,border-color .2s ease}
#topbar .tb-search-shell .tb-search:hover{background:#191919;color:#FFFFFF;border-color:#191919}
#topbar.bar-home-hero .tb-search-shell .tb-search{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.65)}
#topbar.bar-light-origin .tb-search-shell .tb-search{background:transparent;color:#191919;border-color:rgba(25,25,25,.5)}
#topbar.bar-solid .tb-search-shell .tb-search{background:#FFFFFF;color:var(--violet);border-color:#FFFFFF}
.tb-search-shell.open .tb-search{opacity:0;pointer-events:none}
.tb-search-shell.closing .tb-search{opacity:1;pointer-events:none;transition-delay:.08s,0s,0s,0s}
.tb-search-field{position:absolute;inset:0;display:flex;align-items:center;gap:.65rem;padding:0 .75rem 0 1rem;opacity:0;visibility:hidden;pointer-events:none;color:#191919;transition:opacity .2s ease .16s,visibility 0s linear .36s}
.tb-search-shell.open .tb-search-field{opacity:1;visibility:visible;pointer-events:auto;transition-delay:.12s,0s}
.tb-search-shell.closing .tb-search-field{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .1s ease,visibility 0s linear .1s}
.tb-search-field .sm-ic{flex:0 0 1.15rem;color:var(--violet)}
.tb-search-field #searchInput{flex:1;min-width:0;width:auto;font-weight:300}
.tb-search-field .sm-close{flex:none;background:#FFFFFF}
.tb-search-shell .search-modal{position:absolute;inset:auto 0 auto auto;top:calc(100% + .65rem);z-index:8;display:block;width:100%;padding:0;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-.55rem);transition:opacity .2s ease,transform .28s var(--ease-key),visibility 0s linear .28s}
.tb-search-shell.open .search-modal{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.tb-search-shell .sm-panel{width:100%;max-width:none;border:1px solid var(--line);border-radius:10px;background:#FFFFFF;color:#191919;box-shadow:0 18px 45px rgba(25,25,25,.2);animation:none}
.tb-search-shell .sm-results{max-height:min(52vh,24rem)}
.tb-search-shell .sm-r-label{font-weight:400}
.tb-search-shell .sm-r-sub{font-weight:400;letter-spacing:.1em}
.tb-search-shell .sm-result mark{background:var(--violet);color:#FFFFFF;padding:.02em .12em;border-radius:2px;font-weight:inherit}
#topbar.search-open,#topbar.search-open .tb-nav{overflow:visible}
@media(max-width:760px){
  .tb-search-shell{width:3rem;margin-left:0}
  .tb-search-shell.open{width:min(78vw,26rem)}
  .tb-search-shell .search-modal{width:100%}
}

/* Large landscape photo covers and a wider, uncropped gallery detail stage. */
.gallery-items:not(.as-list){grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2rem)}
.gallery-items:not(.as-list) .frame{aspect-ratio:4/3}
.gm-facts{display:grid;gap:.45rem;margin:.25rem 0}
.gm-facts div{display:grid;grid-template-columns:4.5rem 1fr;gap:.8rem;padding-bottom:.45rem;border-bottom:1px dotted var(--line)}
.gm-facts dt{font-family:var(--mono);font-size:.54rem;letter-spacing:.15em;text-transform:uppercase;color:var(--stone)}
.gm-facts dd{font-size:.9rem;line-height:1.35}
.gm-links{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:.25rem}
.gm-links .btn{margin-top:0}
#galModal .gm-panel{width:min(1120px,94vw);max-width:1120px;grid-template-columns:minmax(0,1.45fr) minmax(18rem,.55fr);align-items:center;background:transparent}
#galModal .gm-media{width:100%;min-height:0;aspect-ratio:4/3;background:transparent}
#galModal .gm-carousel{height:100%}
#galModal .gm-media img{width:100%;height:100%;object-fit:cover;object-position:center}
#galModal .gm-body{align-self:stretch;justify-content:center;background:#FFFFFF}
@media(max-width:720px){
  .gallery-items:not(.as-list){grid-template-columns:1fr}
  #galModal .gm-panel{grid-template-columns:1fr;align-items:stretch}
  #galModal .gm-media{aspect-ratio:4/3;max-height:none}
}

/* Ordered Home-hero entrance after the opening overlay finishes. */
#v-home .hero-content > .eyebrow,
#v-home .hero-welcome-title > span{opacity:0}
#v-home .hero-welcome-title .hero-welcome{position:relative;font-family:var(--serif);font-style:italic;font-weight:500;letter-spacing:-.04em;transform-origin:center}
#v-home .hero-welcome-title .hero-welcome::after{display:none}
body.hero-sequence #v-home .hero-welcome-title .hero-welcome,
body.hero-sequence #v-home .hero-welcome-title .hero-society{opacity:1}
body.hero-sequence #v-home .hero-welcome-title .hero-welcome .hero-letter:not(.space){animation:pianoLetterIn .36s var(--ease-key) calc(.04s + var(--letter-i)*.045s) both}
body.hero-sequence #v-home .hero-content > .eyebrow,
body.hero-sequence #v-home .hero-welcome-title .hero-bridge{animation:heroSoftIn .4s ease .54s both}
body.hero-sequence #v-home .hero-welcome-title .hero-society .hero-letter:not(.space){animation:pianoLetterIn .36s var(--ease-key) calc(.78s + var(--letter-i)*.036s) both}
body.hero-sequence #v-home .hero-welcome-title .hero-at-nyu{animation:heroSoftIn .42s ease 1.42s both}
.hero-letter{display:inline-block;opacity:0;transform-origin:center bottom;will-change:transform,opacity}
.hero-letter.space{width:.24em;opacity:1;transform:none;animation:none!important}
@keyframes pianoLetterIn{0%{opacity:0;transform:translateY(-.62em) scaleY(.58) rotateX(-72deg)}58%{opacity:1;transform:translateY(.08em) scaleY(.92) rotateX(8deg)}100%{opacity:1;transform:none}}
@keyframes heroSoftIn{from{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}
#v-home .hero-welcome-title .hero-bridge{ text-transform:none }
#v-home .hero-welcome-title .hero-at-nyu{ text-transform:none }
#v-home .hero-welcome-title .hero-at-nyu a{color:inherit;text-decoration:none;border:0;padding:0}
#v-home .hero-welcome-title .hero-at-nyu a{display:inline-block;transition:color .2s ease,text-decoration-color .2s ease;text-decoration-line:none;text-decoration-thickness:.06em;text-underline-offset:.16em}
#v-home .hero-welcome-title .hero-at-nyu a:hover,
#v-home .hero-welcome-title .hero-at-nyu a:focus-visible{color:#FFFFFF;text-decoration-line:underline;text-decoration-color:currentColor}
#v-home .hero-content{padding-top:clamp(7rem,14vh,10rem);padding-bottom:clamp(7rem,14vh,10rem)}
#v-home .hero-content .hero-welcome-title{max-width:16ch}
/* A genuinely short centered scroll indicator under Past Highlights. */
#v-home .hl-track{scrollbar-width:none;scroll-snap-type:none}
#v-home .hl-track::-webkit-scrollbar{display:none}
.hl-scrollbar{position:relative;width:100%;height:18px;margin:.65rem 0 0;border-radius:99px;background:var(--line);cursor:pointer;touch-action:none;outline-offset:5px}
.hl-scrollbar:hover,.hl-scrollbar:focus-visible{outline:none}
.hl-scrollbar span{position:absolute;left:0;top:0;height:18px;min-width:18px;border-radius:99px;background:var(--violet);transform:translate3d(var(--thumb-x,0),0,0);transition:background-color .18s ease;will-change:transform}
.hl-scrollbar:hover span,.hl-scrollbar:focus-visible span,.hl-scrollbar.scrubbing span{background:var(--plum)}
.ev-cta.ev-coming-up{align-self:center;color:var(--stone);font-family:var(--mono);font-size:.67rem;font-weight:500;letter-spacing:.08em;line-height:1.35;text-transform:uppercase;white-space:nowrap}
.hl-track{cursor:grab}
.hl-track.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.layout-ico{width:1rem;height:1rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.view-toggle button{display:inline-flex;align-items:center;justify-content:center;gap:.42rem}
body.hero-sequence-done #v-home .hero-content > .eyebrow,
body.hero-sequence-done #v-home .hero-welcome-title .hero-welcome,
body.hero-sequence-done #v-home .hero-welcome-title .hero-welcome .hero-letter,
body.hero-sequence-done #v-home .hero-welcome-title .hero-bridge,
body.hero-sequence-done #v-home .hero-welcome-title .hero-society,
body.hero-sequence-done #v-home .hero-welcome-title .hero-society .hero-letter,
body.hero-sequence-done #v-home .hero-welcome-title .hero-at-nyu{opacity:1;transform:none;animation:none}
.home-programs > .wrap{max-width:none}
.home-programs .discover-grid{max-width:1200px}
.program-highlight{display:inline;padding:.08em .2em;background-color:transparent;background-image:linear-gradient(var(--line),var(--line));background-repeat:no-repeat;background-position:left center;background-size:0% 100%;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.program-card.is-visible .program-highlight{animation:programHighlightSweep 1.28s var(--ease-key) .9s forwards}
@keyframes programHighlightSweep{to{background-size:100% 100%}}
/* One-time About opener: heading, lettered mission, then values 01–03. */
#v-about.about-awaiting .about-bg,
#v-about.about-preparing .about-bg,
#v-about.about-awaiting .about-lead > *,
#v-about.about-preparing .about-lead > *{opacity:0}
#v-about.about-sequence .about-lead > .eyebrow,
#v-about.about-sequence .mission-text .about-letter,
#v-about.about-sequence .values-block .vrow2{opacity:0}
#v-about.about-sequence.rows-inserted .about-lead > .eyebrow{animation:aboutStepIn .42s var(--ease-key) .08s both}
.about-word{display:inline-block;white-space:nowrap}
#v-about.about-sequence.rows-inserted .mission-text .about-letter{display:inline-block;animation:aboutLetterPop .36s var(--ease-key) calc(.3s + var(--about-letter-i)*.014s) both;transform-origin:center bottom}
#v-about.about-sequence.rows-inserted .values-block .vrow2{animation:aboutStepIn .46s var(--ease-key) var(--about-values-delay) both}
#v-about.about-sequence.rows-inserted .values-block .vrow2:nth-child(2){animation-delay:calc(var(--about-values-delay) + .11s)}
#v-about.about-sequence.rows-inserted .values-block .vrow2:nth-child(3){animation-delay:calc(var(--about-values-delay) + .22s)}
@keyframes aboutLetterPop{0%{opacity:0;transform:translateY(.38em) scale(.7)}65%{opacity:1;transform:translateY(-.06em) scale(1.04)}100%{opacity:1;transform:none}}
@keyframes aboutStepIn{from{opacity:0;transform:translateY(1.1rem)}to{opacity:1;transform:none}}
#v-about.about-sequence-done .about-lead > .eyebrow,
#v-about.about-sequence-done .mission-text .about-letter,
#v-about.about-sequence-done .values-block .vrow2{opacity:1;transform:none;animation:none}
/* Dedicated late-page reveals; unlike .rev, these are not completed by the intro. */
.scroll-fade{opacity:0;transform:translateY(34px);transition:opacity .62s var(--ease-key),transform .62s var(--ease-key)}
.scroll-fade:nth-child(even){transition-delay:.1s}
.scroll-fade.is-visible{opacity:1;transform:none}
#v-about .team-row:not(.is-visible){opacity:0!important;transform:translateY(34px)!important;transition:opacity .62s var(--ease-key),transform .62s var(--ease-key)!important}
#v-about .team-row:nth-child(even){transition-delay:.1s}
#v-about .team-row.is-visible{opacity:1!important;transform:none!important;transition:opacity .62s var(--ease-key),transform .62s var(--ease-key)!important}
.da-capo{position:fixed;right:max(.7rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));z-index:75;display:grid;justify-items:center;gap:.08rem;min-width:3.4rem;padding:.65rem .55rem .6rem;border:1px solid #191919;background:#FFFFFF;color:#191919;box-shadow:0 8px 28px rgba(25,25,25,.14);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(.8rem);transition:opacity .28s ease,transform .28s var(--ease-key),visibility 0s linear .28s,color .2s ease,background .2s ease}
.da-capo.show{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.da-capo:hover,.da-capo:focus-visible{background:var(--violet);border-color:var(--violet);color:#FFFFFF}
.da-capo .dc-arrow{font-size:1.45rem;line-height:.8}
.da-capo .dc-mark{font-family:var(--serif);font-size:.72rem;font-style:italic;letter-spacing:.08em}
@media(prefers-reduced-motion:reduce){
  #v-home .hero-content > .eyebrow,
  #v-home .hero-welcome-title > span,
  .hero-letter,.scroll-fade,#v-about .team-row,#v-about .about-letter,#v-about .about-lead > .eyebrow,#v-about .values-block .vrow2{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
  .program-highlight{animation:none!important;background-size:100% 100%!important}
  .da-capo{transition:none}
}

/* Gallery slideshow position — user-controlled so the shared cover stays stable. */
.gm-dot{position:relative;width:2.2rem;height:.32rem;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.4);transition:background .2s}
.gm-dot::after{content:"";position:absolute;inset:0;background:#FFFFFF;transform:scaleX(0);transform-origin:left center}
.gm-dot.on{width:2.2rem;background:rgba(255,255,255,.4)}
.gm-dot.on::after{transform:scaleX(1);transition:transform .42s var(--ease-key)}

/* ============================================================
   INTERACTION SYSTEM — tactile buttons + animated switch gliders
   ============================================================ */
.motion-button{
  isolation:isolate;overflow:hidden;
  transform:translateZ(0);
  transition:transform .28s var(--ease-key),box-shadow .28s ease,
    background-color .24s ease,color .24s ease,border-color .24s ease!important;
}
.motion-button:not(.gm-close):not(.gm-nav):not(.da-capo):not(.tb-search){position:relative}
.motion-button:hover{transform:translateY(-2px)}
.motion-button:active{transform:translateY(1px) scale(.975);transition-duration:.08s!important}
.motion-button:focus-visible{outline:3px solid var(--electric);outline-offset:4px}
.btn.motion-button:hover,.tb-cta.motion-button:hover,.nl-form button.motion-button:hover{
  box-shadow:0 10px 0 rgba(71,16,95,.18),0 18px 34px rgba(53,2,79,.2);
}
.button-ripple{
  position:absolute;z-index:4;width:1rem;height:1rem;border-radius:50%;pointer-events:none;
  left:var(--ripple-x);top:var(--ripple-y);background:rgba(255,255,255,.72);
  transform:translate(-50%,-50%) scale(0);mix-blend-mode:soft-light;
  animation:buttonRipple .62s ease-out forwards;
}
@keyframes buttonRipple{70%{opacity:.42}to{opacity:0;transform:translate(-50%,-50%) scale(var(--ripple-scale,18))}}
.motion-button:hover .arr{animation:arrowNudge .72s var(--ease-key)}
@keyframes arrowNudge{0%,100%{transform:translateX(0)}45%{transform:translateX(.5rem)}68%{transform:translateX(.28rem)}}

.switch-group{position:relative!important;isolation:isolate}
.switch-group.tabs,.switch-group.view-toggle,.switch-group.ev-views{
  background:var(--lilac);border-radius:99px;padding:.22rem;gap:.15rem;
}
.switch-group.chips{gap:.55rem}
.switch-group.chips>button{border:1px solid var(--line-strong)!important}
.switch-group>button{
  position:relative;z-index:2;background:transparent!important;border-radius:99px!important;
  transition:color .28s ease,transform .28s var(--ease-key),border-color .28s ease!important;
}
.switch-group>button:hover{color:var(--violet);transform:translateY(-1px)}
.switch-group>button[aria-selected="true"],
.switch-group>button[aria-pressed="true"]{color:#FFFFFF!important;border-color:transparent!important}
.switch-group>button[aria-selected="true"]:hover,
.switch-group>button[aria-pressed="true"]:hover{color:#FFFFFF}
/* Flat and unornamented: one solid violet, no gradient sweep, no glow, no
   shadow. The movement alone carries the switch. */
.switch-glider{
  position:absolute;z-index:1;left:0;top:0;pointer-events:none;opacity:0;
  width:var(--switch-w,0);height:var(--switch-h,0);
  transform:translate3d(var(--switch-x,0),var(--switch-y,0),0);
  border-radius:99px;background:var(--violet);
  transition:transform .48s var(--ease-key),width .48s var(--ease-key),height .48s var(--ease-key),opacity .2s ease;
  overflow:hidden;
}

.nl-ok a{color:inherit;font-weight:700;text-underline-offset:4px}
.nl-form:focus-within{box-shadow:0 0 0 3px var(--electric)}
.nl-form input[aria-invalid="true"]{box-shadow:inset 4px 0 0 var(--electric)}

@media(prefers-reduced-motion:reduce){
  .motion-button,.motion-button:hover,.motion-button:active,.switch-group>button{transform:none!important}
  .button-ripple{display:none}
  .switch-glider{transition:none!important}
}
@media(max-width:600px){
  #topbar{
    display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;
    gap:.6rem;padding:.55rem .7rem;overflow:hidden;
  }
  #topbar .tb-brand{padding:0;flex:none}
  #topbar .tb-brand span{display:none}
  #topbar .tb-brand .brand-logo{height:2.65rem;width:2.65rem!important;object-fit:contain}
  #topbar .tb-nav{
    width:100%;min-width:0;max-width:none;gap:.18rem;padding:.1rem 0;
    flex-wrap:nowrap;justify-content:flex-start!important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
    scroll-padding-inline:1rem;overscroll-behavior-inline:contain;
  }
  #topbar .tb-nav::-webkit-scrollbar{display:none}
  #topbar .tb-nav a{flex:none;min-height:2.65rem;display:inline-flex;align-items:center;padding:.58rem .72rem;font-size:.62rem}
  #topbar .tb-search-shell{
    position:sticky;right:0;z-index:5;flex:none;padding-left:.28rem;
    background:linear-gradient(90deg,transparent 0,var(--violet) 24%);
  }
  #topbar .tb-search{width:2.65rem;height:2.65rem;padding:0;display:grid;place-items:center}
  #topbar .tb-search span{display:none}
  #navHotzone{display:none}
}

/* ============================================================
   RESPONSIVE DEVICE PASS — stable header, uncropped archive art
   ============================================================ */
/* Keep the navigation on one physical row. On roomy screens Search grows as
   a flex item, so the links glide left; compact screens use a bounded overlay. */
#topbar{flex-wrap:nowrap;min-width:0}
#topbar .tb-brand{flex:0 0 auto;white-space:nowrap}
#topbar .tb-nav{flex:1 1 auto;min-width:0;flex-wrap:nowrap;justify-content:flex-end}
#topbar .tb-nav>a{flex:0 0 auto;white-space:nowrap}
.tb-search-shell.open{width:8.8rem;background:transparent}
.tb-search-shell.open .tb-search-field{
  inset:0 0 auto auto;width:clamp(20rem,36vw,34rem);height:100%;
  border-radius:99px;background:#FFFFFF;box-shadow:0 12px 32px rgba(25,25,25,.16)
}
.tb-search-shell .search-modal{width:clamp(20rem,36vw,34rem)}
@media(min-width:1251px){
  .tb-search-shell{transition:width .52s cubic-bezier(.22,1,.36,1),background-color .22s ease}
  .tb-search-shell.open{width:clamp(18rem,28vw,30rem);background:#FFFFFF}
  .tb-search-shell.open .tb-search-field{inset:0;width:100%;box-shadow:none}
  .tb-search-shell .search-modal{width:100%}
}

/* The archive cover is editorial content, not a decorative crop. The image
   gets its own stage and the title sits below it so every poster remains
   legible at every grid width. */
#galItems.gallery-items:not(.as-list) .frame{
  display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;
  align-items:end;gap:.45rem 1rem;aspect-ratio:auto;padding:0;
  margin:0 0 max(0px,calc(var(--gallery-gap) - 4px));
  overflow:visible;background:transparent;border-radius:0;border-bottom:0;
  color:var(--ink)
}
#galItems.gallery-items:not(.as-list) .frame::after{display:none}
#galItems.gallery-items:not(.as-list) .frame img.ph{
  position:relative;inset:auto;grid-column:1/-1;width:100%;height:auto;aspect-ratio:auto;
  object-fit:contain;object-position:center;background:transparent;border-radius:10px;
  box-shadow:0 1px 0 rgba(25,25,25,.05);transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s ease
}
#galItems.gallery-items:not(.as-list) .frame.cover-poster img.ph{aspect-ratio:4/5;object-fit:cover}
#galItems.gallery-items:not(.as-list) .frame.cover-rect img.ph{aspect-ratio:4/3;object-fit:cover}
#galItems.gallery-items:not(.as-list) .frame .fbig{
  position:static;grid-column:1;min-width:0;padding-top:.62rem;color:var(--ink)!important;
  font-size:clamp(1.12rem,1.7vw,1.42rem);line-height:1.08;text-shadow:none
}
#galItems.gallery-items:not(.as-list) .frame .fc{
  position:static;grid-column:2;align-self:end;color:var(--violet)!important;
  text-shadow:none;white-space:nowrap
}
#galItems .frame:hover{transform:none;z-index:2}
#galItems .frame:hover img.ph{
  transform:translateY(-5px) scale(1.012);
  box-shadow:0 18px 38px rgba(53,2,79,.18),0 3px 10px rgba(25,25,25,.08)
}
#galItems .frame:focus-visible{
  transform:none;z-index:2;outline:none
}
.gallery-items:not(.as-list) .frame:focus-visible img.ph{box-shadow:0 0 0 3px rgba(90,35,132,.28),0 18px 38px rgba(53,2,79,.16)}
.gallery-items:not(.as-list) .frame:hover .fbig{color:var(--violet)!important}
.gal-thumb{object-fit:contain;background:var(--paper)}
.gallery-cover-flight>img{background:transparent}
.gallery-cover-flight.is-cover-flight>.gallery-flight-image{object-fit:contain}
.gallery-cover-flight>.gallery-flight-return{object-fit:cover}

/* A JS-assisted grid keeps DOM/keyboard order chronological while packing
   natural-ratio covers into even visual lanes. Native CSS masonry remains
   experimental, so the 4px row unit is the robust cross-browser fallback. */
#galItems.gallery-items:not(.as-list){
  --gallery-gap:clamp(1.25rem,2.1vw,2rem);
  grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:4px;
  column-gap:var(--gallery-gap);row-gap:4px;align-items:start
}
.gal-grid-break{
  grid-column:1/-1;display:flex;align-items:baseline;gap:.85rem;min-height:3.2rem;
  padding:1.35rem 0 .55rem;border-bottom:1px solid var(--line);color:var(--ink)
}
.gal-grid-break:first-child{padding-top:.35rem}
.gal-grid-break-year{font-family:var(--serif);font-size:clamp(1.55rem,2.6vw,2.15rem);font-weight:600;line-height:1}
.gal-grid-break-sem{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--violet)}
#galModal .gm-media{background:transparent}
#galModal .gm-slide.is-cover{object-fit:contain;background:transparent}
#galModal .gm-slide:not(.is-cover){object-fit:cover}
#galModal .gm-panel{box-shadow:0 28px 80px rgba(25,25,25,.24)}
#galModal .gm-backdrop{background:rgba(25,25,25,.52);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

/* 13–14 inch laptops and compact desktop windows. */
@media(max-width:1250px){
  #topbar{gap:1rem;padding:.7rem var(--gutter)}
  #topbar .tb-brand{gap:.65rem}
  #topbar .tb-brand .brand-logo{height:2.6rem}
  #topbar .tb-brand span{font-size:.61rem;letter-spacing:.13em}
  #topbar .tb-nav{gap:.1rem}
  #topbar .tb-nav a{padding:.62rem .72rem;font-size:.62rem;letter-spacing:.12em}
  .tb-search-shell{width:3rem;height:2.75rem;margin-left:.15rem}
  .tb-search-shell.open{width:clamp(14rem,24vw,20rem);background:#FFFFFF}
  #topbar .tb-search{padding:0;display:grid;place-items:center}
  #topbar .tb-search span{display:none}
  .tb-search-shell.open .tb-search-field{inset:0;width:100%;box-shadow:none}
  .tb-search-shell .search-modal{width:100%}
  #galItems.gallery-items:not(.as-list){--gallery-gap:clamp(1.15rem,2.4vw,1.7rem);grid-template-columns:repeat(2,minmax(0,1fr))}
  #v-gallery>section.block{padding-top:6.4rem!important}
}

/* Tablet landscape and narrow laptop split-screen. */
@media(max-width:950px){
  #topbar{gap:.55rem}
  #topbar .tb-brand span{display:none}
  #topbar .tb-nav a{padding:.58rem .6rem;font-size:.58rem}
  .tb-search-shell.open .tb-search-field,.tb-search-shell .search-modal{width:100%}
  #v-gallery>section.block{padding-top:6.1rem!important}
}

@media(max-width:820px){
  #galModal .gm-panel{
    grid-template-columns:minmax(0,1fr);width:min(42rem,94vw);max-height:calc(100svh - 1.5rem);
    overflow:auto;align-items:stretch
  }
  #galModal .gm-media{aspect-ratio:16/10;min-height:0;max-height:none}
  #galModal .gm-body{min-height:0;overflow:visible}
}

/* Phones: logo + horizontally scrollable route rail remain one header row. */
@media(max-width:760px){
  #topbar{
    display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;
    gap:.55rem;padding:.55rem var(--gutter);overflow:visible
  }
  #topbar .tb-brand .brand-logo{height:2.65rem}
  #topbar .tb-nav{
    width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;
    scrollbar-width:none;overscroll-behavior-inline:contain
  }
  #topbar .tb-nav::-webkit-scrollbar{display:none}
  #topbar.search-open .tb-nav{overflow:visible}
  .tb-search-shell,.tb-search-shell.open{position:sticky;right:0;z-index:5;width:2.65rem;height:2.65rem;padding-left:0;background:transparent}
  .tb-search-shell.open .tb-search-field{
    position:fixed;inset:.55rem var(--gutter) auto auto;width:min(calc(100vw - (2 * var(--gutter))),26rem);height:2.65rem
  }
  .tb-search-shell .search-modal{
    position:fixed;inset:calc(.55rem + 2.65rem + .65rem) var(--gutter) auto auto;width:min(calc(100vw - (2 * var(--gutter))),26rem)
  }
  #v-gallery>section.block{padding-top:5.7rem!important}
  #galItems.gallery-items:not(.as-list){--gallery-gap:1.2rem;grid-template-columns:minmax(0,1fr)}
  #galItems.gallery-items:not(.as-list) .frame{grid-template-columns:minmax(0,1fr)}
  #galItems.gallery-items:not(.as-list) .frame .fc{grid-column:1;white-space:normal}
}

@media(max-width:420px){
  #topbar{padding-left:.65rem;padding-right:.65rem}
  #topbar .tb-nav a{padding:.55rem .62rem}
  #v-gallery>section.block{padding-top:5.5rem!important}
  .gal-bar{align-items:flex-start}
  .view-toggle button{padding:.48rem .7rem}
}

/* Contact & Join: signup first, horizontal channels second, FAQs below fold. */
#v-contact .contact-top-block{
  min-height:calc(100svh - 4rem);display:flex;align-items:center;
  padding-top:clamp(1.25rem,3vw,2.5rem);padding-bottom:clamp(3rem,7vw,5.5rem)
}
#v-contact .contact-top{width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:clamp(2.5rem,6vh,4.5rem)}
#v-contact .contact-signup{width:min(46rem,100%);text-align:center;display:flex;flex-direction:column;align-items:center}
#v-contact .contact-signup h1,
#v-contact .contact-faq-wrap h2{font-family:var(--serif);font-weight:500;font-size:clamp(2.1rem,4.5vw,3.7rem);line-height:1.03;letter-spacing:-.025em}
#v-contact .contact-signup h1 em,
#v-contact .contact-faq-wrap h2 em{font-style:italic;color:var(--violet)}
#v-contact .contact-signup .lead{max-width:42rem;margin-top:1.1rem;color:var(--ink)}
#v-contact .contact-signup .nl-form{width:min(36rem,100%);max-width:none;margin:1.8rem auto 0}
#v-contact .contact-signup .nl-note{max-width:36rem;margin-left:auto;margin-right:auto}
#v-contact .contact-signup .nl-ok{width:min(36rem,100%);text-align:left}
#v-contact .contact-connect{width:100%}
#v-contact .contact-connect>.eyebrow,
#v-contact .contact-faq-wrap>.eyebrow{justify-content:center;margin-bottom:1.2rem}
#v-contact .contact-connect>.eyebrow::after,
#v-contact .contact-faq-wrap>.eyebrow::after{display:none}
#v-contact .contact-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.8rem;border:0}
#v-contact .contact-list a{
  min-width:0;min-height:9rem;padding:1.15rem .75rem;display:flex;flex-direction:column;
  justify-content:center;align-items:center;gap:.45rem;text-align:center;border:1px solid var(--line);border-radius:10px
}
#v-contact .contact-list a:hover{padding:1.15rem .75rem;transform:translateY(-3px)}
#v-contact .contact-list .name{font-size:clamp(1.05rem,1.6vw,1.3rem)}
#v-contact .contact-list .ext{width:auto;margin-left:0!important;font-size:.54rem;letter-spacing:.1em;line-height:1.4}
#v-contact .join-mail{text-align:center;margin-top:1.35rem}
#v-contact .contact-faq-block{background:var(--paper-2);padding-top:clamp(4rem,9vw,7rem);padding-bottom:clamp(4rem,9vw,7rem)}
#v-contact .contact-faq-wrap{width:min(54rem,100%);margin:0 auto}
#v-contact .contact-faq-wrap h2{text-align:center;max-width:18ch;margin:0 auto clamp(2.5rem,5vw,4rem)}
#v-contact .contact-faq-wrap .faq{margin-top:0;background:var(--paper);border-top:1px solid var(--line)}
#v-contact .contact-faq-wrap .faq-head{padding:1.35rem .8rem;font-size:clamp(1.12rem,2vw,1.35rem)}
#v-contact .contact-faq-wrap .faq-body p{padding:0 .8rem 1.35rem;max-width:46rem}
@keyframes contactIntroIn{
  from{opacity:0;transform:translateY(1.15rem)}
  to{opacity:1;transform:none}
}
@keyframes contactChannelIn{
  from{opacity:0;transform:translateY(1rem) scale(.96)}
  to{opacity:1;transform:none}
}
#v-contact.contact-sequence .contact-signup h1{animation:contactIntroIn .48s var(--ease-key) .03s both}
#v-contact.contact-sequence .contact-signup .lead{animation:contactIntroIn .46s var(--ease-key) .13s both}
#v-contact.contact-sequence .contact-signup .newsletter-shell{animation:contactIntroIn .46s var(--ease-key) .23s both}
#v-contact.contact-sequence .contact-connect>.eyebrow{animation:contactIntroIn .42s var(--ease-key) .4s both}
#v-contact.contact-sequence .contact-list a{animation:contactChannelIn .44s var(--ease-key) .49s both}
#v-contact.contact-sequence .contact-list a:nth-child(2){animation-delay:.56s}
#v-contact.contact-sequence .contact-list a:nth-child(3){animation-delay:.63s}
#v-contact.contact-sequence .contact-list a:nth-child(4){animation-delay:.7s}
#v-contact.contact-sequence .contact-list a:nth-child(5){animation-delay:.77s}
#v-contact.contact-sequence .join-mail{animation:contactIntroIn .42s var(--ease-key) .86s both}
#v-contact.contact-sequence-done .contact-signup h1,
#v-contact.contact-sequence-done .contact-signup .lead,
#v-contact.contact-sequence-done .contact-signup .newsletter-shell,
#v-contact.contact-sequence-done .contact-connect>.eyebrow,
#v-contact.contact-sequence-done .contact-list a,
#v-contact.contact-sequence-done .join-mail{opacity:1;transform:none;filter:none;animation:none}
@media(max-width:760px){
  #v-contact .contact-top-block{min-height:calc(100svh - 3.5rem);align-items:flex-start;padding-top:1.5rem}
  #v-contact .contact-list{display:flex;overflow-x:auto;gap:.75rem;padding:.2rem .15rem 1rem;scroll-snap-type:x mandatory;scrollbar-width:thin}
  #v-contact .contact-list a{flex:0 0 min(72vw,17rem);min-height:8.5rem;scroll-snap-align:center;flex-wrap:nowrap}
  #v-contact .contact-list .ext{width:auto;margin-left:0!important}
}

/* Past Highlights: a restrained, interactive 3D event cylinder. */
#v-home .hl-strip{
  position:relative;isolation:isolate;overflow:hidden;width:100%;margin:0;
  padding:clamp(4rem,8vw,7rem) var(--gutter) clamp(4.5rem,9vw,7.5rem);
  background:linear-gradient(180deg,var(--paper-2),var(--paper));
}
#v-home .hl-strip::before,
#v-home .hl-strip::after{
  content:"";position:absolute;z-index:3;top:8rem;bottom:6rem;width:min(17vw,14rem);pointer-events:none
}
#v-home .hl-strip::before{left:0;background:linear-gradient(90deg,var(--paper-2),transparent)}
#v-home .hl-strip::after{right:0;background:linear-gradient(-90deg,var(--paper-2),transparent)}
#v-home .hl-head{
  position:relative;z-index:4;display:grid;
  grid-template-columns:minmax(0,1fr) min(70.5rem,100%) minmax(0,1fr);
  margin:0 0 clamp(2.25rem,4vw,3.6rem);text-align:left
}
#v-home .hl-head .eyebrow{grid-column:2;justify-self:start;width:max-content}
#v-home .hl-head .eyebrow::after{display:none}
#v-home .hl-cylinder{
  --hl-card-w:clamp(17rem,20vw,21rem);--hl-card-h:calc(var(--hl-card-w) * .625);
  --hl-radius:clamp(23rem,38vw,38rem);position:relative;z-index:2;
  height:clamp(22rem,32vw,28rem);perspective:2200px;perspective-origin:50% 48%;
  cursor:grab;touch-action:pan-y;outline:none
}
#v-home .hl-cylinder:active{cursor:grabbing}
#v-home .hl-cylinder:focus-visible{outline:1px solid var(--violet);outline-offset:8px}
#v-home .hl-track{
  position:absolute;left:50%;top:50%;display:block;width:var(--hl-card-w);height:var(--hl-card-h);
  padding:0;overflow:visible;transform-style:preserve-3d;
  transform:translate3d(-50%,-50%,0) rotateY(var(--hl-angle,0deg));
  mask-image:none;-webkit-mask-image:none;will-change:transform;cursor:inherit
}
#v-home .hl-card{
  position:absolute;inset:0;display:block;width:100%;min-width:0;height:100%;aspect-ratio:16/10;
  transform:rotateY(var(--hl-card-angle)) translateZ(var(--hl-radius));
  transform-style:preserve-3d;overflow:visible;border-radius:10px;z-index:var(--hl-z,1);
  box-shadow:0 18px 45px rgba(25,25,25,.16);transition:box-shadow .3s ease
}
#v-home .hl-card:hover,
#v-home .hl-card:focus-visible{box-shadow:0 22px 54px rgba(25,25,25,.28)}
#v-home .hl-card>.ph,
#v-home .hl-backface .ph{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:10px;
  filter:grayscale(var(--hl-grey,0%)) brightness(var(--hl-bright,1))!important;
  transition:filter .28s ease,opacity .28s ease,transform .55s var(--ease-key)
}
#v-home .hl-card>.ph,
#v-home .hl-card>.hl-cap{backface-visibility:hidden;opacity:var(--hl-opacity,1)}
#v-home .hl-backface{
  position:absolute;inset:0;display:block;overflow:hidden;border-radius:10px;
  transform:rotateY(180deg) translateZ(1px);backface-visibility:hidden;
  opacity:var(--hl-opacity,1);visibility:hidden
}
#v-home .hl-card.is-back>.ph,
#v-home .hl-card.is-back>.hl-cap{visibility:hidden}
#v-home .hl-card.is-back>.hl-backface{visibility:visible}
#v-home .hl-backface .hl-cap{opacity:1}
#v-home .hl-cap{
  left:.8rem;right:auto;bottom:.8rem;max-width:calc(100% - 1.6rem);gap:.22rem;
  padding:.5rem .64rem;background:rgba(90,35,132,.94);border-radius:5px;
  box-shadow:0 7px 22px rgba(25,25,25,.2);backdrop-filter:blur(5px)
}
#v-home .hl-cap em{font-family:var(--sans);font-style:normal;font-weight:650;font-size:clamp(.82rem,1vw,.96rem);line-height:1.2}
#v-home .hl-cap small{color:#fff;font-size:.48rem;letter-spacing:.1em}
#v-home .hl-card::after{background:linear-gradient(to top,rgba(25,25,25,.76),transparent 60%)}
#v-home .hl-scrollbar{
  position:relative;z-index:5;width:min(34rem,72vw);height:4px;margin:clamp(2rem,4vw,3.25rem) auto 0;
  border-radius:99px;background:rgba(90,35,132,.16);cursor:pointer;touch-action:none;
  opacity:0;transform:translateY(5px);pointer-events:none;
  transition:opacity .25s ease,transform .25s ease;outline-offset:6px
}
#v-home .hl-scrollbar span{
  top:0;width:22%;min-width:3.5rem;height:4px;background:var(--violet);
  transform:translate3d(var(--thumb-x,0),0,0)
}
#v-home .hl-strip.hl-interacting .hl-scrollbar,
#v-home .hl-scrollbar:focus-visible{opacity:1;transform:none;pointer-events:auto}
#v-home .hl-gallery-cta{
  position:relative;z-index:5;display:flex;width:max-content;max-width:100%;margin:clamp(2.25rem,4vw,3.25rem) auto 0;
  padding:.85rem 1.25rem;border:1px solid var(--violet);background:transparent;color:var(--violet)
}
#v-home .hl-gallery-cta:hover,
#v-home .hl-gallery-cta:focus-visible{background:var(--violet);color:#fff}
@keyframes hlIntroRise{from{opacity:0;transform:translateY(1.5rem)}to{opacity:1;transform:none}}
@keyframes hlStageIntro{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes hlCardIntro{from{opacity:0}to{opacity:1}}
#v-home .hl-strip.hl-enhanced:not(.hl-entered) .hl-head,
#v-home .hl-strip.hl-enhanced:not(.hl-entered) .hl-cylinder,
#v-home .hl-strip.hl-enhanced:not(.hl-entered) .hl-gallery-cta{opacity:0}
#v-home .hl-strip.hl-entering .hl-head{animation:hlIntroRise .48s var(--ease-key) both}
#v-home .hl-strip.hl-entering .hl-cylinder{animation:hlStageIntro .62s var(--ease-key) .1s both}
#v-home .hl-strip.hl-entering .hl-card{animation:hlCardIntro .42s ease var(--hl-intro-delay) both}
#v-home .hl-strip.hl-entering .hl-gallery-cta{animation:hlIntroRise .46s var(--ease-key) .6s both}

/* Contact: one dominant signup, a compact kite-shaped channel row, then a plum FAQ field. */
#v-contact .contact-top{gap:clamp(2rem,4vh,3.1rem)}
#v-contact .contact-signup{width:min(56rem,100%)}
#v-contact .contact-signup .nl-form{width:min(48rem,100%);min-height:4.25rem;margin-top:2rem}
#v-contact .contact-signup .nl-form input{min-height:4.25rem;padding:1rem 1.25rem;font-size:1.05rem}
#v-contact .contact-signup .nl-form button{min-width:10rem;padding:1rem 1.4rem}
#v-contact .contact-connect{width:min(66rem,100%)}
#v-contact .contact-list{grid-template-columns:.82fr 1fr 1.18fr 1fr .82fr;align-items:center;gap:.7rem}
#v-contact .contact-list a{min-height:6.25rem;padding:.75rem .55rem;border-radius:8px}
#v-contact .contact-list a:nth-child(1),
#v-contact .contact-list a:nth-child(5){min-height:5.1rem}
#v-contact .contact-list a:nth-child(2),
#v-contact .contact-list a:nth-child(4){min-height:5.75rem}
#v-contact .contact-list a:nth-child(3){min-height:6.6rem}
#v-contact .contact-list a:hover{padding:.75rem .55rem}
#v-contact .contact-list .ci{width:1.25rem;height:1.25rem}
#v-contact .contact-list .name{font-size:clamp(.96rem,1.35vw,1.14rem)}
#v-contact .contact-list .ext{font-size:.48rem}
#v-contact .join-mail{font-size:.82rem;margin-top:1rem}
#v-contact .contact-faq-block{background:#fff;color:var(--ink)}
#v-contact .contact-faq-wrap{width:min(58rem,100%)}
#v-contact .contact-faq-wrap .contact-common-title{
  color:var(--ink);font-size:clamp(2.5rem,5.5vw,4.5rem);max-width:none;margin:0 auto clamp(2.2rem,5vw,3.5rem)
}
#v-contact .contact-faq-wrap .faq{background:#fff;border-top:1px solid var(--line)}
#v-contact .contact-faq-wrap .faq-item{border-color:var(--line)}
#v-contact .contact-faq-wrap .faq-head{color:var(--ink)}
#v-contact .contact-faq-wrap .faq-head:hover,
#v-contact .contact-faq-wrap .faq-head:focus-visible{background:var(--paper-2)}
#v-contact .contact-faq-wrap .faq-body p{color:var(--stone)}
#v-contact .contact-faq-wrap .pm{color:var(--violet)}

/* About opener: insertion and continuous marquee live on separate elements,
   so they never compete for transform or snap when one animation completes. */
#v-about .about-row-stage{
  width:100%;flex:none;opacity:1;transform:translate3d(0,0,0);
  backface-visibility:hidden
}
#v-about.about-preparing .about-row-stage{opacity:0}
#v-about.about-sequence .about-bg{animation:none}
#v-about.about-sequence .about-row-stage{
  animation-duration:.9s;animation-timing-function:cubic-bezier(.22,1,.36,1);
  animation-delay:var(--about-row-delay,0s);animation-fill-mode:both;
  animation-iteration-count:1
}
#v-about.about-sequence .about-row-stage[data-about-direction="rtl"]{animation-name:aboutRowStageInRTL}
#v-about.about-sequence .about-row-stage[data-about-direction="ltr"]{animation-name:aboutRowStageInLTR}
#v-about.about-preparing .about-row,
#v-about.about-sequence .about-row-stage:not(.is-inserted) .about-row{animation-play-state:paused}
#v-about:not(.active) .about-row{animation-play-state:paused}
@keyframes aboutRowStageInRTL{
  from{opacity:0;transform:translate3d(108vw,0,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes aboutRowStageInLTR{
  from{opacity:0;transform:translate3d(-108vw,0,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
#v-about.about-sequence.rows-inserted .about-lead>.eyebrow{animation-delay:.1s}
#v-about.about-sequence.rows-inserted .mission-text .about-letter{animation-delay:calc(.36s + var(--about-letter-i) * .019s)}

/* Discover More shares the 1920px grid edge and enters once on scroll. */
#v-home .home-programs-head{
  display:grid;grid-template-columns:minmax(0,1fr) min(70.5rem,100%) minmax(0,1fr);
  align-items:end;margin-top:-44px;margin-bottom:clamp(1.8rem,4vw,3rem)
}
#v-home .home-programs-head .eyebrow{grid-column:2;justify-self:start;width:max-content;margin-left:3px}
@keyframes discoverHeadingIn{
  from{opacity:0;transform:translate3d(-2.5rem,0,0);clip-path:inset(0 100% 0 0)}
  to{opacity:1;transform:none;clip-path:inset(0)}
}
#v-home .home-programs-head.scroll-fade{opacity:1;transform:none;transition:none}
#v-home .home-programs-head.scroll-fade .eyebrow{opacity:0}
#v-home .home-programs-head.scroll-fade.is-visible .eyebrow{animation:discoverHeadingIn .78s var(--ease-key) both}

@media(max-width:760px){
  #v-home .hl-strip{padding-left:.75rem;padding-right:.75rem}
  #v-home .hl-strip::before,#v-home .hl-strip::after{width:10vw}
  #v-home .hl-head{grid-template-columns:0 minmax(0,1fr) 0;margin-bottom:2rem}
  #v-home .hl-cylinder{--hl-card-w:clamp(15rem,72vw,19rem);--hl-radius:clamp(15rem,72vw,20rem);height:clamp(20rem,86vw,24rem);perspective:1050px}
  #v-home .hl-cap{left:.6rem;bottom:.6rem;max-width:calc(100% - 1.2rem);padding:.55rem .62rem}
  #v-home .home-programs-head{grid-template-columns:0 minmax(0,1fr) 0}
  #v-contact .contact-list{grid-template-columns:none}
  #v-contact .contact-list a,#v-contact .contact-list a:nth-child(n){min-height:5.8rem}
}

@media(prefers-reduced-motion:reduce){
  #v-home .hl-strip.hl-enhanced .hl-head,#v-home .hl-strip.hl-enhanced .hl-cylinder,#v-home .hl-strip.hl-enhanced .hl-gallery-cta{opacity:1!important;animation:none!important}
  #v-home .hl-cylinder{height:auto;perspective:none;overflow-x:auto;padding:0 0 1rem;cursor:auto;scrollbar-width:thin}
  #v-home .hl-track{position:static;display:flex;gap:1rem;width:max-content;height:auto;transform:none!important;will-change:auto}
  #v-home .hl-card{position:relative;inset:auto;flex:0 0 min(78vw,20rem);height:auto;aspect-ratio:16/10;transform:none!important;animation:none!important}
  #v-home .hl-backface{display:none}
  #v-home .hl-scrollbar{display:none}
  #v-about.about-sequence .about-bg,#v-about.about-sequence .about-row-stage,#v-about.about-sequence .about-row{
    animation:none!important;opacity:1!important;transform:none!important;filter:none!important
  }
  #v-home .home-programs-head.scroll-fade .eyebrow{opacity:1!important;animation:none!important;clip-path:none!important;transform:none!important}
}

/* Search results: readable at a glance, including secondary context. */
.tb-search-shell .sm-r-label{
  font-family:var(--sans);font-size:1rem;font-weight:700;line-height:1.35;letter-spacing:0
}
.tb-search-shell .sm-r-sub{
  font-family:var(--sans);font-size:.76rem;font-weight:500;line-height:1.45;
  letter-spacing:.01em;text-transform:none;color:#68417b
}
.tb-search-shell .sm-result{gap:.25rem;padding:.82rem .9rem}

/* Supplied brand art: a quiet paper hero with violet-only typography. */
#v-home .hero.hero-with-art{background:#FFFFFF}
#v-home .hero-main-art{object-position:center center}
#v-home .hero-art-wash{display:none}
#v-home .hero-content,
#v-home .hero-content .eyebrow,
#v-home .hero-content .hero-welcome-title,
#v-home .hero-welcome-title .hero-welcome,
#v-home .hero-welcome-title .hero-society{color:var(--violet)!important}
#v-home .hero-content .eyebrow::after{background:#7b3fa0}
#v-home .hero-welcome-title .hero-bridge{color:#74418f!important}
/* Kept in step with the winning rule further down this sheet: both words rest
   in white, while only the linked NYU word receives the interactive accent. */
#v-home .hero-welcome-title .hero-at-nyu,
#v-home .hero-welcome-title .hero-at-nyu a{color:#FFFFFF!important}
#v-home .hero-welcome-title .hero-at-nyu a:hover,
#v-home .hero-welcome-title .hero-at-nyu a:focus-visible,
#v-home .hero-welcome-title .hero-at-nyu a:active{color:var(--electric)!important}

/* The live opener and replayable test page share assets/intro-animation.css. */
body:not(.ready) #topbar{opacity:0}
body.ready #topbar{animation:introMenuReveal .9s var(--ease-key) both}
@keyframes introMenuReveal{from{opacity:0;transform:translateY(-1.25rem);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}

/* Covers never paint a card-sized white plate. During the shared transition
   the poster fills the destination while dissolving immediately into photo 1. */
#galItems.gallery-items:not(.as-list) .frame,
#galItems.gallery-items:not(.as-list) .frame::before,
#galItems.gallery-items:not(.as-list) .frame::after,
#galItems.gallery-items:not(.as-list) .frame img.ph,
.gallery-cover-flight,
.gallery-cover-flight>img,
#galModal .gm-media,
#galModal .gm-slide{background-color:transparent!important}
#galItems.gallery-items:not(.as-list) .frame{
  display:block;grid-template-rows:none;gap:0;line-height:0
}
#galItems.gallery-items:not(.as-list) .frame img.ph{display:block}
.gallery-cover-flight.is-cover-flight>.gallery-flight-image{object-fit:fill}
.gallery-cover-flight.is-cover-flight:not(.has-dissolve){background:transparent!important}
.gallery-cover-flight.is-cover-flight:not(.has-dissolve)>.gallery-flight-image{object-fit:contain}
.gallery-cover-flight.has-dissolve>.gallery-flight-image{
  animation:galleryFlightPosterOut .2s cubic-bezier(.4,0,1,1) 0s both
}
.gallery-cover-flight.has-dissolve>.gallery-flight-return{
  animation:galleryFlightReturn .32s cubic-bezier(.22,1,.36,1) .015s both
}
@keyframes galleryFlightPosterOut{
  0%{opacity:1;filter:blur(0)}
  100%{opacity:0;filter:blur(7px)}
}
@keyframes galleryFlightReturn{
  0%{opacity:0;filter:blur(5px)}
  100%{opacity:1;filter:blur(0)}
}
#galModal .gm-slide.is-cover{object-fit:contain;background:#FFFFFF!important}
#galModal.showing-poster .gm-media{background:transparent!important}
#galModal.showing-poster.media-base-ready:not(.shared-closing) .gm-media{background:#FFFFFF!important}

/* Media and details reveal as one surface only after the first visible image
   has decoded. This replaces the earlier second-stage panel refresh. */
#galModal.media-pending .gm-carousel,
#galModal.media-pending:not(.gallery-chrome-ready) .gm-nav,
#galModal.media-pending:not(.gallery-chrome-ready) .gm-dots,
#galModal.shared-transition .gm-carousel,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-nav,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-dots,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-body,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-close{opacity:0!important}
#galModal.media-pending .gm-carousel,
#galModal.media-pending:not(.gallery-chrome-ready) .gm-nav,
#galModal.media-pending:not(.gallery-chrome-ready) .gm-dots,
#galModal.shared-transition .gm-carousel,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-nav,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-dots,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-body,
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-close{transition:none!important;animation:none!important}
#galModal.shared-transition .gm-body{transform:none;clip-path:none}
#galModal.media-base-ready .gm-carousel{opacity:1!important;animation:none!important}
#galModal.gallery-chrome-ready .gm-body{
  animation:gallerySidePanelReveal .48s cubic-bezier(.22,1,.36,1) both!important
}
#galModal.gallery-chrome-ready .gm-nav,
#galModal.gallery-chrome-ready .gm-dots,
#galModal.gallery-chrome-ready .gm-close{
  animation:galleryChromeReveal .36s cubic-bezier(.22,1,.36,1) both!important
}
#galModal.gallery-chrome-ready .gm-dots{animation-delay:.05s!important}
#galModal.gallery-chrome-ready .gm-nav{animation-delay:.08s!important}
#galModal.gallery-chrome-ready .gm-close{animation-delay:.12s!important}
#galModal.gallery-chrome-ready .gm-body>*{
  animation:galleryInfoItem .42s cubic-bezier(.22,1,.36,1) .04s both!important
}
@keyframes galleryUnifiedReveal{
  from{opacity:0}
  to{opacity:1}
}
@keyframes gallerySidePanelReveal{
  from{opacity:0;transform:translateX(-.7rem)}
  to{opacity:1;transform:none}
}
@keyframes galleryChromeReveal{
  from{opacity:0}
  to{opacity:1}
}
#galModal.shared-closing .gm-panel,
#galModal.shared-closing .gm-media,
#galModal.shared-closing .gm-body{background:transparent!important;box-shadow:none!important}
#galModal.shared-closing .gm-carousel,
#galModal.shared-closing .gm-body,
#galModal.shared-closing .gm-nav,
#galModal.shared-closing .gm-dots,
#galModal.shared-closing .gm-close{opacity:0!important;animation:none!important}

/* Generic press motion must preserve the navigation buttons' centering. */
.gm-nav.motion-button,
.gm-nav.motion-button:hover{transform:translateY(-50%)}
.gm-nav.motion-button:active{transform:translateY(-50%) scale(.94)}

/* One visual grammar: interactive controls use the same compact rounded
   rectangle, while tiny carousel position markers remain simple indicators. */
:root{--control-radius:8px;--section-space:clamp(4.5rem,8vw,7rem)}
.btn,.tabs button,.chips button,.view-toggle,.view-toggle button,.ev-views button,
.switch-group,.switch-group>button,.switch-glider,.tb-search,.tb-search-shell,
.tb-search-shell.open .tb-search-field,.icon-btn,#menuBtn,#skipIntro,.scale-play,
.gm-nav,.gm-close,.nl-form,.nl-form button,.da-capo{border-radius:var(--control-radius)!important}
.view:not(#v-home):not(#v-contact)>section.block{padding-top:var(--section-space);padding-bottom:var(--section-space)}
.view:not(#v-home):not(#v-contact)>section.block+section.block{border-top:1px solid var(--line)}
@media(max-width:760px){:root{--section-space:clamp(3.5rem,12vw,5rem)}}

/* Archive covers rest in a quiet grey state and return to full colour when the
   visitor actively engages them. */
#galItems.gallery-items:not(.as-list) .frame img.ph,.gal-row .gal-thumb{filter:grayscale(1) saturate(.35)!important;opacity:.82;transition:filter .45s ease,opacity .45s ease,transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s ease}
#galItems.gallery-items:not(.as-list) .frame:hover img.ph,
#galItems.gallery-items:not(.as-list) .frame:focus-visible img.ph,
.gal-row:hover .gal-thumb,.gal-row:focus-visible .gal-thumb{filter:grayscale(0) saturate(1)!important;opacity:1}

/* ============================================================
   FINAL COHESION PASS — stable gallery, key controls, page rhythm
   ============================================================ */

/* The modal surface unfolds around the travelling cover. The same selected
   cover remains in place after handoff; recap media moves only on user input. */
#galModal .gm-panel,
#galModal.shared-opening .gm-panel,
#galModal.shared-transition .gm-panel{
  background:#FFFFFF!important;box-shadow:0 28px 80px rgba(25,25,25,.24)!important;
  transition:none!important;animation:none!important
}
#galModal.shared-opening .gm-backdrop,
#galModal.shared-opening.shared-active .gm-backdrop{opacity:1!important}
#galModal.shared-opening .gm-body,
#galModal.shared-transition.gallery-chrome-ready .gm-body{background:#FFFFFF!important}
.gallery-cover-flight{transform-origin:0 0;will-change:transform,border-radius,box-shadow;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.gallery-cover-flight>img{backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(0)}
.gallery-cover-flight.is-handing-off{opacity:0;filter:blur(2px);transition:opacity .22s ease,filter .22s ease}
#galModal.shared-opening .gm-panel{animation:galleryPanelUnfold .64s cubic-bezier(.22,1,.36,1) both!important}
#galModal.shared-opening .gm-backdrop{animation:galleryBackdropIn .44s ease both}
@keyframes galleryPanelUnfold{
  from{clip-path:inset(0 35% 0 0 round 12px);opacity:.82}
  to{clip-path:inset(0 round 12px);opacity:1}
}
@keyframes galleryBackdropIn{from{opacity:0}to{opacity:1}}
@media(max-width:820px){
  @keyframes galleryPanelUnfold{
    from{clip-path:inset(0 0 42% 0 round 12px);opacity:.82}
    to{clip-path:inset(0 round 12px);opacity:1}
  }
}

/* Restore the full blue-sky Washington Square photograph. A restrained navy
   wash preserves the photograph while keeping every hero label legible. */
#v-home .hero.hero-with-art{min-height:clamp(42rem,100svh,62rem);background:#0D3559}
#v-home .hero-main-art{object-position:center center;opacity:1;filter:none!important}
body:not(.ready) #v-home .hero-main-art{opacity:0;transform:scale(1.018)}
body.ready #v-home .hero-main-art{animation:heroArtReady .42s cubic-bezier(.22,1,.36,1) both}
@keyframes heroArtReady{from{opacity:0;transform:scale(1.018)}to{opacity:1;transform:none}}
#v-home .hero-art-wash{
  display:block;position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(4,28,53,.68) 0%,rgba(4,28,53,.38) 42%,rgba(4,28,53,.08) 76%),linear-gradient(0deg,rgba(4,28,53,.28),transparent 48%)
}
#v-home .hero-content{
  width:min(88rem,100%);margin:0 auto;padding:clamp(8rem,16vh,11rem) var(--gutter) clamp(4rem,10vh,7rem);
  align-items:flex-start;justify-content:center;text-align:left
}
#v-home .hero-content>.eyebrow{justify-content:flex-start;margin:0 0 1.5rem;color:#FFFFFF!important}
#v-home .hero-content .hero-welcome-title{align-items:flex-start;max-width:10.5ch;margin:0;line-height:.78}
#v-home .hero-welcome-title .hero-welcome{color:#FFFFFF!important;font-size:.68em}
#v-home .hero-welcome-title .hero-bridge{margin:.8rem 0 .65rem .15rem;color:#FFFFFF!important}
#v-home .hero-welcome-title .hero-society{color:#FFFFFF!important;background:transparent;font-size:.94em;white-space:normal;padding:0}
#v-home .hero-welcome-title .hero-at-nyu,#v-home .hero-welcome-title .hero-at-nyu a{margin:1rem 0 0 .2rem;color:#FFFFFF!important}
#topbar.bar-home-hero{background:transparent;color:var(--violet);border-bottom-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
#topbar.bar-home-hero .tb-brand span,#topbar.bar-home-hero .tb-brand:hover span,#topbar.bar-home-hero .tb-nav a{color:#FFFFFF}
#topbar.bar-home-hero .brand-logo{filter:brightness(0) invert(1)}
#topbar.bar-home-hero .tb-nav a:hover{color:#FFFFFF;background:rgba(255,255,255,.14)}
#topbar.bar-home-hero .tb-nav a.current,#topbar.bar-home-hero .tb-nav a.current:hover{color:#FFFFFF;background:rgba(255,255,255,.18)}
#topbar.bar-home-hero .tb-search-shell .tb-search{color:#FFFFFF;background:rgba(7,35,61,.2);border-color:rgba(255,255,255,.72)}
@media(max-width:760px){
  #v-home .hero.hero-with-art{min-height:90svh}
  #v-home .hero-main-art{object-position:58% center;opacity:1}
  #v-home .hero-art-wash{background:linear-gradient(180deg,rgba(4,28,53,.58),rgba(4,28,53,.18) 58%,rgba(4,28,53,.46))}
  #v-home .hero-content{align-items:center;text-align:center;padding-top:8rem}
  #v-home .hero-content>.eyebrow{justify-content:center}
  #v-home .hero-content .hero-welcome-title{align-items:center;max-width:11ch}
}

/* All three home section titles share the exact same editorial column. */
.home-featured>.wrap,.home-programs>.wrap{max-width:70.5rem}
#v-home .hl-head,#v-home .hl-cylinder,#v-home .hl-scrollbar,#v-home .hl-gallery-cta{width:min(70.5rem,100%);margin-left:auto;margin-right:auto}
#v-home .hl-head,#v-home .home-programs-head{display:block;grid-template-columns:none}
#v-home .hl-head .eyebrow,#v-home .home-programs-head .eyebrow{margin-left:0;justify-self:auto}
#v-home .hl-strip{padding-bottom:clamp(3.5rem,6vw,5rem)}
#v-home .hl-gallery-cta{display:flex;width:max-content;margin:clamp(1.3rem,2.4vw,1.8rem) auto 0;padding:.95rem 1.5rem;font-size:.66rem;min-height:auto}
#v-home .hl-card,#v-home .hl-card img{-webkit-user-drag:none;user-select:none}
#v-home .home-programs{padding-top:clamp(3.75rem,6vw,5.5rem)}
#v-home .home-programs-head{margin-bottom:clamp(2.5rem,5vw,4rem)}

/* Contact-to-FAQ pacing: no artificial full-screen void before questions. */
#v-contact .contact-top-block{min-height:auto;padding-top:clamp(4rem,8vw,6.5rem);padding-bottom:clamp(4rem,7vw,6rem)}
#v-contact .contact-top{gap:clamp(3rem,6vw,5rem)}
#v-contact .contact-faq-block{padding-top:clamp(2.75rem,4.5vw,3.75rem);padding-bottom:clamp(4rem,7vw,6rem)}
#v-contact .contact-faq-wrap .contact-common-title{margin-bottom:clamp(1.8rem,3.5vw,2.8rem)}
#v-contact .contact-faq-wrap .faq-head{padding:1.15rem .9rem}

/* Piano-key control language: nearly square corners, crisp outline and a
   shallow lower lip that responds like a key when pressed. */
:root{--control-radius:3px;--key-shadow:inset 0 -3px 0 rgba(25,25,25,.18)}
.btn,.tabs button,.chips button,.view-toggle button,.ev-views button,.ev-next-up,
.tb-nav>a,.tb-search,.tb-search-field,.sm-close,.icon-btn,#menuBtn,#skipIntro,
.scale-play,.gm-nav,.gm-close,.nl-form button,.da-capo,.faq-head,.fold-toggle{
  border-radius:var(--control-radius)!important;box-shadow:var(--key-shadow)
}
.btn:active,.tabs button:active,.chips button:active,.view-toggle button:active,
.ev-views button:active,.ev-next-up:active,.tb-nav>a:active,.tb-search:active,
.icon-btn:active,.gm-nav:active,.gm-close:active,.nl-form button:active,.faq-head:active{
  transform:translateY(2px)!important;box-shadow:inset 0 -1px 0 rgba(25,25,25,.18)
}
.view-toggle,.ev-views,.switch-group,.switch-glider,.tb-search-shell{border-radius:var(--control-radius)!important}

/* Search becomes part of the measured nav row: its width expansion pushes the
   route keys left, and Escape returns every key to its original position. */
#topbar .tb-nav{gap:clamp(.45rem,1vw,.9rem);justify-content:flex-end;flex-wrap:nowrap}
#topbar .tb-nav>a{display:inline-flex;justify-content:center;align-items:center;min-height:3.1rem;padding-inline:clamp(.75rem,1.1vw,1.15rem)}
#topbar .tb-search-shell{width:8.8rem!important;flex:0 0 8.8rem;overflow:visible;transition:width .38s cubic-bezier(.22,1,.36,1),flex-basis .38s cubic-bezier(.22,1,.36,1),background-color .18s ease}
#topbar .tb-search-shell.open{width:clamp(17rem,24vw,22rem)!important;flex-basis:clamp(17rem,24vw,22rem);background:#FFFFFF}
#topbar .tb-search-shell.closing{transition:width .34s cubic-bezier(.22,1,.36,1),flex-basis .34s cubic-bezier(.22,1,.36,1),background-color .18s ease .12s}
#topbar .tb-search-shell .tb-search{inset:0 0 auto auto;width:8.8rem!important}
#topbar .tb-search-field{
  inset:0;width:100%;transform:none;clip-path:none;opacity:0;visibility:hidden;box-shadow:0 12px 32px rgba(25,25,25,.16);
  transition:opacity .18s ease .16s,visibility 0s linear .34s
}
#topbar .tb-search-shell.open .tb-search-field{inset:0;width:100%;transform:none;clip-path:none;opacity:1;visibility:visible;transition-delay:.14s,0s;pointer-events:auto}
#topbar .tb-search-shell.closing .tb-search-field{transform:none;clip-path:none;opacity:0;visibility:hidden;transition:opacity .12s ease,visibility 0s linear .12s}
#topbar .tb-search-shell .search-modal{width:100%}
@media(max-width:760px){
  #topbar .tb-nav{gap:.35rem}
  #topbar .tb-nav>a{min-height:2.65rem;padding-inline:.65rem}
  #topbar .tb-search-shell,#topbar .tb-search-shell.open{width:2.65rem!important;flex-basis:2.65rem}
  #topbar .tb-search-shell .tb-search{width:2.65rem!important}
  #topbar .tb-search-field,#topbar .tb-search-shell.open .tb-search-field{position:fixed;inset:.55rem var(--gutter) auto auto;width:min(calc(100vw - (2 * var(--gutter))),26rem)}
  #topbar .tb-search-shell .search-modal{position:fixed;inset:4rem var(--gutter) auto auto;width:min(calc(100vw - (2 * var(--gutter))),26rem)}
}

/* Familiar event-calendar pattern: compact filter deck, exclusive Schedule /
   Month views, a single readable month, and obvious interactive dates. */
#v-events .ev-filters{position:relative;padding:1.1rem 1.2rem;margin-bottom:clamp(2rem,4vw,3rem);background:#FFFFFF;border:1px solid var(--line);border-left:5px solid var(--violet);gap:1rem}
#v-events .filter-row{gap:.7rem 1rem}
#v-events .ev-next-up{border:1px solid var(--violet);background:#FFFFFF;color:var(--violet);padding:.52rem .9rem;font:700 .58rem var(--mono);letter-spacing:.14em;text-transform:uppercase}
#v-events .ev-next-up:hover{background:var(--violet);color:#FFFFFF}
#v-events .ev-count{padding:.4rem 0;color:#68417B}
#v-events .ev-card{background:#FFFFFF;border:1px solid var(--line);border-left:4px solid transparent;margin-bottom:.8rem;padding:1.3rem 1.4rem;min-height:8rem;transition:transform .25s var(--ease-key),border-color .2s ease,box-shadow .25s ease,background .2s ease}
#v-events .ev-card:hover,#v-events .ev-card:focus-within{background:#FFFFFF;border-left-color:var(--violet);transform:translateX(4px);box-shadow:0 10px 28px rgba(87,6,140,.1);padding-left:1.4rem;padding-right:1.4rem}
#v-events .ev-main h4{font-size:clamp(1.45rem,2.5vw,1.9rem)}
#v-events .ev-main p{font-size:1rem;line-height:1.55}
#v-events .ev-date .ev-day{font-size:2.55rem}
#v-events .ev-year{margin:2rem 0 .8rem}
#v-events .ev-cal{display:block;max-width:78rem;margin:0 auto clamp(3rem,6vw,5rem)}
#v-events .cal-toolbar{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.55rem;margin-bottom:.8rem}
#v-events .cal-toolbar-title{font-family:var(--serif);font-size:clamp(1.9rem,3.5vw,2.7rem);font-weight:600;text-align:center}
#v-events .cal-nav,#v-events .cal-jump{min-height:2.7rem;border:1px solid var(--line-strong);background:#FFFFFF;color:var(--violet);padding:.55rem .85rem;border-radius:var(--control-radius);box-shadow:var(--key-shadow);font:700 .58rem var(--mono);letter-spacing:.12em;text-transform:uppercase}
#v-events .cal-nav:hover,#v-events .cal-jump:hover{background:var(--violet);color:#FFFFFF}
#v-events .cal-month{border:1px solid var(--line);padding:clamp(1.25rem,3vw,2.2rem);box-shadow:0 14px 36px rgba(87,6,140,.08)}
#v-events .cal-month>h4{display:none}
#v-events .cal-grid{gap:8px}
#v-events .cal-dow{padding:.7rem 0;color:#68417B;font-size:.68rem;font-weight:700}
#v-events .cal-day{aspect-ratio:auto;min-height:7.2rem;border:1px solid transparent;font-size:.78rem;padding:.75rem;align-items:flex-start;justify-content:flex-start}
#v-events button.cal-day{width:100%;border-color:var(--line);border-left:4px solid var(--violet);background:#FFFFFF;color:var(--ink);box-shadow:var(--key-shadow);cursor:pointer}
#v-events button.cal-day.wk{border-left-color:var(--accent);background:#FFFFFF}
#v-events button.cal-day:hover,#v-events button.cal-day:focus-visible{background:var(--lilac);color:var(--violet);transform:translateY(-2px)}
#v-events button.cal-day .cal-ico{color:var(--violet);right:.4rem;bottom:.4rem;width:12px;height:12px}
#v-events .cal-day-num{font:700 .66rem var(--mono);color:#68417B;letter-spacing:.05em}
#v-events .cal-event-title{display:-webkit-box;overflow:hidden;margin-top:auto;padding:1rem 1rem 0 0;font-family:var(--sans);font-size:clamp(.72rem,1vw,.92rem);font-weight:750;line-height:1.22;text-align:left;-webkit-box-orient:vertical;-webkit-line-clamp:3}
#v-events .cal-day.is-today:not(.has){border-color:var(--accent);color:var(--violet);font-weight:700}
@media(max-width:600px){
  #v-events .ev-filters{padding:.9rem;border-left-width:3px}
  #v-events .cal-toolbar{grid-template-columns:auto 1fr auto}
  #v-events .cal-jump{grid-column:1/-1;grid-row:2}
  #v-events .cal-grid{gap:2px}
  #v-events .cal-month{padding:.8rem}
  #v-events .cal-day{min-height:4.8rem;padding:.4rem}
  #v-events .cal-event-title{font-size:.5rem;padding-top:.65rem;padding-right:.15rem;-webkit-line-clamp:3}
  #v-events button.cal-day .cal-ico{display:none}
  #v-events .ev-card{padding:.9rem .75rem}
}

/* A continuous, grey photographic reverse replaces the old black face swap. */
#v-home .hl-card{background:#D8D3DA}
#v-home .hl-card>.ph,#v-home .hl-card>.hl-cap,#v-home .hl-backface{visibility:visible!important}
#v-home .hl-backface{background:#D8D3DA;opacity:var(--hl-opacity,1);transition:opacity .45s ease,background-color .45s ease}
#v-home .hl-backface .ph{filter:grayscale(100%) brightness(.72)!important;opacity:.9;transition:filter .5s ease,opacity .5s ease}

/* Equal contact modules and a two-column editorial FAQ grid. */
#v-contact .contact-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:clamp(.75rem,1.4vw,1.15rem)}
#v-contact .contact-list a,#v-contact .contact-list a:nth-child(n){min-height:8rem;padding:1rem .75rem;border-radius:var(--control-radius);align-content:center}
#v-contact .contact-list a:hover{padding:1rem .75rem}
#v-contact .contact-faq-wrap{width:min(70.5rem,100%)}
#v-contact .contact-faq-wrap .contact-common-title{text-transform:none}
#v-contact .contact-faq-wrap .faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.85rem,1.5vw,1.2rem);border:0;background:transparent}
#v-contact .contact-faq-wrap .faq-item{align-self:start;overflow:hidden;border:1px solid var(--line);background:#FFFFFF;transition:border-color .25s ease,background-color .25s ease}
#v-contact .contact-faq-wrap .faq-item.open{border-color:rgba(87,6,140,.5);background:#FFFFFF}
#v-contact .contact-faq-wrap .faq-head{min-height:6.2rem;padding:1.15rem 1.25rem;border:0;background:transparent;font:650 clamp(1rem,1.5vw,1.24rem)/1.3 var(--sans);text-align:left;box-shadow:none!important;border-radius:0!important}
#v-contact .contact-faq-wrap .faq-head:hover,#v-contact .contact-faq-wrap .faq-head:focus-visible{background:rgba(220,189,255,.24);transform:none!important}
#v-contact .contact-faq-wrap .faq-body p{padding:0 1.25rem 1.4rem;color:#513B5C;font-size:clamp(1.02rem,1.3vw,1.14rem);line-height:1.65}
@media(max-width:760px){
  #v-contact .contact-list{display:grid;grid-template-columns:1fr;overflow:visible;padding:0;gap:.75rem}
  #v-contact .contact-list a,#v-contact .contact-list a:nth-child(n){min-height:6.5rem;width:100%}
  #v-contact .contact-faq-wrap .faq{grid-template-columns:1fr}
  #v-contact .contact-faq-wrap .faq-head{min-height:5rem}
}

/* Events use the familiar calendar workspace: a compact control rail on the
   left and one readable Days or Month surface on the right. */
#v-events>.block>.wrap{max-width:92rem}
#v-events .ev-workspace{display:grid;grid-template-columns:minmax(13.5rem,16rem) minmax(0,1fr);gap:clamp(1.5rem,3vw,3rem);align-items:start}
#v-events .ev-sidebar{position:sticky;top:6.5rem;z-index:4;min-width:0}
#v-events .ev-filters{margin:0;padding:1.2rem;background:#FFFFFF;border:1px solid var(--line);border-top:5px solid var(--violet);border-left-width:1px;gap:1.35rem;box-shadow:0 12px 30px rgba(87,6,140,.06)}
#v-events .filter-row{display:block}
#v-events .filter-label{display:block;min-width:0;margin:0 0 .55rem;font-size:.55rem;color:#68417B}
#v-events .filter-row>.filter-label[style]{margin:1.2rem 0 .55rem!important}
#v-events .filter-row .chips{display:grid;grid-template-columns:1fr;gap:.42rem;width:100%}
#v-events .filter-row .chips button{justify-content:flex-start;width:100%;min-height:2.65rem;padding:.58rem .8rem;text-align:left}
#v-events .view-toggle,#v-events .ev-views{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:.3rem}
#v-events .view-toggle button,#v-events .ev-views button{justify-content:center;min-width:0;padding:.62rem .42rem}
#v-events .ev-count{display:block;margin:1.2rem 0 0;padding:.65rem .2rem 0;border-top:1px solid var(--line);text-align:left}
#v-events .ev-content{min-width:0;transition:opacity .12s ease,transform .2s var(--ease-key)}
#v-events .ev-workspace.is-switching .ev-content{opacity:.55;transform:translateX(.35rem)}
#v-events #evList:not([hidden]),#v-events #evCal:not([hidden]){view-transition-name:calendar-pane}
::view-transition-old(calendar-pane){animation:calendarPaneOut .14s ease both}
::view-transition-new(calendar-pane){animation:calendarPaneIn .3s cubic-bezier(.22,1,.36,1) both}
@keyframes calendarPaneOut{to{opacity:0;transform:translateX(-1rem)}}
@keyframes calendarPaneIn{from{opacity:0;transform:translateX(1.35rem)}to{opacity:1;transform:none}}
#v-events .ev-cal{max-width:none;margin:0 0 clamp(3rem,6vw,5rem)}
#v-events .cal-toolbar{min-height:4.25rem;margin:0;padding:0 0 1rem}
#v-events .cal-toolbar{grid-template-columns:2.1rem 1fr 2.1rem}
#v-events .cal-nav{width:2.1rem;height:2.1rem;min-height:0;padding:0;border:0;background:transparent;box-shadow:none!important;font-size:.8rem}
#v-events .cal-nav:disabled{opacity:.2}
#v-events .cal-month{padding:0;border:1px solid var(--line);border-radius:0;background:#FFFFFF;overflow:hidden;box-shadow:0 14px 36px rgba(87,6,140,.08)}
#v-events .cal-grid{grid-template-rows:2.2rem repeat(6,minmax(0,1fr));height:clamp(25rem,calc(100svh - 12rem),32rem);gap:0;background:#FFFFFF}
#v-events .cal-dow{border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#FFFFFF;text-align:center}
#v-events .cal-dow:nth-child(7){border-right:0}
#v-events .cal-day{min-height:0;border-radius:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#FFFFFF}
#v-events button.cal-day{border-top:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;box-shadow:none}
#v-events .cal-day:nth-child(7n){border-right:0}
@keyframes evSidebarDock{from{opacity:0;transform:translate3d(1.5rem,-1rem,0)}to{opacity:1;transform:none}}
@keyframes evContentSettle{from{opacity:0;transform:translateX(1.5rem)}to{opacity:1;transform:none}}
#v-events .ev-workspace.in .ev-sidebar{animation:evSidebarDock .58s cubic-bezier(.22,1,.36,1) both}
#v-events .ev-workspace.in .ev-content{animation:evContentSettle .7s cubic-bezier(.22,1,.36,1) .08s both}
@media(max-width:980px){
  #v-events .ev-workspace{grid-template-columns:1fr;gap:1.4rem}
  #v-events .ev-sidebar{position:relative;top:auto}
  #v-events .ev-filters{padding:1rem}
  #v-events .filter-row .chips{display:flex;overflow-x:auto;padding-bottom:.35rem;scroll-snap-type:x proximity}
  #v-events .filter-row .chips button{width:auto;flex:0 0 auto;scroll-snap-align:start}
  #v-events .filter-row:nth-child(2){display:grid;grid-template-columns:auto minmax(12rem,1fr) auto;align-items:center;gap:.6rem}
  #v-events .filter-row>.filter-label[style]{margin:0!important}
  #v-events .ev-count{margin:0;padding:.6rem 0;border:0;text-align:right}
}
@media(max-width:680px){
  #v-events .filter-row:nth-child(2){grid-template-columns:1fr}
  #v-events .filter-row>.filter-label[style]{margin-top:.65rem!important}
  #v-events .ev-count{text-align:left;border-top:1px solid var(--line)}
  #v-events .cal-grid{grid-template-rows:2rem repeat(6,minmax(4.4rem,1fr));height:auto}
  #v-events .cal-day{min-height:4.4rem}
}

/* Match the rounded outline silhouette of “Explore every event” while keeping
   each control's established colour, ripple, glider, and press behaviour. */
.btn,.sec-link,.tabs button,.chips button,.view-toggle,.view-toggle button,
.ev-views,.ev-views button,.switch-group,.switch-group>button,.switch-glider,
.tb-nav>a,.tb-search,.tb-search-shell,.tb-search-field,.sm-close,.icon-btn,
#menuBtn,#skipIntro,.scale-play,.gm-nav,.gm-close,.nl-form,.nl-form button,
.da-capo,.fold-toggle,.cal-nav,.cal-jump{border-radius:99px!important}

/* Flat, modern control treatment: outlines and colour carry hierarchy, not
   simulated depth. Gallery covers remain completely still when pressed. */
button,.btn,.sec-link,.tb-nav>a,.tb-search,.tb-search-field,.nl-form,
.switch-group,.switch-glider,.view-toggle,.ev-views,.gm-panel,.contact-list a{
  box-shadow:none!important
}
.btn.motion-button:hover,.tb-cta.motion-button:hover,.nl-form button.motion-button:hover{box-shadow:none!important}
#galItems .frame,#galItems .frame:hover,#galItems .frame:active{transform:none!important;box-shadow:none!important}
#galItems .frame img.ph,#galItems .frame:hover img.ph,#galItems .frame:active img.ph{transform:none!important;box-shadow:none!important}
#galItems .frame:focus-visible img.ph{outline:2px solid var(--violet);outline-offset:4px;box-shadow:none!important}

/* Gallery: image-first archive, restrained toolbar, and a transparent media
   stage so no white placeholder flashes behind preserved-aspect artwork. */
#v-gallery .gal-bar{padding:0 0 1rem;margin-bottom:clamp(1.5rem,3vw,2.4rem);border-bottom:0}
#v-gallery .gallery-items{--gallery-gap:clamp(1.5rem,3vw,2.75rem)}
#galModal .gm-panel,#galModal.shared-opening .gm-panel,#galModal.shared-transition .gm-panel{background:transparent!important;box-shadow:none!important}
#galModal .gm-body{background:#FFFFFF!important;border-left:1px solid rgba(255,255,255,.2)}
#galModal .gm-media,#galModal.media-pending .gm-media{background:transparent!important}
#galModal .gm-slide.is-cover,#galModal.showing-poster.media-base-ready:not(.shared-closing) .gm-media{background:transparent!important}
.gallery-cover-flight{box-shadow:none!important;transform:none!important;will-change:left,top,width,height,border-radius,opacity}
.gallery-cover-flight.is-cover-flight>.gallery-flight-image{object-fit:contain!important}

/* Contact: a calm editorial surface with explicit form labeling and dividers. */
#v-contact .contact-top-block{background:#FFFFFF}
#v-contact .contact-signup{padding-bottom:clamp(2rem,4vw,3rem);border-bottom:1px solid var(--line)}
#v-contact .nl-form{margin-top:.7rem;border:1px solid var(--line-strong);background:#FFFFFF}
#v-contact .contact-list a{background:transparent;border-color:var(--line);transition:background-color .2s ease,color .2s ease,border-color .2s ease}
#v-contact .contact-list a:hover{transform:none;background:#F4EFF7;border-color:rgba(87,6,140,.35)}
#v-contact .field-label{display:block;margin-top:1.5rem;font:700 .58rem var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#68417B}

/* Small, non-interactive notes celebrate a completed key press. */
.music-note-pop{position:fixed;left:var(--note-x);top:var(--note-y);z-index:210;pointer-events:none;color:var(--violet);font:700 var(--note-size) var(--serif);line-height:1;opacity:0;transform:translate(-50%,-50%);animation:notePop .72s var(--ease-key) both}
@keyframes notePop{0%{opacity:0;transform:translate(-50%,-15%) scale(.55) rotate(var(--note-rot))}24%{opacity:.9}100%{opacity:0;transform:translate(calc(-50% + var(--note-dx)),calc(-100% + var(--note-dy))) scale(1.15) rotate(var(--note-rot))}}
html{scroll-padding-top:clamp(4.5rem,8vw,6.5rem)}
.view section[id],.ev-card[id],.program-card[id]{scroll-margin-top:clamp(5rem,9vw,7rem)}

/* Requested interaction and usability refinements. */
#topbar .tb-search-shell.open,
#topbar .tb-search-shell.open .tb-search-field{border-radius:16px!important}

#galModal{--gallery-info-surface:#FFFFFF}
#galModal .gm-body,
#galModal.shared-opening .gm-body,
#galModal.shared-transition.gallery-chrome-ready .gm-body{
  background:var(--gallery-info-surface)!important
}
#galModal.no-gallery-media .gm-panel{
  grid-template-columns:minmax(0,36rem);max-width:36rem;
  background:var(--gallery-info-surface)!important
}
#galModal.no-gallery-media .gm-media{display:none}
#galModal.no-gallery-media .gm-body{min-height:min(32rem,80vh);border-left:0}

/* AT and NYU are separate typographic units. Both rest in white over the sky;
   the hyperlink alone turns violet and underlines on pointer, keyboard, or tap. */
#v-home .hero-welcome-title .hero-at-nyu{display:inline-flex;align-items:baseline;gap:.48em;color:#FFFFFF!important}
#v-home .hero-welcome-title .hero-at-nyu .hero-at,
#v-home .hero-welcome-title .hero-at-nyu a{color:#FFFFFF!important}
#v-home .hero-welcome-title .hero-at-nyu a:hover,
#v-home .hero-welcome-title .hero-at-nyu a:focus-visible,
#v-home .hero-welcome-title .hero-at-nyu a:active{
  color:var(--electric)!important;text-decoration-line:underline;text-decoration-color:currentColor
}

/* Phone-only compatibility. Desktop and large-screen geometry is untouched. */
@media(max-width:600px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  :where(a,button,input,select,textarea){touch-action:manipulation}
  #topbar{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(4rem,calc(4rem + env(safe-area-inset-right)))}
  #v-home .hero.hero-with-art{min-height:100svh;min-height:100dvh}
  #v-home .hero-content{
    min-height:100svh;min-height:100dvh;
    padding-top:clamp(6.75rem,17svh,8rem);padding-bottom:clamp(2.5rem,7svh,4rem);
    padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))
  }
  #v-home .hero-content .hero-welcome-title{width:100%;max-width:11ch;font-size:clamp(2.8rem,14.5vw,4.75rem)}
  #v-home .hero-welcome-title .hero-at-nyu{gap:.55em;margin-top:.9rem}
  .btn,.sec-link,.tabs button,.chips button,.view-toggle button,.ev-views button{min-height:44px}
  .nl-form input,.tb-search-field{font-size:16px}
  .home-programs .program-visual{min-height:0;aspect-ratio:4/3}
}
@media(max-width:360px){
  #v-home .hero-content .hero-welcome-title{font-size:clamp(2.65rem,14vw,3.2rem)}
  #v-home .hero-welcome-title .hero-bridge{letter-spacing:.2em}
}

#daCapo{border-radius:0!important}
html.gallery-scroll-restore{scroll-behavior:auto!important}

/* Gallery covers never depress or drop when activated. On return, the
   travelling cover and its destination settle into the archive's grey state
   together, so removing the transition layer cannot expose a hard colour cut. */
#galItems .frame,#galItems .frame:hover,#galItems .frame:active,
#galList .gal-row,#galList .gal-row:hover,#galList .gal-row:active{transform:none!important}
#galItems .frame img.ph,#galItems .frame:hover img.ph,#galItems .frame:active img.ph,
#galList .gal-row img,#galList .gal-row:hover img,#galList .gal-row:active img{transform:none!important}
.gallery-cover-flight.is-returning-neutral{
  filter:grayscale(1) saturate(.35);opacity:.82;
  transition:filter .42s ease,opacity .42s ease
}
.gallery-surface-flight{
  position:fixed;z-index:97;display:block;pointer-events:none;overflow:hidden;
  background:var(--gallery-info-surface,#FFFFFF);box-shadow:0 28px 80px rgba(25,25,25,.24);
  will-change:left,top,width,height,border-radius,opacity,box-shadow
}
.gallery-surface-flight.is-handing-off{
  opacity:0;box-shadow:none;transition:opacity .28s ease,box-shadow .28s ease
}
#galItems .frame.gallery-return-neutral img.ph,
#galItems .frame.gallery-return-focus img.ph,
#galList .gal-row.gallery-return-neutral img,
#galList .gal-row.gallery-return-focus img{
  filter:grayscale(1) saturate(.35)!important;opacity:.82!important
}
#galItems.gallery-items:not(.as-list) .frame.gallery-return-neutral:hover img.ph,
#galItems.gallery-items:not(.as-list) .frame.gallery-return-neutral:focus-visible img.ph,
#galItems.gallery-items:not(.as-list) .frame.gallery-return-focus:hover img.ph,
#galItems.gallery-items:not(.as-list) .frame.gallery-return-focus:focus-visible img.ph,
#galList .gal-row.gallery-return-neutral:hover .gal-thumb,
#galList .gal-row.gallery-return-neutral:focus-visible .gal-thumb,
#galList .gal-row.gallery-return-focus:hover .gal-thumb,
#galList .gal-row.gallery-return-focus:focus-visible .gal-thumb{
  filter:grayscale(1) saturate(.35)!important;opacity:.82!important
}

/* Jesper Landberg-style shared cover: a near-full-screen rounded surface
   expands behind the selected cover, with editorial copy on the left and the
   unchanged cover/media on the right. */
#galModal{padding:1rem clamp(1rem,3.35vw,3.15rem)}
#galModal .gm-panel,
#galModal.shared-opening .gm-panel,
#galModal.shared-transition .gm-panel{
  width:100%;height:100%;max-width:none;max-height:none;align-items:stretch;
  grid-template-columns:minmax(22rem,.82fr) minmax(0,1.18fr);
  gap:0;
  border-radius:18px!important;background:var(--gallery-info-surface)!important;
  overflow:hidden;box-shadow:0 28px 80px rgba(25,25,25,.24)!important;
  animation:none!important;transition:none!important
}
#galModal .gm-body{
  grid-column:1;grid-row:1;align-self:stretch;justify-content:center;
  border:0!important;
  overscroll-behavior:contain
}
#galModal .gm-media{
  grid-column:2;grid-row:1;width:100%;height:100%;min-height:0;max-height:none;
  aspect-ratio:auto;background:transparent!important;border:0!important;margin:0
}
#galModal .gm-close{left:auto!important;right:1rem;top:1rem}
#galModal .gm-nav.motion-button,
#galModal .gm-nav.motion-button:hover{transform:none}
#galModal .gm-nav.motion-button:active{transform:scale(.94)}
#galModal .gm-nav{display:none!important}
#galModal .gm-dot,
#galModal .gm-dot.on{
  width:.32rem!important;height:1.5rem!important;border-radius:99px;
  background:rgba(255,255,255,.4)
}
#galModal .gm-dot::after{
  background:#FFFFFF;transform:scaleY(0)!important;transform-origin:center top!important
}
#galModal .gm-dot.on::after{
  transform:scaleY(1)!important;transition:transform .42s var(--ease-key)
}
#galModal.showing-poster .gm-dot,
#galModal.showing-poster .gm-dot.on{background:rgba(87,6,140,.22)}
#galModal.showing-poster .gm-dot::after{background:var(--violet)}

/* Keep the position rail at the media edge. Navigation lives below it so
   neither control competes for the same vertical space. */
#galModal .gm-dots{
  right:1rem;top:50%;bottom:auto;transform:translateY(-50%);
  max-height:calc(100% - 8rem);overflow:hidden
}
#galModal .gm-prev,#galModal .gm-next{top:auto;bottom:1rem;transform:none}
#galModal .gm-prev{right:3.65rem}
#galModal .gm-next{right:.85rem}
#galModal .gm-nav.motion-button,
#galModal .gm-nav.motion-button:hover{transform:none}
#galModal .gm-nav.motion-button:active{transform:scale(.94)}

/* Detail debut: the surface settles first, then content enters in a quiet
   editorial sequence instead of appearing in one frame. */
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-body{
  animation:galleryDetailPanelDebut 1.08s cubic-bezier(.4,0,.2,1) both!important
}
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-body>*{
  animation:galleryDetailItemDebut 1.08s cubic-bezier(.4,0,.2,1) both!important
}
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-body>:nth-child(n){animation-delay:0s!important}
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-nav,
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-dots,
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-close{
  animation:galleryDetailControlDebut 1.08s cubic-bezier(.4,0,.2,1) both!important;
  animation-delay:0s!important
}
#galModal.gallery-chrome-ready:not(.shared-closing) .gm-dots{
  animation-name:galleryDetailDotsDebut!important
}
@keyframes galleryDetailPanelDebut{
  from{opacity:0;transform:translateX(-.65rem)}
  to{opacity:1;transform:none}
}
@keyframes galleryDetailItemDebut{
  from{opacity:0;transform:translateY(.65rem);filter:blur(5px)}
  to{opacity:1;transform:none;filter:none}
}
@keyframes galleryDetailControlDebut{
  from{opacity:0;filter:blur(3px);transform:translateX(.55rem) scale(.94)}
  to{opacity:1;filter:none;transform:none}
}
@keyframes galleryDetailDotsDebut{
  from{opacity:0;filter:blur(3px);transform:translateY(calc(-50% + .55rem)) scale(.94)}
  to{opacity:1;filter:none;transform:translateY(-50%)}
}
/* Explicit transition state keeps the copy hidden until the same frame in
   which the decoded image begins resolving. It is deliberately independent
   from image cache timing, so repeat openings cannot pop the panel in. */
#galModal.gallery-detail-entering:not(.shared-closing) .gm-body{
  opacity:0!important;transform:translateX(-1rem)!important;filter:blur(8px)!important;
  animation:none!important;
  transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .96s cubic-bezier(.16,1,.3,1),filter .88s cubic-bezier(.16,1,.3,1)!important
}
#galModal.gallery-detail-entering:not(.shared-closing) .gm-body>*{
  opacity:0!important;transform:translateY(.7rem)!important;filter:blur(6px)!important;
  animation:none!important;
  transition:opacity .76s cubic-bezier(.16,1,.3,1),transform .84s cubic-bezier(.16,1,.3,1),filter .76s cubic-bezier(.16,1,.3,1)!important;
  transition-delay:.06s!important
}
#galModal.gallery-detail-entering:not(.shared-closing) .gm-body>:nth-child(2){transition-delay:.1s!important}
#galModal.gallery-detail-entering:not(.shared-closing) .gm-body>:nth-child(3){transition-delay:.14s!important}
#galModal.gallery-detail-entering:not(.shared-closing) .gm-body>:nth-child(4){transition-delay:.18s!important}
#galModal.gallery-detail-entering:not(.shared-closing) .gm-body>:nth-child(5){transition-delay:.22s!important}
#galModal.gallery-detail-entering.gallery-detail-visible:not(.shared-closing) .gm-body,
#galModal.gallery-detail-entering.gallery-detail-visible:not(.shared-closing) .gm-body>*{
  opacity:1!important;transform:none!important;filter:none!important
}

/* Keep the complete portrait proportions visible and frame faces a little higher. */
#v-about .tr-photo{width:min(100%,28rem);max-height:none}
#v-about .team-row:nth-child(even) .tr-photo{justify-self:end}
#v-about .tr-photo img{object-position:50% 30%!important}

/* The travelling cover softens while geometry is changing. At handoff the
   blurred flight fades away, exposing the sharp decoded cover in sync with
   the text resolving from blur. */
.gallery-cover-flight.is-opening>.gallery-flight-image{
  animation:galleryOpeningCoverBlur .82s cubic-bezier(.22,1,.36,1) both!important
}
.gallery-cover-flight.is-opening.is-handing-off{
  opacity:1!important;filter:none!important;transition:none!important
}
.gallery-cover-flight.is-opening.is-handing-off>.gallery-flight-image{
  animation:galleryOpeningCoverResolve 1.08s cubic-bezier(.4,0,.2,1) both!important
}
@keyframes galleryOpeningCoverBlur{
  0%{filter:blur(0)}
  22%{filter:blur(2px)}
  72%,100%{filter:blur(5px)}
}
@keyframes galleryOpeningCoverResolve{
  from{filter:blur(5px)}
  to{filter:blur(0)}
}

/* Return flight: preserve the currently viewed image through the first part
   of the journey, blend to the archive cover near landing, then neutralise. */
.gallery-cover-flight.has-dissolve>.gallery-flight-image{
  animation:galleryReturnPrimaryOut .52s .38s cubic-bezier(.4,0,.2,1) both!important
}
.gallery-cover-flight.has-dissolve>.gallery-flight-return{
  animation:galleryReturnCoverIn .56s .34s cubic-bezier(.4,0,.2,1) both!important
}
.gallery-cover-flight.is-returning-neutral{
  transition:filter .52s cubic-bezier(.4,0,.2,1),opacity .52s ease!important
}
@keyframes galleryReturnPrimaryOut{
  from{opacity:1;filter:none}
  to{opacity:0;filter:blur(2px)}
}
@keyframes galleryReturnCoverIn{
  from{opacity:0;filter:blur(2px)}
  to{opacity:1;filter:none}
}
#galModal.shared-transition .gm-panel{pointer-events:none}
#galModal.shared-transition:not(.gallery-chrome-ready) .gm-panel{
  background:transparent!important;box-shadow:none!important
}
#galModal.shared-transition .gm-body{overflow:hidden}
@media(max-width:820px){
  #galModal{padding:.65rem}
  #galModal .gm-panel,#galModal.shared-opening .gm-panel,#galModal.shared-transition .gm-panel{
    grid-template-columns:1fr;grid-template-rows:auto minmax(15rem,1fr);height:calc(100svh - 1.3rem)
  }
  #galModal .gm-body{grid-column:1;grid-row:1;min-height:0;border:0!important;overflow:auto}
  #galModal .gm-media{grid-column:1;grid-row:2;min-height:15rem;aspect-ratio:auto}
  #galModal.gallery-chrome-ready:not(.shared-closing) .gm-body{
    animation-name:galleryDetailPanelDebutMobile!important
  }
  @keyframes galleryDetailPanelDebutMobile{
    from{opacity:0;transform:translateY(-.5rem)}
    to{opacity:1;transform:none}
  }
}

/* Events: a balanced left control rail and a wider, quieter schedule. */
#v-events>section.block{padding-top:clamp(2.5rem,5vw,4.5rem)!important}
#v-events>.block>.wrap{max-width:88rem}
#v-events .ev-workspace{
  display:grid;grid-template-columns:minmax(17.5rem,19.5rem) minmax(0,1fr);
  gap:clamp(2rem,4vw,4.5rem);align-items:start
}
#v-events .ev-sidebar{position:sticky;top:6.75rem;z-index:4;min-width:0}
#v-events .ev-filters{
  display:flex;flex-direction:column;gap:0;margin:0;padding:0;
  overflow:hidden;border:1px solid var(--line);border-top:5px solid var(--violet);
  border-radius:18px;background:#FFFFFF;box-shadow:0 18px 45px rgba(87,6,140,.07)
}
#v-events .filter-row{display:block;padding:1.35rem 1.25rem}
#v-events .filter-row:nth-child(2){border-top:1px solid var(--line)}
#v-events .filter-label{
  display:flex;align-items:center;gap:.55rem;min-width:0;margin:0 0 .45rem;
  color:#4D3359;font-size:.64rem;font-weight:700
}
#v-events .filter-step{
  display:grid;place-items:center;width:1.45rem;height:1.45rem;border-radius:50%;
  background:var(--violet);color:#FFFFFF;letter-spacing:0
}
#v-events .filter-hint{margin:0 0 1rem;color:#765F80;font-size:.9rem;line-height:1.45}
#v-events .filter-row .chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.48rem;width:100%;padding:0}
#v-events .filter-row .chips button{
  width:100%;min-height:2.55rem;padding:.58rem .45rem;border-color:rgba(87,6,140,.28);
  justify-content:center;text-align:center;background:#FFFFFF
}
#v-events .filter-row .chips button:first-child{grid-column:1/-1}
#v-events .filter-row .chips button[aria-selected="true"]{background:var(--violet);color:#FFFFFF}
#v-events .ev-views{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;width:100%;
  padding:.3rem;border-radius:14px!important;background:#F1E7F7
}
#v-events .ev-views button{
  min-height:2.75rem;padding:.62rem .55rem;border-radius:10px!important;background:transparent
}
#v-events .ev-views button[aria-pressed="true"]{background:#FFFFFF;color:var(--violet)}
#v-events .ev-count{
  display:block;width:max-content;margin:1rem 0 0;padding:.45rem .72rem;
  border:0;border-radius:99px;background:#FFFFFF;color:#604D69;text-align:left
}
#v-events .ev-content{width:100%;min-width:0;margin:0}
#v-events .ev-year{margin:clamp(2.5rem,5vw,4rem) 0 1rem;font-size:clamp(1.8rem,3vw,2.4rem)}
#v-events .ev-year-group:first-child .ev-year{margin-top:0}
#v-events .ev-card{
  grid-template-columns:5.5rem minmax(0,1fr) auto;gap:clamp(1.25rem,3vw,2.4rem);
  align-items:center;min-height:0;margin:0 0 1rem;padding:clamp(1.45rem,2.7vw,2rem);
  border:1px solid rgba(87,6,140,.13);border-left:1px solid rgba(87,6,140,.13);
  border-radius:18px;background:#FFFFFF;
  transition:transform .25s var(--ease-key),border-color .2s ease,box-shadow .25s ease,background .2s ease
}
#v-events .ev-card:hover,#v-events .ev-card:focus-within{
  padding-left:clamp(1.45rem,2.7vw,2rem);padding-right:clamp(1.45rem,2.7vw,2rem);
  border-color:rgba(87,6,140,.34);background:#FFFFFF;transform:translateY(-3px);
  box-shadow:0 16px 38px rgba(87,6,140,.1)
}
#v-events .ev-date{
  align-items:center;justify-content:center;min-height:6.1rem;padding:.85rem .55rem;
  border-radius:13px;background:#FFFFFF;box-shadow:inset 0 0 0 1px rgba(87,6,140,.13)
}
#v-events .ev-date .ev-day{font-size:2.7rem}
#v-events .ev-main h4{font-size:clamp(1.55rem,2.8vw,2rem)}
#v-events .ev-main p{max-width:40rem;margin-top:.5rem;color:#66556E;font-size:.98rem;line-height:1.58}
#v-events .ev-top{margin-bottom:.55rem}
#v-events .ev-meta{margin-top:.85rem}
#v-events .ev-cta .btn{min-width:7.2rem;justify-content:center}
#v-events .cal-month{border-radius:18px!important}

@media(max-width:1000px){
  #v-events .ev-workspace{grid-template-columns:1fr;gap:2rem}
  #v-events .ev-sidebar{position:relative;top:auto}
  #v-events .ev-filters{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(15rem,.7fr)}
  #v-events .filter-row:nth-child(2){border-top:0;border-left:1px solid var(--line)}
  #v-events .filter-row .chips{display:flex;flex-wrap:wrap}
  #v-events .filter-row .chips button,#v-events .filter-row .chips button:first-child{grid-column:auto;width:auto;padding-inline:.85rem}
}
@media(max-width:680px){
  #v-events .ev-filters{display:flex}
  #v-events .filter-row:nth-child(2){display:block}
  #v-events .filter-row:nth-child(2){border-top:1px solid var(--line);border-left:0}
  #v-events .filter-row .chips{display:flex;overflow-x:auto;flex-wrap:nowrap;padding-bottom:.35rem;scroll-snap-type:x proximity}
  #v-events .filter-row .chips button{flex:0 0 auto;scroll-snap-align:start}
  #v-events .ev-count{margin-top:1rem;border:0;text-align:left}
  #v-events .ev-card{grid-template-columns:4.5rem minmax(0,1fr);align-items:start;gap:1rem;padding:1rem}
  #v-events .ev-card:hover,#v-events .ev-card:focus-within{padding:1rem}
  #v-events .ev-date{min-height:5.2rem}
  #v-events .ev-date .ev-day{font-size:2.15rem}
  #v-events .ev-cta{grid-column:2;justify-self:start;margin-top:.25rem}
}

/* The filter deck can step out of the way without leaving a dead sidebar. */
#v-events .ev-workspace{
  transition:grid-template-columns .18s cubic-bezier(.22,1,.36,1),gap .18s cubic-bezier(.22,1,.36,1)
}
#v-events .ev-sidebar{transition:width .18s cubic-bezier(.22,1,.36,1)}
#v-events .ev-content{will-change:transform,opacity}
#v-events .ev-filter-toggle{
  display:flex;align-items:center;gap:.7rem;width:100%;min-height:2.7rem;margin:0 0 .4rem;
  padding:.55rem .2rem;border:0;border-bottom:1px solid rgba(87,6,140,.28);border-radius:0;background:transparent;
  color:var(--violet);font:700 .58rem var(--mono);letter-spacing:.14em;text-transform:uppercase;
  box-shadow:none;overflow:hidden;
  transition:width .18s cubic-bezier(.22,1,.36,1),color .14s ease,background-color .14s ease,border-color .14s ease,gap .12s ease,padding .18s cubic-bezier(.22,1,.36,1)
}
#v-events .ev-filter-toggle:hover,#v-events .ev-filter-toggle:focus-visible{background:transparent;color:var(--plum);border-color:var(--violet);outline:none;box-shadow:0 2px 0 rgba(87,6,140,.32)!important}
#v-events .ev-filter-toggle-icon{
  position:relative;display:block;width:1.1rem;min-width:1.1rem;height:.72rem;flex:0 0 1.1rem;
  align-self:center;overflow:visible;transform:none
}
#v-events .ev-filter-toggle-icon span{
  position:absolute;display:block;width:3px;height:3px;box-sizing:border-box;border-radius:50%;background:currentColor;
  transition:none
}
#v-events .ev-filter-toggle-icon span:nth-child(1){top:0;left:50%;transform:translateX(-50%)}
#v-events .ev-filter-toggle-icon span:nth-child(2){left:0;bottom:0}
#v-events .ev-filter-toggle-icon span:nth-child(3){right:0;bottom:0}
#v-events .ev-filter-toggle-label{
  max-width:11rem;overflow:hidden;white-space:nowrap;opacity:1;transform:translateX(0);
  transition:max-width .14s cubic-bezier(.22,1,.36,1),opacity .08s ease,transform .12s cubic-bezier(.22,1,.36,1)
}
#v-events .ev-filter-toggle-state{
  max-width:1rem;margin-left:auto;overflow:hidden;font-size:1rem;line-height:1;letter-spacing:0;opacity:1;
  transition:max-width .12s ease,opacity .08s ease
}
#v-events .ev-filters{
  display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr;max-height:none;opacity:1;transform:translateY(0);transform-origin:top;overflow:hidden;
  transition:grid-template-rows .18s cubic-bezier(.22,1,.36,1),opacity .1s ease,transform .18s cubic-bezier(.22,1,.36,1),border-width .08s ease
}
#v-events .ev-filter-content{min-height:0;overflow:hidden;display:flex;flex-direction:column}
#v-events .ev-workspace.filters-collapsed{grid-template-columns:3.25rem minmax(0,1fr);gap:clamp(1.1rem,2.2vw,2rem)}
#v-events .filters-collapsed .ev-sidebar{width:3.25rem}
#v-events .filters-collapsed .ev-filter-toggle{
  width:2.25rem;min-height:2.25rem;justify-content:center;gap:0;padding:.35rem .55rem;margin:0;
  border-bottom-color:var(--violet);border-radius:8px;background:var(--violet);color:#FFFFFF;box-shadow:0 6px 18px rgba(87,6,140,.2)
}
#v-events .filters-collapsed .ev-filter-toggle:hover,
#v-events .filters-collapsed .ev-filter-toggle:focus-visible{background:var(--plum);color:#FFFFFF;border-color:var(--plum)}
#v-events .filters-collapsed .ev-filter-toggle-icon{width:1.1rem;min-width:1.1rem;flex-basis:1.1rem;transform:none}
#v-events .filters-collapsed .ev-filter-toggle-label{max-width:0;opacity:0;transform:translateX(-.45rem)}
#v-events .filters-collapsed .ev-filter-toggle-state{max-width:0;opacity:0;margin-left:0}
#v-events .filters-panel-hidden .ev-filters{
  grid-template-rows:0fr;opacity:0;transform:translateY(-.45rem);border-width:0;pointer-events:none
}
@media(max-width:1000px){
  #v-events .ev-filter-content{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(15rem,.7fr)}
  #v-events .ev-workspace.filters-collapsed{grid-template-columns:1fr;gap:1rem}
  #v-events .filters-collapsed .ev-sidebar{width:3.25rem}
}
@media(max-width:680px){
  #v-events .ev-filter-content{display:flex;flex-direction:column}
}

/* Confirmed upcoming events and ongoing peer-teaching sign-ups. */
.home-featured.has-live-events .upcoming-stack{
  grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none
}
.home-featured.has-live-events .upcoming-card,
.home-featured.has-live-events .upcoming-card:first-child{
  grid-row:auto;min-height:0;aspect-ratio:4/5
}
.home-featured.has-live-events .upcoming-card img{object-fit:cover}
.home-featured.has-live-events .upcoming-card::before{
  background:linear-gradient(to top,rgba(25,25,25,.94) 0%,rgba(25,25,25,.08) 58%,rgba(25,25,25,0) 78%)
}
.future-events-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,5vw,4.5rem) clamp(1.5rem,3vw,2.5rem)}
.future-event-card{display:grid;grid-template-columns:minmax(11rem,.72fr) minmax(13rem,1fr);gap:clamp(1.25rem,3vw,2.2rem);align-items:center;padding-top:1.5rem;border-top:0;scroll-margin-top:8rem}
.future-event-card--dated{grid-column:1/-1;grid-template-columns:minmax(18rem,.78fr) minmax(20rem,1.22fr)}
.future-event-poster{display:block;overflow:hidden;background:var(--lilac);box-shadow:0 14px 34px rgba(53,2,79,.12);transition:transform .3s var(--ease-key),box-shadow .3s ease}
.future-event-poster:hover,.future-event-poster:focus-visible{transform:translateY(-5px);box-shadow:0 20px 44px rgba(53,2,79,.2)}
.future-event-poster img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.future-event-copy{min-width:0}
.future-event-status{display:inline-flex;margin-bottom:.85rem;padding:.38rem .7rem;border-radius:99px;background:var(--lilac);color:var(--violet);font:700 .56rem var(--mono);letter-spacing:.14em;text-transform:uppercase}
.future-event-copy h2{font-family:var(--serif);font-size:clamp(1.9rem,3.5vw,3.4rem);font-weight:600;line-height:.98;letter-spacing:-.025em}
.future-event-copy h2 strong{font-weight:800}
.future-event-copy>p{margin-top:1rem;color:var(--stone);line-height:1.65}
.future-event-copy dl{margin-top:1.25rem;border-top:1px solid var(--line)}
.future-event-copy dl div{display:grid;grid-template-columns:4rem 1fr;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line)}
.future-event-copy dt{font:700 .56rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--violet)}
.future-event-copy dd{font-size:.94rem}
.future-event-copy .btn{margin-top:1.3rem}
@media(max-width:900px){
  .home-featured.has-live-events .upcoming-stack{grid-template-columns:1fr 1fr}
  .home-featured.has-live-events .upcoming-card:first-child{grid-column:1/-1;aspect-ratio:16/10}
  .future-events-grid{grid-template-columns:1fr}
  .future-event-card,.future-event-card--dated{grid-column:auto;grid-template-columns:minmax(12rem,.7fr) minmax(15rem,1fr)}
}
@media(max-width:600px){
  .home-featured.has-live-events .upcoming-stack{grid-template-columns:1fr}
  .home-featured.has-live-events .upcoming-card,
  .home-featured.has-live-events .upcoming-card:first-child{grid-column:auto;aspect-ratio:4/5;min-height:0}
  .future-event-card,.future-event-card--dated{grid-template-columns:1fr;gap:1.35rem}
  .future-event-poster{max-width:30rem;margin:0 auto}
}

/* Quiet event placeholder. */
.events-coming-soon{
  display:flex;min-height:clamp(22rem,48vw,36rem);
  flex-direction:column;align-items:center;justify-content:center;padding:clamp(3rem,8vw,7rem) var(--gutter);
  text-align:center
}
.events-coming-soon h1,.events-coming-soon h2{
  margin:0;color:var(--ink);font-family:var(--serif);font-size:clamp(4.25rem,10vw,8.5rem);
  font-style:italic;font-weight:500;letter-spacing:-.065em;line-height:.78
}
.coming-letter{
  display:inline-block;opacity:0;transform:translateY(.34em) rotateX(-35deg);
  transform-origin:center bottom
}
.coming-letter.space{width:.22em;transform:none}
.coming-title.letters-in .coming-letter:not(.space){
  animation:comingLetterIn .5s var(--ease-key) calc(.04s + var(--coming-i)*.045s) both
}
.coming-title.letters-in .coming-letter.space{opacity:1}
@keyframes comingLetterIn{
  0%{opacity:0;transform:translateY(.34em) rotateX(-35deg)}
  64%{opacity:1;transform:translateY(-.035em) rotateX(3deg)}
  100%{opacity:1;transform:none}
}
.events-coming-soon--page{min-height:clamp(31rem,70vh,46rem)}
#v-events .ev-workspace[hidden]{display:none!important}

/* Let the browser postpone layout and paint work for long, off-screen blocks. */
#v-home>.home-programs,
#v-home>.nl-band,
#v-about>section.block,
#v-contact>.contact-faq-block{
  content-visibility:auto;
  contain-intrinsic-size:auto 900px
}
@media(max-width:600px){
  .events-coming-soon{min-height:24rem;padding-inline:1rem}
  .events-coming-soon--page{min-height:calc(100svh - 12rem)}
  .events-coming-soon h1,.events-coming-soon h2{font-size:clamp(3.6rem,20vw,5.5rem)}
}

@media(prefers-reduced-motion:reduce){
  #galItems .frame,#galItems .frame img.ph{transition:none!important;transform:none!important}
  .gallery-cover-flight,.gallery-surface-flight{display:none!important}
  #galModal .gm-body,#galModal .gm-body>*,#galModal .gm-nav,#galModal .gm-dots,#galModal .gm-close{
    animation:none!important;transition:none!important;filter:none!important
  }
  .intro-stroke{animation:none!important;opacity:1!important;transform:none!important}
  body.ready #topbar{animation:none}
  .music-note-pop{display:none}
  #v-events .ev-workspace,#v-events .ev-filters,#v-events .ev-filter-toggle{transition:none!important}
  .coming-letter{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
}

/* ============================================================
   TOP BAR NAV — reuse the gallery switch-glider on the site nav
   ============================================================ */
/* The glider system was written for <button> groups; the top bar uses <a>
   with .current, so mirror every switch-group rule onto anchors. */
/* Note: no blanket background:transparent here (unlike the button rule) — that
   would also kill the nav's hover highlight. Only .current needs clearing, and
   the rule below does that. */
.switch-group>a{
  position:relative;z-index:2;
  transition:color .28s ease,transform .28s var(--ease-key),border-color .28s ease!important;
}
.switch-group>a:hover{transform:translateY(-1px)}
#topbar .tb-nav.switch-group{position:relative!important;isolation:isolate}
/* The glider now draws the active pill, so the link's own fill must go —
   including every bar-state override defined earlier in this sheet. */
#topbar .tb-nav.switch-group a.current,
#topbar .tb-nav.switch-group a.current:hover,
#topbar.bar-home-hero .tb-nav.switch-group a.current,
#topbar.bar-home-hero .tb-nav.switch-group a.current:hover,
#topbar.bar-light-origin .tb-nav.switch-group a.current,
#topbar.bar-light-origin .tb-nav.switch-group a.current:hover,
#topbar.bar-solid .tb-nav.switch-group a.current,
#topbar.bar-solid .tb-nav.switch-group a.current:hover{
  background:transparent!important;color:#FFFFFF!important;
}
#topbar .tb-nav.switch-group a.current::after{display:none}
/* Keep the search shell clear of the glider track. */
#topbar .tb-nav.switch-group>.tb-search-shell{position:relative;z-index:2}

/* ============================================================
   MIDI VIEW TRANSITION — piano-roll notes fall, cover, drain
   ============================================================ */
#midiWipe{
  position:fixed;inset:0;z-index:900;display:none;
  pointer-events:none;overflow:hidden;contain:layout paint;
}
#midiWipe.on{display:block;pointer-events:auto}
/* Flat violet bars — the note length is the only expressive variable. */
#midiWipe .midi-note{
  position:absolute;top:0;width:var(--cw);left:var(--cx);height:var(--nh);
  border-radius:2px;will-change:transform;background:var(--violet);
  transform:translate3d(0,calc(-1 * var(--nh)),0);
}
/* One continuous top-to-bottom pass at a constant rate, exactly like a piano
   roll scrolling past the playhead — linear timing, no ease, no hold. */
#midiWipe.play .midi-note{
  animation:midiPass var(--dur) linear var(--delay) both;
}
@keyframes midiPass{
  from{transform:translate3d(0,calc(-1 * var(--nh)),0)}
  to{transform:translate3d(0,var(--vh),0)}
}
@media(prefers-reduced-motion:reduce){
  #midiWipe{display:none!important}
  .switch-group>a,.switch-group>a:hover{transform:none!important}
}

/* ============================================================
   PHONE NAVIGATION + LIGHTWEIGHT GALLERY
   Everything in this block is intentionally isolated to phone widths.
   ============================================================ */
.mobile-menu-toggle{display:none}
@media(max-width:600px){
  body{line-height:1.68}
  #topbar{
    display:grid;grid-template-columns:auto auto;justify-content:space-between;align-items:center;
    gap:.75rem;padding:max(.55rem,env(safe-area-inset-top)) max(.75rem,env(safe-area-inset-right)) .55rem max(.75rem,env(safe-area-inset-left));
    overflow:visible
  }
  #topbar .tb-brand{position:relative;z-index:2}
  #topbar .tb-brand .brand-logo{width:2.65rem!important;height:2.65rem}
  .mobile-menu-toggle{
    position:relative;z-index:3;display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
    min-width:5.6rem;min-height:2.75rem;padding:.62rem .82rem;border:1px solid currentColor;
    background:transparent;color:inherit;font:700 .78rem var(--mono);letter-spacing:.1em;text-transform:uppercase
  }
  .mobile-menu-toggle-lines{display:grid;gap:4px;width:15px}
  .mobile-menu-toggle-lines i{display:block;width:15px;height:1.5px;background:currentColor;transition:transform .18s ease,opacity .18s ease}
  #topbar.mobile-menu-open .mobile-menu-toggle-lines i:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
  #topbar.mobile-menu-open .mobile-menu-toggle-lines i:nth-child(2){opacity:0}
  #topbar.mobile-menu-open .mobile-menu-toggle-lines i:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
  #topbar.bar-home-hero .mobile-menu-toggle{color:#FFFFFF}
  #topbar.bar-light-origin .mobile-menu-toggle{color:#191919}
  #topbar.bar-solid .mobile-menu-toggle{color:#FFFFFF}

  #topbar .tb-nav,
  #topbar .tb-nav.switch-group{
    position:fixed!important;top:calc(max(.55rem,env(safe-area-inset-top)) + 3.35rem);left:.75rem;right:.75rem;
    z-index:1;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;
    width:auto;max-width:none;padding:.75rem;overflow:visible;
    background:#FFFFFF;color:#191919;border:1px solid var(--line);border-radius:14px!important;
    box-shadow:0 18px 42px rgba(25,25,25,.18)!important;
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px) scale(.985);
    transition:opacity .16s ease,transform .18s var(--ease-key),visibility 0s linear .18s
  }
  #topbar.mobile-menu-open .tb-nav{
    opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s
  }
  #topbar .tb-nav>.switch-glider{display:none!important}
  #topbar .tb-nav>a,
  #topbar .tb-nav.switch-group>a{
    display:flex;justify-content:flex-start;align-items:center;min-width:0;min-height:3rem;
    padding:.72rem .8rem;border:1px solid var(--line);border-radius:9px!important;
    background:#FFFFFF!important;color:#191919!important;font-size:.875rem;letter-spacing:.055em;
    transform:none!important;white-space:normal
  }
  #topbar .tb-nav>a::after{display:none!important}
  #topbar .tb-nav>a.current,
  #topbar .tb-nav.switch-group>a.current,
  #topbar.bar-home-hero .tb-nav.switch-group>a.current,
  #topbar.bar-light-origin .tb-nav.switch-group>a.current,
  #topbar.bar-solid .tb-nav.switch-group>a.current{
    background:var(--violet)!important;color:#FFFFFF!important;border-color:var(--violet)!important
  }
  #topbar .tb-search-shell,
  #topbar .tb-search-shell.open{
    position:relative!important;right:auto;grid-column:1/-1;width:100%!important;height:3.1rem;
    flex-basis:auto;margin:0;padding:0;background:transparent
  }
  #topbar .tb-search-shell .tb-search{
    inset:0;width:100%!important;height:3.1rem;display:flex;gap:.55rem;padding:.7rem .9rem;
    background:#F4EFF7;color:var(--violet);border:1px solid var(--line)
  }
  #topbar .tb-search-shell .tb-search span{display:inline}
  #topbar .tb-search-field,
  #topbar .tb-search-shell.open .tb-search-field{
    position:absolute!important;inset:0!important;width:100%;height:3.1rem;background:#FFFFFF
  }
  #topbar .tb-search-shell .search-modal{
    position:absolute!important;inset:calc(100% + .55rem) 0 auto!important;width:100%;max-height:55svh
  }

  #v-gallery>section.block{padding-top:5.25rem!important}
  #v-gallery .gal-bar{display:grid;grid-template-columns:minmax(0,1fr);gap:.85rem}
  #v-gallery #galYear{display:flex;width:100%;overflow-x:auto;flex-wrap:nowrap;padding-bottom:.15rem;scrollbar-width:none}
  #v-gallery #galYear::-webkit-scrollbar{display:none}
  #v-gallery #galYear button{flex:0 0 auto;min-height:2.75rem;font-size:.72rem;letter-spacing:.09em}
  #v-gallery .view-toggle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  #v-gallery .view-toggle button{min-height:2.75rem;font-size:.74rem;letter-spacing:.08em}
  #galItems.gallery-items:not(.as-list){gap:1.65rem}

  /* A native horizontal rail replaces the continuously rendered 3D cylinder. */
  #v-home .hl-cylinder{height:auto;perspective:none;overflow-x:auto;padding:0 0 .8rem;cursor:auto;scrollbar-width:none}
  #v-home .hl-cylinder::-webkit-scrollbar{display:none}
  #v-home .hl-track{position:static;display:flex;gap:.9rem;width:max-content;height:auto;transform:none!important;will-change:auto}
  #v-home .hl-card{position:relative;inset:auto;flex:0 0 min(82vw,20rem);height:auto;aspect-ratio:16/10;transform:none!important;filter:none!important}
  #v-home .hl-backface,#v-home .hl-scrollbar{display:none!important}
  #v-about .about-row{animation:none!important;will-change:auto}

  .gallery-cover-flight,.gallery-surface-flight{display:none!important}
  #galModal{padding:.45rem;background:rgba(25,25,25,.7)}
  #galModal .gm-backdrop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
  #galModal.mobile-simple .gm-panel,
  #galModal.mobile-simple.shared-opening .gm-panel,
  #galModal.mobile-simple.shared-transition .gm-panel{
    height:calc(100svh - .9rem);border-radius:12px!important;
    animation:mobileGalleryAppear .18s ease-out both!important
  }
  #galModal.mobile-simple .gm-body,
  #galModal.mobile-simple .gm-body>*,
  #galModal.mobile-simple .gm-close,
  #galModal.mobile-simple .gm-dots{
    animation:none!important;transition:none!important;filter:none!important
  }
  #galModal.mobile-simple .gm-media{opacity:1;transition:opacity .18s ease!important}
  #galModal.mobile-simple.media-pending .gm-media{opacity:0}
  #galModal.mobile-simple .gm-body{padding:1.25rem 1.1rem;gap:.8rem}
  #galModal.mobile-simple .gm-body h3{font-size:clamp(1.65rem,8vw,2.15rem);line-height:1.08}
  #galModal.mobile-simple .gm-facts dt{font-size:.68rem;letter-spacing:.1em}
  #galModal.mobile-simple .gm-facts dd{font-size:1rem;line-height:1.5}
  #galModal.mobile-simple .gm-links .btn{width:100%;justify-content:center;font-size:.78rem}
  #galModal.mobile-simple .gm-track.is-moving{transition-duration:.34s}
  @keyframes mobileGalleryAppear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  .view-head .lead,.team-row .bio,.program-card .desc,.gm-desc{font-size:1rem;line-height:1.68}
  .tr-major,.gal-row-meta{font-size:.72rem;line-height:1.55;letter-spacing:.07em}
  .foot-grid{gap:2rem}.foot-links{gap:2rem}.foot-legal{font-size:.65rem;line-height:1.65;letter-spacing:.1em}
  #midiWipe{display:none!important}
  .music-note-pop{display:none!important}
}

/* ============================================================
   NETLIFY NEWSLETTER — one detected form, shared AJAX endpoint
   ============================================================ */
.sr-only,.netlify-honeypot{
  position:absolute!important;width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;overflow:hidden!important;
  clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important
}
.home-sub-in{max-width:70.5rem}
.home-sub h2{margin:.55rem 0 .8rem}
.newsletter-intro{
  max-width:45rem;margin:0 auto;color:rgba(255,255,255,.78);
  font-size:clamp(1rem,1.5vw,1.16rem);line-height:1.65;text-wrap:balance
}
.newsletter-shell{width:100%;max-width:58rem;margin:2rem auto 0}
.newsletter-form{
  position:relative;width:100%;margin:0;display:grid;gap:1.5rem;text-align:left;
  border-radius:10px
}
.newsletter-form[hidden]{display:none!important}
.newsletter-form--full{
  padding:0;background:transparent;border:0
}
.newsletter-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2rem}
.newsletter-field{display:flex;min-width:0;flex-direction:column;gap:.5rem}
.newsletter-field--wide{grid-column:1/-1}
.newsletter-field label{
  color:inherit;font:650 .92rem/1.35 var(--sans);letter-spacing:.005em;text-transform:none
}
.newsletter-field label span{color:var(--lilac)}
.newsletter-field input{
  width:100%;min-width:0;min-height:3rem;margin:0;padding:.75rem 0;
  border:0;border-bottom:1px solid rgba(255,255,255,.52);border-radius:0;background:transparent;
  color:#FFFFFF;font:500 1rem/1.45 var(--sans);box-shadow:none;appearance:none
}
.newsletter-field input::placeholder{color:rgba(255,255,255,.56);opacity:1}
.newsletter-field input:hover{border-color:#FFFFFF}
.newsletter-field input:focus-visible{
  outline:0;border-color:var(--electric);box-shadow:0 2px 0 var(--electric)
}
.newsletter-submit{
  justify-self:start;min-height:3rem;min-width:10rem;padding:.75rem 1.5rem;
  border:1px solid var(--violet);border-radius:5px;background:var(--violet);color:#FFFFFF;
  font:700 .68rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease
}
.newsletter-submit:hover{background:#FFFFFF;color:var(--violet);border-color:#FFFFFF}
.newsletter-submit:focus-visible{outline:3px solid var(--electric);outline-offset:3px}
.newsletter-submit:disabled{cursor:wait;opacity:.66}
.newsletter-privacy{margin:0;color:rgba(255,255,255,.82);font-size:.85rem;line-height:1.5}
.newsletter-privacy a{text-decoration:underline;text-underline-offset:3px}
.newsletter-status{
  width:100%;margin:0;padding:1rem 1.15rem;border-radius:6px;
  font:700 .72rem/1.55 var(--mono);letter-spacing:.08em;text-transform:none
}
.newsletter-status[hidden]{display:none}
.newsletter-status[data-state="success"]{background:var(--violet);color:#FFFFFF;border:1px solid var(--electric)}
.newsletter-status[data-state="error"]{background:#FFF0F5;color:#6A1438;border:1px solid #C94B7B}
.newsletter-status:focus{outline:none}
/* The contact view submits to the canonical newsletter form name. */
#v-contact .newsletter-shell--contact{width:100%;max-width:52rem;margin-top:2rem}
#v-contact .newsletter-form--contact{padding:0;border:0;background:transparent;color:var(--ink)}
#v-contact .newsletter-field input{color:var(--ink);border-color:var(--line-strong)}
#v-contact .newsletter-field input::placeholder{color:#775E83}
#v-contact .newsletter-field input:hover{border-color:var(--violet)}
#v-contact .newsletter-submit:hover{background:var(--ink);color:#FFFFFF;border-color:var(--ink)}
#v-contact .newsletter-privacy{color:var(--ink)}

@media(max-width:600px){
  .newsletter-fields{grid-template-columns:minmax(0,1fr)}
  .newsletter-field--wide{grid-column:auto}
  .home-sub{padding-top:3rem;padding-bottom:3.25rem}
  .home-sub h2{font-size:clamp(2rem,10vw,2.65rem)}
  .newsletter-intro{font-size:.98rem;line-height:1.58}
  .newsletter-shell{margin-top:1.5rem}
  .newsletter-form{gap:1.5rem}
  .newsletter-fields{gap:1.25rem}
  .newsletter-field{gap:.5rem}
  .newsletter-field label{font-size:.88rem;line-height:1.35}
  .newsletter-field input{min-height:3rem;font-size:1rem;padding:.75rem 0}
  .newsletter-submit{width:100%;justify-self:stretch;min-height:3rem}

  /* Touch interactions are immediate and stable: no hover/toggle animation. */
  .newsletter-form *,#v-contact.contact-sequence .contact-signup .newsletter-shell{
    animation:none!important;transition:none!important;transform:none!important
  }
  .newsletter-submit:hover,.newsletter-submit:active,
  #v-contact .newsletter-submit:hover,#v-contact .newsletter-submit:active{
    background:var(--violet);color:#FFFFFF;border-color:var(--violet)
  }
}
@media(hover:none) and (pointer:coarse){
  .newsletter-form *,#v-contact.contact-sequence .contact-signup .newsletter-shell{
    animation:none!important;transition:none!important;transform:none!important
  }
  .newsletter-submit:hover,.newsletter-submit:active,
  #v-contact .newsletter-submit:hover,#v-contact .newsletter-submit:active{
    background:var(--violet);color:#FFFFFF;border-color:var(--violet)
  }
}

/* Contact channel hover, keyboard focus, and pressed states retain their colors. */
#v-contact .contact-list a:is(:hover,:focus-visible,:active){background:#DCC9E8!important;border-color:var(--violet)!important;color:var(--ink)!important}
#v-contact .contact-list a:is(:hover,:focus-visible,:active) .name{color:var(--ink)!important}
#v-contact .contact-list a:is(:hover,:focus-visible,:active) .ci{color:var(--violet)!important}
#v-contact .contact-list a:is(:hover,:focus-visible,:active) .engage-ci{background:transparent!important}
#v-contact .contact-list a:is(:hover,:focus-visible,:active) .ext{color:var(--violet)!important}