/* Chá Nutri+ · identidade Botânica Leve */
:root{
  --folha:#5E7C3A; --folha-escura:#4A6430; --salvia:#B7C4A8; --menta:#DDE5D2;
  --off:#F7F6F0; --grafite:#2F3A2E; --texto2:#45503F; --pessego:#E8B79A; --pessego-claro:#F6DDCF;
  --sono:#CFC6E3; --sono-f:#9C8FC4; --leveza:#F6DDCF; --leveza-f:#E8B79A;
  --drenagem:#CFE5DF; --drenagem-f:#7DB5A8; --digestao:#F2E3B3; --digestao-f:#D9B95A; --feminino:#EFD3D8; --feminino-f:#C98A97;
  --raio:28px; --serif:"Fraunces",Georgia,serif; --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--off);color:var(--grafite);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--folha-escura)}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;margin:0}
p{margin:0}
.container{width:min(1200px,100% - 32px);margin-inline:auto}
.pular{position:absolute;left:-999px;top:8px;background:var(--grafite);color:#fff;padding:10px 16px;border-radius:30px;z-index:100}
.pular:focus{left:16px}
:focus-visible{outline:3px solid var(--folha);outline-offset:3px;border-radius:8px}

/* botões */
.botao{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:40px;font:700 16px/1 var(--sans);text-decoration:none;border:0;cursor:pointer;transition:transform .15s,background .15s}
.botao:hover{transform:translateY(-1px)}
.botao--principal{background:var(--folha);color:#fff}
.botao--principal:hover{background:var(--folha-escura)}
.botao--escuro{background:var(--grafite);color:var(--off)}
.botao--contorno{border:1.5px solid var(--grafite);color:var(--grafite);background:transparent}
.botao[aria-disabled="true"]{background:var(--menta);color:var(--texto2);cursor:default;transform:none}

/* topo */
.topo{position:sticky;top:0;z-index:50;background:rgba(247,246,240,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--menta)}
.topo__linha{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px}
.topo__logo img{height:46px;width:auto}
.topo__nav{display:flex;gap:28px}
.topo__nav a{color:var(--grafite);text-decoration:none;font-weight:500;font-size:15px}
.topo__nav a:hover{color:var(--folha)}
.topo__cta{min-height:44px;padding:10px 18px;font-size:15px}

/* destaque */
.destaque{margin-top:24px;background:var(--menta);border-radius:40px;padding:56px;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.etiqueta{display:inline-block;background:var(--off);color:var(--folha-escura);border-radius:30px;padding:6px 14px;font-size:14px;font-weight:700;margin-bottom:18px}
.destaque h1{font-size:clamp(38px,5.2vw,64px);letter-spacing:-.02em;margin-bottom:18px}
.destaque p{font-size:19px;color:var(--texto2);max-width:520px}
.destaque__botoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.arco{background:var(--off);border-radius:999px 999px 28px 28px;display:flex;align-items:center;justify-content:center}
.arco--grande{aspect-ratio:4/4.3;padding:12%}

/* seções */
.secao{margin-top:88px}
.secao__titulo{font-size:clamp(30px,3.6vw,44px);letter-spacing:-.015em;margin-bottom:28px}
.secao__cabeca{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.secao__cabeca .secao__titulo{margin-bottom:0}
.nota{margin-top:20px;color:var(--texto2);font-size:15px}

/* linhas */
.linhas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.linha{border:0;cursor:pointer;text-align:left;border-radius:var(--raio);padding:24px;display:flex;flex-direction:column;gap:6px;font-family:var(--sans);color:var(--grafite);transition:transform .15s}
.linha:hover{transform:translateY(-3px)}
.linha svg{width:40px;height:40px;fill:none;stroke:var(--grafite);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:18px}
.linha__nome{font-family:var(--serif);font-size:28px;font-weight:500}
.linha__desc{font-size:15px;color:var(--texto2)}
.linha--sono{background:var(--sono)}.linha--leveza{background:var(--leveza)}.linha--drenagem{background:var(--drenagem)}.linha--digestao{background:var(--digestao)}

/* filtros */
.filtros{display:flex;flex-wrap:wrap;gap:8px}
.filtro{min-height:44px;padding:8px 18px;border-radius:40px;border:1.5px solid var(--salvia);background:transparent;font:500 15px var(--sans);color:var(--grafite);cursor:pointer}
.filtro.ativo{background:var(--grafite);border-color:var(--grafite);color:var(--off)}

/* catálogo */
.catalogo{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.catalogo__aviso{color:var(--texto2)}
.produto{background:#fff;border-radius:var(--raio);padding:16px;display:flex;flex-direction:column;gap:10px}
.produto__foto{aspect-ratio:1/1;border-radius:120px 120px 18px 18px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--menta)}
.produto__foto img{width:100%;height:100%;object-fit:cover}
.produto__foto svg{width:64px;height:64px;fill:none;stroke:var(--grafite);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.produto__linha{font-size:13px;font-weight:700;color:var(--folha-escura);margin-top:4px}
.produto__nome{font-size:24px}
.produto__desc{font-size:15px;color:var(--texto2);flex:1}
.produto__rodape{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:4px}
.produto__preco{font-weight:700;font-size:18px}
.produto__preco--consulte{font-weight:500;font-size:15px;color:var(--texto2)}
.produto__peso{font-size:14px;color:var(--texto2)}
.produto .botao{width:100%}
.selo-esgotado{align-self:flex-start;background:var(--pessego-claro);border-radius:30px;padding:4px 12px;font-size:13px;font-weight:700}

/* como pedir */
.faixa{background:var(--grafite);color:var(--off);border-radius:40px;padding:48px}
.faixa .secao__titulo{color:var(--off)}
.passos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.passos li{display:flex;gap:16px;align-items:flex-start}
.passos__n{flex:none;width:44px;height:44px;border-radius:50%;background:var(--pessego);color:var(--grafite);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px}
.passos h3{font-size:22px;margin-bottom:6px}
.passos p{color:#D9DED2;font-size:16px}

/* preparo */
.preparo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.preparo__item{background:#fff;border-radius:var(--raio);padding:28px}
.preparo__item svg{width:44px;height:44px;fill:none;stroke:var(--folha);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:16px}
.preparo__item h3{font-size:24px;margin-bottom:8px}
.preparo__item p{color:var(--texto2);font-size:16px}

/* sobre */
.sobre{display:grid;grid-template-columns:320px 1fr;gap:48px;align-items:center;background:var(--pessego-claro);border-radius:40px;padding:48px}
.sobre p{color:var(--texto2);margin-bottom:16px;max-width:620px}
.sobre .botao{margin-top:8px}
.arco--sobre{aspect-ratio:1/1.1;padding:22%}

/* rodapé */
.rodape{margin-top:96px;background:var(--grafite);color:var(--off);padding:48px 0 24px}
.rodape__linha{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.rodape__logo{width:180px}
.rodape__contato{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center}
.rodape__contato a{color:var(--off);font-weight:500}
.rodape__nota{border-top:1px solid #47533F;margin-top:32px;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:14px;color:#C9CFC0}

/* WhatsApp flutuante */
.wa-flutuante{position:fixed;right:20px;bottom:20px;width:60px;height:60px;border-radius:50%;background:var(--folha);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(47,58,46,.3);z-index:60}
.wa-flutuante svg{width:32px;height:32px;fill:#fff}

/* celular */
@media (max-width:900px){
  .topo__nav{display:none}
  .destaque{grid-template-columns:1fr;padding:32px 24px;border-radius:32px}
  .destaque__arte{order:-1;max-width:300px;margin-inline:auto;width:100%}
  .linhas.linhas--auto{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .passos,.preparo{grid-template-columns:1fr}
  .faixa,.sobre{padding:32px 24px;border-radius:32px}
  .sobre{grid-template-columns:1fr}
  .arco--sobre{max-width:200px}
  .secao{margin-top:64px}
  .destaque__arte{max-width:240px}
}
@media (max-width:600px){
  .catalogo{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .produto{padding:10px;border-radius:22px;gap:6px}
  .produto__foto{border-radius:80px 80px 14px 14px}
  .produto__foto svg{width:44px;height:44px}
  .produto__nome{font-size:19px}
  .produto__desc{font-size:14px;line-height:1.45}
  .produto .botao{min-height:44px;padding:10px 8px;font-size:14px;line-height:1.2;text-align:center}
}
@media (max-width:420px){
  .linha{padding:18px}.linha__nome{font-size:23px}
  .topo__logo img{height:38px}
}

/* janela de detalhes do blend */
.produto .js-detalhe{min-height:42px;padding:8px 16px;font-size:15px}
.detalhe{border:0;padding:0;border-radius:var(--raio);width:min(640px,100% - 24px);max-height:min(88vh,900px);background:var(--off);color:var(--grafite);box-shadow:0 20px 60px rgba(47,58,46,.25)}
.detalhe::backdrop{background:rgba(47,58,46,.45)}
.detalhe__conteudo{padding:28px 32px 32px;overflow:auto;max-height:min(88vh,900px)}
.detalhe__fechar{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--grafite);font-size:28px;line-height:1;cursor:pointer;z-index:2}
.detalhe__topo{height:120px;border-radius:120px 120px 18px 18px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.detalhe__topo svg{width:56px;height:56px;fill:none;stroke:var(--grafite);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.detalhe h2{font-size:clamp(28px,4vw,36px);margin:4px 0 6px}
.detalhe h3{font-family:var(--sans);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--folha-escura);margin:22px 0 6px}
.detalhe__preco{font-weight:700;font-size:18px;margin-bottom:12px}
.detalhe__texto{font-size:17px}
.detalhe p{color:var(--texto2)}
.detalhe__texto{color:var(--grafite)!important}
.detalhe__lista{margin:0;padding-left:20px;color:var(--texto2)}
.detalhe__lista li{margin:4px 0}
.detalhe__lista strong{color:var(--grafite)}
.detalhe__aviso{margin-top:22px;font-size:14px;background:var(--menta);border-radius:16px;padding:12px 16px}
.detalhe .botao{width:100%;margin-top:20px}
@media (max-width:600px){.detalhe__conteudo{padding:20px 18px 24px}.detalhe__topo{height:90px}.produto .js-detalhe{min-height:40px;padding:8px;font-size:14px}}

/* vantagens */
.vantagens{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:16px}
.vantagem{background:var(--pessego-claro);border-radius:var(--raio);padding:24px;display:flex;flex-direction:column;gap:4px}
.vantagem strong{font-family:var(--serif);font-weight:500;font-size:34px;line-height:1.1}
.vantagem span{color:var(--texto2);font-size:15px}
.vantagem--frete{background:var(--menta)}
.vantagem--frete svg{width:36px;height:36px;fill:none;stroke:var(--grafite);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:8px}
.vantagem--frete strong{font-size:30px}
/* trocas */
.politica{background:#fff;border-radius:var(--raio);padding:32px;color:var(--texto2)}
.politica details{margin-top:18px;border-top:1px solid var(--menta);padding-top:14px}
.politica summary{cursor:pointer;font-weight:700;color:var(--folha-escura);min-height:44px;display:flex;align-items:center}
.politica__texto{display:flex;flex-direction:column;gap:12px;margin-top:8px;font-size:16px}
.politica h3{font-family:var(--sans);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--grafite);margin-top:8px}
.politica ul{margin:0;padding-left:20px}
.politica li{margin:4px 0}
.politica strong{color:var(--grafite)}
@media (max-width:900px){.vantagens{grid-template-columns:repeat(3,minmax(0,1fr))}.vantagem--frete{grid-column:1/-1}}
@media (max-width:600px){.vantagens{gap:10px}.vantagem{padding:16px 14px;border-radius:22px}.vantagem strong{font-size:24px}.vantagem span{font-size:13px;line-height:1.35}.politica{padding:22px 18px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
