/* ═══════════════════════════════════════════════════════════
   MUSIC HABITAT · GLOBAL STYLESHEET · styles.css
   musichabitat.com · Where Live Music Lives
   ═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&family=DM+Sans:wght@300;400;500;600&display=swap');

/* ── TOKENS ─────────────────────────────────────────────────── */
:root {
  --ink:       #08090F;
  --ink-2:     #0D0F1A;
  --ink-3:     #131726;
  --ink-4:     #1A1F35;
  --teal:      #1ECECA;
  --teal-dim:  rgba(30,206,202,.12);
  --teal-glow: rgba(30,206,202,.25);
  --teal-fog:  rgba(30,206,202,.06);
  --gold:      #F0A500;
  --gold-dim:  rgba(240,165,0,.12);
  --gold-glow: rgba(240,165,0,.25);
  --gold-fog:  rgba(240,165,0,.06);
  --white:     #F6F4EF;
  --cream:     #C4C0B4;
  --hairline:  rgba(30,206,202,.12);
  --hairline-w:rgba(246,244,239,.07);
  --error:     #FF6B6B;
  --ff-disp:   'Bebas Neue', sans-serif;
  --ff-serif:  'Cormorant Garamond', serif;
  --ff-body:   'DM Sans', sans-serif;
  --max-w:     1240px;
  --nav-h:     80px;
  --r:         3px;
  --ease:      cubic-bezier(.16,1,.3,1);
}

/* ── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
*::before,*::after{pointer-events:none}
html{scroll-behavior:smooth;overflow-x:hidden;font-size:16px}
body{background:var(--ink);color:var(--white);font-family:var(--ff-body);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
ul,ol{list-style:none}

/* Film grain */
body::after{
  content:'';position:fixed;inset:0;z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
  background-size:300px 300px;pointer-events:none;mix-blend-mode:overlay;
  animation:grain .5s steps(1) infinite;
}
@keyframes grain{0%{background-position:0 0}25%{background-position:-40px 20px}50%{background-position:20px -40px}75%{background-position:-20px -20px}}

@media(prefers-reduced-motion:reduce){
  body::after{animation:none}
  .sr,.sr-fast{transition:none!important;opacity:1!important;transform:none!important}
  .marquee-track,.countdown-sep,.badge-dot{animation:none}
}

/* ── LAYOUT ─────────────────────────────────────────────────── */
.wrap{max-width:var(--max-w);margin:0 auto;padding:0 40px}
section{padding:160px 0;position:relative}

/* ── ACCESSIBILITY ──────────────────────────────────────────── */
.skip-link{position:absolute;top:-100px;left:16px;background:var(--teal);color:var(--ink);padding:10px 20px;border-radius:var(--r);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;z-index:9999;transition:top .2s}
.skip-link:focus{top:16px}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:var(--r)}
:focus:not(:focus-visible){outline:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
button,a,input,select,textarea,[tabindex]{pointer-events:all}

/* ── SCROLL REVEAL ──────────────────────────────────────────── */
.sr{opacity:0;transform:translateY(32px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.sr.in{opacity:1;transform:none}
.sr-fast{opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.sr-fast.in{opacity:1;transform:none}
.sr-fade{opacity:0;transition:opacity .85s var(--ease)}.sr-fade.in{opacity:1}
.sr-scale{opacity:0;transform:scale(.96);transition:opacity .7s var(--ease),transform .7s var(--ease)}.sr-scale.in{opacity:1;transform:scale(1)}
.sr-d1{transition-delay:.1s}.sr-d2{transition-delay:.2s}.sr-d3{transition-delay:.3s}
.sr-d4{transition-delay:.4s}.sr-d5{transition-delay:.5s}.sr-d6{transition-delay:.6s}

/* ── TYPOGRAPHY ─────────────────────────────────────────────── */
.section-hl{font-family:var(--ff-disp);font-size:clamp(2.6rem,5vw,5.5rem);line-height:.93;letter-spacing:.02em;text-transform:uppercase;margin-bottom:32px}
.overline{display:inline-flex;align-items:center;gap:10px;font-size:.6rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--teal);margin-bottom:24px}
.overline::before{content:'';width:24px;height:1px;background:var(--teal);opacity:.6}
.overline-gold{color:var(--gold)}.overline-gold::before{background:var(--gold)}
.teal{color:var(--teal)}.gold{color:var(--gold)}.cream{color:var(--cream)}
.divider{width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--hairline),transparent);margin:0}
.rule-teal{border:none;height:1px;background:linear-gradient(90deg,transparent,var(--teal),transparent);opacity:.25;margin:48px 0}
.rule-gold{border:none;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.25;margin:48px 0}

/* ── BUTTONS ────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--ff-body);font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:15px 32px;border-radius:var(--r);border:none;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s,background .2s,border-color .2s;white-space:nowrap;pointer-events:all}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0) scale(.98)}
.btn-arrow{display:inline-block;transition:transform .2s}.btn:hover .btn-arrow{transform:translateX(4px)}
.btn-teal{background:var(--teal);color:var(--ink);box-shadow:0 0 28px var(--teal-glow)}.btn-teal:hover{box-shadow:0 0 48px rgba(30,206,202,.45)}
.btn-gold{background:var(--gold);color:var(--ink);box-shadow:0 0 28px var(--gold-glow)}.btn-gold:hover{box-shadow:0 0 48px rgba(240,165,0,.45)}
.btn-outline{background:transparent;color:var(--white);border:1px solid var(--hairline-w)}.btn-outline:hover{border-color:rgba(30,206,202,.4);color:var(--teal);background:var(--teal-fog)}
.btn-outline-gold{background:transparent;color:var(--gold);border:1px solid rgba(240,165,0,.3)}.btn-outline-gold:hover{border-color:var(--gold);background:var(--gold-fog)}
.btn-sm{padding:11px 24px;font-size:.68rem}.btn-lg{padding:19px 44px;font-size:.82rem}

/* ── BADGE ──────────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:8px;font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:7px 18px;border-radius:100px;border:1px solid var(--hairline);background:var(--teal-dim);color:var(--teal);margin-bottom:24px}
.badge-dot{width:6px;height:6px;background:var(--teal);border-radius:50%;animation:livePulse 2s infinite;flex-shrink:0}
.badge-gold{background:var(--gold-dim);color:var(--gold);border-color:rgba(240,165,0,.2)}.badge-gold .badge-dot{background:var(--gold)}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 3px var(--teal-glow)}50%{box-shadow:0 0 0 9px transparent}}

/* ── CARDS ──────────────────────────────────────────────────── */
.card{background:var(--ink-2);border:1px solid var(--hairline);border-radius:6px;padding:44px 36px;position:relative;overflow:hidden;transition:background .3s,border-color .3s,transform .3s var(--ease)}
.card:hover{background:var(--ink-3);transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.3),0 0 0 1px rgba(30,206,202,.1)}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.card:hover::before{transform:scaleX(1)}
.card-teal::before{background:var(--teal)}.card-gold::before{background:var(--gold)}

