/* Layout: every view opens on a black-box "stage" band, then moves into the rehearsal "studio";
   12-column asymmetric grid; the stage-number line (8 6 4 2 0 2 4 6 8) is the recurring device. */
:root{
  --bg:#E6E4E0; --bg-raised:#DCD9D4; --bg-sunk:#D3CFC9;
  --fg:#161412; --fg-dim:#5C5650; --rule:#C3BEB7;
  --accent:#C49A2C; --accent-ink:#735A12;
  --cta-bg:#161412; --cta-fg:#F3EFE9;
  --note-bg:#F1E6C4; --note-fg:#574300; --note-line:#B08A2A;
  --stage:#0B0A09; --stage-raised:#161412; --stage-fg:#F1ECE4; --stage-dim:#9A938A; --stage-rule:#2D2925; --stage-accent:#D6AE45;
  --spot:214,174,69;
  --display:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --serif:'Lora',Georgia,'Times New Roman',serif;
  --sans:'Source Sans 3',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --gut:clamp(16px,4.2vw,64px);
  --maxw:1480px;
  --head-h:64px;
  --ease:cubic-bezier(.2,.7,.1,1);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0E0D0C; --bg-raised:#171513; --bg-sunk:#1D1B18;
    --fg:#EEEAE4; --fg-dim:#A39D95; --rule:#2E2A26;
    --accent:#D6AE45; --accent-ink:#D6AE45;
    --cta-bg:#D6AE45; --cta-fg:#0E0D0C;
    --note-bg:#2A230E; --note-fg:#F0DA98; --note-line:#9A7D2A;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0E0D0C; --bg-raised:#171513; --bg-sunk:#1D1B18;
  --fg:#EEEAE4; --fg-dim:#A39D95; --rule:#2E2A26;
  --accent:#D6AE45; --accent-ink:#D6AE45;
  --cta-bg:#D6AE45; --cta-fg:#0E0D0C;
  --note-bg:#2A230E; --note-fg:#F0DA98; --note-line:#9A7D2A;
  color-scheme:dark;
}

[hidden]{display:none!important}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head-h) + env(safe-area-inset-top,0px) + 16px)}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:1.0625rem;line-height:1.6;font-weight:300;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;text-rendering:optimizeLegibility}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:inherit;text-wrap:balance;overflow-wrap:break-word;hyphens:auto}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
[tabindex="-1"]:focus,[tabindex="-1"]:focus-visible{outline:none}
.stage :focus-visible{outline-color:var(--stage-accent)}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-left:max(var(--gut),env(safe-area-inset-left,0px));padding-right:max(var(--gut),env(safe-area-inset-right,0px))}

/* ---------- type ---------- */
.display{font-family:var(--display);text-transform:uppercase;line-height:0.98;letter-spacing:.01em;font-weight:300}
.kicker{font-family:var(--sans);font-size:.75rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);margin:0 0 1rem;display:flex;align-items:center;gap:.6em}
.stage .kicker{color:var(--stage-dim)}
.kicker .spike{width:14px;height:10px;color:var(--accent)}
.stage .kicker .spike{color:var(--stage-accent)}
.role{font-family:var(--serif);font-style:normal;font-weight:400;letter-spacing:0}
.lede{font-size:clamp(1.125rem,1.05rem + .45vw,1.375rem);line-height:1.5;max-width:38ch;font-weight:300}
.measure{max-width:64ch}
h2.sec-title{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2.6rem,1.6rem + 4.4vw,5.6rem);line-height:0.98;letter-spacing:.01em}
h3{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.6rem,1.3rem + 1vw,2.2rem);line-height:1.04;letter-spacing:.01em}
.small{font-size:.875rem;line-height:1.5}
.dim{color:var(--fg-dim)}
.stage .dim{color:var(--stage-dim)}
.tnum{font-variant-numeric:tabular-nums}

/* spike mark (stage spike tape) */
.spike{display:inline-block;width:16px;height:12px;flex:none;color:var(--accent)}

/* ---------- buttons / links ---------- */
.btn{display:inline-flex;align-items:center;gap:.55em;min-height:46px;padding:.7em 1.15em .72em;border:1px solid currentColor;border-radius:999px;font-weight:600;font-size:.9375rem;letter-spacing:.01em;text-decoration:none;background:transparent;line-height:1;transition:background-color .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease)}
.btn:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
.btn-cta{background:var(--cta-bg);color:var(--cta-fg);border-color:var(--cta-bg)}
.btn-cta:hover{background:color-mix(in srgb,var(--cta-bg) 86%,var(--bg))}
.stage .btn-cta,.btn-cta.on-dark{background:var(--stage-accent);color:#0E0D0C;border-color:var(--stage-accent)}
.stage .btn-cta:hover{background:#F6BA62;border-color:#F6BA62}
.btn .arr{transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(3px)}
.btn-row{display:flex;flex-wrap:wrap;gap:.75rem}
.link{color:var(--accent-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.stage .link{color:var(--stage-accent)}
.link:hover{text-decoration-thickness:2px}
.ext::after{content:"↗";display:inline-block;margin-left:.2em;font-size:.85em;transform:translateY(-.05em)}


/* ---------- header ---------- */
.head{position:fixed;inset:0 0 auto;z-index:50;padding-top:env(safe-area-inset-top,0px);color:var(--fg);background:color-mix(in srgb,var(--bg) 90%,transparent);-webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);border-bottom:1px solid var(--rule);transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.head.on-stage{background:transparent;color:var(--stage-fg);border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.head.on-stage::before{content:"";position:absolute;inset:0 0 -24px;background:linear-gradient(rgba(11,10,9,.72),rgba(11,10,9,0));pointer-events:none;z-index:-1}
.head.on-stage.scrolled{background:rgba(11,10,9,.82);-webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);border-color:var(--stage-rule)}
.head.on-stage.scrolled::before{opacity:0}
.head-row{display:flex;align-items:center;gap:1.25rem;height:var(--head-h)}
.brand{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--display);font-weight:500;font-size:clamp(1.05rem,.85rem + .9vw,1.3rem);min-width:0;letter-spacing:.06em;text-transform:uppercase;line-height:1;margin-right:auto;white-space:nowrap}
.brand .spike{color:var(--accent);width:15px}
.brand span{overflow:hidden;text-overflow:clip}
.head.on-stage .brand .spike{color:var(--stage-accent)}
.nav{display:flex;gap:clamp(.9rem,1.8vw,2rem);align-items:center}
.nav a{position:relative;text-decoration:none;font-size:.9375rem;font-weight:500;padding:.5rem 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:.2rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav a[aria-current="page"]{font-weight:600}
.head .btn-cta{min-height:40px;padding:.55em 1em .58em}
.head.on-stage .btn-cta{background:var(--stage-accent);color:#0E0D0C;border-color:var(--stage-accent)}
.menu-btn{display:none;align-items:center;gap:.5rem;min-height:44px;padding:0 .2rem;background:none;border:0;font-weight:600;font-size:.9375rem}
.menu-btn .bars{width:22px;height:10px;position:relative;display:inline-block}
.menu-btn .bars::before,.menu-btn .bars::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .3s var(--ease),top .3s var(--ease)}
.menu-btn .bars::before{top:1px}.menu-btn .bars::after{top:8px}
.menu-btn[aria-expanded="true"] .bars::before{top:4.5px;transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] .bars::after{top:4.5px;transform:rotate(-45deg)}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--accent);transform-origin:left;transform:scaleX(0);opacity:.9}
@media (max-width: 899px){
  .nav,.head .head-cta{display:none}
  .menu-btn{display:inline-flex}
}

/* full-screen menu (mobile) */
.menu{position:fixed;inset:0;z-index:45;background:var(--stage);color:var(--stage-fg);padding-top:calc(var(--head-h) + env(safe-area-inset-top,0px) + 12px);padding-bottom:max(24px,env(safe-area-inset-bottom,0px));overflow-y:auto;display:flex;flex-direction:column}
.menu ol{display:flex;flex-direction:column;gap:.2rem;margin-top:1rem}
.menu a.big{display:flex;align-items:baseline;gap:.9rem;text-decoration:none;font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2.8rem,13vw,5rem);line-height:1.07;padding:.12em 0;border-bottom:1px solid var(--stage-rule);letter-spacing:.01em}
.menu a.big small{font-family:var(--sans);font-size:.8rem;font-weight:500;letter-spacing:.12em;color:var(--stage-dim);text-transform:uppercase}
.menu a.big[aria-current="page"]{color:var(--stage-accent)}
.menu .menu-foot{margin-top:auto;padding-top:2rem;display:grid;gap:1rem}

/* ---------- stage band (view opener) ---------- */
.stage{background:var(--stage);color:var(--stage-fg);position:relative;isolation:isolate}
.page-head{padding-top:calc(var(--head-h) + env(safe-area-inset-top,0px) + clamp(2.5rem,7vw,6.5rem));padding-bottom:clamp(2.5rem,6vw,5rem);overflow:hidden;min-height:min(78vh,760px);display:flex;flex-direction:column;justify-content:flex-end}
.page-head .ph-media{position:absolute;inset:0 0 0 auto;width:min(56%,860px);z-index:-1}
.page-head .ph-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.62) contrast(1.06)}
.page-head .ph-media::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 55% at var(--px,58%) var(--py,36%),rgba(var(--spot),.30),rgba(var(--spot),0) 70%),linear-gradient(90deg,var(--stage) 0%,rgba(11,10,9,.55) 34%,rgba(11,10,9,0) 70%),linear-gradient(0deg,var(--stage) 0%,rgba(11,10,9,0) 40%);mix-blend-mode:normal}
.page-head .ph-media::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(48% 46% at var(--px,58%) var(--py,36%),rgba(var(--spot),.55),rgba(var(--spot),0) 72%);mix-blend-mode:color;pointer-events:none}
.page-head h1{white-space:nowrap;font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(3.5rem,1.4rem + 11.2vw,12rem);line-height:0.98;letter-spacing:.01em;margin:0 0 clamp(1.25rem,2.5vw,2rem)}
.page-head .lede{color:var(--stage-fg);max-width:44ch}
.page-head .subnav{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;margin-top:1.75rem;font-size:.875rem}
.page-head .subnav a{text-decoration:none;color:var(--stage-dim);border-bottom:1px solid var(--stage-rule);padding-bottom:.2rem}
.page-head .subnav a:hover{color:var(--stage-fg);border-color:var(--stage-fg)}
@media (max-width: 760px){
  .page-head{min-height:0}
  .page-head .ph-media{width:100%;opacity:.55}
  .page-head .ph-media::after{background:linear-gradient(0deg,var(--stage) 8%,rgba(11,10,9,.35) 60%,rgba(11,10,9,.6) 100%)}
}

