@font-face{font-family:'Gloock';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/gloock-400.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/figtree-400.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/figtree-600.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/figtree-700.woff2') format('woff2')}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/space-mono-400.woff2') format('woff2')}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/space-mono-700.woff2') format('woff2')}

:root{
  --licorice:#16110F;--cocoa:#2A1F1B;--vanilla:#F2EADB;--icing:#FBF7F0;
  --parchment:#C8A36F;--rose:#C98E86;--sage:#8FA38A;--ink-muted:#6E625A;
  --display:'Gloock',ui-serif,serif;--text:'Figtree',ui-sans-serif,sans-serif;--mono:'Space Mono',ui-monospace,monospace;
  --gutter:clamp(1.25rem,0.6rem + 3vw,4.5rem);--max:1320px;
  --h1:clamp(2.35rem,1.1rem + 5.9vw,6.5rem);
  --h2:clamp(2.1rem,1.3rem + 3.3vw,4rem);
  --h3:clamp(1.35rem,1.2rem + .6vw,1.75rem);
  --body:clamp(1.03rem,.98rem + .2vw,1.125rem);
  --label:clamp(.69rem,.66rem + .12vw,.8rem);
  --header:clamp(60px,56px + .8vw,72px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--vanilla);color:var(--licorice);font:400 var(--body)/1.55 var(--text);overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
h1,h2{font-family:var(--display);letter-spacing:-.02em}
h1{font-size:var(--h1);line-height:.98}
h2{font-size:var(--h2);line-height:1.02}
h3{font:700 var(--h3)/1.2 var(--text)}
.skip{position:absolute;left:-999px;top:0;z-index:100;background:var(--icing);color:var(--licorice);padding:.8rem 1rem}
.skip:focus{left:1rem;top:1rem}
:focus-visible{outline:2px solid var(--rose);outline-offset:3px}
.wrap{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.eyebrow{display:flex;gap:.9em;align-items:center;font:700 var(--label)/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 1.4rem}
.eyebrow b{font-weight:700;color:var(--rose)}
.eyebrow::after{content:"";flex:0 0 3.5rem;height:1px;background:currentColor;opacity:.4}
.lede{font-size:clamp(1.1rem,1rem + .45vw,1.35rem);line-height:1.5;max-width:40ch}
.muted{color:var(--ink-muted)}
.mono{font-family:var(--mono);letter-spacing:.04em}

/* bands */
.band{position:relative;padding-block:clamp(4.5rem,3rem + 6vw,9rem)}
.band--dark{background:var(--licorice);color:var(--icing)}
.band--cocoa{background:var(--cocoa);color:var(--icing)}
.band--dark::before,.band--cocoa::before{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.06;pointer-events:none;mix-blend-mode:screen}
.band--dark .muted,.band--cocoa .muted{color:#CDBFAE}
.band > *{position:relative}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:.85rem 1.45rem;border-radius:999px;font:700 1rem/1.1 var(--text);text-decoration:none;border:1.5px solid transparent;transition:transform .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease;cursor:pointer}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn--icing{background:var(--icing);color:var(--licorice)}
.btn--icing:hover{background:var(--rose)}
.btn--ink{background:var(--licorice);color:var(--icing)}
.btn--ink:hover{background:var(--cocoa)}
.btn--line{border-color:currentColor;background:transparent}
.btn--line:hover{background:rgba(201,142,134,.18)}
.btn .arrow{transition:transform .2s ease}
.btn:hover .arrow{transform:translateX(4px)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:center}
.textlink{font:700 var(--label)/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}
.textlink:hover{color:var(--rose)}

/* ticket perforation */
.perf{-webkit-mask:radial-gradient(circle at 0 50%,#0000 11px,#000 11.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 11px,#000 11.5px) right/51% 100% no-repeat;mask:radial-gradient(circle at 0 50%,#0000 11px,#000 11.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 11px,#000 11.5px) right/51% 100% no-repeat}
.tear{border:0;border-top:2px dashed currentColor;opacity:.35;margin:1.2rem 0}
