/* =====================================================================
   Hootone Remedies — design system
   ===================================================================== */
:root{
  --green:#00A651; --green-700:#0B7A3B; --green-800:#085C2D; --green-900:#0F2E1F;
  --mint:#E8F7EE; --mint-2:#D2EFDD; --forest:#0F2E1F; --forest-2:#143A28;
  --navy:#1F3A93; --teal:#0E7C86; --gold:#C9A227; --gold-2:#E9D27A; --clay:#F6F1E7; --clay-2:#EFE6D4;
  --ink:#0F172A; --ink-2:#334155; --muted:#64748B; --line:#E2E8F0; --bg:#FFFFFF; --bg-2:#F8FAFC;
  --danger:#DC2626; --ok:#16A34A;
  --ff-d:'Newsreader',Georgia,'Times New Roman',serif; --ff-b:'Inter',system-ui,-apple-system,sans-serif;
  --r:14px; --r-lg:24px; --r-xl:32px;
  --sh-1:0 1px 2px rgba(15,23,42,.06),0 1px 3px rgba(15,23,42,.1);
  --sh-2:0 10px 30px -10px rgba(15,23,42,.18);
  --sh-3:0 30px 60px -20px rgba(15,23,42,.3);
  --ease:cubic-bezier(.22,1,.36,1); --t:.25s var(--ease);
  --container:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--ff-b);font-size:16px;line-height:1.6;color:var(--ink);background:var(--bg);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--ff-d);font-weight:600;line-height:1.1;letter-spacing:-.015em}