/* stage-number line */
.numbers{display:grid;grid-template-columns:repeat(9,1fr);border-top:1px solid var(--stage-rule);font-family:var(--display);font-weight:500;font-size:.8rem;letter-spacing:.08em;color:var(--stage-dim);line-height:1}
.numbers li{position:relative;text-align:center;padding-top:.7rem}
.numbers li::before{content:"";position:absolute;top:-1px;left:50%;width:1px;height:7px;background:currentColor;opacity:.7}
.numbers li.c{color:var(--stage-fg)}
.foot .numbers{border-color:var(--rule);color:var(--fg-dim)}
.foot .numbers li.c{color:var(--fg)}

/* ---------- sections (studio) ---------- */
.section{padding-block:clamp(4rem,9vw,8.5rem)}
.section + .section{padding-top:0}
.sec-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem clamp(1rem,2vw,2rem);align-items:end;margin-bottom:clamp(2rem,4.5vw,3.75rem)}
.sec-head > :first-child{grid-column:1 / span 7}
.sec-head > .sec-aside{grid-column:8 / -1;color:var(--fg-dim);max-width:46ch}
@media (max-width: 900px){.sec-head > :first-child,.sec-head > .sec-aside{grid-column:1 / -1}}
.rule-top{border-top:1px solid var(--rule);padding-top:1.25rem}

/* ---------- HOME HERO ---------- */
.hero{overflow:hidden;--sx:74%;--sy:36%;--mx:52%;--my:34%;--sr:0px;--dim:.5}
.hero-media{position:absolute;top:0;right:0;bottom:0;width:min(56vw,980px);z-index:-1}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.hero-media .base{filter:grayscale(1) brightness(var(--dim)) contrast(1.08)}
.hero-media .lit{filter:grayscale(1) brightness(1.06) contrast(1.06);-webkit-mask-image:radial-gradient(circle var(--sr) at var(--mx) var(--my),#000 0,#000 34%,transparent 72%);mask-image:radial-gradient(circle var(--sr) at var(--mx) var(--my),#000 0,#000 34%,transparent 72%)}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--stage) 0%,rgba(11,10,9,.8) 14%,rgba(11,10,9,0) 46%),linear-gradient(0deg,var(--stage) 0%,rgba(11,10,9,0) 32%)}
.hero-haze{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle calc(var(--sr) * 1.25) at var(--sx) var(--sy),rgba(var(--spot),.58),rgba(var(--spot),.12) 46%,rgba(var(--spot),0) 72%);mix-blend-mode:color}
.hero-inner{position:relative;z-index:1;padding-top:calc(var(--head-h) + env(safe-area-inset-top,0px) + clamp(3rem,10vh,8rem));display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(1rem,2vw,2rem)}
.hero-copy{grid-column:1 / -1}
.hero-name{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(4.2rem,1rem + 14.6vw,15.5rem);line-height:0.98;letter-spacing:.01em;margin:.15em 0 0;color:var(--stage-fg)}
.hero-name span{display:block;white-space:nowrap}
.hero-name .l2{padding-left:.42em}
.hero-name .l2 em{font-family:var(--serif);font-style:normal;font-weight:400;text-transform:none;font-size:.2em;letter-spacing:0;vertical-align:.95em;margin-left:-2.1em;margin-right:.35em;color:var(--stage-dim)}
.hero-intro{grid-column:1 / span 5;margin-top:clamp(1.75rem,3.5vw,2.75rem);max-width:42ch;font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);line-height:1.55;color:var(--stage-fg)}
.hero-actions{grid-column:1 / span 6;display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}
.hero-actions .btn:not(.btn-cta){color:var(--stage-fg)}

/* reel window */
.reel-win{position:absolute;z-index:3;right:max(var(--gut),env(safe-area-inset-right,0px));bottom:calc(100% + 1.25rem);width:clamp(220px,20vw,300px);background:var(--stage-raised);border:1px solid var(--stage-rule);border-radius:6px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.reel-win video{width:100%;aspect-ratio:16/9;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.reel-win .rw-bar{display:flex;align-items:center;gap:.5rem;padding:.5rem .55rem .55rem .75rem;font-size:.8125rem}
.reel-win .rw-bar b{font-family:var(--display);font-weight:500;letter-spacing:.06em;text-transform:uppercase;font-size:.95rem}
.reel-win .rw-bar .dim{margin-right:auto}
.icon-btn{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--stage-rule);background:transparent;color:var(--stage-fg)}
.icon-btn:hover{border-color:var(--stage-fg)}
.icon-btn svg{width:14px;height:14px}
.rw-play{position:absolute;inset:0 0 auto;aspect-ratio:16/9;display:grid;place-items:center;background:transparent;border:0;color:var(--stage-fg)}
.rw-play span{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .8rem;border-radius:999px;background:rgba(11,10,9,.72);font-size:.8125rem;font-weight:600;opacity:0;transform:translateY(4px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.rw-play:hover span,.rw-play:focus-visible span{opacity:1;transform:none}

/* routes on the stage line */
.routes{position:relative;z-index:2;margin-top:clamp(3rem,8vw,6.5rem);padding-bottom:clamp(1.5rem,3vw,2.5rem)}
.routes-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.75rem,1.6vw,1.5rem);margin-top:1.25rem}
.route{container-type:inline-size;position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(200px,24vw,320px);padding:1.25rem 1.25rem 1.2rem;text-decoration:none;color:var(--stage-fg);border-radius:4px;overflow:hidden;isolation:isolate;background:var(--stage-raised)}
.route img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:grayscale(1) brightness(.5) contrast(1.08);transform:scale(1.02);transition:filter .7s var(--ease),transform 1.2s var(--ease)}
.route::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(11,10,9,.92) 0%,rgba(11,10,9,.2) 62%,rgba(11,10,9,.05)),radial-gradient(70% 60% at 50% 30%,rgba(var(--spot),0),rgba(var(--spot),0));transition:background .6s var(--ease)}
.route:hover img,.route:focus-visible img{filter:grayscale(.15) brightness(.78) contrast(1.05) sepia(.18);transform:scale(1.06)}
.route:hover::before,.route:focus-visible::before{background:linear-gradient(0deg,rgba(11,10,9,.9) 0%,rgba(11,10,9,.12) 62%,rgba(11,10,9,0)),radial-gradient(70% 60% at 50% 30%,rgba(var(--spot),.24),rgba(var(--spot),0) 72%)}
.route .spike{position:absolute;top:1.1rem;left:1.25rem;color:var(--stage-accent);width:18px;height:13px}
.route .r-pos{position:absolute;top:1.05rem;right:1.25rem;font-family:var(--display);font-size:.85rem;letter-spacing:.12em;color:var(--stage-dim);text-transform:uppercase;font-weight:500}
.route .r-title{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.7rem,13.5cqi,3.6rem);line-height:0.98;display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem;letter-spacing:.01em}
.route .r-title .arr{font-family:var(--sans);font-weight:300;font-size:.5em;transform:translateY(-.1em);transition:transform .35s var(--ease)}
.route:hover .r-title .arr{transform:translate(4px,-.1em)}
.route .r-desc{margin-top:.55rem;font-size:.9375rem;color:var(--stage-dim);max-width:30ch}
.route:hover .r-desc{color:var(--stage-fg)}
@media (max-width: 760px){
  .routes-row{grid-template-columns:1fr}
  .route{min-height:150px}
  .numbers.hide-sm{display:none}
}

/* hero responsive */
@media (max-width: 899px){
  .hero{padding-top:0}
  .hero-media{position:relative;width:100%;height:auto;aspect-ratio:4/4.3;inset:auto;margin-bottom:-38vw}
  .hero-media::after{background:linear-gradient(0deg,var(--stage) 4%,rgba(11,10,9,.25) 46%,rgba(11,10,9,.15) 80%,rgba(11,10,9,.65) 100%)}
  .hero-inner{padding-top:0}
  .hero-copy,.hero-intro,.hero-actions{grid-column:1 / -1}
  .hero-name .l2{padding-left:.18em}
  .reel-win{position:relative;right:auto;bottom:auto;width:100%;max-width:420px;margin:2rem 0 0}
  .reel-holder{grid-column:1 / -1}
}
@media (min-width: 900px){
  .reel-holder{position:absolute;inset:auto 0 0 0;height:0}
}

/* ---------- home: selected work ---------- */
.worklist{border-top:1px solid var(--rule)}
.worklist li{border-bottom:1px solid var(--rule)}
.worklist a{display:grid;grid-template-columns:5.5rem minmax(0,1.25fr) minmax(0,1fr) minmax(0,.8fr) 2rem;gap:1rem;align-items:baseline;padding:1.15rem 0 1.05rem;text-decoration:none;transition:padding .45s var(--ease),background-color .45s var(--ease)}
.worklist .w-year{font-family:var(--display);font-weight:500;font-size:1.05rem;letter-spacing:.04em;color:var(--fg-dim)}
.worklist .w-title{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.65rem,1.1rem + 1.7vw,2.75rem);line-height:1.02;letter-spacing:.01em}
.worklist .w-role{font-family:var(--serif);font-style:normal;font-size:1.05rem;line-height:1.35}
.worklist .w-meta{font-size:.875rem;color:var(--fg-dim);line-height:1.4}
.worklist .w-tag{display:inline-block;margin-top:.35rem;font-size:.6875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}
.worklist .w-arr{justify-self:end;font-size:1.1rem;color:var(--fg-dim);transition:transform .35s var(--ease),color .35s}
.worklist a:hover{padding-left:.75rem;padding-right:.25rem;background:var(--bg-raised)}
.worklist a:hover .w-arr{transform:translateX(3px);color:var(--fg)}
.worklist .w-thumb{display:none}
@media (max-width: 760px){
  .worklist a{grid-template-columns:4.2rem minmax(0,1fr);row-gap:.35rem}
  .worklist .w-title,.worklist .w-role,.worklist .w-meta{grid-column:2}
  .worklist .w-year{grid-row:1}
  .worklist .w-arr{display:none}
}
.peek{position:fixed;left:0;top:0;z-index:40;width:clamp(220px,20vw,300px);aspect-ratio:4/3;pointer-events:none;border-radius:4px;overflow:hidden;opacity:0;transform:translate3d(-999px,-999px,0) scale(.96);transition:opacity .3s var(--ease);box-shadow:0 20px 50px rgba(0,0,0,.35);background:var(--stage)}
.peek.on{opacity:1}
.peek img{width:100%;height:100%;object-fit:cover}

