@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@300;400;500&family=Inter:wght@400;500&display=swap');

:root{
  --ink:#0b0b0b;
  --paper:#fff;
  --muted:#525252;
  --subtle:#7a7a7a;
  --line:#e6e6e6;
  --lime:#c4f53b;
  --lime-light:#ddff85;
  --gray-300:#d1d1d1;
  --gray-400:#a8a8a8;
  --gray-500:#7a7a7a;
  --gray-600:#525252;
  --gray-700:#3d3d3d;
  --display:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  --sans:"Inter","Helvetica Neue",Arial,system-ui,sans-serif;
  --section:clamp(4rem,10vw,10rem);
  --gutter:clamp(1rem,4vw,3rem);
}

*,*::before,*::after{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{min-height:100vh;background:var(--paper);color:var(--ink);font:400 1rem/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
button{font:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
a:hover{color:var(--muted)}

.container{width:100%;max-width:1280px;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.wordmark{font:500 1.125rem/1 var(--display);letter-spacing:-0.02em}
.label{font:500 0.75rem/1 var(--sans);letter-spacing:0.08em;text-transform:uppercase}
.label-sm{font:500 0.6875rem/1 var(--sans);letter-spacing:0.1em;text-transform:uppercase}

.site-header{border-bottom:1px solid var(--line)}
.site-header.overlay{position:absolute;top:0;left:0;right:0;z-index:3;border-bottom:0;color:#fff}
.site-header.overlay a{color:#fff}
.site-header.overlay a:hover{color:var(--gray-300)}
.header-inner{display:flex;justify-content:space-between;align-items:center;padding-top:1.25rem;padding-bottom:1.25rem}

.hero{position:relative;overflow:hidden;padding-top:var(--section);padding-bottom:var(--section);color:#fff}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero::after{content:"";position:absolute;inset:0;background:rgb(11 11 11 / 0.55);z-index:1}
.hero-content{position:relative;z-index:2}
.hero h1{font:400 clamp(3.5rem,2rem + 6vw,8rem)/0.92 var(--display);letter-spacing:-0.04em;text-wrap:balance;max-width:18ch}
.hero .lead{margin-top:3rem;font:400 20px/1.5 var(--display);max-width:50ch;color:var(--gray-300)}

.strands{border-top:1px solid var(--line);padding-top:4rem;padding-bottom:var(--section)}
.strands h2{font:400 clamp(1.75rem,1.15rem + 1.75vw,2.5rem)/1.1 var(--display);letter-spacing:-0.02em;margin-bottom:3rem}
.strand-list{list-style:none;padding:0}
.strand-list li{display:flex;gap:1.5rem;align-items:baseline;padding:2rem 0;border-top:1px solid var(--line)}
.strand-list li:last-child{border-bottom:1px solid var(--line)}
.strand-num{font:300 clamp(2rem,1.25rem + 2.5vw,3.5rem)/1 var(--display);letter-spacing:-0.03em;color:var(--subtle);min-width:2.2em}
.strand-list p{font:400 1.125rem/1.6 var(--display);max-width:65ch}

.submit{background:var(--ink);color:#fff;padding-top:var(--section);padding-bottom:var(--section)}
.submit h2{font:400 clamp(2.5rem,1.5rem + 3.5vw,4.5rem)/1 var(--display);letter-spacing:-0.03em;text-wrap:balance;max-width:16ch;margin-bottom:4rem}
.submit h2 a{color:var(--lime)}
.submit h2 a:hover{color:var(--lime-light)}
.submit-cols{display:grid;gap:2.5rem}
.submit-cols p{font-family:var(--display);max-width:65ch}
.submit-legal{color:var(--gray-400);font-size:0.875rem}

.site-footer{padding-top:4rem}
.footer-inner{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:baseline;padding-bottom:2rem}
.footer-inner a{font-family:var(--display)}
.footer-copy{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;border-top:1px solid var(--line);padding-top:1.5rem;padding-bottom:2rem;color:var(--subtle)}
.footer-copy a{color:var(--subtle)}

.policy{padding-top:4rem;padding-bottom:var(--section)}
.policy h1{font:400 clamp(2.5rem,1.5rem + 3.5vw,4.5rem)/1 var(--display);letter-spacing:-0.03em;text-wrap:balance;max-width:20ch;margin-bottom:3rem}
.policy-body{max-width:65ch}
.policy-body h2{font:500 clamp(1.375rem,1.1rem + 1vw,1.875rem)/1.2 var(--display);letter-spacing:-0.015em;margin:3rem 0 1rem}
.policy-body h3{font:500 1.375rem/1.3 var(--display);margin:2rem 0 1rem}
.policy-body p,.policy-body li{color:var(--muted);margin-bottom:1rem}
.policy-body ul{padding-left:1.2em;margin-bottom:1rem}
.policy-body a{text-decoration:underline;text-underline-offset:3px}

.notfound{position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:center;color:#fff}
.notfound::after{content:"";position:absolute;inset:0;background:rgb(11 11 11 / 0.55);z-index:1}
.notfound-content{position:relative;z-index:2}
.notfound-code{font:300 clamp(5rem,14vw,10rem)/1 var(--display);letter-spacing:-0.04em;color:var(--lime);margin-bottom:1rem}
.notfound h1{font:400 clamp(2.5rem,1.5rem + 3.5vw,4.5rem)/1 var(--display);letter-spacing:-0.03em;margin-bottom:2.5rem}
.notfound-link{color:#fff;border-bottom:1px solid var(--lime);padding-bottom:2px}
.notfound-link:hover{color:var(--lime)}

.cookie-banner{position:fixed;bottom:1rem;right:1rem;z-index:50;max-width:380px;background:var(--ink);color:#fff;padding:1.5rem;border-radius:8px;opacity:0;transform:translateY(12px);transition:opacity 240ms ease,transform 240ms ease}
.cookie-banner.is-visible{opacity:1;transform:none}
.cookie-title{font:500 1.125rem/1.2 var(--display);letter-spacing:-0.02em;margin-bottom:0.5rem}
.cookie-text{font-size:0.875rem;color:var(--gray-400);margin-bottom:1.25rem}
.cookie-text a{color:#fff;text-decoration:underline}
.cookie-options{display:grid;gap:0.75rem;margin-bottom:1.5rem}
.cookie-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;cursor:pointer}
.cookie-row > span:first-child{display:grid;font-size:0.875rem}
.cookie-row small{color:var(--gray-500);font-size:0.75rem}
.cookie-row input{position:absolute;opacity:0;pointer-events:none}
.toggle{flex:none;width:38px;height:22px;border-radius:11px;background:var(--gray-700);position:relative;transition:background 150ms ease}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform 150ms ease}
.cookie-row input:checked + .toggle{background:var(--lime)}
.cookie-row input:checked + .toggle::after{transform:translateX(16px);background:var(--ink)}
.cookie-row input:disabled + .toggle{opacity:0.5}
.cookie-actions{display:flex;gap:0.75rem}
.cookie-btn{flex:1;font:500 0.875rem/1 var(--sans);padding:0.75rem 1rem;border-radius:999px;border:1px solid transparent}
.cookie-accept{background:var(--lime);color:var(--ink)}
.cookie-accept:hover{background:var(--lime-light)}
.cookie-save{background:transparent;color:#fff;border-color:var(--gray-600)}
.cookie-save:hover{border-color:#fff}

@media (min-width:768px){
  .strand-list li{gap:3rem}
  .submit-cols{grid-template-columns:repeat(12,minmax(0,1fr))}
  .submit-cols p:first-child{grid-column:1 / 7}
  .submit-legal{grid-column:8 / -1}
}