/* =========================================================
   TrueStack — Design System
   Light "TrueStack" system: cream base, neon accents
   ========================================================= */

:root{
  --cream:        #FFFAE5;
  --cream-alt:     #FFF3C2;
  --paper:         #FFFFFF;
  --ink:           #16150E;
  --ink-soft:      #55523F;
  --ink-faint:     #8C876B;
  --line:          rgba(22,21,14,0.10);
  --line-strong:   rgba(22,21,14,0.18);

  /* brand fills (use full saturation for buttons/badges/borders) */
  --green:         #12F761;
  --cyan:          #00D3E2;
  --purple:        #4E0AFF;
  --pink:          #EF256D;

  /* on-cream text-safe variants (darkened for AA contrast) */
  --green-ink:      #0B8A3E;
  --cyan-ink:       #007587;
  --purple-ink:     #4E0AFF;
  --pink-ink:       #C41457;

  /* dedicated, non-product hues: urgency/promo and informational "new" label */
  --promo:          #C99A3E;
  --new-label:      var(--ink);

  --radius:        14px;
  --shadow-sm:     0 1px 2px rgba(22,21,14,0.06), 0 1px 1px rgba(22,21,14,0.04);
  --shadow-md:     0 8px 24px rgba(22,21,14,0.08);
  --shadow-lg:     0 16px 48px rgba(22,21,14,0.14);

  --container:     1200px;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; overflow-x: hidden; }
body{
  margin:0;
  background: var(--cream);
  color: var(--ink);
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width: 100%; display:block; }
a{ color: inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; cursor:pointer; }
.container{ width:100%; max-width: var(--container); margin:0 auto; padding: 0 24px; }
section{ position: relative; }

h1,h2,h3,h4{
  font-family: 'Bebas Neue', 'Anton', sans-serif;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  line-height: 1.02;
  margin: 0 0 .4em;
  color: var(--ink);
}
h1{ font-size: clamp(2.6rem, 6vw, 4.6rem); }
h2{ font-size: clamp(2rem, 4.4vw, 3rem); }
h3{ font-size: clamp(1.35rem, 2.6vw, 1.7rem); }
h4{ font-size: 1.1rem; letter-spacing: .04em; }

.eyebrow{
  font-family: 'Raleway', sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .8rem;
  color: var(--green-ink);
}
p{ margin: 0 0 1em; color: var(--ink-soft); }
.lede{ font-size: 1.15rem; color: var(--ink-soft); }

.text-center{ text-align:center; }
.mx-auto{ margin-left:auto; margin-right:auto; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:'Raleway', sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .92rem;
  padding: 1em 1.6em;
  border: 2px solid var(--ink);
  border-radius: 4px;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space: nowrap;
}
.btn:hover{ transform: translateY(-2px); }
.btn-primary{
  background: var(--green);
  border-color: var(--ink);
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}
.btn-primary:hover{ box-shadow: var(--shadow-md); }
.btn-dark{
  background: var(--ink);
  border-color: var(--ink);
  color: var(--cream);
}
.btn-dark:hover{ box-shadow: var(--shadow-md); }
.btn-ghost{
  background: transparent;
  border-color: var(--ink);
  color: var(--ink);
}
.btn-block{ width:100%; }
.btn-lg{ padding: 1.15em 2em; font-size: 1rem; }
.btn[disabled]{ opacity:.5; pointer-events:none; }

