/* ===== PowderedPurple — editorial luxe (navy · charcoal · gold) ===== */
:root{
  /* surfaces — white shades of purple */
  --bone:#f5f1fb;       /* pale lavender page */
  --bone-2:#faf7ff;
  --paper:#ffffff;
  /* brand (purple) */
  --ink:#2a1d45;        /* deep purple — text + feature bands */
  --ink-soft:#4a3a68;
  --navy:#3a2168;       /* deep violet (pricing / featured) */
  --navy-2:#5a37a8;
  --royal:#8b5cf6;      /* bright violet accent */
  --gold-1:#7c3aed;     /* primary accent (readable on light) */
  --gold-2:#cbb6f2;     /* light lilac (accent on dark bands) */
  --gold-3:#a78bfa;     /* soft violet (borders) */
  --gold:linear-gradient(135deg,#7c3aed 0%,#a855f7 45%,#c084fc 100%); /* purple accent gradient */
  /* text */
  --text:#2a1d45;
  --muted:#6c6088;
  --on-dark:#f1ebfb;
  --on-dark-muted:#c5bae0;
  --border:rgba(70,45,120,.14);
  --border-strong:rgba(70,45,120,.26);
  /* system */
  --radius:18px;
  --radius-sm:12px;
  --maxw:1180px;
  --ease:cubic-bezier(.22,1,.36,1);
  --shadow:0 24px 60px -28px rgba(70,40,120,.35);
  --shadow-sm:0 10px 30px -18px rgba(70,40,120,.3);
}

:root{
  --bone:#f7f1ec;
  --bone-2:#fffaf5;
  --ink:#241936;
  --ink-soft:#574962;
  --navy:#2d1b4d;
  --navy-2:#4b2f83;
  --royal:#7c3aed;
  --matcha:#607a3b;
  --cherry:#b94f5d;
  --saffron:#d39a36;
  --clay:#c87552;
  --gold-1:#6d3ed8;
  --gold-2:#ecd8aa;
  --gold-3:#9aad6d;
  --gold:linear-gradient(135deg,#6d3ed8 0%,#b94f5d 46%,#d39a36 100%);
  --text:#241936;
  --muted:#675d6d;
  --on-dark:#fff8ef;
  --on-dark-muted:#ddcfbf;
  --border:rgba(45,31,61,.14);
  --border-strong:rgba(45,31,61,.28);
  --radius:8px;
  --radius-sm:8px;
  --shadow:0 24px 60px -28px rgba(35,23,48,.32);
  --shadow-sm:0 10px 30px -18px rgba(35,23,48,.28);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:var(--bone);
  color:var(--text);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto;line-height:1.08;letter-spacing:-.015em;font-weight:600;color:var(--ink)}
a{color:inherit;text-decoration:none}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* ===== subtle warm backdrop ===== */
.bg-mesh{position:fixed;inset:0;z-index:-1;overflow:hidden;opacity:.10;filter:blur(90px);mix-blend-mode:multiply}
.blob{position:absolute;width:46vw;height:46vw;border-radius:50%;animation:float 26s var(--ease) infinite}
.blob-1{background:var(--navy);top:-12%;left:-8%}
.blob-2{background:var(--gold-1);top:25%;right:-12%;animation-delay:-8s}
.blob-3{background:var(--royal);bottom:-18%;left:32%;animation-delay:-16s}
@keyframes float{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(5%,7%) scale(1.1)}66%{transform:translate(-5%,-3%) scale(.95)}}

/* ===== Nav ===== */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);background:rgba(245,241,251,.72);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.nav.scrolled{border-bottom-color:var(--border);background:rgba(245,241,251,.92)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}
.logo{display:flex;align-items:center;gap:11px;font-weight:600}
.logo-img{height:40px;width:40px;object-fit:contain;border-radius:0;display:block;box-shadow:none}
.logo-light{display:none}
.logo-text{font-family:'Fraunces',serif;font-size:1.2rem;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.logo-text span{background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:.92rem;color:var(--ink-soft);font-weight:500;transition:color .2s;position:relative}
.nav-links a:not(.nav-cta)::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:1.5px;background:var(--gold);transition:width .3s var(--ease)}
.nav-links a:not(.nav-cta):hover::after{width:100%}
.nav-cta{color:#fff!important}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{width:24px;height:2px;background:var(--ink);transition:.3s var(--ease)}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;font-weight:600;font-size:.95rem;padding:13px 26px;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s,background .3s,border-color .3s,color .3s}
.btn-sm{padding:10px 20px;font-size:.88rem}
.btn-lg{padding:16px 34px;font-size:1.02rem}
.btn-block{width:100%}
.btn-primary{background:var(--ink);color:#fff;border:1px solid #140d24;box-shadow:inset 0 2px 3px rgba(255,255,255,0.26), inset 0 -2px 3px rgba(0,0,0,0.22), var(--shadow-sm);}
.btn-primary:hover{transform:translateY(-3px);background:var(--navy);box-shadow:inset 0 2px 3px rgba(255,255,255,0.3), inset 0 -2px 3px rgba(0,0,0,0.3), 0 18px 40px -16px rgba(70,40,120,.55);}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink);box-shadow:inset 0 1.5px 0 rgba(255,255,255,0.65), inset 0 -1.5px 0 rgba(42,29,69,0.12), var(--shadow-sm);}
.btn-ghost:hover{transform:translateY(-3px);border-color:var(--ink);background:rgba(20,22,29,.03);box-shadow:inset 0 1.5px 0 rgba(255,255,255,0.7), inset 0 -1.5px 0 rgba(42,29,69,0.15), var(--shadow-sm);}

