
:root{--yellow:#ffc400;--dark:#020711;--panel:#0b131f;--text:#fff;--muted:#d4d7dc}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--dark);color:var(--text);line-height:1.55}
.container{width:min(1120px,calc(100% - 36px));margin:auto}
.narrow{max-width:900px}
h1,h2,h3,p{margin-top:0}

.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 75% 25%,#16213a 0,transparent 45%),linear-gradient(180deg,#030710,#050b13);padding:30px 0 24px}
.hero:before{content:"";position:absolute;left:-150px;top:70px;width:470px;height:310px;background:radial-gradient(ellipse,#ffc400 0,transparent 68%);opacity:.08;filter:blur(12px)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:18px;min-height:360px}
.hero-copy{position:relative;z-index:2;padding-right:12px}
.eyebrow{display:flex;gap:12px;align-items:center;font-size:14px;font-weight:700;line-height:1.15}
.radio-icon{color:var(--yellow);font-size:28px}
.hero h1{font-size:clamp(42px,5vw,66px);line-height:1.02;font-weight:900;letter-spacing:-2.4px;margin:25px 0 18px}
.hero h1 span,.benefits h2 span,.coming h2 span,.signup h2 span{color:var(--yellow)}
.hero p{max-width:560px;font-size:17px;color:#eff1f5;margin-bottom:22px}
.hero-photo{width:100%;height:380px;background:url('assets/hero-studio-clean.png') center center/cover no-repeat;position:relative;isolation:isolate}
.hero-photo:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050b13 0%,#050b13 3%,rgba(5,11,19,.55) 15%,rgba(5,11,19,0) 32%,rgba(5,11,19,0) 100%)}

.btn{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:22px;background:linear-gradient(90deg,#ffd01d,#ffb900);color:#050505;text-decoration:none;font-weight:900;border:0;border-radius:5px;padding:17px 27px;font-size:16px;box-shadow:0 8px 24px #0008;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,filter .25s ease}
.btn:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 20%,#fff9 45%,transparent 70%);transform:translateX(-130%);transition:transform .65s ease}
.btn:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 14px 34px #ffc40045,0 8px 24px #000a}
.btn:hover:before{transform:translateX(130%)}
.btn:active{transform:translateY(-1px) scale(.985)}

.video-section{padding:28px 0 24px;text-align:center}
.video-card{position:relative;width:min(860px,100%);padding:0;border:1px solid #b9bcc2;border-radius:8px;overflow:hidden;background:#000;cursor:pointer;box-shadow:0 16px 45px #0008}
.video-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center center}
.play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:76px;height:76px;border:4px solid #fff;border-radius:50%;display:grid;place-items:center;font-size:33px;background:#0008;transition:.25s}
.video-card:hover .play{transform:translate(-50%,-50%) scale(1.1);background:var(--yellow);color:#050505;box-shadow:0 0 0 12px #ffc40020}
.video-caption{margin:14px 0 0;color:#e6e6e6}
.video-caption strong{color:var(--yellow)}

.benefits{padding:30px 0 32px;background:linear-gradient(180deg,#101924,#09111b);border-top:1px solid #28313e;border-bottom:1px solid #2b3440}
.benefits h2,.signup h2{text-align:center;font-size:30px;line-height:1.15}
.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px}
.benefit-grid article{text-align:center;padding:0 30px;border-right:1px solid #636a74}
.benefit-grid article:last-child{border:0}
.benefit-icon{color:var(--yellow);font-size:56px;line-height:1}
.benefit-grid h3{font-size:17px;margin:13px 0 5px}
.benefit-grid p{color:#eee;margin:0}

.coming{background:radial-gradient(circle at 18% 50%,#6e4600 0,transparent 27%),linear-gradient(90deg,#0b0c0d,#161006,#070a0e);padding:22px 0}
.coming-grid{display:grid;grid-template-columns:250px 1fr;gap:30px;align-items:center}
.gift{display:flex;justify-content:center;align-items:center}
.gift img{display:block;width:100%;max-width:220px;height:220px;object-fit:contain;filter:drop-shadow(0 0 25px rgba(255,196,0,.35))}
.coming h2{font-size:32px;margin-bottom:8px}
.coming p{max-width:720px;margin-bottom:12px}
.locked{border:1px solid #a4a6ab;border-radius:8px;padding:13px 17px;display:flex;gap:14px;align-items:center}
.locked>span{color:var(--yellow);font-size:28px}

.signup{padding:30px 0 26px;background:radial-gradient(circle at 50% 20%,#101d32,#050b15 66%)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-grid label{position:relative}
.form-grid label span{position:absolute;width:1px;height:1px;overflow:hidden}
.form-grid input{width:100%;padding:16px 18px;border:1px solid #202a38;border-radius:6px;background:#171e27;color:#fff;font-size:15px;outline:none}
.form-grid input:focus{border-color:var(--yellow);box-shadow:0 0 0 3px #ffc40022}
.form-grid .full{grid-column:1/-1}
.submit{width:100%;margin-top:12px;animation:buttonPulse 2.8s ease-in-out infinite}
.privacy{text-align:center;font-size:13px;margin:12px 0 0;color:#f0f0f0}
.success{display:none;margin-top:15px;padding:13px;background:#0c2b18;border:1px solid #2c8b4c;border-radius:6px;text-align:center}

.signature{border-top:1px solid #303641;background:#050910;padding:20px 0 28px}
.signature-grid{display:grid;grid-template-columns:150px 1fr 210px;gap:24px;align-items:center}
.avatar{width:140px;height:140px;border-radius:50%;object-fit:cover;background:#080c12;border:2px solid #eee;box-shadow:0 0 0 6px #ffc40018}
.signature-text p{margin-bottom:8px}
.name{font-size:34px;font-style:italic;color:var(--yellow);font-family:cursive}
.mic{width:100%;max-width:190px;height:220px;object-fit:contain;object-position:center bottom;justify-self:end;filter:drop-shadow(0 0 18px rgba(255,255,255,.08))}

.modal{display:none;position:fixed;inset:0;z-index:50;background:#000c;align-items:center;justify-content:center;padding:20px}
.modal.show{display:flex}
.modal-box{position:relative;width:min(850px,100%);background:#0b111a;border:1px solid #38404b;border-radius:10px;padding:20px}
.close{position:absolute;right:8px;top:4px;border:0;background:none;color:#fff;font-size:34px;cursor:pointer}
.video-placeholder{aspect-ratio:16/9;display:grid;place-content:center;text-align:center;padding:40px;background:#05080d}
.video-placeholder h3{color:var(--yellow);font-size:28px}
.error-message{background:#40151b!important;border-color:#8f2f3d!important}
.submit:disabled{opacity:.7;cursor:wait}
@keyframes buttonPulse{0%,100%{box-shadow:0 8px 24px #0008}50%{box-shadow:0 10px 32px #ffc40055}}

@media(max-width:800px){
  .hero{padding-top:18px}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding-right:0}
  .hero-photo{height:255px;margin-top:4px}
  .hero-photo:before{background:linear-gradient(180deg,#050b13 0%,rgba(5,11,19,.15) 22%,rgba(5,11,19,0) 40%)}
  .hero h1{font-size:42px}
  .benefit-grid{grid-template-columns:1fr}
  .benefit-grid article{border-right:0;border-bottom:1px solid #59606a;padding:20px 10px}
  .benefit-grid article:last-child{border-bottom:0}
  .coming-grid{grid-template-columns:1fr;text-align:center}
  .gift img{max-width:180px;height:180px}
  .locked{text-align:left}
  .signature-grid{grid-template-columns:110px 1fr}
  .avatar{width:105px;height:105px}
  .mic{display:none}
}
@media(max-width:560px){
  .container{width:min(100% - 24px,1120px)}
  .hero h1{font-size:35px;letter-spacing:-1px}
  .hero p{font-size:16px}
  .btn{width:100%;font-size:14px;padding:15px 12px}
  .play{width:60px;height:60px;font-size:25px}
  .benefits h2,.signup h2,.coming h2{font-size:25px}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .signature-grid{grid-template-columns:1fr;text-align:center}
  .avatar{margin:auto}
  .name{font-size:30px}
}
@media(prefers-reduced-motion:reduce){.btn,.btn:before,.play,.submit{animation:none!important;transition:none!important}}