/* ── FORMS ──────────────────────────────────────────────────── */
.f{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.f label{font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cream);opacity:.55}
.req{color:var(--teal);margin-left:2px}.opt{font-size:.58rem;font-weight:400;letter-spacing:.06em;color:var(--cream);opacity:.35;text-transform:none;font-style:italic}
.f input,.f select,.f textarea{background:var(--ink-3);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:15px 18px;color:var(--white);outline:none;-webkit-appearance:none;appearance:none;transition:border-color .2s,box-shadow .2s;pointer-events:all}
.f input::placeholder,.f textarea::placeholder{color:rgba(196,192,180,.2)}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(30,206,202,.09)}
.f select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%231ECECA' opacity='.45'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;cursor:pointer}
.f select option{background:var(--ink-3)}
.f textarea{resize:vertical;min-height:96px}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field-err{display:block;font-size:.68rem;color:var(--error);margin-top:3px;min-height:16px;opacity:0;transition:opacity .18s}
.field-err.visible{opacity:1}
.f input.invalid,.f select.invalid,.f textarea.invalid{border-color:var(--error)!important;box-shadow:0 0 0 3px rgba(255,107,107,.09)!important}
.form-submit{width:100%;font-weight:700;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;padding:17px;border-radius:var(--r);border:none;cursor:pointer;margin-top:24px;transition:transform .2s,box-shadow .2s,opacity .2s;pointer-events:all}
.form-submit:disabled{opacity:.38;cursor:not-allowed;transform:none!important}
.submit-teal{background:var(--teal);color:var(--ink);box-shadow:0 0 26px var(--teal-glow)}.submit-teal:hover{transform:translateY(-2px);box-shadow:0 0 44px rgba(30,206,202,.42)}
.submit-gold{background:var(--gold);color:var(--ink);box-shadow:0 0 26px var(--gold-glow)}.submit-gold:hover{transform:translateY(-2px);box-shadow:0 0 44px rgba(240,165,0,.42)}
.form-privacy{text-align:center;font-size:.64rem;color:var(--cream);opacity:.28;letter-spacing:.06em;margin-top:12px;line-height:1.6}
.form-success{display:none;text-align:center;padding:56px 24px;animation:successIn .6s var(--ease)}
.fs-icon{font-size:2.6rem;margin-bottom:16px}
.fs-title{font-family:var(--ff-disp);font-size:2rem;letter-spacing:.06em;text-transform:uppercase;color:var(--teal);margin-bottom:12px}
.fs-title-gold{color:var(--gold)}
.fs-body{font-size:.9rem;color:var(--cream);opacity:.62;line-height:1.75;max-width:380px;margin:0 auto}
@keyframes successIn{from{opacity:0;transform:scale(.96) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.btn-spin::after{content:'';display:inline-block;width:14px;height:14px;border:2px solid rgba(8,9,15,.3);border-top-color:var(--ink);border-radius:50%;animation:spin .7s linear infinite;margin-left:8px;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── MARQUEE ────────────────────────────────────────────────── */
.marquee-wrap{background:var(--teal);overflow:hidden;padding:11px 0}
.marquee-track{display:flex;width:max-content;animation:marqueeMove 32s linear infinite}
.marquee-item{display:inline-flex;align-items:center;gap:18px;padding:0 32px;white-space:nowrap;font-family:var(--ff-disp);font-size:.78rem;letter-spacing:.2em;color:var(--ink)}
.marquee-sep{width:4px;height:4px;background:var(--ink);border-radius:50%;opacity:.3}
@keyframes marqueeMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── COUNTDOWN ──────────────────────────────────────────────── */
.countdown-wrap{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap}
.countdown-unit{display:flex;flex-direction:column;align-items:center;padding:32px 40px;background:rgba(30,206,202,.05);border:1px solid var(--hairline);border-right:none;min-width:130px;transition:background .3s}
.countdown-unit:hover{background:rgba(30,206,202,.1)}
.countdown-unit:first-child{border-radius:6px 0 0 6px}
.countdown-unit:last-child{border-radius:0 6px 6px 0;border-right:1px solid var(--hairline)}
.countdown-num{font-family:var(--ff-disp);font-size:clamp(3rem,6vw,5.5rem);color:var(--teal);line-height:1;display:block}
.countdown-lbl{font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--cream);opacity:.45;margin-top:10px;display:block}
.countdown-sep{font-family:var(--ff-disp);font-size:3rem;color:var(--teal);opacity:.25;padding:0 4px;animation:sepBlink 1s ease-in-out infinite;align-self:center}
@keyframes sepBlink{0%,100%{opacity:.18}50%{opacity:.7}}
@keyframes cdFlip{0%{transform:translateY(0);opacity:1}40%{transform:translateY(-12px);opacity:0}60%{transform:translateY(12px);opacity:0}100%{transform:translateY(0);opacity:1}}
.countdown-num.flip{animation:cdFlip .3s var(--ease)}

/* ── NAVIGATION ─────────────────────────────────────────────── */
#nav{position:fixed;top:0;left:0;right:0;z-index:600;height:var(--nav-h);display:flex;align-items:center;transition:background .45s,border-color .45s;border-bottom:1px solid transparent;pointer-events:all}
#nav.stuck{background:rgba(8,9,15,.93);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:var(--hairline)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;width:100%}
.nav-brand{font-family:var(--ff-disp);font-size:1.15rem;letter-spacing:.08em;display:flex;flex-direction:column;line-height:1;flex-shrink:0;color:var(--white);pointer-events:all}
.nav-brand-sub{font-family:var(--ff-body);font-size:.48rem;letter-spacing:.22em;color:var(--teal);font-weight:600;margin-top:4px;text-transform:uppercase}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links a{font-size:.7rem;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--cream);opacity:.65;transition:opacity .2s,color .2s;position:relative;pointer-events:all}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;right:0;height:1px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav-links a:hover,.nav-links a.active{opacity:1;color:var(--teal)}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
.nav-actions{display:flex;align-items:center;gap:14px;flex-shrink:0}
.nav-pill{background:var(--teal)!important;color:var(--ink)!important;opacity:1!important;padding:10px 22px;border-radius:100px;font-weight:700!important;box-shadow:0 0 24px var(--teal-glow);transition:transform .2s,box-shadow .2s!important}
.nav-pill:hover{transform:translateY(-2px);box-shadow:0 0 40px rgba(30,206,202,.4)!important}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;margin:-8px;pointer-events:all}
.hamburger span{display:block;width:22px;height:1.5px;background:var(--white);transition:all .3s}
.hamburger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
#mob-nav{display:none;position:fixed;inset:0;z-index:700;background:rgba(8,9,15,.97);flex-direction:column;align-items:center;justify-content:center;gap:20px;pointer-events:all}
#mob-nav.open{display:flex;animation:mobNavIn .35s var(--ease)}
@keyframes mobNavIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
#mob-nav a{font-family:var(--ff-disp);font-size:2.4rem;letter-spacing:.08em;color:var(--white);transition:color .2s,transform .2s var(--ease);pointer-events:all}
#mob-nav a:hover{color:var(--teal);transform:translateX(8px)}
.mob-nav-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px;align-items:center}
.mob-close{background:none;border:none;color:rgba(196,192,180,.4);font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;cursor:pointer;margin-top:20px;font-family:var(--ff-body);pointer-events:all}

