:root{
  --paper:#F0EDE8;        /* paper-linen */
  --warmwhite:#FBFAF8;
  --ink:#31000A;          /* cherry-ink */
  --accent:#B21E3B;       /* chapter-cherry */
  --muted:#67605A;        /* muted-stone (AA on paper) */
  --night:#250309;        /* night-cherry */
  --cream:#F5EDE4;
  --hairline:#d8d2c6;
}
*{margin:0;box-sizing:border-box}
@media (prefers-reduced-motion:no-preference){ html{scroll-behavior:smooth} }
body{
  background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;
  transition:background .55s cubic-bezier(.16,1,.3,1);
}
::selection{background:var(--accent);color:var(--warmwhite)}

/* ——— Loader: KSF wordmark scramble, Locomotive-style seam between pages ——— */
.loader{
  position:fixed;inset:0;z-index:50;background:var(--paper);
  display:grid;place-items:center;
  transition:transform .5s cubic-bezier(.16,1,.3,1);
}
.loader span{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(1.3rem,3vw,2.1rem);
}
.loader.done{transform:translateY(-102%);pointer-events:none}
html:not(.js) .loader{display:none}

/* ——— Header: wordmark + Menu ——— */
header.site{
  position:fixed;top:0;left:0;right:0;z-index:30;height:60px;
  display:flex;justify-content:space-between;align-items:center;
  padding:0 clamp(24px,4vw,60px);font-size:14px;font-weight:500;
  transition:color .4s;
}
header.site .wm{color:inherit;text-decoration:none;font-weight:500}
header.site.on-night{color:var(--cream)}
header.site.menu-open{color:var(--ink)}
.menu-btn{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:8px 0}
.menu-btn:hover{color:var(--accent)}

/* ——— Full-screen menu ——— */
.menu{
  position:fixed;inset:0;z-index:25;background:var(--warmwhite);
  transform:translateY(-102%);transition:transform .6s cubic-bezier(.16,1,.3,1);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:110px clamp(24px,4vw,60px) 40px;overflow:auto;
}
.menu.open{transform:none}
.menu nav a{
  display:block;text-decoration:none;color:var(--ink);
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(2rem,5.4vw,4.6rem);line-height:1.1;
  padding:18px 0;border-bottom:1px solid var(--hairline);
  transition:padding-left .35s cubic-bezier(.16,1,.3,1),color .3s;
}
.menu nav a:first-child{border-top:1px solid var(--hairline)}
.menu nav a:hover,.menu nav a.active{padding-left:20px;color:var(--accent)}
.menu-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:32px}
.menu-foot .loc{font-size:13px;color:var(--muted)}

section{padding:clamp(80px,12vh,160px) clamp(24px,4vw,60px)}
.shell{max-width:1560px;margin:0 auto}
h1.statement,h2.statement{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.03em;
  font-size:clamp(2.6rem,6.2vw,6.4rem);line-height:1;
}
.statement .ctr{color:var(--muted);font-weight:450}
html.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
html.js .reveal.in{opacity:1;transform:none}

/* Page hero for subpages */
.page-hero{padding:calc(60px + clamp(50px,9vh,110px)) clamp(24px,4vw,60px) clamp(36px,6vh,72px)}
.page-hero .sub{margin-top:24px;max-width:52ch;font-size:16px;line-height:1.7;color:#4c463c}

/* Action rows (hairline CTAs) */
.acts{margin-top:40px}
.acts a,.acts button{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;
  padding:15px 4px;border:0;border-bottom:1px solid var(--hairline);
  text-decoration:none;color:var(--ink);background:none;cursor:pointer;text-align:left;
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.01em;font-size:1.25rem;
  transition:padding-left .35s cubic-bezier(.16,1,.3,1),color .3s;
}
.acts a:first-child,.acts button:first-child{border-top:1px solid var(--ink)}
.acts .arrow{transition:transform .35s cubic-bezier(.16,1,.3,1)}
.acts a:hover,.acts button:hover{padding-left:14px;color:var(--accent)}
.acts a:hover .arrow,.acts button:hover .arrow{transform:translateX(8px)}

/* ——— Landing (home) ——— */
.landing{
  min-height:100vh;display:grid;place-items:center;position:relative;
  padding:90px clamp(24px,4vw,60px) 60px;
}
.piece{position:relative;width:min(820px,82vw)}
.hero-vig{width:100%;aspect-ratio:16/10;display:block;border-radius:2px}
.wordmark{
  position:absolute;left:-8%;bottom:-0.52em;
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.03em;
  font-size:clamp(2.6rem,6.4vw,6.6rem);line-height:.96;color:var(--ink);
  transition:color .55s;pointer-events:none;white-space:nowrap;
}
.wordmark em{font-style:normal;color:var(--accent);transition:color .55s}
.cyc{position:absolute;font-size:13px;font-weight:500;color:var(--ink);min-height:1.4em}
.cyc.a{top:-2.2em;left:0}
.cyc.b{top:-2.2em;right:0;text-align:right;color:var(--muted)}
.scrollhint{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);
  font-size:12px;color:var(--muted);text-decoration:none;
}

