/* ==========================================================================
   Business Idea Depot — design system (layered over Bootstrap 5)
   Brand: "signal intelligence for ideas"
   ========================================================================== */
:root{
  --paper:#FBFAF7; --surface:#FFFFFF; --ink:#16181D; --muted:#6F7480;
  --hair:#E9E6DE; --hair-strong:#D9D5CA;
  --brand:#2B44C7; --brand-700:#22369e; --brand-soft:#EAEDFB;
  --weak:#8A94A6; --moderate:#C9821F; --strong:#137A52;
  --weak-soft:#EEF0F3; --moderate-soft:#FBF0DD; --strong-soft:#E2F2EA;
  --display:"Space Grotesk", system-ui, sans-serif;
  --body:"Newsreader", Georgia, serif;
  --mono:"Space Mono", ui-monospace, monospace;
  --shadow-sm:0 1px 2px rgba(20,24,40,.05);
  --shadow:0 1px 2px rgba(20,24,40,.05), 0 10px 30px -18px rgba(20,24,40,.30);
  --radius:16px;
  --bs-body-bg:var(--paper); --bs-body-color:var(--ink);
  --bs-primary:var(--brand); --bs-border-color:var(--hair);
  --bs-link-color:var(--brand); --bs-link-hover-color:var(--brand-700);
}
*{box-sizing:border-box}
body{background:var(--paper); color:var(--ink); font-family:var(--body); -webkit-font-smoothing:antialiased; font-size:17px}
h1,h2,h3,h4,.h-display{font-family:var(--display); letter-spacing:-.02em; color:var(--ink)}
.mono{font-family:var(--mono)}
a{text-decoration:none}
.container-tight{max-width:1120px}

.btn{font-family:var(--display); font-weight:600; border-radius:11px; padding:.65rem 1.15rem; transition:background .15s,transform .05s,border-color .15s,color .15s}
.btn:active{transform:translateY(1px)}
.btn-ink{background:var(--ink); color:#fff; border:1px solid var(--ink)}
.btn-ink:hover{background:var(--brand); border-color:var(--brand); color:#fff}
.btn-brand{background:var(--brand); color:#fff; border:1px solid var(--brand)}
.btn-brand:hover{background:var(--brand-700); color:#fff}
.btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--hair-strong)}
.btn-ghost:hover{border-color:var(--brand); color:var(--brand)}
.btn-lg{padding:.85rem 1.5rem; font-size:1.02rem}

.nav-wrap{background:rgba(251,250,247,.82); backdrop-filter:saturate(140%) blur(8px); border-bottom:1px solid var(--hair); position:sticky; top:0; z-index:30}
.navbar-brand{display:flex; align-items:center; gap:11px; font-family:var(--display); font-weight:700; letter-spacing:.02em; font-size:1.02rem; color:var(--ink)}
.mark{display:flex; align-items:flex-end; gap:3px; height:22px}
.mark i{width:5px; background:var(--brand); border-radius:1px; display:block}
.mark i:nth-child(1){height:9px; opacity:.45}
.mark i:nth-child(2){height:15px; opacity:.72}
.mark i:nth-child(3){height:22px}
.navlink{font-family:var(--display); font-weight:500; font-size:.95rem; color:var(--muted); padding:.4rem .7rem}
.navlink:hover{color:var(--ink)}

.hero{padding:92px 0 60px; position:relative; overflow:hidden}
.eyebrow{font-family:var(--mono); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--brand); margin-bottom:18px}
.hero h1{font-weight:500; font-size:clamp(34px,5.2vw,62px); line-height:1.04; margin:0 0 20px; max-width:15ch}
.hero .lede{font-size:clamp(18px,2.2vw,22px); color:var(--muted); max-width:50ch; margin:0 0 30px}
.hero-form{display:flex; gap:10px; max-width:540px}
.hero-form input{flex:1; font-family:var(--display); font-size:1.05rem; padding:.85rem 1rem; border:1.5px solid var(--hair-strong); border-radius:12px; background:#fff; outline:none}
.hero-form input:focus{border-color:var(--brand); box-shadow:0 0 0 4px var(--brand-soft)}
.trust{display:flex; align-items:center; gap:18px; margin-top:22px; color:var(--muted); font-family:var(--mono); font-size:.8rem; flex-wrap:wrap}
.trust .ck{color:var(--strong); font-weight:700}

.demo{background:var(--surface); border:1px solid var(--hair); border-radius:var(--radius); box-shadow:var(--shadow); padding:20px}
.demo-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px}
.demo-kw{font-family:var(--display); font-weight:600; font-size:1.05rem}
.badge-signal{font-family:var(--mono); font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:4px 9px; border-radius:7px}
.badge-signal.strong{background:var(--strong-soft); color:var(--strong)}
.badge-signal.moderate{background:var(--moderate-soft); color:var(--moderate)}
.badge-signal.weak{background:var(--weak-soft); color:var(--weak)}
.demo-stats{display:flex; gap:22px; margin:6px 0 12px}
.demo-stats .n{font-family:var(--display); font-weight:700; font-size:1.35rem}
.demo-stats .l{font-family:var(--mono); font-size:.66rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted)}
.up{color:var(--strong)} .down{color:var(--moderate)}
.demo svg{width:100%; height:96px; display:block}
.srclist{margin-top:12px; border-top:1px solid var(--hair); padding-top:10px; display:flex; flex-direction:column; gap:7px}
.srcrow{display:flex; align-items:center; justify-content:space-between; font-size:.85rem}
.srcrow .sn{font-family:var(--display); font-weight:500}
.srcrow .sm{font-family:var(--mono); font-size:.82rem}

.section{padding:74px 0}
.section-head{max-width:62ch; margin-bottom:44px}
.section-head .eyebrow{margin-bottom:12px}
.section-head h2{font-size:clamp(26px,3.4vw,40px); font-weight:500; line-height:1.1; margin:0 0 12px}
.section-head p{color:var(--muted); font-size:1.12rem; margin:0}

