:root{
  --ivory:#f8f1e4; --paper:#fffdf8; --white:#ffffff;
  --maroon:#4a1030; --maroon-2:#5A0F1B; --maroon-deep:#2a0818;
  --gold:#A67D2B; --gold-2:#c49a56; --gold-pale:#e8c87e; --gold-text:#8a641f;
  --ink:#3d2c22; --muted:#7a6650; --line:#e3d5bd;
  --shadow-maroon:rgba(74,16,48,.16);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html:focus-within{scroll-behavior:smooth}
body{font-family:Jost,system-ui,sans-serif;font-weight:400;font-size:16px;line-height:1.6;color:var(--ink);background:var(--ivory);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%}
a{color:inherit}
.container{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px}
h1,h2,h3{font-weight:600}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:Jost,sans-serif;font-weight:600;font-size:14.5px;letter-spacing:.4px;border-radius:999px;padding:13px 26px;min-height:48px;cursor:pointer;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease;text-align:center;white-space:nowrap}
.btn svg{width:17px;height:17px;flex:none}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#fff;box-shadow:0 10px 24px -8px rgba(166,125,43,.55);border:1px solid transparent}
.btn-gold:hover{filter:brightness(1.07);transform:translateY(-2px);box-shadow:0 16px 30px -8px rgba(166,125,43,.55)}
.btn-gold:active{transform:scale(.98)}
.btn-outline{background:transparent;color:var(--maroon);border:1.5px solid var(--maroon)}
.btn-outline:hover{background:rgba(74,16,48,.06);transform:translateY(-2px)}
.btn-outline.on-dark{color:var(--gold-pale);border-color:var(--gold-2)}
.btn-outline.on-dark:hover{background:rgba(196,154,86,.14)}

