/* ============================================================
   PLAYFUL NIGHTS — shared luxe theme (Dark Sultry · Inter)
   Single source of truth for fonts + colors across ALL pages.
   ============================================================ */
:root{
  --lx-bg:#0E0A12; --lx-bg2:#15101C; --lx-bg3:#1B1422;
  --lx-gold:#C9A86A; --lx-gold2:#E4D1A2; --lx-ivory:#EDE3D2;
  --lx-dim:rgba(237,227,210,0.62); --lx-line:rgba(201,168,106,0.20);
  --lx-sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
html,body{ background:var(--lx-bg)!important; }
body{ color:var(--lx-ivory)!important; font-family:var(--lx-sans)!important; font-weight:400!important; font-size:1.22rem!important; line-height:1.6; letter-spacing:0.005em; }
p{ color:var(--lx-dim)!important; font-family:var(--lx-sans)!important; font-weight:400!important; font-size:1.2rem!important; line-height:1.66!important; }
strong{ color:var(--lx-ivory)!important; font-weight:600!important; }
a,span,li,div,summary,input,textarea,button{ font-family:var(--lx-sans)!important; }
h1,h2,h3,h4,h5{ font-family:var(--lx-sans)!important; color:#F4ECDC!important; font-weight:700!important; letter-spacing:-0.022em!important; }
h2{ font-size:clamp(3.1rem,6.4vw,5.2rem)!important; line-height:1.06!important; }
h3{ font-size:1.75rem!important; }
.h-italic{ color:var(--lx-gold)!important; font-style:italic!important; font-weight:800!important; }
body::after{ content:""; position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:0.06; mix-blend-mode:overlay; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.section{ background:transparent!important; padding-top:clamp(56px,7vw,104px)!important; padding-bottom:clamp(56px,7vw,104px)!important; }
.section.soft{ background:var(--lx-bg2)!important; }
section[style]{ background:var(--lx-bg)!important; }
/* eyebrow kicker */
.eyebrow{ display:inline-flex!important; background:transparent!important; border:none!important; color:var(--lx-gold)!important; font-family:var(--lx-sans)!important; font-weight:600!important; font-size:0.88rem!important; letter-spacing:0.26em!important; text-transform:uppercase; padding:0!important; }
.eyebrow .dot{ background:var(--lx-gold)!important; }
/* nav */
.nav{ background:rgba(14,10,18,0.72)!important; border-bottom:1px solid var(--lx-line)!important; backdrop-filter:blur(16px) saturate(1.1); }
.nav-link{ color:var(--lx-ivory)!important; font-weight:600!important; letter-spacing:0.13em!important; text-transform:uppercase; font-size:0.98rem!important; }
.nav-link:hover{ color:var(--lx-gold)!important; }
.pn-wordmark{ display:inline-flex; align-items:baseline; gap:0; line-height:1.25; font-weight:800!important; font-size:1.85rem!important; letter-spacing:-0.02em!important; }
.pn-wordmark .pn-moon{ display:inline-block; width:15px; height:15px; border-radius:50%; margin-right:9px; align-self:center; background:radial-gradient(circle at 30% 30%,#fff7e0 0%,var(--lx-gold) 60%,#9c7a32 100%)!important; box-shadow:0 0 0 1px rgba(201,168,106,0.3),0 0 14px -2px rgba(201,168,106,0.6); }
.pn-wordmark .pn-playful{ color:var(--lx-ivory)!important; font-weight:800; }
.pn-wordmark .pn-amp{ color:var(--lx-gold)!important; padding:0 5px; font-style:italic; }
.pn-wordmark .pn-nights{ background:none!important; -webkit-text-fill-color:var(--lx-gold)!important; color:var(--lx-gold)!important; font-style:italic; }
.portal-btn,.mobile-toggle{ background:transparent!important; border:1px solid var(--lx-line)!important; color:var(--lx-gold)!important; }
.mobile-drawer{ background:var(--lx-bg)!important; }
.mobile-drawer a{ color:var(--lx-ivory)!important; border-color:var(--lx-line)!important; text-transform:uppercase; letter-spacing:0.1em; font-size:1rem!important; font-weight:600; }
/* buttons */
.pulse-glow{ animation:none!important; }
.btn{ font-weight:600!important; text-transform:uppercase!important; letter-spacing:0.14em!important; font-size:0.98rem!important; border-radius:2px!important; padding:19px 36px!important; }
.btn-primary,.btn-primary.btn-primary-xl,.btn-her,.btn-him{ background:var(--lx-gold)!important; color:#1a1208!important; box-shadow:none!important; border:1px solid var(--lx-gold)!important; }
.btn-primary:hover,.btn-her:hover,.btn-him:hover{ background:var(--lx-gold2)!important; transform:translateY(-1px)!important; box-shadow:none!important; }
.btn-ghost,.btn-on-dark{ background:transparent!important; color:var(--lx-ivory)!important; border:1px solid var(--lx-line)!important; box-shadow:none!important; }
.btn-ghost:hover,.btn-on-dark:hover{ border-color:var(--lx-gold)!important; color:var(--lx-gold)!important; background:transparent!important; }
.btn-primary-xl{ padding:22px 42px!important; }
/* hero (index .hero-copy + hub .hero) */
.hero{ background:var(--lx-bg)!important; }
.hero::after{ background:linear-gradient(180deg,rgba(14,10,18,0.42) 0%,rgba(14,10,18,0.60) 52%,rgba(14,10,18,0.94) 100%)!important; }
.hero h1,.hero-copy h1{ font-size:clamp(4rem,9.6vw,7.4rem)!important; line-height:0.98!important; font-weight:800!important; letter-spacing:-0.03em!important; color:#F7EFDF!important; }
.hero h1 .accent,.hero-rotator-word{ background:none!important; -webkit-text-fill-color:var(--lx-gold)!important; color:var(--lx-gold)!important; font-style:italic!important; }
.hero p.lead,.hero-sub,.hero-copy .hero-sub{ color:var(--lx-dim)!important; font-weight:400!important; font-size:clamp(1.3rem,1.8vw,1.6rem)!important; line-height:1.55!important; }
.hero p.lead strong{ color:var(--lx-ivory)!important; }
.hero-trust-item{ color:var(--lx-dim)!important; font-size:1.06rem!important; letter-spacing:0.04em; }
.hero-trust-item svg{ color:var(--lx-gold)!important; }
.hero-trust-divider{ background:var(--lx-line)!important; }
.scroll-cue{ color:var(--lx-dim)!important; letter-spacing:0.3em!important; }
.scroll-cue .mouse{ border-color:rgba(201,168,106,0.5)!important; }
/* stack (home) */
.stack-panel.p-her::after{ background:linear-gradient(90deg,rgba(14,10,18,0.94) 0%,rgba(36,20,32,0.5) 56%,rgba(14,10,18,0.15) 100%)!important; }
.stack-panel.p-him::after{ background:linear-gradient(90deg,rgba(14,10,18,0.94) 0%,rgba(26,18,34,0.5) 56%,rgba(14,10,18,0.15) 100%)!important; }
.stack-copy h2{ font-size:clamp(3.3rem,7.4vw,5.4rem)!important; color:#F7EFDF!important; }
.stack-copy p{ color:rgba(237,227,210,0.82)!important; font-size:1.34rem!important; }
.stack-copy .btn{ background:var(--lx-gold)!important; color:#1a1208!important; border-color:var(--lx-gold)!important; }
/* marquee */
.marquee-band{ background:var(--lx-bg2)!important; border-top:1px solid var(--lx-line)!important; border-bottom:1px solid var(--lx-line)!important; }
.marquee-track span{ color:var(--lx-dim)!important; font-weight:600!important; font-style:normal!important; font-size:2.1rem!important; }
.marquee-track .dot{ color:var(--lx-gold)!important; }
/* cards: offer / addon / how / why / need / pair / faq */
.offer-card,.addon-card,.how-card,.why-card,.stat-card,.need-card,.pair-card,.faq{ background:var(--lx-bg3)!important; border:1px solid var(--lx-line)!important; box-shadow:none!important; border-radius:3px!important; }
.offer-card:hover,.addon-card:hover,.need-card:hover{ border-color:var(--lx-gold)!important; box-shadow:0 26px 64px -28px rgba(0,0,0,0.8)!important; }
.offer-img-wrap::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(14,10,18,0) 38%,rgba(14,10,18,0.55) 100%); }
.offer-card h3,.addon-card h4,.how-card h3,.why-card h3,.need-card h3,.pair-card h3{ color:#F4ECDC!important; font-weight:700!important; }
.offer-card h3{ font-size:1.75rem!important; }
.offer-card p,.addon-card p,.how-card p,.why-card p,.why-list li,.need-card p,.pair-card .pair-sub,.pair-card ul li{ color:var(--lx-dim)!important; font-size:1.14rem!important; line-height:1.6!important; }
.offer-tag,.addon-tag{ background:rgba(14,10,18,0.78)!important; color:var(--lx-gold2)!important; border:1px solid rgba(201,168,106,0.45)!important; text-transform:uppercase!important; letter-spacing:0.18em!important; font-size:0.72rem!important; font-weight:600!important; border-radius:2px!important; backdrop-filter:blur(6px); padding:6px 12px!important; text-shadow:0 1px 3px rgba(0,0,0,0.5); }
.offer-price,.addon-price,.pair-price{ color:var(--lx-ivory)!important; -webkit-text-fill-color:var(--lx-ivory)!important; background:none!important; font-weight:800!important; font-size:1.7rem!important; }
.offer-price small,.addon-price small{ color:var(--lx-dim)!important; }
.offer-cta{ color:var(--lx-gold)!important; text-transform:uppercase!important; letter-spacing:0.16em!important; font-size:0.9rem!important; font-weight:600; }
.how-num,.stat-num{ background:none!important; -webkit-text-fill-color:var(--lx-gold)!important; color:var(--lx-gold)!important; font-weight:800!important; font-size:4.2rem!important; }
.why-tag{ color:var(--lx-gold)!important; }
.pair-card.her,.pair-card.him{ background:var(--lx-bg3)!important; }
.pair-card .tag{ background:rgba(201,168,106,0.12)!important; color:var(--lx-gold)!important; border-color:var(--lx-line)!important; }
.pair-card ul li::before{ background:rgba(201,168,106,0.2)!important; color:var(--lx-gold)!important; }
.need-card .need-ico{ background:rgba(201,168,106,0.12)!important; color:var(--lx-gold)!important; }
.savings-bar{ background:var(--lx-bg2)!important; border:1px solid var(--lx-line)!important; box-shadow:none!important; }
.savings-bar h3,.savings-bar p{ color:var(--lx-ivory)!important; }
.savings-bar .deal-stack{ background:rgba(255,255,255,0.03)!important; border:1px solid var(--lx-line)!important; }
.discreet-list li .di{ background:rgba(201,168,106,0.12)!important; color:var(--lx-gold)!important; }
.discreet-list li h4{ color:var(--lx-ivory)!important; }
.discreet-media,.how-banner{ border:1px solid var(--lx-line)!important; }
.how-banner .b-eyebrow{ color:var(--lx-gold)!important; }
/* faq */
.faq summary{ color:var(--lx-ivory)!important; font-weight:700!important; font-size:1.65rem!important; }
.faq summary::after{ color:var(--lx-gold)!important; }
.faq .faq-body{ color:var(--lx-dim)!important; font-size:1.18rem!important; }
.section-head p{ font-size:1.34rem!important; line-height:1.6!important; }
/* carousel */
.carousel-ctrls button{ background:transparent!important; border:1px solid var(--lx-line)!important; color:var(--lx-gold)!important; box-shadow:none!important; }
.carousel-dots button{ background:rgba(237,227,210,0.22)!important; }
.carousel-dots button.active{ background:var(--lx-gold)!important; }
.carousel-swipe-hint{ color:var(--lx-gold)!important; letter-spacing:0.16em; text-transform:uppercase; font-size:0.86rem!important; }
/* footer */
footer{ background:var(--lx-bg)!important; border-top:1px solid var(--lx-line)!important; }
.foot-col h5{ color:var(--lx-gold)!important; text-transform:uppercase; letter-spacing:0.2em; font-size:0.94rem!important; }
.foot-col a,.foot-brand p{ color:var(--lx-dim)!important; font-size:1.05rem!important; }
.foot-col a:hover{ color:var(--lx-gold)!important; }
.legal,.legal-disclaimer{ color:rgba(237,227,210,0.5)!important; }
.legal-disclaimer strong{ color:rgba(237,227,210,0.7)!important; }
.social-row a{ background:transparent!important; border:1px solid var(--lx-line)!important; color:var(--lx-gold)!important; }
.social-row a:hover{ background:var(--lx-gold)!important; color:#1a1208!important; }
/* legal / prose */
.container a:not(.btn):not(.nav-logo):not(.offer-card):not(.addon-card){ color:var(--lx-gold)!important; }
.container h1,.container h2,.container h3{ color:#F4ECDC!important; }
/* responsive */
@media(max-width:760px){
  body{ font-size:1.2rem!important; } p{ font-size:1.18rem!important; }
  .hero h1,.hero-copy h1{ font-size:clamp(3.6rem,14vw,5rem)!important; }
  .hero p.lead,.hero-sub,.hero-copy .hero-sub{ font-size:1.34rem!important; }
  h2{ font-size:clamp(2.8rem,9.5vw,3.6rem)!important; }
  .stack-copy h2{ font-size:clamp(3rem,11vw,4rem)!important; }
  .section-head p,.stack-copy p{ font-size:1.26rem!important; }
  .nav-link{ font-size:1.02rem!important; } .marquee-track span{ font-size:1.6rem!important; }
  .offer-card h3,.faq summary,.addon-card h4{ font-size:1.55rem!important; }
  .section{ padding-top:clamp(40px,9vw,72px)!important; padding-bottom:clamp(40px,9vw,72px)!important; }
}
/* ---- legal "doc" template (privacy / terms / ccpa / safety / medical-consent) ---- */
.doc-hero{ background:var(--lx-bg)!important; border-bottom:1px solid var(--lx-line)!important; }
.doc-hero h1{ color:#F7EFDF!important; }
.doc-eyebrow{ background:transparent!important; border:none!important; color:var(--lx-gold)!important; padding:0!important; letter-spacing:0.26em!important; font-weight:600!important; }
.doc-updated{ color:var(--lx-dim)!important; }
.doc-toc{ background:var(--lx-bg2)!important; border:1px solid var(--lx-line)!important; }
.doc-toc h2,.doc-toc h3,.doc-toc strong{ color:var(--lx-gold)!important; }
.doc-toc a{ color:var(--lx-dim)!important; }
.doc-toc a:hover{ color:var(--lx-gold)!important; }
.doc-callout{ background:var(--lx-bg3)!important; border-left:3px solid var(--lx-gold)!important; }
.doc-callout *{ color:var(--lx-ivory)!important; }
.doc-emerg{ background:var(--lx-bg3)!important; }
.doc-emerg *{ color:var(--lx-ivory)!important; }
.doc-section h2,.doc-section h3{ color:#F4ECDC!important; }
.doc-section strong{ color:var(--lx-ivory)!important; }
.doc-eyebrow .dot{ background:var(--lx-gold)!important; }
/* ---- FAQ side heading: cap so it doesn't overflow its column ---- */
.faq-side h2{ font-size:clamp(2rem,3.2vw,2.9rem)!important; line-height:1.08!important; }
.faq-side h2 .accent{ color:var(--lx-gold)!important; -webkit-text-fill-color:var(--lx-gold)!important; background:none!important; font-style:italic; }
/* ---- comparison bar graph (home "Built different") ---- */
.cmp-wrap{ display:grid; grid-template-columns:1.25fr 1fr; gap:clamp(32px,4vw,56px); align-items:center; margin-top:44px; }
.cmp-legend{ display:flex; gap:26px; margin-bottom:26px; font-size:0.92rem; color:var(--lx-dim); }
.cmp-legend i{ display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:8px; vertical-align:middle; }
.cmp-legend .dot-pn{ background:var(--lx-gold); }
.cmp-legend .dot-them{ background:rgba(237,227,210,0.25); }
.cmp-row{ margin-bottom:22px; }
.cmp-label{ font-size:1.06rem; color:var(--lx-ivory)!important; margin-bottom:9px; font-weight:500; }
.cmp-bars{ display:grid; gap:7px; }
.cmp-track{ height:11px; background:rgba(237,227,210,0.06); border-radius:6px; overflow:hidden; }
.cmp-fill{ display:block; height:100%; border-radius:6px; transform-origin:left; animation:cmpgrow 1.2s cubic-bezier(.22,1,.36,1) both; }
@keyframes cmpgrow{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
.cmp-fill.pn{ background:linear-gradient(90deg,var(--lx-gold),var(--lx-gold2)); box-shadow:0 0 16px -3px rgba(201,168,106,0.55); }
.cmp-fill.them{ background:rgba(237,227,210,0.2); }
.cmp-feats{ border-left:1px solid var(--lx-line); padding-left:clamp(24px,3vw,40px); }
.cmp-feats h3{ color:var(--lx-gold)!important; font-size:1rem!important; text-transform:uppercase; letter-spacing:0.18em; margin-bottom:20px; }
.cmp-feats ul{ list-style:none; padding:0; margin:0; display:grid; gap:16px; }
.cmp-feats li{ position:relative; padding-left:30px; color:var(--lx-dim)!important; font-size:1.08rem!important; line-height:1.5; }
.cmp-feats li::before{ content:"\2713"; position:absolute; left:0; top:0; color:var(--lx-gold); font-weight:700; }
@media(max-width:900px){ .cmp-wrap{ grid-template-columns:1fr; gap:30px; } .cmp-feats{ border-left:none; padding-left:0; border-top:1px solid var(--lx-line); padding-top:28px; } }
/* ---- center product offering rows (hub pages) ---- */
.addon-grid{ display:flex!important; flex-wrap:wrap; justify-content:center; gap:20px!important; grid-template-columns:none!important; }
.addon-grid .addon-card{ flex:0 1 clamp(260px,30%,340px); }
.need-grid{ justify-content:center; }
/* ---- hub card images: taller slot + keep faces in frame (no head-cropping) ---- */
.addon-card .addon-img{ height:230px!important; object-fit:cover!important; object-position:center 24%!important; }
@media(max-width:760px){ .addon-card .addon-img{ height:260px!important; } }
/* ---- brand attribution ---- */
.powered-by{ color:var(--lx-gold)!important; font-size:0.8rem!important; letter-spacing:0.2em!important; text-transform:uppercase; font-weight:600!important; margin:16px 0 2px; }
.powered-by strong{ color:var(--lx-gold2)!important; }
/* ---- home hero: clearance between trust row and scroll cue ---- */
.hero{ padding-bottom: clamp(104px, 12vh, 150px) !important; }
.scroll-cue{ bottom: 20px !important; }
@media(max-width:760px){ .hero{ padding-bottom: clamp(48px,10vw,80px) !important; } }
/* ---- marquee edge fades -> dark (match band, not white) ---- */
.marquee-band::before{ background:linear-gradient(90deg,#15101C 0%,rgba(21,16,28,0) 100%)!important; }
.marquee-band::after{ background:linear-gradient(-90deg,#15101C 0%,rgba(21,16,28,0) 100%)!important; }
