/* Black LIV/m + TRIVV · sistema visual das duas páginas (vendas e captura).
   Segue o mockup aprovado pelo Diego em 20/10: noite vinho, cetim, creme, dourado;
   Cormorant Garamond nos títulos, Jost no texto; as duas juntas numa foto só. */
@font-face{font-family:Cormorant;src:url(fontes/cormorant-var.woff2) format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:Cormorant;src:url(fontes/cormorant-italic.woff2) format('woff2');font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:Jost;src:url(fontes/jost-var.woff2) format('woff2');font-weight:300 600;font-display:swap}

:root{
  --noite:#140b0d; --noite-2:#1e1114; --vinho:#4a1726; --vinho-2:#5e1f31; --vinho-luz:#7a3346;
  --creme:#f6efe7; --cartao:#fffaf4; --linha:#e9ddd0; --tinta:#2a1c1a; --tinta-2:#6d5d56;
  --ouro:#c9a27a; --ouro-claro:#e2c7a6; --ouro-escuro:#8f6a45; --bege:#efe4d6;
  --texto-claro:#f3e9df; --texto-claro-2:rgba(243,233,223,.72);
  --g:20px; --raio:14px; --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--noite);color:var(--texto-claro);font-family:Jost,system-ui,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--ouro);outline-offset:3px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.serif{font-family:Cormorant,Georgia,serif;font-weight:500}
.ouro{color:var(--ouro)}
svg.i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- logo (lockup em texto + símbolo) ---------- */
.logo{display:grid;justify-items:center;gap:2px;color:var(--ouro-claro);text-align:center;text-decoration:none}
.logo .l1{display:flex;align-items:center;gap:10px}
.logo .black{font-family:Cormorant,serif;font-weight:500;font-size:46px;line-height:.9;letter-spacing:.06em}
.logo .inf{display:grid;justify-items:center}
.logo .inf svg{width:58px;height:26px;fill:none;stroke:currentColor;stroke-width:3.4;stroke-linecap:round}
.logo .inf small{font-size:6.5px;letter-spacing:.22em;text-transform:uppercase;margin-top:1px}
.logo .l2{font-family:Cormorant,serif;font-weight:500;font-size:28px;line-height:1.1;letter-spacing:.02em}
.logo .l2 i{font-style:italic}
.logo .l2 .mais{font-size:.8em;margin:0 .2em;color:var(--ouro)}
.logo .l3{font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--texto-claro);margin-top:4px}
.logo.peq .black{font-size:34px}.logo.peq .inf svg{width:44px;height:20px}.logo.peq .l2{font-size:21px}.logo.peq .l3{font-size:9.5px}

/* ---------- topo: logo da collab e as duas marcas (22/10: a Lívia pediu logos no lugar da foto) ---------- */
.hero{position:relative;overflow:clip;text-align:center;padding:calc(env(safe-area-inset-top) + 30px) var(--g) 40px;
  background:radial-gradient(110% 60% at 50% 0%,rgba(122,51,70,.55),transparent 70%),var(--noite)}
.hero .collab{display:block;width:min(88vw,540px);height:auto;margin:0 auto}
.hero .texto{max-width:620px;margin:20px auto 0}
.hero .live{font-family:Cormorant,serif;font-size:19px;line-height:1.25;color:var(--texto-claro-2);margin:0 auto 14px;max-width:30ch}
.hero .live em{color:var(--ouro-claro)}
.hero h1{font-family:Cormorant,serif;font-weight:500;font-size:clamp(31px,8.4vw,50px);line-height:1.05;letter-spacing:-.005em;text-wrap:balance}
.hero h1 em{font-style:italic;color:var(--ouro)}
.hero .marcas{display:flex;align-items:center;justify-content:center;gap:16px;margin:24px auto 0}
.hero .marcas img{height:30px;width:auto}
.hero .marcas img+span+img{height:24px}
.hero .marcas span{font-family:Cormorant,serif;font-size:26px;line-height:1;color:var(--ouro)}
.hero .sub{margin:20px auto 0;font-size:15.5px;color:var(--texto-claro-2);max-width:40ch}
.selos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0 22px;text-align:center}
.selos li{list-style:none;display:grid;justify-items:center;gap:8px;font-size:12.5px;line-height:1.25;color:var(--texto-claro-2)}
.selos li b{display:block;color:var(--texto-claro);font-weight:500}
.selos .bola{width:46px;height:46px;border-radius:50%;border:1px solid rgba(201,162,122,.6);display:grid;place-items:center;color:var(--ouro-claro)}
.desce{display:grid;justify-items:center;gap:2px;margin-top:22px;font-family:Cormorant,serif;font-size:23px;line-height:1.1;text-align:center;text-decoration:none;color:var(--texto-claro)}
.desce svg{width:18px;height:18px;stroke:var(--ouro);fill:none;stroke-width:1.6}
@media (min-width:900px){
  .hero{padding:56px 32px 72px}
  .hero .marcas img{height:36px}.hero .marcas img+span+img{height:29px}
}

