/* ============================================================
   THE MODERN GUITAR MENTORSHIP - Varad Sahasrabudhe
   Photo-led · cool-dark base · crimson signature (his red archtop)
   ============================================================ */
:root{
  /* Cool near-black base */
  --ink:      #100F12;
  --ink-2:    #17151A;
  --panel:    #1B1820;
  --panel-2:  #221E27;

  /* Warm bone text (photos are warm; keep type readable) */
  --bone:     #F4F0E8;
  --bone-2:   #E7E1D6;
  --bone-dim: #B4ADA2;
  --bone-mut: #837D74;

  /* Crimson signature */
  --red:      #D8402E;
  --red-hi:   #EF5439;
  --red-deep: #8A241A;
  --wine:     #4A1712;

  --line:     rgba(244,240,232,.12);
  --line-2:   rgba(244,240,232,.07);

  --maxw: 1200px;
  --gutter: clamp(20px, 5vw, 68px);
  --radius: 14px;
  --radius-lg: 20px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --shadow: 0 20px 50px rgba(0,0,0,.5), 0 60px 120px rgba(0,0,0,.5);
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  font-family:'Inter', system-ui, -apple-system, sans-serif;
  background:var(--ink); color:var(--bone);
  line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,video{ display:block; max-width:100%; }
a{ color:inherit; }
::selection{ background:var(--red); color:#fff; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
section{ position:relative; }

/* ---- Type ---- */
h1,h2,h3,.display{ font-family:'Bricolage Grotesque', system-ui, sans-serif; font-weight:700; line-height:1.02; letter-spacing:-.02em; }
.eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-size:clamp(11px,.7vw + 8px,12.5px); font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--red); font-family:'Inter',sans-serif;
}
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--red); border-radius:2px; }
.eyebrow.solo::before{ width:8px; height:8px; border-radius:50%; }
.h-xl{ font-size:clamp(2.9rem, 6.2vw, 5.6rem); font-weight:700; }
.h-lg{ font-size:clamp(2.1rem, 4vw, 3.4rem); font-weight:700; }
.lead{ font-size:clamp(1.08rem,.5vw + 1rem,1.28rem); color:var(--bone-dim); }
em.hl{ font-style:normal; color:var(--red-hi); }
.serifless-accent{ color:var(--red-hi); }

/* ---- Buttons / form ---- */
.btn{
  appearance:none; border:none; cursor:pointer; position:relative; overflow:hidden; text-decoration:none;
  font-family:'Inter',sans-serif; font-weight:600; font-size:1rem; color:#fff;
  background:linear-gradient(180deg,var(--red-hi),var(--red-deep));
  padding:15px 26px; border-radius:11px; white-space:nowrap; display:inline-flex; align-items:center; gap:.5em;
  box-shadow:0 8px 24px rgba(216,64,46,.32), inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .2s var(--ease), box-shadow .3s var(--ease), filter .25s var(--ease);
}
.btn:hover{ transform:translateY(-2px); filter:brightness(1.07); box-shadow:0 14px 34px rgba(216,64,46,.44); }
.btn:active{ transform:translateY(0); }
.btn:focus-visible{ outline:3px solid var(--red-hi); outline-offset:3px; }
.btn .arw{ transition:transform .25s var(--ease); }
.btn:hover .arw{ transform:translateX(3px); }