/* about teaser */
.teaser{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem);align-items:center}
.teaser figure{grid-column:1 / span 5;margin:0;position:relative;overflow:hidden;border-radius:4px}
.teaser figure img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px}
.teaser .t-copy{grid-column:7 / -1}
.teaser blockquote{margin:0 0 1.75rem;font-family:var(--serif);font-style:normal;font-size:clamp(1.6rem,1.1rem + 1.7vw,2.6rem);line-height:1.18;letter-spacing:-.01em;max-width:24ch}
@media (max-width: 860px){.teaser figure,.teaser .t-copy{grid-column:1 / -1}.teaser figure{max-width:440px}}

/* curtain call (enquiry band) */
.curtain{padding-block:clamp(4.5rem,10vw,9rem);overflow:hidden}
.curtain h2{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(3rem,1.2rem + 7.6vw,8.5rem);line-height:0.98;max-width:12ch;letter-spacing:.01em}
.curtain .cc-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.75rem,1.5vw,1.25rem);margin-top:clamp(2.25rem,4vw,3.5rem)}
.cc{display:flex;flex-direction:column;gap:.4rem;padding:1.25rem 1.25rem 1.15rem;border:1px solid var(--stage-rule);border-radius:4px;text-decoration:none;color:var(--stage-fg);background:transparent;text-align:left;transition:border-color .3s var(--ease),background-color .3s var(--ease)}
.cc:hover{border-color:var(--stage-accent);background:rgba(var(--spot),.06)}
.cc b{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.6rem,1.2rem + 1vw,2.2rem);line-height:1.02;display:flex;justify-content:space-between;align-items:flex-end;gap:.5rem;letter-spacing:.01em}
.cc span{color:var(--stage-dim);font-size:.9375rem}
.curtain .direct{margin-top:1.75rem;color:var(--stage-dim);font-size:.9375rem}
@media (max-width: 760px){.curtain .cc-row{grid-template-columns:1fr}}

/* ---------- video player ---------- */
.reel-band{padding-block:clamp(2.5rem,6vw,5rem) clamp(3rem,7vw,6rem)}
.player{margin:0}
.player-frame{position:relative;aspect-ratio:16/9;background:#000;border-radius:4px;overflow:hidden}
.player video{width:100%;height:100%;object-fit:contain;background:#000}
.player-play{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-start;padding:clamp(1rem,3vw,2rem);border:0;background:linear-gradient(0deg,rgba(11,10,9,.75),rgba(11,10,9,0) 55%);color:var(--stage-fg);text-align:left}
.player-play .pp-in{display:flex;align-items:center;gap:1rem}
.player-play .disc{display:grid;place-items:center;width:clamp(56px,7vw,84px);height:clamp(56px,7vw,84px);border-radius:50%;background:var(--stage-accent);color:#0E0D0C;transition:transform .35s var(--ease)}
.player-play .disc svg{width:30%;height:30%;margin-left:6%}
.player-play:hover .disc{transform:scale(1.06)}
.player-play b{display:block;font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(1.5rem,1rem + 1.6vw,2.6rem);line-height:1.02;letter-spacing:.01em}
.player-play small{display:block;margin-top:.3rem;font-size:.875rem;color:var(--stage-dim)}
.player figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;margin-top:1rem;font-size:.875rem;color:var(--stage-dim)}
.player figcaption a{color:var(--stage-fg)}

/* ---------- performance ---------- */
.glance{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;margin-top:2.25rem;border-top:1px solid var(--stage-rule)}
.glance div{padding:.9rem 1rem .9rem 0;border-bottom:1px solid var(--stage-rule)}
.glance dt{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--stage-dim);margin-bottom:.25rem}
.glance dd{margin:0;font-family:var(--display);font-weight:500;font-size:1.45rem;letter-spacing:.02em;line-height:1.05;text-transform:uppercase}
.glance dd .small{font-family:var(--sans);text-transform:none;font-weight:300;font-size:.8125rem;letter-spacing:0;color:var(--stage-dim);display:block;margin-top:.2rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.chip{min-height:38px;padding:.4rem .95rem;border-radius:999px;border:1px solid var(--rule);background:transparent;font-size:.875rem;font-weight:500;color:var(--fg)}
.chip:hover{border-color:var(--fg)}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.chip .n{opacity:.6;margin-left:.35em;font-variant-numeric:tabular-nums}
.credits{width:100%;border-collapse:collapse}
.credits caption{text-align:left}
.credits th{text-align:left;font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);padding:.6rem 1rem .6rem 0;border-bottom:1px solid var(--fg)}
.credits td{padding:.95rem 1rem .9rem 0;border-bottom:1px solid var(--rule);vertical-align:baseline}
.credits td:first-child{width:38%}
.credits .c-prod{font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:clamp(1.2rem,1rem + .55vw,1.55rem);line-height:1.07;letter-spacing:.005em}
.credits .c-prod small{display:block;margin-top:.3rem;font-family:var(--sans);font-weight:500;text-transform:none;font-size:.75rem;letter-spacing:.06em;color:var(--fg-dim)}
.credits .c-role{font-family:var(--serif);font-style:normal;font-size:1.05rem;line-height:1.3}
.credits .c-co,.credits .c-dir{font-size:.9rem;color:var(--fg-dim);line-height:1.4}
.credits tr.cat td{padding-top:2.25rem;border-bottom:1px solid var(--fg)}
.credits tr.cat td{font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}
@media (max-width: 760px){
  .credits thead{display:none}
  .credits tr:not(.cat){display:grid;grid-template-columns:1fr;padding:.85rem 0;border-bottom:1px solid var(--rule)}
  .credits td{border:0;padding:.08rem 0;width:auto!important}
  .credits tr.cat{display:block}
  .credits tr.cat td{display:block}
}
.stills{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.6rem,1.2vw,1rem)}
.still{margin:0;position:relative;grid-column:span 4;min-width:0}
.still.w4{grid-column:span 4}.still.w5{grid-column:span 5}.still.w7{grid-column:span 7}.still.w3{grid-column:span 3}.still.w6{grid-column:span 6}.still.w8{grid-column:span 8}
.still button{display:block;width:100%;padding:0;border:0;background:var(--bg-sunk);border-radius:3px;overflow:hidden;cursor:zoom-in}
.still img{width:100%;height:100%;object-fit:cover;aspect-ratio:var(--ar,4/3);transition:transform 1s var(--ease),filter .6s var(--ease)}
.still button:hover img{transform:scale(1.03)}
.still figcaption{display:flex;justify-content:space-between;gap:1rem;margin-top:.5rem;font-size:.8125rem;color:var(--fg-dim);line-height:1.35}
.still figcaption b{font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.03em;font-size:.95rem;color:var(--fg)}
@media (max-width: 760px){.still,.still.w5,.still.w7,.still.w3,.still.w6,.still.w8{grid-column:span 12}.still.half-sm{grid-column:span 6}}
.heads{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.6rem,1.2vw,1rem)}
.heads figure{margin:0}
.heads button{overflow:hidden;border-radius:3px}
.heads img{width:100%;aspect-ratio:4/5;object-fit:cover}
.heads figcaption{margin-top:.5rem;font-size:.8125rem;color:var(--fg-dim)}
@media (max-width: 760px){.heads{grid-template-columns:repeat(2,minmax(0,1fr))}}
.reps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem)}
.rep{padding:1.5rem 1.5rem 1.4rem;border:1px solid var(--rule);border-radius:4px;background:var(--bg-raised)}
.rep h3{margin-bottom:.4rem}
.rep .where{font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:.9rem;display:block}
.rep ul{display:grid;gap:.25rem;font-size:.9375rem}
@media (max-width: 760px){.reps{grid-template-columns:1fr}}

/* ---------- choreography ---------- */
.approach{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem)}
.approach .a-quote{grid-column:1 / span 6;font-family:var(--serif);font-style:normal;font-size:clamp(1.9rem,1.2rem + 2.4vw,3.4rem);line-height:1.08;letter-spacing:-.012em;margin:0}
.approach .a-quote::before{content:"";display:block;width:3.5rem;height:1px;background:var(--accent);margin-bottom:1.5rem}
.approach .a-text{grid-column:8 / -1}
@media (max-width: 900px){.approach .a-quote,.approach .a-text{grid-column:1 / -1}}
.projects{display:grid;gap:clamp(3.5rem,8vw,7rem)}
.project{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2.5rem);align-items:start;scroll-margin-top:calc(var(--head-h) + 24px)}
.project .p-media{grid-column:1 / span 7;position:relative;margin:0}
.project .p-frame{overflow:hidden;border-radius:4px}
.project .p-media img{width:100%;aspect-ratio:3/2;object-fit:cover}
.project .p-media .p-year{position:absolute;left:-.04em;bottom:-.3em;font-family:var(--display);font-weight:300;font-size:clamp(4rem,2rem + 7vw,9rem);line-height:0.98;color:var(--bg);-webkit-text-stroke:1px var(--fg);text-shadow:none;pointer-events:none;letter-spacing:.01em}
.project .p-body{grid-column:9 / -1;padding-top:.25rem}
.project:nth-child(even) .p-media{grid-column:6 / -1;grid-row:1}
.project:nth-child(even) .p-body{grid-column:1 / span 4;grid-row:1}
.project:nth-child(even) .p-media .p-year{left:auto;right:-.02em}
.project .p-kind{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:.75rem;display:block}
.project h3{font-size:clamp(2.1rem,1.4rem + 2.2vw,3.6rem);line-height:.86;margin-bottom:.6rem}
.project .p-role{font-family:var(--serif);font-style:normal;font-size:1.2rem;line-height:1.3;margin-bottom:1rem}
.project dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;margin:0 0 1.1rem;font-size:.9rem;border-top:1px solid var(--rule);padding-top:.9rem}
.project dt{color:var(--fg-dim)}
.project dd{margin:0}
.project .p-desc{color:var(--fg);font-size:1rem;margin-bottom:1rem}
.project .p-links{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;font-size:.9375rem}
.project .p-media.empty{aspect-ratio:3/2;border:1px dashed var(--rule);border-radius:4px;display:grid;place-items:center;background:var(--bg-raised)}
.project .p-media.empty .ghost{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2rem,1rem + 3vw,4rem);color:var(--rule);text-align:center;line-height:1.02;padding:1rem;letter-spacing:.01em}
@media (max-width: 900px){
  .project .p-media,.project .p-body,.project:nth-child(even) .p-media,.project:nth-child(even) .p-body{grid-column:1 / -1;grid-row:auto}
  .project .p-media .p-year,.project:nth-child(even) .p-media .p-year{font-size:clamp(3.6rem,18vw,6rem);left:.1em;right:auto}
}
.more-credits{columns:2 22rem;column-gap:clamp(2rem,4vw,4rem)}
.more-credits li{break-inside:avoid;padding:.75rem 0;border-bottom:1px solid var(--rule);display:grid;gap:.1rem}
.more-credits b{font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:1.2rem;letter-spacing:.01em;line-height:1}
.more-credits .role{font-size:1rem}
.more-credits span.dim{font-size:.875rem}

