/* ============================================================
   Lumyellow — biblioteca de componentes do MOCKUP local
   (espelha os tokens reais de snippets/css-tokens.liquid)
   Usado por preview/*.html. Não vai pro tema (.shopifyignore).
   ============================================================ */

@font-face{
  font-family:'Anek Bangla';
  src:url('/assets/AnekBangla-latin.woff2') format('woff2-variations'),
      url('/assets/AnekBangla-latin.woff2') format('woff2');
  font-weight:100 800; font-style:normal; font-display:swap;
}

:root{
  --bg:#FFFFFF; --bg-soft:#F9F9F9;
  --yellow:#FDDF73; --yellow-deep:#8A6D00;   /* ouro escuro p/ texto/preço passar AA (era #E0B511) */
  --yellow-accent:#E0B511;                    /* amarelo aprovado, reservado p/ acentos/fundo, não texto */
  --ink:#171717; --text:#6E6E6E; --line:rgba(23,23,23,.10);  /* cinza 2ndário legível (era #B0B0B0) */
  --btn-bg:var(--yellow); --btn-text:var(--ink);
  --btn2-bg:#FAFAFA; --btn2-text:var(--ink);
  --font:'Anek Bangla',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:18px; --r-sm:12px; --r-lg:26px; --r-pill:999px;
  --shadow:0 1px 2px rgba(23,23,23,.04),0 12px 32px -16px rgba(23,23,23,.18);
  --maxw:1200px;
  --section-y:74px;
}
@media (max-width:560px){ :root{ --section-y:50px } }

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);
     font-weight:400;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(16px,4vw,24px)}
.section{padding-block:var(--section-y)}
.section--soft{background:var(--bg-soft)}

/* tipografia */
.display{font-size:clamp(30px,5vw,52px);font-weight:600;letter-spacing:-.01em;line-height:1.05;margin:0}
.h2{font-size:clamp(24px,3.4vw,34px);font-weight:600;margin:0}
.h3{font-size:20px;font-weight:600;margin:0}
.lead{font-size:17px;color:var(--ink);max-width:62ch}
.muted{color:var(--text)}
.kicker{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow-deep);font-weight:700;margin:0 0 14px}

/* cabeçalho de seção (título à esquerda + link à direita) */
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:22px}
.sec-head a{color:var(--yellow-deep);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap}

/* botões */
.btn{font-family:inherit;font-weight:600;font-size:15px;border-radius:var(--r-sm);
     padding:14px 26px;border:1.5px solid transparent;cursor:pointer;display:inline-flex;
     align-items:center;justify-content:center;gap:8px;text-decoration:none;line-height:1}
.btn-1{background:var(--btn-bg);color:var(--btn-text)}
.btn-2{background:var(--btn2-bg);color:var(--btn2-text);border-color:var(--line)}
.btn-pill{border-radius:var(--r-pill)}
.btn-block{width:100%}

/* announcement (opcional / desligado por padrão no design) */
.announce{background:var(--ink);color:#fff;text-align:center;font-size:13px;padding:9px;letter-spacing:.02em}

/* HEADER — pílula branca flutuante sobre faixa amarela (fiel ao Figma) */
.hd{position:sticky;top:0;z-index:30;background:var(--yellow);padding-top:16px}
.hd .bar{background:#fff;border-radius:16px;box-shadow:0 8px 24px -12px rgba(23,23,23,.28);
         display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
         height:62px;padding:0 24px;margin-bottom:-26px;position:relative;z-index:1}
.hd .bar > a.logo-link{justify-self:start;display:inline-flex;align-items:center}
.hd .logo{height:22px;width:auto;display:block}
.hd nav{justify-self:center;display:flex;gap:38px}
.hd nav a{color:var(--ink);text-decoration:none;font-weight:500;font-size:15px;letter-spacing:.01em}
.hd nav a:hover{color:var(--yellow-deep)}
.hd .icons{justify-self:end;display:flex;gap:20px;align-items:center}
.hd .icons a{display:inline-flex}
.hd .icons img{height:21px;width:auto;display:block}
/* nome textual usado no footer/newsletter */
.word{font-weight:700;letter-spacing:.18em;font-size:20px;text-decoration:none}
@media (max-width:760px){
  .hd .bar{display:flex;justify-content:space-between}
  .hd nav{display:none}
}

/* HERO — banner full-bleed da cena 3D; o header flutua por cima */
.hero{background:var(--yellow);line-height:0;overflow:hidden}
.hero img{width:100%;display:block}

/* ROW de cards com scroll horizontal + snap */
.card-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:18px;
          overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
.card-row > *{scroll-snap-align:start}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:900px){ .grid-4{grid-template-columns:repeat(2,1fr)} }

/* CARD de produto */
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
      box-shadow:var(--shadow);display:flex;flex-direction:column}
.card .ph{aspect-ratio:1;background:#fafafa;display:grid;place-items:center;
          color:var(--text);font-size:13px;position:relative;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:contain}
.badge{position:absolute;top:12px;left:12px;background:var(--ink);color:#fff;font-size:11px;
       font-weight:600;padding:5px 10px;border-radius:var(--r-pill);letter-spacing:.04em}
.card .cbody{padding:14px 16px 18px;display:flex;flex-direction:column;flex:1}
.card .ttl{font-size:15px;font-weight:600;line-height:1.3;min-height:40px}
.price{display:flex;align-items:baseline;gap:8px;margin-top:8px}
.price .now{color:var(--yellow-deep);font-weight:700;font-size:18px}
.price .was{color:var(--text);text-decoration:line-through;font-size:14px}
.parc{color:var(--text);font-size:13px;margin:3px 0 14px}
.card .btn{margin-top:auto}