/* ===== Hero ===== */
.hero{padding:96px 0 78px;text-align:center}
.hero-badge{display:inline-flex;align-items:center;gap:9px;background:var(--paper);border:1px solid var(--border);padding:8px 18px;border-radius:999px;font-size:.82rem;color:var(--muted);margin-bottom:30px;box-shadow:var(--shadow-sm);letter-spacing:.01em}
.pulse-dot{width:8px;height:8px;border-radius:50%;background:var(--gold-1);box-shadow:0 0 0 0 rgba(139,92,246,.5);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(139,92,246,.5)}70%{box-shadow:0 0 0 9px rgba(139,92,246,0)}100%{box-shadow:0 0 0 0 rgba(139,92,246,0)}}
.hero-title{font-size:clamp(2.6rem,6.4vw,5rem);font-weight:600;max-width:15ch;margin:0 auto 24px;letter-spacing:-.025em}
.grad-text{font-style:italic;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{font-size:clamp(1.04rem,1.8vw,1.22rem);color:var(--muted);max-width:60ch;margin:0 auto 38px}
.hero-sub strong{color:var(--ink);font-weight:600}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:48px}
.hero-trust{display:flex;flex-direction:column;align-items:center;gap:16px;color:var(--muted);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}
.trust-pills{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.pill{background:var(--paper);border:1px solid var(--border);padding:9px 18px;border-radius:999px;font-size:.9rem;color:var(--ink);letter-spacing:0;text-transform:none}

/* ===== Hero (homepage) — light lavender ===== */
body.home .hero{
  background:
    radial-gradient(70% 70% at 50% -5%, rgba(168,85,247,.16), transparent 60%),
    radial-gradient(50% 50% at 84% 6%, rgba(124,58,237,.12), transparent 62%),
    linear-gradient(180deg,#efe7fb 0%,#f5f1fb 62%,var(--bone) 100%);
  color:var(--text);
  position:relative;
  overflow:hidden;
  padding-top:118px;
}
body.home .hero>.container{position:relative;z-index:1}
.hero-logo{height:clamp(96px,15vw,168px);width:auto;margin:0 auto 28px;display:block;filter:drop-shadow(0 22px 40px rgba(139,92,246,0.36));animation:heroFloat 6s ease-in-out infinite}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
body.home .hero-cta .btn-primary{background:var(--gold);color:#fff;border:1px solid rgba(124,58,237,0.35);box-shadow:inset 0 2px 3px rgba(255,255,255,0.35), inset 0 -2px 3px rgba(0,0,0,0.2), 0 14px 40px -14px rgba(124,58,237,.6)}
body.home .hero-cta .btn-primary:hover{background:linear-gradient(135deg,#6d28d9,#a855f7)}

/* nav sits on the light hero (until scrolled) */
body.home .nav:not(.scrolled){background:rgba(245,241,251,.5);backdrop-filter:blur(10px);border-bottom-color:transparent}

/* ===== Stats ===== */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;padding:0;margin:0 auto 90px;max-width:calc(var(--maxw) - 0px);background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.stat{text-align:center;padding:34px 18px;background:var(--bone-2)}
.stat-num{font-family:'Fraunces',serif;font-size:clamp(2rem,4vw,3rem);font-weight:600;color:var(--navy)}
.stat-plus{font-family:'Fraunces',serif;font-size:1.8rem;font-weight:600;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-label{display:block;margin-top:8px;color:var(--muted);font-size:.86rem;letter-spacing:.02em}

/* ===== Sections ===== */
.section{padding:100px 0}
.section-alt{background:var(--bone-2);color:var(--text)}
.section-alt h2,.section-alt h3,.section-alt h4{color:var(--ink)}
.section-alt .section-head p,.section-alt p{color:var(--muted)}
.section-head{text-align:center;max-width:660px;margin:0 auto 60px}
.eyebrow{display:inline-block;color:var(--gold-1);font-weight:600;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;margin-bottom:18px}
.section-alt .eyebrow{color:var(--gold-1)}
.section-head h2{font-size:clamp(2rem,4.4vw,3.2rem);margin-bottom:18px;letter-spacing:-.02em}
.section-head p{color:var(--muted);font-size:1.06rem}

/* ===== Cards / Bento ===== */
.card,.niche,.price-card,.post,.mini-card,.quote,.step{background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);transition:transform .4s var(--ease),border-color .4s,box-shadow .4s}
.card:hover,.niche:hover,.post:hover,.quote:hover,.step:hover{transform:translateY(-6px);border-color:var(--gold-3);box-shadow:var(--shadow)}
.section-alt .card,.section-alt .niche,.section-alt .quote,.section-alt .step{background:var(--paper);border-color:var(--border)}
.section-alt .card:hover,.section-alt .niche:hover,.section-alt .quote:hover,.section-alt .step:hover{border-color:var(--gold-3);box-shadow:var(--shadow)}
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{padding:34px}
.bento-lg{grid-row:span 2}
.bento-wide{grid-column:span 2}
.card-icon{font-size:1.9rem;margin-bottom:18px}
.card h3{font-size:1.35rem;margin-bottom:11px}
.card p{color:var(--muted)}
.ticks{list-style:none;margin-top:20px;display:flex;flex-direction:column;gap:9px}
.ticks li{position:relative;padding-left:26px;color:var(--muted);font-size:.92rem}
.ticks li::before{content:"";position:absolute;left:0;top:.6em;width:9px;height:9px;border-radius:2px;background:var(--gold)}
.section-alt .card p,.section-alt .ticks li{color:var(--muted)}

/* ===== Niches ===== */
.niche-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.niche{padding:38px}
.niche-emoji{font-size:2.4rem;margin-bottom:18px}
.niche h3{font-size:1.5rem;margin-bottom:12px}
.niche p{color:var(--muted);margin-bottom:20px}
.niche-tag{font-size:.78rem;color:var(--gold-1);font-weight:600;letter-spacing:.04em;text-transform:uppercase}

/* ===== Steps ===== */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.step{padding:34px}
.step-num{font-family:'Fraunces',serif;font-size:2.6rem;font-weight:600;font-style:italic;background:var(--gold);-webkit-background-clip:text;background-clip:text;color:transparent;display:block;margin-bottom:14px}
.step h3{font-size:1.25rem;margin-bottom:9px}
.step p{color:var(--muted);font-size:.93rem}

/* ===== Quotes ===== */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.quote{padding:36px}
.quote blockquote{font-family:'Fraunces',serif;font-size:1.18rem;line-height:1.45;margin-bottom:20px;color:var(--ink)}
.section-alt .quote blockquote{color:var(--ink)}
.quote figcaption{color:var(--muted);font-size:.88rem;letter-spacing:.02em}
.quote figcaption strong{color:var(--ink)}
.section-alt .quote figcaption strong{color:var(--ink)}

/* ===== Pricing ===== */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:start}
.price-card{padding:40px 32px;position:relative}
.price-card.featured{background:linear-gradient(145deg, #1d123d, #0f0a21);color:#fff;border-color:var(--navy);border-color:var(--navy);box-shadow:var(--shadow);transform:scale(1.04)}
.price-card.featured h3,.price-card.featured .price-amt{color:#fff}
.price-card.featured .price-desc,.price-card.featured .ticks li{color:rgba(255,255,255,.8)}
.price-card.featured .ticks li::before{background:var(--gold)}
.price-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--ink);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 16px;border-radius:999px}
.price-card h3{font-size:1.4rem;margin-bottom:16px}
.price{margin-bottom:6px}
.price-amt{font-family:'Fraunces',serif;font-size:2.6rem;font-weight:600}
.price-per{color:var(--muted)}
.price-card.featured .price-per{color:rgba(255,255,255,.7)}
.price-desc{color:var(--muted);font-size:.92rem;margin-bottom:22px}
.price-card .ticks{margin-bottom:30px}
.price-card.featured .btn-primary{background:#fff;color:var(--navy)}
.price-card.featured .btn-primary:hover{background:var(--gold-2)}

/* ===== Blog ===== */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post{overflow:hidden;display:flex;flex-direction:column}
.post-thumb{height:190px;position:relative;overflow:hidden}
.post-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.post:hover .post-thumb img{transform:scale(1.06)}
.post-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 55%,rgba(20,22,29,.15));pointer-events:none}
.thumb-1{background:linear-gradient(140deg,var(--navy),var(--royal))}
.thumb-2{background:linear-gradient(140deg,var(--ink),var(--navy))}
.thumb-3{background:linear-gradient(140deg,var(--gold-1),var(--gold-2))}
.post-body{padding:26px;display:flex;flex-direction:column;gap:9px;flex:1}
.post-tag{align-self:flex-start;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gold-1);background:rgba(139,92,246,.1);padding:5px 11px;border-radius:999px}
.post h3{font-size:1.2rem;line-height:1.25}
.post h3 a{transition:color .2s}
.post h3 a:hover{color:var(--navy)}
.post p{color:var(--muted);font-size:.92rem;flex:1}
.post-meta{color:var(--muted);font-size:.8rem;letter-spacing:.04em}
.blog-more{text-align:center;margin-top:42px}

/* ===== About ===== */
.about-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.about-grid h2{font-size:clamp(2rem,4vw,2.9rem);margin:16px 0 20px;letter-spacing:-.02em}
.about-grid p{color:var(--muted);margin-bottom:18px}
.about-grid .btn{margin-top:12px}
.about-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.mini-card{padding:26px}
.mini-card span{font-size:1.7rem}
.mini-card h4{margin:12px 0 5px;font-size:1.12rem}
.mini-card p{color:var(--muted);font-size:.88rem}

/* ===== CTA / contact ===== */
.cta-section{padding-bottom:120px}
.cta-card{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center;background:var(--navy);color:#ffffff;border-radius:26px;padding:56px;position:relative;overflow:hidden}
.cta-card::before{content:"";position:absolute;top:-40%;right:-10%;width:50%;height:180%;background:radial-gradient(circle,rgba(168,85,247,.4),transparent 70%);pointer-events:none}
.cta-copy{position:relative}
.cta-copy h2{font-size:clamp(2rem,4vw,2.9rem);margin-bottom:16px;color:#fff}
.cta-copy p{color:var(--on-dark-muted);font-size:1.06rem}
.cta-form{display:flex;flex-direction:column;gap:15px;position:relative}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:.82rem;color:var(--on-dark-muted);letter-spacing:.02em}
.field input,.field select,.field textarea{background:#ffffff;border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:13px 15px;color:var(--ink);font-family:inherit;font-size:.95rem;transition:border-color .2s,background .2s}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:0.75}
.field select option{color:var(--ink);background:#ffffff}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ink);background:#ffffff}
.field textarea{resize:vertical}
.cta-form .btn-primary{background:var(--gold);color:var(--ink);border:1px solid rgba(124,58,237,0.35);box-shadow:inset 0 2px 3px rgba(255,255,255,0.35), inset 0 -2px 3px rgba(0,0,0,0.2), var(--shadow-sm);}
.cta-form .btn-primary:hover{background:linear-gradient(135deg,#6d28d9,#a855f7);transform:translateY(-3px)}
.form-note{color:var(--gold-2);font-size:.9rem;text-align:center}

/* ===== Footer ===== */
.footer{background:var(--ink);color:var(--on-dark);border-top:1px solid rgba(255,255,255,.08);padding:72px 0 32px}
.footer .logo-text{color:#fff}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:40px}
.footer-brand p{color:var(--on-dark-muted);font-size:.92rem;margin:18px 0;max-width:34ch}
.socials{display:flex;gap:12px}
.socials a{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:rgba(20,22,29,.03);border:1px solid rgba(255,255,255,.12);color:var(--on-dark-muted);transition:.3s var(--ease)}
.socials a:hover{color:var(--ink);background:var(--gold);border-color:transparent;transform:translateY(-3px)}
.footer-col h4{font-size:.82rem;margin-bottom:18px;color:var(--gold-2);letter-spacing:.12em;text-transform:uppercase;font-family:'Inter',sans-serif;font-weight:600}
.footer-col a{display:block;color:var(--on-dark-muted);font-size:.9rem;padding:6px 0;transition:color .2s}
.footer-col a:hover{color:#ffffff}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:54px;padding-top:26px;border-top:1px solid rgba(255,255,255,.08);color:var(--on-dark-muted);font-size:.83rem}

/* ===== Scroll reveal ===== */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ===== Showcase / video library ===== */
.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.vcard{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:9/16;cursor:pointer;border:1px solid var(--border);background:#ffffff;transition:transform .4s var(--ease),box-shadow .4s,border-color .4s;display:block}
.vcard:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--gold-3)}
.vcard img{width:100%;height:100%;object-fit:cover;display:block;position:relative;z-index:0}
.vcard-preview-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s cubic-bezier(.22,1,.36,1);z-index:1;pointer-events:none}
.vcard-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,16,24,.4) 0%,transparent 28%,transparent 52%,rgba(14,16,24,.93) 100%);display:flex;flex-direction:column;justify-content:space-between;padding:16px;z-index:2}
.vcard-top{display:flex;gap:7px;flex-wrap:wrap}
.vtag{font-size:.66rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:5px 10px;border-radius:999px}
.vtag-niche{background:rgba(255,255,255,.2);color:#fff;backdrop-filter:blur(6px)}
.vtag-info{background:var(--gold);color:var(--ink)}
.vcard-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.45);display:grid;place-items:center;transition:.3s var(--ease)}
.vcard:hover .vcard-play{background:var(--gold);border-color:transparent;transform:translate(-50%,-50%) scale(1.08)}
.vcard-play svg{width:22px;height:22px;margin-left:3px;fill:#fff}
.vcard:hover .vcard-play svg{fill:var(--ink)}
.vcard-bottom h3{color:#fff;font-size:1rem;line-height:1.25;margin-bottom:4px}
.vcard-bottom .vtopic{color:rgba(255,255,255,.72);font-size:.78rem}

/* modal player */
.vmodal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:28px;background:rgba(10,11,16,.82);backdrop-filter:blur(10px)}
.vmodal.open{display:flex}
.vmodal-inner{display:flex;gap:34px;max-width:980px;width:100%;align-items:center;justify-content:center}
.vmodal video{max-height:82vh;width:auto;max-width:min(48vh,90vw);border-radius:18px;background:#000;box-shadow:0 30px 80px -20px rgba(0,0,0,.7)}
.vmodal-info{color:var(--on-dark);max-width:340px}
.vmodal-info .vtag-info{display:inline-block;margin-bottom:14px}
.vmodal-info h2{color:#fff;font-size:1.8rem;margin-bottom:12px}
.vmodal-info p{color:var(--on-dark-muted);margin-bottom:18px}
.vmodal-tags{display:flex;gap:8px;flex-wrap:wrap}
.vmodal-tags span{font-size:.78rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;padding:5px 12px;border-radius:999px}
.vmodal-close{position:absolute;top:20px;right:24px;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.25s var(--ease)}
.vmodal-close:hover{background:var(--gold);color:var(--ink);border-color:transparent}

@media (max-width:1100px){.video-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.vmodal-inner{flex-direction:column;gap:18px}.vmodal video{max-height:60vh}.vmodal-info{max-width:none;text-align:center}.vmodal-tags{justify-content:center}}
@media (max-width:680px){.video-grid{grid-template-columns:repeat(2,1fr)}}

/* ===== Blog index page ===== */
.page-hero{padding:80px 0 40px;text-align:center}
.page-hero .eyebrow{margin-bottom:16px}
.page-hero h1{font-size:clamp(2.4rem,5.5vw,4rem);letter-spacing:-.025em;max-width:18ch;margin:0 auto 18px}
.page-hero p{color:var(--muted);font-size:1.08rem;max-width:56ch;margin:0 auto}

.blog-filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:36px 0 10px}
.chip{font-family:inherit;font-size:.86rem;font-weight:500;color:var(--ink-soft);background:var(--paper);border:1px solid var(--border);padding:9px 18px;border-radius:999px;cursor:pointer;transition:.25s var(--ease)}
.chip:hover{border-color:var(--gold-3)}
.chip.active{background:var(--ink);color:#fff;box-shadow:var(--shadow-sm);border-color:var(--ink)}

.featured-post{display:grid;grid-template-columns:1.1fr 1fr;gap:0;background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:48px;transition:transform .4s var(--ease),box-shadow .4s,border-color .4s}
.featured-post:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--gold-3)}
.featured-thumb{min-height:340px;position:relative;overflow:hidden}
.featured-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.featured-post:hover .featured-thumb img{transform:scale(1.04)}
.featured-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 50%,rgba(20,22,29,.15));pointer-events:none}
.featured-body{padding:46px;display:flex;flex-direction:column;gap:14px;justify-content:center}
.featured-body .post-tag{align-self:flex-start}
.featured-label{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-1);font-weight:600}
.featured-body h2{font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.15}
.featured-body h2 a:hover{color:var(--navy)}
.featured-body p{color:var(--muted)}
.journal-hero p{max-width:72ch}
.journal-pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0 0 34px}
.journal-pillar-grid article{background:rgba(255,255,255,.62);border:1px solid var(--border);border-radius:var(--radius);padding:24px}
.journal-pillar-grid span{display:block;color:var(--gold-1);font:600 2.2rem Fraunces,serif;margin-bottom:8px}
.journal-pillar-grid h3{font-size:1.18rem;margin-bottom:8px}
.journal-pillar-grid p{color:var(--muted);font-size:.92rem}
.journal-bridge{text-align:center;max-width:760px}
.journal-bridge h2{font-size:clamp(2rem,4vw,3.2rem);margin:12px 0 16px}
.journal-bridge p{color:var(--muted);font-size:1.04rem}

/* ===== Article page ===== */
.article-hero{padding:64px 0 0;text-align:center}
.article-kicker{display:inline-flex;gap:10px;align-items:center;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-1);font-weight:600;margin-bottom:20px}
.article-hero h1{font-size:clamp(2.2rem,5vw,3.6rem);letter-spacing:-.025em;max-width:20ch;margin:0 auto 22px}
.article-meta{display:flex;gap:18px;align-items:center;justify-content:center;color:var(--muted);font-size:.9rem;flex-wrap:wrap}
.article-meta .dot{width:4px;height:4px;border-radius:50%;background:var(--gold-3)}
.article-author{display:flex;align-items:center;gap:10px}
.author-avatar{width:34px;height:34px;border-radius:50%;background:#fff;border:1px solid var(--border);display:grid;place-items:center;overflow:hidden;padding:5px;flex-shrink:0}
.author-avatar img{width:100%;height:100%;object-fit:contain}
.article-cover{max-width:var(--maxw);margin:44px auto 0;padding:0 28px}
.article-cover-inner{height:clamp(220px,40vw,440px);border-radius:var(--radius);position:relative;overflow:hidden}
.article-cover-inner img{width:100%;height:100%;object-fit:cover;display:block}
.article-cover-inner::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 55%,rgba(20,22,29,.15));pointer-events:none}