/* ---------- Tags / pills ---------- */
.tag{
  display:inline-flex; align-items:center; gap:.4em;
  font-family:'DM Sans', sans-serif;
  font-weight:700;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .72rem;
  padding: .45em .9em;
  border: 1.5px solid currentColor;
  border-radius: 999px;
  background: transparent;
}
.tag-green{ color: var(--green-ink); }
.tag-cyan{ color: var(--cyan-ink); }
.tag-purple{ color: var(--purple-ink); }
.tag-pink{ color: var(--pink-ink); }

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 100;
  background: rgba(255,250,229,0.88);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding: 16px 24px;
}
.logo{
  font-family:'Anton', sans-serif;
  font-size: 1.7rem;
  letter-spacing: .01em;
  text-transform: uppercase;
  color: var(--ink);
  display:flex; align-items:baseline; gap:.12em;
}
.logo span{ color: var(--green-ink); }
.main-nav{ display:flex; align-items:center; gap: 30px; }
.main-nav a{
  font-family:'Raleway', sans-serif; font-weight:700; font-size:.9rem;
  text-transform: uppercase; letter-spacing:.03em;
  color: var(--ink-soft);
  transition: color .15s;
}
.main-nav a:hover{ color: var(--ink); }
.header-actions{ display:flex; align-items:center; gap:16px; }
.currency-select{
  border:2px solid var(--ink); border-radius:4px; padding:.45em .5em; background:var(--paper);
  font-family:'Raleway',sans-serif; font-weight:800; font-size:.78rem; color:var(--ink);
  cursor:pointer; max-width:110px;
}
.cart-btn{
  position:relative; display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; flex-shrink:0;
  border:2px solid var(--ink); border-radius:4px; background:var(--paper);
  transition: background .15s ease;
}
.cart-btn:hover{ background: var(--cream-alt); }
.cart-btn svg{ width:19px; height:19px; }
.cart-count{
  position:absolute; top:-8px; right:-8px;
  background: var(--pink); color:#fff; font-size:.68rem; font-weight:800;
  width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border: 2px solid var(--cream);
}
.nav-toggle{ display:none; background:none; border:none; padding:8px; }
.nav-toggle svg{ width:26px; height:26px; }

@media (max-width: 880px){
  .main-nav{
    position:fixed; inset: 68px 0 0 0; background: var(--cream);
    flex-direction:column; align-items:flex-start; padding: 28px 24px; gap: 22px;
    transform: translateX(100%); transition: transform .25s ease;
    overflow-y:auto;
  }
  .main-nav.open{ transform: translateX(0); }
  .main-nav a{ font-size:1.1rem; }
  .nav-toggle{ display:block; }
}

/* ---------- Announcement bar ---------- */
.announce{
  background: var(--ink); color: var(--cream);
  text-align:center; font-family:'Raleway',sans-serif; font-weight:700;
  font-size:.82rem; letter-spacing:.03em; padding: 10px 16px;
}
.announce strong{ color: var(--green); }
.announce a{ text-decoration:underline; margin-left:.4em; }

/* ---------- Hero ---------- */
.hero{
  padding: 76px 0 60px;
  background-image: radial-gradient(circle, rgba(22,21,14,0.14) 1px, transparent 1.4px);
  background-size: 22px 22px;
  background-position: center top;
}
.hero-grid{
  display:grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items:center;
}
.hero-badges{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.hero h1{ margin-bottom:.3em; }
.hero h1 .accent{ color: var(--green-ink); }
.hero-cta-row{ display:flex; gap:14px; flex-wrap:wrap; margin-top: 28px; align-items:center; }
.hero-proof{ display:flex; align-items:center; gap:12px; margin-top:22px; font-size:.88rem; color:var(--ink-soft); }
.hero-quickpick{ display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }
.hero-quickpick a{
  font-size:.82rem; font-weight:600; color:var(--ink); text-decoration:none;
  background:var(--cream-alt); border:1px solid var(--line-strong); border-radius:999px;
  padding:6px 14px; transition: background .15s ease, transform .15s ease;
}
.hero-quickpick a:hover{ background:var(--green); border-color:var(--green); transform:translateY(-1px); }
.hero-visual{ position:relative; }

@media (max-width: 940px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; }
}

/* ---------- Mock Notion screen ---------- */
.mock-window{
  background: var(--paper); border-radius: 16px; border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-lg); overflow:hidden; transform: rotate(-1.2deg);
}
.mock-titlebar{ display:flex; gap:6px; padding:12px 16px; border-bottom:1px solid var(--line); }
.mock-dot{ width:10px; height:10px; border-radius:50%; background: var(--line-strong); }
.mock-body{ padding: 22px 24px; }
.mock-h{ font-family:'Bebas Neue',sans-serif; font-size:1.4rem; margin-bottom:6px; }
.mock-sub{ font-size:.8rem; color:var(--ink-faint); margin-bottom:16px; }
.mock-row{
  display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:10px;
  background: var(--cream-alt); margin-bottom:8px; font-size:.85rem;
}
.mock-chip{
  font-size:.65rem; font-weight:800; text-transform:uppercase; padding:3px 9px; border-radius:6px;
  color:#fff;
}
.chip-green{ background: var(--green-ink); }
.chip-cyan{ background: var(--cyan-ink); }
.chip-pink{ background: var(--pink-ink); }
.chip-purple{ background: var(--purple-ink); }
.mock-stats{ display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top:16px; }
.mock-stat{ background:var(--cream-alt); border-radius:10px; padding:12px; text-align:center; }
.mock-stat b{ display:block; font-family:'Bebas Neue',sans-serif; font-size:1.5rem; }