/* UGC / instagram grid */
.tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
@media (max-width:760px){ .tiles{grid-template-columns:repeat(2,1fr)} }
.tile{aspect-ratio:3/4;border-radius:var(--r-sm);background:linear-gradient(135deg,#f3ecdd,#e7dcc6);
      position:relative;display:grid;place-items:center;color:#b9a98a;font-size:12px;overflow:hidden}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tiles.ig .tile{aspect-ratio:1.05/1}
.tile .play{position:absolute;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.85);
            display:grid;place-items:center;color:var(--ink);font-size:16px}
.tile .tag{position:absolute;left:8px;right:8px;bottom:8px;background:#fff;border-radius:10px;
           padding:8px 10px;display:flex;gap:8px;align-items:center;box-shadow:var(--shadow)}
.tile .tag b{font-size:12px}.tile .tag span{font-size:12px;color:var(--yellow-deep);font-weight:700}

/* BANDA escura (rotina) */
.band{position:relative;min-height:340px;display:grid;align-items:center;border-radius:var(--r-lg);
      overflow:hidden;background:#171717}
.band .band-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.band::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,23,23,.88),rgba(23,23,23,.25))}
.band .inner{position:relative;z-index:1;padding:48px;max-width:620px;color:#fff}
.band .display em{font-style:normal;color:#F3ECE0;display:block;font-weight:400;letter-spacing:.05em}

/* PAIN-NAV (objetivos) */
.pain{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;text-align:left}
@media (max-width:900px){ .pain{grid-template-columns:repeat(3,1fr)} }
@media (max-width:520px){ .pain{grid-template-columns:repeat(2,1fr)} }
.pain a{text-decoration:none}
.pain .circ{aspect-ratio:1;border-radius:var(--r-sm);background:#f3ecdd;
            margin:0 0 12px;position:relative;overflow:hidden}
.pain .circ img{width:100%;height:100%;object-fit:cover}
.pain .circ .ic{position:absolute;top:8px;left:8px;width:30px;height:30px;border-radius:50%;
                background:rgba(255,255,255,.92);display:grid;place-items:center;box-shadow:0 1px 4px rgba(23,23,23,.15)}
.pain .circ .ic img{width:16px;height:16px}
.pain b{display:block;font-size:15px;margin-bottom:3px}
.pain small{color:var(--text);font-size:12.5px;line-height:1.35}

/* USP bar */
.usp{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:760px){ .usp{grid-template-columns:repeat(2,1fr)} }
.usp .item{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 22px;box-shadow:var(--shadow)}
.usp .ic{flex:none;display:flex}
.usp .ic img{width:32px;height:32px;display:block}
.usp b{font-size:14px;display:block}
.usp small{color:var(--text);font-size:13px}

/* STORY (3 colunas de texto) */
.story{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
@media (max-width:820px){ .story{grid-template-columns:1fr} }
.story h3{margin-bottom:8px}
.story p{color:var(--text);font-size:15px;margin:0}

/* FAQ (acordeão CSS puro) */
.faq{display:grid;grid-template-columns:0.9fr 1.1fr;gap:34px;align-items:start}
@media (max-width:820px){ .faq{grid-template-columns:1fr} }
.faq .img{aspect-ratio:4/5;border-radius:var(--r);background:#f3ecdd;width:100%;object-fit:cover;display:block}
details.q{border-bottom:1px solid var(--line);padding:18px 4px}
details.q summary{list-style:none;cursor:pointer;font-weight:600;font-size:17px;display:flex;justify-content:space-between;gap:12px}
details.q summary::-webkit-details-marker{display:none}
details.q summary::after{content:'+';color:var(--yellow-deep);font-weight:700}
details.q[open] summary::after{content:'–'}
details.q p{color:var(--text);font-size:15px;margin:12px 0 2px;max-width:60ch}

/* NEWSLETTER (dentro do footer) */
.news{background:#fff;border-radius:var(--r);padding:26px;max-width:340px;box-shadow:var(--shadow)}
.news h4{margin:10px 0 6px;font-size:18px}
.news .row{display:flex;gap:8px;margin-top:12px}
.news input{flex:1;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font-family:inherit;font-size:14px}

/* FOOTER amarelo */
.ft{background:var(--yellow);position:relative;overflow:hidden;margin-top:60px}
.ft .cols{position:relative;z-index:1;display:grid;grid-template-columns:360px 1fr 1fr;
          gap:48px;padding-block:56px;align-items:start}
.ft h4{font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}
.ft a{display:block;text-decoration:none;font-size:14px;margin-bottom:7px;opacity:.85}
.ft a:hover{opacity:1}
.ft .ftlogo{height:24px;display:block;margin-bottom:6px}
.ft .colblock + .colblock{margin-top:34px}
.ft .watermark{position:absolute;z-index:0;left:50%;transform:translateX(-50%);bottom:-6%;line-height:.8;
               white-space:nowrap;font-size:clamp(140px,27vw,360px);font-weight:800;letter-spacing:.02em;
               color:transparent;-webkit-text-stroke:2px rgba(23,23,23,.20);pointer-events:none;user-select:none}
.ft .pay{display:grid;grid-template-columns:repeat(2,64px);gap:10px}
.ft .pay span{background:#fff;border-radius:8px;height:46px;box-shadow:var(--shadow)}
@media (max-width:760px){ .ft .cols{grid-template-columns:1fr} }

/* barra de aviso + switcher de preview (só no mockup) */
.pv-bar{background:var(--ink);color:#fff;font-size:13px;padding:8px 14px;display:flex;
        gap:16px;align-items:center;justify-content:center;flex-wrap:wrap}
.pv-bar a{color:var(--yellow);text-decoration:none;font-weight:600}
.flag{color:#ffd571;font-weight:600}

/* ===================== PDP ===================== */
.breadcrumb{padding-top:18px;color:var(--text);font-size:14px}
.breadcrumb a{color:var(--text);text-decoration:none}
.pdp-top{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;padding-block:24px 12px;align-items:start}
@media (max-width:900px){ .pdp-top{grid-template-columns:1fr;gap:28px} }

/* galeria */
.gallery{display:grid;grid-template-columns:84px 1fr;gap:16px;align-items:start}
.gallery .thumbs{display:flex;flex-direction:column;gap:12px}
.gallery .thumbs img{width:84px;height:84px;object-fit:cover;border-radius:12px;border:1px solid var(--line);cursor:pointer;background:#fafafa}
.gallery .thumbs img.active{border:2px solid var(--ink)}
.gallery .main{aspect-ratio:1;border-radius:var(--r);overflow:hidden;background:#fafafa}
.gallery .main img{width:100%;height:100%;object-fit:cover}

/* buybox */
.buybox .share{display:flex;justify-content:flex-end;gap:6px;color:var(--text);font-size:13px;align-items:center}
.buybox h1{font-size:30px;font-weight:600;line-height:1.15;margin:6px 0 10px}
.buybox .desc{color:var(--text);font-size:15px;margin:0 0 14px;max-width:54ch}
.buybox ul{margin:0 0 18px;padding-left:18px;color:var(--ink);font-size:14.5px}
.buybox ul li{margin-bottom:5px}
.buybox .price{display:flex;align-items:baseline;gap:10px;margin-bottom:2px}
.buybox .price .now{color:var(--yellow-deep);font-weight:700;font-size:30px}
.buybox .price .was{color:var(--text);text-decoration:line-through;font-size:16px}
.buybox .parc{color:var(--text);font-size:14px;margin-bottom:18px}
.buy-row{display:flex;gap:12px;margin-bottom:16px}
.qty{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.qty button{border:0;background:#fff;font-size:18px;width:46px;height:52px;cursor:pointer;font-family:inherit}
.qty span{min-width:40px;text-align:center;font-weight:600}
.buy-row .btn{flex:1;height:52px}
.frete{border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:16px}
.frete .lbl{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px;margin-bottom:10px}
.frete .f-row{display:flex;gap:8px}
.frete input{flex:1;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font-family:inherit;font-size:14px}
.frete .ok{margin-top:10px;background:#eef6ee;color:#3e7d49;border-radius:8px;padding:8px 12px;font-size:13px;font-weight:600}
.bump{display:flex;align-items:center;gap:14px;border:1px dashed var(--yellow-deep);border-radius:var(--r);padding:12px;background:#fffdf3}
.bump>img{width:64px;height:64px;object-fit:contain;background:#fafafa;border-radius:10px}
.bump .info{flex:1}
.bump .info .t{font-size:12px;color:var(--text)}
.bump .info b{font-size:14px;display:block}
.bump .info .p{color:var(--yellow-deep);font-weight:700;font-size:15px}
.bump .info .p s{color:var(--text);font-weight:400;font-size:12px;margin-left:6px}
.ugc-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}
.ugc-row img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px}

/* onde entra na rotina */
.rotina{display:grid;grid-template-columns:.8fr 1fr .95fr;gap:20px;align-items:stretch}
@media (max-width:980px){ .rotina{grid-template-columns:1fr} }
.usar-img{position:relative;border-radius:var(--r);overflow:hidden;min-height:400px;background:#eee}
.usar-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.usar-img b{position:absolute;left:24px;bottom:22px;color:#fff;font-size:34px;font-weight:600;z-index:1}
.steps{border:1px solid var(--line);border-radius:var(--r);padding:26px}
.steps h3{text-align:center;margin:0 0 16px}
.step{display:flex;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.step:last-child{border-bottom:0}
.step .n{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-weight:700;flex:none}
.step.active .n{background:var(--yellow);border-color:var(--yellow)}
.step.active{background:var(--bg-soft);border-radius:12px;padding:12px;border-bottom:0}
.step .lbl{font-weight:500}
.step .prod{display:flex;gap:10px;align-items:center}
.step .prod img{width:46px;height:46px;object-fit:contain}
.step .prod small{display:block;color:var(--text);font-size:12px;max-width:24ch}
.panel{background:var(--yellow);border-radius:var(--r);padding:26px;color:var(--ink)}
.panel .tag{font-weight:700}
.panel h4{margin:6px 0 8px;font-size:18px}
.panel .how{font-size:13.5px;margin:0 0 18px}
.olf h5{margin:14px 0 8px;font-size:12px;letter-spacing:.04em;text-transform:uppercase}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:#fff;border-radius:var(--r-pill);padding:7px 14px;font-size:13px;font-weight:500}

/* flor de laranjeira */
.flor{background:var(--bg-soft);border-radius:var(--r-lg);display:grid;grid-template-columns:.8fr 1.2fr;gap:34px;align-items:center;padding:30px}
@media (max-width:820px){ .flor{grid-template-columns:1fr} }
.flor .pic{aspect-ratio:1;border-radius:var(--r);overflow:hidden;background:#fff}
.flor .pic img{width:100%;height:100%;object-fit:cover}
.flor h2{font-size:clamp(28px,4vw,44px);font-weight:600;margin:0 0 14px}
.flor p{color:var(--text);max-width:54ch;margin:0 0 22px}
.flor .nav{display:flex;gap:12px;align-items:center}
.flor .nav button{width:54px;height:54px;border-radius:50%;border:1.5px solid var(--line);background:#fff;font-size:18px;cursor:pointer}
.dots{display:flex;gap:7px;margin-right:10px}
.dots i{width:9px;height:9px;border-radius:50%;background:var(--line);display:block}
.dots i.on{background:var(--yellow-deep)}

/* ============================================================
   PROPOSTA (v2) — componentes da home/PDP novas
   "skincare para o corpo". Reusa tokens; só adiciona o que falta.
   ============================================================ */

/* announcement rotativo (estático no mockup) */
.topbar{background:var(--ink);color:#fff;font-size:13px;letter-spacing:.02em;display:flex;
        justify-content:center;gap:34px;padding:9px 16px;flex-wrap:wrap}
.topbar i{font-style:normal;display:inline-flex;gap:8px;align-items:center;opacity:.92}
@media(max-width:680px){.topbar i:nth-child(n+2){display:none}}

/* HERO 2 (texto + imagem) */
.hero2{background:var(--yellow);overflow:hidden}
.hero2 .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center;min-height:520px}
@media(max-width:860px){.hero2 .grid{grid-template-columns:1fr;min-height:0;padding-bottom:30px}}
.hero2 .copy{padding:48px 0}
.hero2 .eyebrow{font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
                color:var(--ink);margin:0 0 16px;opacity:.65}
.hero2 h1{font-size:clamp(32px,5vw,56px);font-weight:600;line-height:1.04;letter-spacing:-.015em;
          margin:0 0 18px;max-width:15ch}
.hero2 .sub{font-size:18px;color:var(--ink);max-width:46ch;margin:0 0 26px;opacity:.82}
.hero2 .cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.hero2 .proof{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500}
.hero2 .proof .stars{color:var(--ink);letter-spacing:2px}
.hero2 .shot{position:relative;align-self:stretch;min-height:380px}
.hero2 .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* OBJETIVOS — pain-nav em 4 cards grandes */
.objetivos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:860px){.objetivos{grid-template-columns:repeat(2,1fr)}}
.obj{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:3/4;display:block;
     text-decoration:none;color:#fff}
.obj img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.obj:hover img{transform:scale(1.05)}
.obj::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,23,0) 38%,rgba(23,23,23,.8))}
.obj .lbl{position:absolute;left:18px;right:18px;bottom:16px;z-index:1}
.obj .lbl b{display:block;font-size:18px;font-weight:600}
.obj .lbl small{font-size:13px;opacity:.88}

/* RITUAL — 3 passos */
.ritual{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:820px){.ritual{grid-template-columns:1fr}}
.pass{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;
      display:flex;flex-direction:column}
.pass .pic{aspect-ratio:4/3;background:#faf7ef;overflow:hidden}
.pass .pic img{width:100%;height:100%;object-fit:cover}
.pass .pb{padding:22px 24px 26px}
.pass .n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;
         background:var(--yellow);font-weight:700;font-size:14px;margin-bottom:12px}
.pass h3{font-size:19px;margin:0 0 6px}
.pass p{color:var(--text);font-size:14.5px;margin:0}

/* KIT HERÓI */
.kit{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r-lg);overflow:hidden;
     background:var(--bg-soft);border:1px solid var(--line)}
@media(max-width:820px){.kit{grid-template-columns:1fr}}
.kit .pic{position:relative;min-height:430px;background:#faf7ef}
.kit .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kit .pic .save{position:absolute;top:18px;left:18px;background:var(--ink);color:#fff;font-weight:600;
                font-size:13px;padding:7px 14px;border-radius:var(--r-pill)}
.kit .kbody{padding:clamp(28px,4vw,48px);align-self:center}
.kit .eyebrow{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow-deep);
              font-weight:700;margin:0 0 12px}
.kit h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;line-height:1.08;margin:0 0 16px}
.kit ul{list-style:none;margin:0 0 22px;padding:0}
.kit ul li{position:relative;padding-left:26px;margin-bottom:9px;font-size:15px}
.kit ul li::before{content:'✓';position:absolute;left:0;color:var(--yellow-deep);font-weight:700}
.kit .price{margin-bottom:18px}
.kit .price .now{font-size:30px;color:var(--ink);font-weight:700}
.kit .price .was{font-size:17px}

/* ATIVOS (ciência) */
.ativos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:860px){.ativos{grid-template-columns:repeat(2,1fr)}}
.ativo{border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;background:#fff;
       position:relative;overflow:hidden}
.ativo::before{content:'';position:absolute;top:-34px;right:-34px;width:96px;height:96px;border-radius:50%;
               background:radial-gradient(circle,var(--yellow),transparent 70%);opacity:.55}
.ativo .tag{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--yellow-deep);
            font-weight:700;margin-bottom:10px;display:block;position:relative}
.ativo .nome{font-size:18px;font-weight:600;margin:0 0 10px;position:relative}
.ativo p{color:var(--text);font-size:14px;margin:0;position:relative;line-height:1.5}

/* PROVA — reviews + antes/depois */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}
@media(max-width:860px){.reviews{grid-template-columns:1fr}}
.rev{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:#fff;box-shadow:var(--shadow)}
.rev .stars{color:var(--yellow-deep);letter-spacing:1px;margin-bottom:10px;font-size:15px}
.rev p{font-size:14.5px;margin:0 0 16px}
.rev .who{display:flex;align-items:center;gap:10px}
.rev .who .av{width:38px;height:38px;border-radius:50%;background:var(--yellow);display:grid;
              place-items:center;font-weight:700;font-size:14px;flex:none}
.rev .who b{font-size:13.5px;display:block}
.rev .who small{font-size:12px;color:var(--text)}
.ba{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:860px){.ba{grid-template-columns:1fr}}
.ba figure{margin:0;border-radius:var(--r);overflow:hidden;position:relative;aspect-ratio:4/3;background:#eee}
.ba figure img{width:100%;height:100%;object-fit:cover}
.ba figcaption{position:absolute;left:10px;bottom:10px;background:rgba(23,23,23,.78);color:#fff;
               font-size:11px;padding:5px 10px;border-radius:var(--r-pill)}

/* OLFATO — Amber x Kalliste */
.olfato{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:760px){.olfato{grid-template-columns:1fr}}
.mundo{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:420px;display:flex;
       align-items:flex-end;color:#fff}
.mundo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mundo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,23,.05),rgba(23,23,23,.74))}
.mundo .mc{position:relative;z-index:1;padding:36px}
.mundo .mc .nm{font-size:32px;font-weight:600;margin:0 0 4px}
.mundo .mc .ds{font-size:14px;opacity:.9;margin:0 0 18px;max-width:32ch}

/* MANIFESTO */
.manifesto{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:clamp(40px,7vw,84px);text-align:center}
.manifesto p{font-size:clamp(22px,2.7vw,32px);font-weight:400;line-height:1.4;max-width:22ch;
             margin:0 auto;letter-spacing:.005em}
.manifesto p + p{margin-top:18px}
.manifesto em{font-style:normal;color:var(--yellow)}
.manifesto .sig{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--yellow);margin-top:30px}

/* PARA QUEM (PDP) */
.paraquem{background:var(--bg-soft);border-radius:var(--r-lg);padding:clamp(26px,4vw,40px)}
.paraquem .pg{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:18px}
@media(max-width:760px){.paraquem .pg{grid-template-columns:repeat(2,1fr)}}
.paraquem .it b{display:block;margin-bottom:3px;font-size:15px}
.paraquem .it small{color:var(--text);font-size:13.5px}

/* SELETOR DE OFERTA (PDP buybox) */
.offer{display:grid;gap:10px;margin:6px 0 18px}
.offer label{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:var(--r-sm);
             padding:14px 16px;cursor:pointer}
.offer label.sel{border-color:var(--ink);background:#fffdf3}
.offer .rd{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);flex:none}
.offer label.sel .rd{border-color:var(--ink);background:var(--ink);box-shadow:inset 0 0 0 3px #fff}
.offer .ot{flex:1}
.offer .ot b{font-size:14.5px;display:block}
.offer .ot small{font-size:12.5px;color:var(--text)}
.offer .op{font-weight:700;color:var(--yellow-deep);white-space:nowrap}
.offer .best{background:var(--yellow);color:var(--ink);font-size:11px;font-weight:700;padding:3px 8px;
             border-radius:var(--r-pill);margin-left:8px}

/* STICKY CTA mobile (PDP) */
.sticky-buy{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--line);
            display:none;gap:12px;align-items:center;padding:10px 16px;box-shadow:0 -8px 24px -16px rgba(0,0,0,.3)}
.sticky-buy .sp b{color:var(--yellow-deep);font-size:17px}
.sticky-buy .sp small{display:block;color:var(--text);font-size:11px}
.sticky-buy .btn{flex:1}
@media(max-width:760px){.sticky-buy{display:flex}}

/* utilitário */
.center{text-align:center}
.center .lead{margin-inline:auto}
.mt-cta{margin-top:26px}

/* ============================================================
   v3 — hero full-banner, newsletter band, footer rico (Flexform-like)
   ============================================================ */

/* breadcrumb folga (pílula do header desce 26px sobre o conteúdo) */
.breadcrumb{padding-top:46px}

/* HERO full-bleed banner */
.hero-full{position:relative;background:var(--yellow);overflow:hidden}
.hero-full .media{position:relative;width:100%;height:clamp(440px,60vw,640px)}
.hero-full .media img{width:100%;height:100%;object-fit:cover;display:block}
.hero-full .scrim{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(23,23,23,.06) 0%,rgba(23,23,23,0) 38%,rgba(23,23,23,.62) 100%)}
.hero-full .ov{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  align-items:center;text-align:center;padding:0 24px clamp(34px,5vw,56px);color:#fff}
.hero-full .ov .eyebrow{font-size:13px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;
  margin:0 0 14px;opacity:.92}
.hero-full .ov h1{font-size:clamp(30px,4.6vw,54px);font-weight:600;line-height:1.06;letter-spacing:-.012em;
  margin:0 0 24px;max-width:20ch;text-shadow:0 2px 30px rgba(0,0,0,.32)}
.hero-full .ov .cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.hero-full .ov .btn-2{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.5);backdrop-filter:blur(4px)}

/* NEWSLETTER band (acima do footer) */
.newsband{background:var(--yellow)}
.newsband .in{display:flex;align-items:center;justify-content:space-between;gap:28px;
  padding-block:38px;flex-wrap:wrap}
.newsband h3{font-size:clamp(20px,2.4vw,28px);font-weight:600;margin:0;max-width:18ch}
.newsband p{margin:6px 0 0;font-size:14px;opacity:.78}
.newsband form{display:flex;gap:10px;flex:1;max-width:480px;min-width:280px}
.newsband input{flex:1;border:0;border-radius:var(--r-sm);padding:15px 16px;font-family:inherit;
  font-size:14px;background:#fff}

/* FOOTER rico escuro */
.ftx{background:var(--ink);color:#fff;padding-top:56px;margin-top:0}
.ftx .cols{display:grid;grid-template-columns:1.5fr 1fr 1.1fr .9fr 1.4fr;gap:36px;padding-bottom:42px}
@media(max-width:980px){.ftx .cols{grid-template-columns:1fr 1fr;gap:32px 24px}}
@media(max-width:560px){.ftx .cols{grid-template-columns:1fr}}
.ftx h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);
  margin:0 0 16px;font-weight:700}
.ftx a{display:block;color:rgba(255,255,255,.72);text-decoration:none;font-size:14px;margin-bottom:9px}
.ftx a:hover{color:#fff}
.ftx .brand .blogo{height:26px;margin-bottom:16px;display:block}
.ftx .brand p{color:rgba(255,255,255,.58);font-size:13.5px;max-width:32ch;margin:0 0 16px;line-height:1.55}
.ftx .pays{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px;max-width:240px}
.ftx .pays img{height:30px;width:auto;display:block;border-radius:5px}
.ftx .seals{display:flex;flex-wrap:wrap;gap:9px}
.ftx .seals img{height:40px;width:auto;display:block}
.ftx .bottom{border-top:1px solid rgba(255,255,255,.12);padding-block:20px;display:flex;
  align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ftx .bottom small{color:rgba(255,255,255,.5);font-size:12.5px;line-height:1.5}
.ftx .dev{display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.55);font-size:12px;white-space:nowrap}
.ftx .dev img{height:20px;opacity:.92}

/* microconfiança / labels com ícone real */
.trust-row{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin:0 0 16px}
.trust-row .ti{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text)}
.trust-row .ti img{width:17px;height:17px;display:block}
.lbl-ic{display:inline-flex;align-items:center;gap:8px}
.lbl-ic img{width:18px;height:18px;display:block}
.ok-ic{display:inline-flex;align-items:center;gap:7px}
.ok-ic img{width:16px;height:16px;display:block}
.share img{width:16px;height:16px;display:block}
.share{display:inline-flex;align-items:center;gap:6px;cursor:pointer}

/* =========================================================
   v4 — REFINAMENTO PREMIUM (tipografia, espaço, cards, botões)
   footer amarelo, share social, reviews de creator (Domina)
   ========================================================= */
:root{
  --ink-soft:#5b574f;          /* texto secundário legível */
  --bg-soft:#FBFAF6;           /* creme quente no lugar do cinza */
  --line:rgba(23,23,23,.08);
  --shadow:0 2px 4px rgba(23,23,23,.03),0 18px 44px -26px rgba(23,23,23,.24);
  --shadow-lg:0 14px 40px -16px rgba(23,23,23,.20);
  --section-y:92px;
}
@media(max-width:560px){:root{--section-y:60px}}

body{letter-spacing:.002em}
p{line-height:1.65}
.display{letter-spacing:-.022em;line-height:1.02}
.h2{letter-spacing:-.015em;line-height:1.1;font-size:clamp(26px,3.4vw,38px)}
.lead{color:var(--ink-soft);font-size:17.5px;line-height:1.6}
.muted{color:var(--ink-soft)}
.sec-head{margin-bottom:30px}

/* botões premium (pill, hover com leve elevação) */
.btn{padding:15px 30px;border-radius:var(--r-pill);font-weight:600;letter-spacing:.01em;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease}
.btn-1{box-shadow:0 8px 20px -10px rgba(224,181,17,.75)}
.btn-1:hover{background:#FCD750;transform:translateY(-1px);box-shadow:0 12px 26px -10px rgba(224,181,17,.85)}
.btn-2:hover{transform:translateY(-1px);border-color:var(--ink)}

/* superfícies mais arejadas: tira borda dura, usa sombra suave + hover */
.card{border:0;box-shadow:var(--shadow);transition:transform .22s ease, box-shadow .25s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.card .ph{background:#FBFAF6}
.card .ph img{padding:12px}
.usp .item{border:0;box-shadow:var(--shadow)}
.ativo{border:0;box-shadow:var(--shadow);padding:28px 24px}
.rev{border:0;box-shadow:var(--shadow)}
.pass{border:0;box-shadow:var(--shadow)}
.kit{border:0;box-shadow:var(--shadow-lg)}
.paraquem{box-shadow:var(--shadow)}

/* hero overlay um pouco mais sóbrio e elegante */
.hero-full .ov h1{font-weight:600;text-shadow:0 2px 36px rgba(0,0,0,.34)}

/* SHARE social (igual referência) */
.share-row{display:flex;align-items:center;gap:11px;margin:0 0 14px;flex-wrap:wrap}
.share-row .lab{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);font-weight:700}
.share-row a{display:inline-flex}
.share-row img{width:34px;height:34px;display:block;transition:transform .15s ease}
.share-row a:hover img{transform:translateY(-2px)}
.share-row .fav{display:inline-flex;align-items:center;gap:6px;margin-left:4px;font-size:14px;color:var(--ink);cursor:pointer}
.share-row .fav img{width:20px;height:20px}

/* REVIEWS de creator (via Domina) */
.via{font-size:13px;color:var(--ink-soft)}
.rev .rtop{display:flex;align-items:center;gap:11px;margin-bottom:13px}
.rev .rav{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none}
.rev .rtop b{font-size:14px;display:block;line-height:1.2}
.rev .rtop small{font-size:12px;color:var(--ink-soft)}
.rev .rtop .tag{margin-left:auto;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  background:var(--yellow);color:var(--ink);padding:4px 9px;border-radius:var(--r-pill)}

/* NEWSLETTER + FOOTER AMARELO (identidade da marca, info nova) */
.newsband{background:var(--yellow);border-bottom:1px solid rgba(23,23,23,.10)}
.newsband h3{letter-spacing:-.01em}
.fty{background:var(--yellow);position:relative;overflow:hidden}
.fty .wrap{position:relative;z-index:1}
.fty .cols{display:grid;grid-template-columns:1.7fr 1fr 1.15fr 1fr 1.45fr;gap:40px;
  padding-top:62px;padding-bottom:46px}
@media(max-width:980px){.fty .cols{grid-template-columns:1fr 1fr;gap:36px 26px}}
@media(max-width:560px){.fty .cols{grid-template-columns:1fr}}
.fty h4{font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink);margin:0 0 16px;font-weight:700}
.fty a{display:block;color:rgba(23,23,23,.72);text-decoration:none;font-size:14.5px;margin-bottom:10px;width:fit-content}
.fty a:hover{color:var(--ink)}
.fty .brand .blogo{height:30px;margin-bottom:16px;display:block}
.fty .brand p{color:rgba(23,23,23,.66);font-size:14px;max-width:34ch;margin:0 0 20px;line-height:1.6}
.fty .socials{display:flex;gap:11px}
.fty .socials a{display:inline-flex;margin:0}
.fty .socials img{width:40px;height:40px;display:block;transition:transform .15s ease}
.fty .socials a:hover img{transform:translateY(-3px)}
.fty .pays{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;max-width:252px}
.fty .pays img{height:30px;width:auto;display:block;border-radius:5px;box-shadow:0 3px 10px -5px rgba(23,23,23,.4)}
.fty .seals{display:flex;flex-wrap:wrap;gap:9px}
.fty .seals img{height:42px;width:auto;display:block;border-radius:6px;box-shadow:0 3px 10px -5px rgba(23,23,23,.4)}
.fty .bottom{position:relative;z-index:1;border-top:1px solid rgba(23,23,23,.16);padding-block:22px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.fty .bottom small{color:rgba(23,23,23,.62);font-size:12.5px}
.fty .dev{display:flex;align-items:center;gap:11px;color:rgba(23,23,23,.62);font-size:13px;white-space:nowrap}
.fty .dev img{height:34px}                 /* logo DigitAll bem maior */
.fty .watermark{position:absolute;z-index:0;left:50%;transform:translateX(-50%);bottom:-9%;line-height:.8;
  white-space:nowrap;font-size:clamp(120px,23vw,300px);font-weight:800;letter-spacing:.02em;color:transparent;
  -webkit-text-stroke:2px rgba(23,23,23,.09);pointer-events:none;user-select:none}

/* =========================================================
   v5 — footer premium (zona de marca + colunas) + popup newsletter
   ========================================================= */
/* zona de marca no topo do footer */
.fty .ftop{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;
  padding-top:62px;padding-bottom:34px;border-bottom:1px solid rgba(23,23,23,.16);flex-wrap:wrap}
.fty .ftbrand .blogo{height:44px;margin-bottom:16px;display:block}
.fty .ftbrand p{margin:0;font-size:15.5px;color:rgba(23,23,23,.72);max-width:42ch;line-height:1.6}
.fty .ftsocial{text-align:right}
.fty .ftsocial .lbl{display:block;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;margin-bottom:12px;color:var(--ink)}
.fty .ftsocial .socials{justify-content:flex-end}
/* colunas (4) */
.fty .cols{grid-template-columns:1fr 1fr 1fr 1.65fr;gap:36px;padding-top:46px;padding-bottom:46px}
.fty .trustlabel{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(23,23,23,.55);
  margin:16px 0 9px;font-weight:700}
@media(max-width:980px){
  .fty .ftop{align-items:flex-start}
  .fty .ftsocial{text-align:left}
  .fty .ftsocial .socials{justify-content:flex-start}
  .fty .cols{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){ .fty .cols{grid-template-columns:1fr} }

/* POPUP newsletter */
.np-overlay{position:fixed;inset:0;z-index:100;background:rgba(23,23,23,.58);backdrop-filter:blur(3px);
  display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .25s ease}
.np-overlay.open{display:flex;opacity:1}
.np{background:#fff;border-radius:var(--r-lg);overflow:hidden;max-width:860px;width:100%;
  display:grid;grid-template-columns:1fr 1fr;box-shadow:0 40px 90px -24px rgba(0,0,0,.55);
  transform:translateY(14px) scale(.985);transition:transform .32s cubic-bezier(.2,.7,.3,1)}
.np-overlay.open .np{transform:none}
@media(max-width:680px){.np{grid-template-columns:1fr;max-width:400px}.np .np-pic{display:none}}
.np .np-pic{position:relative;background:#faf7ef;min-height:440px}
.np .np-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.np .np-body{padding:clamp(30px,4vw,46px);position:relative}
.np .np-close{position:absolute;top:16px;right:18px;width:34px;height:34px;border-radius:50%;border:0;
  background:#f1eee8;cursor:pointer;font-size:20px;line-height:1;color:var(--ink);display:grid;place-items:center}
.np .np-close:hover{background:#e7e2d8}
.np .np-eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:var(--yellow-deep);margin:0 0 12px}
.np h3{font-size:clamp(25px,3vw,33px);font-weight:600;line-height:1.06;margin:0 0 10px;letter-spacing:-.015em}
.np .np-sub{color:var(--ink-soft);font-size:15px;margin:0 0 22px;max-width:34ch}
.np form{display:flex;flex-direction:column;gap:10px}
.np input{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:15px 16px;font-family:inherit;font-size:15px}
.np input:focus{outline:none;border-color:var(--yellow-deep)}
.np .btn{width:100%}
.np .np-no{background:none;border:0;color:var(--ink-soft);font-size:13px;cursor:pointer;margin-top:14px;
  text-decoration:underline;font-family:inherit;display:block}
.np .np-fine{font-size:11.5px;color:var(--text);margin:16px 0 0;line-height:1.5}

/* =========================================================
   v6 — telas internas: coleção, A Marca, resultados, kits, checkout
   ========================================================= */
.ugc-cap{font-size:13px;color:var(--ink-soft);margin:22px 0 9px}
.ugc-cap b{color:var(--ink)}

/* cabeçalho de página interna */
.page-head{padding-top:52px;padding-bottom:10px}
.page-head .kick{color:var(--yellow-deep);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:12px;margin:0 0 12px}
.page-head h1{font-size:clamp(30px,4.2vw,48px);font-weight:600;letter-spacing:-.022em;margin:0 0 12px;line-height:1.03}
.page-head p{color:var(--ink-soft);font-size:17px;max-width:62ch;margin:0;line-height:1.55}

/* COLEÇÃO */
.collection{display:grid;grid-template-columns:248px 1fr;gap:44px;align-items:start}
@media(max-width:900px){.collection{grid-template-columns:1fr}}
.filters{position:sticky;top:96px}
@media(max-width:900px){.filters{position:static}}
.filters .fgroup{border-bottom:1px solid var(--line);padding:18px 0}
.filters .fgroup:first-child{padding-top:0}
.filters h4{font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;margin:0 0 13px;font-weight:700}
.filters label{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--ink-soft);margin-bottom:10px;cursor:pointer}
.filters input[type=checkbox]{width:16px;height:16px;accent-color:var(--yellow-deep)}
.coll-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.coll-bar .count{color:var(--ink-soft);font-size:14px}
.coll-bar select{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:11px 14px;font-family:inherit;font-size:14px;background:#fff;cursor:pointer}
.col-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.col-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.col-grid{grid-template-columns:1fr}}
.chiprow{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}
.chiprow .c{border:1.5px solid var(--line);border-radius:var(--r-pill);padding:9px 17px;font-size:13.5px;cursor:pointer;background:#fff;text-decoration:none;color:var(--ink)}
.chiprow .c.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* STATS */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:center}
@media(max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}
.stats .st b{display:block;font-size:clamp(32px,4vw,48px);font-weight:600;color:var(--ink);letter-spacing:-.025em;line-height:1}
.stats .st span{color:var(--ink-soft);font-size:14px;display:block;margin-top:8px}

/* EDITORIAL split (A Marca) */
.editorial{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
@media(max-width:860px){.editorial{grid-template-columns:1fr;gap:28px}}
.editorial .pic{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;background:#faf7ef}
.editorial .pic img{width:100%;height:100%;object-fit:cover}
.editorial h2{font-size:clamp(26px,3.2vw,38px);font-weight:600;letter-spacing:-.02em;margin:0 0 16px;line-height:1.08}
.editorial p{color:var(--ink-soft);font-size:16px;margin:0 0 14px;line-height:1.66}
.editorial .pic-first{order:-1}

/* VALORES */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media(max-width:760px){.values{grid-template-columns:1fr}}
.value{text-align:center;padding:6px}
.value .vic{width:58px;height:58px;margin:0 auto 16px;display:grid;place-items:center;background:var(--yellow);border-radius:50%}
.value .vic img{width:28px;height:28px}
.value h3{font-size:18px;margin:0 0 7px}
.value p{color:var(--ink-soft);font-size:14.5px;margin:0;line-height:1.55}

/* CHECKOUT */
.co-head{background:#fff;border-bottom:1px solid var(--line);padding:16px 0;position:sticky;top:0;z-index:20}
.co-head .in{display:flex;align-items:center;justify-content:space-between}
.co-head .clogo{height:22px}
.co-head .secure{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft)}
.co-head .secure img{width:16px;height:16px}
.checkout{display:grid;grid-template-columns:1fr 420px;gap:46px;align-items:start;padding-block:42px}
@media(max-width:900px){.checkout{grid-template-columns:1fr}}
.co-step{margin-bottom:32px}
.co-step .st-h{display:flex;align-items:center;gap:11px;margin-bottom:18px}
.co-step .st-h .n{width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:14px;font-weight:700;flex:none}
.co-step .st-h h3{margin:0;font-size:18px}
.field{margin-bottom:13px}
.field label{display:block;font-size:13px;color:var(--ink-soft);margin-bottom:6px}
.field input,.field select{width:100%;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:13px 14px;font-family:inherit;font-size:14.5px}
.field input:focus,.field select:focus{outline:none;border-color:var(--yellow-deep)}
.field.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.pay-opts{display:grid;gap:10px}
.pay-opt{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:14px 16px;cursor:pointer}
.pay-opt.sel{border-color:var(--ink);background:#fffdf3}
.pay-opt .rd{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);flex:none}
.pay-opt.sel .rd{border-color:var(--ink);background:var(--ink);box-shadow:inset 0 0 0 3px #fff}
.pay-opt b{font-size:14.5px}
.pay-opt .pflags{margin-left:auto;display:flex;gap:5px}
.pay-opt .pflags img{height:22px;border-radius:3px}
.summary{background:var(--bg-soft);border-radius:var(--r-lg);padding:26px;position:sticky;top:88px}
.summary h3{margin:0 0 16px;font-size:18px}
.sumline{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.sumline img{width:56px;height:56px;object-fit:cover;border-radius:10px;background:#fff}
.sumline .nm{flex:1;font-size:14px}
.sumline .nm small{display:block;color:var(--ink-soft);font-size:12px}
.sumline .pr{font-weight:600;color:var(--yellow-deep);font-size:14px}
.cupom{display:flex;gap:8px;margin:16px 0}
.cupom input{flex:1;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:11px 13px;font-family:inherit;font-size:14px}
.sumtot{display:flex;justify-content:space-between;padding:7px 0;font-size:14px;color:var(--ink-soft)}
.sumtot.tot{font-size:21px;color:var(--ink);font-weight:700;border-top:1px solid var(--line);margin-top:8px;padding-top:15px}
.sumtot.tot small{font-weight:400;font-size:12px;color:var(--ink-soft)}
.co-trust{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.co-trust .t{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-soft)}
.co-trust .t img{width:15px;height:15px}

/* =========================================================
   v7 — TRATAMENTO (landing fiel ao Figma 97:220)
   ========================================================= */
/* hero condição: antes/depois + card */
.cond{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:stretch}
@media(max-width:860px){.cond{grid-template-columns:1fr}}
.ba-slide{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:440px;background:#cfc8be}
.ba-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-slide .lab{position:absolute;top:20px;z-index:2;color:#fff;font-weight:600;font-size:20px;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.ba-slide .lab.a{left:24px}.ba-slide .lab.d{right:24px;opacity:.9}
.ba-slide .divider{position:absolute;top:0;bottom:0;left:50%;width:3px;background:#fff;z-index:2;transform:translateX(-50%)}
.ba-slide .handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;width:56px;height:56px;border-radius:50%;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.35);display:grid;place-items:center}
.ba-slide .handle img{position:static;width:22px;height:22px}
.cond-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(28px,4vw,52px);display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow)}
.cond-card h2{font-size:clamp(24px,3vw,34px);font-weight:600;margin:0 0 16px;letter-spacing:-.01em}
.cond-card p{color:var(--ink-soft);font-size:16.5px;margin:0;line-height:1.62;max-width:48ch}

/* showcase de produto (imagem + painel abas/ingredientes) */
.showcase{display:grid;grid-template-columns:.76fr 1.24fr;gap:24px;align-items:stretch;margin-bottom:24px}
@media(max-width:860px){.showcase{grid-template-columns:1fr}}
.sc-pic{position:relative;background:var(--bg-soft);border-radius:var(--r-lg);display:grid;place-items:center;min-height:380px;padding:24px}
.sc-pic>img{max-height:330px;width:auto;object-fit:contain}
.sc-arrow{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer;z-index:2;box-shadow:var(--shadow)}
.sc-arrow img{width:20px;height:20px}
.sc-arrow.l{left:12px}.sc-arrow.l img{transform:scaleX(-1)}
.sc-arrow.r{right:12px}
.sc-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;box-shadow:var(--shadow);position:relative}
.sc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;gap:16px;flex-wrap:wrap}
.sc-top h3{font-size:23px;font-weight:600;margin:0}
.sc-tabs{display:flex;gap:10px}
.sc-tabs button{border:1.5px solid var(--line);background:#fff;border-radius:var(--r-pill);padding:11px 24px;font-family:inherit;font-weight:600;font-size:13px;letter-spacing:.05em;cursor:pointer;color:var(--ink)}
.sc-tabs button.on{background:var(--yellow);border-color:var(--yellow)}
.sc-ings{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:680px){.sc-ings{grid-template-columns:1fr}}
.sc-ing{background:var(--bg-soft);border-radius:var(--r);padding:22px}
.sc-ing h4{font-size:16px;margin:0 0 9px}
.sc-ing p{font-size:13.5px;color:var(--ink-soft);margin:0;line-height:1.55}

/* banda do kit 30% */
.kitband{display:grid;grid-template-columns:1.05fr 1fr 1.1fr;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
@media(max-width:860px){.kitband{grid-template-columns:1fr}}
.kitband .kb-off{background:var(--yellow);display:flex;align-items:center;padding:clamp(30px,4vw,52px)}
.kitband .kb-off h2{font-size:clamp(26px,3.2vw,42px);font-weight:700;margin:0;line-height:1.08;letter-spacing:-.015em}
.kitband .kb-pic{background:var(--bg-soft);display:grid;place-items:center;padding:24px;min-height:300px}
.kitband .kb-pic img{max-height:280px;width:auto;object-fit:contain}
.kitband .kb-body{padding:clamp(28px,3vw,42px);align-self:center}
.kitband .kb-body h3{font-size:21px;font-weight:600;margin:0 0 18px;max-width:24ch;line-height:1.15}
.kitband .kb-body ul{list-style:none;margin:0 0 18px;padding:0}
.kitband .kb-body li{display:flex;align-items:center;gap:11px;font-size:15px;margin-bottom:9px}
.kitband .kb-body li::before{content:'';width:14px;height:14px;border-radius:50%;background:var(--yellow);flex:none}
.kitband .kb-body .price{margin-bottom:4px}
.kitband .kb-body .price .now{font-size:24px}

/* =========================================================
   v8 — carrossel do hero Tratamento (auto, por tipo)
   ========================================================= */
.cond-carousel{position:relative}
.cond-viewport{overflow:hidden;border-radius:var(--r-lg)}
.cond-track{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.cond-slide{flex:0 0 100%;min-width:0;padding:4px}
.cond-ctrl{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:22px}
.cond-ctrl .nav{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:#fff;
  display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow)}
.cond-ctrl .nav img{width:20px;height:20px}
.cond-ctrl .nav.prev img{transform:scaleX(-1)}
.cond-ctrl .dots{display:flex;gap:8px;align-items:center}
.cond-ctrl .dot{width:9px;height:9px;border-radius:50%;background:rgba(23,23,23,.18);cursor:pointer;
  border:0;padding:0;transition:width .25s ease, background .25s ease}
.cond-ctrl .dot.on{background:var(--yellow-deep);width:26px;border-radius:5px}
.cond-card .kicker{margin-bottom:12px}

/* =========================================================
   v9 — ROBUSTEZ MOBILE (anti-overflow horizontal + ajustes finos)
   ========================================================= */
body{overflow-x:clip}                 /* trava scroll horizontal sem quebrar sticky */
img,svg{max-width:100%}
input,select,textarea{min-width:0;max-width:100%}

/* min-width:0 nos filhos de grid/flex que contêm imagem/texto grande
   (corrige o overflow causado por min-width:auto) */
.usp .item,.objetivos>*,.ritual>*,.ativos>*,.reviews>*,.rev>*,.ba>*,.story>*,.values>*,
.pdp-top>*,.gallery,.gallery>*,.buybox,.rotina>*,.steps>*,.step>*,.bump,.bump>*,.ugc-row>*,
.checkout>*,.summary,.summary>*,.sumline,.sumline>*,.pay-opt,.pay-opt>*,.field,.field>*,
.kit>*,.kitband>*,.showcase>*,.sc-panel,.sc-panel>*,.sc-ings>*,.cond,.cond>*,.cond-slide,.cond-slide>*,
.editorial>*,.olfato>*,.mundo>*,.tiles>*,.pain a,.grid-4>*,.col-grid>*,.stats>*,
.hero-full .ov,.cond-card,.cond-card>*,.ftbrand,.fty .cols>*,.usp .item>div{min-width:0}

/* CHECKOUT: campos multi-coluna colapsam no mobile */
@media(max-width:620px){
  .field.row2,.field.row3{grid-template-columns:1fr}
  .co-head .secure{display:none}
  .pay-opt{flex-wrap:wrap}
  .pay-opt .pflags{margin-left:0}
}

/* GALERIA da PDP: thumbs menores no mobile */
@media(max-width:560px){
  .gallery{grid-template-columns:60px 1fr;gap:10px}
  .gallery .thumbs img{width:60px;height:60px}
}

/* HERO full: respiro e quebra dos CTAs no mobile */
@media(max-width:560px){
  .hero-full .ov{padding-bottom:26px}
  .hero-full .ov .cta{width:100%}
  .hero-full .ov .cta .btn{flex:1 1 auto;text-align:center;justify-content:center}
}

/* KIT band / showcase: imagem não estoura no mobile */
@media(max-width:860px){
  .kitband .kb-pic img,.sc-pic>img{max-height:240px}
}

/* =========================================================
   v10 — footer estilo FIGMA (amarelo + card newsletter + watermark)
   categorias novas; Social e Compra segura lado a lado; crédito DigitAll
   ========================================================= */
.ftf{background:var(--yellow);position:relative;overflow:hidden;margin-top:60px}
.ftf .cols{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:flex-start;gap:40px 56px;padding-top:56px;padding-bottom:36px}
.ftf .news{flex:0 0 300px}
.ftf .flinks{display:flex;gap:clamp(38px,4.5vw,72px);flex-wrap:wrap;flex:0 1 auto}
.ftf .flinks>div{min-width:0}
.ftf .ftrust{display:flex;flex-direction:column;gap:20px;align-items:flex-end;text-align:right;flex:0 0 auto}
.ftf .ftrust .lab{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--ink);margin-bottom:11px}
@media(max-width:920px){
  .ftf .cols{justify-content:flex-start;gap:34px 48px}
  .ftf .ftrust{flex-basis:100%;align-items:flex-start;text-align:left}
  .ftf .ftrust .fsoc,.ftf .ftrust .pay{justify-content:flex-start}
}
@media(max-width:560px){
  .ftf .news{flex:1 1 100%}
  .ftf .flinks{gap:26px 40px}
  .ftf .ftrust{flex-direction:row;flex-wrap:wrap;gap:24px 40px}
}
.ftf .news{background:#fff;border-radius:var(--r);padding:26px;box-shadow:var(--shadow)}
.ftf .news .ftlogo{height:24px;display:block;margin-bottom:14px}
.ftf .news h4{font-size:18px;margin:0 0 6px;letter-spacing:0;text-transform:none;color:var(--ink)}
.ftf .news p{font-size:13.5px;color:var(--ink-soft);margin:0}
.ftf .news .row{display:flex;gap:8px;margin-top:14px}
.ftf .news input{flex:1;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font-family:inherit;font-size:14px}
.ftf h4{font-size:13px;letter-spacing:.03em;margin:0 0 14px;font-weight:700;color:var(--ink)}
.ftf a{display:block;text-decoration:none;font-size:14px;margin-bottom:9px;color:rgba(23,23,23,.8);width:fit-content}
.ftf a:hover{color:var(--ink)}
.ftf .fsoc{display:flex;gap:9px;justify-content:flex-end}
.ftf .fsoc img{width:38px;height:38px;display:block;transition:transform .15s ease}
.ftf .fsoc a:hover img{transform:translateY(-2px)}
.ftf .pay{display:grid;grid-template-columns:repeat(3,56px);gap:8px;justify-content:flex-end}
.ftf .pay img{width:56px;height:37px;object-fit:contain;background:#fff;border-radius:6px;box-shadow:0 2px 8px -4px rgba(23,23,23,.3)}
.ftf .ft-bottom{position:relative;z-index:1;border-top:1px solid rgba(23,23,23,.16);padding-block:20px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.ftf .ft-bottom small{color:rgba(23,23,23,.62);font-size:12.5px}
.ftf .ft-bottom .dev{display:flex;align-items:center;gap:10px;color:rgba(23,23,23,.62);font-size:12.5px;white-space:nowrap}
.ftf .ft-bottom .dev img{height:30px}

/* =========================================================
   v11 — UGC EM VÍDEO (frame Domina, igual Je Peux) na PDP
   carrossel horizontal de cards estilo player vertical
   ========================================================= */
.ugcv .uhead{max-width:720px;margin-bottom:30px}
.ugcv .eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:var(--yellow-deep);margin:0 0 14px}
.ugcv h2{font-size:clamp(26px,3.4vw,38px);font-weight:600;letter-spacing:-.015em;line-height:1.1;margin:0}
.ugcv .sub{color:var(--ink-soft);font-size:16px;line-height:1.6;margin:14px 0 0;max-width:58ch}
.uvrow{display:grid;grid-auto-flow:column;grid-auto-columns:262px;gap:18px;overflow-x:auto;
  scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch}
.uvrow::-webkit-scrollbar{height:8px}
.uvrow::-webkit-scrollbar-thumb{background:rgba(23,23,23,.16);border-radius:8px}
.uvrow>*{scroll-snap-align:start;min-width:0}
.uvclip{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:9/14;background:#1a1a1a;
  box-shadow:var(--shadow)}
.uvclip>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.uvclip .grad{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,0) 24%,rgba(0,0,0,0) 60%,rgba(0,0,0,.6) 100%)}
.uv-top{position:absolute;top:11px;left:12px;right:12px;z-index:2;display:flex;align-items:center;gap:9px}
.uv-top .av{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:none;border:1.5px solid rgba(255,255,255,.9)}
.uv-top .nm{min-width:0;line-height:1.1}
.uv-top .nm b{display:block;font-size:13px;font-weight:600;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.55);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uv-top .nm small{display:block;font-size:11px;color:rgba(255,255,255,.82);text-shadow:0 1px 4px rgba(0,0,0,.55)}
.uv-top .tt{margin-left:auto;width:19px;height:19px;color:#fff;flex:none}
.uv-play{position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);z-index:2;width:58px;height:58px;
  border-radius:50%;background:rgba(38,38,38,.5);display:grid;place-items:center;backdrop-filter:blur(2px);
  border:1px solid rgba(255,255,255,.18)}
.uv-play svg{width:21px;height:21px;color:#fff;margin-left:3px}
.uv-rail{position:absolute;right:9px;bottom:50px;z-index:2;display:flex;flex-direction:column;gap:15px;align-items:center}
.uv-rail .it{display:flex;flex-direction:column;align-items:center;gap:3px;color:#fff}
.uv-rail .it svg{width:23px;height:23px;filter:drop-shadow(0 1px 3px rgba(0,0,0,.55))}
.uv-rail .it span{font-size:11px;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.55)}
.uv-bar{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;gap:9px;
  padding:9px 11px;color:#fff}
.uv-bar svg{width:14px;height:14px;flex:none;color:#fff}
.uv-bar .tm{font-size:11px;color:rgba(255,255,255,.95);white-space:nowrap;font-variant-numeric:tabular-nums}
.uv-bar .sp{flex:1}
.uvcard .cap{font-size:13px;color:var(--ink-soft);margin:11px 2px 0}

/* =========================================================
   v12 — refino do card UGC + header com setas + polish geral
   ========================================================= */
.ugcv .uhead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:28px;max-width:none}
.ugcv .utxt{max-width:680px}
.ugcv .uvnav{display:flex;gap:10px;flex:none}
.ugcv .uvnav .nav{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:#fff;
  display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow);transition:transform .15s ease,border-color .15s ease}
.ugcv .uvnav .nav:hover{border-color:var(--ink);transform:translateY(-1px)}
.ugcv .uvnav .nav img{width:18px;height:18px}
.ugcv .uvnav .nav.prev img{transform:scaleX(-1)}
@media(max-width:680px){.ugcv .uvnav{display:none}}

/* card: hover, anel sutil, play vira amarelo no hover, legenda refinada */
.uvcard{transition:transform .25s ease}
.uvcard:hover{transform:translateY(-4px)}
.uvclip{transition:box-shadow .25s ease}
.uvclip::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:3;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)}
.uvcard:hover .uvclip{box-shadow:var(--shadow-lg)}
.uv-play{transition:transform .25s ease, background .25s ease}
.uvcard:hover .uv-play{transform:translate(-50%,-50%) scale(1.08);background:rgba(224,181,17,.95);border-color:rgba(255,255,255,.4)}
.uvcard:hover .uv-play svg{color:#171717}
.uvcard .cap{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft);margin:12px 2px 0;font-weight:500}
.uvcard .cap::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--yellow-deep);flex:none}
/* barra inferior do player com leve veladura pra legibilidade */
.uv-bar{background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.35))}

/* =========================================================
   v13 — MENU MOBILE (hambúrguer + drawer lateral)
   ========================================================= */
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;
  border:0;background:transparent;cursor:pointer;padding:0;justify-self:start}
.burger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px}
@media(max-width:760px){ .burger{display:flex} .hd .bar{padding:0 16px} }

.mnav{position:fixed;inset:0;z-index:70;background:rgba(23,23,23,.5);backdrop-filter:blur(2px);
  opacity:0;visibility:hidden;transition:opacity .25s ease}
.mnav.open{opacity:1;visibility:visible}
.mnav-panel{position:absolute;top:0;left:0;bottom:0;width:min(84vw,330px);background:var(--yellow);
  padding:22px 24px;display:flex;flex-direction:column;gap:2px;transform:translateX(-100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 60px rgba(0,0,0,.32);overflow-y:auto}
.mnav.open .mnav-panel{transform:none}
.mnav-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.mnav-top .logo{height:22px;width:auto}
.mnav-close{width:38px;height:38px;border:0;background:rgba(23,23,23,.07);border-radius:50%;
  font-size:24px;line-height:1;cursor:pointer;color:var(--ink);display:grid;place-items:center}
.mnav-close:hover{background:rgba(23,23,23,.14)}
.mnav-panel a{font-size:19px;font-weight:600;color:var(--ink);text-decoration:none;padding:15px 2px;
  border-bottom:1px solid rgba(23,23,23,.13)}
.mnav-panel a:active{opacity:.6}
.mnav-cta{margin-top:20px;background:var(--ink);color:#fff!important;text-align:center;
  border-radius:var(--r-pill);padding:15px!important;border-bottom:0!important}

/* =========================================================
   v14 — P1: order bump, garantia/prazo, seletor de variação, kit breakdown
   ========================================================= */
/* ORDER BUMP acionável (opt-in) */
.obump{display:flex;align-items:center;gap:13px;border:1.5px dashed var(--yellow-deep);border-radius:var(--r);
  padding:12px 14px;background:#fffdf3;margin-bottom:16px;cursor:pointer;transition:border-color .15s,background .15s}
.obump:hover{background:#fffbe8}
.obump input{width:20px;height:20px;accent-color:var(--yellow-deep);flex:none;cursor:pointer}
.obump>img{width:52px;height:52px;object-fit:contain;background:#fff;border-radius:10px;flex:none}
.obump .ob-info{flex:1;min-width:0}
.obump .ob-info .t{font-size:11.5px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.obump .ob-info b{font-size:14px;display:block;line-height:1.25}
.obump .ob-info .op{color:var(--yellow-deep);font-weight:700;font-size:14px}
.obump .ob-info .op s{color:var(--text);font-weight:400;font-size:12px;margin-left:5px}

/* GARANTIA + PRAZO */
.assure{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:var(--r);
  padding:13px 16px;margin-bottom:16px;background:#fff}
.assure .ic{width:36px;height:36px;flex:none;display:grid;place-items:center;background:var(--yellow);border-radius:50%}
.assure .ic img{width:18px;height:18px}
.assure .tx b{font-size:13.5px;display:block;line-height:1.25}
.assure .tx small{font-size:12.5px;color:var(--ink-soft)}
.deliv{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink);margin:0 0 16px;font-weight:500}
.deliv img{width:17px;height:17px}
.deliv b{color:var(--ink)}
.f-hint{margin-top:10px;font-size:13px;color:var(--ink-soft)}

/* SELETOR DE VARIAÇÃO (aroma / formato) */
.vsel{margin:2px 0 16px}
.vsel .vlab{font-size:13px;font-weight:700;margin:0 0 9px;letter-spacing:.02em}
.vsel .vlab .pick{color:var(--ink-soft);font-weight:400}
.vopts{display:flex;flex-wrap:wrap;gap:10px}
.vopt{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:10px 16px;font-size:14px;font-weight:600;
  cursor:pointer;background:#fff;display:inline-flex;align-items:center;gap:9px;font-family:inherit;color:var(--ink);
  transition:border-color .15s ease}
.vopt:hover{border-color:var(--ink)}
.vopt.on{border-color:var(--ink);background:#fffdf3}
.vopt .sw{width:18px;height:18px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.vopt .sw.amber{background:linear-gradient(135deg,#e8a04a,#bd6a35)}
.vopt .sw.kalliste{background:linear-gradient(135deg,#d6e0cb,#9bb089)}

/* KIT — economia item a item */
.kbreak{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin:0 0 18px}
.kbreak .row{display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:14px;
  padding:8px 0;border-bottom:1px solid var(--line)}
.kbreak .row .nm{color:var(--ink)}
.kbreak .row .pr{color:var(--text);text-decoration:line-through;white-space:nowrap}
.kbreak .sum{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-top:12px;padding-top:12px;
  border-top:2px solid var(--ink)}
.kbreak .sum .lbl{font-weight:700;font-size:14px}
.kbreak .sum .vals .full{color:var(--text);text-decoration:line-through;font-size:14px;margin-right:8px}
.kbreak .sum .vals .now{color:var(--yellow-deep);font-weight:700;font-size:23px}
.kbreak .save-line{background:var(--yellow);border-radius:var(--r-pill);text-align:center;padding:9px;
  margin-top:13px;font-weight:700;font-size:14px;color:var(--ink)}

/* =========================================================
   v15 — carrossel UGC repaginado: limpo e premium
   (some o "player" falso poluído; foto mais viva; play glassy)
   ========================================================= */
.uvrow{grid-auto-columns:248px;gap:16px;scrollbar-width:none;-ms-overflow-style:none}
.uvrow::-webkit-scrollbar{display:none}
.uvcard{display:block}
.uvclip{display:block;position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:10/14;
  background:#e9e4dc;box-shadow:var(--shadow);text-decoration:none}
.uvclip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.08) contrast(1.02)}
.uv-shade{position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.36) 0%,rgba(0,0,0,0) 24%,rgba(0,0,0,0) 56%,rgba(0,0,0,.48) 100%)}
.uv-top{position:absolute;top:12px;left:12px;right:12px;z-index:2;display:flex;align-items:center;gap:9px}
.uv-top .av{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:none;border:2px solid rgba(255,255,255,.92)}
.uv-top .nm{min-width:0;line-height:1.12;display:block}
.uv-top .nm b{display:block;font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uv-top .nm small{display:block;font-size:11px;color:rgba(255,255,255,.85);text-shadow:0 1px 5px rgba(0,0,0,.6)}
.uv-top .tt{margin-left:auto;width:18px;height:18px;color:#fff;flex:none}
.uv-top .tt svg{width:100%;height:100%}
.uv-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;width:56px;height:56px;
  border-radius:50%;background:rgba(255,255,255,.2);backdrop-filter:blur(7px);border:1.5px solid rgba(255,255,255,.65);
  display:grid;place-items:center;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.uv-play svg{width:20px;height:20px;color:#fff;margin-left:3px;transition:color .2s ease}
.uvcard:hover .uv-play{transform:translate(-50%,-50%) scale(1.09);background:var(--yellow);border-color:#fff}
.uvcard:hover .uv-play svg{color:#171717}
.uv-foot{position:absolute;left:12px;right:12px;bottom:12px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px}
.uv-like{display:inline-flex;align-items:center;gap:6px;color:#fff;font-size:13px;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.55)}
.uv-like svg{width:17px;height:17px}
.uv-watch{display:inline-flex;align-items:center;background:rgba(255,255,255,.92);color:var(--ink);
  font-size:12px;font-weight:700;padding:6px 14px;border-radius:var(--r-pill)}
.uvcard:hover .uv-watch{background:#fff}
.ugcv .uhead .sub{font-size:17px;margin:12px 0 6px;color:var(--ink-soft)}
.ugcv .uhead .via{display:block}

/* =========================================================
   v16 — POLIMENTO MOBILE (header → footer): clean, enquadrado, legível
   ========================================================= */
@media(max-width:560px){
  :root{ --section-y:52px }
  .wrap{padding-inline:18px}

  /* HEADER mais enxuto e centrado */
  .hd{padding-top:12px}
  .hd .bar{height:56px;padding:0 14px}
  .hd .icons{gap:15px}
  .hd .icons img{height:20px}
  .burger{width:36px;height:36px}
  .breadcrumb{padding-top:40px;font-size:13px}

  /* TÍTULOS: quebra e respiro melhores */
  .sec-head{margin-bottom:22px}
  .page-head{padding-top:40px}

  /* PDP — galeria: imagem grande no topo, thumbs em linha embaixo */
  .pdp-top{gap:22px}
  .gallery{display:flex;flex-direction:column;gap:11px}
  .gallery .main{order:1;aspect-ratio:1;border-radius:var(--r)}
  .gallery .thumbs{order:2;flex-direction:row;gap:9px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
  .gallery .thumbs::-webkit-scrollbar{display:none}
  .gallery .thumbs img{width:62px;height:62px;flex:none}
  .buybox h1{font-size:25px;line-height:1.18}

  /* blocos com imagem gigante: alturas mais enxutas e enquadradas */
  .kit{border-radius:var(--r)}
  .kit .pic{min-height:0;aspect-ratio:4/3}
  .kit .kbody{padding:24px 20px 28px}
  .usar-img{min-height:280px}
  .mundo{min-height:340px}
  .editorial{gap:22px}
  .band .inner{padding:32px 24px}
  .manifesto{padding:44px 26px}

  /* grids de card: gap menor p/ caber e enquadrar melhor */
  .grid-4,.col-grid{gap:12px}
  .objetivos{gap:12px}
  .ativos,.values,.reviews{gap:14px}

  /* footer: respiro interno mais justo */
  .ftf .cols{padding-top:44px;padding-bottom:30px;gap:32px 36px}
  .ftf .news{padding:22px}
}

/* telas bem estreitas (≤380): caprichar no enquadramento */
@media(max-width:380px){
  .wrap{padding-inline:15px}
  .objetivos{grid-template-columns:1fr 1fr;gap:10px}
  .obj .lbl b{font-size:16px}
  .topbar{font-size:12px}
}

/* =========================================================
   v17 — FOOTER PRETO refinado (substitui o amarelo)
   ========================================================= */
.ftf{background:#141414;color:#fff}
.ftf::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;z-index:2;
  background:linear-gradient(90deg,var(--yellow-accent),var(--yellow))}
/* card newsletter: vidro escuro elevado (não branco chapado) */
.ftf .news{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);box-shadow:none}
.ftf .news h4{color:#fff}
.ftf .news p{color:rgba(255,255,255,.6)}
.ftf .news input{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);color:#fff}
.ftf .news input::placeholder{color:rgba(255,255,255,.45)}
/* colunas + links */
.ftf h4{color:#fff}
.ftf a{color:rgba(255,255,255,.62)}
.ftf a:hover{color:#fff}
.ftf .ftrust .lab{color:rgba(255,255,255,.85)}
.ftf .pay img{background:#fff;padding:4px;box-shadow:0 3px 12px -5px rgba(0,0,0,.85)}
/* barra inferior */
.ftf .ft-bottom{border-top:1px solid rgba(255,255,255,.12)}
.ftf .ft-bottom small{color:rgba(255,255,255,.52)}
.ftf .ft-bottom .dev{color:rgba(255,255,255,.52)}

/* checkout: footer slim também no preto p/ consistência */
.fty{background:#141414;color:#fff}
.fty .bottom{border-top-color:rgba(255,255,255,.12)}
.fty .bottom small{color:rgba(255,255,255,.52)}
.fty .dev{color:rgba(255,255,255,.52)}

/* =========================================================
   v18 — MENU: reordenação + mega "Produtos" + submenu mobile
   ========================================================= */
.hd nav .navitem{position:relative;display:flex;align-items:center}
.hd nav .has-mega>a::after{content:'';display:inline-block;margin-left:7px;border:4px solid transparent;
  border-top-color:currentColor;border-bottom-width:0;transform:translateY(1px);transition:transform .2s ease}
.hd nav .has-mega:hover>a::after{transform:translateY(1px) rotate(180deg)}
.hd .mega{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);
  padding-top:30px;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;z-index:40}
.hd .navitem:hover .mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.hd .mega-inner{background:#fff;border-radius:18px;box-shadow:0 30px 70px -24px rgba(23,23,23,.4);
  padding:28px 32px;display:grid;grid-template-columns:repeat(3,minmax(170px,1fr));gap:6px 40px;
  min-width:660px;border:1px solid var(--line)}
.hd .mega-col h5{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow-deep);
  font-weight:700;margin:0 0 10px}
.hd .mega-col a{display:block;font-size:14px;color:var(--ink);text-decoration:none;padding:7px 0;
  font-weight:500;line-height:1.2}
.hd .mega-col a:hover{color:var(--yellow-deep)}
.hd .mega-all{grid-column:1/-1;border-top:1px solid var(--line);margin-top:8px;padding:14px 0 2px;
  font-weight:700;color:var(--ink);text-decoration:none;font-size:14px}
.hd .mega-all:hover{color:var(--yellow-deep)}

/* submenu dentro do drawer mobile (Produtos -> subcategorias) */
.mnav-sub{display:flex;flex-direction:column;border-left:2px solid rgba(23,23,23,.2);
  margin:0 0 4px 4px;padding-left:14px}
.mnav-panel .mnav-sub a{font-size:15px;font-weight:500;color:rgba(23,23,23,.78);padding:11px 0;border-bottom:0}