/* dr.GUT Fibras LP
   Tokens extraídos do CSS ao vivo de drgut.com.br (client-assets/theme-tokens.css).
   Nenhuma cor, fonte ou raio aqui foi inventado. */

:root{
  --body-font:Poppins,system-ui,-apple-system,"Segoe UI",sans-serif;
  --heading-font:Sora,system-ui,-apple-system,"Segoe UI",sans-serif;

  --primary:#e82d3a;
  --primary-hover:#fe7900;
  --text:#444;
  --heading:#111;
  --border:#ebebeb;
  --grey:#f5f5f5;
  --dark:#111;
  --pix:#12b39a;
  --badge-bg:#f6c445;
  --badge-fg:#1a1a1a;

  --btn-radius:30px;
  --card-radius:20px;
  --radius:10px;
  --shadow:5px 0 30px 0 rgba(0,0,0,.08);
  --shadow-up:0 -4px 24px rgba(0,0,0,.12);
  --page:1200px;
  --gap:50px;
  --transition:.2s cubic-bezier(.4,0,.2,1);
  --hdr-h:74px;
}
@media(min-width:768px){:root{--gap:90px}}

*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h) + 16px)}
body{
  margin:0;font-family:var(--body-font);font-size:1.5rem;line-height:1.714;
  color:var(--text);background:#fff;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--heading-font);color:var(--heading);letter-spacing:-.034em;font-weight:600;margin:0 0 1.6rem}
h1{font-size:3.2rem;line-height:1.14}
h2{font-size:2.8rem;line-height:1.2}
h3{font-size:1.9rem;line-height:1.3}
@media(min-width:768px){h1{font-size:4.8rem}h2{font-size:3.6rem}h3{font-size:2.2rem}}
p{margin:0 0 1.6rem}
a{color:inherit}
ul,ol{margin:0;padding:0;list-style:none}

.wrap{width:100%;max-width:var(--page);margin:0 auto;padding:0 2rem}
.narrow{max-width:760px}
.center{text-align:center}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;background:var(--primary);color:#fff;padding:1.2rem 2rem;z-index:200}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--primary);outline-offset:3px;border-radius:4px}

/* ---- ícones: uma família só, viewBox 24, stroke 1.75, pontas redondas ---- */
.ic{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ic--lg{width:28px;height:28px}
.ic--xl{width:44px;height:44px}

/* ---- botões ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.8rem;
  font-family:var(--heading-font);font-size:1.5rem;font-weight:600;
  min-height:52px;padding:1.4rem 3rem;border-radius:var(--btn-radius);
  border:2px solid transparent;cursor:pointer;text-decoration:none;
  transition:background var(--transition),color var(--transition),border-color var(--transition);
}
@media(min-width:768px){.btn{padding:1.5rem 5.5rem}}
.btn--primary{background:var(--primary);color:#fff}
.btn--primary:hover{background:var(--primary-hover)}
.btn--ghost{background:transparent;color:#fff;border-color:#fff}
.btn--ghost:hover{background:#fff;color:var(--heading)}
.btn--full{width:100%;white-space:nowrap}
@media(max-width:400px){.btn--full{font-size:1.4rem;padding-left:1.6rem;padding-right:1.6rem}}

/* ---- barra promo ---- */
.promo{background:var(--dark);color:#fff;font-size:1.3rem;min-height:48px;display:flex;align-items:center}
.promo__in{display:flex;align-items:center;justify-content:center;gap:1.2rem;flex-wrap:wrap;padding-top:.8rem;padding-bottom:.8rem}
.promo__in span{display:inline-flex;align-items:center;gap:.6rem}
.promo__sep{opacity:.45}
@media(max-width:559px){.promo__in>span:nth-child(n+3){display:none}}

/* ---- header ---- */
.hdr{position:sticky;top:0;z-index:90;background:#fff;border-bottom:1px solid var(--border)}
.hdr__in{display:flex;align-items:center;gap:2rem;height:var(--hdr-h)}
.hdr__logo img{width:85px;height:auto}
@media(min-width:768px){.hdr__logo img{width:110px}}
.hdr__nav{display:none;gap:26px;margin-left:auto;font-family:var(--heading-font);font-size:1.5rem;font-weight:600}
.hdr__nav a{color:#2b2b22;text-decoration:none}
.hdr__nav a:hover{color:var(--primary)}
@media(min-width:1000px){.hdr__nav{display:flex}}
.hdr__cart{
  margin-left:auto;position:relative;width:44px;height:44px;display:grid;place-items:center;
  background:none;border:0;cursor:pointer;color:var(--heading);border-radius:50%;
}
@media(min-width:1000px){.hdr__cart{margin-left:2rem}}
.hdr__cart:hover{background:var(--grey)}
.hdr__cart .ic{width:22px;height:22px}
.hdr__count{
  position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 4px;
  background:var(--primary);color:#fff;border-radius:9px;font-size:1.1rem;line-height:18px;font-weight:600;
}

/* ---- hero ---- */
.hero{position:relative;min-height:560px;display:flex;align-items:center;overflow:hidden;background:var(--dark)}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center}
.hero__scrim{position:absolute;inset:0;background:linear-gradient(100deg,rgba(17,17,17,.93) 0%,rgba(17,17,17,.82) 42%,rgba(17,17,17,.35) 72%,rgba(17,17,17,.15) 100%)}
.hero__in{position:relative;z-index:2;padding-top:4rem;padding-bottom:4rem;max-width:720px}
.hero__eyebrow{font-family:var(--heading-font);font-size:1.3rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#ffb3b9;margin-bottom:1.2rem}
.hero__h1{color:#fff;margin-bottom:1.6rem}
.hero__h1 strong{display:inline;font-weight:700;color:#fff;background:linear-gradient(transparent 62%,rgba(232,45,58,.85) 62%)}
.hero__lede{color:rgba(255,255,255,.88);font-size:1.6rem;margin-bottom:2rem}
.hero__cta{display:flex;flex-wrap:wrap;gap:1.2rem;margin-bottom:1.6rem}
.hero__cta .btn{flex:1 1 auto;min-width:200px}
.hero__trust{font-size:1.3rem;color:rgba(255,255,255,.75);margin:0}
@media(min-width:768px){.hero{min-height:660px}.hero__in{padding-top:7rem;padding-bottom:7rem}.hero__lede{font-size:1.8rem}}

/* price chip */
.chip{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:.9rem;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:var(--btn-radius);padding:.9rem 2rem;margin-bottom:2.4rem}
.chip__was{text-decoration:line-through;opacity:.65;color:#fff;font-size:1.4rem}
.chip__now{font-family:var(--heading-font);font-weight:700;font-size:2rem;color:#fff}
.chip__frame{font-size:1.3rem;color:rgba(255,255,255,.8)}

/* ---- seções base ---- */
.sec{padding:var(--gap) 0}
.sec--tint{background:var(--grey)}
.sec--dark{background:var(--dark);color:rgba(255,255,255,.82)}
.on-dark{color:#fff}
.kicker{font-family:var(--heading-font);font-size:1.3rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);margin-bottom:1rem}
.kicker--on-dark{color:#ff8f98}
.lead{font-size:1.7rem}
@media(min-width:768px){.lead{font-size:1.9rem}}
.punch{font-family:var(--heading-font);font-size:1.9rem;font-weight:600;color:var(--heading);line-height:1.35}
.sec--dark .punch,.punch.on-dark{color:#fff}
.note{font-size:1.3rem;color:#6b6b6b}
.note--on-dark{color:rgba(255,255,255,.6)}
.quote{font-family:var(--heading-font);font-size:1.9rem;font-weight:500;font-style:italic;line-height:1.45}

/* ---- faixa de fatos ---- */
.facts{background:#fff;border-bottom:1px solid var(--border);padding:3.2rem 0}
.facts__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2.4rem 1.6rem}
@media(min-width:860px){.facts__grid{grid-template-columns:repeat(4,1fr)}}
.fact{text-align:center;color:var(--primary)}
.fact .ic{margin:0 auto .8rem}
.fact__n{font-family:var(--heading-font);font-size:2.4rem;font-weight:700;color:var(--heading);margin:0 0 .4rem;letter-spacing:-.034em}
.fact__l{font-size:1.3rem;color:var(--text);margin:0;line-height:1.45}

/* ---- passos ---- */
.steps{display:grid;gap:2.4rem;margin:3.2rem 0 2.4rem}
@media(min-width:768px){.steps{grid-template-columns:repeat(3,1fr);gap:3.2rem}}
.step{background:#fff;border:1px solid var(--border);border-radius:var(--card-radius);padding:2.8rem 2.4rem;text-align:center}
.step img{width:72px;height:72px;margin:0 auto 1.6rem}
.step h3{margin-bottom:.8rem}
.step p{margin:0;font-size:1.4rem}

/* ---- faixa assinatura ---- */
.sig{display:grid;gap:3.2rem;align-items:center;margin-top:3.2rem}
@media(min-width:900px){.sig{grid-template-columns:minmax(0,420px) 1fr;gap:5.6rem}}
.sig__fig{position:relative;margin:0;background:#fff;border-radius:var(--card-radius);overflow:hidden}
.sig__fig img{width:100%;height:auto}
.hot{
  position:absolute;width:34px;height:34px;border-radius:50%;background:var(--primary);color:#fff;
  font-family:var(--heading-font);font-weight:700;font-size:1.5rem;display:grid;place-items:center;
  box-shadow:0 0 0 4px rgba(232,45,58,.25);
}
.hot--1{top:30%;left:16%}
.hot--2{top:49%;left:52%}
.hot--3{top:70%;left:24%}
.sig__list{display:grid;gap:2.4rem}
.sig__list h3{display:flex;align-items:center;gap:1.2rem;color:#fff;margin-bottom:.6rem}
.sig__n{width:30px;height:30px;flex:none;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:1.4rem;font-weight:700}
.sig__list p{margin:0;font-size:1.5rem;color:rgba(255,255,255,.78)}

.micros{margin-top:4.8rem;border-top:1px solid rgba(255,255,255,.14);padding-top:3.2rem}
.micros__h{color:#fff;margin-bottom:2rem}
.micros__list{display:grid;gap:1.6rem}
@media(min-width:768px){.micros__list{grid-template-columns:repeat(2,1fr);gap:1.6rem 3.2rem}}
.micros__list li{display:flex;flex-wrap:wrap;align-items:baseline;gap:.8rem;padding-bottom:1.6rem;border-bottom:1px solid rgba(255,255,255,.1)}
.micros__list strong{font-family:var(--heading-font);color:#fff;font-size:1.6rem}
.micros__list span{background:var(--primary);color:#fff;font-size:1.1rem;font-weight:600;padding:.2rem .8rem;border-radius:12px}
.micros__list em{flex:1 1 100%;font-style:normal;font-size:1.3rem;color:rgba(255,255,255,.62)}

/* ---- gráfico ---- */
.chart{margin:3.2rem 0;padding:2.8rem 2.4rem;background:var(--grey);border-radius:var(--card-radius)}
.chart__row{margin-bottom:2rem}
.chart__lab{font-size:1.3rem;font-weight:500;color:var(--heading);margin:0 0 .6rem}
.chart__track{position:relative;height:40px;background:#fff;border-radius:var(--radius);overflow:hidden}
.chart__bar{height:100%;display:flex;align-items:center;justify-content:flex-end;padding-right:1.2rem;border-radius:var(--radius);min-width:62px}
.chart__bar span{font-family:var(--heading-font);font-size:1.3rem;font-weight:700;color:#fff;white-space:nowrap}
.chart__bar--low{background:#9a9a9a}
.chart__bar--goal{background:var(--heading)}
.chart__bar--us{background:var(--primary)}
.chart__axis{display:flex;justify-content:space-between;font-size:1.1rem;color:#6b6b6b;border-top:1px solid #ddd;padding-top:.6rem;margin-top:-.6rem}
.chart figcaption{font-size:1.2rem;color:#6b6b6b;margin-top:1.6rem;line-height:1.5}

/* ---- buy block ---- */
.buy{display:grid;gap:3.2rem;margin-top:3.2rem}
@media(min-width:960px){.buy{grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:4.8rem;align-items:start}}
.buy__gal{background:#fff;border-radius:var(--card-radius);padding:2rem;border:1px solid var(--dg-card-border,#e6e4e3)}
@media(min-width:960px){.buy__gal{position:sticky;top:calc(var(--hdr-h) + 20px)}}
.buy__gal>img{width:100%;border-radius:var(--radius)}
.buy__thumbs{display:flex;gap:1rem;margin-top:1.6rem}
.thumb{width:64px;height:64px;padding:0;border:2px solid var(--border);border-radius:var(--radius);background:#fff;cursor:pointer;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb.is-on{border-color:var(--primary)}

.buy__panel{background:#fff;border-radius:var(--card-radius);padding:2.4rem;border:1px solid #e6e4e3}
.plans{display:grid;gap:1.2rem;margin-bottom:2.4rem}
.plan{
  position:relative;display:flex;align-items:center;gap:1.4rem;
  padding:1.6rem;border:2px solid #e6e4e3;border-radius:var(--card-radius);
  cursor:pointer;transition:border-color var(--transition),background var(--transition);min-height:44px;flex-wrap:wrap;
}
.plan:hover{border-color:#dcd9d8}
.plan[aria-checked="true"]{border-color:var(--primary);background:rgba(232,45,58,.04)}
.plan img{width:56px;height:56px;flex:none;object-fit:contain}
.plan__txt{flex:1;min-width:0}
.plan__name{font-family:var(--heading-font);font-weight:600;font-size:1.6rem;color:var(--heading);margin:0}
.plan__unit{font-size:1.3rem;margin:0}
.plan__inst{display:block;font-size:1.15rem;color:#6b6b6b;font-weight:500;margin:.1rem 0 0;white-space:nowrap}
.plan__dose{font-size:1.2rem;color:var(--primary);font-weight:500;margin:0}
.plan__price{text-align:right;flex:none}
.plan__was{display:block;font-size:1.2rem;text-decoration:line-through;color:#8a8a8a}
.plan__now{font-family:var(--heading-font);font-weight:700;font-size:1.7rem;color:var(--heading)}
.plan__now small{font-size:1.1rem;font-weight:600;color:#6b6b6b;margin-right:.2rem}
.plan__tag{
  position:absolute;top:-10px;left:16px;background:var(--badge-bg);color:var(--badge-fg);
  font-size:1.1rem;font-weight:600;padding:.2rem 1rem;border-radius:15px;
}
.plan__tag--alt{background:var(--primary);color:#fff}

.receipt{background:var(--grey);border-radius:var(--radius);padding:1.8rem;margin-bottom:1.8rem;font-size:1.4rem}
.receipt__line{display:flex;justify-content:space-between;gap:1.6rem;padding:.5rem 0}
.receipt__line>span:last-child{white-space:nowrap}
.receipt__line .neg{color:var(--primary);font-weight:600}
.receipt__line .inc{color:var(--pix);font-weight:600}
.receipt__total{display:flex;justify-content:space-between;gap:1.6rem;border-top:1px solid #ddd;margin-top:.8rem;padding-top:1.2rem;font-family:var(--heading-font);font-weight:700;font-size:1.8rem;color:var(--heading)}
.receipt__inst{margin:.6rem 0 0;font-size:1.3rem;color:var(--heading)}
.receipt__inst strong{font-family:var(--heading-font);font-weight:700}
.receipt__pix{margin:.4rem 0 0;font-size:1.3rem;color:var(--pix)}
.receipt__pix strong{font-weight:700}

.micro{font-size:1.2rem;color:#6b6b6b;margin:1.2rem 0 0;text-align:center;line-height:1.5}
.micro--alt{margin-top:.4rem}
.selos{display:flex;flex-wrap:wrap;justify-content:center;gap:1.2rem;margin-top:2rem;padding-top:2rem;border-top:1px solid var(--border)}
.selos img{width:92px;height:auto;opacity:.85}

/* ---- stats ---- */
.stats{background:var(--dark);padding:4.8rem 0}
.stats__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3.2rem 1.6rem;text-align:center}
@media(min-width:860px){.stats__grid{grid-template-columns:repeat(4,1fr)}}
.stat__n{font-family:var(--heading-font);font-size:4rem;font-weight:700;color:#fff;margin:0;letter-spacing:-.034em;line-height:1}
.stat__l{font-size:1.3rem;color:rgba(255,255,255,.7);margin:.8rem 0 0}

/* ---- tabela ---- */
.tbl-scroll{overflow-x:auto;margin:2.4rem 0;border-radius:var(--card-radius);border:1px solid var(--border)}
.tbl{width:100%;border-collapse:collapse;font-size:1.4rem;min-width:620px;background:#fff}
.tbl th,.tbl td{padding:1.4rem 1.6rem;text-align:left;border-bottom:1px solid var(--border)}
.tbl thead th{font-family:var(--heading-font);font-size:1.4rem;font-weight:600;color:var(--heading);background:var(--grey)}
.tbl thead th:nth-child(2){color:var(--primary)}
.tbl tbody th{font-weight:500;color:var(--heading);width:150px}
.tbl td.yes{color:var(--heading);font-weight:500;background:rgba(232,45,58,.04)}
.tbl td.no{color:#8a8a8a}
.tbl tbody tr:last-child th,.tbl tbody tr:last-child td{border-bottom:0}

/* ---- timeline ---- */
.tl{display:grid;gap:1.6rem;margin:3.2rem 0 2.4rem}
@media(min-width:768px){.tl{grid-template-columns:repeat(3,1fr)}}
.tl li{background:#fff;border-radius:var(--card-radius);padding:2.4rem;border-left:4px solid var(--primary)}
.tl__k{font-family:var(--heading-font);font-weight:700;font-size:1.8rem;color:var(--heading);margin:0 0 .6rem}
.tl li p:last-child{margin:0;font-size:1.4rem}
.warn{display:flex;gap:1.6rem;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:var(--card-radius);padding:2.4rem}
.warn .ic{color:var(--primary);margin-top:2px}
.warn p{margin:0;font-size:1.4rem}

/* ---- reviews ---- */
.revs{display:grid;gap:1.6rem;margin-top:3.2rem}
@media(min-width:720px){.revs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.revs{grid-template-columns:repeat(3,1fr)}}
.rev{margin:0;background:#fff;border:1px solid var(--border);border-radius:var(--card-radius);padding:2.4rem}
.rev--verified{border-color:var(--primary)}
.rev__stars{color:var(--primary);font-size:1.6rem;letter-spacing:2px;margin:0 0 1.2rem}
.rev p{font-size:1.4rem}
.rev footer{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid var(--border)}
.rev cite{font-family:var(--heading-font);font-style:normal;font-weight:600;font-size:1.4rem;color:var(--heading)}
.rev__tag{font-size:1.1rem;background:var(--grey);color:#5a5a5a;padding:.3rem 1rem;border-radius:12px}
.rev__tag--v{background:rgba(232,45,58,.1);color:var(--primary);font-weight:600}

/* ---- garantia ---- */
.guar{background:var(--primary);color:#fff;padding:4.8rem 0}
.guar__in{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2rem}
@media(min-width:900px){.guar__in{flex-direction:row;text-align:left;gap:3.2rem}}
.guar h2{color:#fff;margin-bottom:.8rem;font-size:2.4rem}
.guar p{margin:0;color:rgba(255,255,255,.9);font-size:1.5rem}
.guar .btn--primary{background:#fff;color:var(--primary);flex:none}
.guar .btn--primary:hover{background:var(--dark);color:#fff}

/* ---- faq ---- */
.faq{margin-top:2.4rem;border-top:1px solid var(--border)}
.faq details{border-bottom:1px solid var(--border)}
.faq summary{
  font-family:var(--heading-font);font-weight:600;font-size:1.6rem;color:var(--heading);
  padding:2rem 4rem 2rem 0;cursor:pointer;position:relative;list-style:none;min-height:44px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;margin-top:-7px;
  border-right:2px solid var(--primary);border-bottom:2px solid var(--primary);
  transform:rotate(45deg);transition:transform var(--transition);
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.faq__a{padding:0 0 2rem}
.faq__a p{margin:0;font-size:1.45rem}

/* ---- cta final ---- */
.final{position:relative;overflow:hidden;background:var(--dark);text-align:center}
.final__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.final__scrim{position:absolute;inset:0;background:rgba(17,17,17,.78)}
.final__in{position:relative;z-index:2;padding:var(--gap) 2rem}
.final h2{color:#fff}
.final>.wrap>p{color:rgba(255,255,255,.85)}
.final .chip{margin-top:.8rem}
.final__trust{font-size:1.3rem;color:rgba(255,255,255,.7);margin:1.6rem 0 0}

/* ---- rodapé ---- */
.ft{background:var(--dark);color:rgba(255,255,255,.6);padding:4.8rem 0 3.2rem;font-size:1.3rem}
.ft__grid{display:grid;gap:3.2rem;margin-bottom:3.2rem}
@media(min-width:768px){.ft__grid{grid-template-columns:2fr 1fr 1fr}}
.ft__logo{width:110px;filter:brightness(0) invert(1);opacity:.9;margin-bottom:1.2rem}
.ft__note{margin:0;color:rgba(255,255,255,.5)}
.ft h3{color:#fff;font-size:1.4rem;margin-bottom:1.2rem}
.ft li{margin-bottom:.8rem}
.ft a{color:rgba(255,255,255,.65);text-decoration:none}
.ft a:hover{color:#fff}
.ft__disc{border-top:1px solid rgba(255,255,255,.12);padding-top:2.4rem;font-size:1.15rem;line-height:1.6;color:rgba(255,255,255,.62)}
.ft__cnpj{font-size:1.15rem;color:rgba(255,255,255,.58);margin:0}

/* ---- sticky mobile ---- */
.sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:95;display:flex;align-items:center;gap:1.6rem;
  background:#fff;border-top:1px solid var(--border);box-shadow:var(--shadow-up);padding:1rem 1.6rem;
  padding-bottom:calc(1rem + env(safe-area-inset-bottom));
}
.sticky[hidden]{display:none}
@media(min-width:960px){.sticky{display:none !important}}
.sticky__txt{flex:1;min-width:0}
.sticky__name{font-family:var(--heading-font);font-weight:600;font-size:1.4rem;color:var(--heading);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky__price{font-size:1.3rem;color:var(--primary);font-weight:600;margin:0}
.sticky .btn{flex:none;padding:1.2rem 2.4rem;min-height:46px}

/* ---- carrinho ---- */
.ovl{position:fixed;inset:0;background:rgba(17,17,17,.5);z-index:100}
.cart{
  position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);z-index:101;background:#fff;
  display:flex;flex-direction:column;box-shadow:var(--shadow);
}
.cart[hidden],.ovl[hidden]{display:none}
.cart__hd{display:flex;align-items:center;justify-content:space-between;padding:2rem;border-bottom:1px solid var(--border)}
.cart__hd h2{margin:0;font-size:1.9rem}
.cart__x{width:44px;height:44px;display:grid;place-items:center;background:none;border:0;cursor:pointer;color:var(--heading);border-radius:50%}
.cart__x:hover{background:var(--grey)}
.cart__ship{margin:0;padding:1.2rem 2rem;background:rgba(18,179,154,.1);color:var(--pix);font-size:1.3rem;font-weight:600;text-align:center}
.cart__body{flex:1;overflow-y:auto;padding:1.6rem 2rem}
.cart__empty{padding:3.2rem 2rem;text-align:center;color:#8a8a8a;font-size:1.4rem}
.line{display:flex;gap:1.4rem;align-items:center;padding:1.6rem 0;border-bottom:1px solid var(--border)}
.line img{width:56px;height:56px;flex:none;object-fit:contain}
.line__t{flex:1;min-width:0}
.line__n{font-family:var(--heading-font);font-weight:600;font-size:1.4rem;color:var(--heading);margin:0}
.line__p{font-size:1.3rem;margin:0}
.line__qty{display:flex;align-items:center;gap:.4rem}
.line__qty button{width:30px;height:30px;border:1px solid var(--border);background:#fff;border-radius:50%;cursor:pointer;font-size:1.6rem;line-height:1;color:var(--heading)}
.line__qty button:hover{border-color:var(--primary);color:var(--primary)}
.line__qty span{min-width:24px;text-align:center;font-size:1.4rem;font-weight:600}
.cart__ft{border-top:1px solid var(--border);padding:2rem}
.cart__row{display:flex;justify-content:space-between;font-family:var(--heading-font);font-size:1.8rem;font-weight:700;color:var(--heading);margin-bottom:.4rem}
.cart__pix{font-size:1.3rem;color:var(--pix);margin:0 0 1.6rem}

/* ---- animação ---- */
.fx{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.fx.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .fx{opacity:1;transform:none}
}