.feature{background:var(--surface); border:1px solid var(--hair); border-radius:var(--radius); padding:26px; height:100%; box-shadow:var(--shadow-sm); transition:transform .18s, box-shadow .18s}
.feature:hover{transform:translateY(-3px); box-shadow:var(--shadow)}
.feature .ico{width:42px; height:42px; border-radius:11px; background:var(--brand-soft); display:flex; align-items:center; justify-content:center; margin-bottom:16px; color:var(--brand)}
.feature h3{font-size:1.18rem; font-weight:600; margin:0 0 8px}
.feature p{color:var(--muted); font-size:1rem; margin:0}

.step{display:flex; gap:18px; padding:22px 0; border-bottom:1px solid var(--hair)}
.step:last-child{border-bottom:none}
.step .num{font-family:var(--mono); font-size:.9rem; color:var(--brand); font-weight:700; min-width:34px}
.step h3{font-size:1.2rem; font-weight:600; margin:0 0 5px}
.step p{color:var(--muted); margin:0}

.srcchip{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:.82rem; color:var(--muted); border:1px solid var(--hair-strong); border-radius:999px; padding:6px 12px; margin:4px}
.srcchip .dot{width:7px; height:7px; border-radius:50%; background:var(--strong)}
.srcchip.soon .dot{background:var(--hair-strong)}