.prose{max-width:740px;margin:56px auto 0;padding:0 28px;font-size:1.12rem;line-height:1.8;color:#2c2f38}
.prose>p{margin-bottom:26px}
.prose h2{font-size:1.85rem;margin:48px 0 18px;letter-spacing:-.02em}
.prose h3{font-size:1.35rem;margin:36px 0 14px}
.prose ul,.prose ol{margin:0 0 26px 1.2em;display:flex;flex-direction:column;gap:10px}
.prose li{padding-left:6px}
.prose li::marker{color:var(--gold-1)}
.prose a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold-3);text-underline-offset:3px}
.prose strong{color:var(--ink)}
.prose blockquote{font-family:'Fraunces',serif;font-size:1.5rem;line-height:1.4;color:var(--ink);border-left:3px solid;border-image:var(--gold) 1;padding:6px 0 6px 28px;margin:36px 0}
.prose .lead{font-size:1.28rem;line-height:1.6;color:var(--ink);margin-bottom:32px}
.callout{background:var(--bone-2);border:1px solid var(--border);border-left:4px solid var(--gold-1);border-radius:var(--radius-sm);padding:24px 26px;margin:32px 0;font-size:1rem;line-height:1.7}
.callout strong{display:block;margin-bottom:6px;font-family:'Fraunces',serif;font-size:1.05rem;color:var(--ink)}
.disclosure-note{font-size:.86rem;color:var(--muted);font-style:italic;border-top:1px solid var(--border);padding-top:20px;margin-top:44px}