.capture{ max-width:566px; }
.capture .row{ display:flex; gap:9px; background:rgba(244,240,232,.06); border:1px solid var(--line); padding:7px; border-radius:14px; backdrop-filter:blur(8px); }
.capture input{ flex:1 1 auto; min-width:0; border:none; background:transparent; font:inherit; font-size:1rem; color:var(--bone); padding:11px 13px; }
.capture input::placeholder{ color:var(--bone-mut); }
.capture input:focus{ outline:2px solid rgba(216,64,46,.5); outline-offset:1px; border-radius:8px; }
@media (max-width:520px){ .capture .row{ flex-direction:column; } .capture .btn{ width:100%; justify-content:center; } }
.microcopy{ margin-top:12px; font-size:.85rem; color:var(--bone-mut); display:flex; align-items:center; gap:8px; }
.microcopy .dot{ width:4px; height:4px; border-radius:50%; background:var(--red); }
.form-error{ margin-top:9px; font-size:.85rem; color:#ff8a72; font-weight:500; display:none; }
.form-error.show{ display:block; }
.capture.done .row, .capture.done .microcopy{ display:none; }
.done-msg{ display:none; gap:12px; align-items:flex-start; background:rgba(244,240,232,.05); border:1px solid var(--line); border-radius:14px; padding:18px 20px; }
.capture.done .done-msg{ display:flex; }
.done-msg .ck{ flex:0 0 auto; width:34px; height:34px; border-radius:50%; background:var(--red); color:#fff; display:grid; place-items:center; }
.done-msg h4{ font-family:'Inter'; font-weight:700; font-size:1.02rem; margin-bottom:2px; }
.done-msg p{ font-size:.9rem; color:var(--bone-dim); }

/* ============================================================
   HERO - cinematic video
   ============================================================ */
.hero{ position:relative; min-height:calc(100svh - var(--navh, 58px)); display:flex; flex-direction:column; overflow:hidden; }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media video, .hero__media img{ width:100%; height:100%; object-fit:cover; object-position:60% 40%; }
.hero__scrim{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(16,15,18,.94) 0%, rgba(16,15,18,.8) 34%, rgba(16,15,18,.28) 62%, rgba(16,15,18,.55) 100%),
    linear-gradient(0deg, rgba(16,15,18,.96) 2%, transparent 40%),
    linear-gradient(180deg, rgba(16,15,18,.7) 0%, transparent 22%);
}
.hero__grain{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E"); }

.topbar{ position:relative; z-index:3; }
.topbar .in{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:clamp(18px,2.4vw,26px); }
.brand{ display:flex; align-items:center; gap:.6em; font-family:'Bricolage Grotesque'; font-weight:700; font-size:1.05rem; letter-spacing:-.01em; color:var(--bone); }
.brand .mk{ width:22px; height:22px; flex:0 0 auto; }
.nav-cta{ font-size:.82rem; font-weight:600; letter-spacing:.02em; text-decoration:none; color:var(--bone); padding:9px 17px; border:1px solid var(--line); border-radius:100px; transition:all .25s var(--ease); }
.nav-cta:hover{ background:var(--red); border-color:var(--red); color:#fff; }

.hero__body{ position:relative; z-index:2; flex:1 1 auto; display:flex; align-items:flex-end;
  /* top padding matters on mobile: the hero content is tall enough to fill the
     box, so without it the eyebrow sits flush against the sticky nav. */
  padding-top:clamp(36px,5.7vh,60px); padding-bottom:clamp(36px,6vh,86px); }
.hero__content{ max-width:660px; }
.hero__content .eyebrow{ margin-bottom:20px; }
.hero h1{ font-size:clamp(3rem, 6.8vw, 6.2rem); margin-bottom:20px; }
.hero h1 .em{ color:var(--red-hi); }
.hero .subhead{ font-family:'Bricolage Grotesque'; font-weight:500; font-size:clamp(1.2rem,1.4vw + .7rem,1.6rem); line-height:1.25; color:var(--bone); max-width:30ch; margin-bottom:16px; letter-spacing:-.01em; }
.hero .dek{ font-size:clamp(1rem,.4vw + .9rem,1.08rem); color:var(--bone-dim); max-width:52ch; margin-bottom:26px; }
.hero .dek b{ color:var(--bone); font-weight:600; }

/* hero video controls */
.hero__controls{ position:absolute; z-index:3; right:var(--gutter); bottom:clamp(24px,5vh,60px); display:flex; align-items:center; gap:12px; }
.vbtn{ display:inline-flex; align-items:center; gap:9px; cursor:pointer; border:1px solid var(--line); background:rgba(16,15,18,.55); backdrop-filter:blur(8px); color:var(--bone);
  border-radius:100px; padding:9px 16px 9px 12px; font-size:.8rem; font-weight:600; transition:all .25s var(--ease); }
.vbtn:hover{ border-color:var(--red); }
.vbtn .ic{ width:26px; height:26px; border-radius:50%; background:var(--red); color:#fff; display:grid; place-items:center; flex:0 0 auto; }
.vbtn .ic svg{ width:13px; height:13px; }
@media (max-width:720px){ .hero__controls{ position:static; padding:0 var(--gutter) 28px; justify-content:flex-start; } }

/* ============================================================
   Section shell
   ============================================================ */
.sec{ padding:clamp(64px,9vw,120px) 0; }
.sec-head{ max-width:760px; margin-bottom:clamp(36px,4.5vw,56px); }
.sec-head .eyebrow{ margin-bottom:18px; }
.sec-head h2{ margin-bottom:16px; }
.sec-head p{ color:var(--bone-dim); font-size:clamp(1.02rem,.5vw + .9rem,1.15rem); max-width:60ch; }

/* ---- Qualification ---- */
.qualify{ background:var(--ink-2); }
.qualify .grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(32px,5vw,72px); align-items:center; }
@media (max-width:860px){ .qualify .grid{ grid-template-columns:1fr; gap:36px; } }
.qlist{ list-style:none; display:grid; gap:14px; margin:6px 0 26px; }
.qlist li{ display:flex; gap:14px; align-items:flex-start; font-size:clamp(1.02rem,.5vw + .92rem,1.16rem); color:var(--bone-2); }
.qlist .tick{ flex:0 0 auto; width:26px; height:26px; border-radius:8px; background:rgba(216,64,46,.14); border:1px solid rgba(216,64,46,.4); color:var(--red-hi); display:grid; place-items:center; margin-top:2px; }
.qlist .tick svg{ width:14px; height:14px; }
.qlist b{ color:#fff; font-weight:600; }
.bridge{ font-family:'Bricolage Grotesque'; font-weight:600; font-size:clamp(1.2rem,1.4vw,1.5rem); line-height:1.3; color:var(--bone); border-left:3px solid var(--red); padding-left:18px; }
.bridge em{ font-style:normal; color:var(--red-hi); }
.q-photo{ position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/5; box-shadow:var(--shadow); border:1px solid var(--line); }
.q-photo img{ width:100%; height:100%; object-fit:cover; }
.q-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%, rgba(16,15,18,.5)); }

/* ---- Why masterclass first ---- */
.why .lede{ max-width:720px; margin-bottom:clamp(34px,4vw,52px); }
.why .lede .q{ font-family:'Bricolage Grotesque'; font-weight:700; font-size:clamp(1.5rem,2.4vw,2.1rem); line-height:1.15; color:#fff; margin-bottom:16px; letter-spacing:-.015em; }
.why .lede p{ color:var(--bone-dim); font-size:clamp(1.02rem,.5vw + .9rem,1.14rem); }
.gets{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,22px); }
@media (max-width:820px){ .gets{ grid-template-columns:1fr; } }
.get{ position:relative; background:linear-gradient(180deg,var(--panel),var(--ink-2)); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(24px,2.4vw,32px); overflow:hidden; transition:transform .4s var(--ease-out), border-color .4s; }
.get:hover{ transform:translateY(-4px); border-color:rgba(216,64,46,.4); }
.get .mk{ width:34px; height:2px; background:var(--red); margin-bottom:18px; }
.get h3{ font-size:clamp(1.16rem,1.4vw,1.4rem); font-weight:700; margin-bottom:10px; color:#fff; letter-spacing:-.01em; }
.get p{ color:var(--bone-dim); font-size:clamp(.96rem,.4vw + .88rem,1.04rem); }
.get p b{ color:var(--red-hi); font-weight:600; }
.why-note{ margin:clamp(28px,3.5vw,40px) 0 0; color:var(--bone-dim); font-size:clamp(1rem,.5vw + .9rem,1.1rem); max-width:60ch; }
.why-note b{ color:var(--bone); font-weight:600; }
.why-cta{ margin-top:clamp(26px,3vw,36px); }

/* ---- Meet Varad ---- */
.meet{ background:var(--ink-2); }
.meet .grid{ display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(32px,5vw,72px); align-items:center; }
@media (max-width:900px){ .meet .grid{ grid-template-columns:1fr; gap:34px; } }
.meet-photo{ position:relative; }
.meet-photo .main{ border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/5; box-shadow:var(--shadow); border:1px solid var(--line); }
.meet-photo .main img{ width:100%; height:100%; object-fit:cover; }
.meet-photo .tag{ position:absolute; left:16px; bottom:16px; z-index:2; font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--bone); background:rgba(16,15,18,.6); backdrop-filter:blur(6px); border:1px solid var(--line); padding:6px 12px; border-radius:100px; }
.meet h2{ margin-bottom:18px; }
.meet p{ color:var(--bone-dim); font-size:clamp(1.02rem,.5vw + .92rem,1.14rem); margin-bottom:16px; max-width:60ch; }
.meet p .nm{ color:#fff; font-weight:600; }
.meet .pull{ font-family:'Bricolage Grotesque'; font-weight:600; font-size:clamp(1.16rem,1.5vw,1.42rem); line-height:1.3; color:var(--bone); border-left:3px solid var(--red); padding-left:18px; margin:22px 0; }
.meet .pull em{ font-style:normal; color:var(--red-hi); }
.creds{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2vw,26px); margin-top:26px; border-top:1px solid var(--line); padding-top:26px; }
@media (max-width:560px){ .creds{ grid-template-columns:1fr; } }
.cred .lb{ font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--red); margin-bottom:8px; }
.cred .vl{ font-size:.98rem; color:var(--bone-2); line-height:1.5; }
.cred .vl b{ color:#fff; font-weight:600; }

/* ---- On stage (photo gallery) ---- */
.stage{ background:var(--ink); }
.stage-grid{ display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:220px; gap:clamp(10px,1.2vw,16px); }
.stage-grid figure{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); }
.stage-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-out); }
.stage-grid figure:hover img{ transform:scale(1.05); }
.stage-grid .wide{ grid-column:span 2; }
.stage-grid .tall{ grid-row:span 2; }
.stage-grid figcaption{ position:absolute; left:0; right:0; bottom:0; padding:26px 16px 12px; font-size:.76rem; font-weight:600; letter-spacing:.04em; color:var(--bone); background:linear-gradient(0deg, rgba(16,15,18,.85), transparent); }
@media (max-width:900px){ .stage-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:180px; grid-auto-flow:dense; } .stage-grid .wide{ grid-column:span 2; } .stage-grid .tall{ grid-row:span 2; } }

