/* Layout: full-bleed stage photography, poster-scale condensed type, alternating black and white bands. Colours come from the Foundation's logo. */
:root{
  color-scheme:dark;
  --ink:#0f0e0c; --ink-2:#1b1916; --paper:#fff; --paper-2:#f3efe7;
  --ochre:#d7a53f; --rust:#b6492a; --bone:#efe9dd; --mute:#a69f92; --mute-dark:#5f5a51; --line:rgba(255,255,255,.2);
  --display:"DM Sans","Helvetica Neue",Arial,sans-serif;
  --body:"DM Sans","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,3.2vw,48px);
  --gl:max(var(--gutter),env(safe-area-inset-left,0px));
  --gr:max(var(--gutter),env(safe-area-inset-right,0px));
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--bone);font:400 clamp(16px,1.1vw,18px)/1.6 var(--body);overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:1.06;letter-spacing:-.008em;margin:0;text-wrap:balance}
p{margin:0}
button,input,select,textarea{font:inherit}
:focus-visible{outline:3px solid var(--ochre);outline-offset:3px}
.wrap{padding-left:var(--gl);padding-right:var(--gr)}
.prose{max-width:62ch}
.prose>*+*{margin-top:1em}
.eyebrow{font:500 .82rem/1.3 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--ochre)}
.on-paper .eyebrow,.eyebrow.dark{color:var(--rust)}
.mega{font-size:clamp(2.7rem,7.4vw,7.6rem);letter-spacing:-.018em}
.big{font-size:clamp(2.2rem,4.4vw,4.4rem)}
.page-hero h1.long{font-size:clamp(2.2rem,6vw,6rem)}
.page-hero h1{overflow-wrap:break-word;min-width:0}
.page-hero .inner>*{min-width:0}
.band{padding-block:clamp(64px,8vw,128px)}
.on-paper{background:var(--paper);color:#1f1d19}
.on-bone{background:var(--paper-2);color:#1f1d19}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:.65em 1.5em;background:var(--ochre);color:var(--ink);border:2px solid var(--ochre);font:500 .95rem/1.1 var(--display);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--paper);border-color:var(--paper)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.ghost:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.on-paper .btn.ghost:hover,.on-bone .btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tlink{font:500 .95rem/1.2 var(--display);letter-spacing:.08em;text-transform:uppercase;text-underline-offset:.35em;text-decoration-thickness:2px}
.tlink:hover{color:var(--rust)}
.ph{background:linear-gradient(135deg,var(--rust),#30150c 62%,var(--ink));overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover}
.ph img.gone{display:none}

/* Header */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--ink)}
.head{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:14px var(--gr) 14px var(--gl);transition:background .25s,padding .25s;color:#fff}
.head.solid{background:rgba(15,14,12,.96);padding-block:8px}
.head ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(16px,2vw,32px);align-items:center}
.head ul.right{justify-content:flex-end}
.head a.nav{font:500 1rem/1 var(--display);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;padding:.5em 0;border-bottom:2px solid transparent}
.head a.nav:hover,.head a.nav[aria-current=page]{border-color:var(--ochre)}
.brand{display:block;background:#fff;padding:9px 13px;margin-block:-14px;line-height:0;transition:padding .25s}
.brand img{width:clamp(118px,11vw,164px);height:auto;transition:width .25s}
.head.solid .brand{margin-block:-8px;padding:6px 11px}
.head.solid .brand img{width:clamp(92px,8vw,116px)}
.logo-plate{display:inline-block;background:#fff;padding:14px 18px;line-height:0}
.logo-plate img{width:clamp(180px,20vw,270px);height:auto}
.menu-btn{display:none;width:48px;height:48px;background:none;border:0;color:inherit;cursor:pointer;padding:10px;margin-left:-10px}
.menu-btn i{display:block;height:2px;background:currentColor;margin:6px 0}
.head .btn{min-height:40px;padding:.45em 1em;font-size:.86rem}
.overlay{position:fixed;inset:0;z-index:40;background:var(--ink);display:flex;flex-direction:column;overflow:auto;padding:calc(16px + env(safe-area-inset-top,0px)) var(--gr) 32px var(--gl)}
.overlay .x{align-self:flex-end;background:none;border:0;color:#fff;font:500 1rem var(--display);letter-spacing:.09em;text-transform:uppercase;min-height:48px;cursor:pointer}
.overlay nav{display:grid;gap:.1em;margin-block:auto}
.overlay nav a{font:700 clamp(2.3rem,11vw,5rem)/1.14 var(--display);letter-spacing:-.012em;text-transform:uppercase;text-decoration:none}
.overlay nav a:hover{color:var(--ochre)}

/* Heroes */
.hero{position:relative;min-height:min(92vh,960px);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background:var(--ink)}
.hero .slides{position:absolute;inset:0;background:linear-gradient(135deg,var(--rust),#30150c 60%,var(--ink))}
.hero .slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.6s ease}
.hero .slides img.on{opacity:1}
.hero .slides img.gone{display:none}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,14,12,.5) 0,rgba(15,14,12,.05) 28%,rgba(15,14,12,.08) 52%,rgba(15,14,12,.78) 100%);pointer-events:none}
.hero-name{position:relative;z-index:1;color:#fff;font-size:10vw;line-height:1;letter-spacing:-.022em;word-spacing:.06em;padding:0 var(--gr) .1em var(--gl);white-space:nowrap}
.hero-name span{display:inline}
.promo{position:relative;z-index:1;background:var(--ochre);color:var(--ink);display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,3vw,40px);align-items:center;padding:16px var(--gr) 16px var(--gl)}
.promo .thumb{width:clamp(86px,8vw,124px);aspect-ratio:1;background:#000;padding:6px}
.promo .thumb img{width:100%;height:100%;object-fit:contain}
.promo h2{font-size:clamp(1.5rem,2.5vw,2.4rem)}
.promo .eyebrow{color:var(--ink);margin-bottom:.35em}
.promo .links{display:flex;gap:20px;flex-wrap:wrap;align-items:center}
.promo .tlink:hover{color:#fff}
.page-hero{position:relative;min-height:clamp(420px,62vh,660px);display:flex;align-items:flex-end;overflow:hidden}
.page-hero .ph{position:absolute;inset:0}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,14,12,.55) 0,rgba(15,14,12,.22) 40%,rgba(15,14,12,.86) 100%)}
.page-hero .inner{position:relative;z-index:1;padding-block:clamp(96px,10vw,140px) clamp(28px,4vw,56px);color:#fff;display:grid;gap:.7rem;width:100%}
.page-hero .lede{max-width:50ch;font-size:clamp(1.1rem,1.5vw,1.4rem);line-height:1.45}

/* Carousel */
.car-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,56px)}
.car-btns{display:flex;gap:8px}
.car-btns button{width:52px;height:52px;background:none;color:inherit;border:2px solid currentColor;font:500 1.3rem var(--display);cursor:pointer}
.car-btns button:hover{background:var(--ochre);border-color:var(--ochre);color:var(--ink)}
.car{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,calc((100% - 3 * 24px)/3.4));gap:24px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:18px;scrollbar-color:var(--ochre) transparent;scrollbar-width:thin}
.fest{scroll-snap-align:start;text-decoration:none;display:grid;gap:14px;align-content:start}
.fest .plate{aspect-ratio:1;background:#fff;display:grid;place-items:center;padding:12%;overflow:hidden}
.fest .plate.black{background:#000}
.fest .plate img{width:100%;height:100%;object-fit:contain;transition:transform .45s ease}
.fest:hover .plate img{transform:scale(1.05)}
.fest h3{font-size:1.45rem}
.fest:hover h3{color:var(--ochre)}
.fest p{color:var(--mute);font-size:.98rem;line-height:1.45}

/* Vault-style feature */
.feature{position:relative;overflow:hidden;background:var(--ink)}
.feature .ph{position:absolute;inset:0}
.feature::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,14,12,.9) 0,rgba(15,14,12,.55) 45%,rgba(15,14,12,.2) 100%)}
.feature .inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,420px);gap:clamp(32px,6vw,96px);align-items:end;padding-block:clamp(80px,11vw,170px);color:#fff}
.feature .card{background:var(--ink);padding:clamp(22px,2.5vw,34px);display:grid;gap:12px;justify-items:start}
.feature .card h3{font-size:1.7rem}
.feature .card p{font-size:1rem;line-height:1.5}