.author-bio{max-width:740px;margin:56px auto 0;padding:28px;background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);display:flex;gap:18px;align-items:flex-start}
.author-bio .author-avatar{width:54px;height:54px;font-size:1.2rem;flex-shrink:0}
.author-bio h4{font-size:1.1rem;margin-bottom:4px}
.author-bio p{color:var(--muted);font-size:.94rem}

.related{padding:90px 0 0}
.related h2{font-size:1.8rem;margin-bottom:32px;text-align:center}

.article-cta{margin:80px auto 0;max-width:var(--maxw);padding:0 28px}
.article-cta-inner{background:linear-gradient(145deg, #1d123d, #0f0a21);color:#fff;border-color:var(--navy);border-radius:24px;padding:48px;text-align:center;position:relative;overflow:hidden}
.article-cta-inner::before{content:"";position:absolute;top:-50%;left:-10%;width:50%;height:200%;background:radial-gradient(circle,rgba(168,85,247,.32),transparent 70%)}
.article-cta-inner h2{color:#fff;font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:14px;position:relative}
.article-cta-inner p{color:rgba(255,255,255,.8);margin-bottom:26px;max-width:48ch;margin-inline:auto;position:relative}
.article-cta-inner .btn-primary{background:var(--gold);color:var(--ink);position:relative}
.article-cta-inner .btn-primary:hover{background:linear-gradient(135deg,#6d28d9,#a855f7)}

.thumb-4{background:linear-gradient(140deg,var(--royal),var(--gold-1))}
.thumb-5{background:linear-gradient(140deg,var(--navy),var(--ink))}
.thumb-6{background:linear-gradient(140deg,var(--gold-2),var(--navy))}

@media (max-width:760px){
  .featured-post{grid-template-columns:1fr}
  .featured-thumb{min-height:200px}
  .featured-body{padding:30px}
  .journal-pillar-grid{grid-template-columns:1fr}
}

/* ===== Scroll progress bar ===== */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--gold);z-index:200;will-change:width}
.scroll-progress::after{content:"";position:absolute;right:0;top:0;height:100%;width:60px;background:linear-gradient(90deg,transparent,var(--gold-2))}

/* ===== Section intro (chapter) ===== */
.chapter-head{text-align:center;max-width:720px;margin:0 auto 56px}
.chapter-index{font-family:'Fraunces',serif;font-style:italic;font-size:1rem;color:var(--gold-1);letter-spacing:.04em;display:block;margin-bottom:14px}

/* ===== Horizontal scroll journey ===== */
.journey{background:#ffffff;color:var(--on-dark);position:relative}
.journey-intro{text-align:center;padding:96px 24px 0}
.journey-intro .eyebrow{color:var(--gold-2)}
.journey-intro h2{color:#fff;font-size:clamp(2rem,5vw,3.4rem);margin:14px auto 14px;max-width:18ch}
.journey-intro p{color:var(--on-dark-muted);max-width:54ch;margin:0 auto}
.journey-intro .scroll-hint{margin-top:26px;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-muted);display:inline-flex;align-items:center;gap:10px}
.journey-intro .scroll-hint::after{content:"";width:46px;height:1px;background:var(--gold);display:inline-block}

.journey-pin{padding:60px 0 96px}
.journey-track{display:flex;flex-direction:column;gap:60px}
.journey-panel{width:100%;display:grid;grid-template-columns:1.05fr 1fr;gap:6vw;align-items:center;padding:0 8vw;--accent:var(--gold-2)}
.jp-text{max-width:38ch}
.jp-num{font-family:'Fraunces',serif;font-size:clamp(3rem,7vw,5.4rem);font-weight:600;line-height:1;color:var(--accent);opacity:.9}
.jp-kicker{display:inline-block;margin:10px 0 14px;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:600}
.jp-title{color:#fff;font-size:clamp(2rem,4.4vw,3.2rem);margin-bottom:16px;letter-spacing:-.02em}
.jp-desc{color:var(--on-dark-muted);margin-bottom:24px}
.jp-link{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-weight:600;font-size:.95rem;border-bottom:1px solid transparent;transition:gap .25s var(--ease),border-color .25s}
.jp-link:hover{gap:14px;border-color:var(--accent)}
.jp-posters{display:flex;gap:18px;justify-content:flex-start}
.jp-poster{flex:0 0 auto;width:clamp(120px,15vw,190px);aspect-ratio:9/16;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 50px -22px rgba(0,0,0,.7);position:relative;display:block}
.jp-poster:nth-child(2){margin-top:42px}
.jp-poster:nth-child(3){margin-top:-22px}
.jp-poster img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.jp-poster:hover img{transform:scale(1.06)}
.jp-poster::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 60%,rgba(14,16,24,.55));pointer-events:none}

/* horizontal mode (enabled by JS on capable viewports) */
.journey.is-horizontal{overflow:hidden}
.journey.is-horizontal .journey-pin{height:100vh;padding:0;display:flex;align-items:center}
.journey.is-horizontal .journey-track{flex-direction:row;gap:0;height:100%;align-items:center;will-change:transform}
.journey.is-horizontal .journey-panel{flex:0 0 100vw;height:100vh;gap:5vw}

/* closing CTA panel */
.jp-cta{grid-template-columns:1fr;text-align:center;place-items:center}
.jp-cta .jp-text{max-width:42ch}

/* ===== Parallax helper ===== */
[data-parallax]{will-change:transform}

/* ===== Reveal upgrades (used when GSAP not driving) ===== */
.reveal-stagger>*{opacity:0;transform:translateY(20px)}
.reveal-stagger.in>*{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease)}

@media (max-width:900px){
  .journey-panel{grid-template-columns:1fr;gap:32px;padding:0 24px}
  .jp-posters{justify-content:flex-start}
  .jp-poster:nth-child(2),.jp-poster:nth-child(3){margin-top:0}
}

/* ===== Atelier mist scene (landing) ===== */
.atelier{position:relative;overflow:hidden;color:var(--text);background:radial-gradient(125% 90% at 50% -5%,#efe6fb 0%,#f3edfc 45%,#e9defb 82%)}
.atelier-stage{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:96px 24px;text-align:center}
.atelier-caption{position:relative;z-index:4;max-width:640px}
.atelier-caption .eyebrow{color:var(--gold-1)}
.atelier-caption h2{color:var(--ink);font-size:clamp(2rem,5vw,3.4rem);margin:14px 0 14px;letter-spacing:-.02em}
.atelier-caption p{color:var(--muted);max-width:50ch;margin:0 auto}
.atelier-products{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:center;gap:clamp(2px,1.5vw,20px);margin-top:48px;filter:drop-shadow(0 30px 44px rgba(70,40,120,.3))}
.atelier-products::before{content:"";position:absolute;left:-7%;right:-7%;bottom:-6px;height:1px;background:linear-gradient(90deg,transparent,rgba(124,58,237,.35),transparent)}
.atelier-products::after{content:"";position:absolute;left:8%;right:8%;bottom:-48px;height:64px;background:radial-gradient(60% 100% at 50% 0,rgba(139,92,246,.34),transparent 72%);filter:blur(12px)}
.product-frame{position:relative;flex:0 0 auto;width:clamp(116px,15vw,184px);height:clamp(204px,26vw,300px);margin:0;border-radius:16px;overflow:hidden;border:1px solid rgba(124,58,237,.28);box-shadow:0 26px 50px -22px rgba(70,40,120,.34)}
.product-frame.pf-tall{height:clamp(244px,32vw,362px)}
.product-frame.pf-low{height:clamp(150px,20vw,232px)}
.product-frame img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease)}
.product-frame:hover img{transform:scale(1.05)}
.product-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(165deg,transparent 50%,rgba(14,16,24,.66));pointer-events:none}
.product-frame .pf-label{position:absolute;left:0;right:0;bottom:0;z-index:2;margin:0;padding:12px 12px 11px;font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.atelier-cats{position:relative;z-index:4;display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:52px}
.atelier-cats span{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-muted);border:1px solid rgba(255,255,255,.16);padding:7px 15px;border-radius:999px}
.mist{display:none!important}
.mist-veil{position:absolute;inset:-3%;background:linear-gradient(180deg,rgba(246,241,255,.72),rgba(235,227,250,.54));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.mist-layer{position:absolute;border-radius:50%;background:radial-gradient(closest-side,rgba(250,246,255,.85),rgba(250,246,255,0) 72%);filter:blur(40px);will-change:transform,opacity}
.mist .m1{width:88vw;height:64vh;left:-14vw;bottom:0}
.mist .m2{width:62vw;height:54vh;right:-10vw;bottom:12vh;background:radial-gradient(closest-side,rgba(224,213,250,.62),transparent 72%)}
.mist .m3{width:54vw;height:46vh;left:16vw;bottom:-6vh}
.mist .m4{width:46vw;height:44vh;left:32vw;top:4vh;background:radial-gradient(closest-side,rgba(238,230,252,.6),transparent 72%)}
.mist .m-dark-powder{width:48vw;height:48vw;left:26vw;top:8vh;background:radial-gradient(closest-side,rgba(48, 12, 94, 0.96) 0%,rgba(124, 58, 237, 0.6) 45%,transparent 75%);filter:blur(24px);z-index:5}
@media (prefers-reduced-motion:no-preference){
  .mist .m1{animation:mistDrift1 19s ease-in-out infinite}
  .mist .m2{animation:mistDrift2 23s ease-in-out infinite}
  .mist .m4{animation:mistDrift2 27s ease-in-out infinite reverse}
}
@keyframes mistDrift1{0%,100%{transform:translate(0,0)}50%{transform:translate(4%,-3%)}}
@keyframes mistDrift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-5%,2%)}}
@media (max-width:640px){
  .atelier-products{gap:8px}
  .product-frame{width:clamp(80px,21vw,120px);height:clamp(150px,40vw,210px)}
  .product-frame.pf-tall{height:clamp(182px,48vw,250px)}
  .product-frame.pf-low{height:clamp(120px,32vw,170px)}
  .product-frame .pf-label{font-size:.54rem;padding:8px}
}