/* ── FOOTER ─────────────────────────────────────────────────── */
#footer{background:var(--ink-2);border-top:1px solid var(--hairline);padding:80px 0 40px;pointer-events:all}
.footer-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:60px;margin-bottom:64px}
.footer-brand-name{font-family:var(--ff-disp);font-size:1.6rem;letter-spacing:.1em;color:var(--white);display:block;margin-bottom:6px}
.footer-brand-tag{font-family:var(--ff-serif);font-style:italic;font-size:1rem;color:var(--cream);opacity:.55;display:block;margin-bottom:20px}
.footer-brand-body{font-size:.84rem;color:var(--cream);opacity:.5;line-height:1.75;max-width:280px;margin-bottom:24px}
.footer-socials{display:flex;gap:10px;margin-top:4px}
.footer-social-link{width:36px;height:36px;background:var(--ink-3);border:1px solid var(--hairline);border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;color:var(--cream);opacity:.6;transition:opacity .2s,border-color .2s,color .2s;pointer-events:all}
.footer-social-link:hover{opacity:1;border-color:var(--teal);color:var(--teal)}
.footer-col-title{font-size:.62rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);margin-bottom:20px;display:block}
.footer-links{display:flex;flex-direction:column;gap:12px}
.footer-links a{font-size:.82rem;color:var(--cream);opacity:.55;transition:opacity .2s,color .2s;pointer-events:all}
.footer-links a:hover{opacity:1;color:var(--teal)}
.footer-newsletter{margin-top:12px}
.footer-newsletter-form{display:flex;gap:8px;margin-top:10px}
.footer-newsletter-input{flex:1;background:var(--ink-3);border:1px solid var(--hairline);border-radius:var(--r);padding:11px 14px;color:var(--white);outline:none;font-family:var(--ff-body);font-size:.82rem;transition:border-color .2s;pointer-events:all}
.footer-newsletter-input::placeholder{color:rgba(196,192,180,.2)}
.footer-newsletter-input:focus{border-color:var(--teal)}
.footer-newsletter-btn{background:var(--teal);color:var(--ink);border:none;border-radius:var(--r);padding:11px 18px;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:box-shadow .2s,transform .2s;pointer-events:all}
.footer-newsletter-btn:hover{box-shadow:0 0 20px var(--teal-glow);transform:translateY(-1px)}
.footer-bottom{padding-top:32px;border-top:1px solid var(--hairline);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.footer-copy{font-size:.7rem;color:var(--cream);opacity:.28;letter-spacing:.08em}
.footer-launch-note{font-size:.68rem;color:var(--teal);opacity:.6;letter-spacing:.12em;text-transform:uppercase}

/* ── FEATURE GRID ───────────────────────────────────────────── */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hairline);border:1px solid var(--hairline);border-radius:6px;overflow:hidden}
.feat-item{background:var(--ink-2);padding:32px 28px;transition:background .25s}
.feat-item:hover{background:var(--ink-3)}
.feat-icon{font-size:1.4rem;margin-bottom:16px;display:block}
.feat-title{font-weight:600;font-size:.9rem;margin-bottom:8px}
.feat-body{font-size:.8rem;color:var(--cream);opacity:.55;line-height:1.65}

/* ── PAGE HERO (inner pages) ────────────────────────────────── */
.page-hero{min-height:72svh;display:flex;align-items:flex-end;padding-top:calc(var(--nav-h) + 40px);padding-bottom:100px;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 70% at 50% 0%,rgba(30,206,202,.07),transparent 70%)}
.page-hero-hl{font-family:var(--ff-disp);font-size:clamp(3.5rem,7vw,7.5rem);line-height:.9;letter-spacing:.02em;text-transform:uppercase;margin-bottom:24px}
.page-hero-sub{font-size:clamp(1rem,1.4vw,1.15rem);color:var(--cream);opacity:.7;line-height:1.88;max-width:560px;margin-bottom:44px}

/* ── RESPONSIVE — TABLET ────────────────────────────────────── */
@media(max-width:960px){
  section{padding:100px 0}
  .wrap{padding:0 28px}
  .nav-links,.nav-actions{display:none}
  .hamburger{display:flex}
  .footer-grid{grid-template-columns:1fr 1fr;gap:40px}
  .feat-grid{grid-template-columns:1fr 1fr}
  .fg{grid-template-columns:1fr}
  .countdown-unit{padding:24px 28px;min-width:100px}
}

/* ── RESPONSIVE — MOBILE ────────────────────────────────────── */
@media(max-width:640px){
  section{padding:72px 0}
  .wrap{padding:0 20px}
  .footer-grid{grid-template-columns:1fr;gap:32px}
  .feat-grid{grid-template-columns:1fr}
  .footer-newsletter-form{flex-direction:column}
  .btn-lg{padding:16px 28px;font-size:.74rem}
  .section-hl{font-size:clamp(2.2rem,7vw,3.5rem)}
}

@media(max-width:480px){
  .countdown-wrap{display:grid;grid-template-columns:1fr 1fr;gap:2px}
  .countdown-sep{display:none}
  .countdown-unit{border-right:1px solid var(--hairline)!important;min-width:0}
  .countdown-unit:first-child{border-radius:6px 0 0 0}
  .countdown-unit:nth-child(3){border-radius:0 0 0 6px}
  .countdown-unit:last-child{border-radius:0 0 6px 0}
}

@media(max-width:380px){
  .wrap{padding:0 16px}
  .countdown-num{font-size:2.2rem}
  .countdown-lbl{font-size:.55rem}
  .countdown-unit{padding:16px 12px}
  .badge{font-size:.55rem;padding:6px 14px}
}

@media(min-width:1400px){:root{--max-w:1320px}}

