/* ===== Editorial dark theme: fora-pattern structure, TWWB brand, godly accents ===== */
:root{
  --canvas:#1C2620; --panel:#151D18; --panel2:#121A15; --cream:#F7F4EB;
  --dim:#B7C0B2; --line-d:rgba(247,244,235,.16); --beige2:#D8C7A2;
}
html{background:var(--canvas)}
body{background:var(--canvas);color:var(--cream)}
h1,h2,h3,h4{color:var(--cream)!important;font-weight:400}
h2{letter-spacing:-.01em}
p{color:var(--dim)}
.eyebrow{display:inline-flex;align-items:center;gap:14px;background:none;border:none;border-radius:0;padding:0;font-size:11.5px;letter-spacing:.24em;color:var(--beige2);text-transform:uppercase;font-weight:600}
.eyebrow::before{content:"";width:28px;height:1px;background:rgba(196,178,146,.45)}
.hero-center .eyebrow::after,.manifesto .eyebrow::after{content:"";width:28px;height:1px;background:rgba(196,178,146,.45)}
.kitchen .eyebrow,.market .eyebrow{color:var(--beige2)}
.btn-primary{background:var(--cream);color:#101613}
.btn-primary:hover{background:#fff}
.btn-ghost{color:var(--cream);border-color:rgba(241,238,230,.35)}
.btn-ghost:hover{background:rgba(241,238,230,.08)}
:focus-visible{outline:2px solid var(--beige2)}

/* nav */
nav{background:rgba(28,38,32,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-d)}
.nav-links a{color:var(--dim)}
.nav-links a:hover{background:rgba(241,238,230,.07);color:var(--cream)}
.search-pill{background:rgba(241,238,230,.05);border-color:rgba(241,238,230,.2);box-shadow:none}
.search-pill:hover{box-shadow:0 0 0 1px rgba(241,238,230,.25)}
.sp-seg{color:var(--cream)} .sp-muted{color:var(--dim)} .sp-div{background:rgba(241,238,230,.15)}
.sp-btn{background:var(--beige2)} .sp-btn svg{stroke:#101613}
.cart-btn{background:transparent;border-color:rgba(241,238,230,.25);color:var(--cream)}
.cart-btn .cart-count{background:var(--beige2);color:#101613}

/* category bar */
.catbar{background:rgba(28,38,32,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-d)}
.catbar .chip,.cat-all{color:var(--dim)}
.catbar .chip:hover,.cat-all:hover{color:var(--cream);border-bottom-color:rgba(241,238,230,.3)}
.cat-all.active{color:var(--cream);border-bottom-color:var(--beige2)}

/* hero: centered editorial, media panel below */
.hero{background:transparent;padding:0;position:relative;overflow:hidden;min-height:100vh;min-height:100svh;display:grid;align-content:center;justify-items:center}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(255,252,244,.18) 0%,rgba(255,252,244,0) 34%,rgba(28,38,32,.42) 80%,#1C2620 100%);pointer-events:none}
.hero>.art-layer{z-index:0}
.hero-center{position:relative;z-index:2;text-align:center;max-width:860px;display:flex;flex-direction:column;align-items:center;gap:22px;padding-top:40px;padding-bottom:40px}
.hero .hero-center h1{color:#20301F!important;text-shadow:0 1px 18px rgba(255,252,240,.55)}
.hero .eyebrow{color:#4A5A3C}
.hero .eyebrow::before,.hero-center .eyebrow::after{background:rgba(74,90,60,.55)}
.hero-sub{color:#3E4A3C;text-shadow:0 1px 10px rgba(255,252,240,.6)}
.hero .btn-primary{background:#20301F;color:#F7F4EB}
.hero .btn-primary:hover{background:#2E4A38}
.hero-center h1{font-size:clamp(40px,5.6vw,64px);line-height:1.06;font-weight:300;letter-spacing:-.02em;margin:0;color:var(--cream)}
.hero-sub{font-size:17px;max-width:36em;line-height:1.6;margin:0}
.hero-center .btn{padding:15px 32px;font-size:15px}
.hero-media{border-radius:26px;overflow:hidden;border:1px solid var(--line-d);position:relative;min-height:420px}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,22,19,.25),transparent 40%,rgba(16,22,19,.55));pointer-events:none}

/* marquee ribbon (godly) */
.marquee{overflow:hidden;padding:56px 0 8px;border:none}
.marquee-track{display:flex;white-space:nowrap;animation:mq 38s linear infinite;will-change:transform}
.marquee-track span{font-size:clamp(44px,6.5vw,84px);font-weight:600;letter-spacing:.01em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.75);padding-right:24px}
@keyframes mq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* manifesto: scroll-brightening editorial (fora) */
.manifesto{max-width:820px;padding-top:64px;padding-bottom:8px;display:flex;flex-direction:column;gap:26px;align-items:flex-start}
.manifesto p{font-size:clamp(21px,2.6vw,29px);line-height:1.42;color:var(--cream);opacity:.25;margin:0;font-weight:400}

/* sections on dark */
.quiz,.standard,.market,.roles,.resources,.kitchen,.notin{background:transparent;color:var(--cream)}
.quiz h2,.standard h2,.market h2,.notin h2{color:var(--cream)}
.quiz p.sub,.standard p.sub{color:var(--dim)}
.market p{color:var(--dim)}
.section-head .note,.layers-sub,.goals-sub{color:var(--dim)}
.layer,.role,.res,.book,.pathcard,.prod,.planrow,.entry,.step,.mcol,.market-card,.qbox,.gfaq,.item,.label-pill{background:var(--panel);border:1px solid var(--line-d);color:var(--cream);box-shadow:none}
.layer h3,.role h3,.res h3,.step h3,.mcol h3,.market-card h3,.entry h3,.pathcard h3,.planrow h3,.path h3{color:var(--cream)}
.layer p,.role p,.res p,.step p,.card .inside,.entry p,.pathcard p,.planrow p{color:var(--dim)}
.step-n{color:var(--beige2)}
.authority-card{background:var(--panel2);border:1px solid var(--line-d)}
.std{border-top-color:rgba(241,238,230,.2)}
.std h3{color:var(--beige2)} .std p{color:var(--dim)}
.mrow{border-bottom-color:var(--line-d);color:var(--cream)}
.mrow span{color:var(--cream)}
.tag{background:rgba(241,238,230,.08);color:var(--dim)}
.ltag{background:rgba(196,178,146,.14);color:var(--beige2)}
.lchip{background:transparent;border-color:rgba(241,238,230,.22);color:var(--dim)}
.lchip:hover{background:rgba(241,238,230,.07);border-color:rgba(241,238,230,.35);color:var(--cream)}
.lchip.active{background:var(--cream);border-color:var(--cream);color:#101613}
.chip{background:transparent;border-color:rgba(241,238,230,.25);color:var(--cream)}
.goals-panel{background:var(--panel);box-shadow:none}
.grid .card{background:transparent}
.card .expert-name{color:var(--cream)} .card .rate{color:var(--cream)}
.card .price{color:var(--cream)} .price small{color:var(--dim)}
.card-cta{color:var(--cream);border-bottom-color:var(--beige2)}
.card .avatar{background:var(--panel);color:var(--beige2)}
.card-media{background:var(--panel)}
.cm-heart.liked svg{fill:var(--beige2)}
.section-head h2,.goals-title,.filter-title{color:var(--cream)}
.qbox{color:var(--cream)}
.qstep h3,.qresult .rname{color:var(--cream)}
.qopt{background:transparent;border-color:rgba(241,238,230,.25);color:var(--cream)}
.qopt:hover{border-color:var(--beige2);background:rgba(196,178,146,.1)}
.qopt.sel{background:var(--cream);border-color:var(--cream);color:#101613;font-weight:600}
.qprog{color:var(--beige2)}
.qresult p{color:var(--dim)}
.join-form input{background:rgba(241,238,230,.06);border-color:rgba(241,238,230,.25);color:var(--cream)}
.join-form input::placeholder{color:var(--dim)}
.join-status{color:var(--beige2)}
.trust-row span{color:var(--dim)}
.hero-ctas .btn-ghost{border-color:rgba(241,238,230,.3)}

/* detail + commerce */
.crumb,.crumb a{color:var(--dim)}
.phead h1,.phead .promise{color:var(--cream)}
.phead .promise{color:var(--dim)}
.stat b{color:var(--cream)} .stat span{color:var(--dim)}
.buybox{background:var(--panel);border-color:var(--line-d);box-shadow:none;color:var(--cream)}
.buybox .price{color:var(--cream)} .buybox .price small{color:var(--dim)}
.buybox li{border-bottom-color:var(--line-d);color:var(--cream)}
.buybox .fine{color:var(--dim)}
.buy-toggle label{border-color:rgba(241,238,230,.2);color:var(--cream)}
.buy-toggle label.sel{border-color:var(--cream);background:rgba(241,238,230,.07)}
.buy-toggle .bt-price{color:var(--dim)}
.bt-sub-note{color:var(--dim)}
.expert{background:var(--panel2)}
.expert h3{color:var(--cream)} .expert p{color:var(--dim)}
.item{background:var(--panel)}
.item-head:hover{background:rgba(241,238,230,.04)}
.item-name{color:var(--cream)} .item-dose{color:var(--dim)}
.item-body{border-top-color:var(--line-d)}
.why p{color:var(--dim)} .why h4{color:var(--beige2)}
.cat-label{color:var(--cream)}
.legend{color:var(--dim)}
.section-title,.section-sub{color:var(--cream)}
.section-sub{color:var(--dim)}
.rel-row{border-bottom-color:var(--line-d)} .rel-row .t{color:var(--cream)} .rel-row .d{color:var(--dim)}
.rev-card{background:var(--panel);color:var(--cream)}
.rev-card .mrow{border-bottom-color:var(--line-d)}
.review p{color:var(--dim)}
.ghero,.hub-head{background:var(--panel2)}
.ghero h1,.hub-head h1{color:var(--cream)}
.ghero p,.hub-head p{color:var(--dim)}
.gsec h2{color:var(--cream)}
.gfaq summary{color:var(--cream)} .gfaq p{color:var(--dim)}
.back{color:var(--beige2)}
.stickybar{background:#141C17;color:var(--cream);border-top:1px solid var(--line-d)}
.sb-inner b{color:var(--cream)}
#cart-drawer{background:#1E2822;color:var(--cream)}
#cart-drawer .cd-head{border-bottom-color:var(--line-d)}
#cart-drawer .cd-head h3,#cart-drawer .cd-close{color:var(--cream)}
.cd-line{border-bottom-color:var(--line-d)} .cd-line .n,.cd-line .p{color:var(--cream)} .cd-line .m{color:var(--dim)}
.cd-qty button{background:transparent;border-color:rgba(241,238,230,.3);color:var(--cream)}
.cd-qty span{color:var(--cream)}
#cart-drawer .cd-foot{background:#1E2822;border-top-color:var(--line-d)}
.cd-ship{background:rgba(196,178,146,.12);color:var(--beige2)}
.cd-sub{color:var(--cream)}
.cd-checkout{background:var(--cream);color:#101613}
.cd-checkout:hover{background:#fff}
.cd-note{color:var(--dim)} .cd-note a{color:var(--beige2)}
#cart-drawer .cd-empty{color:var(--dim)}
.drawer-scrim{background:rgba(0,0,0,.55)}
.prod-add{border-color:rgba(241,238,230,.3);color:var(--cream)}
.prod-add:hover,.prod-add.added{background:var(--cream);color:#101613}
.prod:hover{background:var(--panel2);border-color:rgba(241,238,230,.2)}
.prod .b{background:rgba(241,238,230,.08);color:var(--beige2)}
.pfoot,.prod .pfoot{border-top-color:var(--line-d)}
.grade{color:#101613}
.g-strong{background:var(--cream)} .g-mod{background:#8CA07A} .g-emerg{background:var(--beige2)}
.dropdown{background:var(--panel);border-color:var(--line-d)}
.dropdown a{color:var(--cream)}
.dropdown a:hover{background:rgba(241,238,230,.07);color:var(--cream)}

/* mega wordmark + footer (godly) */
.mega-word{font-size:clamp(44px,9vw,140px);font-weight:600;letter-spacing:-.02em;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.6);text-align:center;padding-top:70px;white-space:nowrap;overflow:hidden}
footer{background:#141C17;color:var(--dim);border-top:1px solid var(--line-d)}
footer h4{color:var(--cream)}
footer a{color:var(--dim)} footer a:hover{color:var(--cream)}
footer .legal{color:var(--dim);border-top-color:var(--line-d)}
.foot-trust{color:var(--dim);border-bottom-color:var(--line-d)}
.proto-note{background:#141C17;color:var(--beige2)}

/* splash + helix on dark */
#twwb-intro{background:var(--canvas)}
#twwb-intro .ti-eyebrow{color:var(--beige2)}
.helix{mix-blend-mode:screen;opacity:.5}
@media(max-width:900px){
  .helix{opacity:.3}
  .tabbar{background:rgba(28,38,32,.96);border-top-color:var(--line-d)}
  .tabbar a,.tabbar button{color:var(--dim)}
  .tabbar .tb-on{color:var(--beige2)}
  .hero{padding:48px 0 12px}
  .hero-center{padding-bottom:36px}
  .hero-media{min-height:300px;border-radius:0;border-left:none;border-right:none}
  .manifesto{padding-top:40px}
}

/* ===== gradient imagery (no photos) ===== */
.hero-media{background:var(--panel2)}
.hero-media::after{background:linear-gradient(180deg,rgba(16,22,19,.35),transparent 45%,rgba(16,22,19,.12))}
.grad-market{position:relative;overflow:hidden;background:var(--panel2)}
.grad-market::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(28,38,32,.28),rgba(28,38,32,0) 50%);pointer-events:none}
.grad-market .shot{color:#22301F;text-shadow:0 1px 6px rgba(247,244,235,.5);z-index:2}
.grad-market .shot{opacity:.95}
/* golden-hour mood shift: quiz */
.quiz{background:linear-gradient(160deg,#EADDC4 0%,#E0D6B9 45%,#C9CDB2 100%)}
.quiz .eyebrow{color:#4A5A3C}
.quiz .eyebrow::before{background:rgba(74,90,60,.5)}
.quiz h2{color:#20301F!important}
.quiz p.sub{color:#57604C}
.qbox{background:rgba(255,255,255,.72);border-color:rgba(32,48,31,.14);box-shadow:0 18px 50px rgba(32,48,31,.16);color:#20301F}
.qstep h3{color:#20301F!important}
.qprog{color:#6B5B3E}
.qopt{background:rgba(255,255,255,.5);border-color:rgba(32,48,31,.25);color:#20301F}
.qopt:hover{border-color:#20301F;background:#fff}
.qopt.sel{background:#20301F;border-color:#20301F;color:#F1EEE6}
.qresult .rname{color:#20301F!important}
.qresult p{color:#4A5443}
.quiz .btn-primary{background:#20301F;color:#F1EEE6}
.quiz .btn-primary:hover{background:#2E4A38}
.quiz .btn-ghost{color:#20301F;border-color:rgba(32,48,31,.4)}
/* golden-hour mood shift: podcast feature card */
.pod-feature{background:linear-gradient(160deg,#EADDC4 0%,#DCD2B4 55%,#C9CDB2 100%);color:#20301F}
.pod-feature .kind{color:#6B5B3E}
.pod-feature h3{color:#20301F!important}
.pod-feature p{color:#4A5443}
.pod-feature .btn{background:#20301F;color:#F1EEE6}

/* foliage texture behind the experts section */
.roles{position:relative;overflow:hidden}
.roles::after{content:"";position:absolute;inset:0;z-index:1;background:rgba(20,28,23,.78);pointer-events:none}
.roles .wrap{position:relative;z-index:2}

/* parallax art layers */
.art-layer{position:absolute;inset:-90px 0;background-size:cover;background-position:center;will-change:transform;z-index:0;transform:translate3d(0,0,0)}
.hero-media .art-layer,.grad-market .art-layer{inset:-90px 0}
.hero-media{position:relative;overflow:hidden}
.hero-media::after{z-index:1}