/* ===== Responsive ===== */
@media (max-width:960px){
  /* -170% (was -130%) so the closed menu always clears the viewport now that
     the standard nav carries five items plus the catalogue dropdown */
  /* Solid background and an explicit z-index: at .98 alpha the article
     headline still read through the open menu. -170% (was -130%) so the
     closed menu clears the viewport now the nav carries five items. */
  .nav-links{position:fixed;inset:74px 0 auto 0;z-index:60;flex-direction:column;background:#f4f1ea;padding:26px;gap:20px;border-bottom:1px solid var(--border);box-shadow:0 18px 40px -24px rgba(42,29,69,.5);transform:translateY(-170%);transition:transform .4s var(--ease)}
  .nav-links.open{transform:none}
  .nav-toggle{display:flex}
  .bento,.niche-grid,.steps,.quotes,.pricing-grid,.blog-grid{grid-template-columns:1fr 1fr}
  .bento-lg{grid-row:auto}.bento-wide{grid-column:span 2}
  .about-grid,.cta-card{grid-template-columns:1fr}
  .price-card.featured{transform:none}
  .footer-inner{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .stats{grid-template-columns:1fr 1fr}
  .bento,.niche-grid,.steps,.quotes,.pricing-grid,.blog-grid{grid-template-columns:1fr}
  .bento-wide{grid-column:auto}
  .footer-inner{grid-template-columns:1fr}
  .cta-card{padding:34px 24px}
  .hero{padding:64px 0 54px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important}
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ===== Custom Product Curation Zoom ===== */
.price-card img {
  transition: transform 0.6s var(--ease) !important;
}
.price-card:hover img {
  transform: scale(1.06);
}

/* ===== Curated Comparison Tables ===== */
.comp-table-wrapper {
  width: 100%;
  overflow-x: auto;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--paper);
  box-shadow: var(--shadow-sm);
  margin-top: 10px;
  -webkit-overflow-scrolling: touch;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .4s var(--ease), transform .4s var(--ease);
}
.comp-table-wrapper.active-comp {
  opacity: 1;
  transform: none;
}
.comp-table {
  width: 100%;
  border-collapse: collapse;
  font-family: inherit;
  font-size: 0.95rem;
  color: var(--text);
  min-width: 720px;
}
.comp-table th {
  background: var(--bone-2);
  padding: 20px 24px;
  font-family: 'Fraunces', serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--ink);
  border-bottom: 2px solid var(--border);
}
.comp-table td {
  padding: 18px 24px;
  border-bottom: 1px solid var(--border);
  line-height: 1.6;
  text-align: center;
}
.comp-table td.criteria-label {
  font-weight: 600;
  color: var(--ink);
  background: rgba(124, 58, 237, 0.02);
  border-right: 1px solid var(--border);
  text-align: left;
}
.comp-table tr:last-child td {
  border-bottom: none;
}
.comp-table tr:hover td {
  background: rgba(124, 58, 237, 0.02);
}
.comp-table tr:hover td.criteria-label {
  background: rgba(124, 58, 237, 0.04);
}
.comp-table .btn-ghost {
  border-color: var(--border-strong) !important;
  color: var(--ink) !important;
}
.comp-table .btn-ghost:hover {
  background: rgba(20,22,29,.03) !important;
  border-color: var(--ink) !important;
}


/* ===== Premium Typography & Readability on White Backgrounds ===== */
.section:not(.section-alt):not(.cta-section) p,
.section:not(.section-alt):not(.cta-section) li,
.card:not(.cta-card) p,
.niche p,
.post p,
.step p,
.mini-card p,
.section-head p {
  color: var(--ink) !important;
}

/* Ensure highlight elements inside cards retain accent colors */
.ticks li::before {
  background: var(--gold) !important;
}


/* ===== Product & Media Asset Hub Styles ===== */
.product-hub-section {
  padding: 80px 0 120px;
}
.product-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 30px;
  margin-top: 40px;
}
.product-card {
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: transform 0.4s var(--ease), box-shadow 0.4s;
}
.product-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow);
}
.product-card-image {
  height: 220px;
  overflow: hidden;
  border-bottom: 1px solid var(--border);
  background: var(--bone-2);
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-card-image img {
  height: 80%;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 16px rgba(42,29,69,0.18));
  transition: transform 0.4s var(--ease);
}
.product-card:hover .product-card-image img {
  transform: scale(1.06);
}
.product-card-body {
  padding: 28px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 12px;
}
.product-card-meta {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gold-1);
}
.product-card h3 {
  font-size: 1.3rem;
  margin: 0;
  color: var(--ink);
}
.product-card p {
  color: var(--ink);
  font-size: 0.95rem;
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
.product-card-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 16px;
}
.product-card-actions .btn {
  width: 100%;
  padding: 11px 14px;
  font-size: .88rem;
}
.product-card-body > button.explore-assets-btn.btn-block {
  display: none;
}
.health-category-card.active {
  border-color: rgba(109,62,216,.42);
  box-shadow: var(--shadow);
}

/* Slide-out detail drawer */
.detail-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 10, 40, 0.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s;
  z-index: 999;
}
.detail-backdrop.open {
  opacity: 1;
  visibility: visible;
}
.detail-panel {
  position: fixed;
  top: 0;
  right: -600px;
  width: 580px;
  max-width: 100%;
  height: 100vh;
  background: var(--bone);
  z-index: 1000;
  box-shadow: -10px 0 40px rgba(20,10,40,0.15);
  transition: right 0.4s var(--ease);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.detail-panel.open {
  right: 0;
}
.detail-header {
  padding: 30px 40px;
  background: var(--paper);
  border-bottom: 1px solid var(--border);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.detail-header h2 {
  font-size: 1.4rem;
  margin: 0;
  color: var(--ink);
}
.detail-close-btn {
  background: none;
  border: none;
  font-size: 1.5rem;
  color: var(--muted);
  cursor: pointer;
  padding: 5px;
  line-height: 1;
  transition: color 0.2s;
}
.detail-close-btn:hover {
  color: var(--ink);
}
.detail-content {
  padding: 40px;
  flex: 1;
}

/* Tabs */
.panel-tabs {
  display: flex;
  gap: 20px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 30px;
  padding-bottom: 5px;
}
.panel-tab-btn {
  background: none;
  border: none;
  padding: 8px 0;
  font-family: inherit;
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--muted);
  cursor: pointer;
  position: relative;
  transition: color 0.2s;
}
.panel-tab-btn:hover {
  color: var(--ink);
}
.panel-tab-btn.active {
  color: var(--ink);
}
.panel-tab-btn.active::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--ink);
}
.tab-pane {
  display: none;
}
.tab-pane.active {
  display: block;
  animation: fadeIn 0.3s ease;
}

/* Product facts table */
.facts-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
}
.facts-table tr {
  border-bottom: 1px solid var(--border);
}
.facts-table tr:last-child {
  border-bottom: none;
}
.facts-table td {
  padding: 12px 0;
  font-size: 0.95rem;
  vertical-align: top;
}
.facts-table td.label-col {
  font-weight: 600;
  color: var(--ink);
  width: 32%;
}
.facts-table td.val-col {
  color: var(--ink);
}

