:root{
  --bg:#0a0a0b;
  --bg-2:#121214;
  --glass:rgba(0,0,0,.58);
  --border:rgba(255,255,255,.12);
  --fg:#F9FAFB;
  --muted:#E5E7EB;
  --rose:#C2828B; /* sunrise rose */
  --bronze:#89612E; /* sunrise bronze */
  --gold:#E7C97E;
  --gold-2:#D4AF37;
  --accent:#ef4444; /* red CTA */
  --ok:#10b981;
  --error:#ef4444;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:radial-gradient(1200px 800px at 70% -10%,rgba(226,195,87,.18),transparent 60%),linear-gradient(180deg,#0a0a0b 0%, #0e0e10 100%);color:var(--fg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:980px;margin:0 auto;padding:24px 16px}
.hero{position:relative;min-height:86vh;display:grid;align-items:end;border-radius:28px;overflow:hidden}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.45) 60%,rgba(0,0,0,.85))}
.hero .content{position:relative;padding:28px}
.kicker{letter-spacing:.18em;text-transform:uppercase;color:#cbd5e1;font-size:12px;margin-bottom:10px}
.h1{font-size:42px;line-height:1.1;margin:0 0 12px}
.h2{font-size:28px;margin:22px 0 12px}
.p{color:var(--muted);line-height:1.75}
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 22px;border-radius:16px;background:linear-gradient(135deg,#ff7b7b,var(--accent));color:#fff;font-weight:800;box-shadow:0 10px 28px rgba(239,68,68,.25);border:1px solid rgba(255,255,255,.12)}
.btn .sub{display:block;font-weight:600;font-size:11px;opacity:.9}
.btn.gold{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#111;box-shadow:0 10px 28px rgba(212,175,55,.25)}
.badge{display:inline-flex;gap:8px;align-items:center;background:var(--glass);backdrop-filter:blur(8px);border:1px solid var(--border);padding:8px 12px;border-radius:999px;font-size:12px}
.badge .dot{width:8px;height:8px;border-radius:50%;background:var(--ok)}
.section{margin:36px 0}
.card{background:var(--glass);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:20px;padding:18px}
.grid{display:grid;gap:16px}
.list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.list li{display:flex;gap:12px;align-items:flex-start}
.list .check{flex:0 0 18px;width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--gold),var(--gold-2));display:flex;align-items:center;justify-content:center;color:#111;font-weight:900}
.hr{height:1px;background:var(--border);margin:18px 0}
.sticky-cta{position:sticky;bottom:0;background:rgba(10,10,11,.85);backdrop-filter:blur(10px);border-top:1px solid var(--border);padding:10px 14px;display:flex;gap:10px;align-items:center;justify-content:space-between;z-index:5}
.trustbar{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#cbd5e1}
.footer{margin:30px 0 10px;font-size:13px;color:#cbd5e1}
.small{font-size:12px;color:#cbd5e1}
.center{text-align:center}
.video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;border:1px solid var(--border);background:#000}
.video iframe,wistia-player{width:100%;height:100%}
.glass{background:var(--glass);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:24px}
.cta-bar{display:flex;flex-direction:column;gap:8px}
.cta-red{display:inline-flex;flex-direction:column;align-items:center;gap:4px;padding:14px 18px;border-radius:16px;background:linear-gradient(135deg,#ff7b7b,var(--accent));color:#fff;font-weight:900;border:1px solid rgba(255,255,255,.12)}
.cta-sub{font-size:12px;opacity:.9}

/* 2-step on-page */
.step{display:none}
.step.active{display:block}
.input{width:100%;padding:14px 16px;border-radius:14px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:#fff}
label{display:block;margin:8px 0 6px}
.actions{display:flex;gap:10px;align-items:center;margin-top:12px}
.btn-ghost{background:rgba(255,255,255,.08);border:1px solid var(--border);color:#fff;border-radius:14px;padding:12px 16px;font-weight:700}
.offer{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.04);border:1px dashed var(--gold-2);border-radius:16px;padding:12px}
.offer h4{margin:4px 0 2px;font-size:16px}
.offer p{margin:0;color:#cbd5e1;font-size:13px}
.checkbox{width:18px;height:18px}
.price{font-weight:800;color:var(--gold)}
.meta-legal{font-size:12px;color:#cbd5e1;margin-top:10px}

/* Cookie banner */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;background:#111827;color:#fff;padding:14px;display:none;gap:10px;align-items:center;z-index:60;border-top:1px solid var(--border)}

/* responsive */
@media(min-width:920px){
  .h1{font-size:54px}
  .h2{font-size:32px}
}

::placeholder{color:#E5E7EB;opacity:.9}
.input::placeholder{color:#E5E7EB;opacity:.9}
.hero .overlay{background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.6) 55%,rgba(0,0,0,.88))}
.p{color:var(--muted)}
.glass{background:var(--glass);border:1px solid var(--border)}
.btn.gold{background:linear-gradient(135deg,var(--rose),var(--bronze));color:#111;box-shadow:0 10px 28px rgba(212,175,55,.25)}
.btn{border:1px solid rgba(255,255,255,.18)}
.hero{background-image: radial-gradient(1200px 800px at 70% -10%, rgba(194,130,139,.20), transparent 60%), radial-gradient(1200px 800px at 10% 120%, rgba(137,97,46,.18), transparent 60%);}


/* ----- Two-column layout (mobile-first) ----- */
.layout{display:grid;grid-template-columns:1fr;gap:20px}
.aside{position:relative}
.aside .sticky{position:sticky;top:18px}
@media(min-width:1040px){
  .layout{grid-template-columns:minmax(0,1fr) 380px;gap:26px}
}

/* Big hero timer */
.timer-hero{
  display:flex;gap:12px;align-items:center;justify-content:flex-start;
  background:rgba(0,0,0,.65);border:1px solid var(--border);
  border-radius:18px;padding:14px 18px;margin-bottom:6px
}
.timer-hero .label{
  font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;
  font-size:clamp(12px,2.2vw,14px)
}
.timer-hero .digits{
  font-weight:900;color:var(--gold);
  font-size:clamp(36px,6.2vw,64px);line-height:1;letter-spacing:.06em
}

.image-rail{display:grid;grid-auto-flow:column;grid-auto-columns:80%;gap:14px;overflow-x:auto;padding-bottom:6px}
.image-rail .tile{aspect-ratio:16/9;border-radius:18px;background-size:cover;background-position:center;border:1px solid var(--border)}
@media(min-width:920px){
  .image-rail{grid-auto-columns:35%}
}

/* Accordion (TOC) */
.accordion{display:grid;gap:10px}
.accordion .item{border:1px solid var(--border);border-radius:14px;background:rgba(0,0,0,.35)}
.accordion .head{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border:none;background:transparent;color:var(--fg);font-weight:800;font-size:16px;cursor:pointer}
.accordion .icon{font-weight:900;opacity:.8}
.accordion .body{max-height:0;overflow:hidden;transition:max-height .35s ease;padding:0 16px}
.accordion .body ul{margin:10px 0 14px;padding-left:18px;line-height:1.6;color:var(--muted)}
.accordion .item.open .body{max-height:600px}
.accordion .item.open .icon{transform:rotate(45deg)}

/* Mobile centering for hero headline and CTA */
.hero .content{max-width:800px;margin:0 auto}
.cta-bar{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
@media(max-width:640px){
  .hero .content{ text-align:center; padding:20px }
  .cta-bar{ align-items:center }
  .cta-red{ width:auto; text-align:center }
  .h1{ font-size:32px }
}

.fullbg{height:36vh;border-radius:22px;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.55)), var(--bg-img) center/cover no-repeat;border:1px solid var(--border);margin:26px 0}
@media(max-width:640px){ .fullbg{ height:28vh } }

/* Full-width utilities */
.container{max-width:none;padding-inline:clamp(12px,2.2vw,28px)}
.content-max{max-width:min(72ch,96vw);margin-inline:auto}
.fullbleed{width:100vw;margin-left:50%;transform:translateX(-50%);}

/* Sticky top timer */
.top-timer{position:sticky;top:0;z-index:100;background:rgba(0,0,0,.7);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);padding:10px 14px}
.top-timer .wrap{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:12px}
.top-timer .label{font-weight:800;color:#e5e7eb;letter-spacing:.12em;text-transform:uppercase;font-size:12px}
.top-timer .digits{font-weight:900;color:var(--gold);font-size:clamp(24px,4.8vw,42px);letter-spacing:.06em;line-height:1}

/* Step 2 compact */
#step2 h3{font-size:18px}
#step2 .offer h4{font-size:15px}
#step2 .offer p{font-size:12.5px;line-height:1.5}
#step2 label span{font-size:12.5px;line-height:1.5;color:#cbd5e1}
#step2 .meta-legal{font-size:11.5px}
#step2 .actions{margin-top:10px}

/* Product grid (Amazon-style) */
.product-grid{display:grid;grid-template-columns:1fr;gap:18px}
.media-col{display:grid;gap:12px}
.media-main{position:relative;aspect-ratio:16/10;background:#000;border-radius:16px;overflow:hidden;border:1px solid var(--border);background-size:cover;background-position:center}
.media-thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:8px}
.media-thumb{aspect-ratio:1/1;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#111;cursor:pointer;opacity:.9}
.media-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.media-thumb.active{outline:2px solid var(--gold)}
.buy-box{background:var(--glass);border:1px solid var(--border);border-radius:16px;padding:16px}
.price-row{display:flex;align-items:baseline;gap:10px}
.price-row .price{font-size:28px;font-weight:900;color:var(--gold)}
.price-row .vat{font-size:12px;color:#cbd5e1}
.bullets{list-style:none;margin:10px 0;padding:0;display:grid;gap:6px}
.bullets li{display:flex;gap:8px}
.bullets .dot{width:6px;height:6px;background:var(--gold);border-radius:50%;margin-top:9px}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.badges .b{border:1px solid var(--border);border-radius:999px;padding:6px 10px;font-size:12px;background:rgba(0,0,0,.35)}
.buy-actions .btn{width:100%}
@media(min-width:1080px){
  .product-grid{grid-template-columns:minmax(0,1fr) 390px;gap:24px}
  .aside .sticky{position:sticky;top:72px}
}

/* Mobile H1 balance fix */
@supports (text-wrap: balance){
  .h1{ text-wrap: balance; }
}
@media(max-width:640px){
  .media-col .h1{ font-size: clamp(22px, 6vw, 28px); line-height: 1.18; }
}

/* Hero CTA under video */
.hero-cta{margin-top:12px;display:grid;gap:6px;position:relative;z-index:2}
.hero-cta .btn{justify-self:stretch}
.hero-cta-sub{font-size:12px;color:#94a3b8;text-align:center}
@media(min-width:980px){
  .hero-cta .btn{justify-self:start;padding-left:22px;padding-right:22px}
}

/* Form subline */
.form-subline{margin:-6px 0 14px;color:#94a3b8;font-size:13px}


/* ================== LIGHT THEME OVERRIDES (global) ================== */
html, body { background:#ffffff !important; color:#111111 !important; }

/* Containers */
.section, .content, .content-max, .card, .buy-box, .aside, .hero-stack {
  background:#ffffff !important;
  color:#111111 !important;
}

/* Typography */
.p, .small, .meta, .meta-legal, .form-subline, .hero-cta-sub { color:#374151 !important; }
h1, h2, h3, h4, h5, h6 { color:#111111 !important; }

/* Price microcopy */
.price-row .vat { color:#6b7280 !important; }

/* Badges */
.badges .b{
  background:rgba(0,0,0,0.06) !important;
  border-color:#e5e7eb !important;
  color:#111111 !important;
}

/* Form elements */
label{ color:#111111 !important; }
.input, input[type="text"], input[type="email"], input[type="number"], textarea, select{
  background:#ffffff !important;
  color:#111111 !important;
  border:1px solid #e5e7eb !important;
}
.input::placeholder{ color:#9ca3af !important; }
.checkbox, input[type="checkbox"], input[type="radio"]{ accent-color:#111111; }

/* Links & buttons */
a { color:#111111; }
.btn{ box-shadow:none; }

/* Layout tweaks: center bullets & forms */
.bullets{ max-width:720px; margin:12px auto 18px auto; }
.buy-box{ max-width:460px; margin-left:auto; margin-right:auto; }
.step form{ max-width:420px; margin:0 auto; }
.hero-stack{ max-width:780px; margin-left:auto; margin-right:auto; text-align:center; }

/* Remove dark overlays if any */
.overlay, .backdrop { background:transparent !important; }


/* =================== COMPACT + LIGHT THEME ENHANCEMENTS =================== */
.compact-page html, .compact-page body { background:#ffffff !important; color:#111111 !important; }

/* Global compact rhythm */
.compact-page .section{ padding-top: 18px; padding-bottom: 18px; }
.compact-page h1{ margin: 0 0 10px; }
.compact-page h2{ margin: 14px 0 8px; }
.compact-page h3{ margin: 10px 0 6px; }
.compact-page p{ margin: 8px 0; line-height: 1.35; }
.compact-page .product-grid{ gap: 16px !important; }
.compact-page .content-max{ max-width: 980px; margin: 0 auto; }
.compact-page .hero-stack{ max-width: 780px; margin-left:auto; margin-right:auto; text-align:center; }
.compact-page .hero-badges{ justify-content:center; }
.compact-page .bullets{ max-width:720px; margin:12px auto 16px; gap:6px; }
.compact-page .buy-box{ max-width:480px; margin-left:auto; margin-right:auto; }
.compact-page .step form{ max-width:420px; margin:0 auto; }
.compact-page .hero-cta{ margin: 6px auto 8px; }
.compact-page .hero-cta .btn{ min-width:260px; }

/* Light theme sweeps for common blocks */
.compact-page .section,
.compact-page .content,
.compact-page .content-max,
.compact-page .card,
.compact-page .buy-box,
.compact-page .aside,
.compact-page .step,
.compact-page .faq,
.compact-page .cta,
.compact-page .price-row,
.compact-page .panel,
.compact-page .module,
.compact-page .offer,
.compact-page .feature-strip,
.compact-page .light-card,
.compact-page .light-form{
  background:#ffffff !important;
  color:#111111 !important;
  border-color:#e5e7eb !important;
}

/* Feature strip with emojis: inline, compact layout */
.feature-strip{
  display:flex;
  flex-wrap:wrap;
  gap:12px 16px;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border:1px solid #e5e7eb;
  border-radius:10px;
  margin: 12px auto;
  max-width: 780px;
}

/* "Card" look for #2 and #3 boxes */
.light-card{
  border:1px solid #e5e7eb !important;
  background:#ffffff !important;
  border-radius:12px;
  padding:14px !important;
  box-shadow: none !important;
}

/* Bottom form light and compact */
.light-form{
  border:1px solid #e5e7eb;
  background:#ffffff !important;
  border-radius:12px;
  padding:14px;
}

/* Inputs and labels */
label{ color:#111111 !important; }
.input, input[type="text"], input[type="email"], input[type="number"], textarea, select{
  background:#ffffff !important;
  color:#111111 !important;
  border:1px solid #e5e7eb !important;
}
.input::placeholder{ color:#9ca3af !important; }

/* Badges */
.badges .b{
  background:rgba(0,0,0,0.06) !important;
  border-color:#e5e7eb !important;
  color:#111111 !important;
}

/* Misc */
.price-row .vat { color:#6b7280 !important; }
a { color:#111111; }
.btn{ box-shadow:none; }


/* ===== SINGLE-COLUMN + COMPACT CENTERED LAYOUT ===== */
.product-grid{ display:block !important; }
.media-col, .aside{ max-width: 780px; margin: 0 auto; }
.aside .sticky{ position: static !important; top: auto !important; }
.buy-box{ max-width: 520px; margin-left:auto; margin-right:auto; }
.step form{ max-width: 460px; margin: 0 auto; }
.hero-stack{ max-width: 780px; margin-left:auto; margin-right:auto; text-align:center; }
.hero-cta{ margin: 8px auto 12px; }
.hero-cta .btn{ min-width: 260px; }

/* Compact spacing */
.section{ padding-top:18px; padding-bottom:18px; }
h1{ margin: 0 0 10px; }
h2{ margin: 14px 0 8px; }
h3{ margin: 10px 0 6px; }
p{ margin: 8px 0; line-height:1.35; }
.bullets{ max-width: 720px; margin: 12px auto 16px auto; gap: 6px; }

/* Light theme enforcement */
html, body { background:#ffffff !important; color:#111111 !important; }
.section, .content, .content-max, .card, .buy-box, .aside, .step, .offer, .panel, .module, .faq, .cta {
  background:#ffffff !important;
  color:#111111 !important;
  border-color:#e5e7eb !important;
}
label{ color:#111111 !important; }
.input, input[type="text"], input[type="email"], input[type="number"], textarea, select{
  background:#ffffff !important;
  color:#111111 !important;
  border:1px solid #e5e7eb !important;
}
.input::placeholder{ color:#9ca3af !important; }
a{ color:#111111; }
.btn{ box-shadow:none; }
.badges .b{ background:rgba(0,0,0,0.06) !important; border-color:#e5e7eb !important; color:#111111 !important; }
.price-row .vat { color:#6b7280 !important; }

/* Feature strip + light cards (if present) */
.feature-strip{
  display:flex; flex-wrap:wrap; gap:12px 16px; align-items:center; justify-content:center;
  padding:10px 12px; border:1px solid #e5e7eb; border-radius:10px; margin: 12px auto; max-width: 780px;
}
.light-card{ border:1px solid #e5e7eb !important; background:#ffffff !important; border-radius:12px; padding:14px !important; box-shadow:none !important; }
.light-form{ border:1px solid #e5e7eb; background:#ffffff !important; border-radius:12px; padding:14px; }


/* === Force light backgrounds on offer/faq blocks === */
.offer, .faq, .qa, .accordion, details, summary {
  background:#ffffff !important;
  color:#111111 !important;
  border-color:#e5e7eb !important;
}
/* Extra: ensure #2/#3 cards and any 'card-like' blocks are white */
.light-card{ background:#ffffff !important; color:#111111 !important; border:1px solid #e5e7eb !important; }
/* Single column tighten on OTO pages too */
.product-grid{ display:block !important; }
.media-col, .aside{ max-width: 780px; margin: 0 auto; }
.aside .sticky{ position: static !important; }