:root{--ink:#16120f;--ink2:#221c17;--paper:#f2ebdf;--muted:#a99d8c;--brass:#c8973f;--ox:#8a2f24;--line:rgba(242,235,223,.14);
--display:'Zodiak',Georgia,serif;--body:'Switzer',system-ui,sans-serif;--max:1120px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--paper);font-family:var(--body);font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--brass)}
a:hover{color:var(--paper)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(1.25rem,4vw,3rem);background:rgba(22,18,15,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.mark{display:flex;align-items:baseline;gap:.6rem;text-decoration:none;color:var(--paper)}
.mark span{font-family:var(--display);font-weight:700;font-size:1.5rem;letter-spacing:.04em}
.mark small{color:var(--muted);font-size:.8rem}
nav{display:flex;gap:1.5rem}
nav a{color:var(--muted);text-decoration:none;font-size:.92rem}
nav a:hover{color:var(--paper)}
section{max-width:var(--max);margin:0 auto;padding:clamp(4rem,9vw,7.5rem) clamp(1.25rem,4vw,3rem);border-bottom:1px solid var(--line)}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.05}
h2{font-size:clamp(2rem,1.4rem + 2.6vw,3.4rem);margin-bottom:1rem}
h3{font-size:1.45rem;margin-bottom:.5rem}
.sub{color:var(--muted);max-width:48ch;margin-bottom:3rem}
.hero{padding-top:clamp(4rem,10vw,8rem)}
.kicker{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;color:var(--brass);margin-bottom:1.5rem}
h1{font-size:clamp(2.6rem,1.2rem + 8vw,7.5rem);letter-spacing:-.02em;margin-bottom:2rem}
h1 em{font-style:italic;color:var(--brass)}
.lede{max-width:56ch;font-size:clamp(1.1rem,1rem + .5vw,1.35rem);color:#ddd3c3}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:1.5rem;margin-top:2.5rem}
.btn{display:inline-block;background:var(--brass);color:var(--ink);text-decoration:none;font-weight:600;padding:.9rem 1.5rem;border-radius:2px}
.btn:hover{background:var(--paper);color:var(--ink)}
.link{text-decoration:none}
.words,.reasons,.tiles{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.words article{border-top:2px solid var(--brass);padding-top:1.25rem}
.words p,.reasons p,.tiles p,.lineup p{color:#d6ccbc}
.lineup{list-style:none;display:grid;gap:1px;background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.lineup li{background:var(--ink);padding:1.75rem 1.5rem}
.lineup li.lead{background:var(--ink2);grid-column:1/-1}
.lineup li.lead h3{font-size:2.2rem;color:var(--brass)}
.role{display:block;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--muted);margin-bottom:.6rem}
.reasons article{background:var(--ink2);padding:1.75rem;border-left:3px solid var(--ox)}
.n{font-family:var(--display);color:var(--brass);font-size:1rem;display:block;margin-bottom:.75rem}
.steps{list-style:none;counter-reset:s;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-top:2rem}
.steps li{counter-increment:s;border:1px solid var(--line);padding:1.25rem;color:#d6ccbc}
.steps li::before{content:counter(s,decimal-leading-zero);display:block;font-family:var(--display);color:var(--brass);margin-bottom:.5rem}
.steps b{color:var(--paper)}
.tiles article{border:1px solid var(--line);padding:1.5rem}
.close{margin-top:4rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem}
.close p{font-family:var(--display);font-size:clamp(1.4rem,1.1rem + 1.2vw,2rem);max-width:30ch}
footer{max-width:var(--max);margin:0 auto;padding:2.5rem clamp(1.25rem,4vw,3rem);color:var(--muted);font-size:.9rem;display:grid;gap:.4rem}
footer a{color:var(--muted)}
@media (max-width:720px){nav{display:none}.mark small{display:none}}

.lineup li.lead{display:grid;grid-template-columns:minmax(160px,260px) 1fr;gap:2rem;align-items:center}
.lineup li.lead .face{width:100%;height:auto;display:block}
.lineup li.lead .title{color:var(--muted);font-size:.95rem;margin-bottom:1rem}
.lineup li.lead p+p{margin-top:.75rem}
@media (max-width:720px){.lineup li.lead{grid-template-columns:1fr}.lineup li.lead .face{max-width:200px}}

.lineup li:not(.lead) .face{width:100%;max-width:200px;height:auto;display:block;margin:0 auto 1rem}
@media (min-width:900px){.lineup{grid-template-columns:repeat(4,1fr)}}
@media (min-width:560px) and (max-width:899px){.lineup{grid-template-columns:repeat(2,1fr)}}

.tagline{font-family:var(--display);font-size:clamp(1.5rem,1.1rem + 1.6vw,2.4rem);color:var(--brass);margin:-1rem 0 1.25rem}
.sub.wide{max-width:62ch}
.roll blockquote{font-family:var(--display);font-size:clamp(1.3rem,1.05rem + 1vw,1.9rem);line-height:1.35;max-width:40ch;border-left:3px solid var(--brass);padding-left:1.25rem;margin:1rem 0 2rem}
.roll blockquote a{color:var(--paper);text-decoration-color:var(--brass)}
.roll-body{max-width:62ch;color:#d6ccbc}
section{scroll-margin-top:72px}

.lineup li.lead .creed{font-family:var(--display);font-style:italic;color:var(--brass);font-size:1.15rem;margin:.1rem 0 .35rem}
.lineup .ident{color:var(--muted);font-size:.85rem;margin:-.2rem 0 .6rem}