/* ---------- Phone frame ---------- */
.phone{position:relative;flex:none;aspect-ratio:9/19.2;background:linear-gradient(160deg,#2b2126,#141013 60%);border:1px solid #d8c391;border-radius:44px;padding:10px;box-shadow:0 30px 60px -18px rgba(74,16,48,.35),0 12px 24px rgba(74,16,48,.18),inset 0 0 0 2px rgba(0,0,0,.55)}
.phone .screen{width:100%;height:100%;border-radius:35px;overflow:hidden;background:#efe4cd;position:relative}
.phone .screen img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.phone .notch{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:34%;max-width:96px;height:22px;border-radius:999px;background:#0b0909;z-index:2}

/* ---------- Top bar ---------- */
.topbar{position:sticky;top:0;z-index:50;height:72px;background:rgba(248,241,228,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar.scrolled{box-shadow:0 6px 20px rgba(74,16,48,.06)}
.topbar-in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.wordmark{font-family:Cinzel,serif;font-weight:700;font-size:20px;letter-spacing:3.5px;color:var(--maroon);text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:10px}
.diamond{width:6px;height:6px;background:var(--gold-2);transform:rotate(45deg);display:inline-block;flex:none}
.topnav{display:flex;gap:36px}
.topnav a{font-weight:500;font-size:14.5px;letter-spacing:.6px;color:var(--ink);text-decoration:none;position:relative;padding:6px 0}
.topnav a::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1px;background:var(--gold);transition:width .25s ease,left .25s ease}
.topnav a:hover{color:var(--maroon)}
.topnav a:hover::after{width:100%;left:0}
.topbar-actions{display:flex;align-items:center;gap:12px}
.icon-btn{width:40px;height:40px;flex:none;border-radius:50%;border:1.5px solid var(--line);display:inline-flex;align-items:center;justify-content:center;color:var(--maroon);text-decoration:none;transition:border-color .2s,color .2s;background:transparent}
.icon-btn svg{width:19px;height:19px}
.icon-btn:hover{border-color:var(--gold);color:var(--gold)}
.btn-bar{padding:11px 22px;min-height:44px}

/* ---------- Eyebrow / headings ---------- */
.eyebrow{font-family:Jost,sans-serif;font-weight:600;font-size:12px;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold-text)}
.on-dark-slide .eyebrow,.slide-3 .eyebrow,.slide-4 .eyebrow{color:var(--gold-pale)}
.section-head{text-align:center;max-width:720px;margin:0 auto}
.section-head h2{font-family:Cinzel,serif;font-weight:600;font-size:38px;line-height:1.15;letter-spacing:1px;color:var(--maroon);margin-top:14px}
.section-sub{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:19px;line-height:1.55;color:var(--muted);margin-top:16px}
.ornament{display:flex;justify-content:center;margin-bottom:36px}
.section{padding:96px 0}
.section-white{background:var(--white)}
.section-ivory{background:var(--ivory)}

/* ---------- Hero ---------- */
.promo{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.slides{display:grid}
.slide{grid-area:1/1;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(24px);transition:opacity 700ms cubic-bezier(.22,.61,.21,1),transform 700ms cubic-bezier(.22,.61,.21,1),visibility 0s linear 700ms;display:flex;align-items:center;min-height:0}
.slide.is-active{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0);transition:opacity 700ms cubic-bezier(.22,.61,.21,1),transform 700ms cubic-bezier(.22,.61,.21,1);z-index:1}
.slide.is-leaving{transform:translateX(-12px)}
.slide-1{background:var(--ivory);background-image:radial-gradient(600px 400px at 68% 45%,rgba(196,154,86,.16),transparent 70%)}
.slide-2{background:#f8f1e4}
.slide-offer{background:linear-gradient(155deg,#5A0F1B,#4a1030 55%,#2a0818)}
.slide-3b{background:var(--ivory)}
.slide-4{background:linear-gradient(160deg,#2a0818,#1d0510)}
.slide-in{display:grid;grid-template-columns:minmax(0,54%) minmax(0,46%);gap:32px;align-items:center;width:100%;padding-top:34px;padding-bottom:54px}
.slide-copy{position:relative;z-index:2}
.slide-copy{max-width:540px}
.slide-copy h1, .slide-copy h2{font-family:Cinzel,serif;font-weight:600;font-size:39px;line-height:1.12;letter-spacing:.5px;color:var(--maroon);margin-top:12px}
.on-dark-slide .slide-copy h1, .on-dark-slide .slide-copy h2{color:var(--ivory)}
.hero-sub{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:19.5px;line-height:1.5;color:var(--ink);margin-top:14px}
.on-dark-slide .hero-sub{color:rgba(248,241,228,.92)}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.slide-visual{display:flex;justify-content:center;align-items:center;min-width:0}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.slide.is-active .anim{animation:rise 550ms ease both}
.slide.is-active .slide-copy .anim:nth-child(1){animation-delay:0ms}
.slide.is-active .slide-copy .anim:nth-child(2){animation-delay:90ms}
.slide.is-active .slide-copy .anim:nth-child(3){animation-delay:180ms}
.slide.is-active .slide-copy .anim:nth-child(4){animation-delay:270ms}
.slide.is-active .slide-visual.anim{animation-delay:180ms}
/* Trio */
.trio{position:relative;display:flex;align-items:flex-start;justify-content:center}
.trio .phone-centre{width:290px;z-index:3}
.trio .phone-side{width:252px;margin-top:18px}
.trio .phone-left{transform:rotate(-5deg);margin-right:-34px;z-index:1}
.trio .phone-right{transform:rotate(5deg);margin-left:-34px;z-index:1}
.trio-sm .phone-centre{width:150px}
.trio-sm .phone-side{width:118px;margin-top:10px}
.trio-sm .phone-left{margin-right:-28px}
.trio-sm .phone-right{margin-left:-28px}
.trio-sm .notch{height:16px;top:16px}
/* Poster */
.poster{width:auto;height:560px;max-width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top center;border-radius:24px;box-shadow:0 30px 60px -20px rgba(74,16,48,.30);display:block;background:#efe4cd}
.phone-single{width:300px}
.promo-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:48px;height:48px;border-radius:50%;border:1.5px solid var(--maroon);color:var(--maroon);background:rgba(248,241,228,.8);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,border-color .2s}
.promo-arrow svg{width:20px;height:20px}
.promo-arrow.prev{left:18px}
.promo-arrow.next{right:18px}
.promo[data-active-theme="dark"] .promo-arrow{border-color:var(--gold-2);color:var(--gold-pale);background:rgba(42,8,24,.45)}
.promo-dots{position:absolute;left:50%;transform:translateX(-50%);bottom:16px;z-index:6;display:flex;gap:8px}
.dot{width:8px;height:8px;border-radius:999px;border:none;background:rgba(166,125,43,.35);cursor:pointer;padding:0;transition:width .3s ease,background .3s ease;min-width:8px}
.dot.is-active{width:26px;background:var(--gold)}
.promo[data-active-theme="dark"] .dot{background:rgba(232,200,126,.35)}
.promo[data-active-theme="dark"] .dot.is-active{background:var(--gold-pale)}

/* ---------- New Launch ---------- */
.launch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px}
.launch-card{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 30px -12px rgba(74,16,48,.12);transition:transform .25s ease,box-shadow .25s ease;display:flex;flex-direction:column}
.launch-card:hover{transform:translateY(-4px);box-shadow:0 22px 40px -14px rgba(74,16,48,.20)}
.ribbon{position:absolute;top:22px;left:-38px;z-index:4;width:128px;text-align:center;transform:rotate(-45deg);background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#fff8ea;font-family:Jost,sans-serif;font-weight:600;font-size:11px;letter-spacing:3px;padding:6px 0;box-shadow:0 4px 10px rgba(166,125,43,.4)}
.launch-top{background:var(--ivory);padding:34px 20px 28px;display:flex;justify-content:center}
.phone-card{width:228px}
.launch-body{padding:26px 24px 28px;display:flex;flex-direction:column;flex:1;text-align:center;align-items:center}
.card-name{font-family:Cinzel,serif;font-weight:600;font-size:22px;letter-spacing:1px;color:var(--maroon)}
.card-line{font-family:"Cormorant Garamond",serif;font-weight:500;font-style:italic;font-size:17px;line-height:1.45;color:var(--muted);margin-top:10px}
.launch-btns{display:flex;gap:10px;margin-top:22px;width:100%}
.launch-btns .btn{flex:1;padding-left:14px;padding-right:14px}

/* ---------- Collection ---------- */
.shop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:44px}
.shop-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 6px 22px rgba(74,16,48,.06);transition:transform .25s ease,box-shadow .25s ease;display:flex;flex-direction:column}
.shop-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(74,16,48,.13)}
.shop-preview{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:#efe4cd}
.shop-preview img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;transition:transform 400ms ease}
.shop-card:hover .shop-preview img{transform:scale(1.04)}
.new-pill{position:absolute;top:12px;left:12px;z-index:2;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#fff;font-family:Jost,sans-serif;font-weight:600;font-size:10.5px;letter-spacing:2px;border-radius:999px;padding:5px 11px}
.shop-body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1}
.shop-name{font-family:Cinzel,serif;font-weight:600;font-size:17.5px;letter-spacing:1px;color:var(--maroon);line-height:1.3}
.shop-cat{font-family:"Cormorant Garamond",serif;font-weight:500;font-style:italic;font-size:15.5px;color:var(--muted);margin-top:4px}
.shop-btn{margin-top:10px;width:100%}

/* ---------- How It Works ---------- */
.steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:44px}
.steps::before{content:"";position:absolute;top:36px;left:18%;right:18%;border-top:1px dashed var(--gold-2);opacity:.7}
.step{text-align:center;position:relative;display:flex;flex-direction:column;align-items:center}
.step-icon-wrap{position:relative;width:72px;height:72px}
.step-icon{width:72px;height:72px;border-radius:50%;background:var(--ivory);border:1.5px solid var(--gold);display:flex;align-items:center;justify-content:center;color:var(--maroon);position:relative;z-index:1}
.step-icon svg{width:30px;height:30px}
.step-num{position:absolute;top:-6px;right:-14px;z-index:2;font-family:Cinzel,serif;font-weight:600;font-size:13px;color:var(--gold-text)}
.step h3{font-family:Cinzel,serif;font-weight:600;font-size:19px;color:var(--maroon);margin-top:20px}
.step p{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:17.5px;line-height:1.55;color:var(--muted);max-width:300px;margin-top:10px}

/* ---------- Features ---------- */
.features{background:linear-gradient(150deg,var(--maroon),var(--maroon-2));border-top:1px solid var(--gold-2);border-bottom:1px solid var(--gold-2);padding:56px 0}
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.feature{text-align:center;display:flex;flex-direction:column;align-items:center}
.feature-icon{color:var(--gold-2);display:inline-flex}
.feature-icon svg{width:28px;height:28px}
.feature h3{font-family:Jost,sans-serif;font-weight:600;font-size:14px;letter-spacing:1.8px;text-transform:uppercase;color:var(--ivory);margin-top:14px;line-height:1.5}
.feature p{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:16.5px;line-height:1.5;color:rgba(248,241,228,.88);max-width:250px;margin-top:8px}

/* ---------- Footer ---------- */
.footer{background:var(--maroon-deep);padding:72px 0 40px}
.footer-in{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.footer-wordmark{font-family:Cinzel,serif;font-weight:700;font-size:24px;letter-spacing:4px;color:var(--gold-pale)}
.footer .ornament{margin-bottom:0}
.footer-line{font-family:"Cormorant Garamond",serif;font-weight:500;font-style:italic;font-size:19px;color:rgba(248,241,228,.92);max-width:560px}
.footer-handle{display:inline-flex;align-items:center;gap:7px;font-family:Jost,sans-serif;font-weight:500;font-size:14px;color:var(--gold-pale);text-decoration:none}
.footer-handle svg{width:16px;height:16px}
.footer-handle:hover{text-decoration:underline}
.copyright{font-family:Jost,sans-serif;font-weight:400;font-size:13px;color:rgba(248,241,228,.55);margin-top:8px}

/* ---------- Tablet ---------- */
@media (max-width:1023px) and (min-width:641px){
  .shop-grid{grid-template-columns:repeat(3,1fr)}
  .slide-in{grid-template-columns:1fr;gap:36px;text-align:center;padding-top:44px}
  .slide-copy{max-width:620px;margin:0 auto}
.slide-copy h1, .slide-copy h2{font-size:36px}
  .cta-row{justify-content:center}
  .trio-sm .phone-centre{width:132px}
  .trio-sm .phone-side{width:104px}
  .poster{height:480px}
}
@media (max-width:899px){
  .launch-grid{grid-template-columns:1fr;max-width:480px;margin-left:auto;margin-right:auto}
}
/* ---------- Mobile ---------- */
@media (max-width:640px){
  .container{padding-left:20px;padding-right:20px}
  .topbar{height:64px}
  .topbar-in{gap:10px}
  .wordmark{font-size:16.5px;letter-spacing:2.2px;gap:6px}
  .topnav{display:none}
  .topbar-actions{gap:8px;flex:none}
  .btn-bar{padding:10px 15px;font-size:13.5px;min-height:44px}
  .icon-btn{width:38px;height:38px}
  .section{padding:64px 0}
  .section-head h2{font-size:28px}
  .section-sub{font-size:18px}
  .ornament{margin-bottom:28px}
  .slide{min-height:0}
  .slide-in{grid-template-columns:1fr;gap:22px;padding-top:28px;padding-bottom:46px;text-align:center}
  .slide-copy{max-width:100%;margin:0 auto}
  .slide-copy .eyebrow{font-size:11px;letter-spacing:3px}
.slide-copy h1, .slide-copy h2{font-size:27px;line-height:1.15}
  .hero-sub{font-size:17.5px;line-height:1.45}
  .cta-row{justify-content:center}
  .cta-row .btn{font-size:14px}
  .trio-sm .phone{border-radius:30px;padding:7px}
  .trio-sm .screen{border-radius:24px}
  .trio-sm .phone-centre{width:108px}
  .trio-sm .phone-side{width:86px;margin-top:8px}
  .trio-sm .phone-left{margin-right:-36px}
  .trio-sm .phone-right{margin-left:-36px}
  .trio-sm .notch{height:12px;top:13px}
  .poster{height:400px}
  .phone-single{width:210px}
  .phone-card{width:210px}
  .promo-arrow{display:none}
  .promo-dots{bottom:12px}
  .launch-grid{gap:24px;margin-top:32px}
  .launch-btns{flex-direction:column}
  .launch-btns .btn{width:100%}
  .card-name{font-size:20px}
  .card-line{font-size:16.5px}
  .shop-grid{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:32px}
  .shop-name{font-size:15.5px}
  .steps{grid-template-columns:1fr;gap:36px;margin-top:32px}
  .steps::before{display:none}
  .features{padding:44px 0}
  .features-grid{grid-template-columns:repeat(2,1fr);gap:28px 20px}
  .footer{padding:56px 0 36px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .slide{transition:opacity 1ms}
  .slide.is-active .anim{animation:none}
  .trio{animation:none}
  .shop-preview img,.launch-card,.shop-card,.btn{transition:none}
}

/* ---------- Prices ---------- */
.price{font-family:Jost,sans-serif;margin-top:10px;display:flex;align-items:baseline;gap:8px}
.price strong{font-weight:600;font-size:20px;color:var(--maroon)}
.price-from{color:var(--muted);font-weight:400;font-size:14px}
.price-sm{margin-top:4px}
.price-sm strong{font-size:16px}
.price-sm .price-from{font-size:12.5px}

/* ---------- Promo extras ---------- */
.price-card{background:var(--paper);border:1px solid var(--gold-2);border-radius:20px;padding:26px 40px;text-align:center;box-shadow:0 24px 48px -18px rgba(0,0,0,.45)}
.price-card-row{display:flex;align-items:baseline;justify-content:center;gap:12px}
.price-card-amt{font-family:Cinzel,serif;font-weight:700;font-size:44px;line-height:1.1;color:var(--maroon)}
.price-card-lab{font-family:Jost,sans-serif;font-weight:600;font-size:13px;letter-spacing:1.8px;text-transform:uppercase;color:var(--gold-text)}
.price-card-note{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:16.5px;color:var(--muted);margin-top:4px}
.thumbs-row{display:flex;gap:12px;justify-content:center}
.thumbs-row img{width:92px;height:118px;object-fit:cover;object-position:top center;border-radius:12px;box-shadow:0 14px 28px -10px rgba(74,16,48,.35);display:block;background:#efe4cd}

/* ---------- Shop card buttons ---------- */
.shop-name a{color:inherit;text-decoration:none}
.shop-name a:hover{text-decoration:underline;text-decoration-color:var(--gold-2);text-underline-offset:3px}
.shop-btns{display:flex;gap:8px;margin-top:12px}
.shop-btn-sm{flex:1;font-size:13px;padding:11px 8px;min-height:44px;gap:6px}
.shop-btn-sm svg{width:15px;height:15px}

/* ---------- New Launch strip ---------- */
.strip{background:var(--ivory);padding:64px 0}
.strip .section-head h2{font-size:30px}
.strip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}
.strip-card{display:flex;align-items:center;gap:14px;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:12px 14px;box-shadow:0 6px 20px rgba(74,16,48,.06)}
.strip-thumb{width:58px;height:77px;object-fit:cover;object-position:top center;border-radius:10px;display:block;background:#efe4cd}
.strip-info{flex:1;min-width:0}
.strip-info h3{font-family:Cinzel,serif;font-weight:600;font-size:16.5px;letter-spacing:.6px;color:var(--maroon)}
.strip-info h3 a{color:inherit;text-decoration:none}
.strip-btn{padding:10px 18px;min-height:44px;font-size:13.5px}
@media (max-width:640px){
  .strip{padding:48px 0}
  .strip-grid{grid-template-columns:1fr;gap:14px;margin-top:24px}
  .price-card{padding:20px 30px}
  .price-card-amt{font-size:34px}
  .thumbs-row img{width:70px;height:90px}
  .shop-btns{flex-direction:column}
}

/* ---------- Fix round 1: genuinely slim promo strip + equal new themes ---------- */
/* Compact banner treatment on every slide: one-line eyebrow, small headline,
   a single short line at most, one CTA, and a small visual on the same plane. */
.promo .slide-in{grid-template-columns:minmax(0,56%) minmax(0,44%);gap:28px;padding-top:20px;padding-bottom:38px}
.promo .slide-copy h1, .promo .slide-copy h2{font-size:29px;line-height:1.14;margin-top:8px}
.promo .hero-sub{font-size:16.5px;line-height:1.4;margin-top:8px}
.promo .cta-row{margin-top:16px;gap:10px}
.promo .btn{padding:10px 20px;min-height:40px;font-size:13.5px}
.promo-arrow{width:38px;height:38px}
.promo-arrow svg{width:17px;height:17px}
.promo-dots{bottom:10px}
/* Slide 1: three new themes — same size, same plane, equal weight */
.launch-thumbs{display:flex;gap:14px;justify-content:center;align-items:flex-start}
.launch-thumb{display:block;width:92px;text-decoration:none;text-align:center}
.launch-thumb img{width:92px;height:118px;object-fit:cover;object-position:top center;border-radius:12px;box-shadow:0 14px 28px -10px rgba(74,16,48,.35);display:block;background:#efe4cd}
.launch-thumb span{display:block;margin-top:7px;font-family:Jost,sans-serif;font-weight:600;font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--maroon)}
.launch-thumb:hover img{outline:2px solid var(--gold-2);outline-offset:2px}
/* Slide 2: compact two-package price card */
.promo .price-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 28px}
.promo .price-card-amt{font-size:36px;line-height:1.05}
.promo .price-card-note{font-size:15px;margin-top:2px}
/* Slide 3: smaller preview thumbs */
.promo .thumbs-row img{width:74px;height:96px}
@media (max-width:1023px) and (min-width:641px){
  .promo .slide-in{grid-template-columns:minmax(0,56%) minmax(0,44%);gap:24px;text-align:left;padding-top:20px}
  .promo .cta-row{justify-content:flex-start}
.promo .slide-copy h1, .promo .slide-copy h2{font-size:26px}
}
@media (max-width:640px){
  .promo .slide-in{grid-template-columns:1fr;gap:10px;padding-top:12px;padding-bottom:22px;text-align:center}
.promo .slide-copy h1, .promo .slide-copy h2{font-size:20px;line-height:1.18;margin-top:6px}
  .promo .slide-copy .eyebrow{font-size:10.5px;letter-spacing:3px}
  .promo .hero-sub{font-size:15px;margin-top:6px}
  .promo .cta-row{margin-top:12px;justify-content:center}
  .promo .btn{min-height:38px;padding:9px 18px;font-size:13px}
  .launch-thumbs{gap:10px}
  .launch-thumb{width:84px}
  .launch-thumb img{width:84px;height:88px}
  .launch-thumb span{font-size:9.5px;letter-spacing:.8px;margin-top:5px;white-space:nowrap}
  .promo .price-card{padding:12px 22px}
  .promo .price-card-amt{font-size:27px}
  .promo .price-card-lab{font-size:11px;letter-spacing:1.2px}
  .promo .price-card-note{font-size:14px}
  .promo .thumbs-row{gap:9px}
  .promo .thumbs-row img{width:62px;height:80px}
  .promo-dots{bottom:8px}
}

/* ================= REDESIGN 2026 — motion, hero, rhythm ================= */
/* ---------- Scroll reveal (JS tags .rv, IO adds .rv-in) ---------- */
.rv{opacity:0;translate:0 26px;transition:opacity .85s cubic-bezier(.22,.61,.21,1),translate .85s cubic-bezier(.22,.61,.21,1);transition-delay:var(--d,0ms)}
.rv.rv-in{opacity:1;translate:0 0}

/* ---------- Cinematic hero (slide 1) ---------- */
.slide-hero{background-color:var(--ivory);background-image:radial-gradient(720px 480px at 70% 42%,rgba(196,154,86,.20),transparent 70%),radial-gradient(rgba(166,125,43,.05) 1px,transparent 1.5px);background-size:auto,22px 22px}
.promo .slide-hero .slide-in{grid-template-columns:minmax(0,46%) minmax(0,54%);gap:36px;align-items:center;padding-top:44px;padding-bottom:64px}
@media (min-width:1024px){.promo .slide-hero .slide-in{min-height:min(84vh,800px)}}
.promo .slide-hero .slide-copy h1, .promo .slide-hero .slide-copy h2{font-size:clamp(38px,4.4vw,57px);line-height:1.08;letter-spacing:.5px;margin-top:14px}
.promo .slide-hero .hero-sub{font-size:20px;line-height:1.55;margin-top:18px}
.promo .slide-hero .cta-row{margin-top:28px;gap:14px}
.promo .slide-hero .btn{padding:13px 26px;min-height:48px;font-size:14.5px}
.shimmer{background:linear-gradient(100deg,#A67D2B 15%,#e8c87e 38%,#fff3cf 50%,#e8c87e 62%,#A67D2B 85%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmerMove 3.4s linear infinite}
@keyframes shimmerMove{from{background-position:110% 0}to{background-position:-110% 0}}
.hero-points{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:24px;font-family:Jost,sans-serif;font-weight:500;font-size:13.5px;letter-spacing:.4px;color:var(--muted)}
.hero-points .diamond{width:5px;height:5px}
.hero-stage{position:relative;animation:floaty 7s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.hero-glow{position:absolute;left:50%;top:46%;width:600px;height:600px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(232,200,126,.55),rgba(196,154,86,.20) 55%,rgba(196,154,86,0) 74%);filter:blur(6px);animation:glowPulse 5.5s ease-in-out infinite;pointer-events:none}
@keyframes glowPulse{0%,100%{opacity:.75;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.07)}}
.hero-trio .phone-centre{width:264px}
.hero-trio .phone-side{width:218px}
.phone .screen video{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;background:transparent}
/* Hero centre phone: band parda (curtain) hi pehla rang hai — poster load hone se
   pehle bhi screen kabhi khaali/safed nahi dikhti. */
.hero-trio .phone-centre .screen{background-image:url("assets/home/hero-pearl-poster.jpg?v=096c7695");background-size:cover;background-position:top center}
/* Never-blank fallback: video na chale to taiyaar invitation (naamon ke saath) */
.phone .screen img.hero-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;display:none}
.phone .screen.hero-static img.hero-fallback{display:block}
.phone .screen.hero-static video{display:none}
@media (max-width:1023px) and (min-width:641px){
  .promo .slide-hero .slide-in{grid-template-columns:1fr;gap:30px;padding-top:38px;padding-bottom:54px;text-align:center}
.promo .slide-hero .slide-copy h1, .promo .slide-hero .slide-copy h2{font-size:38px}
  .promo .slide-hero .cta-row{justify-content:center}
  .hero-points{justify-content:center}
  .hero-trio .phone-centre{width:264px}
  .hero-trio .phone-side{width:212px}
  .hero-glow{width:480px;height:480px}
}
@media (max-width:640px){
  .promo .slide-hero .slide-in{grid-template-columns:1fr;gap:14px;padding-top:14px;padding-bottom:42px;text-align:center}
.promo .slide-hero .slide-copy h1, .promo .slide-hero .slide-copy h2{font-size:28px;line-height:1.12;margin-top:8px}
  .promo .slide-hero .hero-sub{font-size:16px;line-height:1.42;margin-top:10px}
  .promo .slide-hero .cta-row{justify-content:center;margin-top:14px}
  .promo .slide-hero .btn{padding:11px 20px;min-height:44px;font-size:13.5px}
  .hero-points{justify-content:center;margin-top:18px}
  .hero-trio .phone-centre{width:216px}
  .hero-trio .phone-side{width:150px;margin-top:12px}
  .hero-trio .phone-left{margin-right:-32px}
  .hero-trio .phone-right{margin-left:-32px}
  .hero-trio .phone{border-radius:32px;padding:7px}
  .hero-trio .screen{border-radius:26px}
  .hero-trio .notch{height:13px;top:14px}
  .hero-glow{width:340px;height:340px}
}

/* ---------- Marquee ---------- */
.marquee{background:linear-gradient(90deg,var(--maroon-deep),var(--maroon) 50%,var(--maroon-deep));border-top:1px solid var(--gold-2);border-bottom:1px solid var(--gold-2);overflow:hidden;padding:13px 0}
.marquee-track{display:flex;width:max-content;animation:marqueeMove 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-half{display:flex;align-items:center;gap:36px;padding-right:36px;flex:none}
.marquee-half span{font-family:Cinzel,serif;font-weight:600;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-pale);white-space:nowrap}
.marquee-half i{width:7px;height:7px;background:var(--gold-2);transform:rotate(45deg);flex:none}
@keyframes marqueeMove{to{transform:translateX(-50%)}}

/* ---------- Section rhythm & texture ---------- */
.section-ivory{background-color:var(--ivory);background-image:radial-gradient(rgba(166,125,43,.05) 1px,transparent 1.5px);background-size:22px 22px}
.strip{background-color:var(--white);background-image:none}
.features{background-image:radial-gradient(rgba(232,200,126,.06) 1px,transparent 1.5px),linear-gradient(150deg,var(--maroon),var(--maroon-2));background-size:24px 24px,cover}
@media (min-width:641px){
  .section{padding:112px 0}
  .section-head h2{font-size:42px}
  .features{padding:72px 0}
}

/* ---------- Stats counters (inside features band) ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:880px;margin:0 auto 46px;padding-bottom:42px;border-bottom:1px solid rgba(196,154,86,.35);text-align:center}
.stat-num{display:block;font-family:Cinzel,serif;font-weight:700;font-size:46px;line-height:1.05;color:var(--gold-pale)}
.stat-lab{display:block;margin-top:8px;font-family:Jost,sans-serif;font-weight:600;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:rgba(248,241,228,.85)}
@media (max-width:640px){
  .stats{gap:16px;margin-bottom:36px;padding-bottom:32px}
  .stat-num{font-size:32px}
  .stat-lab{font-size:10.5px;letter-spacing:1.4px}
}

/* ---------- Card hover: gold edge glow ---------- */
.shop-card:hover{border-color:var(--gold-2);box-shadow:0 18px 38px -12px rgba(74,16,48,.20),0 0 22px rgba(196,154,86,.28)}
.launch-card:hover{border-color:var(--gold-2);box-shadow:0 22px 40px -14px rgba(74,16,48,.20),0 0 22px rgba(196,154,86,.25)}
.strip-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.strip-card:hover{transform:translateY(-3px);border-color:var(--gold-2);box-shadow:0 14px 30px -10px rgba(74,16,48,.16),0 0 18px rgba(196,154,86,.22)}

/* ---------- Gold button shine sweep ---------- */
.btn-gold{position:relative;overflow:hidden}
.btn-gold::after{content:"";position:absolute;top:0;bottom:0;width:55%;left:-85%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);transition:left .6s ease;pointer-events:none}
.btn-gold:hover::after{left:125%}

/* ---------- Reduced motion: redesign additions ---------- */
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;translate:none;transition:none}
  .shimmer{animation:none}
  .hero-stage{animation:none}
  .hero-glow{animation:none}
  .marquee-track{animation:none}
  .btn-gold::after{display:none}
}

/* ---------- QA fix: 360px topbar fit ---------- */
@media (max-width:640px){
  .topbar-in{gap:8px}
  .wordmark{font-size:14.5px;letter-spacing:1.5px}
  .wordmark .diamond{margin:0 6px}
  .btn-bar{padding:9px 13px;font-size:13px}
}

/* ---------- QA fix 2: promo stage height balance (slides 2/3 fill the stage) ---------- */
@media (min-width:1024px){.promo .slide-hero .slide-in{min-height:min(78vh,720px)}}
.promo .slide-offer .slide-copy h1, .promo .slide-offer .slide-copy h2{font-size:40px;line-height:1.15}
.promo .slide-offer .slide-copy p{font-size:21px}
.slide-offer .price-card{padding:30px 38px;border-radius:22px}
.slide-offer .price-amt{font-size:56px}
.promo .slide-3 .slide-copy h1, .promo .slide-3 .slide-copy h2{font-size:38px;line-height:1.15}
.promo .slide-3 .slide-copy p{font-size:20px}
.promo .thumbs-row img{width:148px;height:190px;border-radius:16px}
@media (max-width:640px){
.promo .slide-offer .slide-copy h1, .promo .slide-offer .slide-copy h2{font-size:27px}
  .promo .slide-offer .slide-copy p{font-size:17px}
  .slide-offer .price-card{padding:22px 24px}
  .slide-offer .price-amt{font-size:42px}
.promo .slide-3 .slide-copy h1, .promo .slide-3 .slide-copy h2{font-size:27px}
  .promo .thumbs-row img{width:112px;height:144px}
  .promo .slide-hero .slide-in{gap:20px;padding-top:20px;padding-bottom:30px}
  .hero-trio .phone-centre{width:216px}
  .hero-trio .phone-side{width:150px}
}

/* ================= IN-PAGE DEMO VIEWER (owner order 2026-10-22) =================
   Demo kabhi bare alag page ki surat me nahi khulta — isi page ke upar
   phone mock me live demo (iframe) chalta hai, saath me theme ki qeemat
   aur Order button. /demo/<theme> route sirf iframe ke liye aur owner ke
   direct share ke liye zinda hai. */
.phone .screen iframe.dv-frame{width:100%;height:100%;border:0;display:block;background:transparent}
button.btn{font-family:Jost,sans-serif}
body.dv-open{overflow:hidden}
.dv-overlay{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:18px}
.dv-overlay[hidden]{display:none}
.dv-backdrop{position:absolute;inset:0;background:rgba(26,5,17,.74);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.dv-panel{position:relative;display:flex;align-items:center;gap:38px;width:min(1060px,96vw);max-height:96vh;overflow-y:auto;background:linear-gradient(155deg,var(--paper),var(--ivory));border:1px solid var(--line);border-radius:26px;padding:34px 38px;box-shadow:0 44px 90px -30px rgba(20,3,12,.55)}
.dv-close{position:absolute;top:16px;right:16px;z-index:3;width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(232,200,126,.55);background:rgba(255,253,248,.94);color:var(--maroon);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .18s ease,color .18s ease,transform .18s ease}
.dv-close:hover{border-color:var(--gold-2);color:var(--gold-text);transform:scale(1.05)}
.dv-close svg{width:19px;height:19px}
.dv-stage{position:relative;flex:none;margin:0 auto}
.dv-phone{width:min(324px,84vw,calc((96vh - 150px)*9/19.2))}
.dv-loading{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;gap:13px;align-items:center;justify-content:center;background:#efe4cd;color:var(--muted);font-size:12.5px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;transition:opacity .3s ease}
.dv-loading.done{opacity:0;pointer-events:none}
.dv-spin{width:34px;height:34px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--gold);animation:dvspin .9s linear infinite}
@keyframes dvspin{to{transform:rotate(360deg)}}
.dv-info{flex:1 1 330px;max-width:440px;text-align:left}
.dv-cat{font-family:Jost,sans-serif;font-weight:600;font-size:12px;letter-spacing:2.4px;text-transform:uppercase;color:var(--gold-text)}
.dv-name{font-family:Cinzel,serif;font-weight:600;font-size:31px;line-height:1.15;letter-spacing:.6px;color:var(--maroon);margin:8px 0 10px}
.dv-desc{font-family:"Cormorant Garamond",serif;font-size:18.5px;line-height:1.5;color:var(--muted)}
.dv-pkgs{display:flex;flex-direction:column;gap:12px;margin:22px 0 20px}
.dv-pkg{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--gold-2);border-radius:12px;padding:13px 16px}
.dv-pkg-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.dv-pkg-name{font-family:Cinzel,serif;font-weight:600;font-size:15.5px;letter-spacing:.8px;color:var(--maroon)}
.dv-pkg-amt{font-family:Cinzel,serif;font-weight:700;font-size:24px;line-height:1;color:var(--maroon)}
.dv-pkg-desc{font-size:13.5px;line-height:1.5;color:var(--muted);margin-top:4px}
.dv-pkg-featured{border:1.5px solid var(--gold);border-left:3px solid var(--gold);background:linear-gradient(180deg,#fffdf8,#fdf4de);box-shadow:0 14px 28px -14px rgba(166,125,43,.45)}
.dv-pill{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#fff;font-weight:600;font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;border-radius:999px;padding:4px 10px;margin-left:9px;vertical-align:3px;white-space:nowrap}
.dv-order{width:100%}
.dv-note{font-size:13px;color:var(--muted);margin-top:13px;text-align:center;line-height:1.55}
@media (max-width:820px){
  .dv-overlay{padding:0}
  .dv-panel{flex-direction:column;align-items:stretch;width:100%;height:100%;max-height:100%;border-radius:0;padding:58px 18px 30px;gap:22px}
  .dv-phone{width:min(320px,88vw)}
  .dv-info{max-width:none}
  .dv-name{font-size:26px}
}

/* Hero side-phone cycle (2026-10-22): crossfade layer over the base still */
.phone .screen img.cyc{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:0;transition:opacity 1.6s ease;pointer-events:none}
.phone .screen img.cyc.on{opacity:1}

/* FAQ (SEO section, 2026-10-22) */
.faq-list{max-width:780px;margin:44px auto 0;display:flex;flex-direction:column;gap:14px;text-align:left}
.faq{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:22px 24px}
.faq h3{font-family:Cinzel,serif;font-weight:600;font-size:17px;letter-spacing:.5px;color:var(--maroon);margin:0 0 8px}
.faq p{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:18px;line-height:1.55;color:var(--muted);margin:0}

/* FREE DEMO section (2026-10-23, paanchvi shakal — owner ka hukm:
   v2 ki compact card bhi page pe chipki hui lagi ("patching band").
   Is baar section kisi nayi bhasha me nahi — PAGE KI APNI design
   bhasha me bana hai, wahi tokens jo hero banane me istemaal hue:
   .eyebrow (Jost 600, 12px, ls 3.5px, gold-text) → Cinzel headline
   hero ke scale pe (maroon, ls .5px, lh 1.12) → Cormorant line
   (.section-sub wali) → framed art (.poster/price-card wali:
   radius, 1px gold-2 kinari, naram maroon saaya) → .btn-gold
   bilkul waisa hi. Composition section-head wali centered lay;
   surface hero ke ivory se ek tone-step (--paper), kinari-line
   koi nahi. Tasveer cinematic band crop me (aspect-ratio +
   object-fit cover) — tower namumkin. */
.free-sec{background:var(--paper);padding:72px 0 80px}
.free-sec-in{text-align:center}
.free-sec-title{font-family:Cinzel,serif;font-weight:600;font-size:clamp(30px,4vw,46px);line-height:1.12;letter-spacing:.5px;color:var(--maroon);margin-top:12px}
.free-sec-line{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:20px;line-height:1.5;color:var(--muted);max-width:36em;margin:14px auto 0}
.free-sec-art{max-width:1000px;margin:32px auto 0;border:1px solid var(--gold-2);border-radius:22px;overflow:hidden;box-shadow:0 30px 60px -24px rgba(74,16,48,.30);background:#efe4cd}
.free-sec-art picture{display:block}
.free-sec-art img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:50% 42%}
.free-sec-cta{margin-top:32px}
@media (max-width:640px){
  .free-sec{padding:42px 0 48px}
  .free-sec-title{font-size:27px;margin-top:10px}
  .free-sec-line{font-size:18px;margin-top:10px}
  .free-sec-art{margin-top:22px;border-radius:18px}
  .free-sec-art img{aspect-ratio:4/3;object-position:50% 32%}
  .free-sec-cta{margin-top:22px}
}