/* ── PRINT ──────────────────────────────────────────────────── */
@media print{
  body::after,#nav,#mob-nav,.hamburger,.marquee-wrap,#footer{display:none!important}
  body{background:#fff!important;color:#000!important}
  a[href]::after{content:" (" attr(href) ")";font-size:.7rem;color:#666}
  section{padding:40px 0}
}

/* ══════════════════════════════════════════════════════════════
   THE HABITAT SESSIONS — SHARED STYLES
   ══════════════════════════════════════════════════════════════ */

/* Violet Sessions accent */
:root {
  --violet:     #7C3AED;
  --violet-dim: rgba(124,58,237,.14);
  --violet-glow:rgba(124,58,237,.3);
  --violet-fog: rgba(124,58,237,.06);
}

/* Sessions badge */
.badge-sessions {
  background: var(--violet-dim);
  color: #A78BFA;
  border-color: rgba(124,58,237,.25);
}
.badge-sessions .badge-dot { background: #A78BFA; }

/* Sessions overline */
.overline-sessions { color: #A78BFA; }
.overline-sessions::before { background: #A78BFA; }

/* Sessions headline accent */
.sessions-accent { color: #A78BFA; display: block; }

/* Live badge pill */
.live-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,40,40,.12);
  border: 1px solid rgba(255,60,60,.25);
  border-radius: 100px; padding: 6px 16px;
  font-size: .62rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,90,90,.9);
}
.live-pill-dot {
  width: 6px; height: 6px; background: rgba(255,70,70,.9);
  border-radius: 50%; animation: livePulse 1.5s infinite; flex-shrink: 0;
}

/* Episode card */
.ep-card {
  background: var(--ink-2);
  border: 1px solid var(--hairline);
  border-radius: 6px; overflow: hidden;
  transition: border-color .3s, background .3s, transform .3s var(--ease);
  position: relative;
}
.ep-card:hover { border-color: rgba(124,58,237,.35); background: var(--ink-3); transform: translateY(-4px); }
.ep-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--violet); transform: scaleX(0); transform-origin: left;
  transition: transform .4s var(--ease);
}
.ep-card:hover::before { transform: scaleX(1); }
.ep-thumb {
  aspect-ratio: 16/9; background: var(--ink-3);
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.ep-thumb-bg {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--violet-fog), rgba(30,206,202,.04));
}
.ep-thumb-icon { font-size: 2.5rem; position: relative; z-index: 1; opacity: .6; }
.ep-thumb-label {
  position: absolute; bottom: 10px; left: 12px;
  font-size: .58rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: #A78BFA; background: rgba(0,0,0,.6); padding: 4px 10px; border-radius: 100px;
}
.ep-body { padding: 20px; }
.ep-ep { font-size: .58rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #A78BFA; margin-bottom: 6px; display: block; }
.ep-title { font-weight: 600; font-size: .92rem; color: var(--white); margin-bottom: 6px; }
.ep-meta { font-size: .75rem; color: var(--cream); opacity: .45; }

/* Sessions flow step */
.sessions-flow { display: flex; flex-direction: column; gap: 2px; }
.sflow-item {
  display: flex; align-items: flex-start; gap: 20px;
  padding: 22px 24px;
  background: var(--ink-3); border: 1px solid var(--hairline);
  border-radius: var(--r); border-left: 2px solid transparent;
  transition: border-color .25s, background .25s;
  margin-bottom: 4px;
}
.sflow-item:hover { border-left-color: #A78BFA; background: var(--ink-4); }
.sflow-num { font-family: var(--ff-disp); font-size: 1.4rem; color: #A78BFA; opacity: .3; min-width: 32px; }
.sflow-icon { font-size: 1.1rem; flex-shrink: 0; margin-top: 2px; width: 28px; text-align: center; }
.sflow-title { font-weight: 600; font-size: .9rem; margin-bottom: 5px; color: var(--white); }
.sflow-body { font-size: .8rem; color: var(--cream); opacity: .55; line-height: 1.65; }

/* Sponsor tier — sessions themed */
.sessions-sponsor-tier {
  background: var(--ink-2); border: 1px solid var(--hairline);
  border-radius: 6px; padding: 32px 28px;
  position: relative; overflow: hidden;
  transition: border-color .3s, background .3s, transform .3s var(--ease);
}
.sessions-sponsor-tier:hover { border-color: rgba(124,58,237,.3); background: var(--ink-3); transform: translateY(-4px); }
.sessions-sponsor-tier::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--violet); transform: scaleX(0); transform-origin: left;
  transition: transform .4s var(--ease);
}
.sessions-sponsor-tier:hover::before { transform: scaleX(1); }
.sst-level { font-size: .58rem; font-weight: 700; letter-spacing: .25em; text-transform: uppercase; color: #A78BFA; display: block; margin-bottom: 10px; }
.sst-name { font-family: var(--ff-disp); font-size: 1.8rem; letter-spacing: .05em; color: var(--white); display: block; margin-bottom: 4px; }
.sst-perks { display: flex; flex-direction: column; gap: 9px; margin: 20px 0 28px; }
.sst-perk { display: flex; align-items: flex-start; gap: 10px; font-size: .79rem; color: var(--cream); opacity: .65; line-height: 1.5; }
.sst-perk::before { content: '—'; color: #A78BFA; flex-shrink: 0; }

/* Btn violet */
.btn-violet {
  background: var(--violet); color: var(--white);
  box-shadow: 0 0 28px var(--violet-glow);
}
.btn-violet:hover { box-shadow: 0 0 48px rgba(124,58,237,.5); }
.btn-outline-violet {
  background: transparent; color: #A78BFA;
  border: 1px solid rgba(124,58,237,.35);
}
.btn-outline-violet:hover { border-color: var(--violet); background: var(--violet-fog); }

/* ── AWAKENING / SPONSORS additions ────────────────────────── */
:root {
  --red-live: rgba(255,50,50,.9);
  --gold-glow2: rgba(240,165,0,.35);
}
.tag-pill {
  display:inline-flex;align-items:center;gap:6px;
  font-size:.6rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  padding:5px 14px;border-radius:100px;white-space:nowrap;
}
.tag-teal   { background:var(--teal-dim);color:var(--teal);border:1px solid var(--hairline) }
.tag-gold   { background:var(--gold-dim);color:var(--gold);border:1px solid rgba(240,165,0,.25) }
.tag-white  { background:rgba(255,255,255,.07);color:var(--white);border:1px solid var(--hairline-w) }

/* Price badge */
.price-badge {
  font-family:var(--ff-disp);font-size:1.6rem;letter-spacing:.02em;
  color:var(--gold);line-height:1;display:block;margin-bottom:4px;
}
.price-label {
  font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cream);opacity:.45;display:block;
}

/* Sponsor tier card */
.sp-card {
  background:var(--ink-2);border:1px solid var(--hairline);border-radius:6px;
  padding:32px 28px;position:relative;overflow:hidden;
  transition:border-color .3s,background .3s,transform .3s var(--ease);
}
.sp-card:hover { border-color:rgba(240,165,0,.3);background:var(--ink-3);transform:translateY(-4px) }
.sp-card::before {
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);
}
.sp-card:hover::before { transform:scaleX(1) }
.sp-card.teal-card:hover { border-color:rgba(30,206,202,.3) }
.sp-card.teal-card::before { background:var(--teal) }
.sp-cat {
  font-size:.58rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:10px;
}
.sp-card.teal-card .sp-cat { color:var(--teal) }
.sp-name { font-family:var(--ff-disp);font-size:1.5rem;letter-spacing:.04em;color:var(--white);display:block;margin-bottom:14px }
.sp-perks { display:flex;flex-direction:column;gap:8px;margin-bottom:24px }
.sp-perk  { display:flex;align-items:flex-start;gap:10px;font-size:.79rem;color:var(--cream);opacity:.65;line-height:1.5 }
.sp-perk::before { content:'—';color:var(--gold);flex-shrink:0 }
.sp-card.teal-card .sp-perk::before { color:var(--teal) }

/* Channel pills row */
.ch-row { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px }
.ch { font-size:.55rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:3px 9px;border-radius:3px;background:rgba(240,165,0,.1);color:rgba(240,165,0,.7);border:1px solid rgba(240,165,0,.15) }
.ch.teal { background:rgba(30,206,202,.1);color:rgba(30,206,202,.7);border-color:rgba(30,206,202,.15) }

/* ── LOGO IN NAV ────────────────────────────────────────────── */
.nav-logo {
  height: 40px; width: auto; display: block;
  /* logo-white.png is pre-rendered white — no filter needed */
  transition: opacity .2s;
  pointer-events: all;
}
.nav-logo:hover { opacity: .85 }
/* When nav is NOT stuck, keep logo visible */
#nav .nav-brand { align-items: flex-start; justify-content: center }

/* ── PHASE 2: CRM FORM ADDITIONS ───────────────────────────── */
.sms-consent {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 16px; background: var(--ink-3);
  border: 1px solid var(--hairline); border-radius: var(--r);
  margin-bottom: 16px; cursor: pointer;
}
.sms-consent input[type="checkbox"] {
  width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px;
  accent-color: var(--teal); cursor: pointer; pointer-events: all;
}
.sms-consent-label {
  font-size: .75rem; color: var(--cream); opacity: .7; line-height: 1.6;
}
.sms-consent-label strong { color: var(--white); font-weight: 600 }
.tcpa-text {
  font-size: .65rem; color: var(--cream); opacity: .38;
  line-height: 1.65; margin-top: 8px; margin-bottom: 16px;
}

/* ── FOUNDING MEMBER SECTION ────────────────────────────────── */
.founding-grid {
  display: grid; grid-template-columns: repeat(5,1fr); gap: 16px;
}
.founding-card {
  background: var(--ink-2); border: 1px solid var(--hairline);
  border-radius: 6px; padding: 28px 20px; text-align: center;
  position: relative; overflow: hidden;
  transition: border-color .3s, background .3s, transform .3s var(--ease);
}
.founding-card:hover { border-color: rgba(240,165,0,.3); background: var(--ink-3); transform: translateY(-4px) }
.founding-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease) }
.founding-card:hover::before { transform:scaleX(1) }
.founding-card.teal::before { background:var(--teal) }
.founding-card:hover.teal::before { transform:scaleX(1) }
.founding-icon { font-size:1.8rem; display:block; margin-bottom:14px }
.founding-title { font-family:var(--ff-disp); font-size:1.1rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:12px }
.founding-card.teal .founding-title { color:var(--teal) }
.founding-card:not(.teal) .founding-title { color:var(--gold) }
.founding-perks { display:flex; flex-direction:column; gap:8px; text-align:left }
.founding-perk { font-size:.76rem; color:var(--cream); opacity:.6; line-height:1.5; padding-left:12px; position:relative }
.founding-perk::before { content:'✓'; position:absolute; left:0; color:var(--teal); font-size:.7rem; font-weight:700 }