/* ---- Final CTA ---- */
.final{ position:relative; overflow:hidden; text-align:center; padding:clamp(80px,12vw,160px) 0; }
.final__bg{ position:absolute; inset:0; z-index:0; }
.final__bg img{ width:100%; height:100%; object-fit:cover; object-position:50% 35%; }
.final__scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(16,15,18,.86), rgba(16,15,18,.78)), radial-gradient(60% 60% at 50% 30%, rgba(138,36,26,.4), transparent 70%); }
.final .in{ position:relative; z-index:2; max-width:720px; margin-inline:auto; }
.final .eyebrow{ justify-content:center; margin-bottom:20px; }
.final h2{ margin-bottom:14px; }
.final p{ color:var(--bone-dim); font-size:clamp(1.02rem,.5vw + .9rem,1.16rem); margin-bottom:32px; }
.final .capture{ margin-inline:auto; }
.final .microcopy{ justify-content:center; }

/* ---- Footer ---- */
footer{ background:#0B0A0D; color:var(--bone-mut); padding:44px 0; }
.foot{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.82rem; }
.foot .brand{ font-size:1rem; }
.foot a{ color:var(--bone-dim); text-decoration:none; }
.foot a:hover{ color:var(--red-hi); }

/* ---- reveal ---- */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s } .reveal.d2{ transition-delay:.16s } .reveal.d3{ transition-delay:.24s }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1!important; transform:none!important; transition:none!important } .hero__grain{ display:none } }