/* Pros and Cons list */
.pros-cons-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 15px;
}
.pc-col h4 {
  margin: 0 0 10px;
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.pc-col.pros h4 { color: #10b981; }
.pc-col.cons h4 { color: #ef4444; }
.pc-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pc-list li {
  font-size: 0.9rem;
  color: var(--ink);
  position: relative;
  padding-left: 18px;
}
.pc-col.pros .pc-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #10b981;
  font-weight: bold;
}
.pc-col.cons .pc-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #ef4444;
  font-size: 1.2rem;
  line-height: 0.9;
}

/* Image grid in panel */
.panel-img-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}
.panel-img-wrapper {
  aspect-ratio: 1;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--paper);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.panel-img-wrapper img {
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
}

/* Reviews styles */
.panel-reviews-list {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-bottom: 30px;
}
.review-card {
  background: var(--paper);
  border: 1px solid var(--border);
  padding: 20px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.review-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.review-author {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--ink);
}
.review-card p {
  margin: 0;
  font-size: 0.92rem;
  color: var(--ink) !important;
  line-height: 1.45;
}

/* Review Form */
.review-form {
  background: var(--paper);
  border: 1px solid var(--border);
  padding: 24px;
  border-radius: 18px;
}
.review-form h4 {
  margin: 0 0 15px;
  color: var(--ink);
}
.review-form-row {
  display: flex;
  gap: 15px;
  margin-bottom: 12px;
}
.review-form input, .review-form textarea, .review-form select {
  font-family: inherit;
  font-size: 0.92rem;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  background: var(--bone);
  color: var(--ink);
  outline: none;
  width: 100%;
}
.review-form input:focus, .review-form textarea:focus, .review-form select:focus {
  border-color: var(--ink);
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 760px) {
  .detail-panel {
    width: 100%;
    right: -100%;
  }
  .pros-cons-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== Header Navigation Dropdown ===== */
.nav-dropdown {
  position: relative;
  display: inline-block;
}
.nav-dropdown-trigger {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  background: var(--paper);
  min-width: 190px;
  box-shadow: 0 10px 30px rgba(20,10,40,0.12);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 8px 0;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s;
}
.nav-dropdown:hover .nav-dropdown-menu {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu a {
  display: block !important;
  padding: 10px 20px !important;
  font-size: 0.88rem !important;
  color: var(--muted) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: background 0.2s, color 0.2s;
  border-bottom: none !important;
  margin: 0 !important;
  text-align: left !important;
}
.nav-dropdown-menu a:hover {
  background: var(--bone-2) !important;
  color: var(--ink) !important;
}

/* Triangle indicator */
.nav-dropdown-menu::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: transparent transparent var(--border) transparent;
}
.nav-dropdown-menu::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: transparent transparent var(--paper) transparent;
  margin-bottom: -1px;
}


/* Disable gold hover underline for dropdown sub-menu links */
.nav-links .nav-dropdown-menu a::after {
  display: none !important;
}

/* Mobile responsive inline dropdown adjustments */
@media (max-width: 960px) {
  .nav-links .nav-dropdown {
    width: 100%;
    text-align: center;
  }
  .nav-links .nav-dropdown-trigger {
    justify-content: center;
    width: 100%;
  }
  .nav-links .nav-dropdown-trigger .chevron {
    display: none !important;
  }
  .nav-links .nav-dropdown-menu {
    display: block !important;
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-shadow: none !important;
    border: none !important;
    padding: 10px 0 0 0 !important;
    background: transparent !important;
    width: 100% !important;
    text-align: center !important;
  }
  .nav-links .nav-dropdown-menu a {
    text-align: center !important;
    padding: 8px 0 !important;
    font-size: 0.95rem !important;
    color: var(--ink-soft) !important;
  }
  .nav-links .nav-dropdown-menu a:hover {
    background: transparent !important;
    color: var(--ink) !important;
  }
}