/* ── FOUNDER STORY SECTION ──────────────────────────────────── */
.founder-story {
  background: var(--ink-2);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
.founder-story::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 65% 60% at 60% 50%, rgba(240,165,0,.05), transparent 70%);
}
.founder-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center }
.founder-photo-wrap {
  position:relative; border-radius:8px; overflow:hidden;
  background:var(--ink-3); border:1px solid rgba(240,165,0,.15);
  aspect-ratio:4/5;
  display:flex; align-items:center; justify-content:center;
}
.founder-photo-wrap img {
  width:100%; height:100%; object-fit:cover; object-position:center top;
  display:block;
}
.founder-photo-placeholder {
  display:flex; flex-direction:column; align-items:center; gap:16px;
  color:var(--cream); opacity:.3;
}
.founder-photo-placeholder span { font-size:4rem }
.founder-photo-placeholder p { font-size:.7rem; letter-spacing:.2em; text-transform:uppercase }
.founder-quote-wrap {
  background:var(--ink); border:1px solid rgba(240,165,0,.15);
  border-radius:6px; padding:36px; margin-bottom:32px;
  position:relative;
}
.founder-quote-wrap::before {
  content:'"'; font-family:var(--ff-serif); font-size:5rem;
  color:var(--gold); opacity:.2; position:absolute;
  top:-10px; left:20px; line-height:1;
}
.founder-quote-text {
  font-family:var(--ff-serif); font-style:italic;
  font-size:clamp(1.1rem,1.8vw,1.4rem); color:var(--white);
  line-height:1.65; font-weight:300;
}
.founder-sig { display:flex; align-items:center; gap:16px; margin-top:20px }
.founder-sig-name { font-family:var(--ff-disp); font-size:1.2rem; letter-spacing:.08em; color:var(--white) }
.founder-sig-title { font-size:.65rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); opacity:.65 }

/* ── INVESTOR PAGE ──────────────────────────────────────────── */
.inv-stat { font-family:var(--ff-disp); font-size:3rem; color:var(--gold); line-height:1; display:block; margin-bottom:6px }
.inv-stat-label { font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--cream); opacity:.42; display:block }
.roadmap-year { font-family:var(--ff-disp); font-size:1.8rem; color:var(--gold); opacity:.6; letter-spacing:.05em; display:block; margin-bottom:6px }
.roadmap-title { font-weight:600; font-size:.95rem; margin-bottom:6px; color:var(--white) }
.roadmap-body { font-size:.84rem; color:var(--cream); opacity:.55; line-height:1.7 }
.roadmap-item { display:grid; grid-template-columns:120px 1fr; gap:32px; align-items:flex-start; padding:24px 0; border-bottom:1px solid var(--hairline) }
.roadmap-item:last-child { border-bottom:none }

/* ── SONGWRITER CARD ────────────────────────────────────────── */
.songwriter-badge {
  display:inline-flex; align-items:center; gap:8px;
  font-size:.6rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  padding:5px 14px; border-radius:100px;
  border:1px solid rgba(240,165,0,.25);
  background:var(--gold-dim); color:var(--gold); margin-bottom:12px;
}

/* ── RESPONSIVE FOUNDING ─────────────────────────────────────── */
@media(max-width:1024px) { .founding-grid { grid-template-columns:repeat(3,1fr) } }
@media(max-width:768px)  { .founding-grid { grid-template-columns:1fr 1fr } }
@media(max-width:560px)  {
  .founding-grid { grid-template-columns:1fr }
  .founder-grid  { grid-template-columns:1fr; gap:48px }
  .roadmap-item  { grid-template-columns:1fr; gap:8px }
  .roadmap-year  { font-size:1.2rem; opacity:.4 }
}


/* ═══════════════════════════════════════════════════════════════
   MUSIC HABITAT — SPACING & BREATHING ROOM OVERHAUL
   Replaces tight values throughout the global stylesheet
   Target: generous desktop, comfortable tablet, clean mobile
   ═══════════════════════════════════════════════════════════════ */