/* ============================================================
   MASTERCLASS (unlocked after email) + APPLICATION form
   ============================================================ */
.masterclass{ background:linear-gradient(180deg,#0B0A0D,var(--ink)); }
.masterclass[hidden]{ display:none; }
.mc-head{ text-align:center; max-width:720px; margin:0 auto clamp(28px,3.5vw,44px); }
.mc-head .eyebrow{ justify-content:center; margin-bottom:16px; }
.mc-head h2{ margin-bottom:12px; }
.mc-head p{ color:var(--bone-dim); font-size:clamp(1.02rem,.5vw + .9rem,1.15rem); }
.mc-frame{ position:relative; max-width:1000px; margin:0 auto; aspect-ratio:16/9; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow); background:#000; }
.mc-frame iframe, .mc-frame video{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.mc-frame .ph{ position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:28px; color:var(--bone-dim); background:radial-gradient(60% 60% at 50% 40%, rgba(138,36,26,.35), transparent 70%), #0f0d10; }
.mc-frame .ph b{ color:var(--bone); font-weight:600; display:block; margin-bottom:6px; }
.mc-below{ text-align:center; margin-top:clamp(26px,3vw,38px); }
.mc-below p{ color:var(--bone-dim); margin-bottom:16px; }

.apply{ position:relative; background:var(--ink-2); scroll-margin-top:20px; }
.apply{ padding-top:clamp(44px,6vw,80px); }
.apply .intro{ max-width:720px; margin:0 auto clamp(22px,2.6vw,34px); text-align:center; }
.apply .intro .eyebrow{ justify-content:center; margin-bottom:16px; }
.apply .intro h2{ margin-bottom:16px; }
.apply .intro p{ color:var(--bone-dim); font-size:clamp(1rem,.5vw + .9rem,1.1rem); margin-bottom:8px; }
.apply .intro p b{ color:var(--bone); font-weight:600; }
.appform{ max-width:720px; margin:0 auto; }
.fsec{ border-top:1px solid var(--line); padding-top:clamp(24px,3vw,34px); margin-top:clamp(24px,3vw,34px); }
.fsec:first-of-type{ border-top:0; padding-top:0; margin-top:0; }
.fsec > .lbl{ font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--red); margin-bottom:20px; display:block; }
.fld{ margin-bottom:22px; }
.fld > label{ display:block; font-weight:600; color:var(--bone); font-size:1.02rem; margin-bottom:4px; line-height:1.3; }
.fld > label .req{ color:var(--red); }
.fld .hint{ font-size:.86rem; color:var(--bone-mut); margin-bottom:10px; line-height:1.4; }
.fld input[type=text], .fld input[type=email], .fld input[type=url], .fld textarea{
  width:100%; background:rgba(244,240,232,.05); border:1px solid var(--line); border-radius:11px;
  color:var(--bone); font:inherit; font-size:1rem; padding:12px 14px; transition:border-color .2s;
}
.fld textarea{ min-height:96px; resize:vertical; line-height:1.5; }
.fld input:focus, .fld textarea:focus{ outline:none; border-color:var(--red); background:rgba(244,240,232,.07); }
.fld input::placeholder, .fld textarea::placeholder{ color:var(--bone-mut); }
.fld .count{ font-size:.76rem; color:var(--bone-mut); text-align:right; margin-top:5px; }
.opts{ display:grid; gap:9px; }
.opt{ display:flex; align-items:flex-start; gap:12px; padding:13px 15px; border:1px solid var(--line); border-radius:11px; cursor:pointer; transition:border-color .2s, background .2s; }
.opt:hover{ border-color:rgba(216,64,46,.4); }
.opt input{ margin-top:3px; accent-color:var(--red); flex:0 0 auto; width:17px; height:17px; }
.opt span{ color:var(--bone-2); font-size:.98rem; line-height:1.35; }
.opt:has(input:checked){ border-color:var(--red); background:rgba(216,64,46,.08); }
.fld.err input, .fld.err textarea{ border-color:#e8563f; }
.fld.err .opts{ outline:1px solid #e8563f; outline-offset:4px; border-radius:12px; }
.appform .submit-row{ margin-top:30px; }
.appform .btn{ width:100%; justify-content:center; font-size:1.05rem; padding:17px 26px; }
.app-error{ display:none; margin-top:14px; color:#ff8a72; font-weight:500; font-size:.92rem; text-align:center; }
.app-error.show{ display:block; }
.app-note{ text-align:center; font-size:.85rem; color:var(--bone-mut); margin-top:14px; }
.appform.done .fsec, .appform.done .submit-row, .appform.done .app-error, .appform.done .app-note{ display:none; }
.app-thanks{ display:none; text-align:center; padding:clamp(30px,5vw,60px) 20px; }
.appform.done .app-thanks{ display:block; }
.app-thanks .ck{ width:60px; height:60px; border-radius:50%; background:var(--red); color:#fff; display:grid; place-items:center; margin:0 auto 22px; }
.app-thanks h3{ font-size:clamp(1.6rem,3vw,2.2rem); margin-bottom:12px; }
.app-thanks p{ color:var(--bone-dim); max-width:46ch; margin:0 auto 26px; font-size:1.05rem; }
@media (max-width:560px){ .appform .row2{ grid-template-columns:1fr; } }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:560px){ .row2{ grid-template-columns:1fr; } }

/* ---- video modal ---- */
.modal{ position:fixed; inset:0; z-index:60; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(8,7,10,.9); backdrop-filter:blur(8px); }
.modal.open{ display:flex; }
.modal .box{ width:min(1000px,100%); border-radius:16px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line); background:#000; }
.modal video{ width:100%; height:auto; max-height:82vh; display:block; }
.modal .close{ position:absolute; top:18px; right:18px; width:46px; height:46px; border-radius:50%; background:rgba(244,240,232,.14); color:var(--bone); border:1px solid var(--line); cursor:pointer; display:grid; place-items:center; font-size:20px; }
.modal .close:hover{ background:var(--red); border-color:var(--red); color:#fff; }

/* ============================================================
   SITE NAV (multi-page) - shared across Home / Masterclass / Mentorship
   ============================================================ */
.sitenav{ position:sticky; top:0; z-index:50; background:rgba(16,15,18,.82); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.sitenav .in{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:18px; padding-block:13px; }
.sitenav .brand{ justify-self:start; }
.sitenav .links{ justify-self:center; }
.sitenav .cta{ justify-self:end; }
.sitenav .brand{ display:flex; align-items:center; gap:.55em; font-family:'Bricolage Grotesque',system-ui,sans-serif; font-weight:700; font-size:1.02rem; letter-spacing:-.01em; color:var(--bone); text-decoration:none; white-space:nowrap; }
.sitenav .brand svg{ width:21px; height:21px; flex:0 0 auto; }
.sitenav .links{ display:flex; align-items:center; gap:4px; }
.sitenav .links a{
  font-size:.88rem; font-weight:500; color:var(--bone-dim); text-decoration:none;
  padding:8px 14px; border-radius:9px; transition:color .2s var(--ease), background .2s var(--ease); white-space:nowrap;
}
.sitenav .links a:hover{ color:var(--bone); background:rgba(244,240,232,.06); }
.sitenav .links a[aria-current="page"]{ color:var(--bone); font-weight:600; background:rgba(216,64,46,.14); }
.sitenav .cta{
  font-size:.86rem; font-weight:600; color:#fff; text-decoration:none; white-space:nowrap;
  background:linear-gradient(180deg,var(--red-hi),var(--red-deep)); padding:10px 18px; border-radius:9px;
  box-shadow:0 6px 18px rgba(216,64,46,.28), inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .2s var(--ease), filter .2s var(--ease);
}
.sitenav .cta:hover{ transform:translateY(-1px); filter:brightness(1.07); }
/* hero sits under the sticky nav: it is translucent, so no offset needed */
.hero--page{ min-height:auto; padding:clamp(52px,8vw,96px) 0 clamp(44px,6vw,72px); }
@media (max-width:760px){
  .sitenav .in{ grid-template-columns:1fr auto; gap:10px; padding-block:10px; }
  .sitenav .links{ grid-column:1 / -1; justify-self:stretch; width:100%; justify-content:center; gap:2px; border-top:1px solid var(--line); padding-top:8px; }
  .sitenav .links a{ padding:7px 11px; font-size:.83rem; }
  .sitenav .cta{ padding:9px 15px; font-size:.82rem; }
}

/* page-intro hero used by Masterclass + Mentorship pages */
.pagehero{ position:relative; overflow:hidden; border-bottom:1px solid var(--line); }
.pagehero__bg{ position:absolute; inset:0; z-index:0; }
.pagehero__bg img{ width:100%; height:100%; object-fit:cover; }
.pagehero__scrim{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(16,15,18,.62) 0%, rgba(16,15,18,.85) 58%, var(--ink) 100%),
             linear-gradient(90deg, rgba(16,15,18,.72) 0%, rgba(16,15,18,.35) 55%, rgba(16,15,18,.6) 100%); }
/* padding-block only: a `padding: X 0` shorthand would wipe .wrap's
   padding-inline and run the hero text flush to the screen edge on mobile. */
.pagehero .in{ position:relative; z-index:2; padding-block:clamp(40px,6vw,88px) clamp(34px,5vw,64px); max-width:820px; }
.pagehero h1{ font-size:clamp(2.05rem,5.4vw,4.2rem); font-weight:700; letter-spacing:-.02em; line-height:1.05; margin-bottom:14px; text-wrap:balance; }
.pagehero h1 .em{ color:var(--red-hi); }
.pagehero .sub{ font-size:clamp(1.05rem,.6vw + .95rem,1.28rem); color:var(--bone-dim); max-width:56ch; }
.pagehero .sub b{ color:var(--bone); font-weight:600; }
.pagehero .eyebrow{ margin-bottom:18px; }

/* two-path cards (home) */
.paths{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2vw,24px); }
@media (max-width:780px){ .paths{ grid-template-columns:1fr; } }
.path{
  position:relative; display:flex; flex-direction:column; text-decoration:none;
  background:linear-gradient(180deg,var(--panel),var(--ink-2)); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:clamp(26px,3vw,38px); overflow:hidden;
  transition:transform .4s var(--ease-out), border-color .4s var(--ease);
}
.path:hover{ transform:translateY(-4px); border-color:rgba(216,64,46,.45); }
.path .step{ font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--red); margin-bottom:14px; }
.path h3{ font-size:clamp(1.3rem,1.9vw,1.65rem); font-weight:700; margin-bottom:10px; letter-spacing:-.01em; }
.path p{ color:var(--bone-dim); font-size:.99rem; margin-bottom:20px; flex:1 1 auto; }
.path .go{ display:inline-flex; align-items:center; gap:.5em; font-weight:600; color:var(--red-hi); font-size:.95rem; }
.path .go .arw{ transition:transform .25s var(--ease); }
.path:hover .go .arw{ transform:translateX(4px); }
.path.is-free{ border-color:rgba(216,64,46,.32); }

/* hero action buttons (home) + end CTA block */
.hero-actions{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.btn-ghost{
  display:inline-flex; align-items:center; gap:.5em; text-decoration:none;
  font-family:'Inter',sans-serif; font-weight:600; font-size:1rem; color:var(--bone);
  padding:15px 24px; border-radius:11px; border:1px solid rgba(244,240,232,.25);
  background:rgba(244,240,232,.05); backdrop-filter:blur(8px);
  transition:background .25s var(--ease), border-color .25s var(--ease), transform .2s var(--ease);
}
.btn-ghost:hover{ background:rgba(244,240,232,.11); border-color:rgba(244,240,232,.45); transform:translateY(-2px); }
.endcta{ max-width:660px; }
.endcta .eyebrow{ margin-bottom:16px; }
.endcta h2{ margin-bottom:14px; }
.endcta p{ color:var(--bone-dim); font-size:clamp(1.02rem,.5vw + .9rem,1.15rem); margin-bottom:26px; }

/* anchor targets must clear the sticky nav when jumped to via #hash */
:target, #apply, #masterclass, #start, #mcGate{ scroll-margin-top:calc(var(--navh, 58px) + 16px); }

/* honeypot: real people never see or focus this; bots fill every field */
.hp-field{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }

/* email capture sits inside the page hero on the masterclass page */
.pagehero .capture{ margin-top:clamp(22px,3vw,32px); }
.pagehero #mcGate[hidden]{ display:none; }

/* ============================================================
   REVIEWS / social proof
   ============================================================ */
.reviews{ background:var(--ink-2); }
.rev-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,22px); align-items:start; }
@media (max-width:900px){ .rev-grid{ grid-template-columns:1fr; } }
.rev{
  display:flex; flex-direction:column;   /* no height:100% - cards size to their text so a short review leaves no void */
  background:linear-gradient(180deg,var(--panel),var(--ink-2));
  border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(22px,2.3vw,30px);
  transition:transform .4s var(--ease-out), border-color .4s var(--ease);
}
.rev:hover{ transform:translateY(-4px); border-color:rgba(216,64,46,.4); }
.rev__top{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.rev__av{
  flex:0 0 auto; width:42px; height:42px; border-radius:50%;
  background:linear-gradient(180deg,var(--red-hi),var(--red-deep)); color:#fff;
  display:grid; place-items:center; font-weight:700; font-size:.86rem; letter-spacing:.02em;
}
.rev__who{ min-width:0; }
.rev__name{ font-weight:600; color:#fff; font-size:.98rem; line-height:1.25; }
.rev__date{ font-size:.78rem; color:var(--bone-mut); margin-top:2px; }
.rev__stars{ display:flex; gap:2px; color:var(--red-hi); margin-bottom:12px; }
.rev__stars svg{ width:16px; height:16px; }
.rev p{ color:var(--bone-dim); font-size:.97rem; line-height:1.6; }
.rev p + p{ margin-top:.7em; }
.rev__badge{
  display:inline-flex; align-items:center; gap:7px; margin-top:16px;
  font-size:.74rem; font-weight:600; letter-spacing:.02em; color:var(--bone-mut);
}
.rev__badge svg{ width:13px; height:13px; color:var(--red); }

/* 2-up variant of the review grid (used on the masterclass page) */
.rev-grid--two{ grid-template-columns:repeat(2,1fr); max-width:900px; }
@media (max-width:900px){ .rev-grid--two{ grid-template-columns:1fr; } }

/* social proof sitting inside the hero, directly under the email form */
.hero-proof{ margin-top:clamp(26px,3.4vw,40px); max-width:820px; }
.hero-proof__label{
  font-size:11.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--bone-mut); margin-bottom:12px;
}
/* compact the shared card a little in this tighter context */
.hero-proof .rev{ padding:clamp(18px,1.9vw,22px); background:rgba(244,240,232,.05); backdrop-filter:blur(6px); }
.hero-proof .rev p{ font-size:.92rem; }
.hero-proof .rev__av{ width:36px; height:36px; font-size:.78rem; }
.hero-proof .rev-grid--two{ gap:clamp(12px,1.4vw,16px); }

/* ad-traffic application page: brand bar only, no nav links */
.adbar{ border-bottom:1px solid var(--line); background:var(--ink-2); }
.adbar .in{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:14px; }
.adbar .brand{ display:flex; align-items:center; gap:.55em; font-family:'Bricolage Grotesque',system-ui,sans-serif; font-weight:700; font-size:1.02rem; color:var(--bone); text-decoration:none; }
.adbar .brand svg{ width:21px; height:21px; flex:0 0 auto; }
.adbar__tag{ font-size:.74rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--red); }
@media (max-width:520px){ .adbar__tag{ display:none; } }
.apply--short .intro{ text-align:left; max-width:720px; margin-inline:0; }
/* keep the form on the same left edge as the intro on the ad page */
.apply--short .appform{ margin-inline:0; }
.apply--short .intro h1{ margin-bottom:14px; }

/* /masterclass - post-signup thank-you + player */
.mcthanks__head{ max-width:760px; margin-bottom:clamp(24px,3vw,36px); }
.mcthanks__tick{
  width:52px; height:52px; border-radius:50%; margin-bottom:18px;
  background:linear-gradient(180deg,var(--red-hi),var(--red-deep)); color:#fff;
  display:grid; place-items:center; box-shadow:0 10px 30px rgba(216,64,46,.35);
}
.mcthanks__head .eyebrow{ margin-bottom:14px; }
.mcthanks__head h1{ margin-bottom:14px; }
.mcthanks__head p{ color:var(--bone-dim); font-size:clamp(1rem,.5vw + .9rem,1.12rem); }
.mcthanks__head p b{ color:var(--bone); font-weight:600; }