/* ---------- botão dourado ---------- */
.btn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:56px;padding:0 26px;border-radius:999px;
  background:linear-gradient(180deg,#d6b48e,#c19a71);color:#2b1a12;font-weight:600;font-size:14.5px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  box-shadow:0 10px 26px -12px rgba(201,162,122,.7),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .2s var(--ease),filter .3s}
.btn:hover{filter:brightness(1.05)}.btn:active{transform:scale(.985)}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
@media (min-width:600px){.btn{width:auto;display:inline-flex}}

/* ---------- abas (filtro do menu) ---------- */
.abas{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;background:var(--bege);border-radius:12px;padding:4px}
.abas::-webkit-scrollbar{display:none}
.abas button{flex:1 0 auto;min-width:74px;min-height:48px;padding:6px 12px;border-radius:9px;font-size:12.5px;line-height:1.2;color:var(--tinta-2);text-align:center;transition:background .25s,color .25s}
.abas button b{display:block;font-weight:500;color:var(--tinta)}
.abas button[aria-selected="true"]{background:#e9d3b8}

/* ---------- cabeçalho de cetim (seções de menu e bônus) ---------- */
.cetim{background:radial-gradient(120% 90% at 85% 10%,var(--vinho-luz),transparent 55%),radial-gradient(90% 80% at 10% 100%,#3a0f1c,transparent 60%),linear-gradient(160deg,var(--vinho-2),var(--vinho) 55%,#2c0c16);color:var(--texto-claro)}

/* ---------- faixa de garantias ---------- */
.garantias{display:grid;grid-template-columns:repeat(3,1fr);background:var(--creme);color:var(--tinta);padding:26px var(--g)}
.garantias div{display:grid;justify-items:center;gap:8px;text-align:center;font-size:13px;line-height:1.25;padding:0 6px}
.garantias div+div{border-left:1px solid var(--linha)}
.garantias svg{width:34px;height:34px;stroke:var(--ouro-escuro);stroke-width:1.3}

/* ---------- especialistas: bio com as fotos ---------- */
.duas{position:relative;background:var(--noite);text-align:center;overflow:clip;padding:44px 0 40px}
.duas h2{padding:0 var(--g);font-family:Cormorant,serif;font-weight:500;font-size:clamp(30px,8vw,46px);line-height:1.08}
.duas .bios{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:640px;margin:26px auto 0;padding:0 var(--g);text-align:left}
.duas figure{display:grid;gap:12px;align-content:start}
.duas figure>img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:var(--raio)}
.duas figcaption{font-size:13px;line-height:1.4;color:var(--texto-claro-2)}
.duas figcaption .m{height:18px;width:auto;margin-bottom:10px;opacity:.9}
.duas figcaption b{display:block;font-family:Cormorant,serif;font-weight:600;font-size:20px;line-height:1.15;color:var(--texto-claro);margin-bottom:2px}
.duas .collab{display:block;width:min(70vw,340px);height:auto;margin:36px auto 0}

footer{background:var(--noite);color:rgba(243,233,223,.45);font-size:12px;line-height:1.6;padding:26px var(--g) 130px;border-top:1px solid rgba(243,233,223,.08)}
footer p{max-width:780px;margin:0 auto}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
