:root {
  /* Core color tokens */
  --color-bg:            #15112B;
  --color-bg-alt:        #211A49;
  --color-surface:       #2B2460;
  --color-surface-soft:  #352C72;
  --color-primary:       #7C6CFF;
  --color-primary-hover: #9387FF;
  --color-accent:        #73EAF3;
  --color-text:          #F5F4FF;
  --color-text-soft:     #B9B4D6;
  --color-border:        rgba(255,255,255,0.10);
  --color-shadow:        rgba(0,0,0,0.28);
  /* Section palette */
  --sec-app:      #1B153B;
  --sec-shop:     #211A49;
  --sec-subs:     #2B2460;
  --sec-rewards:  #241C55;
  --sec-loc:      #1A1634;
  --sec-reviews:  #201948;
  --sec-footer:   #120E25;
  /* Gradients */
  --gradient-hero:   linear-gradient(135deg, #15112B 0%, #241C55 100%);
  --gradient-button: linear-gradient(135deg, #7468FF 0%, #8B7BFF 100%);
  --gradient-accent: linear-gradient(135deg, #73EAF3 0%, #8C79FF 100%);
  /* Base tokens */
  --max-width: 1200px;
  --radius-sm: 12px; --radius-md: 18px; --radius-lg: 28px; --radius-pill: 999px;
  --space-1: 8px; --space-2: 12px; --space-3: 16px; --space-4: 24px; --space-5: 32px; --space-6: 48px; --space-7: 72px;
  --shadow-card: 0 12px 30px rgba(0,0,0,.22);
  --shadow-soft: 0 6px 20px rgba(0,0,0,.16);
  --serif: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --sans:  'Inter', 'Manrope', 'Helvetica Neue', Arial, sans-serif;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background:var(--color-bg); color:var(--color-text);
  font-family:var(--sans); font-weight:400; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; }
ul { list-style:none; }

.container { max-width:var(--max-width); margin:0 auto; padding:0 var(--space-4); }
.section { padding:var(--space-7) 0; }
h1, h2, h3.display { font-family:var(--serif); font-weight:500; letter-spacing:-0.02em; line-height:1.08; }
.grad { background:var(--gradient-accent); -webkit-background-clip:text; background-clip:text; color:transparent; font-style:italic; }
.eyebrow { color:var(--color-accent); font-size:.72rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; margin-bottom:var(--space-3); }
.text-soft { color:var(--color-text-soft); }

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; border:0; cursor:pointer; font-family:var(--sans); font-size:.92rem; font-weight:600; padding:14px 26px; border-radius:var(--radius-pill); transition:transform .2s, background .2s, box-shadow .2s; }
.btn-primary { background:var(--gradient-button); color:#fff; box-shadow:0 8px 22px rgba(124,108,255,.35); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(124,108,255,.5); }
.btn-secondary { background:transparent; color:var(--color-text); border:1px solid rgba(124,108,255,.45); }
.btn-secondary:hover { background:rgba(124,108,255,.14); transform:translateY(-2px); }
.link-more { color:var(--color-accent); font-size:.86rem; font-weight:600; display:inline-flex; align-items:center; gap:.35rem; transition:gap .2s; }
.link-more:hover { gap:.6rem; }

/* Cards */
.card { background:rgba(255,255,255,0.04); border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-card); }

/* Section headers */
.sec-head { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--space-4); margin-bottom:var(--space-6); flex-wrap:wrap; }
.sec-head h2 { font-size:clamp(1.9rem, 4vw, 2.9rem); }

/* Logo */
.logo { display:flex; align-items:center; gap:.6rem; }
.logo-mark { width:42px; height:42px; border-radius:var(--radius-sm); background:var(--gradient-button); display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:0 6px 16px rgba(124,108,255,.4); flex:none; }
.logo-mark span { font-family:var(--serif); font-weight:600; font-size:.62rem; line-height:1; color:#fff; letter-spacing:.02em; }
.logo-mark span.sm { font-family:var(--sans); font-size:.34rem; letter-spacing:.24em; font-weight:600; margin-top:2px; opacity:.85; }
.logo-word { font-family:var(--serif); font-size:1.15rem; font-weight:600; }
.nav-logo-img { height:84px; width:auto; border-radius:16px; box-shadow:0 10px 26px rgba(0,0,0,.45); position:relative; top:16px; }

/* Nav */
nav { position:fixed; top:0; left:0; right:0; z-index:200; background:rgba(21,17,43,0.72); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border-bottom:1px solid var(--color-border); transition:background .3s, box-shadow .3s; }
nav.scrolled { background:rgba(21,17,43,0.92); box-shadow:0 6px 24px rgba(0,0,0,.35); }
.nav-inner { max-width:var(--max-width); margin:0 auto; padding:0 var(--space-4); height:72px; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.nav-links { display:flex; gap:2rem; align-items:center; }
.nav-links a { font-size:.86rem; font-weight:500; color:var(--color-text-soft); transition:color .2s; }
.nav-links a:hover, .nav-links a.active { color:var(--color-text); }
.nav-right { display:flex; align-items:center; gap:1.2rem; }
.nav-cta { padding:10px 22px; font-size:.84rem; }
.nav-order { position:relative; }
.nav-order > .nav-cta { cursor:pointer; border:0; font-family:var(--sans); }
.nav-order-menu { position:absolute; top:100%; right:0; margin-top:10px; min-width:230px; background:rgba(21,17,43,0.98); border:1px solid var(--color-border); border-radius:16px; padding:8px; box-shadow:0 14px 34px rgba(0,0,0,.5); display:none; flex-direction:column; }
.nav-order-menu::before { content:''; position:absolute; left:0; right:0; top:-14px; height:14px; }
.nav-order:hover .nav-order-menu, .nav-order.open .nav-order-menu { display:flex; }
.nav-order-menu a { padding:11px 14px; border-radius:10px; font-size:.86rem; font-weight:500; color:var(--color-text-soft); }
.nav-order-menu a:hover { background:rgba(124,108,255,.16); color:var(--color-text); }
.mobile-order-label { font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--color-accent); margin-top:.4rem; }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:6px; background:none; border:0; }
.hamburger span { display:block; width:24px; height:2px; background:var(--color-text); border-radius:2px; transition:.3s; }
.mobile-menu { display:none; position:fixed; inset:72px 0 0; background:rgba(21,17,43,.98); backdrop-filter:blur(20px); z-index:199; flex-direction:column; align-items:center; justify-content:center; gap:1.8rem; }
.mobile-menu.open { display:flex; }
.mobile-menu a { font-size:1.2rem; font-weight:500; color:var(--color-text-soft); }

/* Hero */
.hero { position:relative; min-height:78vh; display:flex; align-items:center; padding:72px 0 108px; background:var(--gradient-hero); overflow:hidden; }
.hero-bg { position:absolute; inset:0; background:url('/images/HeroBG.jpg') center right / cover no-repeat; }
.hero-bg::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg, #15112B 0%, rgba(21,17,43,.86) 42%, rgba(21,17,43,.35) 100%); }
.hero .container { position:relative; z-index:2; width:100%; }
.hero-copy { max-width:620px; padding:var(--space-4) 0; }
.hero h1 { font-size:clamp(3rem, 8vw, 5.6rem); margin:var(--space-3) 0 var(--space-4); }
.hero h1 .grad { display:block; }
.hero p.lead { font-size:1.12rem; color:var(--color-text-soft); max-width:440px; margin-bottom:var(--space-5); }
.hero-btns { display:flex; gap:var(--space-3); flex-wrap:wrap; }

/* Hero quick features */
.quick { position:absolute; left:0; right:0; bottom:0; z-index:2; background:rgba(18,14,37,0.55); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-top:1px solid var(--color-border); }
.quick-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-4); padding:var(--space-4) 0; }
.quick-item { display:flex; gap:.9rem; align-items:flex-start; }
.quick-item .qi { width:38px; height:38px; border-radius:var(--radius-sm); background:rgba(124,108,255,.16); display:flex; align-items:center; justify-content:center; flex:none; color:var(--color-primary-hover); }
.quick-item h4 { font-size:.95rem; font-weight:600; }
.quick-item p { font-size:.82rem; color:var(--color-text-soft); }

