/* CORBIN ELLIS — Mobile V3, built to the supplied 12-section mockup. Canvas: 390px. */
:root{
  /* style-guide tokens */
  --navy:#0F1F36;
  --gold:#D4A24C;
  --ivory:#F7F3EE;
  --ink:#1E293B;
  --muted:#6B7280;
  --success:#16A34A;
  /* derived */
  --cream:#F1EBE1;
  --deep:#0B1728;
  --gold-lt:#E0B876;
  --gold-pale:#F2E4C9;
  --body:var(--muted);
  --line:#E6DFD4;
  --gutter:20px;
  --r-card:12px;
  --r-btn:8px;
  --pad-sec:24px;
  --gap:16px;
  --pad-card:20px;
  --sh-card:0 6px 20px rgba(15,31,54,.08);
  --sh-btn:0 4px 12px rgba(15,31,54,.15);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:clip}
body{
  background:var(--ivory);color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  padding-bottom:92px;
}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}

/* ── EDITORIAL TYPE ── */
h1,h2{font-family:"Playfair Display",Georgia,serif;color:var(--ink);margin:0;font-weight:600}
h1{font-size:38px;line-height:1.10;letter-spacing:-.018em}
h1 em{font-style:normal;color:var(--gold)}
h2{font-size:26px;line-height:1.2;letter-spacing:-.01em;margin-bottom:10px}
h2 .num{color:var(--gold)}
p{margin:0;color:var(--body)}
.lead{font-size:15.5px;line-height:1.62}
.micro{font-size:12.5px;line-height:1.55;color:var(--muted);margin-top:12px}
.center{text-align:center}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0 0 12px}
.eyebrow.light{color:var(--gold-lt)}
.sub-gold{font-family:"Playfair Display",serif;font-size:23px;color:var(--gold);margin:0 0 4px}