.price-card{background:var(--surface); border:1px solid var(--hair); border-radius:var(--radius); padding:30px; height:100%; box-shadow:var(--shadow-sm); position:relative; display:flex; flex-direction:column}
.price-card.featured{border:1.5px solid var(--brand); box-shadow:var(--shadow)}
.price-card .tier{font-family:var(--mono); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.price-card .amt{font-family:var(--display); font-weight:700; font-size:2.6rem; line-height:1; margin:10px 0 2px}
.price-card .amt small{font-size:.95rem; font-weight:500; color:var(--muted); font-family:var(--mono)}
.price-card .desc{color:var(--muted); margin:6px 0 20px; min-height:46px}
.feat-list{list-style:none; padding:0; margin:0 0 24px; flex:1}
.feat-list li{display:flex; gap:10px; padding:7px 0; font-size:.98rem}
.feat-list li svg{flex:none; color:var(--strong); margin-top:3px}
.feat-list li.off{color:var(--muted)}
.feat-list li.off svg{color:var(--hair-strong)}
.ribbon{position:absolute; top:-12px; right:22px; background:var(--brand); color:#fff; font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; padding:4px 10px; border-radius:7px}

.faq-item{border-bottom:1px solid var(--hair); padding:20px 0}
.faq-item h3{font-size:1.1rem; font-weight:600; margin:0 0 8px}
.faq-item p{color:var(--muted); margin:0}

.brow{display:grid; grid-template-columns:30px 1fr 70px 84px 76px; align-items:center; gap:14px; padding:14px 0; border-bottom:1px solid var(--hair)}
.brow .rank{font-family:var(--mono); color:var(--muted); text-align:center}
.brow .bkw{font-family:var(--display); font-weight:500}
.brow .bscore{font-family:var(--display); font-weight:700}
.brow .bmom{font-family:var(--mono); font-size:.9rem}
.brow .bvol{font-family:var(--mono); font-size:.82rem; color:var(--muted)}
.dotc{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:9px}

.foot{border-top:1px solid var(--hair); padding:54px 0 40px; margin-top:40px}
.foot h4{font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin:0 0 14px}
.foot a{display:block; color:var(--ink); padding:5px 0; font-size:.96rem}
.foot a:hover{color:var(--brand)}
.foot .fine{font-family:var(--mono); font-size:.78rem; color:var(--muted); margin-top:18px}
@media (prefers-reduced-motion:reduce){*{transition:none !important; animation:none !important}}

/* ==========================================================================
   One-time lifetime pricing + comparison sections + FAQ
   ========================================================================== */
.btn-strong{background:var(--strong); color:#fff; border:1px solid var(--strong)}
.btn-strong:hover{background:#0f6443; color:#fff}

.lifetime-card{background:var(--surface); border:1px solid var(--hair); border-radius:20px; box-shadow:var(--shadow); padding:38px 34px; max-width:520px}
.lifetime-card .strike{font-family:var(--display); font-weight:500; font-size:1.6rem; color:var(--muted); text-decoration:line-through; margin-right:10px; vertical-align:super}
.lifetime-card .bigprice{font-family:var(--display); font-weight:700; font-size:4rem; letter-spacing:-.03em}
.lifetime-card .onetime{font-family:var(--mono); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--strong); margin-top:2px}
.lifetime-card .feat-list li{font-size:1rem; padding:8px 0}

.ladder{background:var(--paper); border:1px dashed var(--hair-strong); border-radius:14px; padding:18px 20px; margin-top:26px}
.ladder-tag{display:inline-block; font-family:var(--mono); font-size:.7rem; letter-spacing:.05em; background:var(--strong-soft); color:var(--strong); padding:4px 9px; border-radius:7px; margin-bottom:16px}
.ladder-track{position:relative; height:5px; background:var(--hair); border-radius:999px; margin:8px 6px 12px}
.ladder-fill{position:absolute; left:0; top:0; height:100%; background:var(--strong); border-radius:999px}
.ladder-node{position:absolute; top:50%; width:11px; height:11px; border-radius:50%; background:#fff; border:2px solid var(--hair-strong); transform:translate(-50%,-50%)}
.ladder-node.active{border-color:var(--strong); background:var(--strong)}
.ladder-labels{display:flex; justify-content:space-between; font-family:var(--display); font-weight:600; font-size:.95rem; color:var(--muted)}
.ladder-labels .now{color:var(--ink)}
.ladder-note{font-family:var(--mono); font-size:.78rem; color:var(--strong); margin-top:12px; display:flex; align-items:center}

/* before/after + worth-it comparison */
.cmp-col{padding:6px 0}
.cmp-head{font-family:var(--mono); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700; display:flex; align-items:center; gap:9px; margin-bottom:18px}
.cmp-head .pip{width:9px; height:9px; border-radius:50%; display:inline-block}
.cmp-bad .cmp-head{color:#C0392B}
.cmp-good .cmp-head{color:var(--strong)}
.cmp-item{display:flex; gap:12px; padding:9px 0; color:var(--muted); font-size:1.02rem}
.cmp-item svg{flex:none; margin-top:4px}
.cmp-bad .cmp-item svg{color:#C0392B}
.cmp-good .cmp-item svg{color:var(--strong)}
.cmp-divider{border-left:1px solid var(--hair)}
@media(max-width:768px){.cmp-divider{border-left:none; border-top:1px solid var(--hair); margin-top:18px; padding-top:18px}}
.section-kicker{font-family:var(--mono); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); text-align:center}
.section-title{text-align:center; font-weight:500; font-size:clamp(28px,4vw,46px); margin:12px 0 10px}
.section-sub{text-align:center; color:var(--muted); font-size:1.12rem; margin:0 auto 8px; max-width:46ch}

/* timeline (your first day) */
.tl-row{display:flex; gap:22px; padding:30px 0; border-top:1px solid var(--hair)}
.tl-num{flex:none; width:44px; height:44px; border-radius:50%; background:var(--strong); color:#fff; font-family:var(--display); font-weight:700; display:flex; align-items:center; justify-content:center}
.tl-body{max-width:60ch}
.tl-title{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:8px}
.tl-title h3{font-size:1.25rem; font-weight:600; margin:0}
.tl-badge{font-family:var(--mono); font-size:.72rem; background:var(--strong-soft); color:var(--strong); padding:3px 9px; border-radius:6px}
.tl-body p{color:var(--muted); margin:0 0 8px}
.tl-out{color:var(--strong); font-weight:600; font-size:.98rem}

/* faq accordion */
.faq-acc{max-width:780px; margin:0 auto}
.faq-q{width:100%; text-align:left; background:none; border:none; border-bottom:1px solid var(--hair); padding:22px 4px; font-family:var(--display); font-weight:600; font-size:1.12rem; color:var(--ink); display:flex; justify-content:space-between; align-items:center; cursor:pointer}
.faq-q .pm{color:var(--muted); font-weight:400; font-size:1.5rem; transition:transform .2s}
.faq-q[aria-expanded="true"] .pm{transform:rotate(45deg)}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease; color:var(--muted)}
.faq-a div{padding:4px 4px 22px}

/* final cta band */
.cta-band{background:linear-gradient(180deg, var(--strong-soft), var(--paper)); border-top:1px solid var(--hair); text-align:center}

/* ==========================================================================
   App shell (logged-in) + rich idea detail
   ========================================================================== */
.app-shell{display:flex; min-height:100vh}
.app-side{width:236px; flex:none; border-right:1px solid var(--hair); background:#fff; padding:18px 14px; position:sticky; top:0; height:100vh; overflow-y:auto}
.app-side .brand{display:flex; align-items:center; gap:10px; font-family:var(--display); font-weight:700; font-size:.98rem; padding:6px 8px 18px}
.app-side .grp{font-family:var(--mono); font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); padding:14px 10px 6px}
.app-side a.nav-i{display:flex; align-items:center; gap:11px; padding:9px 10px; border-radius:9px; color:var(--ink); font-family:var(--display); font-weight:500; font-size:.92rem}
.app-side a.nav-i:hover{background:var(--paper)}
.app-side a.nav-i.active{background:var(--brand-soft); color:var(--brand)}
.app-side a.nav-i svg{flex:none; opacity:.8}
.app-side .side-foot{border-top:1px solid var(--hair); margin-top:14px; padding:12px 8px 4px; font-family:var(--mono); font-size:.72rem; color:var(--muted)}
.app-main{flex:1; min-width:0}
.app-topbar{border-bottom:1px solid var(--hair); background:rgba(251,250,247,.86); backdrop-filter:blur(8px); padding:14px 28px; position:sticky; top:0; z-index:10; display:flex; align-items:center; gap:10px; font-family:var(--mono); font-size:.82rem; color:var(--muted)}
.app-body{padding:30px 28px 60px}
@media(max-width:880px){
  .app-side{position:fixed;top:0;left:0;height:100%;width:264px;z-index:1050;transform:translateX(-100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:4px 0 28px rgba(20,24,40,.18);overflow-y:auto}
  .app-side.open{transform:translateX(0)}
  .app-body{padding:20px 16px 50px}
  .app-topbar{padding:12px 16px;gap:6px}
}
@media(min-width:881px){.app-hamburger{display:none!important}.app-sidebar-backdrop{display:none!important}.app-side-top{display:none!important}}
@media(max-width:880px){.app-side>.brand{display:none}}

/* category pill */
.cat-pill{display:inline-block; font-family:var(--mono); font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--brand); background:var(--brand-soft); padding:5px 11px; border-radius:7px}

/* metric cards row */
.metrics{display:grid; grid-template-columns:repeat(5,1fr); gap:0; border:1px solid var(--hair); border-radius:14px; overflow:hidden; background:#fff}
.metrics .m{padding:16px 18px; border-right:1px solid var(--hair)}
.metrics .m:last-child{border-right:none}
.metrics .m .k{font-family:var(--mono); font-size:.64rem; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); margin-bottom:6px}
.metrics .m .v{font-family:var(--display); font-weight:700; font-size:1.4rem; line-height:1.1}
@media(max-width:760px){.metrics{grid-template-columns:repeat(2,1fr)}.metrics .m:nth-child(2n){border-right:none}.metrics .m{border-bottom:1px solid var(--hair)}}

/* gauges (right rail) */
.gauge-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.gauge{border:1px solid var(--hair); border-radius:13px; padding:12px 10px 10px; text-align:center; background:#fff}
.gauge svg{width:96px; height:56px; display:block; margin:0 auto}
.gauge .gv{font-family:var(--display); font-weight:700; font-size:1.5rem}
.gauge .gl{font-family:var(--display); font-weight:600; font-size:.82rem; margin-top:2px}
.gauge .gs{font-family:var(--mono); font-size:.64rem; color:var(--muted)}
.rail-card{border:1px solid var(--hair); border-radius:14px; padding:18px; background:#fff; margin-bottom:16px}
.rail-meta{display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px solid var(--hair); font-size:.86rem}
.rail-meta:last-child{border-bottom:none}
.rail-meta .rk{font-family:var(--mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted)}
.toc a{display:block; padding:6px 0; color:var(--muted); font-size:.88rem; font-family:var(--display)}
.toc a:hover{color:var(--brand)}
.toc .tn{font-family:var(--mono); font-size:.72rem; margin-right:8px; color:var(--hair-strong)}

/* section anchors */
.idsec{padding-top:34px; margin-top:6px}
.idsec h2{font-size:1.4rem; font-weight:500; margin:0 0 4px}
.idsec .sec-no{font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--hair-strong); float:right; margin-top:8px}

/* revenue model box */
.rev-box{border:1px solid var(--hair); border-radius:14px; overflow:hidden}
.rev-head{background:var(--strong-soft); padding:20px 22px; display:flex; align-items:baseline; gap:14px; flex-wrap:wrap}
.rev-head .rr{font-family:var(--display); font-weight:700; font-size:1.8rem; color:var(--strong)}
.rev-head .rl{font-family:var(--mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--strong)}
.rev-body{padding:18px 22px}
.rev-body .row-kv{display:flex; justify-content:space-between; padding:6px 0; font-size:.9rem; border-bottom:1px dashed var(--hair)}
.rev-assume{list-style:none; padding:0; margin:14px 0 0}
.rev-assume li{display:flex; gap:9px; padding:5px 0; font-size:.86rem; color:var(--muted)}
.rev-assume li::before{content:"›"; color:var(--brand); font-weight:700}
.rev-disclaimer{font-family:var(--mono); font-size:.72rem; color:var(--muted); background:var(--paper); padding:10px 14px; border-radius:9px; margin-top:14px}

/* score breakdown bars */
.sb-row{display:grid; grid-template-columns:130px 1fr 36px; align-items:center; gap:14px; padding:9px 0}
.sb-row .sb-k{font-family:var(--display); font-weight:600; font-size:.92rem}
.sb-track{height:8px; background:var(--hair); border-radius:999px; overflow:hidden}
.sb-fill{height:100%; border-radius:999px}
.sb-v{font-family:var(--display); font-weight:700; text-align:right}

/* build path */
.bp-step{display:flex; gap:16px; padding:16px 0; border-bottom:1px solid var(--hair)}
.bp-step:last-child{border-bottom:none}
.bp-num{flex:none; width:30px; height:30px; border-radius:50%; background:var(--brand-soft); color:var(--brand); font-family:var(--display); font-weight:700; font-size:.85rem; display:flex; align-items:center; justify-content:center}
.bp-step p{margin:0; color:var(--ink); font-size:.96rem; line-height:1.55}

/* stats strip */
.stats-strip{background:var(--ink);padding:22px 0}
.stats-row{display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap;gap:20px 10px}
.stat-item{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.stat-n{font-family:var(--display);font-weight:700;font-size:2rem;color:#fff;line-height:1}
.stat-l{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.45)}

/* demo gauge bars */
.demo-gauges{display:flex;flex-direction:column;gap:8px;margin:14px 0 4px}
.dg-bar{height:5px;background:var(--hair);border-radius:999px;overflow:hidden;margin-bottom:3px}
.dg-fill{height:100%;border-radius:999px}
.dg-label{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.72rem;color:var(--muted)}

/* bonus tool cards */
.bonus-card{display:flex;gap:14px;padding:16px;border:1px solid var(--hair);border-radius:14px;background:var(--paper);height:100%}
.bc-ico{flex:none;width:36px;height:36px;border-radius:9px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;color:var(--brand)}
.bonus-card h4{font-family:var(--display);font-size:1rem;font-weight:600;margin:0 0 4px}
.bonus-card p{color:var(--muted);font-size:.9rem;margin:0;line-height:1.5}

/* mid-page cta band */
.mid-cta-band{background:var(--ink);padding:76px 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}

/* industry filter chips */
.ind-filters{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px}
.ind-chip{font-family:var(--display); font-weight:500; font-size:.85rem; color:var(--ink); border:1px solid var(--hair-strong); border-radius:999px; padding:6px 13px; display:inline-flex; gap:7px; align-items:center}
.ind-chip:hover{border-color:var(--brand); color:var(--brand)}
.ind-chip.active{background:var(--ink); color:#fff; border-color:var(--ink)}
.ind-chip .c{font-family:var(--mono); font-size:.72rem; opacity:.7}

/* ==========================================================================
   Mobile sidebar drawer controls
   ========================================================================== */
.app-hamburger{background:none;border:none;padding:6px;border-radius:8px;cursor:pointer;color:var(--ink);display:flex;align-items:center;justify-content:center;flex:none}
.app-hamburger:hover{background:var(--paper)}
.app-sidebar-backdrop{position:fixed;inset:0;background:rgba(22,24,29,.42);z-index:1049;opacity:0;pointer-events:none;transition:opacity .25s;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.app-sidebar-backdrop.open{opacity:1;pointer-events:auto}
.app-side-top{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 14px;border-bottom:1px solid var(--hair);margin-bottom:6px}
.app-side-close{background:none;border:none;padding:6px;border-radius:8px;cursor:pointer;color:var(--muted);display:flex;align-items:center;justify-content:center}
.app-side-close:hover{background:var(--paper);color:var(--ink)}

/* ==========================================================================
   Responsive overrides
   ========================================================================== */

/* --- Public marketing pages --- */
@media(max-width:768px){
  .section{padding:52px 0}
  .hero,.hero-v2{padding:64px 0 46px}
  .mid-cta-band{padding:56px 0}
  .stats-strip{padding:18px 0}
  .stat-n{font-size:1.65rem}
  .pain-grid{gap:10px}
  .testi-card{padding:20px}
  .proof-item{font-size:.8rem;padding:5px 14px}
}

@media(max-width:520px){
  /* Stack the hero search form vertically */
  .hero-form{flex-direction:column}
  .hero-form button{width:100%}
  /* Demo stats: allow wrapping on very small screens */
  .demo-stats{flex-wrap:wrap;gap:12px 20px}
  .demo-stats > div{min-width:80px}
}

/* --- Ideas list / brow grid --- */
/* On narrow screens collapse the last two columns (momentum, volume) */
@media(max-width:580px){
  .brow{grid-template-columns:28px 1fr 58px;gap:8px}
  .brow .bmom,.brow .bvol{display:none}
}

/* --- Detail page metrics strip --- */
/* Already 2-col at 760px; go 1-col on very small, allow scroll on medium */
@media(max-width:480px){
  .metrics{grid-template-columns:1fr 1fr}
  .metrics .m:nth-child(odd){border-right:1px solid var(--hair)}
  .metrics .m:nth-child(even){border-right:none}
}

/* --- Score breakdown label width --- */
@media(max-width:420px){
  .sb-row{grid-template-columns:100px 1fr 30px;gap:8px}
  .sb-row .sb-k{font-size:.82rem}
}

/* --- Gauge grid 1-col on small screens --- */
@media(max-width:420px){
  .gauge-grid{grid-template-columns:1fr 1fr}
}

/* --- Timeline (first day) tighter on mobile --- */
@media(max-width:520px){
  .tl-row{gap:14px;padding:22px 0}
  .tl-num{width:36px;height:36px;font-size:.9rem;flex:none}
}

/* ==========================================================================
   Hero v2
   ========================================================================== */
.hero-v2{padding:96px 0 72px}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--brand-soft);border:1px solid rgba(43,68,199,.18);border-radius:999px;padding:5px 14px 5px 10px;font-family:var(--mono);font-size:.74rem;color:var(--brand);margin-bottom:20px}
.hb-dot{width:7px;height:7px;border-radius:50%;background:var(--strong);flex:none;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.hero-v2 h1{font-weight:700;font-size:clamp(34px,5.2vw,60px);line-height:1.04;margin:0 0 18px;max-width:18ch;letter-spacing:-.025em}

/* ==========================================================================
   Social proof bar
   ========================================================================== */
.proof-bar{background:#fff;border-bottom:1px solid var(--hair);padding:12px 0}
.proof-row{display:flex;align-items:stretch;justify-content:center;gap:0;flex-wrap:wrap}
.proof-item{font-family:var(--display);font-size:.88rem;color:var(--muted);padding:8px 28px;text-align:center;display:flex;align-items:center;gap:6px}
.proof-item strong{color:var(--ink)}
.proof-divider{width:1px;background:var(--hair);flex:none;align-self:stretch;margin:4px 0}
.proof-stars{font-family:var(--mono);font-size:.82rem;color:#F59E0B;padding:8px 28px;display:flex;align-items:center;gap:6px}
.proof-stars span{color:var(--muted)}
@media(max-width:700px){.proof-divider{display:none}.proof-item,.proof-stars{padding:6px 16px;font-size:.82rem}}

/* ==========================================================================
   Pain section cards
   ========================================================================== */
.pain-grid{display:flex;flex-direction:column;gap:12px}
.pain-card{display:flex;gap:18px;padding:22px 24px;border-radius:16px;align-items:flex-start}
.pain-card.bad{background:#FEF2F2;border:1px solid #FCA5A5}
.pain-card.good{background:var(--strong-soft);border:1px solid #6EE7B7}
.pain-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;font-size:.95rem;font-weight:700;margin-top:2px}
.pain-card.bad .pain-icon{background:#FEE2E2;color:#DC2626}
.pain-card.good .pain-icon{background:#D1FAE5;color:var(--strong)}
.pain-card h4{font-family:var(--display);font-weight:700;font-size:1rem;margin:0 0 6px;color:var(--ink)}
.pain-card p{color:var(--muted);font-size:.9rem;margin:0;line-height:1.55}

/* ==========================================================================
   Pricing early section
   ========================================================================== */
.pricing-early{background:var(--paper);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.pricing-reassurance{display:flex;flex-direction:column;gap:8px;margin-top:22px}
.pr-item{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:.95rem;color:var(--ink)}
.pr-item .ck{color:var(--strong);font-weight:700;font-size:1rem;flex:none}

/* ==========================================================================
   Testimonials
   ========================================================================== */
.testi-card{background:#fff;border:1px solid var(--hair);border-radius:18px;padding:28px;height:100%;display:flex;flex-direction:column;gap:16px;box-shadow:0 1px 3px rgba(20,24,40,.06);transition:box-shadow .2s,transform .2s}
.testi-card:hover{box-shadow:0 8px 28px -8px rgba(43,68,199,.18);transform:translateY(-2px)}
.testi-card.featured-testi{background:var(--brand);border-color:var(--brand);box-shadow:0 12px 40px -10px rgba(43,68,199,.45)}
.testi-card.featured-testi:hover{box-shadow:0 16px 48px -10px rgba(43,68,199,.55);transform:translateY(-3px)}
.testi-card.featured-testi .testi-quote{color:rgba(255,255,255,.92);font-style:normal;font-weight:500}
.testi-card.featured-testi .testi-name{color:#fff}
.testi-card.featured-testi .testi-role{color:rgba(255,255,255,.6)}
.testi-card.featured-testi .testi-stars{color:#FDE68A}
.testi-card.featured-testi .testi-avatar{background:rgba(255,255,255,.2);color:#fff}
.testi-stars{color:#F59E0B;font-size:.95rem;letter-spacing:3px;line-height:1}
.testi-quote{color:#374151;font-size:.98rem;line-height:1.68;margin:0;flex:1}
.testi-author{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:4px}
.testi-avatar{width:36px;height:36px;border-radius:50%;background:var(--brand-soft);color:var(--brand);font-family:var(--display);font-weight:700;font-size:.88rem;display:flex;align-items:center;justify-content:center;flex:none}
.testi-name{font-family:var(--display);font-weight:600;font-size:.88rem;color:var(--ink)}
.testi-role{font-family:var(--mono);font-size:.7rem;color:var(--muted)}

/* ==========================================================================
   Bonus cards v2 (4-col grid version)
   ========================================================================== */
.bonus-card-v2{display:flex;flex-direction:column;gap:10px;padding:20px;border:1px solid var(--hair);border-radius:14px;background:#fff;height:100%;transition:box-shadow .15s}
.bonus-card-v2:hover{box-shadow:var(--shadow-sm)}
.bonus-card-v2 .bc-ico{width:36px;height:36px;border-radius:9px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;color:var(--brand)}
.bonus-card-v2 h4{font-family:var(--display);font-size:.95rem;font-weight:600;margin:0 0 4px}
.bonus-card-v2 p{color:var(--muted);font-size:.87rem;margin:0;line-height:1.5}

/* ==========================================================================
   Trending brow header
   ========================================================================== */
.brow-head{display:grid;grid-template-columns:30px 1fr 70px 84px 76px;gap:14px;padding:8px 0;font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--hair)}
@media(max-width:580px){.brow-head{display:none}}

/* ==========================================================================
   Blog preview cards (home page)
   ========================================================================== */
.home-blog-card{display:flex;flex-direction:column;gap:0;padding:0;border:1px solid var(--hair);border-radius:16px;background:#fff;height:100%;overflow:hidden;transition:box-shadow .2s,transform .2s}
.home-blog-card:hover{box-shadow:0 8px 28px -8px rgba(20,24,40,.14);transform:translateY(-2px)}
.hbc-cat{padding:20px 22px 0}
.hbc-title{font-family:var(--display);font-weight:600;font-size:1.06rem;line-height:1.3;color:var(--ink);margin:8px 0 0;padding:0 22px}
.hbc-desc{color:var(--muted);font-size:.9rem;line-height:1.58;flex:1;margin:8px 0 0;padding:0 22px}
.hbc-meta{font-family:var(--mono);font-size:.72rem;color:var(--muted);display:flex;align-items:center;gap:7px;padding:14px 22px 20px;margin-top:auto;border-top:1px solid var(--hair);margin-top:16px}

/* ==========================================================================
   Source badge grid (home page)
   ========================================================================== */
.sources-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px;text-align:left}
@media(max-width:900px){.sources-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.sources-grid{grid-template-columns:repeat(2,1fr)}}
.source-badge{display:flex;flex-direction:column;gap:3px;border:1px solid var(--hair);border-radius:12px;padding:12px 14px;background:#fff;position:relative}
.source-badge.live{border-color:var(--hair-strong)}
.source-badge.soon{opacity:.55}
.sbdot{position:absolute;top:12px;right:12px;width:7px;height:7px;border-radius:50%;background:var(--hair-strong)}
.source-badge.live .sbdot{background:var(--strong)}
.sb-name{font-family:var(--display);font-weight:600;font-size:.92rem;color:var(--ink)}
.sb-type{font-family:var(--mono);font-size:.67rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}

/* ==========================================================================
   Blog — shared tag + gradient text
   ========================================================================== */
.blog-tag{display:inline-block;font-family:var(--mono);font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);background:var(--brand-soft);padding:3px 10px;border-radius:6px}
.txt-grad{background:linear-gradient(120deg,var(--brand),var(--strong));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* ==========================================================================
   Blog hero
   ========================================================================== */
.blog-hero{background:var(--ink);padding:72px 0 56px;text-align:center}
.blog-hero-title{font-family:var(--display);font-weight:700;font-size:clamp(36px,5.5vw,68px);color:#fff;line-height:1.04;margin:8px 0 12px;letter-spacing:-.03em}
.blog-hero-sub{color:rgba(255,255,255,.6);font-size:1.1rem;max-width:48ch;margin:0 auto}
.blog-hero .eyebrow{color:rgba(255,255,255,.45)}

/* ==========================================================================
   Blog wrap + category chips
   ========================================================================== */
.blog-wrap{padding:48px 0 80px}
.blog-cats{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:36px}
.blog-cat-chip{font-family:var(--display);font-weight:500;font-size:.85rem;color:var(--muted);border:1px solid var(--hair-strong);border-radius:999px;padding:6px 14px;transition:all .15s}
.blog-cat-chip:hover{color:var(--brand);border-color:var(--brand)}
.blog-cat-chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ==========================================================================
   Featured post (magazine card)
   ========================================================================== */
.blog-featured{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--hair);border-radius:20px;overflow:hidden;margin-bottom:40px;background:#fff;transition:box-shadow .18s,transform .18s}
.blog-featured:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.bf-img{aspect-ratio:16/10;overflow:hidden;background:var(--brand-soft);position:relative}
.bf-img img{width:100%;height:100%;object-fit:cover}
.bf-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand-soft),var(--strong-soft))}
.bf-cat{font-family:var(--mono);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);background:#fff;border-radius:8px;padding:6px 12px}
.bf-body{padding:36px 40px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.bf-title{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.2vw,28px);line-height:1.15;color:var(--ink);margin:6px 0 8px}
.bf-desc{color:var(--muted);font-size:1rem;line-height:1.6;margin:0}
.bf-meta{font-family:var(--mono);font-size:.76rem;color:var(--muted);display:flex;gap:8px;align-items:center}
@media(max-width:720px){.blog-featured{grid-template-columns:1fr}.bf-img{aspect-ratio:16/7}.bf-body{padding:22px 20px}}

/* ==========================================================================
   Article grid (responsive masonry-inspired)
   ========================================================================== */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:48px}
.blog-card{border:1px solid var(--hair);border-radius:16px;overflow:hidden;background:#fff;transition:box-shadow .18s,transform .18s;display:flex;flex-direction:column}
.blog-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.bc-img{aspect-ratio:16/9;overflow:hidden;background:var(--paper);flex:none}
.bc-img img{width:100%;height:100%;object-fit:cover}
.bc-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand-soft) 0%,#F0F4FF 100%)}
.bc-icon{width:52px;height:52px;border-radius:14px;background:rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;color:var(--brand)}
.bc-body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:7px;flex:1}
.bc-title{font-family:var(--display);font-weight:600;font-size:1.02rem;line-height:1.3;color:var(--ink);margin:4px 0 6px}
.bc-desc{color:var(--muted);font-size:.9rem;line-height:1.55;flex:1;margin:0}
.bc-meta{font-family:var(--mono);font-size:.72rem;color:var(--muted);display:flex;gap:7px;margin-top:auto;padding-top:8px}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.blog-grid{grid-template-columns:1fr}}

/* ==========================================================================
   Blog pagination + CTA strip
   ========================================================================== */
.blog-pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin:10px 0 48px}
.blog-page-info{font-family:var(--mono);font-size:.82rem;color:var(--muted)}
.blog-empty{text-align:center;padding:60px 0;color:var(--muted)}
.blog-cta-strip{display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--ink);border-radius:20px;padding:30px 36px;margin-top:16px;flex-wrap:wrap}
.bcs-body h3{font-family:var(--display);font-weight:600;font-size:1.3rem;color:#fff;margin:0 0 6px}
.bcs-body p{color:rgba(255,255,255,.6);font-size:.95rem;margin:0}
@media(max-width:640px){.blog-cta-strip{flex-direction:column;text-align:center;padding:24px 22px}}

/* ==========================================================================
   Article reading experience
   ========================================================================== */
.read-progress-bar{position:fixed;top:0;left:0;height:3px;background:var(--brand);border-radius:0 2px 2px 0;z-index:100;transition:width .1s linear;width:0}
.article-wrap{padding:48px 0 80px}
.article-crumb{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.76rem;color:var(--muted);margin-bottom:10px}
.article-crumb a{color:var(--muted)}
.article-crumb a:hover{color:var(--brand)}
.article-title{font-family:var(--display);font-weight:700;font-size:clamp(26px,4vw,46px);line-height:1.08;letter-spacing:-.02em;color:var(--ink);margin:10px 0 14px}
.article-lead{color:var(--muted);font-size:1.15rem;line-height:1.6;max-width:64ch;margin:0 0 20px}
.article-byline{display:flex;align-items:center;gap:12px;padding:16px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin-bottom:32px;flex-wrap:wrap}
.article-avatar{width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;font-family:var(--display);font-weight:700;font-size:1rem;display:flex;align-items:center;justify-content:center;flex:none}
.article-author{font-family:var(--display);font-weight:600;font-size:.9rem;color:var(--ink)}
.article-meta-line{font-family:var(--mono);font-size:.75rem;color:var(--muted)}
.article-share{margin-left:auto}
.share-btn{display:flex;align-items:center;gap:6px;background:none;border:1px solid var(--hair-strong);border-radius:9px;padding:6px 12px;font-family:var(--display);font-weight:500;font-size:.83rem;color:var(--muted);cursor:pointer;transition:all .15s}
.share-btn:hover{border-color:var(--brand);color:var(--brand)}
.article-hero-img{border-radius:16px;overflow:hidden;margin-bottom:32px}
.article-hero-img img{width:100%;height:auto;display:block}

/* Article body typography */
.article-body{font-family:var(--body);font-size:1.06rem;line-height:1.78;color:var(--ink)}
.article-body h2{font-family:var(--display);font-weight:600;font-size:1.5rem;margin:2.2em 0 .7em;letter-spacing:-.015em;color:var(--ink)}
.article-body h3{font-family:var(--display);font-weight:600;font-size:1.2rem;margin:1.8em 0 .5em;color:var(--ink)}
.article-body p{margin:0 0 1.2em}
.article-body ul,.article-body ol{margin:0 0 1.2em 1.4em;padding:0}
.article-body li{margin-bottom:.45em}
.article-body strong{font-weight:700;color:var(--ink)}
.article-body a{color:var(--brand);text-decoration:underline;text-decoration-color:var(--brand-soft);text-underline-offset:3px}
.article-body a:hover{text-decoration-color:var(--brand)}
.article-body blockquote{border-left:3px solid var(--brand);margin:1.5em 0;padding:.8em 1.2em;background:var(--brand-soft);border-radius:0 10px 10px 0;color:var(--ink)}
.article-body blockquote p{margin:0;font-style:italic}
.article-body .faq-item{border:1px solid var(--hair);border-radius:12px;padding:18px 20px;margin:1.2em 0}
.article-body .faq-item h3{font-size:1.05rem;margin:0 0 8px;color:var(--brand)}
.article-body .faq-item p{margin:0;color:var(--muted)}
.article-body .callout{background:var(--strong-soft);border-left:3px solid var(--strong);border-radius:0 10px 10px 0;padding:14px 18px;margin:1.4em 0}
.article-body .callout p{margin:0;color:var(--ink)}

/* Tags + validate CTA */
.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin:32px 0}
.article-tag{font-family:var(--mono);font-size:.72rem;border:1px solid var(--hair-strong);border-radius:999px;padding:5px 12px;color:var(--muted);transition:all .15s}
.article-tag:hover{border-color:var(--brand);color:var(--brand)}
.article-validate-cta{background:var(--ink);border-radius:16px;padding:28px 30px;margin:32px 0;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.avc-body h3{font-family:var(--display);font-weight:600;font-size:1.15rem;color:#fff;margin:0 0 4px}
.avc-body p{color:rgba(255,255,255,.6);font-size:.9rem;margin:0}
.avc-form{display:flex;gap:8px;flex:1;min-width:260px}
.avc-form input{flex:1;font-family:var(--display);font-size:.92rem;padding:.6rem .9rem;border:1.5px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(255,255,255,.08);color:#fff;outline:none}
.avc-form input::placeholder{color:rgba(255,255,255,.4)}
.avc-form input:focus{border-color:var(--brand);background:rgba(255,255,255,.12)}

/* Related articles */
.article-related{margin-top:40px;padding-top:32px;border-top:1px solid var(--hair)}
.ar-title{font-family:var(--display);font-weight:600;font-size:1.15rem;margin:0 0 18px}
.ar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ar-card{border:1px solid var(--hair);border-radius:12px;padding:16px;background:#fff;transition:box-shadow .15s,transform .15s;display:block}
.ar-card:hover{box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.ar-card h4{font-family:var(--display);font-size:.95rem;font-weight:600;margin:6px 0 4px;line-height:1.3;color:var(--ink)}
.ar-meta{font-family:var(--mono);font-size:.7rem;color:var(--muted)}
@media(max-width:640px){.ar-grid{grid-template-columns:1fr}}

/* Article rail (ToC) */
.article-rail{position:sticky;top:84px}
.toc-link{display:block;padding:5px 0;color:var(--muted);font-size:.88rem;font-family:var(--display);border-bottom:1px solid transparent;transition:color .12s}
.toc-link:hover{color:var(--brand)}

/* ==========================================================================
   Blog admin rows
   ========================================================================== */
.admin-post-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;border-bottom:1px solid var(--hair);flex-wrap:wrap}
.admin-post-row:last-child{border-bottom:none}
.apr-main{display:flex;align-items:center;gap:14px;flex:1;min-width:0}
.apr-status{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:6px;flex:none}
.apr-status.published{background:var(--strong-soft);color:var(--strong)}
.apr-status.draft{background:var(--weak-soft);color:var(--weak)}
.apr-title{font-family:var(--display);font-weight:600;font-size:.96rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.apr-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:3px}
.apr-actions{display:flex;align-items:center;gap:6px;flex:none}

/* ==========================================================================
   Trust: testimonial outcome tag + verified badge
   ========================================================================== */
.testi-outcome{font-family:var(--mono);font-size:.71rem;color:var(--strong);background:var(--strong-soft);padding:4px 10px;border-radius:7px;display:inline-block;margin-bottom:12px}
.testi-verified{font-family:var(--mono);font-size:.68rem;color:var(--muted);display:flex;align-items:center;gap:4px}
.testi-verified svg{color:var(--strong)}

/* ==========================================================================
   Trust: live proof cards
   ========================================================================== */
.proof-live-section{background:var(--paper);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.proof-card{display:flex;flex-direction:column;gap:14px;padding:22px;border:1.5px solid var(--hair);border-radius:16px;background:#fff;height:100%;transition:border-color .15s,box-shadow .2s,transform .18s}
.proof-card:hover{border-color:var(--brand);box-shadow:0 8px 28px -8px rgba(43,68,199,.18);transform:translateY(-2px);cursor:pointer}
.pc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.pc-kw{font-family:var(--display);font-weight:600;font-size:.98rem;color:var(--ink);line-height:1.3}
.pc-stats{display:flex;gap:20px;padding:14px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.pc-n{font-family:var(--display);font-weight:700;font-size:1.35rem;color:var(--ink);line-height:1}
.pc-denom{font-size:.65em;font-weight:500;opacity:.5}
.pc-l{font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:4px}
.pc-cta{font-family:var(--display);font-weight:600;font-size:.87rem;color:var(--brand);margin-top:auto}

/* ==========================================================================
   Trust: guarantee section
   ========================================================================== */
.guarantee-section{background:#fff;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.guarantee-shield{position:relative;display:inline-flex;align-items:center;justify-content:center;width:150px;height:150px;margin:0 auto}
.gs-content{position:absolute;display:flex;flex-direction:column;align-items:center;gap:0;margin-top:-8px}
.gs-days{font-family:var(--display);font-weight:700;font-size:2.6rem;color:var(--strong);line-height:1}
.gs-label{font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;color:var(--strong);text-align:center;line-height:1.3}

/* ==========================================================================
   Conversion: sticky buy bar
   ========================================================================== */
.sticky-buy{position:fixed;bottom:0;left:0;right:0;background:var(--ink);border-top:1px solid rgba(255,255,255,.1);padding:14px 20px;z-index:200;display:flex;align-items:center;justify-content:center;gap:18px;transform:translateY(110%);transition:transform .35s cubic-bezier(.4,0,.2,1)}
.sticky-buy.show{transform:translateY(0)}
.sticky-buy-text{display:flex;flex-direction:column;gap:2px;text-align:right}
.sticky-buy-text strong{color:#fff;font-family:var(--display);font-weight:600;font-size:.95rem}
.sticky-buy-text span{color:rgba(255,255,255,.55);font-family:var(--mono);font-size:.72rem}
.sticky-buy-dismiss{background:none;border:none;color:rgba(255,255,255,.3);cursor:pointer;font-size:1.5rem;padding:4px 8px;line-height:1;margin-left:8px;transition:color .15s;flex:none}
.sticky-buy-dismiss:hover{color:rgba(255,255,255,.65)}
@media(max-width:560px){.sticky-buy{flex-direction:column;gap:10px;padding:14px 40px 14px 16px;text-align:center}.sticky-buy-text{text-align:center}.sticky-buy-dismiss{position:absolute;top:10px;right:12px;margin:0}}

/* ==========================================================================
   Conversion: hero direct-buy row + btn-sm
   ========================================================================== */
.hero-direct-buy{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap}
.hdb-label{font-family:var(--mono);font-size:.75rem;color:var(--muted);flex:none}
.btn-sm{padding:.5rem 1rem;font-size:.87rem}

/* ==========================================================================
   Conversion: guarantee note under pricing card
   ========================================================================== */
.guarantee-note{font-family:var(--mono);font-size:.78rem;color:var(--muted);text-align:center;margin:10px auto 0;max-width:320px;line-height:1.5}