/* ── CORE LAYOUT TOKENS — expanded ────────────────────────────── */
:root {
  --nav-h:    80px;          /* was 72px — more breathing in header */
  --sec-pad:  160px;         /* desktop section vertical padding */
  --sec-pad-m: 100px;        /* tablet */
  --sec-pad-s:  72px;        /* mobile */
  --wrap-pad:   40px;        /* horizontal page gutter desktop */
  --wrap-pad-m: 28px;        /* tablet */
  --wrap-pad-s: 20px;        /* mobile */
  --grid-gap:   32px;        /* card/feature grids */
  --col-gap:    96px;        /* 2-col content grids desktop */
  --col-gap-m:  56px;        /* 2-col content grids tablet */
  --form-gap:   20px;        /* between form fields */
  --card-pad:   44px 36px;   /* card inner padding */
  --card-pad-m: 36px 28px;   /* card inner padding tablet */
  --card-pad-s: 28px 20px;   /* card inner padding mobile */
}

/* ── SECTION BASE ──────────────────────────────────────────────── */
section {
  padding: var(--sec-pad) 0;
}

/* ── WRAP / GUTTER ─────────────────────────────────────────────── */
.wrap {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--wrap-pad);
}

/* ── NAV ───────────────────────────────────────────────────────── */
#nav {
  height: var(--nav-h);
}
.nav-inner {
  height: var(--nav-h);
  gap: 40px;        /* was implicit, now explicit */
}
.nav-links {
  gap: 32px;        /* was tight link spacing */
}
.nav-links a {
  padding: 8px 0;   /* tap target height */
}
.nav-actions {
  gap: 12px;
}

/* ── SECTION HEADLINES ─────────────────────────────────────────── */
.section-hl {
  margin-bottom: 32px;    /* was 24px */
  line-height: .92;
}

/* ── OVERLINE ──────────────────────────────────────────────────── */
.overline {
  margin-bottom: 24px;    /* was 20px */
}

/* ── BADGES ────────────────────────────────────────────────────── */
.badge {
  margin-bottom: 32px;    /* was 24px */
  padding: 9px 20px;      /* slightly taller */
}

/* ── CARDS ─────────────────────────────────────────────────────── */
.card {
  padding: var(--card-pad);
}

/* ── FORMS ─────────────────────────────────────────────────────── */
.f {
  gap: 10px;              /* was 7px — label↔input gap */
  margin-bottom: var(--form-gap);
}
.fg {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;              /* was tight */
  margin-bottom: 0;       /* fg rows handled by .f children */
}
.f input,
.f select,
.f textarea {
  padding: 15px 18px;     /* was 13px 16px */
  font-size: .88rem;
  line-height: 1.5;
}
.f textarea {
  min-height: 120px;      /* was probably default */
  resize: vertical;
}
.form-submit {
  margin-top: 8px;        /* extra breathing before submit */
}
.form-privacy {
  margin-top: 16px;       /* was tight */
}
.sms-consent {
  margin-top: 8px;
  margin-bottom: 20px;    /* was 16px */
  padding: 18px;          /* was 16px */
  gap: 14px;              /* was 12px */
}
.tcpa-text {
  margin-bottom: 20px;    /* was 16px */
  line-height: 1.7;
}

/* ── FEAT GRID ─────────────────────────────────────────────────── */
.feat-grid {
  gap: 2px;               /* keeps hairline look */
}
.feat-item {
  padding: 44px 36px;     /* was 32px 28px */
}
.feat-icon {
  margin-bottom: 20px;    /* was 16px */
}
.feat-title {
  margin-bottom: 12px;    /* was 8px */
}

/* ── FOOTER ────────────────────────────────────────────────────── */
#footer {
  padding: 100px 0 60px;  /* was unset, now intentional */
}
.footer-grid {
  gap: 64px 48px;         /* was 40px */
  margin-bottom: 64px;    /* separation before divider */
}
.footer-brand-body {
  margin-top: 16px;       /* was 0 */
  line-height: 1.8;
}
.footer-socials {
  margin-top: 28px;       /* was 24px */
  gap: 12px;
}
.footer-col-title {
  margin-bottom: 24px;    /* was 20px */
}
.footer-links {
  gap: 16px;              /* was 12px */
}
.footer-links a {
  font-size: .86rem;      /* was .82rem — easier to read */
}
.footer-bottom {
  padding-top: 36px;      /* was 32px */
}

/* ── MARQUEE ───────────────────────────────────────────────────── */
.marquee-wrap {
  padding: 18px 0;        /* was probably 0 */
}
.marquee-item {
  gap: 0 40px;            /* more space between items */
}
.marquee-sep {
  margin: 0 24px;         /* was 16px */
}

/* ── COUNTDOWN ─────────────────────────────────────────────────── */
.countdown-wrap {
  gap: 4px;               /* was 2px */
}
.countdown-unit {
  padding: 36px 40px;     /* was 28px 32px */
  min-width: 130px;
}
.countdown-num {
  font-size: clamp(3rem, 6vw, 6rem); /* was probably fixed */
  margin-bottom: 12px;
}
.countdown-lbl {
  letter-spacing: .18em;
}

/* ── MOB NAV ───────────────────────────────────────────────────── */
#mob-nav {
  padding: 100px 32px 48px; /* was 80px 24px */
  gap: 8px;
}
#mob-nav a {
  font-size: 1.1rem;       /* bigger tap targets */
  padding: 14px 0;         /* was probably 10px */
  border-bottom: 1px solid rgba(30,206,202,.06);
}
.mob-nav-actions {
  margin-top: 32px;        /* was 24px */
  gap: 12px;
}
.mob-close {
  margin-top: 24px;
}

/* ══════════════════════════════════════════════════════════════════
   RESPONSIVE OVERRIDES
   ══════════════════════════════════════════════════════════════════ */

/* ── TABLET (≤ 960px) ──────────────────────────────────────────── */
@media (max-width: 960px) {
  section {
    padding: var(--sec-pad-m) 0;
  }
  .wrap {
    padding: 0 var(--wrap-pad-m);
  }
  .section-hl {
    font-size: clamp(2.4rem, 6vw, 4.5rem);
    margin-bottom: 28px;
  }
  .nav-links,
  .nav-actions { display: none }
  .hamburger   { display: flex }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 48px 40px;
  }
  .feat-grid { grid-template-columns: 1fr 1fr }
  .fg        { grid-template-columns: 1fr }
  .countdown-unit {
    padding: 24px 28px;
    min-width: 100px;
  }
  /* 2-col grids → 1-col with generous gap */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: var(--col-gap-m) !important;
  }
  .card {
    padding: var(--card-pad-m);
  }
  .feat-item {
    padding: 36px 28px;
  }
}

