@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
:root{--black:#070705;--cream:#eee8da;--mustard:#c58a17;--line:rgba(238,232,218,.78)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--black);color:var(--cream);font-family:'IBM Plex Mono',monospace}button,input,textarea{font:inherit}.shell{min-height:100svh}.page{position:relative;isolation:isolate;min-height:100svh;overflow:hidden;background:var(--black)}
.page::before{content:"";position:absolute;inset:-2%;z-index:-3;background:url('assets/crowd.jpg') center 42%/cover no-repeat;filter:grayscale(1) sepia(.55) saturate(2.1) hue-rotate(352deg) brightness(.53) contrast(1.45)}
.page::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(5,5,3,.93) 0%,rgba(5,5,3,.68) 48%,rgba(5,5,3,.24) 100%)}
.grain{display:none}
header,.content,.thanks-content{position:relative;z-index:2}header{height:106px;padding:34px clamp(28px,5vw,78px);display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.logo{font-family:Arial,sans-serif;font-weight:900;font-size:32px;line-height:1;color:var(--mustard);letter-spacing:-1.8px;text-decoration:none;white-space:nowrap}header button,.thanks-content button{border:0;background:none;color:var(--mustard);letter-spacing:.17em;cursor:pointer;padding:0;text-transform:uppercase}nav{display:flex;gap:30px;align-items:center}.content{width:min(690px,48vw);margin:5vh 0 0 clamp(28px,5vw,78px)}h1{font-family:'Archivo Black',Impact,sans-serif;font-size:clamp(66px,7vw,122px);line-height:.82;letter-spacing:-.055em;margin:0 0 28px;color:var(--cream);text-transform:uppercase}h1 span{color:var(--mustard)}.prompt,.fine{letter-spacing:.16em;line-height:1.48;font-size:13px}.prompt{margin:0 0 28px}.fine{font-size:11px;margin:24px 0 0}textarea,input{display:block;width:100%;background:rgba(3,3,2,.78);border:1px solid var(--line);border-radius:0;color:var(--cream);outline:none;box-shadow:none}textarea{height:142px;padding:20px;resize:vertical}input{height:58px;padding:0 18px;margin-top:9px}.primary{display:flex;align-items:center;justify-content:space-between;margin-top:15px;width:72%;min-height:55px;border:0;background:var(--mustard);color:#080705;font-weight:700;font-size:18px;letter-spacing:.12em;text-align:left;padding:0 28px;cursor:pointer}.primary b{font-size:28px;font-weight:400}.hidden{display:none!important}
.thanks::after{background:linear-gradient(90deg,rgba(5,5,3,.52),rgba(5,5,3,.25))}.thanks::before{background-position:center 48%}.thanks-content{min-height:calc(100svh - 106px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 24px 10vh}.thanks-content h1{font-size:clamp(80px,9vw,150px);margin-bottom:30px}.thanks-content p{letter-spacing:.22em}.thanks-content i{width:34px;height:1px;background:var(--cream);margin:28px 0}.thanks-content button{margin:10px}.thanks-content .secondary{color:var(--cream);opacity:.74}
.newsletter::before{background-position:center 54%}.newsletter-content label{display:block;color:var(--mustard);font-size:12px;letter-spacing:.18em;margin:18px 0}.newsletter-content small{color:var(--cream)}
@media(max-width:760px){
  .page{min-height:100svh;overflow-x:hidden}
  .page::before{inset:0;background-position:center 34%;filter:grayscale(1) sepia(.58) saturate(2.15) hue-rotate(352deg) brightness(.46) contrast(1.5);transform:scale(1.02)}
  .page::after{background:linear-gradient(180deg,rgba(4,4,2,.13) 0%,rgba(4,4,2,.30) 23%,rgba(4,4,2,.76) 48%,rgba(4,4,2,.97) 76%,#070705 100%)}
  header{height:82px;padding:24px 40px 0;align-items:flex-start}.logo{font-size:27px}header button{font-size:9px;line-height:1.25;white-space:nowrap;margin-top:13px}nav{gap:12px}nav span{display:none}
  .content{width:auto;max-width:none;margin:21.5vh 40px 0;padding-bottom:34px}
  h1{font-size:clamp(48px,13.4vw,76px);line-height:.84;letter-spacing:-.055em;margin-bottom:18px;max-width:100%}
  .prompt{font-size:10px;line-height:1.5;margin-bottom:20px}.fine{font-size:9px;line-height:1.55;margin-top:22px}
  textarea{height:132px;padding:17px;font-size:13px}.primary{width:100%;height:54px;font-size:16px;padding:0 24px}
  .thanks::before{background-position:60% 35%}.thanks::after{background:linear-gradient(180deg,rgba(4,4,2,.12),rgba(4,4,2,.45) 38%,rgba(4,4,2,.9) 74%,#070705)}
  .thanks-content{min-height:calc(100svh - 82px);padding:3vh 48px 8vh}.thanks-content h1{font-size:clamp(48px,13vw,72px);line-height:.84;margin-bottom:22px}.thanks-content p{font-size:10px}.thanks-content i{margin:22px 0}.thanks-content button{font-size:10px;margin:8px}.thanks-content .secondary{font-size:9px;white-space:nowrap;max-width:100%}
  .newsletter::before{background-position:52% 26%}.newsletter-content{width:calc(100% - 96px);margin:17.5vh auto 0;padding-bottom:42px}
  .newsletter-content h1{font-size:clamp(40px,11.2vw,64px);line-height:.88;overflow-wrap:normal;word-break:normal;white-space:normal}
  .newsletter-content .prompt{max-width:310px}.newsletter-content label{margin:17px 0;font-size:11px}.newsletter-content input{height:56px;font-size:14px}
}
@media(max-width:390px){header{padding-left:32px;padding-right:32px}.content{margin:20vh 32px 0}.newsletter-content{width:calc(100% - 72px);margin:17vh auto 0}.newsletter-content h1{font-size:10.8vw}.thanks-content{padding-left:38px;padding-right:38px}.thanks-content h1{font-size:13vw}.thanks-content .secondary{font-size:8px}}

/* V7: each mobile state owns a fresh viewport instead of inheriting Safari's document scroll. */
@media(max-width:760px){
  html,body{min-height:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:auto}
  .shell{min-height:100svh}
  .page{position:relative;width:100%;min-height:100svh;overflow-x:hidden;overflow-y:visible}
  body.changing-page .page{visibility:hidden}

  /* Keep the corrected THANK YOU headline, restore the supporting copy's presence. */
  .thanks-content p{font-size:12px;line-height:1.45}
  .thanks-content button{font-size:12px;line-height:1.35}
  .thanks-content .secondary{font-size:10px}
}
@media(max-width:390px){
  .thanks-content p{font-size:11px}
  .thanks-content button{font-size:11px}
  .thanks-content .secondary{font-size:9px}
}

/* V8 subscriber confirmation uses the same visual grammar as THANK YOU. */
.subscribed::before{background-position:58% 38%}
.subscribed::after{background:linear-gradient(90deg,rgba(5,5,3,.52),rgba(5,5,3,.25))}
.subscribed-content h1{font-size:clamp(80px,9vw,150px);margin-bottom:30px}
@media(max-width:760px){
  .subscribed::before{background-position:58% 34%}
  .subscribed::after{background:linear-gradient(180deg,rgba(4,4,2,.12),rgba(4,4,2,.45) 38%,rgba(4,4,2,.9) 74%,#070705)}
  .subscribed-content{min-height:calc(100svh - 82px);padding:3vh 48px 8vh}
  .subscribed-content h1{font-size:clamp(48px,13vw,72px);line-height:.84;margin-bottom:22px}
  .subscribed-content p{font-size:12px;line-height:1.45}
  .subscribed-content button{font-size:12px;line-height:1.35}
}
@media(max-width:390px){
  .subscribed-content{padding-left:38px;padding-right:38px}
  .subscribed-content h1{font-size:13vw}
  .subscribed-content p,.subscribed-content button{font-size:11px}
}

.navlink{border:0;background:none;color:var(--mustard);letter-spacing:.17em;cursor:pointer;padding:0;text-transform:uppercase;text-decoration:none;font:inherit}.thanks-content .navlink{margin:10px}.thanks-content .navlink.secondary{color:var(--cream);opacity:.74}@media(max-width:700px){header .navlink{font-size:9px;line-height:1.25;white-space:nowrap;margin-top:13px}.thanks-content .navlink{font-size:12px;line-height:1.35;margin:8px}.thanks-content .navlink.secondary{font-size:9px;white-space:nowrap;max-width:100%}}