@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("fonts/inter.woff2") format("woff2")}
:root{
    --w:#fff; --ink:#231F20; --blk:#000; --grey:#F0F0F0; --grey2:#F8F8F8; --mut:#675E60; --line:#E6E4E2;
    --o:#EE7A0C; --od:#D46A05; --osoft:#FDF1E4;
    --sh:0 10px 40px rgba(0,0,0,.06);
    --r:17.6px; --r2:24.2px; --pill:999px;
    --f:"Inter","Helvetica Neue",system-ui,-apple-system,Arial,sans-serif;
    --max:1650px;
  }
*{box-sizing:border-box}
body{margin:0}
.page{background:var(--w);color:var(--ink);font-family:var(--f);font-size:15.4px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:var(--max);margin:0 auto;padding:0 61.6px}
@media(max-width:900px){.wrap{padding:0 22px}}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.14;text-wrap:balance}
p{margin:0}
.num{font-variant-numeric:tabular-nums}
section[id],div[id]{scroll-margin-top:84px}
.skip{position:absolute;left:-10998.9px;background:var(--blk);color:#fff;padding:13.2px 19.8px;z-index:200}
.skip:focus{left:8.8px;top:8.8px}
/* type scale — matched to reference */
  h1{font-size:clamp(2.53rem,4.6vw,4.048rem);letter-spacing:.02em}
h2{font-size:clamp(1.925rem,3.4vw,3.212rem);letter-spacing:.02em}
.h2s{font-size:clamp(1.54rem,2.4vw,2.068rem);letter-spacing:.015em}
h3{font-size:16.94px;font-weight:600}
.eyebrow{font-size:13.2px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);display:block}
.eyebrow.o{color:var(--o)}
.eyebrow.wt{color:rgba(255,255,255,.8)}
.capsm{font-size:13.2px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.lede{font-size:14.74px;color:var(--mut);max-width:70ch}
.body{color:var(--mut);max-width:74ch;font-size:14.74px}
.body p+p{margin-top:15.4px}
.body strong{color:var(--ink);font-weight:600}
.dark{background:var(--blk);color:#fff}
.dark h1,.dark h2,.dark h3{color:#fff}
.dark .lede,.dark .body{color:rgba(255,255,255,.7)}
.dark .body strong{color:#fff}
.o-txt{color:var(--o)}
.btn{display:inline-flex;align-items:center;gap:9.9px;font-size:13.2px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;padding:15.4px 28.6px;border-radius:var(--pill);border:1px solid transparent;cursor:pointer;transition:.2s}
.btn svg{width:14.3px;height:14.3px;transition:transform .2s}
.btn:hover svg{transform:translateX(3.3px)}
.btn-b{background:var(--blk);color:#fff;border-color:var(--blk)}
.btn-b:hover{background:var(--o);border-color:var(--o)}
.btn-o{background:var(--o);color:#fff;border-color:var(--o)}
.btn-o:hover{background:var(--od);border-color:var(--od)}
.btn-w{background:#fff;color:var(--ink);border-color:#fff}
.btn-w:hover{background:var(--o);color:#fff;border-color:var(--o)}
.btn-l{background:transparent;color:var(--ink);border-color:#D8D5D2}
.btn-l:hover{border-color:var(--ink)}
.btn-ld{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn-ld:hover{background:#fff;color:var(--ink)}
.btn-row{display:flex;gap:11px;flex-wrap:wrap}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--o);outline-offset:3px}
.ann{background:var(--blk);color:rgba(255,255,255,.8)}
.ann .wrap{display:flex;justify-content:center;align-items:center;gap:9.9px;height:39.6px;font-size:12.65px;letter-spacing:.04em}
.ann b{color:var(--o)}
header{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.92);backdrop-filter:blur(15.4px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:79.2px;gap:26.4px}
header .logo{height:25.3px}
.nav>ul{display:flex;gap:28.6px;list-style:none;margin:0;padding:0}
.nav>ul>li{position:relative}
.nav>ul>li>a{font-size:13.2px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--blk);transition:.2s}
.nav>ul>li>a:hover{color:var(--o)}
.sub{position:absolute;top:100%;left:-19.8px;min-width:297px;background:#fff;border-radius:var(--r);padding:13.2px 0;box-shadow:var(--sh);opacity:0;visibility:hidden;transform:translateY(8.8px);transition:.2s;list-style:none;margin:13.2px 0 0}
.nav .has:hover .sub,.nav .has:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:block;padding:9.9px 24.2px;font-size:14.3px;color:var(--mut);text-transform:none;letter-spacing:0;font-weight:400}
.sub a:hover{color:var(--od)}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:var(--pill);width:46.2px;height:41.8px;cursor:pointer;align-items:center;justify-content:center}
.burger span{display:block;width:16.5px;height:1.76px;background:var(--ink);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:16.5px;height:1.76px;background:var(--ink)}
.burger span::before{top:-5.5px}
.burger span::after{top:5.5px}
.mob{display:none;background:#fff;border-top:1px solid var(--line)}
.mob ul{list-style:none;margin:0;padding:11px 0}
.mob a{display:block;padding:13.2px 0;font-size:15.4px;border-bottom:1px solid var(--line)}
.mob.open{display:block}
@media(max-width:1120px){.nav{display:none}.burger{display:inline-flex}}
/* HERO */
  .hero{position:relative;height:84vh;min-height:594px;display:flex;align-items:center;overflow:hidden;background:var(--blk)}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.6) 48%,rgba(0,0,0,.18) 80%)}
.hero .wrap{position:relative;z-index:2;width:100%}
.hero-in{max-width:726px;color:#fff}
.hero h1{margin:22px 0 0;line-height:1.05}
.hero h1 .o{color:var(--o)}
.hero p{color:rgba(255,255,255,.76);font-size:14.96px;max-width:52ch;margin-top:22px}
.hero .btn-row{margin-top:33px}
@media (prefers-reduced-motion:reduce){.hero video{display:none}}
@media(max-width:820px){.hero{height:auto;min-height:0;padding:70.4px 0 63.8px}}
/* stat band */
  .sb{background:var(--grey)}
.sb .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding-top:41.8px;padding-bottom:41.8px}
.sb .v{font-size:clamp(1.65rem,2.8vw,2.42rem);font-weight:600;letter-spacing:.01em}
.sb .v span{color:var(--o)}
.sb .k{font-size:13.75px;color:var(--mut);margin-top:3.3px}
@media(max-width:820px){.sb .wrap{grid-template-columns:1fr 1fr;gap:26.4px}}
section{padding:83.6px 0}
@media(max-width:900px){section{padding:57.2px 0}}
.s-grey{background:var(--grey2)}
.s-g{background:var(--grey)}
.head{max-width:902px;margin-bottom:48.4px}
.head.c{text-align:center;margin-left:auto;margin-right:auto}
.head .eyebrow{margin-bottom:15.4px}
.head h2{margin-bottom:17.6px}
@media(max-width:900px){.head{margin-bottom:35.2px}}
.split{display:grid;grid-template-columns:1fr 1fr;gap:66px;align-items:center}
.split.top{align-items:start}
.split.a{grid-template-columns:1.1fr .9fr}
.split.b{grid-template-columns:.9fr 1.1fr}
@media(max-width:980px){.split,.split.a,.split.b{grid-template-columns:1fr;gap:37.4px}}
.card{background:var(--grey);border-radius:var(--r);padding:30.8px 28.6px}
.card.w{background:#fff;box-shadow:var(--sh)}
.card.b{background:var(--blk);color:#fff}
.card.o{background:var(--o);color:#fff}
.card h3{margin-bottom:9.9px}
.card p{font-size:14.52px;color:var(--mut);line-height:1.6}
.card.b p,.card.o p{color:rgba(255,255,255,.78)}
.card .kn{font-size:12.65px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--o);margin-bottom:13.2px;display:block}
.card.b .kn,.card.o .kn{color:rgba(255,255,255,.75)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:19.8px}
@media(max-width:1000px){.g4{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.g3{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.g2,.g3,.g4{grid-template-columns:1fr}}
.ph{border-radius:var(--r2);overflow:hidden;background:var(--grey)}
.ph img{width:100%}
.ph.t img{aspect-ratio:4/5;object-fit:cover}
/* INTERACTIVE CONNECTED STEPPER */
  .stepper{display:grid;grid-template-columns:repeat(5,1fr);margin:0 0 28.6px}
.snode{position:relative;background:none;border:0;padding:0 8.8px;cursor:pointer;font-family:inherit;color:inherit;text-align:center;display:block}
.snode .dot{width:59.4px;height:59.4px;border-radius:50%;background:#161616;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.65);
    display:flex;align-items:center;justify-content:center;font-size:17.6px;font-weight:600;margin:0 auto 15.4px;transition:.28s;position:relative;z-index:2}
.snode .st{font-size:11.55px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.4);display:block;margin-bottom:3.3px;transition:.25s}
.snode .lb{font-size:14.96px;font-weight:600;color:rgba(255,255,255,.62);display:block;transition:.25s;line-height:1.3}
/* connector line */
  .snode::after{content:"";position:absolute;top:29.7px;left:calc(50% + 36.3px);right:calc(-50% + 36.3px);height:1.1px;background:rgba(255,255,255,.2);z-index:1}
/* arrowhead */
  .snode::before{content:"";position:absolute;top:25.3px;right:calc(-50% + 34.1px);width:7.7px;height:7.7px;
    border-top:1.4px solid rgba(255,255,255,.35);border-right:1.4px solid rgba(255,255,255,.35);transform:rotate(45deg);z-index:2}
.snode:last-child::after,.snode:last-child::before{display:none}
.snode:hover .dot{border-color:var(--o);color:#fff}
.snode:hover .lb{color:#fff}
.snode[aria-selected="true"] .dot{background:var(--o);border-color:var(--o);color:#fff;box-shadow:0 0 0 6.6px rgba(238,122,12,.16)}
.snode[aria-selected="true"] .lb{color:#fff}
.snode[aria-selected="true"] .st{color:var(--o)}
.snode:focus-visible{outline:none}
.snode:focus-visible .dot{outline:2px solid var(--o);outline-offset:4px}
/* panel */
  .spanel{display:none}
.spanel.on{display:block}
.spanel .inr{background:#141414;border-radius:var(--r);border-left:3px solid var(--o);padding:39.6px 37.4px;animation:stepIn .4s cubic-bezier(.16,1,.3,1)}
@keyframes stepIn{from{opacity:0;transform:translateY(11px)}to{opacity:1;transform:none}}
.spanel .sk{font-size:12.1px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--o);display:block;margin-bottom:9.9px}
.spanel h3{font-size:25.3px;color:#fff;margin-bottom:12.1px}
.spanel p{font-size:15.4px;color:rgba(255,255,255,.72);line-height:1.72;max-width:84ch}
@media (prefers-reduced-motion:reduce){.spanel .inr{animation:none}}
@media(max-width:900px){
    .stepper{grid-template-columns:1fr;margin-bottom:24.2px}
    .snode{display:grid;grid-template-columns:59.4px 1fr;gap:19.8px;align-items:center;text-align:left;padding:9.9px 0}
    .snode .dot{margin:0}
    .snode::after{top:63.8px;left:29.7px;right:auto;width:1.1px;height:calc(100% - 55px)}
    .snode::before{display:none}
    .snode:last-child::after{display:none}
  }
/* comparison table */
  .tbl{width:100%;border-collapse:separate;border-spacing:0;border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh);font-size:14.74px}
.tbl th{background:var(--blk);color:#fff;text-align:left;padding:19.8px 24.2px;font-size:12.65px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.tbl td{padding:19.8px 24.2px;border-bottom:1px solid var(--line);color:var(--mut);vertical-align:top}
.tbl tr:last-child td{border-bottom:none}
.tbl td:first-child{color:var(--ink);font-weight:600}
.tbl .hi{background:var(--osoft)}
.tbl .hi td{color:var(--ink)}
.tblwrap{overflow-x:auto}
/* TABS (reference ingredient tabs) */
  .tabs{display:flex;flex-wrap:wrap;gap:9.9px;margin-bottom:35.2px}
.tab{background:transparent;border:1px solid var(--line);color:var(--ink);font-size:13.75px;font-weight:500;padding:11px 22px;border-radius:var(--pill);cursor:pointer;transition:.2s;font-family:inherit}
.tab:hover{border-color:var(--ink)}
.tab[aria-selected="true"]{background:var(--blk);color:#fff;border-color:var(--blk)}
.panel{display:none}
.panel.on{display:block}
.panel .inner{background:var(--grey);border-radius:var(--r);padding:41.8px 39.6px}
.panel h3{font-size:24.2px;margin-bottom:13.2px}
.panel p{color:var(--mut);font-size:14.96px;max-width:76ch}
@media(max-width:620px){.panel .inner{padding:28.6px 24.2px}}
/* rows */
  .rows{display:grid}
.row{display:grid;grid-template-columns:48.4px 1fr;gap:22px;padding:19.8px 0;border-bottom:1px solid var(--line);align-items:baseline}
.row:first-child{border-top:1px solid var(--line)}
.row .n{font-size:12.65px;font-weight:600;color:var(--o)}
.row .t{font-weight:600;font-size:15.95px}
.row .d{grid-column:2;color:var(--mut);font-size:14.52px;margin-top:5.5px}
.dark .row,.dark .row:first-child{border-color:rgba(255,255,255,.13)}
.dark .row .t{color:#fff}
.dark .row .d{color:rgba(255,255,255,.66)}
@media(max-width:620px){.row{grid-template-columns:35.2px 1fr;gap:13.2px}}
.pills{display:flex;flex-wrap:wrap;gap:9.9px}
.pills span{background:var(--grey);border-radius:var(--pill);padding:11px 19.8px;font-size:14.3px;font-weight:500}
.cl{list-style:none;margin:0;padding:0;display:grid;gap:12.1px}
.cl li{display:flex;gap:12.1px;align-items:flex-start;font-size:14.74px;color:var(--mut)}
.cl li i{flex:none;width:19.8px;height:19.8px;border-radius:50%;background:var(--o);display:inline-flex;align-items:center;justify-content:center;margin-top:1.1px}
.cl li i svg{width:9.9px;height:9.9px;color:#fff}
.card.b .cl li{color:rgba(255,255,255,.78)}
.card.b .cl li i{background:rgba(255,255,255,.2)}
/* timeline */
  .tl{display:grid;gap:15.4px}
.tlr{display:grid;grid-template-columns:209px 1fr;gap:30.8px;background:var(--grey);border-radius:var(--r);padding:26.4px 30.8px;align-items:start}
.tlr .w{font-weight:600;font-size:15.95px}
.tlr .w span{display:block;font-size:12.65px;color:var(--o);font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4.4px}
.tlr .c{color:var(--mut);font-size:14.74px}
.tlr .c strong{color:var(--ink);font-weight:600}
.tlr .mini{list-style:none;margin:12.1px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:7.7px}
.tlr .mini li{background:#fff;border-radius:var(--pill);padding:6.6px 14.3px;font-size:13.64px;color:var(--ink)}
@media(max-width:820px){.tlr{grid-template-columns:1fr;gap:11px;padding:22px}}
.faq{max-width:990px;margin:0 auto;display:grid;gap:11px}
details{background:var(--grey);border-radius:var(--r);overflow:hidden}
summary{cursor:pointer;list-style:none;padding:22px 26.4px;font-weight:600;font-size:15.95px;display:flex;justify-content:space-between;gap:22px;align-items:center}
summary::-webkit-details-marker{display:none}
summary .pm{flex:none;width:24.2px;height:24.2px;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;transition:.25s}
summary .pm::before{content:"+";color:var(--o);font-weight:600;font-size:15.4px;line-height:1}
details[open] .pm{background:var(--o);transform:rotate(45deg)}
details[open] .pm::before{color:#fff}
details .ans{padding:0 26.4px 24.2px;color:var(--mut);font-size:14.74px;max-width:78ch}
details .ans em{font-style:normal;color:var(--od);font-weight:600}
.cta{background:var(--blk);border-radius:var(--r2);padding:66px 61.6px;color:#fff}
.cta h2{color:#fff;margin-bottom:17.6px}
.cta p{color:rgba(255,255,255,.72);max-width:56ch;font-size:14.96px}
@media(max-width:760px){.cta{padding:41.8px 26.4px}}
.fld{margin-bottom:17.6px}
.fld label{display:block;font-size:12.65px;font-weight:600;margin-bottom:7.7px}
.fld input,.fld textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:13.2px;color:var(--ink);padding:13.2px 16.5px;font-family:inherit;font-size:15.4px;transition:.2s}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--o)}
.c2{display:grid;grid-template-columns:1fr 1fr;gap:15.4px}
@media(max-width:560px){.c2{grid-template-columns:1fr}}
footer{background:var(--blk);color:rgba(255,255,255,.6);padding:77px 0 33px;font-size:14.74px}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:44px;margin-bottom:57.2px}
@media(max-width:860px){.fg{grid-template-columns:1fr 1fr;gap:35.2px}}
@media(max-width:520px){.fg{grid-template-columns:1fr}}
footer .logo{height:28.6px;margin-bottom:19.8px}
footer h4{color:#fff;font-size:12.65px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin:0 0 17.6px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:12.1px}
footer a:hover{color:#fff}
.disc{border-top:1px solid rgba(255,255,255,.13);padding-top:28.6px;font-size:12.65px;line-height:1.8;color:rgba(255,255,255,.4)}
.disc p+p{margin-top:9.9px}
.fb{display:flex;justify-content:space-between;gap:15.4px;flex-wrap:wrap;margin-top:24.2px;font-size:13.2px}
.js .rv{opacity:0;transform:translateY(19.8px)}
.js .rv.in{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none}}
/* ================= RESPONSIVE HARDENING ================= */
  img{height:auto}
.page{overflow-wrap:break-word}
.tblwrap{-webkit-overflow-scrolling:touch}
.tbl{min-width:814px}
/* touch devices can't hover — always use the burger menu */
  @media (hover:none){.nav{display:none}.burger{display:inline-flex}}
@media(min-width:1700px){.wrap{padding:0 79.2px}}
@media(max-width:1240px){.wrap{padding:0 44px}}
/* stepper goes vertical earlier so labels never crush */
  @media(max-width:1000px){
    .stepper{grid-template-columns:1fr;margin-bottom:24.2px}
    .snode{display:grid;grid-template-columns:59.4px 1fr;gap:19.8px;align-items:center;text-align:left;padding:9.9px 0}
    .snode .dot{margin:0}
    .snode::after{top:63.8px;left:29.7px;right:auto;width:1.1px;height:calc(100% - 55px)}
    .snode::before{display:none}
    .snode:last-child::after{display:none}
  }
@media(max-width:900px){
    .wrap{padding:0 22px}
    section{padding:57.2px 0}
    .ann .wrap{height:auto;min-height:39.6px;padding-top:8.8px;padding-bottom:8.8px;line-height:1.45;text-align:center}
    .hero{height:auto;min-height:0;padding:66px 0 59.4px}
    .head{margin-bottom:33px}
  }
@media(max-width:620px){
    .wrap{padding:0 17.6px}
    section{padding:46.2px 0}
    .card,.card[style]{padding:24.2px 19.8px!important}
    .spanel .inr{padding:26.4px 22px}
    .panel .inner{padding:24.2px 19.8px}
    .cta{padding:35.2px 22px!important}
    .split[style]{gap:28.6px!important}
    .head{margin-bottom:26.4px}
    .btn{padding:14.3px 22px;font-size:12.65px}
    .btn-row{gap:8.8px}
    .sb .wrap{padding-top:28.6px;padding-bottom:28.6px}
    .tlr{padding:19.8px 17.6px}
    .tlr .mini li{font-size:12.98px;padding:5.5px 12.1px}
    summary{padding:17.6px 19.8px;font-size:14.96px;gap:15.4px}
    details .ans{padding:0 19.8px 19.8px}
    .faq{gap:8.8px}
    .pills span{padding:9.9px 16.5px;font-size:13.64px}
    .tabs{gap:7.7px;margin-bottom:24.2px}
    .tab{padding:9.9px 16.5px;font-size:13.2px}
    .rows .row{grid-template-columns:33px 1fr;gap:11px}
  }
@media(max-width:400px){
    .sb .wrap{grid-template-columns:1fr;gap:19.8px}
    header .logo{height:22px}
    header .wrap{gap:13.2px}
    .btn{padding:13.2px 17.6px}
    .snode{grid-template-columns:48.4px 1fr;gap:15.4px}
    .snode .dot{width:48.4px;height:48.4px;font-size:15.4px}
    .snode::after{top:52.8px;left:24.2px;height:calc(100% - 44px)}
  }
/* ---- About-page additions ---- */
  /* ABOUT hero — the product IS the subject, so centre it and go big.
     Distinct from the other pages by composition, not decoration. */
  .hero-about{position:relative;background:var(--blk);overflow:hidden;padding:0}
.hero-about .wrap{position:relative;z-index:2;text-align:center;padding-top:90.2px;padding-bottom:0;max-width:1298px}
.hero-about .glow{position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:990px;height:990px;border-radius:50%;
    background:radial-gradient(circle,rgba(238,122,12,.16) 0%,rgba(238,122,12,0) 66%);pointer-events:none}
.hero-about h1{margin:17.6px auto 0;line-height:1.04;color:#fff;max-width:16ch}
.hero-about h1 .o{color:var(--o)}
.hero-about p{color:rgba(255,255,255,.74);font-size:15.84px;max-width:58ch;margin:24.2px auto 0}
.hero-about .btn-row{margin-top:33px;justify-content:center}
/* composition strip — four real components, set as a quiet caption line */
  .compstrip{display:flex;flex-wrap:wrap;justify-content:center;gap:0 33px;margin-top:37.4px;
    padding-top:24.2px;border-top:1px solid rgba(255,255,255,.14)}
.compstrip span{font-size:11.55px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    color:rgba(255,255,255,.42);padding:5.5px 0}
/* product sinks into the section below — gives depth without a gimmick */
  .hero-about .shot{max-width:616px;margin:33px auto -77px;position:relative;z-index:2}
.hero-about .shot img{width:100%;filter:drop-shadow(0 44px 77px rgba(0,0,0,.6))}
/* make room for the product overhang */
  .hero-about + section{padding-top:129.8px}
@media(max-width:900px){
    .hero-about .wrap{padding-top:61.6px}
    .hero-about .shot{max-width:418px;margin:24.2px auto -50.6px}
    .hero-about + section{padding-top:90.2px}
    .compstrip{gap:0 19.8px;margin-top:28.6px}
    .compstrip span{font-size:10.45px;letter-spacing:.1em}
  }
/* quick-link cards */
  .qk{display:grid;grid-template-columns:repeat(3,1fr);gap:19.8px}
.qk a{display:block;background:var(--grey);border-radius:var(--r);padding:28.6px 28.6px 26.4px;transition:.25s;border:1px solid transparent}
.qk a:hover{background:#fff;border-color:var(--line);box-shadow:var(--sh);transform:translateY(-3.3px)}
.qk .n{font-size:12.65px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--o);display:block;margin-bottom:13.2px}
.qk h3{font-size:18.15px;margin-bottom:7.7px}
.qk p{font-size:14.3px;color:var(--mut);line-height:1.6}
.qk .go{display:inline-flex;align-items:center;gap:7.7px;margin-top:15.4px;font-size:12.65px;font-weight:600;
    letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.qk .go svg{width:13.2px;height:13.2px;transition:transform .2s}
.qk a:hover .go{color:var(--od)}
.qk a:hover .go svg{transform:translateX(3.3px)}
@media(max-width:900px){.qk{grid-template-columns:1fr}}
/* component rows — parallel, not sequential: marker, not number */
  .comp .row{grid-template-columns:24.2px 1fr}
.comp .row .mk{width:7.7px;height:7.7px;border-radius:50%;background:var(--o);display:block;margin-top:7.7px}
.comp .row .t{font-size:15.4px;letter-spacing:.05em;text-transform:uppercase}
.comp .row .d{font-size:14.52px;margin-top:6.6px}
@media(max-width:620px){.comp .row{grid-template-columns:19.8px 1fr;gap:13.2px}}
.stick{position:sticky;top:114.4px}
@media(max-width:980px){.stick{position:static}}
.cta.sp{display:grid;grid-template-columns:1.15fr .85fr;gap:52.8px;align-items:center}
.cta.sp img{width:100%;border-radius:var(--r);display:block}
@media(max-width:900px){.cta.sp{grid-template-columns:1fr;gap:30.8px}}
.noteline{border-left:2px solid var(--o);padding-left:17.6px;color:var(--mut);font-size:14.3px;margin-top:24.2px}
.dark .noteline{color:rgba(255,255,255,.66)}
/* keep the injection point in frame when the 4:5 crop bites */
  .ph.t.left img{object-position:18% center}
/* vial art is only 520px native — pad rather than upscale it */
  .ph.pad{padding:37.4px;display:flex;align-items:center;justify-content:center}
.ph.pad img{width:auto;max-height:462px}
@media(max-width:620px){.ph.pad{padding:24.2px}}
/* ---- shared sub-page additions ---- */
  /* WHY CHOOSE hero — this page argues one thing, so the hero states it.
     Light ground breaks the run of black heroes; no photograph. */
  .hero-why{background:var(--grey2);border-bottom:1px solid var(--line);padding:0}
.hero-why .wrap{padding-top:92.4px;padding-bottom:77px;max-width:1342px}
.hero-why h1{margin:17.6px 0 0;line-height:1.05;max-width:15ch}
.hero-why h1 .o{color:var(--o)}
.hero-why p{color:var(--mut);font-size:15.84px;max-width:56ch;margin-top:24.2px}
.hero-why .btn-row{margin-top:33px}
/* the two agents, as the hero's visual */
  .duo{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:57.2px;border-top:1px solid var(--line)}
.duo .a{padding:28.6px 33px 0 0;position:relative}
.duo .a+.a{padding-left:33px;border-left:1px solid var(--line)}
.duo .n{display:block;font-size:12.1px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
    color:var(--o);margin-bottom:11px;font-variant-numeric:tabular-nums}
.duo .t{font-size:clamp(1.155rem,1.9vw,1.54rem);font-weight:600;letter-spacing:.01em;line-height:1.25}
.duo .s{display:block;font-size:13.86px;color:var(--mut);margin-top:7.7px}
@media(max-width:700px){
    .duo{grid-template-columns:1fr;margin-top:39.6px}
    .duo .a{padding:24.2px 0 0}
    .duo .a+.a{padding-left:0;border-left:none;border-top:1px solid var(--line);padding-top:24.2px;margin-top:24.2px}
  }
@media(max-width:900px){.hero-why .wrap{padding-top:61.6px;padding-bottom:55px}}
/* ---- benefit strip: short labels, so keep it compact, not big cards ---- */
  .bens{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.bens .b{padding:33px 28.6px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:17.6px}
.bens .b:last-child{border-right:none}
.bens svg{width:37.4px;height:37.4px;color:var(--o);stroke-width:1.4}
.bens .lb{font-size:15.95px;font-weight:600;line-height:1.35}
@media(max-width:900px){.bens{grid-template-columns:1fr 1fr}
    .bens .b{border-bottom:1px solid var(--line)}
    .bens .b:nth-child(2n){border-right:none}
    .bens .b:nth-last-child(-n+2){border-bottom:none}}
@media(max-width:520px){.bens{grid-template-columns:1fr}
    .bens .b{border-right:none;border-bottom:1px solid var(--line);padding:24.2px 0}
    .bens .b:last-child{border-bottom:none}}
/* ---- "may suit you" checklist on black ---- */
  .suits{display:grid;grid-template-columns:1fr 1fr;gap:15.4px 44px;margin-top:8.8px}
.suits li{display:flex;gap:15.4px;align-items:flex-start;font-size:15.4px;color:rgba(255,255,255,.78);line-height:1.6}
.suits li i{flex:none;width:22px;height:22px;border-radius:50%;background:rgba(238,122,12,.16);
    display:inline-flex;align-items:center;justify-content:center;margin-top:2.2px}
.suits li i svg{width:11px;height:11px;color:var(--o);stroke-width:2.6}
ul.suits{list-style:none;margin:0;padding:0}
@media(max-width:900px){.suits{grid-template-columns:1fr;gap:14.3px}}
/* ---- shared sub-page additions ---- */
  /* HOW IT WORKS hero — full-bleed clinical photograph behind a directional
     scrim. The only page whose photo can carry a background treatment. */
  .hero-mech{position:relative;background:var(--blk);overflow:hidden;padding:0;isolation:isolate}
.hero-mech .bg{position:absolute;inset:0;z-index:0}
.hero-mech .bg img{width:100%;height:100%;object-fit:cover;object-position:62% center;opacity:.5}
.hero-mech::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(96deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.82) 42%,rgba(0,0,0,.42) 74%,rgba(0,0,0,.55) 100%)}
.hero-mech .wrap{position:relative;z-index:2;padding-top:105.6px;padding-bottom:105.6px}
.hero-mech .txt{max-width:682px;color:#fff}
.hero-mech h1{margin:17.6px 0 0;line-height:1.05}
.hero-mech h1 .o{color:var(--o)}
.hero-mech p{color:rgba(255,255,255,.8);font-size:15.84px;max-width:52ch;margin-top:22px}
.hero-mech .btn-row{margin-top:33px}
/* the four stages, previewed as a rail along the bottom of the hero */
  .prev{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:61.6px;
    border-top:1px solid rgba(255,255,255,.18)}
.prev div{padding:19.8px 22px 0 0}
.prev .n{display:block;font-size:11.55px;font-weight:600;letter-spacing:.14em;color:var(--o);
    margin-bottom:7.7px;font-variant-numeric:tabular-nums}
.prev .t{font-size:14.3px;font-weight:600;color:rgba(255,255,255,.9);line-height:1.3}
@media(max-width:820px){
    .prev{grid-template-columns:1fr 1fr;gap:4.4px 0}
    .prev div{padding:17.6px 17.6px 0 0}
  }
@media(max-width:900px){.hero-mech .wrap{padding-top:68.2px;padding-bottom:68.2px}
    .hero-mech .bg img{opacity:.34}}
/* ---- the two lipolytic agents ---- */
  .agents{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:41.8px}
.agent{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30.8px 28.6px;position:relative}
.agent .tag{font-size:12.1px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--o);display:block;margin-bottom:13.2px}
.agent h3{font-size:19.8px;margin-bottom:6.6px;letter-spacing:.01em}
.agent .alt{font-size:13.75px;color:var(--mut)}
@media(max-width:760px){.agents{grid-template-columns:1fr}}
/* ---- 4-stage mechanism flow (a real sequence, so it is numbered) ---- */
  .flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:8.8px}
.fstep{position:relative;padding:0 28.6px 0 0}
.fstep:last-child{padding-right:0}
.fstep .fn{width:48.4px;height:48.4px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:#141414;
    color:var(--o);font-size:15.4px;font-weight:600;display:flex;align-items:center;justify-content:center;
    margin-bottom:19.8px;position:relative;z-index:2;font-variant-numeric:tabular-nums}
.fstep h3{font-size:16.5px;color:#fff;margin-bottom:9.9px;letter-spacing:.02em}
.fstep p{font-size:14.52px;color:rgba(255,255,255,.66);line-height:1.65}
/* connector */
  .fstep::after{content:"";position:absolute;top:24.2px;left:61.6px;right:8.8px;height:1.1px;background:rgba(255,255,255,.18);z-index:1}
.fstep::before{content:"";position:absolute;top:19.8px;right:8.8px;width:7.7px;height:7.7px;
    border-top:1.4px solid rgba(255,255,255,.34);border-right:1.4px solid rgba(255,255,255,.34);transform:rotate(45deg);z-index:2}
.fstep:last-child::after,.fstep:last-child::before{display:none}
@media(max-width:1000px){
    .flow{grid-template-columns:1fr 1fr;gap:37.4px 28.6px}
    .fstep{padding-right:0}
    .fstep::after,.fstep::before{display:none}
  }
@media(max-width:620px){.flow{grid-template-columns:1fr;gap:28.6px}}
/* ---- shared sub-page additions ---- */
  /* HOW TO USE hero — this page is reference documentation, so it is set
     like the header of a datasheet: white, compact, data-led, no photograph. */
  .hero-doc{background:#fff;border-bottom:1px solid var(--line);padding:0}
.hero-doc .wrap{padding-top:66px;padding-bottom:0}
.hero-doc .rule{display:flex;align-items:center;gap:15.4px;margin-bottom:22px}
.hero-doc .rule .eyebrow{margin:0}
.hero-doc .rule i{flex:1;height:1.1px;background:var(--line)}
.hero-doc h1{font-size:clamp(2.2rem,3.6vw,3.19rem);letter-spacing:.02em;line-height:1.08;margin:0;max-width:18ch}
.hero-doc h1 .o{color:var(--o)}
.hero-doc p{color:var(--mut);font-size:15.62px;max-width:60ch;margin-top:19.8px}
.hero-doc .warn{max-width:62ch}
/* spec strip — the numbers a practitioner is actually looking for */
  .specstrip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:41.8px;border-top:1px solid var(--line)}
.specstrip div{padding:22px 24.2px 24.2px 0;border-right:1px solid var(--line)}
.specstrip div:last-child{border-right:none}
.specstrip div+div{padding-left:24.2px}
.specstrip .k{display:block;font-size:11.55px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
    color:var(--mut);margin-bottom:8.8px}
.specstrip .v{font-size:17.6px;font-weight:600;letter-spacing:.01em;font-variant-numeric:tabular-nums;line-height:1.3}
@media(max-width:860px){
    .specstrip{grid-template-columns:1fr 1fr}
    .specstrip div{border-bottom:1px solid var(--line);padding:17.6px 19.8px 17.6px 0}
    .specstrip div:nth-child(2n){border-right:none;padding-left:19.8px}
    .specstrip div:nth-child(2n+1){padding-left:0}
    .specstrip div:nth-last-child(-n+2){border-bottom:none}
    .specstrip .v{font-size:15.95px}
  }
@media(max-width:900px){.hero-doc .wrap{padding-top:48.4px}}
/* ---- practitioner warning ---- */
  .warn{display:flex;gap:15.4px;align-items:flex-start;background:rgba(238,122,12,.1);border:1px solid rgba(238,122,12,.32);
    border-radius:var(--r);padding:19.8px 22px;margin-top:28.6px;max-width:56ch}
.warn svg{flex:none;width:20.9px;height:20.9px;color:var(--o);margin-top:1.1px}
.warn p{margin:0;font-size:14.52px;color:rgba(255,255,255,.84);line-height:1.6}
.warn.lt{background:var(--osoft);border-color:rgba(238,122,12,.28)}
.warn.lt p{color:var(--ink)}
/* ---- protocol phases: a real sequence, so numbered ---- */
  /* sibling selector, not :first-of-type — .head is the first div in .wrap */
  .phase{display:grid;grid-template-columns:275px 1fr;gap:52.8px;padding:0 0 48.4px}
.phase+.phase{padding-top:48.4px;border-top:1px solid var(--line)}
.phase .side{position:sticky;top:114.4px;align-self:start}
.phase .pn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;
    background:var(--o);color:#fff;font-size:15.4px;font-weight:600;margin-bottom:17.6px;font-variant-numeric:tabular-nums}
.phase h3{font-size:20.9px;letter-spacing:.01em;line-height:1.24}
.phase .kicker{font-size:12.65px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);display:block;margin-top:8.8px}
.plist{list-style:none;margin:0;padding:0;display:grid;gap:14.3px}
.plist li{display:flex;gap:14.3px;align-items:flex-start;font-size:14.96px;color:var(--mut);line-height:1.68}
.plist li i{flex:none;width:6.6px;height:6.6px;border-radius:50%;background:var(--o);margin-top:8.8px}
.plist li b{color:var(--ink);font-weight:600}
.plist .lead{color:var(--ink);font-weight:600;font-size:15.18px;display:block;margin-top:6.6px}
@media(max-width:900px){
    .phase{grid-template-columns:1fr;gap:24.2px;padding:0 0 35.2px}
    .phase+.phase{padding-top:35.2px}
    .phase .side{position:static}
  }
/* ---- treatment areas as real text, not trapped in the image ---- */
  .areas{display:flex;flex-wrap:wrap;gap:9.9px;margin-top:30.8px}
.areas span{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:var(--pill);
    padding:9.9px 18.7px;font-size:14.3px;color:#fff}
.diagram{border-radius:var(--r2);overflow:hidden;margin-top:37.4px;background:#000}
.diagram img{width:100%}
/* ---- protocol figures ---- */
  .figs{display:grid;grid-template-columns:repeat(3,1fr);gap:19.8px;margin-top:37.4px}
.fig{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);padding:24.2px 24.2px}
.fig .k{font-size:12.1px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55);display:block;margin-bottom:9.9px}
.fig .v{font-size:23.1px;font-weight:600;color:#fff;letter-spacing:.01em;font-variant-numeric:tabular-nums;line-height:1.25}
@media(max-width:860px){.figs{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.figs{grid-template-columns:1fr}}
.hero-ab{position:relative;background:var(--blk);overflow:hidden;padding:0}
.hero-ab .wrap{padding-top:83.6px;padding-bottom:83.6px;position:relative;z-index:2}
.hero-ab .glow{position:absolute;top:-24%;right:2%;width:660px;height:660px;border-radius:50%;
    background:radial-gradient(circle,rgba(238,122,12,.2) 0%,rgba(238,122,12,0) 68%);pointer-events:none}
.hero-ab h1{margin:19.8px 0 0;line-height:1.06;color:#fff}
.hero-ab h1 .o{color:var(--o)}
.hero-ab p{color:rgba(255,255,255,.74);font-size:15.62px;max-width:56ch;margin-top:22px}
@media(max-width:900px){.hero-ab .wrap{padding-top:59.4px;padding-bottom:59.4px}}
/* form is the whole page here - centre it and let it breathe */
  .cwrap{max-width:836px;margin:0 auto}
/* Form. Selectors cover BOTH Contact Form 7 (.wpcf7-*) and Elementor
     Forms (.elementor-field*), so the styling lands whichever we keep. */
  .formcard{background:var(--grey2);border:1px solid var(--line);border-radius:var(--r2);padding:41.8px 39.6px}
@media(max-width:620px){.formcard{padding:28.6px 22px}}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:19.8px}
@media(max-width:620px){.fgrid{grid-template-columns:1fr}}
.fgroup,.elementor-field-group{display:flex;flex-direction:column;margin-bottom:19.8px}
.fgroup.full{grid-column:1/-1}
.fgroup label,.elementor-field-group label{font-size:12.1px;font-weight:600;letter-spacing:.09em;
    text-transform:uppercase;color:var(--mut);margin-bottom:8.8px}
.fgroup label .req{color:var(--o)}
.fgroup input,.fgroup textarea,
  .wpcf7-form-control:not([type=submit]):not([type=button]),.elementor-field{
    width:100%;background:#fff;border:1px solid var(--line);border-radius:13.2px;color:var(--ink);
    padding:14.3px 17.6px;font-family:inherit;font-size:15.4px;transition:.18s;line-height:1.5}
.fgroup textarea{min-height:145.2px;resize:vertical}
.fgroup input:focus,.fgroup textarea:focus,
  .wpcf7-form-control:not([type=submit]):not([type=button]):focus,.elementor-field:focus{outline:none;border-color:var(--o);box-shadow:0 0 0 3.3px rgba(238,122,12,.12)}
.fgroup input::placeholder,.fgroup textarea::placeholder{color:#A9A2A0}
.wpcf7-submit,.elementor-button,.formcard button[type=submit]{width:auto}
.formnote{font-size:13.42px;color:var(--mut);margin-top:17.6px;line-height:1.6}

/* Contact Form 7 bridge */
.fgroup .wpcf7-form-control-wrap{display:block;width:100%}
.wpcf7-not-valid-tip{color:#C0392B;font-size:12.65px;margin-top:6.6px}
.wpcf7 form .wpcf7-response-output{margin:19.8px 0 0;padding:13.2px 16.5px;border-radius:13.2px;border:1px solid var(--line);font-size:13.75px}
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output{border-color:#E3B7B2;background:#FDF3F2;color:#C0392B}
.wpcf7 form.sent .wpcf7-response-output{border-color:#B7D8C0;background:#F2FAF5;color:#1E7A46}
.wpcf7-spinner{display:inline-block;margin-left:11px;vertical-align:middle}


/* ==================================================================
   LIPO product page
   Built after the original consolidate.py run, so it never made it
   into the merged stylesheet. Appended verbatim.
   ================================================================== */
/* ---------------------------------------------------------------
     Product page. Every selector below targets a REAL WooCommerce
     class, so this stylesheet drops onto the live single-product
     template without replacing any markup.
     --------------------------------------------------------------- */
  .crumb{background:var(--grey2);border-bottom:1px solid var(--line)}
  .crumb .wrap{display:flex;align-items:center;gap:9.9px;height:57.2px;font-size:13.2px;color:var(--mut)}
  .crumb a:hover{color:var(--od)}
  .crumb svg{width:12.1px;height:12.1px;opacity:.5}

  .prod{display:grid;grid-template-columns:1.05fr .95fr;gap:70.4px;align-items:start}
  @media(max-width:1000px){.prod{grid-template-columns:1fr;gap:41.8px}}

  /* gallery */
  .woocommerce-product-gallery{position:sticky;top:114.4px}
  @media(max-width:1000px){.woocommerce-product-gallery{position:static}}
  .woocommerce-product-gallery__image{border-radius:var(--r2);overflow:hidden;background:var(--grey);border:1px solid var(--line)}
  .woocommerce-product-gallery__image img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
  .gthumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:13.2px;margin-top:15.4px}
  .gthumb{border-radius:13.2px;overflow:hidden;background:var(--grey);border:1px solid var(--line);cursor:pointer;padding:0;transition:.2s}
  .gthumb img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
  .gthumb[aria-current="true"]{border-color:var(--o);box-shadow:0 0 0 2.2px rgba(238,122,12,.2)}
  .gthumb:hover{border-color:var(--ink)}

  /* summary column */
  .entry-summary .product_title{font-size:clamp(2.09rem,3vw,2.75rem);letter-spacing:.02em;margin:13.2px 0 0}
  .woocommerce-product-rating{display:flex;align-items:center;gap:11px;margin-top:15.4px;font-size:13.75px;color:var(--mut)}
  .star-rating{display:inline-flex;gap:2.2px}
  .star-rating svg{width:15.4px;height:15.4px;color:var(--o)}
  .woocommerce-review-link:hover{color:var(--od);text-decoration:underline}

  .price{margin:24.2px 0 0;display:flex;align-items:baseline;gap:13.2px;flex-wrap:wrap}
  .price .woocommerce-Price-amount{font-size:33px;font-weight:600;letter-spacing:.01em;font-variant-numeric:tabular-nums}
  .price .unit{font-size:13.75px;color:var(--mut)}
  .price .from{font-size:13.2px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--mut)}
  /* quote flow: no payment is taken, so say so plainly next to the button */
  .quotenote{display:flex;gap:13.2px;align-items:flex-start;background:var(--grey2);border:1px solid var(--line);
    border-radius:13.2px;padding:15.4px 17.6px;margin-top:17.6px}
  .quotenote svg{flex:none;width:17.6px;height:17.6px;color:var(--o);margin-top:1.1px}
  .quotenote p{margin:0;font-size:13.86px;color:var(--mut);line-height:1.6}
  .quotenote b{color:var(--ink);font-weight:600}

  .woocommerce-product-details__short-description{margin-top:24.2px;color:var(--mut);font-size:14.96px;line-height:1.7;max-width:52ch}

  /* volume discount tiers */
  .tiers{margin-top:28.6px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
  .tiers .th{background:var(--blk);color:#fff;padding:14.3px 19.8px;font-size:12.1px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
  .tier{display:flex;justify-content:space-between;align-items:center;gap:17.6px;padding:14.3px 19.8px;border-top:1px solid var(--line);font-size:14.74px}
  .tier:first-of-type{border-top:none}
  .tier .q{color:var(--mut)}
  .tier .d{font-weight:600;color:var(--o);font-variant-numeric:tabular-nums}

  /* cart form */
  form.cart{margin-top:28.6px;display:flex;gap:11px;flex-wrap:wrap;align-items:stretch}
  .quantity{display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:var(--pill);overflow:hidden;background:#fff}
  .quantity button{width:44px;border:0;background:none;cursor:pointer;font-size:17.6px;color:var(--mut);font-family:inherit;transition:.15s}
  .quantity button:hover{color:var(--o)}
  .quantity input.qty{width:50.6px;border:0;text-align:center;font-family:inherit;font-size:15.4px;font-weight:600;
    background:none;color:var(--ink);font-variant-numeric:tabular-nums;-moz-appearance:textfield}
  .quantity input.qty::-webkit-outer-spin-button,.quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
  .quantity input.qty:focus{outline:none}
  .single_add_to_cart_button,.wpcbn-btn{flex:1 1 160px;justify-content:center}

  /* quick facts under the buy box */
  .qfacts{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:30.8px;border-top:1px solid var(--line)}
  .qfacts div{padding:16.5px 0;border-bottom:1px solid var(--line);font-size:14.3px}
  .qfacts div:nth-child(odd){padding-right:19.8px}
  .qfacts div:nth-child(even){padding-left:19.8px;border-left:1px solid var(--line)}
  .qfacts .k{display:block;font-size:12.1px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin-bottom:5.5px}
  .qfacts .v{font-weight:600}
  @media(max-width:520px){.qfacts{grid-template-columns:1fr}
    .qfacts div:nth-child(even){padding-left:0;border-left:none}
    .qfacts div:nth-child(odd){padding-right:0}}

  /* tabs */
  .woocommerce-tabs{margin-top:0}
  ul.tabs{display:flex;gap:8.8px;list-style:none;margin:0 0 37.4px;padding:0;flex-wrap:wrap;border-bottom:1px solid var(--line)}
  ul.tabs li a{display:block;padding:15.4px 24.2px;font-size:13.2px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
    color:var(--mut);border-bottom:2px solid transparent;margin-bottom:-1.1px;transition:.2s}
  ul.tabs li a:hover{color:var(--ink)}
  ul.tabs li.active a{color:var(--ink);border-bottom-color:var(--o)}
  .woocommerce-Tabs-panel{display:none} .woocommerce-Tabs-panel.on{display:block}
  .woocommerce-Tabs-panel h2{font-size:clamp(1.54rem,2.2vw,1.98rem);margin-bottom:19.8px}

  /* spec table */
  .spectbl{width:100%;border-collapse:collapse;font-size:14.74px}
  .spectbl th{text-align:left;vertical-align:top;padding:16.5px 26.4px 16.5px 0;width:261.8px;
    font-size:12.1px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);border-bottom:1px solid var(--line)}
  .spectbl td{padding:16.5px 0;color:var(--ink);border-bottom:1px solid var(--line);line-height:1.65}
  .spectbl tr:last-child th,.spectbl tr:last-child td{border-bottom:none}
  @media(max-width:700px){
    .spectbl,.spectbl tbody,.spectbl tr,.spectbl th,.spectbl td{display:block;width:auto}
    .spectbl th{border-bottom:none;padding:17.6px 0 4.4px}
    .spectbl td{padding:0 0 17.6px}
  }

  /* reviews */
  .rev{border:1px solid var(--line);border-radius:var(--r);padding:26.4px 28.6px;margin-bottom:15.4px}
  .rev .top{display:flex;justify-content:space-between;gap:17.6px;align-items:center;margin-bottom:11px;flex-wrap:wrap}
  .rev .who{font-weight:600;font-size:15.4px}
  .rev .when{font-size:13.2px;color:var(--mut)}
  .rev p{color:var(--mut);font-size:14.74px;line-height:1.7}

  .warn{display:flex;gap:15.4px;align-items:flex-start;background:var(--osoft);border:1px solid rgba(238,122,12,.3);
    border-radius:var(--r);padding:19.8px 22px;margin-top:28.6px}
  .warn svg{flex:none;width:20.9px;height:20.9px;color:var(--o);margin-top:1.1px}
  .warn p{margin:0;font-size:14.52px;color:var(--ink);line-height:1.6}

/* The theme's JS injects its own +/- spinners into .quantity (it adds a
   .spinners-added class), which doubles up with the stepper the design
   already provides. Hide the injected pair. */
.quantity input.minus,.quantity input.plus{display:none}
/* lipo:scaled */

/* The theme emits its own scroll-to-top controls, but the CSS that
   positions them fixed is dequeued on these pages, so they landed as
   static content below the footer - a white strip under the black
   footer. The design has no scroll-to-top, so take them out of the
   layout. #bt-scroll-up-reader is a screen-reader affordance, so this
   is the visually-hidden pattern rather than display:none. */
.base-scroll-to-top{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.base-scroll-to-top:focus{clip:auto;clip-path:none;width:auto;height:auto;margin:0;padding:10px 16px;position:fixed!important;left:16px;bottom:16px;background:var(--blk);color:#fff;border-radius:var(--pill);z-index:100}

/* ==================================================================
   LIPO WooCommerce screens (cart, checkout, my account)
   These render WooCommerce's own markup, so the design is layered over
   Woo's base stylesheet rather than replacing it. Values are written at
   the already-scaled sizes - scale_css.py has run and will not run again.
   ================================================================== */
.woocommerce .page-title,.woocommerce-page .page-title{font-size:clamp(1.9rem,3vw,2.6rem);margin-bottom:8px}
.woocommerce .woocommerce-breadcrumb{font-size:12.5px;color:var(--mut);margin-bottom:26px}
.woocommerce .woocommerce-breadcrumb a{color:var(--mut)}
.woocommerce .woocommerce-breadcrumb a:hover{color:var(--o)}

/* ---- notices -------------------------------------------------- */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border:1px solid var(--line);border-left:3px solid var(--o);background:var(--grey2);
  border-radius:var(--r);padding:15px 18px;font-size:14px;color:var(--ink);list-style:none}
.woocommerce-error{border-left-color:#C0392B;background:#FDF3F2;color:#C0392B}
.woocommerce-message a,.woocommerce-info a{color:var(--od);font-weight:600}

/* ---- tables (cart + order review) ------------------------------ */
.woocommerce table.shop_table{border:1px solid var(--line);border-radius:var(--r2);
  border-collapse:separate;border-spacing:0;overflow:hidden;font-size:14.5px}
.woocommerce table.shop_table th{background:var(--grey2);font-size:11.5px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;color:var(--mut);padding:16px 18px;border:0}
.woocommerce table.shop_table td{padding:18px;border:0;border-top:1px solid var(--line);vertical-align:middle}
.woocommerce table.shop_table img{width:64px;border-radius:10px}
.woocommerce table.shop_table .product-name a{color:var(--ink);font-weight:600}
.woocommerce table.shop_table .product-name a:hover{color:var(--o)}
.woocommerce a.remove{color:var(--mut)!important;font-weight:400}
.woocommerce a.remove:hover{background:transparent!important;color:#C0392B!important}

/* ---- form controls -------------------------------------------- */
.woocommerce form .form-row{padding:0;margin:0 0 18px}
.woocommerce form .form-row label{display:block;font-size:11px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--mut);margin-bottom:8px}
.woocommerce form .form-row .required{color:var(--o);text-decoration:none}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single{
  width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;color:var(--ink);
  padding:14px 18px;font-family:inherit;font-size:15.4px;height:auto;transition:.2s;box-shadow:none}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{outline:none;border-color:var(--o);
  box-shadow:0 0 0 3px rgba(238,122,12,.12)}
.woocommerce form .form-row textarea{min-height:120px}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:normal;padding:0;color:var(--ink)}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow{top:50%;transform:translateY(-50%)}

/* ---- headings on woo screens ----------------------------------- */
.woocommerce h2,.woocommerce h3,.woocommerce-checkout h3,#order_review_heading{
  font-size:clamp(1.25rem,2vw,1.6rem);letter-spacing:.02em;margin:0 0 20px}

/* ---- buttons --------------------------------------------------- */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt,
.woocommerce #place_order{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  background:var(--blk);color:#fff;border:1px solid var(--blk);border-radius:var(--pill);
  font-family:inherit;font-size:13.2px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  padding:15px 29px;line-height:1;transition:.2s;text-shadow:none}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce #place_order:hover{
  background:var(--o);border-color:var(--o);color:#fff}
.woocommerce .checkout-button,.woocommerce #place_order{
  width:100%;background:var(--o);border-color:var(--o);font-size:14px;padding:18px 29px}
.woocommerce .checkout-button:hover,.woocommerce #place_order:hover{background:var(--od);border-color:var(--od)}
.woocommerce button.button:disabled,.woocommerce button.button[disabled]{opacity:.45}

/* ---- cart totals / order review panels ------------------------- */
.woocommerce .cart_totals,.woocommerce-checkout-review-order{
  background:var(--grey2);border:1px solid var(--line);border-radius:var(--r2);padding:30px 28px}
.woocommerce .cart_totals table.shop_table,
.woocommerce-checkout-review-order table.shop_table{border:0;border-radius:0;background:transparent}
.woocommerce .cart_totals table.shop_table th,
.woocommerce-checkout-review-order table.shop_table th{background:transparent;padding:14px 0}
.woocommerce .cart_totals table.shop_table td,
.woocommerce-checkout-review-order table.shop_table td{padding:14px 0;text-align:right}
.woocommerce .cart_totals h2{font-size:16.5px;letter-spacing:.02em}
.woocommerce ul#shipping_method{margin:0;padding:0;list-style:none;text-align:right}
.woocommerce .woocommerce-shipping-destination,.woocommerce .shipping-calculator-button{font-size:13px;color:var(--mut)}

/* ---- payment box ------------------------------------------------ */
.woocommerce-checkout #payment{background:transparent;border-radius:0}
.woocommerce-checkout #payment ul.payment_methods{
  border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:18px}
.woocommerce-checkout #payment ul.payment_methods li{list-style:none}
.woocommerce-checkout #payment ul.payment_methods label{font-size:14px;font-weight:600;
  text-transform:none;letter-spacing:0;color:var(--ink)}
.woocommerce-checkout #payment div.payment_box{background:var(--osoft);border-radius:12px;
  color:var(--ink);font-size:13.5px;margin-top:12px}
.woocommerce-checkout #payment div.payment_box::before{display:none}
.woocommerce-privacy-policy-text{font-size:13px;color:var(--mut)}

/* ---- coupon ----------------------------------------------------- */
.woocommerce .coupon input.input-text{max-width:230px;display:inline-block;width:auto}
.woocommerce form.checkout_coupon{border:1px solid var(--line);border-radius:var(--r);
  background:var(--grey2);padding:22px}


/* ---- typography on theme-owned Woo screens ---------------------
   The theme keeps its layout CSS on cart/checkout/account, so only the
   type and colour are pulled back to the design system. */
.woocommerce-cart .entry-content,.woocommerce-checkout .entry-content,
.woocommerce-account .entry-content,
.woocommerce-cart .entry-title,.woocommerce-checkout .entry-title,
.woocommerce-account .entry-title,
.woocommerce-cart .base-breadcrumb-container,.woocommerce-checkout .base-breadcrumb-container{
  font-family:var(--f)}
.woocommerce-cart .entry-title,.woocommerce-checkout .entry-title,.woocommerce-account .entry-title{
  font-size:clamp(1.9rem,3vw,2.6rem);font-weight:600;letter-spacing:.02em}
.woocommerce-cart .base-breadcrumb-container,.woocommerce-checkout .base-breadcrumb-container{
  font-size:12.5px;color:var(--mut)}
.woocommerce .cart-summary h2,.woocommerce .cart_totals h2{
  font-size:16.5px;letter-spacing:.02em;font-weight:600}

/* ---- theme hero band on Woo screens -----------------------------
   The theme renders a "contained" hero, so its grey band stops at the
   theme's 1430px content width and floats in the middle of a wider
   viewport. Make it full-bleed and slim it down to match the crumb bar
   used on the product page. */
.woocommerce-cart .entry-hero-container-inner,
.woocommerce-checkout .entry-hero-container-inner,
.woocommerce-account .entry-hero-container-inner{
  max-width:none;width:100%;background:var(--grey2);
  border-bottom:1px solid var(--line)}
.woocommerce-cart .entry-hero-container-inner .entry-header,
.woocommerce-checkout .entry-hero-container-inner .entry-header,
.woocommerce-account .entry-hero-container-inner .entry-header{
  min-height:0;padding:20px 0}
.woocommerce-cart .hero-container.site-container,
.woocommerce-checkout .hero-container.site-container,
.woocommerce-account .hero-container.site-container{
  max-width:var(--max);margin:0 auto;padding:0 61.6px}
.woocommerce-cart .entry-hero .entry-title,
.woocommerce-checkout .entry-hero .entry-title,
.woocommerce-account .entry-hero .entry-title{
  font-size:24px;margin:2px 0 0}
.woocommerce-cart .base-breadcrumb-container,
.woocommerce-checkout .base-breadcrumb-container,
.woocommerce-account .base-breadcrumb-container{margin:0}
.woocommerce-cart .entry-hero,
.woocommerce-checkout .entry-hero,
.woocommerce-account .entry-hero{margin-top:0}
.woocommerce-cart .site-main,
.woocommerce-checkout .site-main,
.woocommerce-account .site-main{padding-top:46px}
.woocommerce-cart .content-container.site-container,
.woocommerce-checkout .content-container.site-container,
.woocommerce-account .content-container.site-container{
  max-width:var(--max);padding-left:61.6px;padding-right:61.6px}

/* ---- cart quantity stepper -------------------------------------- */
.woocommerce .quantity.lipo-qty{display:inline-flex;align-items:center;
  border:1px solid var(--line);border-radius:var(--pill);background:#fff;overflow:hidden}
.woocommerce .quantity.lipo-qty input.qty{
  width:46px;text-align:center;border:0;background:none;padding:0;height:42px;
  font-family:inherit;font-size:15.4px;color:var(--ink);-moz-appearance:textfield}
.woocommerce .quantity.lipo-qty input.qty::-webkit-outer-spin-button,
.woocommerce .quantity.lipo-qty input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.woocommerce .quantity.lipo-qty input.qty:focus{outline:none;box-shadow:none}
.woocommerce .quantity.lipo-qty .lipo-step{
  width:38px;height:42px;border:0;background:none;cursor:pointer;
  font-family:inherit;font-size:17px;line-height:1;color:var(--mut);transition:.15s}
.woocommerce .quantity.lipo-qty .lipo-step:hover{color:var(--o)}

@media(max-width:900px){
  .woocommerce-cart .hero-container.site-container,
  .woocommerce-checkout .hero-container.site-container,
  .woocommerce-account .hero-container.site-container,
  .woocommerce-cart .content-container.site-container,
  .woocommerce-checkout .content-container.site-container,
  .woocommerce-account .content-container.site-container{padding-left:20px;padding-right:20px}
  .woocommerce-cart .site-main,
  .woocommerce-checkout .site-main,
  .woocommerce-account .site-main{padding-top:28px}
}

/* ---- stop the design system's section rhythm leaking into the theme
   The theme's page hero is a <section>, so the design's
   section{padding:83.6px 0} was adding 84px of white above and below the
   grey band. Reset it on the screens the theme still owns. */
.woocommerce-cart .entry-hero,
.woocommerce-checkout .entry-hero,
.woocommerce-account .entry-hero{padding:0}
.woocommerce-cart .entry-hero-container-inner,
.woocommerce-checkout .entry-hero-container-inner,
.woocommerce-account .entry-hero-container-inner{background:var(--grey2)}
.woocommerce-cart .hero-section-overlay,
.woocommerce-checkout .hero-section-overlay,
.woocommerce-account .hero-section-overlay,
.woocommerce-cart .hero-container.site-container,
.woocommerce-checkout .hero-container.site-container,
.woocommerce-account .hero-container.site-container{background:transparent}

/* the theme stacks a 48px margin on .content-area on top of our
   .site-main padding - one gap is enough */
.woocommerce-cart .content-area,
.woocommerce-checkout .content-area,
.woocommerce-account .content-area{margin-top:0;margin-bottom:56px}
.woocommerce-cart .site-main,
.woocommerce-checkout .site-main,
.woocommerce-account .site-main{padding-top:44px}

/* the theme's JS adds .spinners-added and forces inline-block, which
   breaks the stepper's vertical centring - out-specify it */
.woocommerce table.shop_table td .quantity.lipo-qty,.woocommerce .quantity.lipo-qty.spinners-added{display:inline-flex;align-items:center}

/* ---- the design's site-header styling was leaking onto theme page headers
   The theme's page hero contains <header class="entry-header">, so the
   design's header{} rule painted it white with a bottom border - showing as
   a stray inset line under the page title. Reset it on theme-owned screens. */
.woocommerce-cart .entry-header,
.woocommerce-checkout .entry-header,
.woocommerce-account .entry-header,
.woocommerce .woocommerce-products-header{
  position:static;background:transparent;border:0;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;height:auto;z-index:auto}