/* ── MOBILE (≤ 640px) ──────────────────────────────────────────── */
@media (max-width: 640px) {
  :root {
    --nav-h: 68px;
  }
  section {
    padding: var(--sec-pad-s) 0;
  }
  .wrap {
    padding: 0 var(--wrap-pad-s);
  }
  .section-hl {
    font-size: clamp(2rem, 8vw, 3.2rem);
    margin-bottom: 24px;
    line-height: .95;
  }
  .overline {
    font-size: .58rem;
    margin-bottom: 20px;
  }
  .badge {
    font-size: .56rem;
    padding: 7px 16px;
    margin-bottom: 24px;
  }
  /* Buttons */
  .btn-lg {
    padding: 16px 28px;
    font-size: .75rem;
  }
  .btn {
    padding: 14px 24px;
  }
  /* Cards */
  .card {
    padding: var(--card-pad-s);
  }
  .feat-item {
    padding: 32px 20px;
  }
  .feat-grid { grid-template-columns: 1fr }
  /* Footer */
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .footer-newsletter-form { flex-direction: column }
  /* Forms */
  .fg { grid-template-columns: 1fr }
  .f input,
  .f select,
  .f textarea {
    padding: 14px 16px;
    font-size: .85rem;
  }
  /* Countdown */
  .countdown-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
  }
  .countdown-sep { display: none }
  .countdown-unit {
    min-width: 0;
    padding: 20px 12px;
  }
  .countdown-num {
    font-size: clamp(2.2rem, 9vw, 3rem);
  }
}

/* ── SMALL MOBILE (≤ 480px) ────────────────────────────────────── */
@media (max-width: 480px) {
  :root {
    --nav-h: 64px;
  }
  .wrap {
    padding: 0 16px;
  }
  .section-hl {
    font-size: clamp(1.9rem, 9vw, 2.8rem);
  }
  /* Stack all action rows */
  [style*="display:flex"][style*="flex-wrap:wrap"],
  [style*="display: flex"][style*="flex-wrap: wrap"] {
    gap: 10px !important;
  }
  .btn-lg {
    width: 100%;
    justify-content: center;
  }
  .nav-brand-sub {
    display: none;  /* save space on tiny screens */
  }
}

