/* Paideia Today — museum night gallery. See ../DESIGN.md */

:root{
  --night:#0C1220;
  --abyss:#070C16;
  --aegean:#26344F;
  --marble:#F2EFE7;
  --marble-dim:#C7CBD6;
  --ink:#1B2130;
  --ink-soft:#3A4154;
  --gilt:#C9A75C;
  --bronze:#A67C2E;
  --wine:#5E2233;
  --line-dark:rgba(201,167,92,.22);
  --line-light:rgba(27,33,48,.16);
  --z-nav:40; --z-progress:50; --z-torch:1; --z-menu:45;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  font-family:'EB Garamond',Georgia,serif;
  font-size:clamp(19px,1.05vw + 14px,21px);
  line-height:1.7;
  color:var(--marble);
  background:var(--night);
}
img{max-width:100%;display:block}
h1,h2,h3,.door,.wordmark,nav a{font-family:'Marcellus',serif;font-weight:400}
h1,h2,h3{text-wrap:balance;letter-spacing:.02em}
p{max-width:68ch}
a{color:var(--gilt)}
a:focus-visible,.door:focus-visible,button:focus-visible{outline:2px solid var(--gilt);outline-offset:4px}
::selection{background:var(--gilt);color:var(--night)}

.wrap{max-width:1160px;margin:0 auto;padding:0 clamp(20px,4vw,40px)}
section{padding:clamp(88px,12vw,160px) 0}

/* ---------- torchlight (signature) ---------- */
.torch{
  position:fixed;inset:0;z-index:var(--z-torch);pointer-events:none;
  background:radial-gradient(560px circle at var(--tx,50%) var(--ty,30%),rgba(201,167,92,.10),transparent 65%);
  mix-blend-mode:screen;
}
@media (prefers-reduced-motion:reduce),(hover:none){
  .torch{background:radial-gradient(700px circle at 50% 22%,rgba(201,167,92,.07),transparent 65%)}
}

/* ---------- meander progress ---------- */
.progress{
  position:fixed;top:0;left:0;right:0;height:3px;z-index:var(--z-progress);
  background:transparent;
}
.progress b{
  display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--bronze),var(--gilt));
  transform:scaleX(var(--p,0));transform-origin:left;
}

/* ---------- nav ---------- */
header.site{
  position:sticky;top:0;z-index:var(--z-nav);
  background:rgba(12,18,32,.82);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line-dark);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1240px;margin:0 auto;padding:18px clamp(20px,4vw,40px)}
.wordmark{font-size:20px;letter-spacing:.24em;text-decoration:none;color:var(--marble);white-space:nowrap;display:inline-flex;align-items:center;gap:12px}
.wordmark span{color:var(--gilt)}
.wordmark .mark{height:34px;width:34px}
footer .wordmark .mark{height:44px;width:44px}
.nav ul{display:flex;gap:clamp(16px,2.4vw,30px);list-style:none;align-items:center}
.nav ul a{
  text-decoration:none;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--marble-dim);
  padding:6px 2px;border-bottom:1px solid transparent;transition:color .25s,border-color .25s;
}
.nav ul a:hover{color:var(--gilt)}
.nav ul a[aria-current="page"]{color:var(--marble);border-bottom-color:var(--gilt)}
.menu-btn{display:none;background:none;border:1px solid var(--line-dark);color:var(--marble);font-family:'Marcellus',serif;letter-spacing:.14em;text-transform:uppercase;font-size:13px;padding:9px 16px;cursor:pointer}
@media (max-width:880px){
  .menu-btn{display:block}
  .nav ul{
    display:none;position:absolute;top:100%;left:0;right:0;z-index:var(--z-menu);
    flex-direction:column;align-items:flex-start;gap:0;
    background:var(--abyss);border-bottom:1px solid var(--line-dark);padding:10px 0;
  }
  .nav.open ul{display:flex}
  .nav ul li{width:100%}
  .nav ul a{display:block;padding:14px clamp(20px,4vw,40px);font-size:16px;border-bottom:none}
}