/* ——— Disciplines ——— */
.stage{
  display:grid;grid-template-columns:minmax(300px,400px) 1fr;
  gap:clamp(24px,4.5vw,90px);align-items:center;
  max-width:1560px;margin:0 auto;min-height:80vh;
}
.intro p{font-size:15px;line-height:1.7;color:#4c463c;max-width:34ch;margin-bottom:26px}
nav.rail{border-top:1px solid var(--hairline)}
nav.rail a{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:17px 4px;border-bottom:1px solid var(--hairline);
  text-decoration:none;color:inherit;font-size:17px;font-weight:500;
  transition:padding-left .35s cubic-bezier(.16,1,.3,1),color .3s;
}
nav.rail a .go{
  color:var(--muted);font-weight:400;
  transition:transform .35s cubic-bezier(.16,1,.3,1),color .3s;
}
nav.rail a:hover,nav.rail a.active{padding-left:14px;color:var(--accent)}
nav.rail a:hover .go,nav.rail a.active .go{color:var(--accent);transform:translateX(6px)}
.display{position:relative;display:flex;flex-direction:column}
.word{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.03em;
  font-size:clamp(3.2rem,8.6vw,9.4rem);line-height:.98;color:var(--accent);
  transition:color .55s cubic-bezier(.16,1,.3,1);min-height:2.05em;
}
.word .line{display:block;white-space:nowrap}
.row{display:flex;gap:clamp(24px,3vw,56px);align-items:flex-start;margin-top:34px;flex-wrap:wrap}
.desc{
  max-width:36ch;font-size:16px;line-height:1.7;color:#4c463c;
  opacity:0;transform:translateY(8px);transition:opacity .5s .1s,transform .5s .1s;
}
.desc.in{opacity:1;transform:none}
.vignette{width:min(400px,100%);aspect-ratio:16/10;border-radius:2px;display:block;flex:0 0 auto}

/* ——— Impact (night) ——— */
.impact{background:var(--night);color:var(--cream)}
.impact .statement{color:var(--cream)}
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,48px);
  margin-top:clamp(48px,8vh,90px);
}
.stat b{
  display:block;font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(2.6rem,5.4vw,5.6rem);line-height:1;color:var(--cream);
}
.stat span{display:block;margin-top:10px;font-size:14px;color:#B9A9A0}
.impact .foot{margin-top:clamp(48px,8vh,80px);font-size:14px;color:#B9A9A0;max-width:52ch;line-height:1.7}

/* ——— Workshop bands ——— */
.fullbleed{padding-left:0;padding-right:0}
.fullbleed .head{padding:0 clamp(24px,4vw,60px);max-width:1560px;margin:0 auto clamp(48px,8vh,100px)}
.band-wrap{position:relative;margin-top:clamp(60px,10vh,120px)}
.band{width:100%;height:clamp(320px,62vh,620px);display:block}
.band.short{height:clamp(280px,46vh,520px)}
.band-title{
  position:absolute;left:clamp(24px,4vw,60px);bottom:-0.46em;
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(2rem,5vw,4.4rem);line-height:1;color:var(--ink);
}
.band-wrap.alt .band-title{left:auto;right:clamp(24px,4vw,60px)}
.band-info{
  display:grid;grid-template-columns:minmax(160px,320px) 1fr;
  gap:clamp(20px,3vw,56px);padding:clamp(70px,9vw,110px) clamp(24px,4vw,60px) 0;
  max-width:1560px;margin:0 auto;
}
.band-info.alt{grid-template-columns:1fr minmax(160px,320px)}
.band-info p{font-size:16px;line-height:1.7;color:#4c463c;max-width:56ch}
.facts{border-top:1px solid var(--ink);align-self:start}
.fact{
  display:flex;justify-content:space-between;gap:16px;align-items:baseline;
  padding:12px 2px;border-bottom:1px solid var(--hairline);font-size:14px;
}
.fact span{color:var(--muted)}
.fact b{font-weight:500;text-align:right}
.bigquote-wrap{
  display:grid;grid-template-columns:minmax(160px,320px) 1fr;
  gap:clamp(20px,3vw,56px);
  max-width:1560px;margin:clamp(56px,9vh,110px) auto 0;
  padding:clamp(40px,6vh,72px) clamp(24px,4vw,60px) 0;
  border-top:1px solid var(--hairline);
}
.mlabel{font-size:14px;color:var(--muted)}
blockquote{
  font-family:'Fraunces',serif;font-style:italic;font-weight:450;letter-spacing:-.015em;
  font-size:clamp(1.7rem,3.6vw,3.4rem);line-height:1.25;max-width:28ch;
}
blockquote footer{
  font-family:'DM Sans',sans-serif;font-style:normal;font-size:14px;color:var(--muted);
  margin-top:20px;
}
.quote-night{
  background:var(--night);color:var(--cream);
  padding:clamp(70px,11vh,140px) clamp(24px,4vw,60px);
  margin-top:clamp(70px,10vh,130px);
}
.quote-night blockquote{color:var(--cream);max-width:30ch;margin:0 auto}
.quote-night blockquote footer{color:#B9A9A0}

/* ——— Index rows (programs teaser, FAQ, steps) ——— */
.pindex{
  display:grid;grid-template-columns:minmax(160px,320px) 1fr;
  gap:clamp(20px,3vw,56px);margin-top:clamp(40px,7vh,72px);
}
.pindex .rows{border-top:1px solid var(--hairline)}
.pindex a{
  display:block;padding:24px 4px;border-bottom:1px solid var(--hairline);
  text-decoration:none;color:inherit;
  transition:padding-left .35s cubic-bezier(.16,1,.3,1);
}
.pindex a:hover{padding-left:16px}
.pindex a:hover .pn{color:var(--accent)}
.pn{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(1.35rem,2.1vw,1.9rem);transition:color .3s;
}
.pn i{font-style:normal;color:var(--muted);font-weight:450}
.pd{display:block;margin-top:8px;font-size:15px;line-height:1.65;color:#4c463c;max-width:66ch}

.defs{border-top:1px solid var(--ink);margin-top:clamp(36px,6vh,60px);max-width:980px}
.def{
  display:grid;grid-template-columns:minmax(150px,280px) 1fr;gap:clamp(16px,3vw,48px);
  padding:22px 2px;border-bottom:1px solid var(--hairline);
}
.def b{font-family:'Fraunces',serif;font-weight:550;font-size:clamp(1.15rem,1.7vw,1.45rem);letter-spacing:-.01em}
.def span{font-size:15px;line-height:1.65;color:#4c463c;max-width:60ch}

/* ——— Program deep entries ——— */
.plist{border-top:1px solid var(--ink);margin-top:clamp(40px,7vh,72px)}
.pentry{
  display:grid;grid-template-columns:minmax(110px,220px) 1fr;
  gap:clamp(20px,3vw,56px);padding:clamp(36px,5vh,60px) 0;
  border-bottom:1px solid var(--hairline);
}
.pentry .code{font-family:'Fraunces',serif;font-weight:450;color:var(--muted);font-size:clamp(1.1rem,1.7vw,1.6rem)}
.pentry h2{font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;font-size:clamp(1.7rem,3vw,2.8rem);line-height:1.1}
.pentry p{margin-top:16px;font-size:15px;line-height:1.7;color:#4c463c;max-width:62ch}
.pentry .facts{margin-top:24px;max-width:440px}

/* ——— Mission rows (chapter page) ——— */
.mission{display:grid;grid-template-columns:minmax(150px,280px) 1fr;gap:clamp(16px,3vw,48px);
  padding:clamp(32px,5vh,52px) 2px;border-bottom:1px solid var(--hairline)}
.mission:first-child{border-top:1px solid var(--ink)}
.mission b{font-size:14px;color:var(--muted);font-weight:400}
.mission p{font-family:'Fraunces',serif;font-weight:450;letter-spacing:-.015em;
  font-size:clamp(1.4rem,2.6vw,2.4rem);line-height:1.3;max-width:30ch}

/* ——— Chapter: manifesto ——— */
.manifesto{min-height:92vh;display:flex;align-items:center;padding:60px clamp(24px,4vw,60px) 0}
.manifesto h1{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.03em;
  font-size:clamp(3rem,8.8vw,9rem);line-height:1;
}
.manifesto h1 .line{display:block}
.manifesto h1 em{font-style:normal;color:var(--accent)}
.manifesto .sub{margin-top:32px;max-width:46ch;font-size:16px;line-height:1.7;color:#4c463c}
.conviction{padding:clamp(90px,15vh,170px) clamp(24px,4vw,60px)}
.conviction .shell{display:flex;flex-direction:column;gap:16px}
.conviction .tag{font-size:14px;color:var(--muted)}
.conviction p{
  font-family:'Fraunces',serif;font-weight:450;letter-spacing:-.02em;
  font-size:clamp(1.9rem,4.4vw,4.4rem);line-height:1.14;max-width:24ch;
}
.conviction.right .shell{align-items:flex-end;text-align:right}
.motto-stage{height:240vh;position:relative}
.motto-stage .stick{
  position:sticky;top:0;height:100vh;display:grid;place-items:center;
  padding:0 clamp(24px,4vw,60px);
}
.motto-stage .lines{display:flex;flex-direction:column;gap:.18em;text-align:center}
.motto-stage .lines span{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.03em;
  font-size:clamp(2.3rem,6.4vw,6.2rem);line-height:1.05;
  opacity:.14;transition:opacity .5s;
}
.motto-stage .lines span.on{opacity:1}
.motto-stage .lines span.mid.on{color:var(--accent)}
@media (prefers-reduced-motion:reduce){
  .motto-stage{height:auto;padding:clamp(80px,12vh,160px) 0}
  .motto-stage .stick{position:static;height:auto}
  .motto-stage .lines span{opacity:1}
  .motto-stage .lines span.mid{color:var(--accent)}
}

/* ——— Contact form ——— */
.form{display:grid;grid-template-columns:1fr 1fr;gap:30px clamp(24px,3vw,48px);
  max-width:920px;margin-top:clamp(40px,6vh,64px)}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
.field label{font-size:13px;color:var(--muted)}
.field input,.field select,.field textarea{
  font:inherit;font-size:16px;color:var(--ink);background:transparent;
  border:0;border-bottom:1px solid var(--hairline);border-radius:0;
  padding:10px 2px;outline:none;transition:border-color .3s;
  -webkit-appearance:none;appearance:none;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent)}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2331000A' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 4px center;
  padding-right:26px;cursor:pointer;
}
.field textarea{min-height:96px;resize:vertical}
.form .acts{grid-column:1/-1;margin-top:8px}
.form-note{grid-column:1/-1;font-size:13px;color:var(--muted)}

/* ——— Night footer ——— */
footer.site{
  background:var(--night);color:var(--cream);
  padding:clamp(80px,12vh,160px) clamp(24px,4vw,60px) 36px;
}
footer.site .shell{display:flex;flex-direction:column}
.motto-lines{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(1.5rem,2.8vw,2.6rem);line-height:1.3;
}
.motto-lines span{opacity:.55}
.motto-lines span.hot{opacity:1}
.convert{margin-top:clamp(48px,8vh,90px);border-top:1px solid rgba(245,237,228,.25)}
.convert a{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:clamp(22px,3.4vh,34px) 4px;border-bottom:1px solid rgba(245,237,228,.25);
  text-decoration:none;color:var(--cream);
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.02em;
  font-size:clamp(1.5rem,3.8vw,3.6rem);line-height:1.1;
  transition:padding-left .35s cubic-bezier(.16,1,.3,1);
}
.convert a .arrow{transition:transform .35s cubic-bezier(.16,1,.3,1)}
.convert a:hover{padding-left:20px}
.convert a:hover .arrow{transform:translateX(10px)}
footer.site .big{
  font-family:'Fraunces',serif;font-weight:550;letter-spacing:-.03em;
  font-size:clamp(3rem,9.4vw,10rem);line-height:.96;white-space:nowrap;
  margin-top:clamp(70px,12vh,140px);
}
footer.site .big em{font-style:normal;color:#E08D7D}
footer.site .legal{
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-top:30px;font-size:13px;color:#B9A9A0;
}

@media (max-width:980px){
  .stage{grid-template-columns:1fr;min-height:auto}
  .display{order:-1}
  .word .line{white-space:normal}
  .word{min-height:auto}
  .wordmark{white-space:normal;left:-4%}
  .stats{grid-template-columns:repeat(2,1fr)}
  .band-info,.bigquote-wrap,.pindex,.pentry,.def,.mission{grid-template-columns:1fr}
  .band-title{position:static;display:block;padding:20px clamp(24px,4vw,60px) 0}
  .band-info{padding-top:16px}
  .form{grid-template-columns:1fr}
  footer.site .big{white-space:normal}
  }
@media (max-width:700px){
  .cyc.b{display:none}
  blockquote{font-size:1.5rem}
  .bigquote-wrap{margin-top:40px;padding-top:36px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important}
  .desc,.reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
  .loader{display:none}
}