/* ---------- Product screenshot gallery ---------- */
.screens-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: 28px 24px; }
@media (max-width:760px){ .screens-grid{ grid-template-columns:1fr; } }
.screen-card{ display:flex; flex-direction:column; }
.mock-window--flat{ transform:none; }
.mock-window--flat img{ display:block; width:100%; height:auto; }
.screen-caption{ margin:12px 4px 0; font-size:.88rem; color:var(--ink-soft); }
.screen-caption strong{ color:var(--ink); }

.mock-stat span{ font-size:.68rem; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.04em; }

/* ---------- Sections ---------- */
.section{ padding: 84px 0; }
.section-alt{ background: var(--cream-alt); }
.section-dark{ background: var(--ink); color: var(--cream); }
.section-dark h2, .section-dark h3{ color: var(--cream); }
.section-dark p{ color: rgba(255,250,229,0.72); }
.section-head{ max-width: 680px; margin: 0 auto 52px; text-align:center; }
.section-head .eyebrow{ display:block; margin-bottom:10px; }

/* ---------- Logo strip ---------- */
.logo-strip{
  position:relative; padding: 28px 0;
  background: linear-gradient(90deg, var(--cream-alt) 0%, #fff3d6 50%, var(--cream-alt) 100%);
  background-size:220% 100%;
  border-top:2px solid var(--promo); border-bottom:2px solid var(--promo);
}
.logo-strip-inner{
  display:flex; align-items:center; flex-wrap:nowrap;
  overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,black 6%,black 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,black 6%,black 94%,transparent);
}
.logo-strip-track{
  display:flex; align-items:center; gap:24px; flex-shrink:0;
  width:max-content; padding-right:24px;
  animation: logo-strip-scroll 22s linear infinite;
}
.logo-strip:hover .logo-strip-track{ animation-play-state:paused; }
.logo-strip-inner span{
  display:inline-flex; align-items:center; gap:8px; flex-shrink:0; white-space:nowrap;
  font-family:'Raleway',sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; color:var(--ink);
}
.logo-strip-inner span::before{
  content:'✓'; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
  width:18px; height:18px; border-radius:50%; background:var(--promo); color:#fff;
  font-size:.62rem; font-weight:800;
}

@keyframes logo-strip-scroll{
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: no-preference){
  .logo-strip{ animation: logo-strip-shimmer 8s ease-in-out infinite; }
}
@media (prefers-reduced-motion: reduce){
  .logo-strip-track{ animation:none; }
  .logo-strip-inner{ overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; -webkit-mask-image:none; mask-image:none; }
  .logo-strip-inner::-webkit-scrollbar{ display:none; }
}
@keyframes logo-strip-shimmer{
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* ---------- Product grid ---------- */
.product-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
@media (max-width: 980px){ .product-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px){ .product-grid{ grid-template-columns: 1fr; } }

.product-card{
  background: var(--paper); border:1px solid var(--line); border-radius: var(--radius);
  overflow:hidden; display:flex; flex-direction:column; box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease;
}
.product-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-md); }
.product-card-media{
  aspect-ratio: 16/11; display:flex; align-items:center; justify-content:center;
  font-family:'Anton',sans-serif; font-size:2.6rem; color:#fff; position:relative;
}
.product-card-body{ padding: 22px; display:flex; flex-direction:column; gap:10px; flex:1; }
.product-card-body h3{ margin-bottom:0; }
.product-card-price{ display:flex; align-items:baseline; gap:8px; margin-top:auto; padding-top:10px; }
.product-card-guarantee{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:.74rem; color:var(--ink-faint); }
.product-card-guarantee span{ display:flex; align-items:center; gap:4px; }