/* ── BANDS ── */
.band{padding:var(--pad-sec) var(--gutter)}
.band.ivory{background:var(--ivory)}
.band.cream{background:var(--cream)}
.band.navy{background:var(--navy)}
.band.navy h2,.band.navy .lead{color:#fff}
.band.navy h2 .num{color:var(--gold)}
.band.navy .review-rail article{background:#16304F;border-color:#2B4869}
.band.navy .review-rail p,.band.navy .review-rail .who{color:#F2F6FA}
.band.navy .review-rail .role{color:#9DB2C8}
.band.navy .dots span{background:#3C5876}
.band.navy .dots span.on{background:var(--gold)}
.band.navy .btn.outline{color:#fff;border-color:rgba(255,255,255,.55)}

/* ── NAV ── */
.nav{
  position:sticky;top:0;z-index:60;height:58px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--gutter);
  background:rgba(253,251,247,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
}
.brand{
  text-decoration:none;display:grid;column-gap:5px;
  grid-template-columns:auto auto;
  grid-template-areas:"name sprig" "sub sub";
  align-items:center;justify-content:start;
}
.brand-main{grid-area:name}
.brand .sprig{grid-area:sprig;width:14px;height:14px;color:var(--gold);align-self:end;margin-bottom:3px}
.brand-sub{grid-area:sub}
.brand-main{font-family:"Playfair Display",serif;font-size:21px;font-weight:600;letter-spacing:.01em;display:block;line-height:1.05}
.brand-sub{font-size:7.5px;letter-spacing:.3em;font-weight:700;color:#8C7550;display:block;margin-top:1px}
.nav-menu{
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  background:none;border:0;color:var(--ink);cursor:pointer;padding:0;
}
.nav-menu svg{width:24px;height:24px}
.drawer{
  position:sticky;top:58px;z-index:59;background:var(--ivory);
  border-bottom:1px solid var(--line);padding:6px var(--gutter) 18px;display:grid;
}
.drawer a:not(.btn){
  padding:13px 0;border-bottom:1px solid var(--line);text-decoration:none;
  font-size:14px;font-weight:600;color:var(--ink);
}
.drawer .btn{margin-top:16px}

/* ── BUTTONS ── */
.btn{
  display:flex;align-items:center;justify-content:center;gap:7px;text-align:center;
  min-height:52px;padding:0 18px;border-radius:var(--r-btn);margin-top:var(--gap);
  font-size:13.5px;font-weight:700;letter-spacing:.045em;text-decoration:none;
}
.btn i{font-style:normal;font-size:15px;opacity:.9}
.btn.primary{background:var(--navy);color:#fff;box-shadow:var(--sh-btn)}
.btn.gold{background:var(--gold);color:var(--navy);box-shadow:var(--sh-btn)}
.btn.outline{background:transparent;color:var(--navy);border:1.5px solid var(--navy);min-height:48px;font-size:12px;box-shadow:none}
.btn.small{min-height:44px;padding:0 14px;font-size:11.5px;margin-top:0;flex:0 0 auto;box-shadow:none}

/* ── HERO ── */
.hero{padding-top:var(--pad-sec);padding-bottom:32px}
[hidden]{display:none!important}
.rating-pill{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:var(--gap);border-radius:999px;
  font-size:12.5px;font-weight:600;color:var(--body);
}
.rating-pill .stars{color:var(--gold-lt);letter-spacing:.06em;font-size:13px}
.hero h1{margin-bottom:14px}
.icon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:24px 0 4px}
.icon-grid div{text-align:center}
.icon-grid .tile{
  width:42px;height:42px;margin:0 auto 8px;border:1px solid var(--gold-pale);border-radius:var(--r-btn);
  display:flex;align-items:center;justify-content:center;background:#fff;color:var(--gold);
}
.icon-grid .tile svg{width:20px;height:20px}
.icon-grid b{font-size:10.5px;font-weight:600;color:var(--muted);line-height:1.35;display:block}
.hero .micro{text-align:center}

/* ── SCENES ── */
.scene{margin:22px calc(var(--gutter)*-1) 0}
.scene img{width:100%}
.scene.card img{border-radius:var(--r-card)}
.scene.nomargin{margin-bottom:calc(var(--gutter)*-1)}

/* ── QUOTE CARDS (genuine only) ── */
.quote-card{
  margin-top:var(--gap);background:#fff;border:1px solid var(--line);border-radius:var(--r-card);
  padding:var(--pad-card);box-shadow:var(--sh-card);
}
.quote-card.light{background:#1B3752;border-color:#2E4E6C}
.quote-card .stars{color:var(--gold-lt);letter-spacing:.1em;font-size:13px}
.quote-card p{font-size:14.5px;line-height:1.5;color:var(--ink);margin-top:7px}
.quote-card.light p{color:#EAF0F6}
.quote-card .who{display:block;margin-top:10px;font-size:12.5px;font-weight:700}
.quote-card.light .who{color:#fff}
.quote-card .role{display:block;font-size:11.5px;color:var(--muted)}
.quote-card.light .role{color:#9EB2C6}
.quote-band{padding-top:28px;padding-bottom:30px}

.tertiary{
  display:inline-flex;align-items:center;gap:6px;margin-top:var(--gap);
  color:var(--gold);font-size:12px;font-weight:700;letter-spacing:.06em;text-decoration:none;
}
.tertiary i{font-style:normal}

/* ── HIDDEN COST TABLE ── */
.cost-table{margin-top:var(--gap);background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:var(--pad-card);box-shadow:var(--sh-card)}
.ct-head{font-family:"Playfair Display",serif;font-size:21px;font-weight:600;color:var(--ink)}
.ct-sub{font-size:11.5px;color:var(--muted);margin:2px 0 12px;font-style:italic}
.cost-table table{width:100%;border-collapse:collapse;font-size:11px}
.cost-table th{
  background:var(--gold-pale);color:#6B5527;text-align:left;font-weight:700;
  font-size:9px;letter-spacing:.09em;text-transform:uppercase;padding:7px 6px;
}
.cost-table td{padding:8px 6px;border-bottom:1px solid #F0EAE0;color:var(--body);vertical-align:top;line-height:1.35}
.cost-table td:first-child{color:var(--ink);font-weight:600}
.cost-table .tick{color:var(--success);font-weight:800;text-align:center;width:22px}
.ct-more{font-size:12px;color:var(--gold);font-weight:600;margin-top:12px;font-style:italic}

/* ── FEATURE ROWS ── */
.feature-rows{list-style:none;padding:0;margin:22px 0 0}
.feature-rows li{
  display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;
  padding:12px 0;border-bottom:1px solid var(--line);font-size:13.5px;
}
.feature-rows li:last-child{border-bottom:0}
.feature-rows .ic{color:var(--gold);display:flex}
.feature-rows .ic svg{width:19px;height:19px}
.feature-rows b{font-weight:700;color:var(--ink)}
.feature-rows .fr{color:var(--muted);font-size:12px;text-align:right}

/* ── TICK LISTS ── */
.ticks{list-style:none;padding:0;margin:20px 0 0}
.ticks li{position:relative;padding:7px 0 7px 27px;font-size:14px;line-height:1.45;color:var(--body)}
.ticks li:before{
  content:"✓";position:absolute;left:0;top:7px;width:17px;height:17px;border-radius:999px;
  background:var(--gold-pale);color:#9A7328;font-size:10px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
}

/* ── PRICE BOX ── */
.pricebox{
  margin-top:var(--gap);background:#fff;border:1px solid var(--line);border-radius:var(--r-card);
  padding:var(--pad-card);text-align:center;box-shadow:var(--sh-card);
}
.one-time{font-family:"Playfair Display",serif;font-style:italic;font-size:15px;color:var(--gold)}
.price-big{font-family:"Playfair Display",serif;font-size:48px;line-height:1;color:var(--ink);margin:2px 0 14px}
.trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}
.trust-row div{font-size:10px;color:var(--muted);line-height:1.35;text-align:center}
.trust-row .ic{display:flex;justify-content:center;color:var(--gold);margin-bottom:6px}
.trust-row .ic svg{width:17px;height:17px}
.trust-row.wide{margin:22px 0 0;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.payhip{font-size:10.5px;color:var(--muted);margin-top:14px}
.payhip b{color:var(--ink)}

/* ── REVIEWS ── */
.rail{
  display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:2px var(--gutter) 6px;margin:20px calc(var(--gutter)*-1) 0;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.rail::-webkit-scrollbar{display:none}
.review-rail article{
  flex:0 0 84vw;scroll-snap-align:center;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-card);padding:var(--pad-card);
  box-shadow:var(--sh-card);
}
.review-rail.mini article{flex:0 0 62vw;padding:15px 14px}
.review-rail .stars{color:var(--gold-lt);letter-spacing:.1em;font-size:13px}
.review-rail p{font-family:"Playfair Display",serif;font-size:18px;line-height:1.3;color:var(--ink);margin-top:8px}
.review-rail.mini p{font-size:15px}
.review-rail .who{display:block;margin-top:12px;font-size:12.5px;font-weight:700;color:var(--ink)}
.review-rail .role{display:block;font-size:11px;color:var(--muted)}
.dots{display:flex;justify-content:center;gap:6px;margin-top:14px}
.dots span{width:6px;height:6px;border-radius:50%;background:#D8D0C0}
.dots span.on{background:var(--navy)}

/* ── DEMO ── */
.device-laptop{margin:22px 0 0}
.device-laptop .screen{
  background:var(--navy);border-radius:12px 12px 3px 3px;padding:9px 9px 8px;
  box-shadow:0 14px 32px rgba(24,32,44,.16);
}
.device-laptop video{width:100%;border-radius:5px;background:#000;display:block}
.device-laptop .base{
  height:11px;margin:0 -6%;border-radius:0 0 8px 8px;
  background:linear-gradient(#CBCFD5,#BFC4CB);position:relative;
}
.device-laptop .base:after{
  content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:19%;height:5px;border-radius:0 0 5px 5px;background:#AEB4BC;
}
.steps{list-style:none;counter-reset:s;padding:0;margin:24px 0 0;display:grid;gap:14px}
.steps li{counter-increment:s;position:relative;padding-left:42px}
.steps li:before{
  content:counter(s);position:absolute;left:0;top:1px;width:29px;height:29px;border-radius:50%;
  background:var(--gold-pale);color:#8A6C2E;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:13px;
}
.steps b{display:block;font-size:14.5px}
.steps span{display:block;font-size:13px;color:var(--body);line-height:1.5}

/* ── GUARANTEE ── */
.guarantee{padding-top:30px;padding-bottom:32px}
.g-row{display:grid;grid-template-columns:74px 1fr;gap:16px;align-items:start}
.guarantee h2{font-size:24px;margin-bottom:8px}
.guarantee p{color:#B9C8D6;font-size:13.5px;line-height:1.55}
.badge{
  width:74px;height:74px;border-radius:50%;background:var(--deep);border:4px double var(--gold-lt);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.badge span{font-family:"Playfair Display",serif;font-size:26px;font-weight:700;color:#F0D294;line-height:1}
.badge small{font-size:7.5px;letter-spacing:.16em;color:#E4CB9C}
.script{font-family:"Pinyon Script","Playfair Display",cursive;font-size:23px;color:var(--gold-lt);margin-top:12px}

/* ── FAQ ── */
.faq details{border-bottom:1px solid var(--line);padding:15px 0}
.faq summary{
  font-weight:600;font-size:14px;cursor:pointer;list-style:none;color:var(--ink);
  display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:26px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"⌄";color:var(--gold);font-size:15px;line-height:1;transform:translateY(-3px)}
.faq details[open] summary:after{transform:rotate(180deg)}
.faq details p{margin-top:9px;font-size:13.5px}

/* ── FOOTER ── */
footer{background:var(--navy);color:#C3D0DC;padding:30px var(--gutter) 34px;display:grid;gap:16px}
footer .brand-main{color:#fff;font-size:22px}
footer .brand-sub{color:var(--gold-lt)}
.f-links{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px}
.f-links a{color:#C3D0DC;text-decoration:none}
.f-copy{font-size:10.5px;color:#8FA3B6;line-height:1.6}

/* ── STICKY ── */
.sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:70;height:70px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:0 15px calc(env(safe-area-inset-bottom,0px)/2);
  background:rgba(253,251,247,.97);backdrop-filter:blur(12px);border-top:1px solid var(--line);
  transform:translateY(110%);transition:transform .28s ease;
}
.sticky.show{transform:translateY(0)}
.sticky-copy small{display:block;font-size:11px;color:var(--muted)}
.sticky-copy strong{display:block;font-family:"Playfair Display",serif;font-size:23px;line-height:1.05;color:var(--ink)}

/* ── WIDER SCREENS (secondary) ── */
@media(min-width:430px){ h1{font-size:42px} h2{font-size:29px} }
@media(min-width:768px){
  body{padding-bottom:0}
  .band{padding-left:max(var(--gutter),6vw);padding-right:max(var(--gutter),6vw)}
  .band>*,footer>*{max-width:820px;margin-left:auto;margin-right:auto}
  h1{font-size:54px} h2{font-size:36px}
  .scene{margin-left:0;margin-right:0}
  .scene img{border-radius:14px}
  .btn{max-width:420px}
  .review-rail article{flex:0 0 340px}
  .sticky{display:none}
}