/* App section */
.app { background:var(--sec-app); }
.app-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:var(--space-7); align-items:center; }
.app h2 { font-size:clamp(2rem, 4.4vw, 3.2rem); margin-bottom:var(--space-4); }
.app .lead { color:var(--color-text-soft); margin-bottom:var(--space-5); max-width:420px; }
.app-features { display:grid; gap:var(--space-3); margin-bottom:var(--space-5); }
.app-features li { display:flex; align-items:center; gap:.8rem; font-size:.96rem; }
.app-features .chk { width:26px; height:26px; border-radius:50%; background:rgba(115,234,243,.14); color:var(--color-accent); display:flex; align-items:center; justify-content:center; flex:none; }
.store-btns { display:flex; gap:var(--space-3); flex-wrap:wrap; }
.store-btns a { transition:transform .2s; }
.store-btns a:hover { transform:translateY(-2px); }
.store-btns img { height:52px; width:auto; border-radius:12px; }

.app-right { display:flex; align-items:center; justify-content:center; gap:var(--space-6); }
.app-phone-img { width:100%; max-width:270px; height:auto; display:block; filter:drop-shadow(0 26px 50px rgba(0,0,0,.55)); }
/* Phone mockup (CSS) */
.phone { width:270px; flex:none; background:#0d0a1e; border:1px solid rgba(255,255,255,.12); border-radius:40px; padding:14px; box-shadow:0 30px 60px rgba(0,0,0,.5); }
.phone-screen { background:linear-gradient(180deg,#1a1433,#120e26); border-radius:28px; padding:16px 14px 12px; overflow:hidden; }
.ph-status { display:flex; justify-content:space-between; font-size:.62rem; color:var(--color-text-soft); margin-bottom:14px; }
.ph-head { display:flex; align-items:center; gap:.5rem; margin-bottom:14px; }
.ph-head .logo-mark { width:26px; height:26px; border-radius:8px; }
.ph-head .logo-mark span { font-size:.4rem; }
.ph-head .logo-mark span.sm { font-size:.22rem; }
.ph-head b { font-size:.8rem; font-family:var(--serif); }
.ph-balance { background:rgba(124,108,255,.14); border:1px solid var(--color-border); border-radius:14px; padding:12px; margin-bottom:12px; }
.ph-balance small { font-size:.55rem; letter-spacing:.12em; text-transform:uppercase; color:var(--color-text-soft); }
.ph-balance .num { font-size:1.7rem; font-family:var(--serif); font-weight:600; }
.ph-order { background:var(--gradient-button); color:#fff; text-align:center; padding:10px; border-radius:12px; font-size:.78rem; font-weight:600; margin-bottom:14px; }
.ph-fav-head { display:flex; justify-content:space-between; font-size:.66rem; margin-bottom:8px; }
.ph-fav-head span:last-child { color:var(--color-accent); }
.ph-fav { display:flex; align-items:center; gap:.6rem; background:rgba(255,255,255,.04); border-radius:12px; padding:8px; margin-bottom:8px; }
.ph-fav .thumb { width:34px; height:34px; border-radius:8px; background:var(--gradient-accent); flex:none; }
.ph-fav .thumb.b { background:linear-gradient(135deg,#6d5b3f,#3a2c1c); }
.ph-fav .info { flex:1; }
.ph-fav .info b { font-size:.72rem; display:block; }
.ph-fav .info small { font-size:.58rem; color:var(--color-text-soft); }
.ph-fav .price { font-size:.72rem; font-weight:600; color:var(--color-accent); }
.ph-nav { display:flex; justify-content:space-between; padding:12px 6px 4px; border-top:1px solid var(--color-border); margin-top:6px; }
.ph-nav span { width:16px; height:16px; border-radius:5px; background:rgba(255,255,255,.14); }
.ph-nav span:first-child { background:var(--color-primary); }

.app-stats { display:flex; flex-direction:column; gap:var(--space-5); }
.app-stats .stat .stars { color:#ffcf5c; font-size:.9rem; letter-spacing:2px; }
.app-stats .stat .big { font-size:2rem; font-family:var(--serif); font-weight:600; }
.app-stats .stat small { font-size:.8rem; color:var(--color-text-soft); }
.app-stats .quote { font-style:italic; font-family:var(--serif); font-size:1.05rem; max-width:210px; border-left:2px solid var(--color-primary); padding-left:var(--space-3); }
.app-stats .quote cite { display:block; font-style:normal; font-family:var(--sans); font-size:.78rem; color:var(--color-text-soft); margin-top:.4rem; }

/* Shop */
.shop { background:var(--sec-shop); }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-4); }
.product { overflow:hidden; }
.product .ph-img { aspect-ratio:1/1; background:#0f0b22; }
.product .ph-img img { width:100%; height:100%; object-fit:cover; }
.product .body { padding:var(--space-4); }
.product h4 { font-size:1.05rem; font-weight:600; margin-bottom:2px; }
.product .desc { font-size:.8rem; color:var(--color-text-soft); margin-bottom:.6rem; }
.product .price { font-size:1rem; font-weight:700; color:var(--color-accent); }
.product .p-foot { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:.7rem; }
.product .more-info { font-size:.78rem; font-weight:600; color:var(--color-accent); border:1px solid rgba(115,234,243,.4); border-radius:var(--radius-pill); padding:.35rem .85rem; white-space:nowrap; transition:background .2s,color .2s; }
.product .more-info:hover { background:var(--color-accent); color:#0f0b22; }

/* Subscriptions */
.subs { background:var(--sec-subs); }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-4); align-items:stretch; }
.plan { padding:var(--space-5); display:flex; flex-direction:column; position:relative; }
.plan.featured { background:rgba(124,108,255,.12); border:1.5px solid var(--color-primary); box-shadow:0 16px 40px rgba(124,108,255,.25); }
.plan .badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--gradient-button); color:#fff; font-size:.66rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:5px 14px; border-radius:var(--radius-pill); }
.plan .p-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:.3rem; }
.plan h3 { font-family:var(--serif); font-size:1.5rem; font-weight:600; }
.plan .p-price { font-size:1.5rem; font-weight:700; color:var(--color-accent); }
.plan .p-price small { font-size:.7rem; font-weight:500; color:var(--color-text-soft); }
.plan .p-sub { font-size:.82rem; color:var(--color-text-soft); margin-bottom:var(--space-4); }
.plan .p-feats { display:grid; gap:.6rem; margin-bottom:var(--space-5); flex:1; }
.plan .p-feats li { display:flex; align-items:center; gap:.6rem; font-size:.86rem; }
.plan .p-feats .chk { color:var(--color-accent); }
.plan .btn { width:100%; }
.subs-note { text-align:center; margin-top:var(--space-5); font-size:.82rem; color:var(--color-text-soft); display:flex; align-items:center; justify-content:center; gap:.5rem; }

/* Specials */
.specials { background:var(--sec-loc); }
.special { overflow:hidden; }
.special .s-img { position:relative; aspect-ratio:4/3; }
.special .s-img img { width:100%; height:100%; object-fit:cover; }
.special .s-badge { position:absolute; top:12px; left:12px; background:rgba(21,17,43,.8); backdrop-filter:blur(6px); color:var(--color-accent); font-size:.6rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; padding:5px 10px; border-radius:var(--radius-pill); }
.special .body { padding:var(--space-4); }
.special h4 { font-size:1.02rem; font-weight:600; }
.special .desc { font-size:.78rem; color:var(--color-text-soft); margin:2px 0 .5rem; }
.special .price { font-size:.95rem; font-weight:700; color:var(--color-accent); }
.special .p-foot { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:.7rem; }
.special .order-now { font-size:.78rem; font-weight:600; color:#fff; background:var(--gradient-button); border-radius:var(--radius-pill); padding:.4rem .95rem; white-space:nowrap; transition:filter .2s,transform .2s; }
.special .order-now:hover { filter:brightness(1.08); transform:translateY(-1px); }

/* Locations */
.locations { background:var(--sec-loc); }
.loc { overflow:hidden; }
.loc .map { height:170px; width:100%; display:block; border:0; }
.loc .body { padding:var(--space-4); }
.loc h4 { font-size:1.1rem; font-weight:600; margin-bottom:.3rem; }
.loc .addr { font-size:.82rem; color:var(--color-text-soft); margin-bottom:.8rem; }
.loc .hours { font-size:.8rem; display:flex; justify-content:space-between; gap:1rem; padding:.2rem 0; border-top:1px solid var(--color-border); }
.loc .hours span:last-child { color:var(--color-text); }
.loc .phone { font-size:.82rem; color:var(--color-accent); margin-top:.7rem; }
.loc .loc-shop { display:flex; width:100%; margin-top:.9rem; padding:11px; font-size:.84rem; }

/* Rewards banner */
.rewards { padding:var(--space-6) 0; }
.rewards-card { background:linear-gradient(120deg,#2f2568 0%, #3a2f7d 55%, #4a3a9a 100%); border:1px solid rgba(124,108,255,.4); border-radius:var(--radius-lg); padding:var(--space-6); display:grid; grid-template-columns:1fr 1.2fr; gap:var(--space-6); align-items:center; box-shadow:var(--shadow-card); }
.rewards-card .r-left .eyebrow { color:var(--color-accent); }
.rewards-card h2 { font-size:clamp(1.8rem,3.6vw,2.6rem); margin-bottom:.6rem; }
.rewards-card p { color:var(--color-text-soft); font-size:.92rem; margin-bottom:var(--space-4); max-width:340px; }
.perks { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3); }
.perk { text-align:center; }
.perk img { width:52px; height:52px; margin:0 auto .5rem; object-fit:contain; }
.perk b { display:block; font-size:.82rem; font-weight:600; }
.perk small { font-size:.68rem; color:var(--color-text-soft); }

/* Reviews */
.reviews { background:var(--sec-reviews); }
.reviews .sec-head { justify-content:flex-start; flex-direction:column; align-items:flex-start; text-align:left; }
.review { padding:var(--space-5); }
.review .r-top { display:flex; align-items:center; gap:.8rem; margin-bottom:var(--space-3); }
.review .r-top img { width:52px; height:52px; border-radius:50%; object-fit:cover; }
.review .r-top b { font-size:.95rem; }
.review .stars { color:#ffcf5c; font-size:.82rem; letter-spacing:2px; }
.review p { font-size:.92rem; color:var(--color-text-soft); font-style:italic; }

/* Footer */
footer { background:var(--sec-footer); padding:var(--space-7) 0 var(--space-4); border-top:1px solid var(--color-border); }
.foot-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:var(--space-6); margin-bottom:var(--space-6); }
.foot h5 { font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--color-text-soft); margin-bottom:var(--space-3); }
.foot p { font-size:.86rem; color:var(--color-text-soft); margin-bottom:var(--space-3); max-width:260px; }
.subscribe { display:flex; gap:.5rem; max-width:320px; }
.subscribe input { flex:1; background:rgba(255,255,255,.05); border:1px solid var(--color-border); border-radius:var(--radius-pill); padding:11px 16px; color:var(--color-text); font-family:var(--sans); font-size:.84rem; }
.subscribe input::placeholder { color:var(--color-text-soft); }
.subscribe .btn { padding:11px 20px; font-size:.82rem; }
.foot-links { display:grid; gap:.6rem; }
.foot-links a { font-size:.86rem; color:var(--color-text-soft); }
.foot-links a:hover { color:var(--color-text); }
.socials { display:flex; gap:.8rem; margin-bottom:var(--space-4); }
.socials a { width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; color:var(--color-text-soft); transition:.2s; }
.socials a:hover { background:var(--color-primary); color:#fff; }
.foot-contact { font-size:.86rem; color:var(--color-text-soft); }
.foot-bottom { border-top:1px solid var(--color-border); padding-top:var(--space-4); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.78rem; color:var(--color-text-soft); }
.foot-bottom a { margin-left:1.2rem; }

/* Shop-embed slot (3rd-party paste-in; hidden until populated) */
#shop-embed:empty { display:none; }

/* Shop lightbox */
.lightbox { position:fixed; inset:0; z-index:400; display:none; align-items:center; justify-content:center; padding:24px; }
.lightbox.open { display:flex; }
.lightbox-backdrop { position:absolute; inset:0; background:rgba(10,7,24,0.82); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.lightbox-panel { position:relative; width:100%; max-width:1200px; height:86vh; max-height:900px; background:var(--color-bg-alt); border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:0 30px 80px rgba(0,0,0,.6); overflow:hidden; }
.lightbox-iframe { width:100%; height:100%; border:0; display:block; background:#fff; }
.lightbox-close { position:absolute; top:10px; right:12px; z-index:2; width:36px; height:36px; border:0; border-radius:50%; background:rgba(0,0,0,.55); color:#fff; font-size:1.5rem; line-height:34px; text-align:center; cursor:pointer; transition:background .2s; }
.lightbox-close:hover { background:var(--color-primary); }

/* ── Product page ── */
.product-page { padding-top:72px; }
.prod-hero { background:var(--gradient-hero); padding:var(--space-7) 0; }
.prod-hero > .container { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-7); align-items:center; }
.prod-crumbs { font-size:.78rem; color:var(--color-text-soft); margin-bottom:var(--space-4); }
.prod-crumbs a:hover { color:var(--color-text); }
.prod-gallery .main-img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--radius-lg); border:1px solid var(--color-border); box-shadow:var(--shadow-card); background:#0f0b22; }
.prod-thumbs { display:flex; gap:var(--space-3); margin-top:var(--space-3); }
.prod-thumbs img { width:78px; height:78px; object-fit:cover; border-radius:var(--radius-sm); border:1px solid var(--color-border); cursor:pointer; opacity:.65; transition:opacity .2s, border-color .2s; }
.prod-thumbs img:hover, .prod-thumbs img.active { opacity:1; border-color:var(--color-primary); }
.prod-info .eyebrow { margin-bottom:var(--space-2); }
.prod-info h1 { font-size:clamp(2.2rem,4.4vw,3.4rem); margin-bottom:var(--space-3); }
.prod-rating { color:#ffcf5c; letter-spacing:2px; font-size:.9rem; margin-bottom:var(--space-3); }
.prod-rating span { color:var(--color-text-soft); font-size:.82rem; letter-spacing:0; margin-left:.5rem; }
.prod-price { font-family:var(--serif); font-size:2.2rem; font-weight:600; color:var(--color-accent); margin-bottom:var(--space-4); }
.prod-price small { font-size:.9rem; color:var(--color-text-soft); font-family:var(--sans); margin-left:.4rem; }
.prod-blurb { color:var(--color-text-soft); font-size:1.02rem; margin-bottom:var(--space-5); max-width:470px; }
.prod-opt { margin-bottom:var(--space-4); }
.prod-opt .lbl { font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--color-text-soft); margin-bottom:.6rem; }
.prod-opt .choices { display:flex; gap:.6rem; flex-wrap:wrap; }
.prod-opt .choices button { background:rgba(255,255,255,.05); border:1px solid var(--color-border); color:var(--color-text); border-radius:var(--radius-pill); padding:9px 18px; font-size:.84rem; font-family:var(--sans); cursor:pointer; transition:.2s; }
.prod-opt .choices button:hover, .prod-opt .choices button.active { border-color:var(--color-primary); background:rgba(124,108,255,.16); }
.prod-buy { display:flex; gap:var(--space-3); flex-wrap:wrap; margin-top:var(--space-5); }
.prod-buy .btn { flex:1; min-width:180px; }

.prod-highlights { background:var(--sec-app); }
.hl-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-4); }
.hl { text-align:center; padding:var(--space-5) var(--space-3); }
.hl .ic { font-size:1.7rem; margin-bottom:.5rem; }
.hl .v { font-family:var(--serif); font-size:1.3rem; font-weight:600; }
.hl .l { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--color-text-soft); margin-top:.2rem; }

.prod-story { background:var(--sec-loc); }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-7); align-items:center; }
.story-grid img { width:100%; border-radius:var(--radius-lg); border:1px solid var(--color-border); box-shadow:var(--shadow-card); }
.prod-story h2 { font-size:clamp(1.9rem,4vw,2.8rem); margin-bottom:var(--space-4); }
.prod-story p { color:var(--color-text-soft); margin-bottom:var(--space-3); }

.prod-related { background:var(--sec-shop); }

/* ── Responsive ── */
@media (max-width: 960px) {
  .nav-links, .nav-right .nav-cta { display:none; }
  .hamburger { display:flex; }
  .app-grid { grid-template-columns:1fr; gap:var(--space-6); }
  .app-right { flex-direction:column; }
  .app-stats { flex-direction:row; flex-wrap:wrap; justify-content:center; gap:var(--space-5); }
  .rewards-card { grid-template-columns:1fr; }
  .grid-4 { grid-template-columns:repeat(2,1fr); }
  .foot-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 900px) {
  .prod-hero > .container, .story-grid { grid-template-columns:1fr; gap:var(--space-5); }
  .hl-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 680px) {
  .section { padding:var(--space-6) 0; }
  .quick-grid { grid-template-columns:1fr; gap:var(--space-3); }
  .grid-3 { grid-template-columns:1fr; }
  .plan.featured { transform:none; }
  .perks { grid-template-columns:repeat(2,1fr); gap:var(--space-4); }
  .sec-head { flex-direction:column; align-items:flex-start; }
  .foot-grid { grid-template-columns:1fr; }
  .hero { min-height:auto; padding:110px 0 0; }
  .quick { position:static; margin-top:var(--space-5); }
  .nav-logo-img { height:54px; top:8px; border-radius:12px; }
}
@media (max-width: 460px) {
  .grid-4 { grid-template-columns:1fr; }
  .hero-btns .btn, .store-btns { width:100%; }
  .store-btns a { flex:1; }
  .prod-buy .btn { flex:1 1 100%; }
}

/* ============ Blog slider + cards ============ */
.blogs { background:var(--sec-reviews); }
.blog-card { overflow:hidden; display:block; }
.blog-card .bc-img { aspect-ratio:16/10; overflow:hidden; background:#0f0b22; }
.blog-card .bc-img img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.blog-card:hover .bc-img img { transform:scale(1.05); }
.blog-card .body { padding:var(--space-4); }
.blog-card .body .eyebrow { margin-bottom:6px; }
.blog-card h4 { font-size:1.12rem; font-weight:600; margin:2px 0 8px; }
.blog-card .desc { font-size:.85rem; color:var(--color-text-soft); }
.blog-index { min-height:64vh; }

/* ============ CMS Pages (blog / standard / contact) ============ */
.cms-page { min-height:60vh; }
/* Blog post */
.page-blog .pb-hero { min-height:340px; display:flex; align-items:flex-end; background-size:cover; background-position:center; padding:var(--space-7) 0 var(--space-6); }
.page-blog .pb-crumbs { font-size:.8rem; color:var(--color-text-soft); margin-bottom:10px; }
.page-blog .pb-crumbs a { color:var(--color-text-soft); }
.page-blog .pb-hero h1 { font-family:var(--serif); font-size:clamp(2rem,5vw,3.2rem); font-weight:600; max-width:18ch; }
.pb-body { max-width:760px; padding:var(--space-6) var(--space-4); }
.pb-body p { margin-bottom:1.1rem; font-size:1.06rem; line-height:1.85; color:var(--color-text-soft); }
.pb-body .link-more { margin-top:1rem; }
/* Standard page */
.ps-head { padding:var(--space-7) 0 var(--space-3); }
.ps-head h1 { font-family:var(--serif); font-size:clamp(2rem,5vw,3.2rem); font-weight:600; }
.ps-hero-img { width:100%; max-height:420px; object-fit:cover; border-radius:var(--radius-lg); margin:var(--space-4) 0; }
.ps-body { max-width:760px; padding:var(--space-3) var(--space-4) var(--space-7); }
.ps-body p { margin-bottom:1.1rem; font-size:1.06rem; line-height:1.85; color:var(--color-text-soft); }
/* Contact page */
.page-contact .contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-5); padding:var(--space-4) var(--space-4) var(--space-7); align-items:start; }
.contact-info { padding:var(--space-5); }
.contact-info h3 { font-family:var(--serif); font-size:1.5rem; margin-bottom:1rem; }
.ci-row { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--color-border); font-size:.9rem; }
.ci-row span { color:var(--color-text-soft); }
.contact-form { padding:var(--space-5); display:flex; flex-direction:column; gap:14px; }
.contact-form label { display:flex; flex-direction:column; gap:6px; font-size:.82rem; color:var(--color-text-soft); }
.contact-form input, .contact-form textarea { background:var(--color-bg); color:var(--color-text); border:1px solid var(--color-border); border-radius:10px; padding:11px 13px; font:inherit; }
.contact-form input:focus, .contact-form textarea:focus { outline:0; border-color:var(--color-primary); }
.contact-form .hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.contact-form .cf-status { margin:6px 0 0; font-size:.88rem; color:var(--color-accent); }
@media (max-width: 760px) { .page-contact .contact-grid { grid-template-columns:1fr; } }