/* ---------- teaching ---------- */
.teach-intro{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem)}
.teach-intro > div:first-child{grid-column:1 / span 6}
.teach-intro > div:last-child{grid-column:8 / -1}
@media (max-width: 900px){.teach-intro > div{grid-column:1 / -1!important}}
.styles{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.25rem 0 1.75rem}
.styles li{padding:.45rem .9rem .5rem;border:1px solid var(--rule);border-radius:999px;font-size:.9rem;font-weight:500}
.styles li.lead{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.countin{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--fg)}
.countin li{padding:1.25rem 1.25rem 1.5rem 0;border-right:1px solid var(--rule)}
.countin li:last-child{border-right:0;padding-right:0}
.countin .cnt{display:block;font-family:var(--display);font-weight:300;font-size:clamp(3.6rem,2rem + 4.8vw,6.5rem);line-height:0.98;margin-bottom:.9rem;color:var(--fg);letter-spacing:.01em}
.countin li:last-child .cnt{color:var(--accent-ink)}
.countin .cnt small{font-size:.32em;font-weight:600;letter-spacing:.08em;vertical-align:.9em;margin-right:.2em;color:var(--fg-dim)}
.countin b{display:block;font-weight:600;margin-bottom:.3rem}
.countin p{font-size:.9375rem;color:var(--fg-dim);margin:0}
@media (max-width: 900px){.countin{grid-template-columns:repeat(2,minmax(0,1fr))}.countin li{border-right:0;border-bottom:1px solid var(--rule);padding-right:1rem}.countin li:last-child{grid-column:1 / -1}}
.offers{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.9rem,1.6vw,1.25rem)}
.offer{display:flex;flex-direction:column;padding:clamp(1.25rem,2.4vw,2rem);border:1px solid var(--rule);border-radius:4px;background:var(--bg-raised)}
.offer.big{grid-column:1 / span 7;grid-row:span 2;background:var(--stage);color:var(--stage-fg);border-color:var(--stage)}
.offer.big .dim{color:var(--stage-dim)}
.offer:not(.big){grid-column:8 / -1}
.offer h3{margin-bottom:.6rem}
.offer .o-kind{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:.75rem;display:block}
.offer.big .o-kind{color:var(--stage-accent)}
.offer > p{max-width:48ch}
.offer .o-foot{margin-top:auto;padding-top:1.1rem}
.sessions{margin:1.25rem 0 1.25rem;border-top:1px solid var(--stage-rule)}
.sessions li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:.5rem 1rem;align-items:center;padding:.95rem 0;border-bottom:1px solid var(--stage-rule)}
.sessions .s-name{font-weight:600}
.sessions .s-name small{display:block;font-weight:300;color:var(--stage-dim);font-size:.85rem;margin-top:.1rem}
.sessions .s-price{font-family:var(--display);font-weight:500;font-size:1.8rem;line-height:1;letter-spacing:.01em}
.sessions .s-price small{font-family:var(--sans);font-size:.75rem;font-weight:500;color:var(--stage-dim);margin-left:.2rem}
.sessions .btn{min-height:40px;padding:.5em .95em .55em;font-size:.875rem;color:var(--stage-fg)}
@media (max-width: 900px){.offer.big,.offer:not(.big){grid-column:1 / -1;grid-row:auto}}
@media (max-width: 520px){.sessions li{grid-template-columns:1fr auto}.sessions .btn{grid-column:1 / -1;justify-self:start}}
.venues{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2.5rem)}
.venues h3{font-size:1.35rem;margin-bottom:.75rem;padding-bottom:.6rem;border-bottom:1px solid var(--fg)}
.venues li{padding:.55rem 0;border-bottom:1px solid var(--rule);display:grid;gap:.1rem}
.venues li b{font-weight:600;font-size:.98rem;line-height:1.3}
.venues li span{font-size:.8125rem;color:var(--fg-dim)}
@media (max-width: 1000px){.venues{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 560px){.venues{grid-template-columns:1fr}}
.policy{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem;border-top:1px solid var(--rule);padding-top:1.5rem}
.policy h3{grid-column:1 / span 4;font-size:1.35rem}
.policy p{grid-column:5 / span 7;margin:0;color:var(--fg-dim)}
@media (max-width: 760px){.policy h3,.policy p{grid-column:1 / -1}}

/* ---------- about ---------- */
.bio{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem)}
.bio .b-text{grid-column:1 / span 7}
.bio .b-text .first,.bio .bio-copy > p:first-child{font-family:var(--serif);font-style:normal;font-size:clamp(1.7rem,1.2rem + 1.6vw,2.6rem);line-height:1.15;letter-spacing:-.012em;margin-bottom:1.75rem;max-width:26ch}
.bio .b-side{grid-column:9 / -1;display:grid;gap:1rem;align-content:start}
.bio .b-side img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px}
.bio .b-side figure{margin:0;overflow:hidden;border-radius:4px}
.bio .b-side figcaption{font-size:.8125rem;color:var(--fg-dim);margin-top:.45rem}
@media (max-width: 900px){.bio .b-text,.bio .b-side{grid-column:1 / -1}.bio .b-side{grid-template-columns:1fr 1fr}}
.cities{overflow:hidden;padding-block:clamp(2rem,4vw,3rem);border-block:1px solid var(--rule)}
.cities p{margin:0;font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2.4rem,1rem + 6vw,6.5rem);line-height:1.02;white-space:nowrap;display:flex;gap:.35em;align-items:center;letter-spacing:.01em}
.cities p span.sep{display:inline-block;width:.18em;height:.18em;background:var(--accent);border-radius:50%;transform:translateY(-.08em)}
.cities p .home{color:var(--accent-ink)}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2vw,2rem)}
.facts div{border-top:1px solid var(--fg);padding-top:.9rem}
.facts dt{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);margin-bottom:.5rem}
.facts dd{margin:0;font-size:.98rem;line-height:1.45}
@media (max-width: 900px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 520px){.facts{grid-template-columns:1fr}}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(2rem,4vw,4rem)}
.contact-grid .form-col{grid-column:1 / span 7;min-width:0}
.contact-grid aside{grid-column:9 / -1;display:grid;gap:2rem;align-content:start}
@media (max-width: 900px){.contact-grid .form-col,.contact-grid aside{grid-column:1 / -1}}
fieldset{border:0;margin:0 0 1.75rem;padding:0;min-width:0}
legend{font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);margin-bottom:.9rem;padding:0}
.types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.type{position:relative}
.type input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.type label{display:flex;flex-direction:column;gap:.25rem;height:100%;padding:1rem 1rem .95rem;border:1px solid var(--rule);border-radius:4px;background:var(--bg-raised);cursor:pointer;transition:border-color .25s var(--ease),background-color .25s var(--ease)}
.type label b{font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:1.45rem;line-height:1.07;display:flex;align-items:center;gap:.5rem}
.type label b .spike{display:none}
.type label span{font-size:.8125rem;color:var(--fg-dim);line-height:1.4}
.type input:checked + label{border-color:var(--fg);background:var(--bg);box-shadow:inset 0 0 0 1px var(--fg)}
.type input:checked + label b .spike{display:inline-block}
.type input:focus-visible + label{outline:2px solid var(--accent);outline-offset:3px}
@media (max-width: 640px){.types{grid-template-columns:1fr}}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1rem}
.field{display:grid;gap:.4rem}
.field.full{grid-column:1 / -1}
.field label{font-size:.875rem;font-weight:600}
.field label .opt{font-weight:300;color:var(--fg-dim)}
.field input,.field textarea{width:100%;min-height:48px;padding:.7rem .85rem;border:1px solid var(--rule);border-radius:4px;background:var(--bg-raised);color:var(--fg);transition:border-color .2s}
.field textarea{min-height:150px;resize:vertical;line-height:1.5}
.field input:hover,.field textarea:hover{border-color:var(--fg-dim)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--fg);box-shadow:0 0 0 1px var(--fg)}
.field .err{font-size:.8125rem;color:#B3261E;display:none}
:root[data-theme="dark"] .field .err{color:#FF8A80}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .field .err{color:#FF8A80}}
.field.invalid input,.field.invalid textarea{border-color:#B3261E}
.field.invalid .err{display:block}
@media (max-width: 640px){.fields{grid-template-columns:1fr}}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-top:1.75rem}
.form-foot p{margin:0;font-size:.8125rem;color:var(--fg-dim);max-width:40ch}
.sent{padding:clamp(1.5rem,3vw,2.25rem);border:1px solid var(--fg);border-radius:4px;background:var(--bg-raised)}
.sent h2{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2rem,1.4rem + 2vw,3.2rem);line-height:1.02;margin-bottom:.8rem;letter-spacing:.01em}
.contact-card h3{font-size:1.35rem;margin-bottom:.6rem;padding-bottom:.55rem;border-bottom:1px solid var(--fg)}
.contact-card ul{display:grid;gap:.3rem;font-size:.9375rem}
.contact-card .lbl{display:block;font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);margin:.9rem 0 .3rem}
.copyline{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.copy-btn{min-height:32px;padding:.2rem .65rem;border:1px solid var(--rule);border-radius:999px;background:transparent;font-size:.75rem;font-weight:600;color:var(--fg)}
.copy-btn:hover{border-color:var(--fg)}
.stage .copy-btn{border-color:var(--stage-rule);color:var(--stage-fg)}

/* ---------- footer ---------- */
.foot{padding-block:clamp(3.5rem,7vw,6rem) max(2rem,env(safe-area-inset-bottom,0px));border-top:1px solid var(--rule);background:var(--bg)}
.foot-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:2rem clamp(1rem,2vw,2rem);margin-top:2.25rem}
.foot .f-brand{grid-column:1 / span 5}
.foot .f-brand .display{font-weight:300;font-size:clamp(2.6rem,1.4rem + 4vw,5rem);letter-spacing:.01em}
.foot .f-col{grid-column:span 2}
.foot .f-col:last-child{grid-column:span 3}
.foot h2{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);margin-bottom:.75rem;font-family:var(--sans)}
.foot li{padding:.15rem 0;font-size:.9375rem}
.foot a{text-decoration:none}
.foot a:hover{text-decoration:underline;text-underline-offset:.2em}
.foot-base{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;align-items:center;justify-content:space-between;margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--rule);font-size:.8125rem;color:var(--fg-dim)}
.toggles{display:flex;flex-wrap:wrap;gap:.5rem}
.toggle{display:inline-flex;align-items:center;gap:.5rem;min-height:36px;padding:.3rem .8rem .3rem .45rem;border:1px solid var(--rule);border-radius:999px;background:transparent;font-size:.8125rem;font-weight:500;color:var(--fg)}
.toggle:hover{border-color:var(--fg)}
.toggle .knob{width:28px;height:16px;border-radius:999px;background:var(--bg-sunk);position:relative;flex:none;border:1px solid var(--rule)}
.toggle .knob::after{content:"";position:absolute;top:1px;left:1px;width:12px;height:12px;border-radius:50%;background:var(--fg-dim);transition:transform .25s var(--ease),background-color .25s}
.toggle[aria-pressed="true"] .knob::after{transform:translateX(12px);background:var(--accent)}
@media (max-width: 900px){.foot .f-brand{grid-column:1 / -1}.foot .f-col,.foot .f-col:last-child{grid-column:span 6}}

