/* homepage section layout. generated from mockups/build-sections.py */
/* section layouts. tokens and components live in _w.css. */
.s-hero{padding:clamp(3rem,8vw,6rem) 0 clamp(3rem,7vw,5rem)}
.s-hero{position:relative}
.s-hero-row{display:flex;align-items:center;gap:2rem;margin:1rem 0 .5rem}
.s-hero .h1{flex:1}
.s-hero .body,.s-contact .body{margin-top:1.25rem}
.s-hero .body{font-size:1.35rem;max-width:40rem;text-wrap:balance}
.s-hero .built{margin-top:1rem;color:var(--ink-1)}
.actions{display:flex;gap:1.5rem;align-items:center;margin-top:2.5rem}
.after{margin-top:1.75rem}
section .h2{margin:1rem 0 1.25rem;max-width:24ch} section .h2.wide{max-width:none;margin-bottom:2rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:2.5rem;border-top:var(--dot) dotted var(--ink-1)}
.doors article{padding:1.5rem 1.5rem 2rem 0;border-right:var(--dot) dotted var(--ink-1)}
.doors article+article{padding-left:1.5rem} .doors article:last-child{border-right:0;padding-right:0}
.doors .num{font-family:var(--font-display);color:var(--ink-2);margin-right:.75rem}
.doors .h3{margin:.75rem 0 .5rem} .doors p{margin:0}
.map{position:relative} .map svg{display:block;width:100%;height:auto;mix-blend-mode:var(--overprint)}
.map .pin{position:absolute;transform:translate(-50%,-160%) rotate(var(--tilt));white-space:nowrap;mix-blend-mode:normal;z-index:2} .map .pin.you{transform:translate(-30%,-20%) rotate(6deg)} .mapwrap .label{display:block;margin-bottom:.75rem} .map .pin.nyc{transform:translate(-96%,-190%) rotate(var(--tilt))}
.tour .dates li{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:1rem;padding:1.1rem 0;border-bottom:var(--dot) dotted var(--ink-1)} .tour .dates li:first-child{border-top:var(--rule) solid var(--ink-1);margin-top:.75rem}
.tour .dates b{font-size:clamp(1.5rem,3.2vw,2.25rem);grid-row:1;font-weight:400} .tour .dates span{grid-row:2;font-weight:800;text-transform:uppercase;font-size:.75rem;color:var(--ink-1)} .tour .dates small{grid-row:1;align-self:center;font-weight:800;text-transform:uppercase;font-size:.75rem;color:var(--ink-1)} .tour .hot b,.tour .hot small{color:var(--ink-2)}
.bignums{display:grid;grid-template-columns:1fr 1fr;border-top:var(--rule) solid var(--ink-1);border-left:var(--rule) solid var(--ink-1)} .bignums>div{border-right:var(--rule) solid var(--ink-1);border-bottom:var(--rule) solid var(--ink-1);padding:1.5rem 1.25rem} .bignums b{display:block;font-size:clamp(2.5rem,5vw,4rem);color:var(--ink-1);font-weight:400} .bignums span{font-weight:800;text-transform:uppercase;font-size:.75rem} .bignums .hot b{color:var(--ink-2)}
.s-demo-hero{padding-bottom:clamp(2rem,5vw,3.5rem)} .s-demo-hero .h2{margin:1rem 0 1.25rem}
.form .grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem} .form>.sticker{margin-bottom:1.25rem} .form .actions{margin-top:1.5rem}
.form .success,.form .failure{display:none;margin-top:1rem;color:var(--ink-2)} .form.is-submitted .success{display:block} .form.is-failed .failure{display:block} .form .hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.s-demo .two{grid-template-columns:1fr} .s-demo .form{max-width:40rem}
@media(max-width:48rem){.form .grid2{grid-template-columns:1fr}}
.chart svg{display:block;width:100%;height:auto;mix-blend-mode:var(--overprint)} .chart .legend{display:flex;gap:1.25rem;margin-top:1rem}
.receipt{border:var(--dot) solid var(--ink);padding:1.5rem;transform:rotate(-1deg);max-width:26rem;margin:0 auto;background:var(--paper)} .receipt b{display:block;font-size:1.1rem;margin-bottom:.25rem} .receipt ul{margin:1rem 0} .receipt li{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:var(--dot) dotted var(--ink-1);font-weight:800;text-transform:uppercase;font-size:.8rem} .receipt li em{font-style:normal;color:var(--ink-1)} .receipt .total{border-top:var(--rule) solid var(--ink);border-bottom:var(--rule) solid var(--ink);margin-top:.5rem;padding:.75rem 0;font-size:1rem} .receipt .total em{color:var(--ink-2)}
.wall{position:relative;min-height:24rem;border:var(--dot) dotted var(--ink-1)} .wall .sticker{position:absolute;font-size:1rem;padding:.4rem .8rem;mix-blend-mode:normal}
.strikes li{padding:.6rem 0;border-bottom:var(--dot) dotted var(--ink-1);display:flex;align-items:center;gap:1rem} .strikes b{font-size:clamp(1.5rem,3.2vw,2.25rem);font-weight:400;position:relative;color:var(--mute)} .strikes li:not(.keep) b::after{content:"";position:absolute;left:-.1em;right:-.1em;top:52%;height:.14em;background:var(--ink-2);transform:rotate(-3deg)} .strikes .keep b{color:var(--ink-1)}
.s-case-hero{padding:clamp(3rem,8vw,6rem) 0 clamp(2rem,5vw,3.5rem)} .s-case-hero .h1{font-size:clamp(2.5rem,8.5vw,6.5rem)} .s-case-hero .round{flex:none} .s-case-hero .body{margin-top:1.25rem;font-size:1.2rem} .s-case-hero .built{margin-top:1rem;color:var(--ink-1)}
.bignums.four{grid-template-columns:repeat(4,1fr)} .bignums.four b{font-size:clamp(2rem,4vw,3.25rem)}
.stat .label{display:block} .stat b.over{display:inline-block;font-size:clamp(3rem,7vw,5.5rem);margin:.5rem 0 1rem} .stat .setlist{margin-bottom:1rem}
.setlist.grow li{grid-template-columns:auto 1fr auto} .setlist.grow small{text-align:right;max-width:28rem}
@media(max-width:48rem){.bignums.four{grid-template-columns:1fr 1fr}.setlist.grow li{flex-wrap:wrap}.setlist.grow small{text-align:left;max-width:none;flex-basis:100%;padding-left:2.4rem}}
.s-logos{padding:clamp(2.5rem,6vw,4rem) 0}
.logos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);margin-top:2rem;align-items:end}
.logos a{display:block} .logos .label{display:block;margin-top:1rem;color:var(--mute)} .logos a:hover .label{color:var(--ink-2)}
.logo{display:block;background:var(--ink);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:left bottom;mask-position:left bottom;transition:background var(--t) var(--slap)}
.logos a:hover .logo{background:var(--ink-1)}
.logo.intensity{width:100%;max-width:26rem;aspect-ratio:1979/433;-webkit-mask-image:url(/assets/logos/intensity-entertainment.svg);mask-image:url(/assets/logos/intensity-entertainment.svg)}
.logo.hook{width:7.5rem;aspect-ratio:649/722;-webkit-mask-image:url(/assets/logos/the-hook-club.png);mask-image:url(/assets/logos/the-hook-club.png)}
@media(max-width:48rem){.logos{grid-template-columns:1fr;align-items:start}}
.s-contact{text-align:center} .s-contact .body{margin-left:auto;margin-right:auto} .s-contact .actions{justify-content:center}
.s-contact .h2{margin:1rem auto 0;max-width:16ch;font-size:clamp(2.25rem,6vw,4.5rem)}
.foot nav{display:flex;gap:1.5rem}
@media(max-width:48rem){
.map .pin{font-size:.65rem;padding:.2rem .45rem}
.two,.doors{grid-template-columns:1fr}.doors article,.doors article+article{border-right:0;border-bottom:var(--dot) dotted var(--ink-1);padding-left:0}
.s-hero-row{display:block;margin:.75rem 0 .5rem}
.s-hero .h1{font-size:clamp(2.25rem,11vw,8.5rem)}
.s-hero .round{position:static;display:inline-block;width:auto;height:auto;border-radius:0;padding:.3rem .7rem;font-family:var(--font-text);font-weight:800;font-size:.8rem;line-height:1.4;transform:rotate(2deg);margin:.75rem 0 0 .25rem}
.s-hero .body{font-size:1.15rem}
.actions{flex-wrap:wrap;gap:1rem 1.5rem}

}
