@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");
/* TBA frame (Oct 2026): white page frame, clean header with pill nav, near full-width rounded cards with one equal gutter.
   Loaded last on every page (added by _content/frame.mjs at build). */
:root{--edge:clamp(12px,1.6vw,24px);--frame-r:clamp(18px,2vw,24px);--card:#F2F2F0;--hdr:72px;--ink:#161212;--acc:#C0272D}
html body{background:#fff}
/* header */
html body nav#nav{position:fixed!important;top:0;left:0;right:0;height:var(--hdr);background:rgba(255,255,255,.92)!important;-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border:0!important;box-shadow:none!important;z-index:60}
html body nav#nav>.w{max-width:none!important;padding:0 calc(var(--edge) + clamp(8px,1.4vw,20px))!important}
html body nav#nav .bar{height:var(--hdr)!important;color:var(--ink)!important;gap:16px}
html body nav#nav .wm{color:var(--ink)!important;font:700 17px/1 Inter,sans-serif;letter-spacing:-.03em}
@media(min-width:901px){
 html body nav#nav ul.dn{position:absolute;left:50%;transform:translateX(-50%);display:flex!important;gap:2px!important;padding:4px;margin:0;background:#fff;border:1px solid #ECECEA;border-radius:999px}
 html body nav#nav ul.dn>li>a{display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 15px;border-radius:999px;font:500 14px/1 Inter,sans-serif;color:var(--ink)!important;opacity:1!important;transition:background-color .2s}
 html body nav#nav ul.dn>li>a:hover{background:#F4F4F2}
 html body nav#nav ul.dn>li>a[aria-current=page],html body nav#nav ul.dn>li.dd.on>a{background:#EDEDEB}
 html body nav#nav ul.dn .dd-m{top:calc(100% + 14px)}
}
html body nav#nav .bar>.btn.r,html body nav#nav .bar>a.btn{background:var(--ink)!important;color:#fff!important;height:42px;padding:0 20px;border-radius:999px;font:600 14px/1 Inter,sans-serif;border:0!important;transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s,background-color .25s!important}
html body nav#nav .bar>.btn.r:hover{background:#2a2424!important;transform:translateY(-1px);box-shadow:0 10px 22px -12px rgba(22,18,18,.55)}
html body nav#nav .bar>.btn.r:after{display:none}
html body nav#nav .mbtn{background:#F2F2F0!important;border:0!important}
/* page hero card */
html body .sp-hero.sp-hero{margin:var(--hdr) var(--edge) 0!important;border-radius:var(--frame-r)!important;background:var(--card)!important;color:var(--ink)!important;border:0!important;padding:clamp(56px,8vw,112px) 0 clamp(48px,6vw,88px)!important}
html body .sp-hero.sp-hero h1{color:var(--ink)!important}
html body .sp-hero.sp-hero .sp-k{color:var(--acc)!important}
html body main.nwa.nwa{padding-top:calc(var(--hdr) + clamp(24px,4vw,56px))!important}
/* home */
html body.home .hx{margin:var(--hdr) var(--edge) 0;border-radius:var(--frame-r);background:var(--card);padding:clamp(48px,6vw,96px) 0}
html body.home .mq{padding:clamp(28px,4vw,56px) 0 clamp(24px,4vw,48px)}
html body.home .tint{margin:0 var(--edge);border-radius:var(--frame-r);background:var(--card)}
html body.home .tint+.tint{margin-top:var(--edge)}
html body.home .hx-v{box-shadow:0 0 0 1px rgba(22,18,18,.05),0 2px 4px rgba(22,18,18,.04),0 14px 28px -10px rgba(22,18,18,.14),0 36px 72px -28px rgba(22,18,18,.24)}
html body.home .rb{background:#fff}
@media(max-width:760px){html body.home .hx{padding:20px 0 36px}html body.home .hx .w{padding:0 16px}html body .sp-hero.sp-hero .w{padding:0 20px!important}}
/* last band before footer and footer sit in the same frame */
html body footer{margin:var(--edge) var(--edge) var(--edge);border-radius:var(--frame-r);background:#fff;border-top:1px solid #ECECEA}
html body.home nav#nav ul.dn>li.dd.on>a{background:transparent}html body.home nav#nav ul.dn>li.dd.on>a:hover{background:#F4F4F2}
/* r6: hero video melts into the grey card (no card edges, no shadow, no chip) */
.hx-n{display:none!important}
.hx .hx-v,.hx .hx-v:hover{box-shadow:none!important;border-radius:0!important;background:transparent;transform:none}
.hx .hx-v:after{display:none}
.hx .hx-v img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%),linear-gradient(0deg,transparent 0,#000 16%,#000 84%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%),linear-gradient(0deg,transparent 0,#000 16%,#000 84%,transparent 100%);mask-composite:intersect}
.hx .hx-v .pl{display:grid!important;place-items:center;position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#C0272D;opacity:.9;transition:transform .4s cubic-bezier(.22,1,.36,1),opacity .4s;z-index:1}
.hx .hx-v .pl svg{margin-left:3px}
.hx .hx-v:hover .pl{transform:scale(1.08);opacity:1}
@media(max-width:600px){.hx .hx-v .pl{width:52px;height:52px;margin:-26px 0 0 -26px}}
/* white theme only */
:root{color-scheme:light}
/* no button shadows; outlines that were drawn with inset shadows become borders */
html body :is(.bt,.bt-r,.bt-k,.bt-o,.bt-t,.cx-btn,.hx-pc,.pl,.rb,.tb button,.qp-cta,.btn,a.btn,button,.nf-p,.nf-o),html body nav#nav .bar>.btn.r,html body nav#nav .bar>.btn.r:hover,html body :is(.bt,.cx-btn,.rb,.btn,button):hover{box-shadow:none!important}
html body :is(.bt-o,.rb){border:1px solid #D8D2CC}
html body .tb button{border:1px solid var(--line,#E6E1DC)}
html body .tb button[aria-selected=true]{border-color:transparent}
/* footer logo (TBA icon) */
html body footer .wm{display:inline-flex;align-items:center;gap:10px}
html body footer .wm:before{content:"";flex:none;width:32px;height:32px;border-radius:8px;background:url(/icon-192.png) center/cover no-repeat}
/* join band: restore its top padding (".dp+.dp{padding-top:0}" removed it, so the heading sat on the band edge) and separate it from the cards above */
html body section.dp#join{padding-top:clamp(40px,6vw,72px);margin-top:clamp(24px,4vw,48px)}
/* join band: plain white, no red card; dark readable text; form card outlined so it stays visible */
html body section#join.dp{background:#fff!important;color:var(--ink,#161212)!important;padding-top:clamp(56px,7vw,88px);padding-bottom:clamp(56px,7vw,88px)}
html body section#join.dp :is(h2,h3,p,label,span,b){color:var(--ink,#161212)!important}
html body section#join.dp p{color:var(--mut,#5f5656)!important}
html body section#join.dp .dp-card{border:1px solid #E6E1DC;box-shadow:none!important}
html body section#join.dp input,html body section#join.dp textarea{border:1px solid #D8D2CC!important;background:#fff!important;color:#161212!important}

/* Inter everywhere (replaces DM Serif Display, Playfair Display, Newsreader and any serif) */
html,body,html body *:not(svg):not(svg *){font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif!important;font-style:normal}
html body :is(h1,h2,h3,h4){font-weight:600;letter-spacing:-.02em}
html body :is(blockquote,.cx-qt,.cx-qt *,em,i:not(:empty)){font-style:normal!important}
html body :is(.cx-qt,blockquote){font-weight:500;letter-spacing:-.015em}