h1{font-size:clamp(2.4rem,5.5vw,4.4rem)}
h2{font-size:clamp(1.9rem,3.6vw,3rem)}
h3{font-size:clamp(1.35rem,2.2vw,1.8rem)}
h4{font-size:1.15rem;font-family:var(--ff-b);font-weight:700}
h5{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.container{width:min(var(--container),calc(100% - 2.5rem));margin-inline:auto}
.narrow{width:min(820px,calc(100% - 2.5rem));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--green-700);color:#fff;padding:.5rem 1rem;z-index:9999}
.skip:focus{left:0}
.hide-sm{display:inline-flex}.hide-md{display:inline-flex}
@media(max-width:640px){.hide-sm{display:none!important}}
@media(max-width:980px){.hide-md{display:none!important}}
[data-lucide],svg.lucide{width:1.1em;height:1.1em;vertical-align:-.18em;stroke-width:2}
.kicker{display:inline-flex;align-items:center;gap:.5rem;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--green-700)}
.kicker::before{content:"";width:28px;height:2px;background:currentColor;border-radius:2px}
.lead{font-size:1.15rem;color:var(--ink-2);max-width:62ch}
.sec{padding:clamp(4rem,8vw,7rem) 0}
.sec--tight{padding:clamp(2.5rem,5vw,4rem) 0}
.sec-h{max-width:720px;margin-bottom:3rem}
.sec-h h2{margin:.6rem 0 1rem}
.center{text-align:center}.center .sec-h{margin-inline:auto}.center .kicker{justify-content:center}
.grid{display:grid;gap:1.5rem}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
.num{font-variant-numeric:tabular-nums}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.8rem 1.35rem;border-radius:999px;font-weight:600;font-size:.95rem;border:1.5px solid transparent;cursor:pointer;transition:transform var(--t),box-shadow var(--t),background var(--t),color var(--t);white-space:nowrap;line-height:1.2;min-height:44px}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0) scale(.98)}
.btn--primary{background:var(--green-700);color:#fff;box-shadow:0 8px 20px -8px rgba(11,122,59,.6)}
.btn--primary:hover{background:var(--green-800)}
.btn--light{background:#fff;color:var(--green-800)}
.btn--ghost{border-color:var(--line);background:transparent;color:var(--ink)}
.btn--ghost:hover{border-color:var(--green-700);color:var(--green-700)}
.btn--outline-light{border-color:rgba(255,255,255,.45);color:#fff}
.btn--outline-light:hover{background:rgba(255,255,255,.12)}
.btn--wa{background:#25D366;color:#0b3b22}
.btn--gold{background:var(--gold);color:#1a1405}
.btn--dark{background:var(--ink);color:#fff}
.btn--lg{padding:1rem 1.8rem;font-size:1.05rem}
.btn--sm{padding:.5rem .95rem;font-size:.85rem;min-height:36px}
.btn--block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

/* ---------- topbar / header ---------- */
.topbar{background:var(--forest);color:#cfe9d9;font-size:.8rem}
.topbar__in{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:1rem}
.topbar__left,.topbar__right{display:flex;gap:1.25rem;align-items:center}
.topbar span,.topbar a{display:inline-flex;gap:.4rem;align-items:center}
.topbar a:hover{color:#fff}
.cur a{padding:.15rem .5rem;border-radius:6px;opacity:.7}.cur a.on{background:rgba(255,255,255,.12);opacity:1}
.hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid transparent;transition:box-shadow var(--t),border-color var(--t),background var(--t)}
.hdr.is-scrolled{border-color:var(--line);box-shadow:var(--sh-1)}
.hdr__in{display:flex;align-items:center;gap:1.25rem;min-height:78px}
.logo{display:flex;align-items:center;flex:0 0 auto;line-height:0;min-width:170px}
.logo img{display:block;width:170px;height:auto;border-radius:10px;padding:0;background:transparent;transition:background var(--t),padding var(--t)}
.nav{flex:1}
.nav>ul{display:flex;gap:.25rem;justify-content:center}
.nav>ul>li{position:relative}
.nav a{display:inline-flex;align-items:center;gap:.25rem;padding:.55rem .85rem;border-radius:999px;font-weight:500;font-size:.95rem;transition:background var(--t),color var(--t)}
.nav a:hover,.nav a.on{background:var(--mint);color:var(--green-800)}
.hdr__cta{display:flex;gap:.6rem;align-items:center}
.burger{display:none;width:44px;height:44px;border:0;background:transparent;flex-direction:column;justify-content:center;gap:5px;cursor:pointer}
.burger span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:var(--t)}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
/* mega — anchored to the header, never to the nav item, so it can't leave the viewport */
.mega{position:absolute;left:0;right:0;top:100%;opacity:0;visibility:hidden;pointer-events:none;
      transform:translateY(12px);transition:opacity .2s,transform .25s var(--ease),visibility .2s}
.mega>.container{width:min(1080px,calc(100% - 2.5rem));background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:1.5rem;color:var(--ink)}
.hdr:has(.has-mega:hover) .mega,.hdr:has(.has-mega:focus-within) .mega,.mega:hover,.mega:focus-within,.mega.open{opacity:1;visibility:visible;transform:translateY(6px);pointer-events:auto}
.mega__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.2fr);gap:1.5rem}
.mega__h{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.mega__col a{display:flex;flex-direction:column;padding:.45rem .6rem;border-radius:10px;gap:0;color:var(--ink)}
.mega__col a strong{font-size:.92rem;font-weight:600}
.mega__col a span{font-size:.75rem;color:var(--muted)}
.mega__col a:hover{background:var(--mint)}
.mega__promo{position:relative;border-radius:16px;overflow:hidden;background:var(--forest);color:#fff;min-height:220px;display:flex;align-items:flex-end}
.mega__promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62}
.mega__promo::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,26,17,.94) 0%,rgba(6,26,17,.6) 45%,rgba(6,26,17,.15) 100%)}
.mega__promo div{position:relative;z-index:1;padding:1.1rem;display:flex;flex-direction:column;gap:.4rem}
.mega__promo small{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#9be4bb}
.mega__promo strong{font-family:var(--ff-d);font-size:1.2rem;font-weight:500;color:#fff}
@media(max-width:1100px){.mega__grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mega__promo{display:none}}

/* mobile drawer */
.mnav{position:fixed;inset:0;background:#fff;z-index:120;padding:1.25rem 1.5rem 2.5rem;transform:translateY(-100%);visibility:hidden;overflow-y:auto;overscroll-behavior:contain;transition:transform .4s var(--ease),visibility .4s;display:flex;flex-direction:column;gap:1.1rem}
.mnav.open{transform:none;visibility:visible}
@media(min-width:981px){.mnav{display:none}}
.mnav__top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-bottom:.5rem}
.mnav__top img{width:150px;height:auto}
.mnav__close{width:48px;height:48px;border:1px solid var(--line);background:#fff;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--ink)}
.mnav__close i,.mnav__close svg{width:22px;height:22px}
.mnav__cta{width:100%}
.mnav__list a,.mnav__toggle{display:block;width:100%;padding:.95rem 0;font-size:1.3rem;font-family:var(--ff-d);border-bottom:1px solid var(--line);min-height:52px;text-align:left;background:none;border-top:0;border-left:0;border-right:0;cursor:pointer}
.mnav__toggle{display:flex;align-items:center;justify-content:space-between}
.mnav__toggle i,.mnav__toggle svg{transition:transform var(--t);width:20px;height:20px}
.mnav__toggle[aria-expanded=true] i,.mnav__toggle[aria-expanded=true] svg{transform:rotate(180deg)}
.mnav__sub{display:none;padding:.35rem 0 .6rem}
.mnav__sub.open{display:block}
.mnav__sub a{display:flex!important;flex-direction:column;gap:.1rem;padding:.7rem .9rem!important;font-family:var(--ff-b)!important;font-size:1rem!important;border:0!important;border-radius:12px;background:var(--bg-2);margin-bottom:.4rem;min-height:52px}
.mnav__sub a strong{font-weight:600;font-size:.98rem}
.mnav__sub a span{font-size:.78rem;color:var(--muted)}
.mnav__cur{display:flex;gap:.5rem}
.mnav__cur a{flex:1;text-align:center;padding:.8rem;border:1px solid var(--line);border-radius:999px;font-weight:600;min-height:48px;display:flex;align-items:center;justify-content:center}
.mnav__cur a.on{background:var(--mint);border-color:var(--green-700);color:var(--green-800)}
body.mnav-open{overflow:hidden}
/* burger sits above the drawer and always contrasts with what is behind it */
.burger{position:relative;z-index:130}
.mnav-open .burger span,.theme-dark .mnav-open .hdr .burger span{background:var(--ink)!important}
@media(max-width:980px){.nav,.hdr__cta .btn--primary{display:none}.burger{display:flex}.hdr__in{min-height:68px}.logo img{width:140px}}

/* dark-theme header (for pages with dark heroes) */
.theme-dark .hdr:not(.is-scrolled){background:transparent;border-color:transparent}
.theme-dark .hdr:not(.is-scrolled) .nav a{color:#fff}
.theme-dark .hdr:not(.is-scrolled) .nav a:hover,.theme-dark .hdr:not(.is-scrolled) .nav a.on{background:rgba(255,255,255,.12);color:#fff}
.theme-dark .hdr:not(.is-scrolled) .btn--ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.theme-dark .hdr:not(.is-scrolled) .burger span{background:#fff}
.theme-dark .hdr:not(.is-scrolled) .logo img{background:#fff;padding:7px 11px}
.theme-dark .hdr:not(.is-scrolled) .mega{color:var(--ink)}
.theme-dark .hdr:not(.is-scrolled) .mega a{color:var(--ink)}

/* ---------- full-background hero (home) ---------- */
.vhero{position:relative;isolation:isolate;color:#fff;margin-top:-78px;padding-top:78px;min-height:min(100svh,940px);display:flex;flex-direction:column;overflow:hidden}
.vhero__bg{position:absolute;inset:-8% 0;z-index:-2}
.vhero__bg img{width:100%;height:100%;object-fit:cover;object-position:center}
.vhero__scrim{position:absolute;inset:0;background:
   linear-gradient(100deg,rgba(7,30,19,.92) 0%,rgba(7,30,19,.74) 40%,rgba(7,30,19,.3) 72%,rgba(7,30,19,.5) 100%),
   linear-gradient(180deg,rgba(5,20,13,.8) 0%,rgba(5,20,13,.05) 32%,rgba(5,20,13,.7) 100%)}
.vhero__in{position:relative;z-index:1;flex:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:3rem;align-items:center;padding:3rem 0 3.5rem}
.vhero__copy{max-width:54ch}
.vhero h1{font-size:clamp(2.1rem,3.9vw,3.5rem);line-height:1.05}
.vhero .kicker{color:#9be4bb}
.vhero h1{margin:.9rem 0 1.1rem;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.vhero h1 em{font-style:italic;color:#6EDB9B}
.vhero .lead{color:rgba(255,255,255,.84);max-width:54ch;font-size:1.05rem}
.vhero__btns{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.6rem 0 1.4rem}
.vhero__proof{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;font-size:.9rem;color:rgba(255,255,255,.85)}
.vhero__proof .avatars{display:flex}
.vhero__proof .avatars img{width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,255,255,.85);object-fit:cover;margin-left:-12px}
.vhero__proof .avatars img:first-child{margin-left:0}
.vhero__proof small{color:rgba(255,255,255,.6)}
.vhero__card{justify-self:end;width:min(100%,370px);background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-radius:var(--r-xl);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:1.5rem;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 30px 70px -25px rgba(0,0,0,.7)}
.vhero__card-tag{align-self:flex-start;background:var(--gold);color:#1a1405;font-size:.7rem;font-weight:800;letter-spacing:.05em;padding:.3rem .7rem;border-radius:999px}
.vhero__card>img{width:100%;aspect-ratio:16/11;object-fit:contain;background:rgba(255,255,255,.92);border-radius:16px;padding:.5rem}
.vhero__card strong{font-size:1.25rem;font-weight:700}
.vhero__card p{font-size:.88rem;color:rgba(255,255,255,.75)}
.vhero__card-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.3rem}
.vhero__card .price{color:#fff;font-size:1.5rem}
.vhero__card .price small{color:rgba(255,255,255,.65)}
.vhero__strip{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.16);background:rgba(6,24,15,.42);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.vhero__strip .container{display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between;gap:1.6rem;padding-block:1.1rem}
@media(min-width:981px){.vhero__strip .container{padding-right:215px}}
.vhero__strip span{display:flex;gap:.5rem;align-items:center;font-size:.85rem;color:rgba(255,255,255,.72);white-space:nowrap}
.vhero__strip b{color:#fff;font-weight:700;white-space:nowrap}
.vhero__strip i{color:#6EDB9B;flex:none}
@media(max-width:1100px){.vhero__in{grid-template-columns:1fr;gap:2rem}.vhero__card{justify-self:start;width:min(100%,420px)}.vhero__copy{max-width:none}}
@media(max-width:980px){.vhero__strip span{white-space:normal}.vhero{min-height:0;margin-top:-68px;padding-top:68px}.vhero__scrim{background:linear-gradient(180deg,rgba(6,24,15,.9) 0%,rgba(6,24,15,.7) 45%,rgba(6,24,15,.92) 100%)}.vhero__strip .container{grid-template-columns:1fr 1fr;gap:.9rem}}
@media(max-width:640px){
  .vhero__in{padding:2.25rem 0 2.5rem;gap:1.6rem}
  .vhero__btns .btn{width:100%}
  .vhero__strip .container{grid-template-columns:1fr;gap:.65rem;padding-block:.9rem}
  .vhero__card{width:100%;padding:1.1rem;gap:.45rem;flex-direction:row;flex-wrap:wrap;align-items:center}
  .vhero__card-tag{order:-1;flex:0 0 100%;background:none;color:var(--gold-2);padding:0;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
  .vhero__card>img{width:104px;aspect-ratio:1;padding:.35rem;flex:none}
  .vhero__card strong{flex:1;min-width:0;font-size:1.1rem}
  .vhero__card p{width:100%;font-size:.84rem}
  .vhero__card-foot{width:100%}
  .vhero__card .price{font-size:1.3rem}
}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;border-block:1px solid var(--line);background:#fff;padding:1rem 0}
.marquee__track{display:flex;gap:3rem;width:max-content;animation:mq 40s linear infinite}
.marquee__track span{display:inline-flex;align-items:center;gap:.6rem;font-weight:600;color:var(--ink-2);white-space:nowrap}
.marquee__track span i{color:var(--green)}
@keyframes mq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee__track{animation:none}}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.stat{padding:1.6rem;border-radius:var(--r-lg);background:var(--bg-2);border:1px solid var(--line)}
.stat b{display:block;font-family:var(--ff-d);font-size:2.6rem;font-weight:600;color:var(--green-800);line-height:1}
.stat>span{color:var(--muted);font-size:.9rem}.stat b span{font:inherit;color:inherit}
@media(max-width:980px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ---------- bento ---------- */
.bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(190px,auto);gap:1.2rem}
.b{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--bg-2);border:1px solid var(--line);padding:1.6rem;display:flex;flex-direction:column;justify-content:flex-end;gap:.4rem;transition:transform var(--t),box-shadow var(--t)}
.b:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.b img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .8s var(--ease)}
.b:hover img{transform:scale(1.05)}
.b--img{color:#fff;min-height:320px}
.b--img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.7));z-index:1}
.b>*:not(img){position:relative;z-index:2}
.b h3{font-size:1.4rem}.b p{font-size:.95rem;opacity:.9}
.b .ic{width:46px;height:46px;border-radius:14px;background:var(--mint);color:var(--green-700);display:grid;place-items:center;margin-bottom:auto}
.b--green{background:var(--green-700);color:#fff;border-color:transparent}.b--green .ic{background:rgba(255,255,255,.15);color:#fff}
.b--forest{background:var(--forest);color:#fff;border-color:transparent}.b--forest .ic{background:rgba(255,255,255,.12);color:#9be4bb}
.b--gold{background:linear-gradient(135deg,#FFF6D6,#F7E9B4);border-color:#EAD98F}.b--gold .ic{background:#fff;color:#8a6a00}
.s6{grid-column:span 6}.s4{grid-column:span 4}.s3{grid-column:span 3}.s8{grid-column:span 8}.s12{grid-column:span 12}.r2{grid-row:span 2}
@media(max-width:980px){.s6,.s4,.s3,.s8{grid-column:span 6}}
@media(max-width:640px){.s6,.s4,.s3,.s8{grid-column:span 12}.r2{grid-row:auto}}

/* ---------- product cards ---------- */
.pcard{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--sh-2);border-color:var(--mint-2)}
.pcard__img{aspect-ratio:1;background:linear-gradient(180deg,#F4F8F5,#fff);display:grid;place-items:center;padding:1.2rem;position:relative}
.pcard__img img{max-height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .6s var(--ease)}
.pcard:hover .pcard__img img{transform:scale(1.06) rotate(-2deg)}
.pcard__tag{position:absolute;top:.9rem;left:.9rem;background:var(--mint);color:var(--green-800);font-size:.72rem;font-weight:700;padding:.3rem .6rem;border-radius:999px;letter-spacing:.04em}
.pcard__flag{position:absolute;top:.9rem;right:.9rem;background:var(--gold);color:#1a1405;font-size:.7rem;font-weight:800;padding:.3rem .6rem;border-radius:999px}
.pcard__body{padding:1.2rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.pcard__body h3{font-size:1.25rem;font-family:var(--ff-b);font-weight:700}
.pcard__body p{font-size:.9rem;color:var(--muted);flex:1}
.pcard__cond{display:flex;flex-wrap:wrap;gap:.35rem}
.pcard__cond span{font-size:.72rem;background:var(--bg-2);border:1px solid var(--line);padding:.2rem .5rem;border-radius:6px;color:var(--ink-2)}
.pcard__foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.5rem}
.price{font-family:var(--ff-d);font-size:1.5rem;font-weight:600;color:var(--green-800)}
.price small{font-size:.75rem;font-family:var(--ff-b);color:var(--muted);font-weight:500;display:block;line-height:1}

/* ---------- testimonials ---------- */
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.6rem;display:flex;flex-direction:column;gap:1rem;height:100%}
.tcard p{font-size:1rem;color:var(--ink-2);flex:1}
.tcard__who{display:flex;gap:.8rem;align-items:center}
.tcard__who img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.tcard__who strong{display:block;font-size:.95rem}.tcard__who small{color:var(--muted)}
.tcard .tag{align-self:flex-start;font-size:.72rem;font-weight:700;background:var(--mint);color:var(--green-800);padding:.25rem .6rem;border-radius:999px}
.swiper{padding:.5rem .25rem 3rem}
.swiper-pagination-bullet-active{background:var(--green-700)}
.swiper-button-next,.swiper-button-prev{color:var(--green-700);width:44px;height:44px;border-radius:50%;background:#fff;box-shadow:var(--sh-1)}
.swiper-button-next::after,.swiper-button-prev::after{font-size:1rem;font-weight:800}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;counter-reset:s}
.step{position:relative;padding:1.8rem 1.5rem 1.5rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg)}
.step::before{counter-increment:s;content:"0" counter(s);font-family:var(--ff-d);font-size:2.4rem;color:var(--mint-2);position:absolute;top:.6rem;right:1rem;font-weight:700;line-height:1}
.step .ic{width:46px;height:46px;border-radius:14px;background:var(--mint);color:var(--green-700);display:grid;place-items:center;margin-bottom:1rem}
.step h4{margin-bottom:.4rem}.step p{font-size:.92rem;color:var(--muted)}
@media(max-width:980px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.steps{grid-template-columns:1fr}}

/* ---------- split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.split.rev>.split__img{order:2}
.split__img{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-3);aspect-ratio:4/3.4}
.split__img img{width:100%;height:100%;object-fit:cover}
.split h2{margin:.6rem 0 1rem}
.checks{display:grid;gap:.7rem;margin:1.4rem 0}
.checks li{display:flex;gap:.7rem;align-items:flex-start}
.checks li i{color:var(--green);flex:none;margin-top:.2rem}
@media(max-width:980px){.split{grid-template-columns:1fr;gap:2rem}.split.rev>.split__img{order:0}}

/* ---------- page hero (generic) ---------- */
.phero{position:relative;overflow:hidden;color:#fff;background:var(--forest);padding:clamp(5rem,12vw,9rem) 0 clamp(3rem,6vw,5rem);margin-top:-78px}
.phero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,46,31,.2),rgba(15,46,31,.9))}
.phero .container{position:relative;z-index:2;padding-top:78px}
.phero .kicker{color:#9be4bb}
.phero h1{margin:.8rem 0 1rem;max-width:16ch}
.phero p{max-width:58ch;font-size:1.12rem;opacity:.9}
.crumbs{font-size:.82rem;opacity:.8;display:flex;gap:.5rem;margin-bottom:1rem}
.crumbs a:hover{text-decoration:underline}

/* ---------- product detail ---------- */
.pd{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.pd__gallery{position:sticky;top:100px}
.pd__main{border-radius:var(--r-xl);background:linear-gradient(180deg,#F4F8F5,#fff);border:1px solid var(--line);aspect-ratio:1;display:grid;place-items:center;padding:2rem;overflow:hidden}
.pd__main img{max-height:100%;object-fit:contain;mix-blend-mode:multiply}
.pd__thumbs{display:flex;gap:.7rem;margin-top:.8rem}
.pd__thumbs button{width:80px;height:80px;border-radius:14px;border:2px solid var(--line);background:#fff;overflow:hidden;padding:0;cursor:pointer}
.pd__thumbs button.on{border-color:var(--green-700)}
.pd__thumbs img{width:100%;height:100%;object-fit:cover}
.pd__info h1{font-family:var(--ff-b);font-weight:800;font-size:clamp(1.9rem,3.2vw,2.6rem);letter-spacing:-.02em;margin:.5rem 0}
.pd__info .lead{margin-bottom:1.2rem}
.pd__price{display:flex;align-items:baseline;gap:1rem;margin:1rem 0}
.pd__price .price{font-size:2.4rem}
.pd__meta{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:1rem 0 1.4rem}
.pd__meta div{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:.7rem .9rem;font-size:.88rem}
.pd__meta small{display:block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
.qty{display:inline-flex;border:1.5px solid var(--line);border-radius:999px;overflow:hidden}
.qty button{width:44px;height:44px;border:0;background:#fff;cursor:pointer;font-size:1.2rem}
.qty input{width:54px;text-align:center;border:0;font-weight:700}
.pd__buy{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center}
.trust-row{display:flex;gap:1.2rem;flex-wrap:wrap;margin-top:1.2rem;font-size:.85rem;color:var(--muted)}
.trust-row span{display:inline-flex;gap:.4rem;align-items:center}.trust-row i{color:var(--green)}
.benefits{display:grid;gap:.6rem;margin:1rem 0}
.benefits li{display:flex;gap:.6rem;align-items:flex-start;background:var(--mint);border-radius:12px;padding:.7rem .9rem;font-size:.95rem}
.benefits li i{color:var(--green-700);flex:none;margin-top:.15rem}
@media(max-width:980px){.pd{grid-template-columns:1fr;gap:2rem}.pd__gallery{position:static}}
.buybar{position:fixed;left:0;right:0;bottom:0;z-index:90;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(100%);transition:transform .35s var(--ease)}
.buybar.show{transform:none}
.buybar__in{display:flex;align-items:center;gap:1rem;padding:.7rem 0}
.buybar__in img{width:48px;height:48px;object-fit:contain}
.buybar__in strong{display:block;font-size:.95rem}.buybar__in small{color:var(--muted)}
.buybar__in .btn{margin-left:auto}
.tabs{display:flex;gap:.4rem;border-bottom:1px solid var(--line);margin-bottom:2rem;overflow-x:auto}
.tabs button{border:0;background:none;padding:.9rem 1.1rem;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;margin-bottom:-1px}
.tabs button.on{color:var(--green-800);border-color:var(--green-700)}
.tabpanel{display:none}.tabpanel.on{display:block;animation:fade .4s var(--ease)}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.prose{max-width:72ch}.prose p{margin-bottom:1rem;color:var(--ink-2)}.prose h3{margin:2rem 0 .8rem}
.tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.tbl th,.tbl td{padding:.75rem .9rem;border-bottom:1px solid var(--line);text-align:left}
.tbl th{background:var(--bg-2);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.tbl tr:hover td{background:#FAFCFB}
.markers{display:flex;gap:.6rem;flex-wrap:wrap}
.markers span{background:var(--forest);color:#fff;padding:.45rem .85rem;border-radius:999px;font-size:.85rem;display:inline-flex;gap:.4rem;align-items:center}
/* flagship hero */
.fhero{position:relative;background:radial-gradient(1200px 600px at 80% 20%,rgba(0,166,81,.35),transparent 60%),var(--forest);color:#fff;margin-top:-78px;padding-top:78px;overflow:hidden}
.fhero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;mix-blend-mode:luminosity}
.fhero__in{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;padding:4rem 0;min-height:min(72vh,760px)}
.fhero .kicker{color:#9be4bb}
.fhero h1{font-family:var(--ff-b);font-weight:800;letter-spacing:-.02em;margin:.6rem 0 1rem}
.fhero .lead{color:rgba(255,255,255,.85)}
.fhero__pack{position:relative;display:grid;place-items:center}
.fhero__pack img{max-height:520px;filter:drop-shadow(0 40px 60px rgba(0,0,0,.5));border-radius:20px}
.fhero__glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(0,166,81,.55),transparent 65%);filter:blur(30px)}
.fhero__pills{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.5rem}
.fhero__pills span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:.4rem .8rem;border-radius:999px;font-size:.85rem}
.fhero__price{display:flex;align-items:center;gap:1.2rem;margin:1.2rem 0}
.fhero__price .price{color:#fff;font-size:2.6rem}
@media(max-width:980px){.fhero__in{grid-template-columns:1fr;min-height:0}.fhero__pack img{max-height:340px}}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;position:relative}
.timeline::before{content:"";position:absolute;left:0;right:0;top:22px;height:2px;background:linear-gradient(90deg,var(--green),var(--gold))}
.tl{position:relative;padding-top:3rem}
.tl::before{content:"";position:absolute;top:12px;left:0;width:22px;height:22px;border-radius:50%;background:#fff;border:5px solid var(--green-700)}
.tl b{display:block;font-family:var(--ff-d);font-size:1.3rem}.tl span{color:var(--muted);font-size:.9rem}
@media(max-width:980px){.timeline{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.timeline{grid-template-columns:1fr}.timeline::before{display:none}}

/* ---------- filters ---------- */
.chips{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}
.chip{border:1.5px solid var(--line);background:#fff;padding:.5rem 1rem;border-radius:999px;font-weight:600;font-size:.88rem;cursor:pointer;transition:var(--t);min-height:40px}
.chip.on,.chip:hover{background:var(--green-700);color:#fff;border-color:var(--green-700)}
.search{display:flex;align-items:center;gap:.6rem;border:1.5px solid var(--line);border-radius:999px;padding:.2rem .4rem .2rem 1rem;background:#fff;max-width:420px}
.search input{border:0;outline:0;flex:1;min-height:40px}
.cond-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.cond{display:flex;gap:1rem;padding:1.2rem;border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;transition:var(--t);align-items:center}
.cond:hover{border-color:var(--green-700);transform:translateY(-3px);box-shadow:var(--sh-2)}
.cond img{width:72px;height:72px;border-radius:14px;object-fit:cover;flex:none}
.cond strong{display:block}.cond small{color:var(--muted)}
@media(max-width:980px){.cond-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.cond-grid{grid-template-columns:1fr}}

/* ---------- forms ---------- */
.form{display:grid;gap:1rem}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:640px){.form .row{grid-template-columns:1fr}}
.field label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.35rem}
.field label em{color:var(--danger);font-style:normal}
.field input,.field select,.field textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:.8rem .95rem;background:#fff;min-height:48px;transition:border-color var(--t),box-shadow var(--t)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--green-700);box-shadow:0 0 0 4px rgba(0,166,81,.15)}
.field small{display:block;color:var(--muted);font-size:.78rem;margin-top:.3rem}
.field.err input,.field.err select{border-color:var(--danger)}
.field .msg{color:var(--danger);font-size:.8rem;margin-top:.3rem}
.hp{position:absolute;left:-9999px}
.alert{padding:1rem 1.2rem;border-radius:14px;display:flex;gap:.7rem;align-items:flex-start}
.alert--err{background:#FEF2F2;color:#991B1B;border:1px solid #FECACA}
.alert--ok{background:var(--mint);color:var(--green-900);border:1px solid var(--mint-2)}
.order-layout{display:grid;grid-template-columns:1fr 380px;gap:3rem;align-items:start}
@media(max-width:980px){.order-layout{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;box-shadow:var(--sh-1)}
.card--sticky{position:sticky;top:100px}
.summary{display:flex;gap:1rem;align-items:center}
.summary img{width:72px;height:72px;object-fit:contain;border-radius:14px;background:var(--bg-2);padding:.3rem}
.summary strong{display:block}.summary small{color:var(--muted)}
.summary-rows{margin-top:1rem;border-top:1px dashed var(--line);padding-top:1rem;display:grid;gap:.5rem;font-size:.95rem}
.summary-rows div{display:flex;justify-content:space-between}
.summary-rows .tot{font-weight:800;font-size:1.15rem;border-top:1px solid var(--line);padding-top:.6rem;margin-top:.3rem}
.trustlist{display:grid;gap:.6rem;margin-top:1.2rem;font-size:.88rem;color:var(--ink-2)}
.trustlist li{display:flex;gap:.6rem;align-items:center}.trustlist i{color:var(--green)}
.doorsel{display:flex;gap:.6rem;margin-bottom:1.5rem}
.doorsel a{flex:1;text-align:center;padding:.9rem;border:1.5px solid var(--line);border-radius:14px;font-weight:600;font-size:.92rem}
.doorsel a.on{border-color:var(--green-700);background:var(--mint);color:var(--green-800)}
.repcard{display:flex;gap:1rem;align-items:center;background:var(--mint);border-radius:16px;padding:1rem;margin:1rem 0}
.repcard .av{width:54px;height:54px;border-radius:50%;background:var(--green-700);color:#fff;display:grid;place-items:center;font-weight:800;font-size:1.2rem;flex:none}
.repcard strong{display:block}.repcard small{color:var(--ink-2);display:block}
/* modal */
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:1rem}
.modal.open{display:flex}
.modal__bg{position:absolute;inset:0;background:rgba(15,23,42,.6);backdrop-filter:blur(4px);animation:fade .2s}
.modal__box{position:relative;background:#fff;border-radius:var(--r-xl);padding:2.2rem;width:min(760px,100%);box-shadow:var(--sh-3);animation:pop .35s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
.modal__x{position:absolute;top:1rem;right:1rem;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;display:grid;place-items:center}
.modal__kicker{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--green-700);font-weight:700}
.modal h3{margin:.3rem 0 .2rem}
.modal__prod{color:var(--muted);margin-bottom:1.4rem}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.door{display:flex;flex-direction:column;gap:.5rem;padding:1.4rem;border:2px solid var(--line);border-radius:20px;transition:var(--t);background:#fff}
.door:hover{border-color:var(--green-700);transform:translateY(-3px);box-shadow:var(--sh-2)}
.door--alt:hover{border-color:var(--navy)}
.door__ic{width:48px;height:48px;border-radius:14px;background:var(--mint);color:var(--green-700);display:grid;place-items:center}
.door--alt .door__ic{background:#E8EDFB;color:var(--navy)}
.door strong{font-size:1.1rem}.door span:not(.door__ic){font-size:.88rem;color:var(--muted)}
.door em{font-style:normal;font-weight:700;color:var(--green-700);margin-top:.3rem}.door--alt em{color:var(--navy)}
.modal__foot{margin-top:1.2rem;font-size:.82rem;color:var(--muted);display:flex;gap:.4rem;align-items:center}
@media(max-width:640px){.doors{grid-template-columns:1fr}.modal__box{padding:1.5rem}}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:.7rem}
.faq details{border:1px solid var(--line);border-radius:16px;background:#fff;padding:0 1.3rem;transition:var(--t)}
.faq details[open]{border-color:var(--green-700);box-shadow:var(--sh-1)}
.faq summary{cursor:pointer;list-style:none;padding:1.1rem 0;font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;color:var(--green-700);font-weight:300;transition:transform var(--t)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 1.2rem;color:var(--ink-2)}

/* ---------- about / science / awards moods ---------- */
.clay{background:var(--clay)}
.mintbg{background:var(--mint)}
.dark{background:var(--forest);color:#fff}
.dark .kicker{color:#9be4bb}.dark .lead{color:rgba(255,255,255,.8)}.dark h5{color:#9be4bb}
.navybg{background:radial-gradient(900px 500px at 10% 0%,rgba(14,124,134,.4),transparent 60%),#0B1A2E;color:#fff}
.navybg .kicker{color:#7FD6DD}.navybg .lead{color:rgba(255,255,255,.8)}
.blackgold{background:radial-gradient(800px 400px at 50% 0%,rgba(201,162,39,.25),transparent 60%),#0B0B0C;color:#F5ECCF}
.blackgold .kicker{color:var(--gold)}
.award{border:1px solid rgba(201,162,39,.35);border-radius:var(--r-lg);padding:2rem 1.6rem;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0));text-align:center}
.award .yr{font-family:var(--ff-d);font-size:3rem;color:var(--gold);line-height:1}
.award h3{margin:.6rem 0 .4rem;font-size:1.2rem;color:#fff}.award p{font-size:.9rem;opacity:.75}
.award .ic{width:60px;height:60px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;margin:0 auto 1rem}
.hist{display:grid;gap:0;position:relative;padding-left:2rem;border-left:2px solid var(--green-700)}
.hist li{position:relative;padding:0 0 2rem 1.2rem}
.hist li::before{content:"";position:absolute;left:-2.55rem;top:.3rem;width:16px;height:16px;border-radius:50%;background:var(--green-700);box-shadow:0 0 0 5px var(--clay)}
.hist b{font-family:var(--ff-d);font-size:1.5rem;display:block;color:var(--green-800)}
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.member{text-align:center}
.member img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r-lg);margin-bottom:.8rem;filter:saturate(.9)}
.member strong{display:block}.member small{color:var(--muted)}
@media(max-width:980px){.team{grid-template-columns:repeat(2,1fr)}}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.gallery img{border-radius:var(--r-lg);aspect-ratio:4/3;object-fit:cover;width:100%}
.gallery .tall{grid-row:span 2}.gallery .tall img{aspect-ratio:auto;height:100%}
@media(max-width:640px){.gallery{grid-template-columns:1fr 1fr}}
.glass{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-lg);padding:1.6rem;backdrop-filter:blur(8px)}
.glass h4{color:#fff;margin-bottom:.4rem}.glass p{color:rgba(255,255,255,.75);font-size:.92rem}
.glass .ic{width:46px;height:46px;border-radius:14px;background:rgba(127,214,221,.15);color:#7FD6DD;display:grid;place-items:center;margin-bottom:1rem}
.mech{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.mech div{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1.2rem;text-align:center}
.mech b{display:block;font-family:var(--ff-d);font-size:1.1rem;color:#fff;margin-bottom:.3rem}.mech span{font-size:.82rem;opacity:.7}
@media(max-width:980px){.mech{grid-template-columns:repeat(2,1fr)}}
.ing-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.ing{border-radius:18px;overflow:hidden;background:#fff;border:1px solid var(--line)}
.ing img{aspect-ratio:1;object-fit:cover;width:100%}
.ing div{padding:.8rem .9rem}.ing strong{display:block;font-size:.92rem}.ing small{color:var(--muted);font-style:italic}
@media(max-width:980px){.ing-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.ing-grid{grid-template-columns:repeat(2,1fr)}}
.case{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;background:#fff;border-radius:var(--r-xl);padding:2.5rem;border:1px solid var(--line);box-shadow:var(--sh-2)}
.case .big{font-family:var(--ff-d);font-size:clamp(2.4rem,5vw,4rem);line-height:1;color:var(--green-800)}
.case .big small{font-size:1rem;font-family:var(--ff-b);color:var(--muted);display:block;margin-top:.4rem}
.case .arrow{display:flex;align-items:center;gap:1.5rem;margin:1.2rem 0}
.case img{border-radius:var(--r-lg);aspect-ratio:4/3;object-fit:cover;width:100%}
@media(max-width:980px){.case{grid-template-columns:1fr;padding:1.5rem}}
.twall{columns:3;column-gap:1.2rem}
.twall .tcard{break-inside:avoid;margin-bottom:1.2rem;height:auto}
@media(max-width:980px){.twall{columns:2}}@media(max-width:640px){.twall{columns:1}}
.region-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}
.region-tabs button{border:1.5px solid var(--line);background:#fff;padding:.6rem 1.1rem;border-radius:999px;font-weight:600;cursor:pointer;min-height:44px}
.region-tabs button.on{background:var(--forest);color:#fff;border-color:var(--forest)}
.region{display:none}.region.on{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;animation:fade .4s var(--ease)}
.region img{border-radius:var(--r-xl);aspect-ratio:16/11;object-fit:cover;width:100%}
@media(max-width:980px){.region.on{grid-template-columns:1fr}}
.reps{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.rep{display:flex;gap:.9rem;padding:1rem;border:1px solid var(--line);border-radius:16px;background:#fff;align-items:center}
.rep .av{width:46px;height:46px;border-radius:50%;background:var(--mint);color:var(--green-800);display:grid;place-items:center;font-weight:800;flex:none}
.rep strong{display:block;font-size:.95rem}.rep small{color:var(--muted);display:block;font-size:.8rem}
@media(max-width:980px){.reps{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.reps{grid-template-columns:1fr}}
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem}
@media(max-width:980px){.contact-grid{grid-template-columns:1fr}}
.cinfo{display:grid;gap:1rem}
.cinfo a,.cinfo div{display:flex;gap:.9rem;align-items:flex-start;padding:1.1rem;border:1px solid var(--line);border-radius:16px;background:#fff}
.cinfo .ic{width:44px;height:44px;border-radius:12px;background:var(--mint);color:var(--green-700);display:grid;place-items:center;flex:none}
.cinfo strong{display:block}.cinfo small{color:var(--muted)}
.map{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9}
.map iframe{width:100%;height:100%;border:0}

/* ---------- CTA band + footer ---------- */
.cta-band{background:linear-gradient(120deg,var(--green-800),var(--green-700) 60%,#17A05A);color:#fff;padding:4rem 0}
.cta-band__in{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center}
.cta-band small{text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;opacity:.8}
.cta-band h2{margin:.5rem 0 .8rem}.cta-band p{opacity:.9;max-width:52ch}
.cta-band__btns{display:flex;flex-direction:column;gap:.8rem;align-items:flex-end}
@media(max-width:980px){.cta-band__in{grid-template-columns:1fr}.cta-band__btns{align-items:flex-start}}
.ftr{background:#0A1F15;color:#B9D3C4;padding:4rem 0 2rem;font-size:.92rem}
.ftr__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.3fr;gap:2.5rem}
.ftr h5{color:#fff;margin-bottom:1rem}
.ftr a{display:block;padding:.25rem 0;transition:color var(--t)}.ftr a:hover{color:#fff}
.ftr__brand img:first-child{width:210px;background:#fff;padding:9px 12px;border-radius:12px;margin-bottom:1.1rem}
.ftr__approvals{margin-top:1rem;max-width:300px;filter:none}
.ftr__addr{display:flex;gap:.5rem;align-items:flex-start;margin-top:.5rem}
.social{display:flex;gap:.5rem;margin-top:1rem}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;padding:0}
.social a:hover{background:rgba(255,255,255,.1)}
.ftr__bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:3rem;padding-top:1.5rem;font-size:.8rem;opacity:.75}
.ftr__disc{margin-top:.5rem;max-width:90ch}
@media(max-width:980px){.ftr__grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.ftr__grid{grid-template-columns:1fr}}
.wa-float{position:fixed;right:1.2rem;bottom:1.2rem;z-index:95;display:inline-flex;align-items:center;gap:.6rem;background:#25D366;color:#062b17;padding:.8rem 1.1rem;border-radius:999px;font-weight:700;box-shadow:0 12px 30px -8px rgba(37,211,102,.7);transition:transform var(--t)}
.wa-float:hover{transform:translateY(-3px)}
.wa-float [data-lucide]{width:1.4em;height:1.4em}
@media(max-width:640px){.wa-float span{display:none}.wa-float{padding:.9rem}}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(26px)}
.js .rv.in{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease)}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.toast{position:fixed;left:50%;bottom:5.5rem;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:.8rem 1.2rem;border-radius:12px;opacity:0;transition:var(--t);z-index:300;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}
.thanks{max-width:640px;margin:0 auto;text-align:center}
.thanks .ok{width:90px;height:90px;border-radius:50%;background:var(--mint);color:var(--green-700);display:grid;place-items:center;margin:0 auto 1.5rem}
.thanks .ok [data-lucide]{width:44px;height:44px}
.ref{font-family:var(--ff-d);font-size:2rem;color:var(--green-800);letter-spacing:.05em}

/* =====================================================================
   Medical Records — dark theme like curehbv.com
   ===================================================================== */
.med-records{background:#0B0F14;color:#E6EDF3;padding:clamp(3.5rem,6vw,6rem) 0}
.med-records .kicker{color:#7EEAB2}
.med-records__layout{display:grid;grid-template-columns:280px 1fr;gap:2rem;align-items:start}
.med-sidebar{position:sticky;top:100px;background:#111820;border:1px solid #222;border-radius:18px;padding:1.2rem;display:flex;flex-direction:column;gap:.6rem;max-height:calc(100vh - 140px);overflow-y:auto}
.med-sidebar__head{margin-bottom:.4rem}
.med-sidebar__title{font-size:1.1rem;font-family:var(--ff-b);font-weight:700;color:#fff;margin-top:.2rem}
.med-sidebar__list{display:grid;gap:.35rem}
.med-sidebar__item{display:flex;align-items:center;gap:.75rem;padding:.75rem .85rem;border-radius:12px;border:1px solid transparent;background:transparent;color:#C9D1D9;cursor:pointer;text-align:left;transition:background var(--t),border-color var(--t),color var(--t);min-height:48px}
.med-sidebar__item:hover{background:rgba(255,255,255,.06);color:#fff}
.med-sidebar__item.on{background:rgba(126,234,178,.1);border-color:rgba(126,234,178,.35);color:#fff}
.med-sidebar__avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#0F7A46,#00A651);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.95rem;flex:none}
.med-sidebar__name{font-weight:600;font-size:.92rem;line-height:1.2}
.med-sidebar__date{font-size:.78rem;color:#8B949E;display:block}
.med-main{min-width:0}
.med-panel{display:none}.med-panel.on{display:block;animation:fade .4s var(--ease)}
.med-main__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.6rem;padding-bottom:1.2rem;border-bottom:1px solid #222}
.med-main__head h3{font-size:clamp(1.3rem,2.2vw,1.8rem);color:#fff;display:flex;align-items:center;gap:.6rem}
.med-main__head small{color:#8B949E;font-size:.9rem}
.med-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.med-card{background:#111820;border:1px solid #222;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;gap:.5rem;transition:transform var(--t),box-shadow var(--t),border-color var(--t);cursor:zoom-in}
.med-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -18px rgba(0,0,0,.55);border-color:#2a313a}
.med-card__img{aspect-ratio:4/3;background:#0B0F14;display:grid;place-items:center;padding:.5rem}
.med-card__img img{max-width:100%;max-height:100%;object-fit:contain;transition:transform .35s var(--ease)}
.med-card:hover .med-card__img img{transform:scale(1.04)}
.med-card__foot{padding:0 .6rem .7rem;color:#8B949E;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:220;background:rgba(0,0,0,.92);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:1.5rem}
.lightbox.open{display:flex}
.lightbox__stage{position:relative;max-width:min(1100px,94vw);max-height:88vh;display:grid;place-items:center}
.lightbox__img{max-width:min(1100px,94vw);max-height:86vh;object-fit:contain;border-radius:10px;transition:transform .25s var(--ease);cursor:zoom-in}
.lightbox__img.zoomed{transform:scale(1.8);cursor:zoom-out}
.lightbox__x{position:absolute;top:1rem;right:1.2rem;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.45);color:#fff;font-size:1.4rem;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(4px)}
.lightbox__x:hover{background:rgba(0,0,0,.7)}
.lightbox__prev,.lightbox__next{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.45);color:#fff;font-size:1.2rem;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(4px)}
.lightbox__prev{left:1rem}.lightbox__next{right:1rem}
.lightbox__prev:hover,.lightbox__next:hover{background:rgba(0,0,0,.7)}
.lightbox__zoom-hint{position:absolute;bottom:1.2rem;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:.82rem;background:rgba(0,0,0,.45);padding:.4rem .8rem;border-radius:999px;backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.12)}
@media(max-width:980px){.med-records__layout{grid-template-columns:1fr}.med-sidebar{position:static;max-height:none;flex-direction:row;overflow-x:auto}.med-sidebar__list{flex-direction:row}.med-sidebar__item{white-space:nowrap}}
@media(max-width:640px){.lightbox__prev,.lightbox__next{display:none}.lightbox__img{max-width:100vw;max-height:82vh}}

/* =====================================================================
   Corrections pass — layout safety, contrast, tap targets, portal
   ===================================================================== */

/* --- 1. no page may ever scroll sideways -------------------------------- */
.order-layout,.split,.stats,.grid,.g2,.g3,.g4,.mega__grid,.contact-grid,.ftr__grid,.bento{grid-auto-columns:minmax(0,1fr)}
.order-layout{grid-template-columns:minmax(0,1fr) 380px}
@media(max-width:980px){.order-layout{grid-template-columns:minmax(0,1fr)}}
.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media(max-width:980px){.split{grid-template-columns:minmax(0,1fr)}}
.stats{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:980px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.stats{grid-template-columns:minmax(0,1fr)}}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:980px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}}
.grid>*,.split>*,.order-layout>*,.stats>*,.bento>*{min-width:0}
.stat b,.stat>span{overflow-wrap:anywhere}
/* the door switcher was the widest thing on the order page */
.doorsel a{min-width:0;flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:52px}
@media(max-width:560px){.doorsel{flex-direction:column}.doorsel a{width:100%}}
/* inline max-widths on images must still respect the viewport */
.sec img[style*="max-width"],.split img[style*="max-width"]{max-width:min(420px,100%)!important}
.ftr__approvals{max-width:min(300px,100%);height:auto}

/* --- 2. legible text over photographs ---------------------------------- */
.b--img::after{background:linear-gradient(to top,rgba(6,26,17,.94) 0%,rgba(6,26,17,.72) 34%,rgba(6,26,17,.28) 62%,rgba(6,26,17,.08) 100%)}
.b--img h3,.b--img p,.b--img .kicker,.b--img strong{text-shadow:0 1px 14px rgba(0,0,0,.55)}
.b--img p{opacity:1;color:rgba(255,255,255,.92)}
.b--img .kicker{color:#9be4bb}
.b--img .btn{margin-top:.9rem}
/* the tall R&D tile needs more room for its copy */
.b--img.s4{min-height:380px}
.b--forest .ic,.b--green .ic{margin-bottom:1rem}
.b--forest,.b--green{justify-content:flex-end}

/* --- 3. equal-height testimonial cards --------------------------------- */
.swiper-wrapper{align-items:stretch}
.swiper-slide{height:auto;display:flex}
.swiper-slide>.tcard{flex:1}
.tcard__who{margin-top:auto}
.swiper-pagination-bullet{background:currentColor;opacity:.35;width:9px;height:9px}
.swiper-pagination-bullet-active{opacity:1}
.sec--dark .swiper-pagination-bullet,.theme-dark .sec--dark .swiper-pagination-bullet{background:#fff}

/* --- 4. tap targets ---------------------------------------------------- */
@media(max-width:980px){
  .btn--sm{min-height:44px;padding:.65rem 1.1rem}
  .crumbs a,.crumbs span{display:inline-block;padding-block:.45rem}
  .pcard__body h3 a,.pcard__body h3{display:block;padding-block:.25rem}
  .ftr a,.ftr__addr{display:flex;min-height:44px;align-items:center;gap:.45rem}
  .ftr__addr{align-items:flex-start;min-height:0;padding-block:.5rem}
  p a:not(.btn){padding-block:.35rem;display:inline-block}
}
.cur a{min-height:32px;display:inline-flex;align-items:center}
/* the whole product card is clickable, so the title link keeps its own hit area */
.pcard__link{position:absolute;inset:0;z-index:1}
.pcard__foot,.pcard__cond{position:relative;z-index:2}

/* --- 5. mobile top bar: keep only what earns its space ----------------- */
@media(max-width:720px){
  .topbar{font-size:.78rem}
  .topbar__in{min-height:34px;justify-content:center}
  .topbar__left{display:none}
  .topbar__right{gap:.75rem}
  .topbar .cur{display:none}
}

/* --- 6. floating WhatsApp button must not sit on top of content -------- */
body{--wa-space:0px}
@media(max-width:640px){body{--wa-space:76px}}
.ftr__bottom{padding-bottom:var(--wa-space)}
.wa-float{bottom:max(1.2rem,env(safe-area-inset-bottom,0px))}

/* --- 7. header states --------------------------------------------------- */
.hdr.is-scrolled .btn--ghost{border-color:var(--line);background:#fff}
.theme-dark .hdr.is-scrolled .btn--ghost{color:var(--ink)}
.theme-dark .hdr:not(.is-scrolled) .mega>.container{color:var(--ink)}
.theme-dark .hdr:not(.is-scrolled) .mega a{color:var(--ink)}
.theme-dark .hdr:not(.is-scrolled) .mega__promo strong,.theme-dark .hdr:not(.is-scrolled) .mega__promo a{color:#fff}
.theme-dark .hdr:not(.is-scrolled) .mega__promo .btn--light{color:var(--green-800)}

/* --- 8. product pack shots sit on nothing ------------------------------ */
.pcard__img{background:linear-gradient(180deg,#F4F8F5,#fff)}
.pcard__img img,.vhero__card>img,.fhero__pack img,.gal__main img{mix-blend-mode:multiply}
.pack-plate{background:#fff;border-radius:18px;display:grid;place-items:center;padding:1rem}

/* --- 9. course pricing block ------------------------------------------- */
.course{margin:1.1rem 0;border:1px solid var(--line);border-radius:16px;background:var(--bg-2);padding:1rem 1.1rem;display:grid;gap:.55rem}
.course__row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-size:.95rem}
.course__row b{font-variant-numeric:tabular-nums}
.course__note{font-size:.82rem;color:var(--muted)}
.theme-dark .fhero .course{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff}
.theme-dark .fhero .course__note{color:rgba(255,255,255,.7)}

/* --- 10. section rhythm ------------------------------------------------- */
.sec{padding-block:clamp(3.5rem,6vw,6rem)}
@media(max-width:640px){.sec{padding-block:2.75rem}.sec-h{margin-bottom:1.75rem}}

/* --- 11. alerts / a11y helpers ------------------------------------------ */
.alert{display:flex;gap:.7rem;align-items:flex-start;padding:.9rem 1.1rem;border-radius:14px;font-size:.95rem}
.alert--ok{background:var(--mint);color:var(--green-800);border:1px solid var(--mint-2)}
.alert--err{background:#FEF2F2;color:#991B1B;border:1px solid #FECACA}
.alert i,.alert svg{flex:none;margin-top:.15rem}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--green);outline-offset:2px;border-radius:4px}
.ftr__h{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);font-family:var(--ff-b);margin-bottom:.9rem}
/* form grids: a <select> with long option text has a wide min-content, which
   used to push the order page past the viewport on phones */
.form .row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media(max-width:640px){.form .row{grid-template-columns:minmax(0,1fr)}}
.form .row>*,.field{min-width:0}
.form input,.form select,.form textarea{width:100%;min-width:0;max-width:100%}
.field label,.field small{overflow-wrap:anywhere}
/* nothing may set its own min-width larger than the screen */
.container,.narrow{max-width:100%}
.region-tabs{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.region-tabs::-webkit-scrollbar{display:none}
.chips{overflow-x:auto;scrollbar-width:none;flex-wrap:wrap}
.chips::-webkit-scrollbar{display:none}
/* Grid/flex children default to min-width:auto, which lets long words, long
   <select> options and wide media force a page wider than the phone. */
:where(.grid,.g2,.g3,.g4,.split,.order-layout,.stats,.bento,.form,.form .row,.cinfo,.reps,
       .contact-grid,.doors,.opts,.conds,.pd,.pd__gallery,.pd__thumbs,.tl,.mega__grid,
       .ftr__grid,.cta-band__in,.vhero__in,.swiper-wrapper,.filelist,.pshell)>*{min-width:0}
.form>*,.form .row,.field,.cond,.pd__main,.pd__gallery{min-width:0}
.cond,.rep,.member,.step,.b,.tcard,.pcard,.award{overflow-wrap:anywhere}
.pd__gallery,.pd__main,.pd__main img{max-width:100%}
.pd__thumbs{overflow-x:auto;scrollbar-width:none}
.pd__thumbs::-webkit-scrollbar{display:none}
.cinfo a,.cinfo>div{min-width:0}
.cinfo small,.cinfo strong{overflow-wrap:anywhere}
.marquee{max-width:100vw}
/* very narrow phones (320px) — these three blocks were being clipped */
.case{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
@media(max-width:980px){.case{grid-template-columns:minmax(0,1fr)}}
.case>*,.case .arrow>*{min-width:0}
.case .arrow{flex-wrap:wrap;gap:1rem 1.5rem}
.case .big small{overflow-wrap:anywhere}
@media(max-width:420px){.case{padding:1.25rem}.case .arrow{gap:.6rem 1rem}.case .big{font-size:2.1rem}}
.mech{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:980px){.mech{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.mech{grid-template-columns:minmax(0,1fr)}}
.mech>div{min-width:0;overflow-wrap:anywhere}
/* wide tables scroll inside their own box rather than stretching the page */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px}
.tbl{min-width:min(520px,100%)}
@media(max-width:520px){.tbl{font-size:.85rem}.tbl th,.tbl td{padding:.6rem .55rem}}
/* header fits every desktop width, not just wide ones */
.hdr__in{gap:1rem}
.hdr__cta{flex:none}
@media(max-width:1200px){.nav a{padding:.55rem .55rem;font-size:.9rem}.hdr__in{gap:.65rem}.logo{min-width:150px}.logo img{width:150px}}
@media(max-width:1100px){.hdr__cta .btn--ghost{display:none!important}}
@media(max-width:1040px){.nav a{padding:.5rem .45rem;font-size:.88rem}.logo img{width:150px}}
/* pack shots now carry their own alpha, so no blend trickery is needed */
.pcard__img img,.vhero__card>img,.fhero__pack img,.pd__main img,.buybar__in img,.summary img{mix-blend-mode:normal}
.vhero__card>img{background:transparent;padding:0;aspect-ratio:16/11;object-fit:contain}
/* hero proof row — verifiable facts rather than stock faces */
.vhero__proof{display:flex;gap:.5rem 1.4rem;flex-wrap:wrap;align-items:center;font-size:.88rem;color:rgba(255,255,255,.8)}
.vhero__proof span{display:inline-flex;gap:.45rem;align-items:center}
.vhero__proof i,.vhero__proof svg{color:#6EDB9B;flex:none}
/* testimonial monograms — real words, no stock faces standing in for patients */
.tcard__mono,.mono{width:48px;height:48px;border-radius:50%;background:var(--mint);color:var(--green-800);
  display:grid;place-items:center;font-weight:700;font-size:1.1rem;flex:none;font-family:var(--ff-b)}
.sec--dark .mono,.theme-dark .sec--dark .mono{background:rgba(255,255,255,.14);color:#fff}
.stats__src{margin-top:1rem;font-size:.78rem;color:var(--muted)}
.tnote{margin-top:1.2rem;font-size:.8rem;color:var(--muted)}
.sec--dark .tnote{color:rgba(255,255,255,.55)}
/* order tracking timeline */
.track{list-style:none;display:grid;gap:0;counter-reset:t}
.track li{display:flex;gap:1rem;align-items:flex-start;padding-bottom:1.3rem;position:relative}
.track li:not(:last-child)::before{content:"";position:absolute;left:17px;top:34px;bottom:0;width:2px;background:var(--line)}
.track li.done:not(:last-child)::before{background:var(--green-700)}
.track .dot{width:36px;height:36px;border-radius:50%;background:var(--bg-2);border:2px solid var(--line);color:var(--muted);display:grid;place-items:center;flex:none;z-index:1}
.track li.done .dot{background:var(--green-700);border-color:var(--green-700);color:#fff}
.track li.now .dot{box-shadow:0 0 0 5px var(--mint)}
.track li div{padding-top:.35rem;min-width:0}
.track strong{display:block;font-size:1rem}
.track li:not(.done) strong{color:var(--muted);font-weight:600}
.track small{color:var(--muted);font-size:.86rem}
.ftr__approvals{width:100%;max-width:min(280px,100%);height:auto;object-fit:contain;object-position:left}
/* card headings keep their visual weight while sitting at the right level in
   the document outline (no h2 -> h4 jumps for screen readers) */
.h-card{font-size:1.15rem;font-family:var(--ff-b);font-weight:700;line-height:1.3;letter-spacing:0}
/* --- final tap-target pass: nothing interactive under 44px on a phone ------ */
@media(max-width:980px){
  .topbar__right a{min-height:40px;display:inline-flex;align-items:center}
  /* the product-card title is the card's main link — give it the whole card */
  .pcard{position:relative}
  .pcard__body h3 a{display:block;min-height:44px;display:flex;align-items:center}
  .pcard__body h3 a::after{content:"";position:absolute;inset:0;z-index:1}
  .pcard__foot,.pcard__cond,.pcard__img{position:relative;z-index:2}
  .crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .4rem}
  .crumbs a,.crumbs span{min-height:44px;display:inline-flex;align-items:center}
  /* inline consent / policy links inside small print */
  .form small a,.consent a,.auth__foot a,p.tnote a,.course__note a{
    display:inline-flex;align-items:center;min-height:44px;padding-inline:.15rem}
}
/* the honeypot must stay unreachable and unmeasured */
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
@media(max-width:980px){.consent a{display:inline-flex;align-items:center;min-height:44px;padding-inline:.15rem}}
/* pack shots now carry 6% transparent padding of their own, so the card can
   give them more room without them touching the edges */
.pcard__img{padding:.6rem}
.pcard__img img{max-height:100%;max-width:100%;width:auto;object-fit:contain}
/* the floating button shrinks to a circle once you start reading, so it stops
   sitting on top of Buy buttons and filter chips */
.wa-float{transition:transform var(--t),padding var(--t),border-radius var(--t)}
.wa-float span{transition:max-width .3s var(--ease),opacity .2s,margin .3s var(--ease);max-width:200px;overflow:hidden;white-space:nowrap}
body.scrolled .wa-float span{max-width:0;opacity:0;margin-left:-.6rem}
body.scrolled .wa-float{padding:.9rem}
/* footer brand marks: white on the dark footer, brand-green on hover */
.social a{color:#fff;transition:background var(--t),border-color var(--t),color var(--t)}
.social a svg{width:19px;height:19px;fill:currentColor;display:block}
.social a:hover{background:#fff;border-color:#fff;color:var(--forest)}
.social a:focus-visible{outline:3px solid var(--green);outline-offset:2px}

/* =====================================================================
   Justified body copy
   Applied to running prose only — headings, buttons, labels, table cells,
   nav and short UI strings stay ragged-right, because justifying a 3-word
   line just stretches it into a gappy mess. Hyphenation is switched on so
   the extra word-spacing stays even instead of opening rivers.
   ===================================================================== */
/* only wide, top-level running prose — never a paragraph inside a card */
.lead,
.sec > .container > p,
.sec > .container > .sec-h > p,
.split > div > p,
.policy p, .faq p, .prose p,
.narrow > p,
.ftr__disc,
.wiz__step > p.sub{
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
  -webkit-hyphens:auto;
  text-wrap:pretty;
}
/* a justified last line should never be stretched */
.lead, .sec > .container > p, .prose p{ text-align-last:left }

/* Narrow columns are where justification falls apart — under ~34 characters
   there is not enough slack to distribute, so it reverts to ragged-right. */
@media(max-width:560px){
  .lead, .sec > .container > p, .split > div > p, .prose p, .policy p, .faq p{ text-align:left; hyphens:manual }
}
/* card and tile copy is a short, narrow measure — justifying it just stretches
   three words across the column, so it stays ragged-right everywhere */
.b p, .step p, .glass p, .pcard__body p, .cond p, .award p, .tcard p,
.casecard > p, .rep p, .member p, .tile span, .course__note, .tnote,
.stats__src, .ftr__brand p, .auth__card > p.sub, .empty-state p{
  text-align:left; hyphens:manual; text-wrap:pretty
}
/* never justify things that are not prose */
.btn, .chip, .pill, .kicker, .crumbs, .nav a, .mnav a, .pside a,
.tbl td, .tbl th, .kv, .summary-rows, .filerow, .msg, .cmsg,
.field label, .field small, .opt .lbl, .vhero__strip span, .topbar{
  text-align:left; hyphens:none
}
/* .center wins over the justify block above — it needs to match its specificity,
   because `.sec > .container > p` is stronger than a bare `p.center`. */
.center p, .sec-h.center p,
p.center, .sec > .container > p.center, .sec > .container > .center{
  text-align:center; text-align-last:center; hyphens:manual
}

/* =====================================================================
   Cookie consent
   Sits above the WhatsApp float on a phone, so the Accept button is never
   the thing hidden behind a green circle.
   ===================================================================== */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--ink);color:#fff;
  box-shadow:0 -8px 30px rgba(15,23,42,.25);animation:consentUp .28s ease-out}
@keyframes consentUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.consent__in{max-width:1180px;margin:0 auto;padding:1rem 1.2rem;display:flex;gap:1.4rem;
  align-items:center;justify-content:space-between;flex-wrap:wrap}
.consent p{margin:0;font-size:.85rem;line-height:1.6;color:rgba(255,255,255,.82);max-width:70ch}
.consent strong{color:#fff;display:block}
.consent a{color:#8EE7B0;text-decoration:underline;text-underline-offset:2px}
.consent__btns{display:flex;gap:.6rem;flex-shrink:0}
.consent .btn--ghost{border-color:rgba(255,255,255,.35);color:#fff;background:transparent}
.consent .btn--ghost:hover{background:rgba(255,255,255,.1)}
@media (max-width:640px){
  .consent__in{padding:.9rem 1rem 1rem;gap:.8rem}
  .consent p{font-size:.8rem}
  .consent__btns{width:100%}
  .consent__btns .btn{flex:1;justify-content:center;min-height:44px}
}
/* --consent-h is published by the banner's own script, so the float clears
   whatever height the copy actually wraps to. Moving `bottom` rather than
   `transform` leaves the hover lift on .wa-float intact. */
body:has(.consent) .wa-float{bottom:calc(var(--consent-h, 8rem) + 1.2rem)}
