:root{--sheet:#FFFFFF;--ink:#0B0F0D;--grass:#007A46;--sun:#FFD23F;--grey:#5F6862;--edge:clamp(1.1rem,5vw,4.5rem);--air:clamp(2.2rem,4vw,3.6rem)}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{background:var(--sheet);color:var(--ink);font-family:"Karla",Arial,sans-serif;font-size:1.06rem;line-height:1.7;text-align:left}
h1,h2,.naming,.pushing,.listing a,.dating,.numbering,.linking,.branding{font-family:"Space Grotesk",Arial,sans-serif}
h1{font-weight:700;font-size:clamp(2.2rem,7vw,4.4rem);line-height:1.02;letter-spacing:-.02em;margin:0 0 .5rem;max-width:22ch}
h2{font-weight:700;font-size:clamp(1.5rem,3.6vw,2.3rem);line-height:1.08;margin:0 0 .4rem;max-width:26ch}
p{margin:0 0 1.05rem}
a{color:var(--ink)}
a:focus-visible,button:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.skipping{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;white-space:nowrap;clip:rect(0 0 0 0)}
.skipping:focus{position:static;width:auto;height:auto;overflow:visible;white-space:normal;clip:auto}
.wrapping{width:100%;padding-left:var(--edge);padding-right:var(--edge);padding-top:2.2rem;padding-bottom:3.4rem}
.heading{margin-bottom:var(--air)}
.topping{padding-bottom:1.1rem;border-bottom:3px solid var(--grass);margin-bottom:var(--air)}
.branding{font-weight:700;font-size:1.28rem;line-height:1.2;margin:0 0 .7rem}
.branding a{text-decoration:none}
.listing{margin-bottom:0}
.listing[data-open="false"]{display:none}
.listing a{display:block;font-weight:700;font-size:1.05rem;text-decoration:none;padding-top:.28rem;padding-bottom:.28rem}
.listing a[aria-current="page"]{border-bottom:5px solid var(--grass);width:fit-content}
.pushing{display:none;border:none;background:var(--sun);color:var(--ink);font-weight:700;font-size:1rem;padding:.5rem 1.1rem;margin-bottom:1rem}
html[data-js="on"] .pushing{display:inline-block}
.opening{max-width:100%;margin-bottom:var(--air)}
.opening img{display:block;width:100%;height:auto;aspect-ratio:19/8;object-fit:cover;object-position:center}
.stage{margin-left:calc(-1 * var(--edge));margin-right:calc(-1 * var(--edge));margin-bottom:var(--air);padding:clamp(1.8rem,4.5vw,3.2rem) var(--edge) clamp(2.2rem,5vw,4rem);background:radial-gradient(ellipse 55% 75% at 78% 48%,rgba(46,120,220,.32),transparent 58%),radial-gradient(ellipse 40% 50% at 12% 85%,rgba(212,140,40,.14),transparent 55%),#060918;color:#f4ead8;display:grid;gap:1.5rem;border-bottom:3px solid var(--sun)}
.topping:has(+ .stage){margin-bottom:0}
.stage-copy h1{color:#f7edd8;max-width:16ch}
.stage-copy p{color:#c9bba3;margin-bottom:0;max-width:34ch;font-size:1.12rem}
.stage-art{margin:0;max-width:min(100%,32rem);justify-self:center}
.stage-art img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;filter:drop-shadow(0 18px 40px rgba(0,0,0,.55)) drop-shadow(0 0 32px rgba(62,196,255,.22))}
.entering{margin-bottom:var(--air)}
.numbering{font-weight:700;font-size:1.02rem;color:var(--grass);margin:0 0 .25rem}
.naming{font-weight:700;font-size:clamp(1.4rem,3.2vw,2.1rem);line-height:1.12;margin:0 0 .2rem;max-width:24ch}
.naming span{border-bottom:8px solid var(--grass)}
.placing{color:var(--grey);margin-bottom:1.3rem}
.leading{color:var(--grass);font-weight:700;border-bottom:3px solid var(--grass)}
.flowing{max-width:70ch}
.slowing{max-width:62ch}
.showing{max-width:54ch;margin-top:1.5rem;margin-bottom:1.5rem}
.showing img{display:block;width:100%;height:auto;aspect-ratio:10/7;object-fit:cover}
.nearing{max-width:54ch}
.ending{max-width:46ch}
.dating{color:var(--grey);font-size:.9rem;margin-bottom:var(--air)}
.pairing{max-width:66ch;margin-bottom:1.5rem}
.linking{font-weight:700;font-size:1.16rem;text-decoration:none}
.linking span{border-bottom:8px solid var(--grass)}
.noting{max-width:62ch;margin-top:var(--air)}
.footing{max-width:70ch;margin-top:var(--air);font-size:.94rem;color:var(--grey)}
.footing a{color:var(--ink)}
@media (min-width:720px){
.listing[data-open="false"]{display:block}
.listing a{display:inline-block;padding-right:1.7rem}
.pushing{display:none}
html[data-js="on"] .pushing{display:none}
}
@media (min-width:840px){
.stage{grid-template-columns:minmax(0,1fr) minmax(18rem,32rem);align-items:center;gap:clamp(1.6rem,4vw,3.4rem)}
.stage-art{justify-self:end;max-width:32rem;width:100%}
}
@media (min-width:1100px){
.wrapping{padding-left:clamp(4.5rem,9vw,10rem)}
.stage{margin-left:calc(-1 * clamp(4.5rem,9vw,10rem));padding-left:clamp(4.5rem,9vw,10rem)}
}