/* ===== Grouped Category Heading Styles ===== */
.category-group-header {
  font-family: 'Fraunces', serif;
  font-size: 1.6rem;
  color: var(--ink);
  margin: 50px 0 24px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 2px solid var(--border);
  padding-bottom: 10px;
  width: 100%;
}
.category-group-header span {
  font-size: 1.8rem;
}
.niche-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 30px;
  margin-bottom: 60px;
}
.health-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 18px;
  margin: 22px 0 64px;
}
.health-category-card {
  min-height: 228px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 26px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255,250,245,.96), rgba(247,241,236,.78)),
    radial-gradient(circle at 90% 12%, rgba(211,154,54,.16), transparent 36%);
  box-shadow: var(--shadow-sm);
  transition: transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.health-category-card:hover {
  transform: translateY(-5px);
  border-color: rgba(109,62,216,.32);
  box-shadow: var(--shadow);
}
.health-category-card h3 {
  font-size: 1.35rem;
  margin: 0;
}
.health-category-card p {
  color: var(--ink-soft);
  line-height: 1.5;
  margin: 0;
}
.health-category-count,
.health-category-tags {
  color: var(--cherry);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.health-category-tags {
  color: var(--matcha);
  letter-spacing: .08em;
}
.category-group-section {
  margin-bottom: 50px;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.category-group-section.hidden {
  display: none !important;
}


/* ===== Contrast Fixes for Featured (Editor's Choice) Cards ===== */
.price-card.featured h3 {
  color: #ffffff !important;
}
.price-card.featured p, 
.price-card.featured .price-desc {
  color: rgba(245, 241, 251, 0.9) !important; /* Soft light text */
}
.price-card.featured div {
  color: var(--gold-1) !important; /* Make stars stand out in bright gold */
}

/* ===== Scroll-stopping editorial refresh ===== */
h1,h2,h3,h4{letter-spacing:0}
.section-head h2,.about-grid h2,.atelier-caption h2,.hero-title{letter-spacing:0}

.bg-mesh{
  opacity:.55;
  filter:none;
  mix-blend-mode:normal;
  background:
    linear-gradient(90deg,rgba(36,25,54,.035) 1px,transparent 1px),
    linear-gradient(180deg,rgba(36,25,54,.03) 1px,transparent 1px);
  background-size:42px 42px;
}
.blob{display:none}

body.home .hero{
  min-height:calc(100vh - 74px);
  display:grid;
  grid-template-columns:minmax(0,1fr);
  place-items:center;
  padding:54px 0 28px;
  background:
    linear-gradient(180deg,rgba(247,241,236,.9) 0%,rgba(247,241,236,.58) 58%,var(--bone) 100%),
    linear-gradient(115deg,#f7f1ec 0%,#efe2dc 42%,#e7edd8 73%,#fffaf5 100%);
}
body.home .hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(36,25,54,.08) 1px,transparent 1px),
    linear-gradient(180deg,rgba(36,25,54,.06) 1px,transparent 1px);
  background-size:88px 88px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 80%);
}
body.home .hero::after{
  content:"";
  display:none;
}
body.home::after{
  content:"POWDEREDPURPLE";
  position:fixed;
  left:50%;
  top:22%;
  transform:translateX(-50%);
  font-family:'Inter',system-ui,sans-serif;
  font-weight:700;
  font-size:clamp(4.8rem,11vw,9.8rem);
  line-height:1;
  letter-spacing:.12em;
  color:transparent;
  -webkit-text-stroke:1.2px rgba(109,62,216,.16);
  -webkit-text-stroke-width:1.2px;
  -webkit-text-stroke-color:rgba(109,62,216,.16);
  text-stroke:1.2px rgba(109,62,216,.16);
  text-shadow:
    0 0 18px rgba(211,154,54,.16),
    1px 1px 0 rgba(236,216,170,.08),
    -1px -1px 0 rgba(109,62,216,.05);
  white-space:nowrap;
  pointer-events:none;
  z-index:2;
  mix-blend-mode:multiply;
}
.hero-bg-stage{
  position:absolute;
  inset:0;
  max-width:1440px;
  margin:0 auto;
  z-index:1;
  pointer-events:none;
  transform:translate3d(calc(var(--mx, 0px) * .25),calc(var(--my, 0px) * .18),0);
  transition:transform .35s var(--ease);
}
.hero-artifact{
  position:absolute;
  width:172px;
  margin:0;
  overflow:hidden;
  border-radius:8px;
  border:1px solid rgba(36,25,54,.16);
  background:rgba(255,250,245,.76);
  box-shadow:0 26px 60px -34px rgba(36,25,54,.5);
  backdrop-filter:blur(10px);
  opacity:.86;
}
.hero-artifact img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.04) contrast(1.02)}
.hero-artifact figcaption{
  position:absolute;
  left:8px;
  right:8px;
  bottom:8px;
  padding:7px 9px;
  border-radius:7px;
  background:rgba(255,250,245,.82);
  color:var(--ink);
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hero-artifact-lg{left:7%;top:16%;height:236px;transform:rotate(-5deg)}
.hero-artifact-tall{right:9%;top:13%;width:150px;height:268px;transform:rotate(4deg)}
.hero-artifact-wide{left:8%;bottom:3%;width:226px;height:142px;transform:rotate(3deg)}
.hero-artifact-small{right:13%;bottom:2%;width:150px;height:190px;transform:rotate(-6deg)}
.hero-shell{
  position:relative;
  z-index:2;
  width:min(100%,1040px);
  max-width:1040px;
  text-align:center;
}
.hero-logo{
  height:58px;
  padding:0;
  border-radius:0;
  background:transparent;
  border:0;
  filter:drop-shadow(0 18px 34px rgba(36,25,54,.18));
}
.hero-badge{
  background:rgba(255,250,245,.86);
  border-color:rgba(36,25,54,.16);
  color:var(--ink-soft);
  margin-bottom:18px;
}
.pulse-dot{background:var(--matcha)}
.hero-title{
  max-width:20ch;
  margin-bottom:18px;
  font-size:3.9rem;
  text-wrap:balance;
}
.grad-text{
  background:linear-gradient(120deg,var(--royal),var(--cherry) 48%,var(--saffron));
  -webkit-background-clip:text;
  background-clip:text;
}
.hero-sub{
  max-width:760px;
  margin:0 auto 24px;
  font-size:0;
  line-height:0;
  color:transparent;
}
.hero-sub-copy{
  display:block;
  color:var(--ink-soft);
  font-size:1.05rem;
  line-height:1.55;
}
.hero-sub-copy strong{color:var(--ink)}
.hero-cta a[href="#edits"]:not(.hero-library-link){display:none}
.hero-signal-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  max-width:920px;
  margin:24px auto 0;
}
.hero-signal{
  min-height:106px;
  padding:14px;
  border-radius:8px;
  border:1px solid rgba(36,25,54,.15);
  background:rgba(255,250,245,.92);
  box-shadow:var(--shadow-sm);
  text-align:left;
  backdrop-filter:blur(14px);
}
.signal-kicker{
  display:block;
  margin-bottom:10px;
  color:var(--cherry);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.hero-signal strong{
  display:block;
  color:var(--ink);
  font-size:.88rem;
  line-height:1.45;
}
.hero-cta{margin-bottom:0}
.hero-trust{display:none}

.stats{
  position:relative;
  z-index:3;
  grid-template-columns:repeat(3,1fr);
  margin-top:-24px;
  background:rgba(36,25,54,.16);
  border-color:rgba(36,25,54,.14);
  box-shadow:var(--shadow);
}
.stat{
  background:rgba(255,250,245,.92);
}
.stat:nth-child(2) .stat-num{color:var(--matcha)}
.stat:nth-child(3) .stat-num{color:var(--cherry)}
.stat:nth-child(4) .stat-num{color:var(--saffron)}

.card,.niche,.price-card,.post,.mini-card,.quote,.step,.product-card,.review-card{
  border-radius:8px;
}
.card:hover,.niche:hover,.post:hover,.quote:hover,.step:hover,.product-card:hover{
  transform:translateY(-5px);
}
.bento .card:nth-child(2),.quote:nth-child(2),.post:nth-child(2){
  border-color:rgba(96,122,59,.28);
}
.bento .card:nth-child(3),.quote:nth-child(3),.post:nth-child(3){
  border-color:rgba(185,79,93,.28);
}

.atelier{
  background:
    linear-gradient(180deg,#241936 0%,#352348 52%,#f7f1ec 100%);
}
.atelier-stage{
  min-height:92vh;
}
.atelier-caption h2,.atelier-caption p{color:#fff8ef}
.atelier-caption p{color:rgba(255,248,239,.72)}
.atelier-caption .eyebrow{color:var(--gold-2)}
.product-frame{
  border-radius:8px;
  border-color:rgba(255,248,239,.26);
  box-shadow:0 34px 70px -34px rgba(0,0,0,.72);
}
.product-frame .pf-label{
  background:linear-gradient(180deg,transparent,rgba(36,25,54,.88));
}

@media (max-width:1100px){
  body.home::after{font-size:5.6rem;top:20%}
  .hero-artifact-lg{left:1%}
  .hero-artifact-wide{left:3%}
  .hero-artifact-tall{right:1%}
  .hero-artifact-small{right:4%}
}
@media (max-width:860px){
  body.home .hero>.hero-shell{
    width:100%;
    max-width:100%;
    padding:0 28px;
    justify-self:center;
    z-index:2;
  }
  body.home .hero{
    min-height:auto;
    padding-top:78px;
  }
  body.home::after{
    top:20%;
    font-size:4.7rem;
    opacity:.58;
  }
  .hero-bg-stage{
    position:absolute;
    inset:0;
    width:100%;
    height:auto;
    margin:0;
    transform:none;
  }
  .hero-artifact{width:138px}
  .hero-artifact-lg{left:-52px;top:210px;height:178px;opacity:.34}
  .hero-artifact-tall{right:-42px;top:178px;width:118px;height:202px;opacity:.34}
  .hero-artifact-wide{display:none}
  .hero-artifact-small{display:none}
  .hero-title{font-size:3.25rem;max-width:100%}
  .hero-sub,.hero-cta,.hero-signal-grid{max-width:100%}
  .hero-sub-copy{font-size:1.03rem}
  .hero-signal-grid{
    display:flex;
    gap:10px;
    margin-top:24px;
    overflow-x:auto;
    padding:0 0 8px;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .hero-signal-grid::-webkit-scrollbar{display:none}
  .hero-signal{
    flex:0 0 252px;
    min-height:96px;
    text-align:left;
    scroll-snap-align:center;
  }
}
@media (max-width:640px){
  .hero-title{font-size:2.55rem}
  .hero-logo{height:58px}
  .hero-cta .btn{width:100%}
  .hero-bg-stage{height:214px}
  .hero-artifact figcaption{font-size:.58rem}
  .stats{margin-top:0}
}


/* Classified product mega menu */
.nav-dropdown{position:relative}.nav-dropdown-row{display:flex;align-items:center;gap:2px}.nav-dropdown-toggle{border:0;background:transparent;color:var(--ink-soft);padding:8px 5px;cursor:pointer;line-height:1;font-weight:800}.nav-dropdown-toggle span{display:block;transition:transform .25s}.nav-dropdown.open .nav-dropdown-toggle span,.nav-dropdown:hover .nav-dropdown-toggle span{transform:rotate(180deg)}
.nav-mega{position:absolute;top:calc(100% + 24px);right:-190px;width:min(900px,calc(100vw - 40px));padding:24px;background:rgba(250,247,252,.99);border:1px solid var(--border);box-shadow:0 30px 80px -30px rgba(33,22,49,.46);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .22s,visibility .22s,transform .22s;z-index:100}.nav-dropdown:hover .nav-mega,.nav-dropdown:focus-within .nav-mega,.nav-dropdown.open .nav-mega{opacity:1;visibility:visible;transform:none}
.nav-mega-intro{display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:baseline;padding-bottom:18px;border-bottom:1px solid var(--border)}.nav-mega-intro span{font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--purple);font-weight:700}.nav-mega-intro strong{font:600 1.35rem Fraunces,serif}.nav-mega-intro p{grid-column:2;color:var(--muted);font-size:.78rem;margin-top:4px}.nav-mega-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:22px 0}.nav-mega-grid h3{font:700 .8rem Inter,sans-serif;text-transform:uppercase;letter-spacing:.08em;margin-bottom:9px}.nav-links .nav-mega-grid a{display:block!important;padding:5px 0!important;font-size:.78rem!important;font-weight:500!important;color:var(--muted)!important}.nav-links .nav-mega-grid a::after,.nav-links .nav-mega-all::after{display:none!important}.nav-links .nav-mega-grid a:hover{color:var(--purple)!important}.nav-mega-all{display:flex!important;justify-content:space-between;align-items:center;background:var(--ink);color:#fff!important;padding:13px 16px!important;font-size:.78rem!important;font-weight:700!important}.nav-mega-all span{font-size:1.15rem}
@media(max-width:960px){.nav-dropdown{width:100%}.nav-dropdown-row{justify-content:center}.nav-dropdown-link{padding:0!important}.nav-dropdown-toggle{padding:8px}.nav-mega{display:none;position:static!important;width:100%!important;padding:16px!important;margin-top:8px;opacity:1!important;visibility:visible!important;transform:none!important;box-shadow:none!important;background:rgba(255,255,255,.6)!important}.nav-dropdown.open .nav-mega{display:block}.nav-dropdown:hover .nav-mega:not(:focus-within){display:none}.nav-dropdown.open:hover .nav-mega{display:block}.nav-mega-intro{display:block}.nav-mega-intro strong{display:block;margin:7px 0}.nav-mega-grid{grid-template-columns:1fr;padding:14px 0;gap:14px}.nav-links .nav-mega-grid a{text-align:center!important}.nav-mega-all{justify-content:center!important;gap:12px}}

/* Button finish: white base, glistening gold outline, purple on hover */
.btn,
.btn-primary,
.btn-ghost,
.btn-secondary {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(120deg, #9f6a12 0%, #f8e7a8 18%, #d79a37 38%, #fff5c7 58%, #b77b1d 78%, #f7d878 100%) border-box !important;
  border: 1.5px solid transparent !important;
  border-width: 1.5px !important;
  color: var(--ink, #211631) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(159,106,18,.12),
    0 10px 26px -20px rgba(33,22,49,.5) !important;
}
.btn::after,
.btn-primary::after,
.btn-ghost::after,
.btn-secondary::after {
  content: "";
  position: absolute;
  inset: 2px 12%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.82), transparent);
  opacity: .42;
  pointer-events: none;
  z-index: -1;
}
.btn:hover,
.btn:focus-visible,
.btn-primary:hover,
.btn-primary:focus-visible,
.btn-ghost:hover,
.btn-ghost:focus-visible,
.btn-secondary:hover,
.btn-secondary:focus-visible {
  background:
    linear-gradient(var(--ink, #211631), var(--ink, #211631)) padding-box,
    linear-gradient(120deg, #9f6a12 0%, #f8e7a8 18%, #d79a37 38%, #fff5c7 58%, #b77b1d 78%, #f7d878 100%) border-box !important;
  border-color: transparent !important;
  border-width: 1.5px !important;
  color: #fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 16px 36px -18px rgba(75,36,111,.7) !important;
}
.btn:hover::after,
.btn:focus-visible::after,
.btn-primary:hover::after,
.btn-primary:focus-visible::after,
.btn-ghost:hover::after,
.btn-ghost:focus-visible::after,
.btn-secondary:hover::after,
.btn-secondary:focus-visible::after {
  opacity: 0;
}
.footer .btn,
.footer .btn-primary,
.footer .btn-ghost,
.footer .btn-secondary {
  color: var(--ink, #211631) !important;
}
.footer .btn:hover,
.footer .btn:focus-visible,
.footer .btn-primary:hover,
.footer .btn-primary:focus-visible,
.footer .btn-ghost:hover,
.footer .btn-ghost:focus-visible,
.footer .btn-secondary:hover,
.footer .btn-secondary:focus-visible {
  color: #fff !important;
}


/* ===== Standardised affiliate disclosure (compliance) ===== */
.top-disclosure{
  display:block;border:2px solid #7b3fc6;border-left-width:6px;background:#f6f0ff;
  color:#4b246f;padding:16px 18px;margin:0 0 30px;font-size:1rem;line-height:1.55;
  font-weight:500;font-style:normal;border-radius:4px;
}
.top-disclosure strong{color:#7b3fc6;font-weight:800}
.top-disclosure a{color:#7b3fc6;text-decoration:underline}


/* ===== Article rating: polished gold stars, thin purple edge ===== */
.pp-rating{
  max-width:640px;margin:56px auto 0;padding:34px 30px;text-align:center;
  background:linear-gradient(168deg,#fffdf9 0%,#faf5ff 100%);
  border:1px solid #e6dcf5;border-radius:20px;
  box-shadow:0 18px 44px -30px rgba(75,36,111,.45);
}
.pp-rating-defs{position:absolute;width:0;height:0;overflow:hidden}
.pp-rating-head h4{
  font-family:'Fraunces',Georgia,serif;font-size:1.35rem;color:#2a1d45;margin:0 0 6px;
}
.pp-rating-head p{font-size:.94rem;color:#6b5c80;margin:0}

.pp-stars{display:flex;justify-content:center;gap:10px;margin:20px 0 16px}
.pp-star-btn{
  -webkit-appearance:none;appearance:none;border:0;background:none;padding:2px;margin:0;
  cursor:pointer;line-height:0;border-radius:10px;
  transition:transform .18s cubic-bezier(.34,1.56,.64,1);
}
.pp-star-btn:hover,.pp-star-btn.preview{transform:translateY(-3px) scale(1.1)}
.pp-star-btn:active{transform:translateY(-1px) scale(1.02)}
.pp-star-btn:focus-visible{outline:2px solid #7b3fc6;outline-offset:3px}

.pp-star{width:44px;height:44px;display:block;overflow:visible}

/* unrated: soft lilac face */
.pp-star-fill{fill:#ece4f7;transition:fill .22s ease}
/* thin purple outline, constant weight at any size */
.pp-star-edge{
  fill:none;stroke:#7b3fc6;stroke-width:1;stroke-linejoin:round;
  vector-effect:non-scaling-stroke;opacity:.55;transition:opacity .22s ease;
}
/* the travelling highlight, hidden until the star is lit */
.pp-star-sheen{fill:url(#ppSheen);opacity:0;transform:translateX(0)}

/* lit state: metallic gold + glow + glisten */
.pp-star-btn.on .pp-star-fill{fill:url(#ppGold)}
.pp-star-btn.on .pp-star-edge{opacity:1}
.pp-star-btn.on .pp-star{
  filter:drop-shadow(0 1px 1px rgba(140,90,0,.35)) drop-shadow(0 3px 10px rgba(233,175,40,.55));
}
.pp-star-btn.on .pp-star-sheen{opacity:1;animation:ppSheenSweep 2.8s ease-in-out infinite}
.pp-star-btn.on:nth-child(2) .pp-star-sheen{animation-delay:.16s}
.pp-star-btn.on:nth-child(3) .pp-star-sheen{animation-delay:.32s}
.pp-star-btn.on:nth-child(4) .pp-star-sheen{animation-delay:.48s}
.pp-star-btn.on:nth-child(5) .pp-star-sheen{animation-delay:.64s}

@keyframes ppSheenSweep{
  0%{transform:translateX(0)}
  55%{transform:translateX(46px)}
  100%{transform:translateX(46px)}
}

.pp-rating-msg{font-size:.98rem;font-weight:600;color:#4b246f;margin:0 0 6px;min-height:1.4em}
.pp-rating.rated .pp-rating-msg{color:#2a1d45}
.pp-rating-note{font-size:.78rem;color:#8a7b9c;margin:0;line-height:1.5}

@media (max-width:520px){
  .pp-rating{padding:26px 18px;margin-top:40px}
  .pp-star{width:36px;height:36px}
  .pp-stars{gap:6px}
}
@media (prefers-reduced-motion:reduce){
  .pp-star-btn,.pp-star-btn:hover,.pp-star-btn.preview{transition:none;transform:none}
  .pp-star-btn.on .pp-star-sheen{animation:none;opacity:0}
}

/* ===== Related products on Journal articles ===== */
.pp-related{max-width:740px;margin:56px auto 0;padding-top:40px;border-top:1px solid var(--border)}
.pp-related-head{margin-bottom:20px}
.pp-related-head h3{font-family:'Fraunces',Georgia,serif;font-size:1.7rem;color:var(--ink);margin:8px 0 0;line-height:1.2}
.pp-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px;margin-top:22px}
.pp-related-card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--border);border-radius:14px;overflow:hidden;text-decoration:none;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.pp-related-card:hover{transform:translateY(-4px);border-color:#7b3fc6;box-shadow:0 18px 38px -26px rgba(75,36,111,.55)}
.pp-related-media{aspect-ratio:1/1;background:#f3eefb;display:grid;place-items:center;overflow:hidden}
.pp-related-media img{width:100%;height:100%;object-fit:cover}
.pp-related-noimg{width:44px;height:44px;border-radius:50%;background:linear-gradient(140deg,#cbb6f2,#7b3fc6);opacity:.5}
.pp-related-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px}
.pp-related-body small{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#7b3fc6}
.pp-related-body h4{font-size:1.02rem;line-height:1.3;color:var(--ink);margin:0}
.pp-related-body p{font-size:.86rem;line-height:1.5;color:var(--muted);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pp-related-cta{margin-top:auto;padding-top:8px;font-size:.82rem;font-weight:700;color:#7b3fc6}
.pp-related-all{display:inline-block;margin-top:22px;font-size:.9rem;font-weight:700;color:#7b3fc6;text-decoration:underline}
@media (max-width:520px){
  .pp-related{margin-top:40px;padding-top:30px}
  .pp-related-grid{grid-template-columns:1fr}
  .pp-related-media{aspect-ratio:16/9}
}
@media (prefers-reduced-motion:reduce){
  .pp-related-card,.pp-related-card:hover{transition:none;transform:none}
}