/* ── WIDE SCREENS (≥ 1400px) ───────────────────────────────────── */
@media (min-width: 1400px) {
  :root {
    --max-w:   1360px;
    --sec-pad: 180px;
    --col-gap: 120px;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   PER-SECTION GRID SPACING IMPROVEMENTS
   These override the tightly-coded inline grid gaps on specific pages
   ═══════════════════════════════════════════════════════════════════ */

/* Homepage hero actions */
.hero-actions {
  gap: 14px;
  flex-wrap: wrap;
}
/* Trust bar */
.hero-trust {
  margin-top: 64px;   /* was 56px */
  padding-top: 40px;
  gap: 0;
}
.ht-item {
  padding: 0 36px 0 0;   /* more separation */
}
.ht-item + .ht-item {
  padding-left: 36px;
}
.ht-val {
  font-size: 2rem;
  margin-bottom: 6px;
  display: block;
}
.ht-label {
  font-size: .62rem;
  line-height: 1.5;
}

/* Founder story */
.founder-story {
  padding: var(--sec-pad) 0;
}
.founder-grid {
  gap: var(--col-gap);
  align-items: center;
}
.founder-quote-wrap {
  padding: 40px 40px 36px;   /* was 36px */
  margin-bottom: 36px;       /* was 32px */
}
.founder-quote-text {
  font-size: clamp(1.1rem, 1.6vw, 1.35rem);
  line-height: 1.7;
}

/* Founding member cards */
.founding-grid {
  gap: 20px;
  margin-top: 0;
}
.founding-card {
  padding: 36px 24px;   /* was 28px 20px */
}
.founding-icon {
  font-size: 2rem;
  margin-bottom: 18px;  /* was 14px */
  display: block;
}
.founding-title {
  margin-bottom: 16px;  /* was 12px */
}
.founding-perk {
  line-height: 1.6;
  margin-bottom: 2px;
}

/* How-it-works cards */
.how-card {
  padding: 56px 36px;   /* was 48px 28px */
}
.how-icon {
  font-size: 1.8rem;
  margin-bottom: 20px;  /* was 16px */
  display: block;
}
.how-who {
  margin-bottom: 10px;  /* was 8px */
}
.how-hl {
  margin-bottom: 16px;  /* was 12px */
  font-size: 2rem;
}
.how-body {
  margin-bottom: 28px;  /* was 24px */
  line-height: 1.8;
}

/* Feature cards (inner pages) */
.feature-card {
  padding: 36px 28px;   /* was 28px 24px */
}
.feature-card-icon {
  margin-bottom: 16px;  /* was 12px */
  font-size: 1.4rem;
}
.feature-card-title {
  margin-bottom: 10px;  /* was 6px */
}
.feature-card-body {
  line-height: 1.75;
}

/* Stats */
.stat-item {
  padding: 68px 0;      /* was 56px */
}
.stat-num {
  margin-bottom: 14px;  /* was 10px */
}

/* NOLA section */
.nola-visual {
  padding: 56px 40px;   /* was 48px */
}
.nola-detail {
  padding: 16px 0;      /* was 14px */
  gap: 18px;            /* was 14px */
}
.nola-detail-label {
  margin-bottom: 4px;
}
.nola-perk {
  padding: 18px 22px;   /* was 16px 20px */
  gap: 18px;
  margin-bottom: 4px;
}

/* Waitlist box */
.waitlist-box {
  padding: 60px;        /* was 52px */
}

/* Page hero */
.page-hero {
  min-height: 75svh;
  padding-bottom: 100px;  /* was 80px */
}
.page-hero-hl {
  margin-bottom: 28px;   /* was 24px */
}
.page-hero-sub {
  margin-bottom: 44px;   /* was 36px */
  line-height: 1.85;
}

/* Sessions screen card */
.sh-screen-header {
  padding: 20px 24px;   /* was 16px 20px */
}
.sh-ep-item {
  padding: 16px 24px;   /* was 13px 20px */
  gap: 16px;
}
.sh-premiere {
  padding: 16px 24px;   /* was 14px 20px */
  gap: 14px;
}
.sh-meta {
  gap: 32px;            /* was 24px */
  margin-bottom: 40px;  /* was 36px */
  padding-top: 28px;    /* was 24px */
}

/* Leader / team cards */
.ls-body {
  padding: 22px 22px 28px;  /* was 20px 20px 24px */
}
.ls-nm {
  margin-bottom: 6px;       /* was 4px */
  font-size: 1.05rem;
}

/* Board cards */
.bd-c {
  padding: 32px;            /* was 28px */
  gap: 24px;                /* was 20px */
}

/* Awakening / sponsor tier cards */
.sp-card {
  padding: 40px 32px;       /* was 32px 28px */
}
.sp-t-pk {
  gap: 12px;                /* was 9px */
  margin: 24px 0 32px;      /* was 20px 0 28px */
}
.sp-t-p {
  gap: 12px;
  line-height: 1.6;
}
.sp-t-nm {
  margin-bottom: 6px;       /* was 4px */
}

/* Investor KPI cards */
.inv-kpi {
  padding: 28px 24px;       /* was 24px 20px */
}
.inv-kpi-val {
  font-size: 2.4rem;
  margin-bottom: 8px;       /* was 6px */
}

/* Roadmap */
.roadmap-item {
  padding: 32px 0;          /* was 24px */
  gap: 40px;                /* was 32px */
}

/* Why-team points */
.wt-pt {
  padding: 22px;            /* was 18px */
  gap: 18px;                /* was 14px */
}

/* Contact form section spacing */
.contact-grid {
  gap: 72px;                /* was whatever inline said */
}

/* Sessions feature items */
.ser-fi {
  padding: 24px 26px;       /* was 20px 22px */
  gap: 20px;                /* was 18px */
  margin-bottom: 6px;
}
.ser-bul {
  gap: 16px;                /* was 12px */
  margin-bottom: 40px;      /* was 36px */
}
.wi-p {
  padding: 22px 22px;       /* was 18px 20px */
  gap: 18px;
  margin-bottom: 6px;
}

/* Ce nodes */
.ce-nodes {
  gap: 16px;                /* was 14px */
}
.ce-ni {
  padding: 28px 22px;       /* was 24px 20px */
}
.ce-ni-i {
  font-size: 1.5rem;
  margin-bottom: 12px;      /* was 10px */
}

/* Sponsorship CTA box */
.cs-launch-box {
  padding: 64px;            /* was 52px */
}
.cs-box-hl {
  margin-bottom: 20px;      /* was 16px */
}
.cs-box-b {
  margin-bottom: 44px;      /* was 36px */
}
.cs-box-a {
  gap: 16px;                /* was 14px */
}

/* Coming-soon cards */
.cs-c {
  padding: 44px 32px;       /* was 36px 28px */
}
.cs-c-i {
  font-size: 1.8rem;
  margin-bottom: 20px;      /* was 16px */
}
.cs-c-t {
  margin-bottom: 14px;      /* was 10px */
}

/* Filming visual */
.fv-item {
  padding: 22px 0;          /* was 18px */
  gap: 20px;                /* was 16px */
}

/* CTA section 3-grid */
.ct-c {
  padding: 52px 40px;       /* was 40px 32px */
}
.ct-ic {
  font-size: 2.2rem;
  margin-bottom: 20px;      /* was 16px */
}
.ct-hl {
  margin-bottom: 16px;      /* was 12px */
}
.ct-b {
  margin-bottom: 32px;      /* was 28px */
}

/* Audience cards (awakening) */
.aud-card {
  padding: 44px 28px;       /* was 32px 20px */
}
.aud-icon {
  font-size: 2.2rem;
  margin-bottom: 20px;      /* was 16px */
}
.aud-title {
  margin-bottom: 14px;      /* was 10px */
}

/* Experience cards */
.exp-card {
  padding: 40px 28px;       /* was 32px 24px */
}
.exp-num {
  font-size: 3.5rem;
}
.exp-icon {
  font-size: 1.4rem;
  margin-bottom: 16px;      /* was 12px */
}
.exp-title {
  margin-bottom: 12px;      /* was 8px */
  font-size: .96rem;
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE-SPECIFIC SECTION FIXES
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
  /* Stack hero actions vertically */
  .hero-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .hero-actions .btn {
    width: 100%;
    justify-content: center;
  }
  /* Trust bar grid */
  .hero-trust {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding-top: 32px;
    margin-top: 48px;
  }
  .ht-item {
    padding: 0 !important;
  }
  .ht-item::after { display: none }

  /* Founding grid 1-col */
  .founding-grid {
    grid-template-columns: 1fr;
  }
  /* How-it-works */
  .how-card {
    padding: 40px 24px;
  }
  /* Waitlist box */
  .waitlist-box {
    padding: 36px 20px;
  }
  /* Stats */
  .stat-item {
    padding: 44px 0;
    border-right: none !important;
    border-bottom: 1px solid var(--hairline);
  }
  /* NOLA visual */
  .nola-visual {
    padding: 36px 24px;
  }
  /* Sessions meta */
  .sh-meta {
    gap: 20px;
    flex-wrap: wrap;
  }
  /* Deck / form boxes */
  .deck-box,
  .sp-form-box,
  .sp-contact-card {
    padding: 36px 20px;
  }
  .inv-kpis {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  /* Sponsor tiers */
  .sp-card {
    padding: 32px 20px;
  }
  .cs-launch-box {
    padding: 40px 24px;
  }
  /* Experience / audience grids */
  .aud-grid,
  .exp-grid,
  .tier-grid-3,
  .tier-grid-4 {
    grid-template-columns: 1fr !important;
  }
  /* Team carousel */
  .ls-c {
    flex: 0 0 200px;
  }
  /* Board */
  .bd-g {
    grid-template-columns: 1fr;
  }
  .bd-c {
    padding: 24px 20px;
    gap: 16px;
  }
  /* CTA grid */
  .ct-g,
  .sctas-grid {
    grid-template-columns: 1fr;
  }
  .ct-c {
    padding: 40px 24px;
  }
  /* Finale actions */
  .finale-actions,
  .mv-actions,
  .sf2-actions,
  .fn-ac2 {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .finale-actions .btn,
  .mv-actions .btn,
  .sf2-actions .btn,
  .fn-ac2 .btn {
    width: 100%;
    justify-content: center;
  }
  /* Roadmap */
  .roadmap-item {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 28px 0;
  }
  /* Why-team / diff grids */
  .diff-grid {
    grid-template-columns: 1fr;
  }
  /* Section headers in sponsor page */
  .tier-section {
    padding-top: 64px;
  }
  /* Awakening hero bottom */
  .aw-bot {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 28px;
  }
  .aw-br {
    justify-content: center;
    flex-direction: column;
    align-items: stretch;
  }
  .aw-br .btn {
    width: 100%;
    justify-content: center;
  }
  /* Sessions hero */
  .sh-bot,
  .shr-bottom {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 24px;
  }
  .sh-br,
  .shr-br {
    justify-content: center;
    flex-direction: column;
    align-items: stretch;
  }
}

/* ── EXTRA SMALL (≤ 380px) ─────────────────────────────────────── */
@media (max-width: 380px) {
  .wrap { padding: 0 14px }
  .countdown-num { font-size: 2rem }
  .countdown-unit { padding: 16px 10px }
  .badge { font-size: .52rem; padding: 6px 12px }
  .section-hl { font-size: clamp(1.7rem, 10vw, 2.4rem) }
  .btn { font-size: .68rem; padding: 13px 18px }
  .btn-lg { font-size: .7rem; padding: 14px 20px }
  .ls-c { flex: 0 0 170px }
}

/* ── STICKY MOBILE CTA ─────────────────────────────────────────── */
@media (max-width: 640px) {
  .mobile-sticky-cta {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 900;
    background: linear-gradient(to top, var(--ink) 70%, transparent);
    padding: 20px 20px 28px;
    display: flex;
    gap: 10px;
  }
  .mobile-sticky-cta .btn {
    flex: 1;
    justify-content: center;
  }
  /* Add bottom padding to body so content isn't hidden behind sticky bar */
  body.has-sticky-cta {
    padding-bottom: 88px;
  }
}

/* ── NAV SPACING CLEAN ──────────────────────────────────────────── */
#nav { height: var(--nav-h) }
.nav-inner {
  height: var(--nav-h);
  gap: 0;
}
.nav-links { gap: 26px }
.nav-links a { padding: 8px 0 }
.nav-actions { gap: 14px }
.nav-logo {
  height: 38px; width: auto; display: block;
  /* logo already white */
  transition: opacity .2s;
}