/* TORRE da Hemostasia - página de vendas. Editar aqui muda o visual de toda a página. */
:root{
  --vinho:#7A1E2C; --rosa:#C18484; --verde:#4B5D4A;
  --bege:#F4EDE6; --bege2:#E6D5C3; --bege3:#EFE3D6;
  --branco:#FFFFFF; --texto:#3F3A31; --texto2:#5C5346; --texto3:#8A8175;
  --linha:rgba(122,30,44,.20); --linha2:rgba(63,58,49,.13);
  /* tons claros derivados da paleta: verde exercito e rosa antigo sobre o bege */
  --verde-claro:#E3E9DE; --verde-borda:#C6D2BF;
  --rosa-claro:#F2E3E1;  --rosa-borda:#DFC3C1;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bege); color:var(--texto);
  font-family:Lato,"Segoe UI",system-ui,sans-serif; font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
h1,h2,h3,.disp{font-family:Gelasio,Georgia,"Times New Roman",serif; letter-spacing:-.01em; text-wrap:balance}

.secao{padding-inline:18px; padding-block:46px}
.secao.claro{background:var(--bege3)}
.dentro{max-width:940px; margin:0 auto}
.estreito{max-width:700px; margin:0 auto}

.sobre{font-size:13px; font-weight:900; letter-spacing:.2em; text-transform:uppercase; color:var(--vinho); margin:0 0 12px}
h1{font-size:34px; font-weight:700; line-height:1.15; margin:0 0 16px; color:var(--vinho)}
h2{font-size:24px; font-weight:700; line-height:1.28; margin:0 0 14px; color:var(--vinho)}
.apoio{font-size:17px; color:var(--texto2); margin:0 0 12px}
p{margin:0 0 12px}
.destaque{font-family:Gelasio,Georgia,serif; font-size:22px; font-weight:700; color:var(--vinho); margin:16px 0}
.destaque.centro{text-align:center; margin:22px auto; max-width:34ch; font-size:18px}
.destaque.peq{font-size:20px}
.destaque.mini{font-size:17px}
.forte{font-weight:900; color:var(--vinho)}

/* botão */
.btn{
  display:inline-block; background:var(--vinho); color:#FFF8F2; text-decoration:none;
  font-size:19px; font-weight:900; padding:20px 28px; border-radius:16px; text-align:center;
  width:100%; max-width:520px; line-height:1.25;
}
.btn:hover{background:#651823}
.btn:focus-visible{outline:3px solid var(--texto); outline-offset:3px}
.notabtn{font-size:14px; color:var(--texto2); margin:9px 0 0; text-align:center}
.cta-col{display:flex; flex-direction:column; align-items:center; margin-top:18px}

/* hero */
.hero{background:var(--bege); padding-block:38px 40px}
.hero h1{font-size:32px}
.hero .dentro{text-align:center}
.hero .sub{font-size:18px; color:var(--texto2); max-width:72ch; margin-left:auto; margin-right:auto}
.hero .sub1{font-size:21px; font-weight:700; color:var(--texto)}
.btn-centro{text-align:center}
.hero figure{margin:22px auto}

/* cenas */
.cena{background:var(--branco); border-left:4px solid var(--vinho); padding:16px 18px; margin-bottom:14px; font-size:16.5px}
.cena b{display:block; font-family:Gelasio,Georgia,serif; color:var(--vinho); font-size:16px; margin-bottom:5px}

/* torre */
.duas{display:grid; gap:14px}
.duas .torre{margin:0}
.torre{background:var(--branco); border-left:4px solid var(--vinho); margin:18px 0}
.torre .linha{display:grid; grid-template-columns:36px 1fr; align-items:center; gap:8px; padding:9px 12px; border-top:1px solid var(--linha2)}
.torre .linha:first-child{border-top:0}
.torre .l{font-family:Gelasio,Georgia,serif; font-size:25px; font-weight:700; color:var(--vinho); text-align:center; line-height:1}
.torre b{font-weight:900; font-size:14.5px; line-height:1.3}
.nota{font-size:15px; color:var(--texto3); margin:0}

.divisor{border:0; border-top:1px solid var(--linha); margin:34px 0 26px}

/* grades */
.grade{display:grid; gap:12px}
.cen{background:var(--bege2); padding:14px 16px}
.cen span{display:block; font-size:11px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; color:var(--texto3); margin-bottom:4px}
.cen b{font-family:Gelasio,Georgia,serif; font-size:18px; font-weight:700}

.peca{background:var(--branco); padding:16px 18px 30px; position:relative}
.peca b{display:block; font-family:Gelasio,Georgia,serif; font-size:18px; font-weight:700; margin-bottom:5px}
.peca p{margin:0; font-size:16px; color:var(--texto2)}
.peca .bns{position:absolute; right:16px; bottom:10px; font-size:11px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; color:var(--vinho)}

.balde{background:var(--verde-claro); border:1px solid var(--verde-borda); padding:18px 20px}
.balde.nao{background:var(--rosa-claro); border-color:var(--rosa-borda)}
.balde h3{margin:0 0 10px; font-family:Lato,sans-serif; font-size:12px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; color:var(--vinho)}
.balde.nao h3{color:var(--verde)}
.balde ul{margin:0; padding-left:20px; font-size:16px}
.balde li{margin-bottom:7px}

/* autoridade */
.autor{display:grid; gap:18px}
.autor img{width:100%; max-width:280px; border-radius:4px; margin:0 auto}
.autor .nome{font-family:Gelasio,Georgia,serif; font-size:24px; font-weight:700; margin:0}
.autor .cred{font-size:14px; color:var(--texto3); margin:2px 0 14px; text-transform:uppercase; letter-spacing:.06em; font-weight:700}

/* oferta */
.card{background:var(--branco); border:2.5px solid var(--vinho); margin-top:8px}
.selo{background:var(--vinho); color:#FFF8F2; text-align:center; font-size:20px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:16px 14px}
.itens{padding:18px}
.item{display:flex; gap:12px; align-items:flex-start; padding:10px 0; border-bottom:1px dotted var(--linha2)}
.item .ck{flex:0 0 auto; width:24px; height:24px; border-radius:6px; background:var(--vinho); color:#FFF8F2; font-size:15px; font-weight:900; display:flex; align-items:center; justify-content:center; margin-top:2px}
.item .nm{flex:1 1 auto; font-size:17px; font-weight:600}
.item .vl{flex:0 0 auto; font-size:15px; font-weight:600; color:#6E6558; white-space:nowrap; font-variant-numeric:tabular-nums}
.total{display:flex; justify-content:space-between; gap:12px; padding-top:14px; margin-top:6px; border-top:1px dashed var(--linha); font-size:16px; font-weight:900}
.total .v{text-decoration:line-through; font-size:19px; color:var(--texto3); font-variant-numeric:tabular-nums}
.faixa{background:var(--bege2); border-top:2.5px solid var(--vinho); padding:22px 18px; text-align:center}
.hoje{font-size:15px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; color:var(--texto2); margin:0}
.preco{font-family:Gelasio,Georgia,serif; font-size:80px; font-weight:700; line-height:.95; color:var(--vinho); margin:2px 0 0; letter-spacing:-.015em}
.pfort{font-size:22px; font-weight:900; margin:12px 0 0}
.preg{font-size:22px; margin:0}
.punico{font-size:16px; color:var(--texto2); margin:6px 0 0}
.garantia{color:var(--verde); font-weight:700; font-size:15px; margin:16px 0 0; text-align:center}

/* faq */
.faq details{background:var(--branco); border-bottom:1px solid var(--linha2)}
.faq summary{cursor:pointer; padding:15px 16px; font-weight:900; font-size:16.5px; list-style:none; color:var(--vinho)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; float:right; color:var(--vinho); font-size:22px; line-height:1}
.faq details[open] summary::after{content:"–"}
.faq .r{padding:0 16px 16px; margin:0; color:var(--texto2); font-size:16px}

/* rodapé */
.legal{font-size:13.5px; color:var(--texto3); margin-top:16px}
footer{background:var(--vinho); color:#F4EDE6; padding:26px 18px; font-size:14px; text-align:center}
footer a{color:#F4EDE6}

@media (min-width:760px){
  .secao{padding-block:64px}
  .hero h1{font-size:46px}
  h1{font-size:46px} h2{font-size:28px}
  .hero .sub{font-size:20px}
  .hero .sub1{font-size:25px}
  .destaque{font-size:26px}
  .destaque.centro{font-size:20px}
  .destaque.peq{font-size:21px}
  .destaque.mini{font-size:18px}
  .duas{grid-template-columns:1fr 250px; gap:28px; align-items:center}
  .grade.g3{grid-template-columns:repeat(3,1fr)}
  .btn{font-size:21px; padding:24px 40px; border-radius:999px; width:auto}
  .grade.g2{grid-template-columns:1fr 1fr}
  .grade.g4{grid-template-columns:1fr 1fr}
  .autor{grid-template-columns:280px 1fr; align-items:start}
  .selo{font-size:22px; padding:15px 40px}
  .itens{padding:24px 28px}
  .item .nm{font-size:20px}
  .item .vl{font-size:20px}
  .item .ck{width:26px; height:26px}
  .total{font-size:20px} .total .v{font-size:22px}
  .faixa{padding:30px 28px}
  /* titulos que devem caber em uma linha na largura da coluna de texto */
  h2.linha-unica{white-space:nowrap; font-size:24px}
  .preco{font-size:86px}
  .garantia{font-size:17px}
}
@media (min-width:1000px){ .grade.g4{grid-template-columns:repeat(4,1fr)} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

/* ---- aviso de cookies (só aparece se o pixel estiver ligado e sem escolha salva) ---- */
.consent{
  position:fixed; left:0; right:0; bottom:0; z-index:9999;
  background:var(--branco); border-top:2px solid var(--vinho);
  box-shadow:0 -4px 18px rgba(63,58,49,.14);
}
.consent[hidden]{display:none}
.consent-in{
  max-width:1060px; margin:0 auto; padding:10px 20px;
  display:flex; align-items:center; gap:18px;
}
.consent-t{margin:0; flex:1; font-size:12.5px; line-height:1.45; color:var(--texto2)}
.consent-t a{
  color:var(--vinho); text-decoration:underline; text-underline-offset:2px;
  white-space:nowrap;
}
.consent-b{display:flex; gap:8px; flex-shrink:0}
.consent-b button{
  font-family:Lato,sans-serif; font-size:13px; line-height:1;
  cursor:pointer; border-radius:6px; padding:8px 16px; white-space:nowrap;
}
.btn-min{background:var(--vinho); color:#fff; border:1px solid var(--vinho); font-weight:700}
.btn-min:hover{background:#651823}
.btn-lin{background:transparent; color:var(--texto2); border:1px solid var(--linha2)}
.btn-lin:hover{border-color:var(--texto3); color:var(--texto)}
.consent-b button:focus-visible{outline:2px solid var(--texto); outline-offset:2px}
@media (max-width:640px){
  .consent-in{flex-direction:column; align-items:stretch; gap:8px; padding:10px 16px 12px}
  .consent-t{font-size:12px}
  .consent-b{justify-content:flex-end}
}
