/* v3: three chapters, gold only where things join */
nav.main a[aria-current]{box-shadow:0 2px 0 var(--w)}
.more{border-bottom-color:var(--w)}
.idx a:hover b,.idx a:hover i{color:var(--w)}
.idx a:hover span{color:rgba(255,255,255,.85)}
/* hero */
body.v3 .hero{height:100vh;height:100svh;min-height:600px;max-height:1040px;overflow:hidden}
body.v3 .hero .ph{position:absolute;inset:0;aspect-ratio:auto}
body.v3 .hero .ph img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;filter:none}
body.v3 .hero .ph::after{background:linear-gradient(90deg,rgba(0,0,0,.72) 0,rgba(0,0,0,.25) 46%,rgba(0,0,0,0) 62%),linear-gradient(180deg,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 16%,rgba(0,0,0,0) 72%,#000 100%)}
body.v3 .hero .copy{bottom:clamp(56px,9vh,110px)}
body.v3 .hero h1{font-size:clamp(46px,7vw,112px);max-width:none}
.pt{color:var(--g);font-weight:inherit}
.kick{margin:28px 0 0;font:500 clamp(17px,1.5vw,21px)/1.4 Archivo,Arial,sans-serif;letter-spacing:.01em;color:rgba(255,255,255,.72)}
/* chapters */
.chap{position:relative;background:#000;border-top:1px solid var(--rule)}
.chap .ph{position:relative;aspect-ratio:16/9;max-height:100vh;width:100%;overflow:hidden}
.chap .ph img{width:100%;height:100%;object-fit:cover}
.chap .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 75%,#000 100%)}
.chap .copy{position:absolute;left:0;right:0;bottom:clamp(40px,6vw,96px);z-index:2}
.chap h2{margin:0;font:800 clamp(40px,5.6vw,92px)/.96 Archivo,Arial,sans-serif;font-stretch:80%;letter-spacing:-.015em}
.chap h2 span{display:block}
.chap.gap + .conn{border-top:0;padding-top:24px}
.conn .head{align-items:center}
.conn .head .lbl{margin:0}
/* how we work, after the last bolt */
.build3 .wrap{display:grid;grid-template-columns:1.35fr 1fr;gap:64px;align-items:start}
.build3 h3{margin:0;font:700 clamp(30px,3.6vw,50px)/1.04 Archivo,Arial,sans-serif;font-stretch:85%}
.build3 p{margin:0;color:rgba(255,255,255,.82);font-size:20px;line-height:1.5}
.build3 .who{margin-top:34px}
@media (max-width:980px){.build3 .wrap{grid-template-columns:1fr;gap:28px}}
@media (max-width:760px){
 body.v3 .hero{height:auto;min-height:0;max-height:none}
 body.v3 .hero .ph{position:relative;inset:auto;height:78svh;min-height:520px;max-height:760px}
 body.v3 .hero .ph img{object-position:79% 50%}
 body.v3 .hero .ph::after{background:linear-gradient(180deg,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 52%,rgba(0,0,0,.8) 80%,#000 100%)}
 body.v3 .hero .copy{position:absolute;bottom:40px;padding:0}
 body.v3 .hero h1{font-size:clamp(40px,11.4vw,58px)}
 .kick{margin-top:18px;font-size:17px}
 .chap .ph{aspect-ratio:4/5;max-height:none}
 .chap.bolt .ph img{object-position:30% 50%}
 .chap.gap .ph img{object-position:66% 50%}
 .chap .ph::after{background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.6) 72%,#000 100%)}
 .chap .copy{bottom:32px}
 .chap h2{font-size:clamp(36px,10.4vw,52px)}
 .chap h2 span{display:inline}
 .build3 p{font-size:18px}
}

/* eight briefs */
@media (max-width:760px){.gaps{gap:6px}.gaps button{padding:10px 12px;font-size:13px;letter-spacing:.02em}}

/* 6 Nov riff: bigger headlines, wider left margin, headlines on their gold points */
.wrap{padding-left:clamp(0px,5.5vw,88px)}
body.v3 .hero{--F:clamp(56px,8.2vw,132px)}
body.v3 .hero h1{font-size:var(--F)}
.kick span{display:block}
.kick span+span{margin-top:6px}
.chap h2{font-size:clamp(52px,7.8vw,124px);line-height:.94}
.chap h2 span{display:block}
.strap{margin:22px 0 0;max-width:30em;font:500 clamp(17px,1.4vw,21px)/1.45 Archivo,Arial,sans-serif;color:rgba(255,255,255,.8)}
@media (min-width:761px){
 body.v3 .hero .copy{top:calc(45% - 1.44 * var(--F));bottom:auto}
 .chap.gap .copy{right:37%;left:0}
 .chap.gap .copy .wrap{width:auto;margin:0;padding:0;text-align:right}
 .chap.gap .strap{margin-left:auto;max-width:24em}
 .chap.bolt .copy{left:28.5%;right:0}
 .chap.bolt .copy .wrap{width:auto;margin:0;padding:0}
}
/* choreographer */
@media (min-width:981px){.build3 .wrap{grid-template-columns:1.1fr 1fr;align-items:center}}
.build3 p.b3{margin:24px 0 0}
.partner{margin-top:34px;padding:22px 24px;border:1px solid rgba(255,255,255,.18);background:#0b0b0b}
.partner .lbl{margin:0 0 8px}
.partner p:not(.lbl){margin:0;font-size:17px;color:rgba(255,255,255,.82)}
.chor{position:relative;margin:0}
.chor img{width:100%;max-width:520px;aspect-ratio:1;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.chor figcaption{margin-top:18px;font:800 clamp(28px,3vw,44px)/1 Archivo,Arial,sans-serif;font-stretch:80%}
.chor figcaption span{display:block}
@media (max-width:760px){
 .wrap{padding-left:8px}
 body.v3 .hero{--F:clamp(44px,13vw,60px)}
 .chap h2{font-size:clamp(42px,12.6vw,62px)}
 .chap h2 span{display:inline}
 .strap{font-size:16px}
 .chor img{max-width:none}
}