/* ---------- dialog ---------- */
dialog.lb{border:0;padding:0;margin:auto;width:min(1200px,94vw);max-height:92vh;background:transparent;color:var(--stage-fg);overflow:visible}
dialog.lb::backdrop{background:rgba(11,10,9,.9);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.lb-body{position:relative}
.lb-body img{width:auto;max-width:100%;max-height:80vh;margin:auto;border-radius:3px}
.lb-body video{width:100%;max-height:80vh;background:#000;border-radius:3px}
.lb-cap{margin-top:.8rem;font-size:.875rem;color:var(--stage-dim);text-align:center}
.lb-close{position:absolute;top:-3.2rem;right:0;display:inline-flex;align-items:center;gap:.4rem;min-height:40px;padding:0 .9rem;border-radius:999px;border:1px solid var(--stage-rule);background:var(--stage);color:var(--stage-fg);font-size:.875rem;font-weight:600}

/* views */
.view{display:block}
.view:focus{outline:none}

/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference){
  .hero.intro .hero-media .base{animation:houselights 1.6s var(--ease) both}
  @keyframes houselights{from{filter:grayscale(1) brightness(.18) contrast(1.1)}}
  .hero.intro .hero-name span{animation:rise 1.1s var(--ease) both}
  .hero.intro .hero-name .l2{animation-delay:.12s}
  @keyframes rise{from{transform:translateY(.12em);opacity:.35}}
  @supports (animation-timeline: view()){
    .settle{animation:settle linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
    @keyframes settle{from{transform:scale(1.07)}to{transform:scale(1)}}
    .drift{animation:drift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    @keyframes drift{from{transform:translateX(4%)}to{transform:translateX(-14%)}}
  }
  @supports (animation-timeline: scroll()){
    .progress{animation:prog linear both;animation-timeline:scroll(root)}
    @keyframes prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  }
  ::view-transition-old(root){animation:vt-out .32s var(--ease) both}
  ::view-transition-new(root){animation:vt-in .55s var(--ease) both}
  @keyframes vt-out{to{opacity:0}}
  @keyframes vt-in{from{opacity:0;transform:translateY(10px)}}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}
@media (hover: none){.route img{filter:grayscale(.3) brightness(.55) contrast(1.05)}}
/* ---- CMS-driven layouts ---- */
.stills:has(.still-row){display:grid;grid-template-columns:1fr;gap:clamp(1.25rem,2.4vw,2rem)}
.still-row{display:flex;gap:clamp(.6rem,1.2vw,1rem);align-items:flex-start}
.still-row .still{flex:var(--g) 1 0;grid-column:auto;min-width:0}
.still-row .still img{aspect-ratio:var(--ar)}
.still-row.solo .still{flex:0 1 auto;width:min(100%,calc(var(--ar) * 40vw));max-width:66%}
@media (max-width: 760px){.still-row{flex-direction:column;gap:1.25rem}.still-row .still,.still-row.solo .still{flex:none;width:100%;max-width:none}.still-row .still img{aspect-ratio:var(--ars)}}
.glance:empty{min-height:5.6rem}
.group-err{display:none;color:#B3261E;margin:.6rem 0 0}
fieldset.invalid .group-err{display:block}
:root[data-theme="dark"] .group-err,:root[data-theme="dark"] .form-error{color:#FF8A80}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .group-err,:root:not([data-theme="light"]) .form-error{color:#FF8A80}}
.form-error{margin:1rem 0 0;color:#B3261E;font-size:.9375rem}
.field select{width:100%;min-height:48px;padding:.7rem .85rem;border:1px solid var(--rule);border-radius:4px;background:var(--bg-raised);color:var(--fg)}
.field.check label,label.check{display:flex;gap:.6rem;align-items:center;font-weight:500}
#form-fields fieldset + .fields{margin-top:1.5rem}
.class-list{margin:1.1rem 0 0;border-top:1px solid var(--rule)}
.class-list li{display:grid;grid-template-columns:minmax(9rem,auto) minmax(0,1fr) auto;gap:.5rem 1.25rem;align-items:center;padding:.9rem 0;border-bottom:1px solid var(--rule)}
.class-list .cl-date{font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:1.15rem;line-height:1.05}
.class-list small{display:block;font-family:var(--sans);font-weight:300;text-transform:none;color:var(--fg-dim);font-size:.85rem;margin-top:.15rem}
@media (max-width: 640px){.class-list li{grid-template-columns:1fr auto}.class-list .cl-name{grid-column:1 / -1;grid-row:2}}
.project .p-media.empty .ghost{max-width:12ch}
/* ---------- playbills grid ---------- */
.pb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2.4vw,32px)}
.pb figure{margin:0}
.pb-frame{aspect-ratio:2/3;overflow:hidden;background:var(--bg-sunk);box-shadow:0 1px 0 var(--rule),0 18px 40px -24px rgba(0,0,0,.45)}
.pb-frame img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.pb:hover .pb-frame img{transform:scale(1.03)}
.pb figcaption{display:flex;flex-direction:column;gap:.15rem;padding-top:.85rem;border-top:2px solid var(--accent);margin-top:.85rem}
.pb figcaption b{font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:clamp(1.2rem,.9rem + .9vw,1.7rem);line-height:1.07}
.pb figcaption .role{font-size:1rem;line-height:1.35}
.pb .pb-where{font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-dim)}
@media (max-width: 760px){.pb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 420px){.pb-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){.pb-frame img{transition:none}.pb:hover .pb-frame img{transform:none}}
.pb-fit .pb-frame{background:#1b1430}
.pb-fit .pb-frame img{object-fit:contain}

/* ---------- Montserrat sizing (wider than the old condensed face) ---------- */
h2.sec-title{font-size:clamp(2rem,1.3rem + 2.6vw,3.9rem);line-height:1.06}
.curtain h2{font-size:clamp(2.3rem,1rem + 4.6vw,5.8rem);line-height:1.02}
.worklist .w-title{font-size:clamp(1.35rem,1rem + 1.2vw,2.2rem);line-height:1.05}
.route .r-title{font-size:clamp(1.4rem,10cqi,2.8rem);line-height:1.02}
.cc b{font-size:clamp(1.3rem,1rem + .8vw,1.8rem);line-height:1.05}
.player-play b{font-size:clamp(1.2rem,.9rem + 1.2vw,2rem);line-height:1.05}
.cities p{font-size:clamp(1.8rem,.8rem + 4.2vw,4.8rem)}
.menu a.big{font-size:clamp(1.9rem,8.5vw,4rem);line-height:1.08}
.brand{letter-spacing:.04em;font-size:clamp(.9rem,.78rem + .55vw,1.15rem);min-width:0}
.brand span{overflow:hidden;text-overflow:clip;white-space:nowrap}
@media (max-width: 420px){.brand{font-size:.82rem;letter-spacing:.02em;gap:.45rem}}

/* ---------- signature subheadings (Rafelya Carrotin) ---------- */
@font-face{font-family:'Rafelya Carrotin';src:url('fonts/rafelya-carrotin.woff?v=1') format('woff');font-weight:400;font-style:normal;font-display:swap}
.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker{display:block;font-family:'Rafelya Carrotin',var(--serif);font-weight:400;font-size:clamp(2.6rem,1.8rem + 2.6vw,4.3rem);line-height:1.15;letter-spacing:0;text-transform:none;color:var(--accent-ink);margin:0 0 .2em;padding-left:.15em;transform:rotate(-3deg);transform-origin:0 100%}
.page-head .kicker,.curtain .kicker{color:var(--stage-accent)}
.sec-head .kicker .spike,.page-head .kicker .spike,.curtain .kicker .spike,.t-copy .kicker .spike,.teach-intro .kicker .spike,.a-text .kicker .spike{display:none}

/* ---------- ALL-CAPS buttons ---------- */
.btn,.menu-btn,.copy-btn,.chip,.rw-play span,.toggle,.lb-close{text-transform:uppercase;letter-spacing:.07em}
/* script subheadings: smaller on phones so longer labels stay on one line */
@media (max-width: 560px){.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker{font-size:min(2.15rem,calc((100vw - 2 * var(--gut)) / 10.4))}}

/* ---------- white stage spotlight on the home hero ---------- */
.hero-haze{background:radial-gradient(circle calc(var(--sr) * 1.2) at var(--sx) var(--sy),rgba(255,251,242,.16),rgba(255,251,242,.05) 45%,rgba(255,251,242,0) 72%);mix-blend-mode:screen}
.hero-media .lit{filter:brightness(1.08) contrast(1.05) saturate(1.12)}

/* ---------- ALL-CAPS header tabs ---------- */
.nav a{text-transform:uppercase;letter-spacing:.08em;font-size:.82rem}

/* ---------- footer sizing (name scales to its column) ---------- */
.foot .f-brand{container-type:inline-size;min-width:0}
.foot .f-brand .display{font-size:min(4rem,12.5cqi);line-height:1.02;letter-spacing:.01em}
.foot h2{font-size:.75rem;letter-spacing:.16em}

/* ---------- dance reel turns to colour under the spotlight ---------- */
.reel-win video{filter:grayscale(calc(1 - var(--reel-lit, 0))) contrast(1.05);transition:filter .25s linear}

/* ---------- Selected work: no years, centred rows ---------- */
.worklist .w-year{display:none}
.worklist a{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.85fr) 2rem;column-gap:1.5rem;align-items:center;padding-top:1.25rem;padding-bottom:1.25rem}
.worklist .w-meta .w-tag{margin-top:.3rem}
@media (max-width: 760px){
  .worklist a{grid-template-columns:minmax(0,1fr);row-gap:.35rem;align-items:start}
  .worklist .w-title,.worklist .w-role,.worklist .w-meta{grid-column:1}
}

/* ---------- Productions carousel ---------- */
.playbills{--pb-gap:clamp(14px,2.2vw,28px)}
.playbills .pb-track{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 3 * var(--pb-gap)) / 3.4);gap:var(--pb-gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:.25rem}
.playbills .pb-track::-webkit-scrollbar{display:none}
.playbills .pb-track > li{scroll-snap-align:start}
.playbills .pb-track:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.pb-nav{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.4rem}
.pb-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--rule);background:transparent;color:var(--fg);display:grid;place-items:center;font-size:1.15rem;line-height:1;transition:border-color .25s var(--ease),color .25s var(--ease),opacity .25s var(--ease)}
.pb-btn:hover:not([disabled]){border-color:var(--accent);color:var(--accent)}
.pb-btn[disabled]{opacity:.3;cursor:default}
@media (max-width: 900px){.playbills .pb-track{grid-auto-columns:calc((100% - var(--pb-gap)) / 2.3)}}
@media (max-width: 560px){.playbills .pb-track{grid-auto-columns:76%}}