/* Story cards */
.stories{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(20px,2.4vw,36px)}
.story{display:grid;gap:12px;align-content:start;border-top:3px solid #1f1d19;padding-top:14px;grid-column:span 4}
.story.lead{grid-column:span 6}
.story h3{font-size:clamp(1.5rem,2.1vw,2.1rem)}
.story.lead h3{font-size:clamp(2rem,3.4vw,3.4rem)}
.story p{color:#3e3a33}
.story .tag{font:500 .78rem var(--display);letter-spacing:.13em;text-transform:uppercase;color:var(--rust)}
.more{margin-top:clamp(32px,4vw,56px)}

/* Name marquee */
.marquee-sec{overflow:hidden}
.marquee{display:flex;width:max-content;animation:slide 90s linear infinite;font:700 clamp(2.2rem,5.2vw,4.8rem)/1.3 var(--display);letter-spacing:-.012em;text-transform:uppercase;white-space:nowrap}
.marquee.rev{animation-direction:reverse;animation-duration:110s}
.marquee.b{color:transparent;-webkit-text-stroke:1.5px #1f1d19}
.marquee span{padding-right:.55em}
.marquee-sec:hover .marquee,.marquee-sec:focus-within .marquee{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.split .ph{aspect-ratio:3/2}
.split .prose{justify-self:start}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}

/* Prefooter */
.prefoot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;background:var(--ink)}
.prefoot .ph{aspect-ratio:4/3}
.join{grid-column:2/4;grid-row:1/3;display:grid;gap:14px;align-content:center;justify-items:center;text-align:center;padding:clamp(24px,4vw,56px);background:var(--ochre);color:var(--ink)}
.join h2{font-size:clamp(2rem,3.5vw,3.4rem)}
.join form{display:flex;width:100%;max-width:480px;flex-wrap:wrap;gap:8px}
.join input{flex:1 1 200px;min-width:0;min-height:48px;padding:.5em .8em;border:2px solid var(--ink);background:#fff;color:#1f1d19}
.join .btn{background:var(--ink);color:#fff;border-color:var(--ink)}
.join .btn:hover{background:#fff;color:var(--ink)}
.note{font-size:.92rem;line-height:1.4}
.foot{padding-block:clamp(40px,5vw,72px) 28px;display:grid;gap:40px}
.foot-top{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:32px}
.foot h2{font-size:clamp(2.2rem,4vw,3.8rem)}
.foot h3{font-size:.86rem;letter-spacing:.14em;color:var(--ochre);margin-bottom:12px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--ochre)}
.foot address{font-style:normal}
.fine{border-top:1px solid var(--line);padding-top:18px;font-size:.88rem;color:var(--mute);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* Events */
.shows-empty{border:2px solid #1f1d19;padding:clamp(24px,3vw,40px);display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap}
.shows-empty h3{font-size:clamp(1.6rem,2.6vw,2.4rem);margin-bottom:.3em}
.show{display:grid;grid-template-columns:minmax(120px,180px) minmax(0,1fr) minmax(0,1fr) auto;gap:20px;align-items:center;border-top:2px solid #1f1d19;padding-block:20px}
.show:last-child{border-bottom:2px solid #1f1d19}
.show b{font:700 1.5rem var(--display);text-transform:uppercase}
.past{display:grid;gap:0}
.past-row{display:grid;grid-template-columns:clamp(110px,14vw,210px) minmax(0,1fr) auto;gap:clamp(18px,3vw,48px);align-items:center;padding-block:clamp(18px,2vw,28px);border-top:1px solid var(--line);text-decoration:none}
.past-row:last-child{border-bottom:1px solid var(--line)}
.past-row .plate{aspect-ratio:1;background:#fff;padding:9%;display:grid;place-items:center}
.past-row .plate.black{background:#000}
.past-row .plate img{width:100%;height:100%;object-fit:contain}
.past-row h3{font-size:clamp(1.8rem,4.4vw,4.2rem)}
.past-row p{color:var(--mute);max-width:60ch;margin-top:.4em}
.past-row .go{font:500 2rem var(--display);transition:transform .2s}
.past-row:hover h3{color:var(--ochre)}
.past-row:hover .go{transform:translateX(6px);color:var(--ochre)}
.points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px);margin-top:clamp(32px,4vw,56px)}
.points div{border-top:3px solid #1f1d19;padding-top:14px}
.points h3{font-size:1.5rem;margin-bottom:.45em}
.facts{display:grid;gap:0;list-style:none;padding:0;margin:0}
.facts li{padding-block:16px;border-top:1px solid var(--line)}
.on-paper .facts li{border-color:#cfc8ba}
.facts li:last-child{border-bottom:1px solid var(--line)}
.on-paper .facts li:last-child{border-color:#cfc8ba}
.detail{display:grid;grid-template-columns:minmax(220px,340px) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.detail .plate{aspect-ratio:1;background:#fff;padding:10%;display:grid;place-items:center;border:1px solid #cfc8ba;position:sticky;top:84px}
.detail .plate.black{background:#000}
.detail .plate img{width:100%;height:100%;object-fit:contain}
.pager{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:48px}

/* Artists */
.tools{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:clamp(28px,4vw,52px)}
.tools input{flex:1 1 280px;min-width:0;min-height:52px;padding:.5em .9em;background:transparent;color:inherit;border:2px solid var(--bone)}
.tools input::placeholder{color:var(--mute)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{min-height:44px;padding:.35em 1em;background:none;color:inherit;border:2px solid var(--line);font:500 .9rem var(--display);letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.chip[aria-pressed=true]{background:var(--ochre);border-color:var(--ochre);color:var(--ink)}
.chip:hover{border-color:var(--ochre)}
.on-paper .chip{border-color:#b9b1a2}
.on-paper .chip[aria-pressed=true]{background:#1f1d19;border-color:#1f1d19;color:#fff}
.count{color:var(--mute);margin-bottom:18px;font-size:.98rem}
.wall{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.02em .5em;font:700 clamp(1.45rem,3.9vw,3.7rem)/1.22 var(--display);letter-spacing:-.01em;text-transform:uppercase}
.wall li{display:inline-flex;align-items:baseline;gap:.22em;overflow-wrap:anywhere}
.wall li:nth-child(3n+2){color:var(--ochre)}
.wall li:nth-child(7n+4){color:transparent;-webkit-text-stroke:1.2px var(--bone)}
.wall sup{white-space:nowrap;font:500 .8rem var(--display);letter-spacing:.09em;color:var(--bone);-webkit-text-stroke:0;vertical-align:baseline}

/* Impact */
.impact{list-style:none;margin:0;padding:0}
.impact li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(16px,4vw,64px);padding-block:clamp(22px,2.6vw,36px);border-top:2px solid #1f1d19}
.impact li:last-child{border-bottom:2px solid #1f1d19}
.impact h3{font-size:clamp(1.6rem,3vw,3rem)}
.impact .tag{display:block;font:500 .78rem var(--display);letter-spacing:.13em;text-transform:uppercase;color:var(--rust);margin-bottom:.45em}
.quote{font:700 clamp(1.9rem,4.4vw,4.4rem)/1.1 var(--display);letter-spacing:-.012em;text-transform:uppercase;text-wrap:balance}

/* About */
.vm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,64px)}
.vm h3{font-size:clamp(2rem,3.6vw,3.4rem);margin-bottom:.4em}

/* Contact */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(40px,6vw,96px);align-items:start}
.lines{display:grid;gap:22px;margin-top:24px}
.lines b{display:block;font:500 .78rem var(--display);letter-spacing:.13em;text-transform:uppercase;color:var(--rust);margin-bottom:.25em}
.val{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:1.15rem;font-weight:400}
.copy{background:none;border:1px solid currentColor;color:inherit;font:500 .72rem var(--display);letter-spacing:.09em;text-transform:uppercase;padding:.35em .7em;min-height:32px;cursor:pointer}
.copy:hover{background:#1f1d19;color:#fff}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field{display:grid;gap:5px;min-width:0}
.field.wide,.form .wide{grid-column:1/-1}
.field label{font:500 .8rem var(--display);letter-spacing:.1em;text-transform:uppercase}
.field input,.field select,.field textarea{width:100%;min-height:50px;padding:.6em .8em;background:#fff;color:#1f1d19;border:2px solid #1f1d19;border-radius:0}
.field textarea{min-height:170px;resize:vertical}
.status{font-size:1rem;line-height:1.45;font-weight:400}
.status:empty{display:none}

dialog{border:0;padding:clamp(24px,4vw,44px);background:var(--ochre);color:var(--ink);width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px)}
dialog::backdrop{background:rgba(0,0,0,.72)}
dialog h2{font-size:clamp(2rem,5vw,3rem);margin-bottom:.3em}
dialog .x{float:right;background:none;border:0;font:500 .9rem var(--display);letter-spacing:.09em;text-transform:uppercase;min-height:44px;cursor:pointer;color:inherit}
dialog .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
dialog input{flex:1 1 220px;min-width:0;min-height:48px;padding:.5em .8em;border:2px solid var(--ink);background:#fff;color:#1f1d19}
dialog .btn{background:var(--ink);border-color:var(--ink);color:#fff}
dialog .status{margin-top:12px}
.skip{position:absolute;left:-999px;z-index:50;background:var(--ochre);color:var(--ink);padding:.7em 1em}
.skip:focus{left:12px;top:12px}
main:focus{outline:none}

@media (max-width:960px){
  .head{grid-template-columns:auto 1fr auto}
  .head ul{display:none}
  .menu-btn{display:block}
  .brand{justify-self:center}
  .head .sub{justify-self:end}
  .promo{grid-template-columns:auto minmax(0,1fr)}
  .promo .links{grid-column:1/-1}
  .car{grid-auto-columns:minmax(240px,64vw)}
  .feature .inner,.split,.detail,.contact,.foot-top,.vm{grid-template-columns:minmax(0,1fr)}
  .feature::after{background:linear-gradient(180deg,rgba(15,14,12,.5),rgba(15,14,12,.88))}
  .story,.story.lead{grid-column:span 12}
  .points{grid-template-columns:minmax(0,1fr)}
  .show{grid-template-columns:minmax(0,1fr)}
  .detail .plate{position:static;max-width:280px}
  .impact li{grid-template-columns:minmax(0,1fr)}
  .prefoot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .join{grid-column:1/-1;grid-row:auto;order:-1}
}
@media (max-width:640px){
  .hero{min-height:88vh}
  .hero-name{font-size:17vw;white-space:normal;line-height:.98}
  .hero-name span{display:block}
  .past-row{grid-template-columns:84px minmax(0,1fr)}
  .past-row .go{display:none}
  .form{grid-template-columns:minmax(0,1fr)}
  .brand img{width:104px}
  .head.solid .brand img{width:84px}
  .marquee{font-size:2.3rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .marquee,.marquee.rev{animation:none;width:auto;flex-wrap:wrap;white-space:normal;padding-inline:var(--gl)}
  .marquee .dup{display:none}
  .hero .slides img{transition:none}
}