/* Comparison table + value-line — shared by /go and /products pages */
.cmp-table{ width:100%; border-collapse:collapse; font-size:1rem; }
.cmp-table th,.cmp-table td{ padding:14px 10px; text-align:center; border-bottom:1px solid var(--line); }
.cmp-table th:first-child,.cmp-table td:first-child{ text-align:left; }
.cmp-table thead th{ font-family:'Bebas Neue',sans-serif; font-size:1.1rem; color:var(--ink); font-weight:400; }
@media (max-width:640px){
  .cmp-table{ font-size:.74rem; }
  .cmp-table th,.cmp-table td{ padding:9px 5px; }
  .cmp-table thead th{ font-size:.86rem; }
}
.cmp-yes{ color:var(--green-ink); font-weight:800; }
.cmp-no{ color:#B4483B; }
.value-line{ font-size:.95rem; color:var(--pink-ink); font-weight:700; text-align:center; margin:10px 0 0; }
.price{ font-family:'Bebas Neue',sans-serif; font-size:1.6rem; }
.price-was{ text-decoration: line-through; color: var(--ink-faint); font-size:.95rem; }
.product-card-foot{ display:flex; gap:10px; padding: 0 22px 22px; }

.grad-garden{ background: linear-gradient(135deg,#0B8A3E,#12F761); }
.grad-pet{ background: linear-gradient(135deg,#C41457,#EF256D); }
.grad-gym{ background: linear-gradient(135deg,#4E0AFF,#8A5CFF); }
.grad-reading{ background: linear-gradient(135deg,#007587,#00D3E2); }
.grad-menopause{ background: linear-gradient(135deg,#B9812C,#EF256D); }
.grad-bundle{ background: linear-gradient(135deg,#12F761,#00D3E2,#4E0AFF); }

/* ---------- Feature list ---------- */
.feature-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
@media (max-width:760px){ .feature-grid{ grid-template-columns:1fr; } }
.feature-grid-3{ grid-template-columns: repeat(3,1fr); }
@media (max-width:760px){ .feature-grid-3{ grid-template-columns:1fr; } }
.compare-row{ display:grid; grid-template-columns:1fr auto 1fr; gap:24px; align-items:center; }
.compare-row .compare-arrow{ font-family:'Bebas Neue',sans-serif; font-size:2.2rem; color:var(--pink-ink); justify-self:center; }
@media (max-width:860px){
  .compare-row{ grid-template-columns:1fr; }
  .compare-row .compare-arrow{ transform:rotate(90deg); margin:-4px auto; }
}
.feature-card{
  background: var(--paper); border:1px solid var(--line); border-radius: var(--radius);
  padding: 24px; box-shadow: var(--shadow-sm);
}
.feature-icon{
  width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  margin-bottom:14px; font-size:1.3rem; color:#fff;
}

/* ---------- Buy box ---------- */
.buybox{
  background: var(--paper); border: 1px solid var(--line-strong); border-radius: 18px;
  padding: 28px; box-shadow: var(--shadow-lg); position: sticky; top: 100px;
}
.buybox-price-row{ display:flex; align-items:baseline; gap:12px; margin: 10px 0 4px; }
.buybox-price{ font-family:'Bebas Neue',sans-serif; font-size:2.6rem; color: var(--ink); }
.buybox-compare{ text-decoration:line-through; color: var(--ink-faint); font-size:1.2rem; }
.buybox-save{ color: var(--pink-ink); font-weight:700; font-size:.85rem; }
.buybox ul.checklist{ margin: 18px 0; display:flex; flex-direction:column; gap:10px; }
.buybox ul.checklist li{ display:flex; gap:10px; align-items:flex-start; font-size:.92rem; color:var(--ink-soft); }
.buybox ul.checklist li svg{ flex-shrink:0; margin-top:2px; color: var(--green-ink); }
.buybox-microcopy{
  font-size: .78rem;
  color: var(--ink-soft);
  text-align: center;
  margin: 8px 0 0;
}

/* ---------- Checkout: wallet button vs. real submit button clarity ----------
   On narrow screens the Apple Pay / Google Pay / Link button (Stripe's
   Express Checkout Element) and the actual "Pay" button sit close enough
   together that visitors mistake the wallet button for a first step toward
   the card form, rather than a complete, alternative way to pay. This
   groups the wallet button into its own muted zone with a clearer "OR"
   divider, labels the card-entry step, and — on mobile — keeps the real
   submit button reachable at the bottom of the viewport once the payment
   section is in view. Matches by ID suffix so it applies identically to
   both the lp-* (landing page) and unprefixed (standalone checkout) ID
   schemes without needing separate rules. */
[id$="express-checkout-element"]{
  background: var(--cream-alt);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 12px 2px;
}
[id$="express-checkout-element-divider"]{
  position: relative;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .74rem;
  margin: 16px 0 !important;
}
[id$="express-checkout-element-divider"]::before,
[id$="express-checkout-element-divider"]::after{
  content: "";
  position: absolute;
  top: 50%;
  width: 28%;
  border-top: 1px solid var(--line-strong);
}
[id$="express-checkout-element-divider"]::before{ left: 0; }
[id$="express-checkout-element-divider"]::after{ right: 0; }
.checkout-step-label{
  font-size: .76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ink-faint);
  margin: 18px 0 8px;
}
@media (max-width: 760px){
  /* Once the visitor scrolls the payment section into view, the real
     submit button pins to the bottom of the screen — the one clearly
     tappable action — instead of scrolling away below the fold.
     Deliberately position:fixed + a JS-toggled class, not position:sticky:
     both html and body carry overflow-x:hidden sitewide (to stop
     horizontal scroll), which per the CSS Overflow spec forces body's
     overflow-y to compute as auto too — making body a scroll container
     that never actually receives scroll delta (the real scroll lives on
     html), so anything sticky inside it never sticks. Same reason the
     existing .sticky-atc bar above uses fixed + IntersectionObserver
     instead of sticky. The toggle itself lives in a small inline script
     on each page (see checkout-pinned), not in the Stripe checkout files —
     purely presentational, no effect on mounting/confirmation/validation. */
  [id$="submit-button"].checkout-pinned{
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: max(12px, env(safe-area-inset-bottom));
    z-index: 30;
    margin: 0;
    box-shadow: 0 6px 20px rgba(0,0,0,.22);
  }
}

.buybox-guarantee{
  display:flex; flex-direction:column; gap:6px; align-items:flex-start; margin-top:18px; padding:14px;
  background: var(--cream-alt); border-radius:12px; font-size:.83rem; color: var(--ink-soft);
}
.trust-row{ display:flex; gap:16px; flex-wrap:wrap; margin-top:16px; font-size:.76rem; color:var(--ink-faint); }
.trust-row span{ display:flex; align-items:center; gap:6px; }

/* ---------- Steps ---------- */
.steps{ display:grid; grid-template-columns: repeat(3,1fr); gap:28px; }
@media (max-width:800px){ .steps{ grid-template-columns:1fr; } }
.step{ text-align:center; }
.step-num{
  width:56px; height:56px; border-radius:50%; background: var(--ink); color: var(--green);
  display:flex; align-items:center; justify-content:center; margin: 0 auto 16px;
  font-family:'Bebas Neue',sans-serif; font-size:1.5rem;
}

/* ---------- Testimonial / review placeholder ---------- */
.review-card{
  background: var(--paper); border:1px solid var(--line); border-radius: var(--radius);
  padding: 22px; box-shadow: var(--shadow-sm);
}
.stars{ color: var(--green-ink); letter-spacing:2px; margin-bottom:8px; }
.review-empty{
  border: 1.5px dashed var(--line-strong); border-radius: var(--radius);
  padding: 40px 24px; text-align:center; color: var(--ink-faint);
}

/* ---------- FAQ accordion ---------- */
.faq-list{ display:flex; flex-direction:column; gap:12px; max-width: 820px; margin:0 auto; }
.faq-item{ background: var(--paper); border:1px solid var(--line); border-radius: 12px; overflow:hidden; }
.faq-q{
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding: 18px 22px; background:none; border:none; text-align:left;
  font-family:'Raleway',sans-serif; font-weight:800; font-size:1rem; color:var(--ink);
}
.faq-q .plus{ font-size:1.3rem; transition: transform .2s; flex-shrink:0; color:var(--green-ink); }
.faq-item.open .plus{ transform: rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition: max-height .25s ease; padding: 0 22px; }
.faq-item.open .faq-a{ padding: 0 22px 20px; }
.faq-a p{ margin:0; }

/* ---------- Post-purchase access cards ---------- */
.ps-access-list{ display:grid; gap:16px; max-width:520px; margin:0 auto 20px; }
.ps-access-list--multi{ max-width:760px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.ps-access-card{
  background: var(--paper); border:2px solid var(--ink); border-radius: var(--radius);
  padding: 26px 22px; text-align:center; box-shadow: var(--shadow-sm);
  display:flex; flex-direction:column; gap:12px; justify-content:flex-start;
}
.ps-access-name{ font-family:'Bebas Neue',sans-serif; font-size:1.4rem; letter-spacing:.02em; }
.ps-backup-note{ color: var(--ink-faint); font-size:.9rem; max-width:560px; margin:0 auto; }
.ps-order-meta{ color: var(--ink-faint); font-size:.85rem; margin-top:14px; }
.ps-video-list{ display:flex; flex-direction:column; gap:36px; max-width:900px; margin:0 auto; }
.ps-video-block{ text-align:center; }
.ps-video-label{ font-family:'Bebas Neue',sans-serif; font-size:clamp(1.8rem, 3.4vw, 2.6rem); letter-spacing:.02em; color: var(--ink); margin:0 0 16px; }
.ps-video-wrap{ position:relative; width:100%; padding-top:56.25%; border-radius:var(--radius); overflow:hidden; background:var(--ink); box-shadow: var(--shadow-md); }
.ps-video-wrap iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* ---------- Guarantee banner ---------- */
.guarantee-banner{
  display:flex; align-items:center; gap:24px; background: var(--paper);
  border: 2px solid var(--ink); border-radius: 18px; padding: 32px; flex-wrap:wrap;
}
.guarantee-badge{
  width:96px; height:96px; border-radius:50%; background: var(--green);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  font-family:'Bebas Neue',sans-serif; text-align:center; font-size:.85rem; line-height:1.1;
  border: 2px solid var(--ink);
}

/* ---------- CTA band ---------- */
.cta-band{
  background: var(--ink); border-radius: 24px; padding: 56px 40px; text-align:center;
  background-image: radial-gradient(circle, rgba(255,250,229,0.15) 1px, transparent 1.4px);
  background-size: 20px 20px;
}
.cta-band h2, .cta-band h2 *{ color: var(--cream); }
.cta-band p{ color: rgba(255,250,229,0.75); }

/* ---------- Bundle callout ---------- */
.bundle-callout{
  display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:40px; align-items:center;
  background: linear-gradient(135deg, rgba(18,247,97,0.14), rgba(0,211,226,0.1));
  border: 1px solid var(--line-strong); border-radius: 22px; padding: 44px;
}
@media (max-width: 860px){ .bundle-callout{ grid-template-columns:minmax(0,1fr); } }
.bundle-icons{ display:flex; gap:-10px; }
.bundle-icon{
  width:54px; height:54px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-family:'Anton',sans-serif; font-size:1.2rem; border:3px solid var(--cream);
  margin-left:-14px;
}
.bundle-icon:first-child{ margin-left:0; }

/* ---------- Footer ---------- */
.site-footer{ background: var(--ink); color: rgba(255,250,229,0.7); padding: 64px 0 28px; }
.footer-grid{ display:grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 40px; margin-bottom: 48px; }
@media (max-width:800px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }
.footer-grid h4{ color: var(--cream); font-family:'Raleway',sans-serif; text-transform:uppercase; letter-spacing:.08em; font-size:.78rem; margin-bottom:16px; }
.footer-grid ul{ display:flex; flex-direction:column; gap:10px; }
.footer-grid a{ font-size:.9rem; color: rgba(255,250,229,0.68); }
.footer-grid a:hover{ color: var(--green); }
.footer-logo{ font-family:'Anton',sans-serif; text-transform: uppercase; letter-spacing:.01em; color: var(--cream); font-size:1.9rem; margin-bottom:12px; }
.footer-logo span{ color: var(--green); }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  border-top: 1px solid rgba(255,250,229,0.14); padding-top: 24px; font-size:.78rem; }
.footer-social{ display:flex; gap:14px; }
.newsletter-form{ display:flex; gap:0; margin-top:10px; }
.newsletter-form input{
  flex:1; padding: .8em 1em; border: 1.5px solid rgba(255,250,229,0.3); border-radius: 4px 0 0 4px;
  background: rgba(255,250,229,0.06); color: var(--cream); font-family:'DM Sans',sans-serif;
}
.newsletter-form input::placeholder{ color: rgba(255,250,229,0.45); }
.newsletter-form button{
  padding: .8em 1.2em; background: var(--green); color: var(--ink); border:none; border-radius: 0 4px 4px 0;
  font-weight:800; text-transform:uppercase; font-size:.8rem;
}

/* ---------- Cart drawer ---------- */
.cart-overlay{
  position:fixed; inset:0; background: rgba(22,21,14,0.5); z-index: 200;
  opacity:0; pointer-events:none; transition: opacity .2s ease;
}
.cart-overlay.open{ opacity:1; pointer-events:auto; }
.cart-drawer{
  position:fixed; top:0; right:0; height:100%; width: min(420px, 92vw); background: var(--cream);
  z-index: 201; transform: translateX(100%); transition: transform .25s ease;
  display:flex; flex-direction:column; box-shadow: -10px 0 40px rgba(0,0,0,0.2);
}
.cart-drawer.open{ transform: translateX(0); }
.cart-head{ display:flex; justify-content:space-between; align-items:center; padding: 20px 22px; border-bottom:1px solid var(--line); }
.cart-close{ background:none; border:none; font-size:1.4rem; line-height:1; }
.cart-items{ flex:1; overflow-y:auto; padding: 16px 22px; display:flex; flex-direction:column; gap:14px; }
.cart-item{ display:flex; gap:12px; align-items:center; border-bottom:1px solid var(--line); padding-bottom:14px; }
.cart-item-thumb{ width:52px; height:52px; border-radius:8px; flex-shrink:0; }
.cart-item-name{ font-weight:700; font-size:.92rem; }
.cart-item-price{ font-size:.85rem; color: var(--ink-faint); }
.cart-item-remove{ margin-left:auto; background:none; border:none; color:var(--pink-ink); font-size:.8rem; font-weight:700; text-transform:uppercase; }
.cart-empty{ text-align:center; padding: 40px 20px; color: var(--ink-faint); }
.cart-foot{ padding: 18px 22px 26px; border-top:1px solid var(--line); }
.cart-total-row{ display:flex; justify-content:space-between; font-family:'Bebas Neue',sans-serif; font-size:1.3rem; margin-bottom:14px; }

/* ---------- Sticky mobile ATC ---------- */
.sticky-atc{
  position: fixed; bottom:0; left:0; right:0; z-index: 90; background: var(--paper);
  border-top: 1px solid var(--line-strong); padding: 12px 16px; display:none;
  align-items:center; justify-content:space-between; gap:14px; box-shadow: 0 -8px 24px rgba(0,0,0,0.08);
}
@media (max-width: 760px){ .sticky-atc.show{ display:flex; } }
.sticky-atc .price{ font-size:1.3rem; }

/* ---------- Page header (legal/about/etc) ---------- */
.page-hero{ padding: 64px 0 40px; text-align:center; }
.prose{ max-width: 760px; margin: 0 auto; }
.prose h2{ margin-top:1.6em; font-size:1.6rem; }
.prose h3{ margin-top:1.2em; font-size:1.2rem; text-transform:none; font-family:'Raleway',sans-serif; }
.prose p, .prose li{ color: var(--ink-soft); }
.prose ul, .prose ol{ margin: 0 0 1.2em 1.2em; list-style: disc; }
.prose ol{ list-style: decimal; }
.prose li{ margin-bottom: .5em; }

/* ---------- Breadcrumbs ---------- */
.crumbs{ font-size:.8rem; color: var(--ink-faint); margin-bottom: 18px; }
.crumbs a{ color: var(--ink-faint); text-decoration:underline; }

/* ---------- Utilities ---------- */
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap: 48px; align-items:center; }
@media (max-width:860px){ .grid-2{ grid-template-columns:1fr; gap:32px; } }
.mt-0{ margin-top:0; } .mb-0{ margin-bottom:0; }
.badge-row{ display:flex; gap:10px; flex-wrap:wrap; }
.gap-sm{ gap: 8px; }
.center{ display:flex; align-items:center; justify-content:center; }
.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.form-status{ font-size:.85rem; margin-top:8px; }

/* ---------- Payment icons (footer + buybox) ---------- */
.footer-payments{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding: 22px 0; border-top: 1px solid rgba(255,250,229,0.15); margin-top: 8px;
}
.footer-payments-label{
  font-size:.72rem; color: rgba(255,250,229,0.6); text-transform:uppercase;
  letter-spacing:.06em; font-weight:800; font-family:'Raleway',sans-serif;
}
.footer-payments-icons{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.payment-icons-row{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:10px; }

/* ---------- Golden Hour offer badge ---------- */
.offer-badge{
  display:inline-block; margin-left:8px; padding:.18em .55em; border-radius:20px;
  background: var(--promo); color:#fff; font-size:.62rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.03em; vertical-align:middle; white-space:nowrap;
}

/* ---------- Footer trademark disclaimer ---------- */
.footer-disclaimer{
  margin: 14px 0 0; font-size:.7rem; line-height:1.5; color: rgba(255,250,229,0.45); max-width: 760px;
}

/* ---------- Version badge (template revision label) ----------
   Built as a quiet .tag variant so it reads as part of the existing
   pill-tag family instead of a new competing badge shape. */
.tag-version{ color: var(--ink-faint); border-color: var(--line-strong); font-size:.64rem; padding:.32em .75em; margin-left:8px; vertical-align:middle; }
.tag-version.is-new{ color: var(--new-label); border-color: var(--new-label); }

/* ---------- Review header: score, histogram, write-a-review ---------- */
.review-header{
  display:flex; align-items:center; justify-content:center; gap:40px; flex-wrap:wrap;
  max-width: 680px; margin: 0 auto 28px; padding-bottom: 32px; border-bottom: 1px solid var(--line);
}
.review-header-score{ display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; flex-shrink:0; }
.review-header-score .review-summary-score{ font-family:'Bebas Neue',sans-serif; font-size:2.8rem; line-height:1; color: var(--ink); }
.review-header-score .stars{ margin-bottom:0; }
.review-summary-count{ color: var(--ink-soft); font-size:.85rem; white-space:nowrap; }
.review-histogram{ display:flex; flex-direction:column; gap:6px; flex:1; min-width:220px; max-width:380px; }
.review-histogram-row{ display:grid; grid-template-columns: 30px 1fr 34px; align-items:center; gap:10px; font-size:.78rem; color:var(--ink-soft); font-family:'DM Sans',sans-serif; }
.review-histogram-track{ background: var(--line); border-radius:999px; height:7px; overflow:hidden; }
.review-histogram-fill{ background: var(--green-ink); height:100%; border-radius:999px; }
.review-header-actions{ margin-left:auto; }
@media (max-width:760px){
  .review-header{ flex-direction:column; text-align:center; }
  .review-header-actions{ margin-left:0; }
}
.review-satisfaction-note{ text-align:center; color:var(--ink-soft); font-size:.92rem; max-width:480px; margin: 0 auto 32px; }

/* ---------- Filter bar: search, keyword tags, sort ---------- */
.review-filterbar{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom: 28px;
}
.review-search{ position:relative; flex:1; min-width:220px; max-width:320px; }
.review-search svg{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--ink-faint); pointer-events:none; }
.review-search input{
  width:100%; padding:.65em .9em .65em 2.4em; border:2px solid var(--ink); border-radius:4px;
  font-family:'DM Sans',sans-serif; font-size:.88rem; background:var(--paper); color:var(--ink);
}
.review-search input::placeholder{ color: var(--ink-faint); }
.review-tags{ display:flex; gap:8px; flex-wrap:wrap; }
.review-tag-btn{
  font-family:'DM Sans', sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:.7rem;
  padding:.5em .95em; border:1.5px solid var(--line-strong); border-radius:999px; background:transparent; color:var(--ink-soft);
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.review-tag-btn:hover{ border-color: var(--ink); color:var(--ink); }
.review-tag-btn.is-active{ background: var(--promo); border-color: var(--ink); color: var(--ink); }
.review-sort{ display:flex; align-items:center; gap:8px; margin-left:auto; font-size:.8rem; color:var(--ink-soft); }
.review-sort select{
  border:2px solid var(--ink); border-radius:4px; padding:.5em .6em; background:var(--paper);
  font-family:'Raleway',sans-serif; font-weight:800; font-size:.78rem; color:var(--ink); cursor:pointer;
}
@media (max-width:640px){ .review-sort{ margin-left:0; width:100%; } }

/* ---------- Review list (rows, not cards) ---------- */
.review-list{ display:flex; flex-direction:column; }
.review-row{ padding: 24px 0; border-bottom: 1px solid var(--line); }
.review-row:first-child{ padding-top:0; }
.review-row-head{ display:flex; align-items:flex-start; gap:14px; margin-bottom:10px; }
.review-avatar{
  flex-shrink:0; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-family:'Raleway',sans-serif; font-weight:800; font-size:.85rem; color:#fff;
}
.review-row-meta{ flex:1; min-width:0; }
.review-row-name{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-weight:700; color:var(--ink); }
.review-row-location{ display:flex; align-items:center; gap:6px; font-size:.8rem; color:var(--ink-faint); margin-top:2px; }
.review-row-date{ flex-shrink:0; font-size:.78rem; color:var(--ink-faint); white-space:nowrap; }
.review-row .stars{ margin: 6px 0 8px; }
.review-row p{ margin:0; color:var(--ink); }
.review-verified-badge{
  display:inline-flex; align-items:center; gap:4px; font-size:.66rem; font-weight:700;
  color: var(--green-ink); text-transform:uppercase; letter-spacing:.03em; white-space:nowrap;
}
.review-verified-badge svg{ flex-shrink:0; }
.review-empty-state{ text-align:center; color:var(--ink-faint); padding: 40px 0; }
.review-loadmore-wrap{ display:flex; flex-direction:column; align-items:center; gap:14px; margin-top:20px; }