/* ---------- Productions: heading only, one-line captions ---------- */
.playbills .sec-head{grid-template-columns:1fr;margin-bottom:clamp(1.25rem,2.5vw,2rem)}
.playbills .sec-head .kicker{margin-bottom:0}
.playbills .pb{container-type:inline-size}
.playbills .pb figcaption b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:min(1.35rem,5.4cqi);line-height:1.15}
.playbills .pb .pb-where{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:min(.75rem,3.3cqi)}

@media (max-width: 560px){.playbills .sec-head .kicker{font-size:min(2.15rem,calc((100vw - 2 * var(--gut)) / 12.3));white-space:nowrap}}

/* ---------- La Cage Playbill: header + art stacked edge to edge ---------- */
.pb-frame.pb-split{display:flex;flex-direction:column}
.pb-frame.pb-split img{height:auto;transform:none!important}
.pb-frame.pb-split .pb-head{flex:none}
.pb-frame.pb-split .pb-art{flex:1 1 0;min-height:0;height:0;object-fit:cover}

.playbills .pb-black .pb-frame{background:#000}
.playbills .pb-black .pb-frame img{object-fit:contain}

.playbills .pb-white .pb-frame{background:#fff}
.playbills .pb-white .pb-frame img{object-fit:contain}


/* ---------- On Stage and Screen subtitle ---------- */
.playbills .pb-sub{font-family:var(--display);font-weight:300;text-transform:uppercase;font-size:clamp(2rem,1.3rem + 2.6vw,3.9rem);line-height:1.06;letter-spacing:.01em;margin:0}
.playbills .pb-sub{text-wrap:balance}

/* ---------- hero name: matched two-line lockup, clear of the photo on desktop ---------- */
.hero-name{line-height:.92;letter-spacing:0}
.hero-name .l2{padding-left:0;letter-spacing:.04em}
@media (min-width: 900px){.hero-copy{grid-column:1 / span 7}}
.hero-name::after{content:"";display:block;width:clamp(44px,5vw,84px);height:1px;background:var(--stage-accent,var(--accent));margin-top:clamp(1.1rem,1.6vw,1.6rem);opacity:.9}
@media (max-width: 899px){.hero-name .l2{padding-left:0}.hero-media::after{background:linear-gradient(0deg,var(--stage) 6%,rgba(11,10,9,.62) 30%,rgba(11,10,9,.12) 58%,rgba(11,10,9,.12) 80%,rgba(11,10,9,.65) 100%)}}

/* ---------- hero name: compact extended first name + "Louis" in script behind ---------- */
.hero-name{position:relative;isolation:isolate}
.hero-name .l1{font-size:.84em;letter-spacing:.12em;font-weight:280;width:max-content;transform-origin:0 50%}
.hero-name .mid{position:absolute;z-index:-1;left:60%;top:.02em;translate:-50% 0;rotate:-8deg;font-family:'Rafelya Carrotin',var(--serif);font-weight:400;text-transform:none;letter-spacing:0;font-size:1.75em;line-height:1;white-space:nowrap;color:var(--stage-accent,var(--accent));pointer-events:none}

/* ---------- "Louis" threaded through the name: tighter lines, muted gold, over/under weave ---------- */
.hero-name{line-height:.86}
.hero-name .mid,.hero-name .mid-over::before{position:absolute;left:47%;top:.15em;translate:-50% 0;rotate:-6deg;font-family:'Rafelya Carrotin',var(--serif);font-weight:400;text-transform:none;letter-spacing:0;font-size:1.18em;line-height:1;white-space:nowrap;color:#81692C;color:color-mix(in srgb,var(--stage-accent,var(--accent)) 58%,var(--stage));pointer-events:none}
.hero-name .mid{z-index:-1}
.hero-name .mid-over{position:absolute;inset:0;z-index:1;pointer-events:none;clip-path:inset(100%)}
.hero-name .mid-over::before{content:"Louis";filter:drop-shadow(0 0 .013em var(--stage)) drop-shadow(0 0 .022em var(--stage))}
.hero-name .l1,.hero-name .l2{text-shadow:0 0 .022em var(--stage),0 0 .022em var(--stage),0 0 .035em var(--stage)}

/* ---------- Highlight gold: the muted tone from "Louis", with a metallic sheen ---------- */
:root{--gold:#81692C;--gold-hi:#B99C58;--gold-lo:#5C4A1F;
  --gold-sheen:linear-gradient(172deg,var(--gold-hi) 0%,var(--gold) 52%,var(--gold-lo) 100%);
  --accent:#81692C;--accent-ink:#6B571F;--stage-accent:#81692C;--spot:129,105,44}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--accent:#81692C;--accent-ink:#8F7535;--cta-bg:#81692C;--cta-fg:#F1ECE4}}
:root[data-theme="dark"]{--accent:#81692C;--accent-ink:#8F7535;--cta-bg:#81692C;--cta-fg:#F1ECE4}
/* script headings */
.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker{color:var(--gold);background-image:var(--gold-sheen);background-size:100% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* Louis: both layers share one static metallic gradient so the weave stays identical */
.hero-name .mid,.hero-name .mid-over::before{color:var(--gold);background-image:var(--gold-sheen);background-size:100% 100%;background-position:0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:none}
.hero-name .mid-over{filter:drop-shadow(0 0 .013em var(--stage)) drop-shadow(0 0 .022em var(--stage))}
/* gold buttons */
.stage .btn-cta,.btn-cta.on-dark,.head.on-stage .btn-cta{background-color:var(--gold);background-image:var(--gold-sheen);background-size:100% 100%;background-position:0 0;border-color:var(--gold);color:#F1ECE4;transition:filter .25s var(--ease),border-color .25s var(--ease)}
.stage .btn-cta:hover,.btn-cta.on-dark:hover,.head.on-stage .btn-cta:hover{background-color:var(--gold);background-image:var(--gold-sheen);background-size:100% 100%;border-color:var(--gold-hi);filter:brightness(1.18)}
/* rule under the name */
.hero-name::after{background-color:var(--gold);background-image:linear-gradient(90deg,var(--gold-hi) 0%,var(--gold) 55%,rgba(129,105,44,.25) 100%);background-size:100% 100%}
@media (prefers-reduced-motion: reduce){.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker,.stage .btn-cta,.btn-cta.on-dark,.head.on-stage .btn-cta,.hero-name::after{animation:none}}

/* ---------- script headings: paint area padded so tall letters are not clipped by background-clip:text; margins pull it back so nothing moves ---------- */
.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker{padding:.3em .3em .45em .15em;margin:-.3em -.3em calc(.2em - .45em) 0;background-image:linear-gradient(172deg,var(--gold-hi) 12%,var(--gold) 52%,var(--gold-lo) 88%)}
.playbills .sec-head .kicker{margin-bottom:-.45em}
.hero-name .mid,.hero-name .mid-over::before{padding:.6em .4em;margin:-.6em -.4em;background-image:linear-gradient(172deg,var(--gold-hi) 22%,var(--gold) 52%,var(--gold-lo) 80%)}

/* ---------- centre line: ticks exactly centred on the digits, the gold T spike on 0, more air above the numbers ---------- */
.numbers li{padding-top:1.15rem;letter-spacing:0}
.numbers li::before{left:50%;transform:translateX(-50%);width:1px;height:9px;top:-1px;opacity:.7}
.numbers li.c::before{width:16px;height:3px;top:-2px;opacity:1;background:var(--stage-accent)}
.numbers li.c::after{content:"";position:absolute;left:50%;transform:translateX(-50%);top:1px;width:3px;height:9px;background:var(--stage-accent)}
.foot .numbers li.c::before,.foot .numbers li.c::after{background:var(--accent)}

/* ---------- hero intro: serif opener, tighter measure ---------- */
.hero-intro{max-width:46ch;font-size:clamp(1.125rem,1.02rem + .45vw,1.4rem);line-height:1.5;margin-top:clamp(1.5rem,3vw,2.5rem);text-wrap:pretty}
@media (min-width: 900px){.hero-intro{grid-column:1 / span 6}}
.hero-intro strong{display:block;font-family:var(--serif);font-weight:400;font-size:1.32em;line-height:1.25;letter-spacing:0;margin-bottom:.45em;color:var(--stage-fg)}

/* ---------- hero intro v2: Montserrat caps opener, Lora line beneath ---------- */
.hero-intro{font-family:var(--serif);font-weight:400;font-size:clamp(1.2rem,1.08rem + .5vw,1.5rem);letter-spacing:0;line-height:1.4;max-width:none;color:var(--stage-fg)}
.hero-intro strong{display:block;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(1.3rem,1.05rem + 1vw,1.9rem);line-height:1.2;letter-spacing:.09em;margin:0 0 .45em;color:var(--stage-fg);background:none;-webkit-text-fill-color:currentColor;padding:0;text-wrap:balance}

/* ---------- hero line spacing: tracked, with air between the three statements ---------- */
.hero-intro{letter-spacing:.06em}
.hero-intro em{font-style:normal;display:inline-block;margin-right:1.6em}
.hero-intro em:last-child{margin-right:0}

/* ---------- hero intro lockup: caps on one line, the three statements spread to the same width ---------- */
.hero-intro{display:grid;grid-template-columns:auto auto auto;justify-content:space-between;width:fit-content;max-width:100%;row-gap:.45em;column-gap:1.5em;letter-spacing:.06em}
.hero-intro strong{grid-column:1 / -1;white-space:nowrap;margin:0;font-size:1.28em;letter-spacing:.09em}
.hero-intro em{margin:0;white-space:nowrap}
@media (max-width: 559px){.hero-intro strong{white-space:normal;text-wrap:balance}}

/* ---------- hero intro lockup v2: flex row, statements in script spread to the caps width ---------- */
.hero-intro{display:flex;flex-wrap:wrap;justify-content:space-between;row-gap:.15em;column-gap:0;width:fit-content;max-width:100%}
.hero-intro strong{flex:0 0 100%;white-space:nowrap}
.hero-intro em{font-family:'Rafelya Carrotin',var(--serif);font-weight:400;font-size:1.55em;line-height:1.1;letter-spacing:0;color:var(--gold);background-image:linear-gradient(172deg,var(--gold-hi) 12%,var(--gold) 52%,var(--gold-lo) 88%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding:.3em .25em .4em .15em;margin:-.3em -.25em -.4em -.15em}
.hero-intro em:first-child{padding-left:0;margin-left:0}
.hero-intro em:last-child{padding-right:0;margin-right:0}

/* ---------- hero intro lockup v3: caps at full size in the name's lane, script a quarter larger tucked up behind it ---------- */
@media (min-width: 900px){.hero-intro{grid-column:1 / span 7}}
.hero-intro{display:grid;grid-template-columns:repeat(3,max-content);justify-content:space-between;column-gap:.6em;row-gap:0;align-items:start}
.hero-intro strong{grid-column:1 / -1;position:relative;z-index:1;text-shadow:0 0 .03em var(--stage),0 0 .03em var(--stage),0 0 .06em var(--stage)}
.hero-intro em{font-size:1.88em;margin-top:-.42em;opacity:.88;background-image:linear-gradient(172deg,var(--gold-hi) 0%,var(--gold) 45%,var(--gold-lo) 100%)}
.hero-intro em:first-child{margin-left:0}
.hero-intro em:last-child{margin-right:0}
@media (max-width: 559px){
  .hero-intro{grid-template-columns:1fr;justify-items:start}
  .hero-intro strong{white-space:normal;text-wrap:balance}
  .hero-intro em{font-size:1.7em;margin-top:-.3em}
  .hero-intro em + em{margin-top:-.55em}
}

/* ---------- hero intro lockup v4: doubled script initials rising through the caps, words seated beneath ---------- */
.hero-intro{column-gap:.5em}
.hero-intro strong{font-size:1.4em}
.hero-intro em{font-size:1.64em;margin-top:.04em;opacity:.92;line-height:1.1}
.hero-intro em::first-letter{font-size:2.1em;line-height:0}
@media (max-width: 559px){
  .hero-intro em{font-size:1.5em;margin-top:.1em}
  .hero-intro em + em{margin-top:-.2em}
  .hero-intro em::first-letter{font-size:1.9em}
}

/* ---------- hero intro lockup v5: initials cut through the top of the caps; words nest beneath; rule retired ---------- */
.hero-name::after{display:none}
.hero-intro{margin-top:clamp(1.9rem,3.4vw,2.9rem)}
.hero-intro em{font-size:1.6em;margin-top:-.6em}
.hero-intro em::first-letter{font-size:2.05em}
@media (max-width: 559px){
  .hero-intro em{font-size:1.5em;margin-top:-.15em}
  .hero-intro em + em{margin-top:-.35em}
  .hero-intro em::first-letter{font-size:1.8em}
}

/* ---------- hero intro, phones: stacked statements with a modest initial, no overlap ---------- */
@media (max-width: 559px){
  .hero-intro em{font-size:1.5em;margin-top:-.1em;line-height:1.15}
  .hero-intro em + em{margin-top:-.05em}
  .hero-intro em::first-letter{font-size:1.35em;line-height:0}
}

/* ---------- hero intro lockup v6: initials to the name's baseline; statements hidden until the spotlight lifts them forward ---------- */
.hero-name{z-index:2}
.hero-intro{position:relative;z-index:1}
.hero-intro em{font-size:1.5em;margin-top:-.62em;opacity:calc(.05 + .87*var(--lit,1));transform:translateY(calc((1 - var(--lit,1))*.3em));transition:opacity .25s linear,transform .4s var(--ease);will-change:opacity,transform}
.hero-intro em::first-letter{font-size:2.7em;letter-spacing:-.12em}
.hero-actions{margin-top:1.9rem}
@media (hover: none),(prefers-reduced-motion: reduce){.hero-intro em{opacity:.92;transform:none;transition:none}}
@media (max-width: 559px){
  .hero-intro em{font-size:1.5em;margin-top:-.1em;line-height:1.15;opacity:.92;transform:none}
  .hero-intro em + em{margin-top:-.05em}
  .hero-intro em::first-letter{font-size:1.35em;letter-spacing:0}
}

/* ---------- hero statements: paint area tall enough for the doubled initials (background-clip:text), margins pull it back so nothing moves ---------- */
.hero-intro em{padding:2.5em .3em .9em .3em;margin:-2.82em -.3em -.9em -.3em}
.hero-intro em:first-child{padding-left:.3em;margin-left:-.3em}
.hero-intro em:last-child{padding-right:.3em;margin-right:-.3em}
@media (max-width: 559px){
  .hero-intro em{margin-top:calc(-.1em - 2.5em)}
  .hero-intro em + em{margin-top:calc(-.05em - 2.5em)}
}

/* ---------- On Stage and Screen: seamless 3×3 poster wall with a springy lift on hover ---------- */
.playbills .pb-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;grid-auto-columns:auto;gap:0;overflow:visible;scroll-snap-type:none;padding:0;max-width:min(100%,1040px);margin-inline:auto}
.playbills .pb-track > li{scroll-snap-align:none;position:relative;z-index:0;container-type:normal}
.playbills .pb figure{margin:0;position:relative;transform-origin:50% 50%;transition:transform .55s cubic-bezier(.34,1.56,.64,1),box-shadow .55s cubic-bezier(.34,1.56,.64,1)}
.playbills .pb-frame{box-shadow:none;background:#000}
.playbills .pb-frame img{transition:none}
.playbills .pb:hover .pb-frame img,.playbills .pb:focus-within .pb-frame img{transform:none}
.playbills .pb:hover,.playbills .pb:focus-within{z-index:3}
.playbills .pb:hover figure,.playbills .pb:focus-within figure{transform:scale(1.1);box-shadow:0 34px 70px -22px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.07)}
.playbills .pb figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:2.4rem .9rem .85rem;border:0;background:linear-gradient(0deg,rgba(11,10,9,.88),rgba(11,10,9,0));color:#F1ECE4;opacity:0;transition:opacity .35s var(--ease);pointer-events:none}
.playbills .pb figcaption b{color:#F1ECE4;font-size:clamp(.95rem,.8rem + .5vw,1.2rem);white-space:normal}
.playbills .pb .pb-where{color:rgba(241,236,228,.78);font-size:.68rem}
.playbills .pb:hover figcaption,.playbills .pb:focus-within figcaption{opacity:1}
@media (hover: none){.playbills .pb figcaption{opacity:1;padding:1.6rem .55rem .5rem}.playbills .pb figcaption b{font-size:.78rem}.playbills .pb .pb-where{font-size:.55rem}.playbills .pb:hover figure{transform:none;box-shadow:none}}
@media (prefers-reduced-motion: reduce){.playbills .pb figure{transition:none}.playbills .pb:hover figure,.playbills .pb:focus-within figure{transform:none}}

/* ---- "Perform. Create. Educate.": the big script initials thread through the caps line (overlay built by weaveIntro) ---- */
.hero-intro em{opacity:calc(.04 + .93*var(--lit,1))}
.hero-intro .ini-over{position:absolute;display:grid;z-index:3;pointer-events:none;clip-path:inset(100%);filter:drop-shadow(0 0 .7px var(--stage)) drop-shadow(0 0 1.2px var(--stage))}
.hero-intro .ini-over > em{margin:0 !important;align-self:stretch;justify-self:stretch}
@media (hover: none),(prefers-reduced-motion: reduce){.hero-intro em{opacity:.96}}
/* ---- initials threaded through the caps: per-crossing over / under with hairline knockouts (built by weaveIntro) ---- */
.hero-intro strong{text-shadow:none}
@media (min-width:560px){.hero-intro > em{margin-top:-2.68em}.hero-intro > em:nth-of-type(2){position:relative;left:-.23em}}
.hero-intro .caps-over{grid-area:auto;position:absolute;z-index:2;pointer-events:none;margin:0;clip-path:inset(100%);-webkit-text-stroke:.1em var(--stage);paint-order:stroke fill;text-shadow:none}
.hero-intro .ini-over{filter:drop-shadow(.038em 0 0 var(--stage)) drop-shadow(-.038em 0 0 var(--stage)) drop-shadow(0 .038em 0 var(--stage)) drop-shadow(0 -.038em 0 var(--stage)) drop-shadow(0 0 .016em var(--stage))}
/* ---- On Stage and Screen: six-poster carousel (the Selected Work credits), sitting under Selected Work ---- */
.playbills .sec-head{grid-template-columns:minmax(0,1fr) auto;align-items:end;margin-bottom:clamp(1.25rem,2.5vw,2rem)}
.playbills .sec-head > :first-child{grid-column:auto;min-width:0}
.pb-nav{grid-column:auto;display:flex;align-items:center;gap:.6rem;margin:0 0 .4rem;justify-content:flex-end}
.pb-progress{display:block;width:clamp(72px,9vw,128px);height:2px;margin-right:.6rem;background:var(--rule);overflow:hidden}
.pb-progress i{display:block;height:100%;width:0;background:var(--accent);transition:width .45s var(--ease)}
@media (prefers-reduced-motion: reduce){.pb-progress i{transition:none}}
.pb-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--rule);background:transparent;color:var(--fg);cursor:pointer;padding:0;font-family:var(--sans);font-size:1.15rem;line-height:1;display:grid;place-items:center;transition:border-color .25s var(--ease),color .25s var(--ease),background-color .25s var(--ease),opacity .25s var(--ease)}
.pb-btn .arr{display:block;transition:transform .3s var(--ease)}
.pb-btn:hover:not([disabled]){border-color:var(--accent);background:var(--accent);color:#F1ECE4}
.pb-btn.pb-next:hover:not([disabled]) .arr{transform:translateX(2px)}
.pb-btn.pb-prev:hover:not([disabled]) .arr{transform:translateX(-2px)}
.pb-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.pb-btn[disabled]{opacity:.3;cursor:default}
.playbills .pb-track{display:flex;grid-template-columns:none;grid-auto-flow:row;gap:var(--pb-gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:.25rem 0 .75rem;max-width:none;margin:0;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.playbills .pb-track.dragging{cursor:grabbing;scroll-snap-type:none}
.playbills .pb-track::-webkit-scrollbar{display:none}
.playbills .pb-track > li{flex:0 0 calc((100% - 2 * var(--pb-gap)) / 3);scroll-snap-align:start;position:relative;z-index:0;container-type:inline-size}
@media (max-width: 900px){.playbills .pb-track > li{flex-basis:calc((100% - var(--pb-gap)) / 2)}}
@media (max-width: 560px){.playbills .pb-track > li{flex-basis:76%}.playbills .sec-head{grid-template-columns:1fr}.pb-nav{justify-content:flex-start;margin:.25rem 0 0}}
.playbills .pb figure{transform:none;transition:none;box-shadow:none}
.playbills .pb:hover figure,.playbills .pb:focus-within figure{transform:none;box-shadow:none}
.playbills .pb-frame{background:#000;box-shadow:0 1px 0 var(--rule),0 24px 48px -28px rgba(0,0,0,.55);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.playbills .pb:hover .pb-frame{transform:translateY(-6px);box-shadow:0 1px 0 var(--rule),0 34px 60px -28px rgba(0,0,0,.6)}
.playbills .pb-frame img{transition:transform .8s var(--ease);-webkit-user-drag:none;user-select:none}
.playbills .pb:hover .pb-frame img,.playbills .pb:focus-within .pb-frame img{transform:scale(1.04)}
.playbills .pb figcaption{position:static;opacity:1;margin:.85rem 0 0;padding:.75rem 0 0;border:0;border-top:2px solid var(--accent);background:none;color:inherit;pointer-events:auto;display:flex;flex-direction:column;gap:.15rem;transition:none}
.playbills .pb figcaption b{color:inherit;font-family:var(--display);font-weight:500;text-transform:uppercase;font-size:min(1.2rem,5.4cqi);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.playbills .pb .pb-where{color:var(--fg-dim);font-size:min(.72rem,3.3cqi);font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover: none){.playbills .pb figcaption{opacity:1;padding:.75rem 0 0}.playbills .pb figcaption b{font-size:min(1.2rem,5.4cqi)}.playbills .pb .pb-where{font-size:min(.72rem,3.3cqi)}.playbills .pb:hover .pb-frame{transform:none}}
@media (prefers-reduced-motion: reduce){.playbills .pb-frame,.playbills .pb-frame img,.pb-btn .arr{transition:none}.playbills .pb:hover .pb-frame{transform:none}.playbills .pb:hover .pb-frame img{transform:none}}
/* ---- poster strip lives inside Selected Work, under the rows ---- */
.playbills.pb-strip{margin-top:clamp(2rem,4vw,3.5rem)}
.pb-strip .pb-nav{justify-content:flex-end;margin:0 0 1rem}
@media (max-width: 560px){.pb-strip .pb-nav{justify-content:flex-end;margin:0 0 .75rem}}

/* ---- Selected Work: the poster strip is part of the list (bleeds right, closes on a rule, posters and rows light each other) ---- */
.playbills.pb-strip{margin-top:1.75rem}
.pb-strip .pb-track{padding:.25rem 0}
.pb-foot{display:flex;align-items:center;gap:1.25rem;margin-top:1.25rem}
.pb-foot .pb-progress{flex:1 1 auto;width:auto;height:1px;margin:0;background:var(--rule)}
.pb-foot .pb-progress i{height:1px}
.pb-foot .pb-nav{margin:0;gap:.5rem}
.pb-foot .pb-btn{width:40px;height:40px;font-size:1.05rem}
.pb-link{display:block;color:inherit;text-decoration:none;outline:none}
.pb-link:focus-visible .pb-frame{outline:2px solid var(--accent);outline-offset:4px}
.playbills .pb.is-lit .pb-frame{transform:translateY(-6px);box-shadow:0 1px 0 var(--rule),0 34px 60px -28px rgba(0,0,0,.6)}
.playbills .pb.is-lit .pb-frame img{transform:scale(1.04)}
.playbills .pb:hover figcaption b,.playbills .pb.is-lit figcaption b{color:var(--accent-ink)}
.playbills .pb figcaption b{transition:color .3s var(--ease)}
.worklist li.is-lit > a{padding-left:.75rem;padding-right:.25rem;background:var(--bg-raised)}
.worklist li.is-lit > a .w-arr{transform:translateX(3px);color:var(--fg)}
@media (hover: none){.playbills .pb.is-lit .pb-frame{transform:none;box-shadow:0 1px 0 var(--rule),0 24px 48px -28px rgba(0,0,0,.55)}.playbills .pb.is-lit .pb-frame img{transform:none}}
@media (prefers-reduced-motion: reduce){.playbills .pb.is-lit .pb-frame{transform:none}.playbills .pb.is-lit .pb-frame img{transform:none}}
/* ---- every script heading steps up a size, with a hairline stroke for weight ---- */
.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker{font-size:clamp(3.5rem,2.4rem + 3.6vw,5.9rem);-webkit-text-stroke:.005em var(--gold);paint-order:stroke fill;filter:none}
@media (max-width: 560px){.sec-head .kicker,.page-head .kicker,.curtain .kicker,.t-copy .kicker,.teach-intro .kicker,.a-text .kicker{font-size:min(2.8rem,calc((100vw - 2 * var(--gut)) / 8.5))}}

/* ---- Selected Work header: title on one line, subtitle tracked to the same width beneath it ---- */
.sel-head{grid-template-columns:minmax(0,1fr)}
.sel-head > :first-child{grid-column:1 / -1;min-width:0}
.sel-head .sec-title{white-space:nowrap}
.sel-head .sel-sub{max-width:none;margin:1.1em 0 0;font-family:var(--sans);font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);white-space:nowrap;line-height:1.5}
@media (max-width: 900px){.sel-head .sel-sub{white-space:normal;letter-spacing:.12em;font-size:.72rem;max-width:60ch}}
@media (max-width: 700px){.sel-head .sec-title{white-space:normal;text-wrap:balance}}
/* ---- About (home): the quote is set like the Selected Work title; the paragraph beneath in the body sans ---- */
.teaser blockquote{font-family:var(--display);font-weight:300;text-transform:uppercase;font-style:normal;font-size:clamp(1.5rem,1.05rem + 1.5vw,2.5rem);line-height:1.1;letter-spacing:.01em;max-width:none;text-wrap:balance;margin:0 0 1.1rem}
.teaser .t-copy > p.measure{font-family:var(--sans);font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);font-weight:300;letter-spacing:0;text-transform:none;line-height:1.6;color:var(--fg-dim);max-width:48ch;margin:0 0 1.9rem}

/* ---- all running and role text in Source Sans 3; Lora is retired from the page ---- */
.role,.worklist .w-role,.credits .c-role,.project .p-role{font-family:var(--sans);font-weight:400}
.approach .a-quote,.bio .b-text .first,.bio .bio-copy > p:first-child{font-family:var(--sans);font-weight:300;letter-spacing:0}
.hero-name .l2 em{font-family:var(--sans)}

/* ---- About (home): the photo frame takes the full-length 2:3 crop ---- */
.teaser figure img{aspect-ratio:2/3}