/* ---------- doors (CTA) ---------- */
.door{
  display:inline-block;padding:16px 40px;letter-spacing:.16em;text-transform:uppercase;font-size:14px;
  text-decoration:none;border:1px solid var(--gilt);color:var(--marble);background:transparent;
  transition:background .3s cubic-bezier(.22,1,.36,1),color .3s cubic-bezier(.22,1,.36,1);
}
.door:hover{background:var(--gilt);color:var(--night)}
.on-light .door,.door.on-light{color:var(--ink);border-color:var(--bronze)}
.on-light .door:hover,.door.on-light:hover{background:var(--bronze);color:#fff}
.door.solid{background:var(--gilt);color:var(--night)}
.door.solid:hover{background:var(--marble);color:var(--night)}
.door-row{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:86vh;display:flex;align-items:center;justify-content:center;
  text-align:center;overflow:hidden;padding:140px 0 120px;
}
.hero .glyph{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:'Marcellus',serif;
  font-size:clamp(120px,24vw,340px);
  color:transparent;
  -webkit-text-stroke:1px rgba(201,167,92,.16);
  letter-spacing:.04em;user-select:none;pointer-events:none;white-space:nowrap;
}
.hero-inner{position:relative;max-width:820px;padding:0 24px}
.hero h1{font-size:clamp(44px,6.4vw,86px);line-height:1.06;letter-spacing:.03em}
.hero .sub{margin:26px auto 42px;font-size:clamp(20px,1.6vw,23px);color:var(--marble-dim);max-width:34em}
.hero .sub em{color:var(--gilt);font-style:italic}
.kicker{
  display:block;margin:0 auto 22px;color:var(--gilt);font-family:'Marcellus',serif;
  font-size:15px;letter-spacing:.3em;text-transform:uppercase;
}
.scroll-cue{
  position:absolute;bottom:34px;left:50%;transform:translateX(-50%);
  width:1px;height:56px;background:linear-gradient(var(--gilt),transparent);opacity:.7;
}

/* carved divider */
.meander-divider{
  height:14px;max-width:200px;margin:0 auto;opacity:.85;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='14' viewBox='0 0 28 14'%3E%3Cpath d='M1 13V1h12v8H7V5h2v2h2V3H5v10h22' fill='none' stroke='%23A67C2E' stroke-width='1.6'/%3E%3C/svg%3E") repeat-x center;
}

/* ---------- surfaces ---------- */
.light{background:var(--marble);color:var(--ink)}
.light p{color:var(--ink)}
.light .muted{color:#565D6E}
.dark .muted,.muted{color:var(--marble-dim)}
.wine-panel{background:linear-gradient(160deg,var(--wine),#43182466 60%),var(--night)}

/* ---------- manifesto ---------- */
.manifesto{text-align:center}
.manifesto blockquote{
  font-family:'Marcellus',serif;font-size:clamp(28px,3.6vw,46px);line-height:1.3;
  max-width:21em;margin:0 auto;
}
.manifesto blockquote .lit-word{color:var(--gilt)}
.manifesto cite{display:block;margin-top:28px;font-style:italic;font-size:19px;color:var(--marble-dim)}
.light .manifesto cite{color:#565D6E}

/* ---------- splits ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,6vw,84px);align-items:center}
.split.rev{grid-template-columns:.95fr 1.05fr}
.split h2{font-size:clamp(32px,4vw,50px);margin-bottom:20px;line-height:1.15}
.split p{margin-bottom:16px}
.split .door{margin-top:18px}
.figure{position:relative;overflow:hidden}
.figure img{
  width:100%;aspect-ratio:4/5;object-fit:cover;
  filter:contrast(1.04) sepia(.14) saturate(.92);
  transform:scale(1.06);
}
.figure.wide img{aspect-ratio:16/11}
.figure::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px var(--line-dark)}
.light .figure::after{box-shadow:inset 0 0 0 1px var(--line-light)}
.figure figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:14px 18px;
  background:linear-gradient(transparent,rgba(7,12,22,.86));
  font-family:'Marcellus',serif;letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--marble);
}

/* ---------- gallery (coming soon artworks) ---------- */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);margin-top:56px}
.gallery .figure img{aspect-ratio:16/10}
.section-head{text-align:center;max-width:760px;margin:0 auto}
.section-head h2{font-size:clamp(32px,4.4vw,54px);line-height:1.12;margin-bottom:18px}
.section-head p{margin:0 auto}

/* ---------- courses ---------- */
.featured{
  display:grid;grid-template-columns:1.1fr .9fr;gap:0;border:1px solid var(--line-dark);
  background:linear-gradient(120deg,rgba(38,52,79,.55),rgba(12,18,32,0));
}
.featured .figure{min-height:340px}
.featured .figure img{height:100%;aspect-ratio:auto}
.featured .body{padding:clamp(32px,4vw,60px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:18px}
.featured h3{font-size:clamp(30px,3.4vw,44px);line-height:1.12}
.badge{
  font-family:'Marcellus',serif;font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  padding:7px 14px;border:1px solid var(--gilt);color:var(--gilt);
}
.badge.quiet{border-color:var(--line-dark);color:var(--marble-dim)}
.coming-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);margin-top:clamp(24px,4vw,48px)}
.coming-card{border:1px solid var(--line-dark);padding:clamp(28px,3.4vw,44px);display:flex;flex-direction:column;gap:16px;align-items:flex-start;background:rgba(38,52,79,.28)}
.coming-card h3{font-size:clamp(24px,2.6vw,32px)}
.coming-card p{font-size:18px}
.coming-card .door{margin-top:auto}

/* ---------- ledger (odyssey: what awaits) ---------- */
.ledger{max-width:860px;margin:64px auto 0}
.ledger-row{
  display:grid;grid-template-columns:170px 1fr;gap:clamp(20px,4vw,48px);
  padding:36px 0;border-top:1px solid var(--line-dark);align-items:baseline;
}
.ledger-row:last-child{border-bottom:1px solid var(--line-dark)}
.ledger-row h3{font-size:clamp(22px,2.4vw,28px);color:var(--gilt);letter-spacing:.06em}
.ledger-row p{font-size:19px;margin:0}
@media (max-width:640px){.ledger-row{grid-template-columns:1fr;gap:8px;padding:28px 0}}

/* ---------- people (about) ---------- */
.person{display:grid;grid-template-columns:320px 1fr;gap:clamp(32px,5vw,64px);align-items:start}
.person + .person{margin-top:clamp(64px,9vw,110px)}
.person h3{font-size:clamp(26px,3vw,36px);margin-bottom:6px}
.person .role{font-style:italic;color:var(--marble-dim);margin-bottom:18px}
.person p{margin-bottom:14px}
.monogram{
  aspect-ratio:4/5;border:1px solid var(--line-dark);background:var(--aegean);
  display:flex;align-items:center;justify-content:center;
  font-family:'Marcellus',serif;font-size:84px;color:var(--gilt);letter-spacing:.08em;
}
.mission .dropcap::first-letter{
  font-family:'Marcellus',serif;font-size:3.2em;float:left;line-height:.82;
  padding:6px 12px 0 0;color:var(--bronze);
}

/* ---------- subscribe / waitlist ---------- */
.subscribe{text-align:center}
.subscribe h2{font-size:clamp(32px,4.4vw,54px);margin-bottom:16px}
.subscribe > .wrap > p{margin:0 auto 44px}
.form-frame{max-width:640px;margin:0 auto;background:#fff;border:1px solid var(--bronze)}
.form-frame iframe{width:100%;height:520px;border:0;display:block}
.privacy{font-size:16px;font-style:italic;margin-top:16px}

/* ---------- odyssey sea ---------- */
.sea{background:linear-gradient(180deg,#0A1B2A 0%,#16324A 58%,var(--wine) 145%)}
.sea-hero{min-height:92vh}
.waves{position:absolute;bottom:-2px;left:0;width:100%;height:120px;pointer-events:none}
.waves svg{position:absolute;bottom:0;left:0;width:200%;height:100%}
.waves .w2{opacity:.5;bottom:14px}
.waves .w3{opacity:.25;bottom:30px}

/* ---------- footer ---------- */
footer.site{background:var(--abyss);border-top:1px solid var(--line-dark);padding:72px 0 48px;text-align:center}
footer .wordmark{display:inline-block;margin-bottom:10px;font-size:22px}
footer .tagline{color:var(--marble-dim);font-style:italic;margin:0 auto 34px}
.social{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}
.social a{
  color:var(--marble-dim);text-decoration:none;font-family:'Marcellus',serif;
  font-size:13px;letter-spacing:.14em;text-transform:uppercase;transition:color .25s;
}
.social a:hover{color:var(--gilt)}
.copyright{font-size:14px;letter-spacing:.1em;color:#7A8294}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .split,.split.rev,.featured{grid-template-columns:1fr}
  .gallery,.coming-row{grid-template-columns:1fr}
  .person{grid-template-columns:min(320px,100%) 1fr}
}
@media (max-width:680px){
  .person{grid-template-columns:1fr}
  .hero{min-height:74vh;padding:110px 0 90px}
  .featured .figure{min-height:240px}
}

/* ---------- motion hygiene ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}