/* Campaign theme: sections alternate bordeaux, white and black (data-tone). Active with <html data-theme="bordeaux">. */
html[data-theme=bordeaux]{--bg:#4f0f15;--fg:#F4F1EA;--on-fg:#2a070b;--card:rgba(244,241,234,.045);--panel:rgba(0,0,0,.18);--vis:#5c121b;--accent:#ef7d6f;
  --ivory:#4f0f15;--paper:#3b0a10;--text:#F4F1EA;--graphite:#d7c6c0;--mute:#b39d97;--line:rgba(244,241,234,.16);--ink:#F4F1EA;--red:#E04A3C}
html[data-theme=bordeaux] [data-tone=bx]{--bg:#4f0f15;--fg:#F4F1EA;--on-fg:#2a070b;--card:rgba(244,241,234,.045);--panel:rgba(0,0,0,.18);--vis:#5c121b;--accent:#ef7d6f;
  --ivory:#4f0f15;--text:#F4F1EA;--graphite:#dcc9c3;--mute:#b9a29c;--line:rgba(244,241,234,.16);--ink:#F4F1EA;--red:#E04A3C}
html[data-theme=bordeaux] [data-tone=black]{--bg:#0E0E0E;--fg:#F4F1EA;--on-fg:#0E0E0E;--card:rgba(244,241,234,.05);--panel:rgba(244,241,234,.04);--vis:#1c1a19;--accent:#E04A3C;
  --ivory:#0E0E0E;--text:#F4F1EA;--graphite:#c4bdb3;--mute:#948d84;--line:rgba(244,241,234,.15);--ink:#F4F1EA;--red:#E04A3C}
html[data-theme=bordeaux] [data-tone=white]{--bg:#F7F4EE;--fg:#0E0E0E;--on-fg:#F7F4EE;--card:#fff;--panel:#fff;--vis:#ECE6DC;--accent:#C8372D;
  --ivory:#F7F4EE;--text:#1d1a17;--graphite:#58534C;--mute:#7d766d;--line:rgba(14,14,14,.13);--ink:#0E0E0E;--red:#C8372D}
html[data-theme=bordeaux] body{background:#4f0f15;color:#F4F1EA}
html[data-theme=bordeaux] [data-tone]{background:var(--bg);color:var(--text)}
html[data-theme=bordeaux] [data-tone] .lede,html[data-theme=bordeaux] [data-tone] .eyebrow{color:var(--graphite)}
html[data-theme=bordeaux] .eyebrow:before,html[data-theme=bordeaux] .seal{background:var(--red)}
/* header: always the black bar */
html[data-theme=bordeaux] .hdr,html[data-theme=bordeaux] .hdr.solid{background:#0E0E0E;color:#F4F1EA;box-shadow:0 1px 0 rgba(244,241,234,.08)}
html[data-theme=bordeaux] .cart-btn:hover{background:#F4F1EA;color:#0E0E0E;border-color:#F4F1EA}
/* buttons follow the section tone */
html[data-theme=bordeaux] .btn-ink,html[data-theme=bordeaux] .btn-ivory{background:var(--fg);color:var(--on-fg)}
html[data-theme=bordeaux] .btn-ink:hover,html[data-theme=bordeaux] .btn-ivory:hover{opacity:.88}
html[data-theme=bordeaux] .btn-line{border-color:color-mix(in srgb,var(--fg) 45%,transparent);color:var(--fg)}
html[data-theme=bordeaux] .btn-line:hover{border-color:var(--fg)}
html[data-theme=bordeaux] .link{color:var(--fg)}
/* 3D hero stage */
html[data-theme=bordeaux] .hero{background:radial-gradient(90% 70% at 68% 42%,#7a1a25 0%,#57111a 42%,#3b0a10 100%)}
html[data-theme=bordeaux] .loader{background:#4f0f15}
/* cards */
html[data-theme=bordeaux] .card{background:var(--card);box-shadow:0 1px 0 rgba(0,0,0,.04)}
html[data-theme=bordeaux] .card:hover{box-shadow:0 40px 80px -40px rgba(0,0,0,.45)}
html[data-theme=bordeaux] .card .vis{background:#5c121b}
html[data-theme=bordeaux] .card li:before{background:var(--red)}
/* flipbook */
html[data-theme=bordeaux] .flip-ui button{border-color:var(--line);color:var(--fg)}
html[data-theme=bordeaux] .flip-ui button:hover{background:var(--fg);color:var(--on-fg)}
html[data-theme=bordeaux] .flip-dots i{background:var(--line)}
html[data-theme=bordeaux] .flip-dots i.on{background:var(--fg)}
/* quiz */
html[data-theme=bordeaux] .qpanel{background:var(--panel);box-shadow:inset 0 0 0 1px var(--line)}
html[data-theme=bordeaux] .qprog i:after{background:var(--fg)}
html[data-theme=bordeaux] .qopt:before{border-color:color-mix(in srgb,var(--fg) 45%,transparent)}
html[data-theme=bordeaux] .qopt.sel{background:var(--fg);color:var(--on-fg);border-color:var(--fg)}
html[data-theme=bordeaux] .qres .beliefs span{background:var(--card)}
html[data-theme=bordeaux] .qres .bar i b{background:var(--fg)}
html[data-theme=bordeaux] .qres .bar.top i b{background:var(--red)}
html[data-theme=bordeaux] .qnum,html[data-theme=bordeaux] .qres .part,html[data-theme=bordeaux] .mod .r,html[data-theme=bordeaux] .anatomy .n,html[data-theme=bordeaux] .feat .n,html[data-theme=bordeaux] .part .r,html[data-theme=bordeaux] .reader .ch-t .k,html[data-theme=bordeaux] .reader .orn,html[data-theme=bordeaux] .flow .n{color:var(--accent)}
/* faq, product pages */
html[data-theme=bordeaux] .qa .pm:before,html[data-theme=bordeaux] .qa .pm:after{background:var(--fg)}
html[data-theme=bordeaux] .modules{background:var(--line);border-color:var(--line)}
html[data-theme=bordeaux] .mod{background:var(--bg)}
html[data-theme=bordeaux] .mod:hover{background:var(--card)}
html[data-theme=bordeaux] .gallery .main,html[data-theme=bordeaux] .gallery .thumbs button,html[data-theme=bordeaux] .pagegrid button{background:var(--vis)}
html[data-theme=bordeaux] .gallery .thumbs button.on{border-color:var(--fg)}
html[data-theme=bordeaux] .variants button{border-color:var(--line)}
html[data-theme=bordeaux] .variants button.on{background:var(--fg);color:var(--on-fg);border-color:var(--fg)}
html[data-theme=bordeaux] .plan{border-color:var(--line)}
html[data-theme=bordeaux] .plan.on{background:var(--card);border-color:var(--fg)}
html[data-theme=bordeaux] .reader .fade:after{background:linear-gradient(transparent,var(--bg))}
html[data-theme=bordeaux] .principles{background:var(--line);border-color:var(--line)}
html[data-theme=bordeaux] .principles div{background:var(--bg)}
html[data-theme=bordeaux] .opt{border-color:var(--line)}
html[data-theme=bordeaux] .opt.on{border-color:var(--fg);background:var(--card)}
html[data-theme=bordeaux] .sum{border-color:var(--line)}
html[data-theme=bordeaux] .foot{background:#0E0E0E}
/* cart drawer: white, like a boutique bag */
html[data-theme=bordeaux] .drawer{--fg:#0E0E0E;--on-fg:#F7F4EE;--line:rgba(14,14,14,.13);--graphite:#58534C;--mute:#7d766d;--red:#C8372D;background:#F7F4EE;color:#1d1a17}
html[data-theme=bordeaux] .drawer .df{background:#fff}
html[data-theme=bordeaux] .upsell{background:#EFEAE1}
html[data-theme=bordeaux] .toast{background:#0E0E0E;color:#F4F1EA}

/* editorial cleanup: no boxed cards, cells or pills — type and hairlines only */
html[data-theme=bordeaux] .card,html[data-theme=bordeaux] .card:hover{background:none;box-shadow:none;transform:none!important}
html[data-theme=bordeaux] .card .body{padding:26px 0 0}
html[data-theme=bordeaux] .card .foot{border-top:0;padding-top:6px}
html[data-theme=bordeaux] .card ul{gap:6px}
html[data-theme=bordeaux] .card li{display:block}
html[data-theme=bordeaux] .card li:before{display:none}
html[data-theme=bordeaux] .card .tagn{display:none}
html[data-theme=bordeaux] .qpanel{background:none;box-shadow:none;padding:0;min-height:0}
html[data-theme=bordeaux] .qopt{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:18px 0;grid-template-columns:22px 1fr}
html[data-theme=bordeaux] .qopt:hover{transform:none;padding-left:8px}
html[data-theme=bordeaux] .qopt.sel{background:none;color:var(--fg);border-color:var(--fg)}
html[data-theme=bordeaux] .qres .beliefs span{background:none;border:0;padding:0;font:italic 19px var(--serif)}
html[data-theme=bordeaux] .qres .beliefs{gap:6px 20px}
html[data-theme=bordeaux] .opt{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:22px 0}
html[data-theme=bordeaux] .opt.on{background:none;border-color:var(--line)}
html[data-theme=bordeaux] .sum{border:0;border-top:1px solid var(--line);border-radius:0;padding:28px 0 0}
html[data-theme=bordeaux] .modules{background:none;border:0;gap:0 48px}
html[data-theme=bordeaux] .mod,html[data-theme=bordeaux] .mod:hover{background:none;padding:30px 0 34px;border-top:1px solid var(--line);min-height:0}
html[data-theme=bordeaux] .principles{background:none;border:0;gap:0 48px}
html[data-theme=bordeaux] .principles div{background:none;padding:28px 0;border-top:1px solid var(--line)}
html[data-theme=bordeaux] .plan{border:0;border-top:1px solid var(--line);border-radius:0;padding:24px 0}
html[data-theme=bordeaux] .plan.on{background:none;box-shadow:none;border-top:2px solid var(--fg)}
html[data-theme=bordeaux] .plan .badge{position:static;display:inline-block;margin-left:10px;background:none;color:var(--accent);padding:0;font:italic 16px var(--serif)}
html[data-theme=bordeaux] .gallery .main{background:none}
html[data-theme=bordeaux] .variants button{border-radius:0;border:0;border-bottom:1px solid var(--line);padding:10px 2px;margin-right:18px}
html[data-theme=bordeaux] .variants button.on{background:none;color:var(--fg);border-bottom:2px solid var(--fg)}
/* app coming soon */
.soon{margin:30px 0 10px;padding-top:26px;border-top:1px solid var(--line)}
.soon-t{font:italic 400 30px/1.2 var(--serif);margin-bottom:10px}
.soon p{color:var(--graphite);margin-bottom:20px;max-width:30em}
.soon .news input{border-color:var(--line);color:var(--fg)}
.soon .news button{background:var(--fg);color:var(--on-fg)}

/* pains block */
.pains{padding:clamp(100px,13vw,180px) 0}
.pains-h{max-width:15em;margin-bottom:clamp(50px,6vw,80px)}
.pain-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(30px,5vw,90px);margin-bottom:clamp(60px,7vw,100px)}
.pain-list li{display:grid;grid-template-columns:54px 1fr;align-items:baseline;padding:26px 0;border-top:1px solid var(--line);font:400 clamp(21px,1.9vw,27px)/1.3 var(--serif)}
.pain-list .pn{font:italic 17px var(--serif);color:var(--accent)}
.pain-turn{font:italic 400 clamp(26px,2.6vw,38px)/1.3 var(--serif);max-width:22em;margin-bottom:clamp(50px,6vw,80px)}
.pain-prods{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,48px)}
.pain-prods a{display:block;border-top:2px solid var(--fg);padding-top:20px;transition:opacity .3s}
.pain-prods a:hover{opacity:.75}
.pain-prods b{display:block;font:400 26px var(--serif);margin-bottom:8px}
.pain-prods span{color:var(--graphite);font-size:17px}
.card .benefit{font:italic 400 20px/1.4 var(--serif);color:var(--graphite);margin:10px 0 22px}
@media (max-width:900px){.pain-list,.pain-prods{grid-template-columns:1fr}.pain-list li{grid-template-columns:40px 1fr;padding:20px 0}}

/* "for you if / what changes" blocks on product pages */
.fit{padding:clamp(90px,11vw,150px) 0}
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,120px)}
.fit .h-m{margin-bottom:34px}
.pain-list.one{grid-template-columns:1fr;margin:0}
.gain-list{list-style:none}
.gain-list li{padding:24px 0 24px 34px;border-top:1px solid var(--line);font:400 clamp(19px,1.6vw,23px)/1.4 var(--serif);position:relative}
.gain-list li:before{content:"";position:absolute;left:0;top:34px;width:16px;height:1px;background:var(--accent)}
@media (max-width:900px){.fit-grid{grid-template-columns:1fr}}

/* funnel: pains CTA, about, offer */
.pains .btn{margin-top:4px}
.about{padding:clamp(100px,12vw,170px) 0}
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,7vw,120px);align-items:start}
.about-photo{position:sticky;top:110px}
@media (max-width:900px){.about-photo{position:static}}
.about-photo{margin:0;aspect-ratio:3/4;overflow:hidden}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 72%}
.about-txt .h-l{margin:18px 0 30px}
.about-txt p{font-size:clamp(17px,1.35vw,19px);line-height:1.7;color:var(--graphite);margin-bottom:1.1em;max-width:34em}
.sign{margin-top:30px;font:italic 400 34px var(--serif);color:var(--text)}
.sign span{display:block;font:400 14px var(--sans);font-style:normal;color:var(--mute);margin-top:4px}
.offer{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,6vw,100px);align-items:end}
.offer-box{border-top:1px solid var(--line);padding-top:18px}
.offer-box .row{display:flex;justify-content:space-between;padding:10px 0;color:var(--graphite)}
.offer-box .row.save{color:var(--accent)}
.offer-box .tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);margin-top:10px;padding:18px 0 24px}
.offer-box .tot b{font:400 46px var(--serif)}
.offer-box .btn{width:100%}
.offer-box .hint{margin-top:14px;font-size:14px;color:var(--mute);text-align:center}
@media (max-width:900px){.about-grid,.offer{grid-template-columns:1fr}.about-photo{max-width:420px}}
.endcta{padding:clamp(70px,9vw,120px) 0}
.endcta-in{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.endcta .h-m{max-width:16em}

/* journal-only site: header pre-order button, pre-order form */
.pre-btn{display:inline-flex;align-items:center;height:44px;padding:0 20px;border-radius:999px;background:#F4F1EA;color:#2a070b;font-weight:600;font-size:14.5px;white-space:nowrap;transition:opacity .3s}
.pre-btn:hover{opacity:.85}
@media (max-width:900px){.pre-btn{height:38px;padding:0 14px;font-size:13.5px}}
.pre-photo{margin:0;aspect-ratio:4/5;overflow:hidden}
.pre-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
#preorder .offer{align-items:center}
.pre-form{display:grid;gap:14px;max-width:460px}
.pre-form .hp{position:absolute;left:-9999px}
.pre-price{display:flex;justify-content:space-between;align-items:baseline;margin-top:10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin-bottom:6px;color:var(--graphite)}
.pre-price b{font:400 34px var(--serif);color:var(--text)}
.pf{display:grid;gap:6px;font-size:14px;color:var(--mute)}
.pf input,.pf select{height:50px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--text);padding:0 14px;font:inherit;font-size:16px}
.pf select option{color:#000}
.pf input:focus,.pf select:focus{outline:none;border-color:var(--fg)}
.pf-row{display:grid;grid-template-columns:1fr 120px;gap:12px}
.pre-form .btn{width:100%;margin-top:8px}
.pre-form .hint{font-size:14px;color:var(--mute);text-align:center}
.pre-done{max-width:460px;border-top:1px solid var(--line);padding-top:22px}
.pre-done b{display:block;font:italic 400 28px/1.25 var(--serif);margin-bottom:10px}
.pre-done span{color:var(--graphite)}

/* mobile: compact language picker (current language, the rest in a small dropdown) */
@media (max-width:900px){
  .hdr .logo{flex:none}
  .langs{position:relative;margin:0}
  .langs a{display:none}
  .langs a.on{display:inline-block;text-decoration:none;opacity:1;padding:8px 6px}
  .langs a.on:after{content:" ▾";font-size:10px}
  .langs.open{background:#0E0E0E;border:1px solid rgba(244,241,234,.2);border-radius:10px;position:absolute;right:calc(var(--pad) + 120px);top:10px;z-index:5;display:flex;flex-direction:column;padding:4px}
  .langs.open a{display:block;padding:8px 12px}
  .langs.open a.on:after{content:""}
}
@media (max-width:900px){
  .hdr .logo b{letter-spacing:.4em;margin-right:-.4em}
  .hdr-r{gap:6px}
  .pre-btn{font-size:12.5px;padding:0 12px;height:36px}
  .langs a.on{padding:8px 4px}
  .langs.open{right:auto;left:auto;top:40px}
}

/* 3D story progress: vertical scale with three marks (desktop), horizontal under the header (mobile) */
.hero-prog{position:absolute;right:clamp(20px,3vw,48px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:14px;opacity:0;transition:opacity .6s;pointer-events:none;z-index:3}
.hero-prog.show{opacity:1}
.hp-track{position:relative;width:1px;height:220px;background:rgba(244,241,234,.22)}
.hp-fill{position:absolute;inset:0;background:#F4F1EA;transform-origin:top;transform:scaleY(0)}
.hp-track b{position:absolute;left:50%;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:#4f0f15;border:1px solid rgba(244,241,234,.45);transition:all .4s}
.hp-track b:nth-of-type(1){top:-4px}.hp-track b:nth-of-type(2){top:calc(50% - 4px)}.hp-track b:nth-of-type(3){bottom:-4px}
.hp-track b.on{background:#F4F1EA;border-color:#F4F1EA}
.hp-n{font:italic 15px var(--serif);color:rgba(244,241,234,.7);white-space:nowrap}
.hp-n em{font-style:italic;color:#F4F1EA}
@media (max-width:900px){
  .hero-prog{top:calc(var(--hh,100px) + 14px);right:var(--pad);left:var(--pad);transform:none;flex-direction:row;gap:12px}
  .hp-track{width:auto;flex:1;height:1px}
  .hp-fill{transform-origin:left;transform:scaleX(0)}
  .hp-track b{top:-4px!important;bottom:auto!important;margin-left:0}
  .hp-track b:nth-of-type(1){left:0}.hp-track b:nth-of-type(2){left:calc(50% - 4px)}.hp-track b:nth-of-type(3){left:auto;right:0}
}

/* about on the homepage: "read more" + (phone) heading over the photo */
.about-more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease)}
.about-more.open{grid-template-rows:1fr}
.about-more>div{overflow:hidden}
.about-toggle{margin-top:6px;cursor:pointer;color:var(--text);justify-self:start;width:max-content}
.about-toggle .t-less{display:none}
.about-toggle.open .t-more{display:none}
.about-toggle.open .t-less{display:inline}
.about-toggle .ar{display:inline-block;transition:transform .4s var(--ease)}
.about-toggle.open .ar{transform:rotate(180deg)}
.about-head .h-l{margin:18px 0 30px}
@media (max-width:900px){
  .about:not(.about-page) .about-grid{display:grid;grid-template-columns:1fr;gap:0}
  .about:not(.about-page) .about-txt{display:contents}
  .about:not(.about-page) .about-photo{grid-area:1/1;max-width:none;position:relative;top:0}
  .about:not(.about-page) .about-photo:after{content:"";position:absolute;inset:45% 0 0 0;background:linear-gradient(transparent,rgba(10,6,6,.82))}
  .about:not(.about-page) .about-head{grid-area:1/1;align-self:end;position:relative;z-index:2;padding:0 20px 22px}
  .about:not(.about-page) .about-head .eyebrow{color:#e9ddd6}
  .about:not(.about-page) .about-head .h-l{color:#F4F1EA;margin:10px 0 0}
  .about:not(.about-page) .about-txt>p:first-of-type{margin-top:28px}
}
@media (max-width:900px){
  .about:not(.about-page) .about-photo,.about:not(.about-page) .about-head{grid-row:1;grid-column:1}
  .about:not(.about-page) .about-txt>p:first-of-type{grid-row:2}
  .about:not(.about-page) .about-more{grid-row:3}
  .about:not(.about-page) .about-toggle{grid-row:4}
  .about:not(.about-page) .sign{grid-row:5}
}
/* phone: heading sits higher on the photo, at the spot she chose from her screenshot */
@media (max-width:900px){
  .about:not(.about-page) .about-head{padding-bottom:70px}
  .about:not(.about-page) .about-txt>p:first-of-type{margin-top:28px}
}