/* ============================================================================
   Degusta — landing (ofertasdegusta.com.br). Estilo das três versões do teste
   A/B/C (A celular, B mosaico, C recibo), a partir dos modelos aprovados em
   design\degusta\landing\modelos. O Worker (worker.js) põe a versão no
   <html data-variante="a|b|c"> e tira do HTML o que é das outras.
   Regras: docs\32. Sem fundo animado, sem 100vh, botão do grupo como a única
   cor de destaque de cada versão (verde na A e na B, mostarda na C).
   ============================================================================ */
@font-face{font-family:Fraunces;font-style:normal;font-weight:900;font-display:swap;src:url(/dg/fontes/fraunces-900-latin.woff2) format('woff2')}
@font-face{font-family:Rubik;font-style:normal;font-weight:400 700;font-display:swap;src:url(/dg/fontes/rubik-latin.woff2) format('woff2')}

:root{
  --vinho:#8B1E3F;--vinho-escuro:#5A1330;--cafe:#4A2C1E;--cafe-claro:#6E4B3A;--creme:#F7EFE3;--papel:#FFFDF9;
  --borda:#E9DBCB;--mostarda:#F2B134;--rose:#F3DCE0;
  --botao:#15803D;--botao-texto:#FFFFFF;--halo:rgba(21,128,61,.35);
}
html[data-variante="c"]{--botao:#F2B134;--botao-texto:#4A2C1E;--halo:rgba(242,177,52,.45)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--creme);color:var(--cafe);font-family:Rubik,Arial,sans-serif;-webkit-font-smoothing:antialiased}
body.com-fixo{padding-bottom:84px}
a{color:var(--vinho)}
a:hover{color:var(--vinho-escuro)}
a:focus-visible,summary:focus-visible{outline:3px solid var(--cafe);outline-offset:3px}
img{max-width:100%}
s{text-decoration:line-through}
.dg-marca,.dg-titulo,.dg-preco{font-family:Fraunces,Georgia,serif;font-weight:900;font-variation-settings:'SOFT' 100,'opsz' 144}
.dg-dest{color:var(--vinho)}
.dg-larga{max-width:1120px;width:100%;margin:0 auto;padding-left:24px;padding-right:24px}
.dg-estreita{max-width:760px;width:100%;margin:0 auto;padding-left:24px;padding-right:24px}

/* Cabeçalho */
.dg-topo{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:18px}
.dg-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--cafe)}
.dg-logo:hover{color:var(--cafe)}
.dg-logo .dg-marca{font-size:30px;line-height:.9;letter-spacing:-.03em}
.dg-tag{font-size:13px;color:var(--cafe-claro)}
@media (max-width:480px){.dg-tag{display:none}}

/* Primeira tela */
.dg-heroi-sec{padding-top:28px}
.dg-hero{display:flex;flex-wrap:wrap;align-items:center;gap:40px 56px}
.dg-texto{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:14px}
.dg-visual{flex:1 1 300px;display:flex;justify-content:center}
.dg-visual-b{flex-basis:440px}
.dg-visual-c{flex-basis:400px}
.dg-selo{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:var(--rose);color:var(--vinho);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;line-height:1;padding:9px 14px;border-radius:999px}
html[data-variante="b"] .dg-selo{background:var(--cafe);color:var(--creme)}
h1{margin:0;font-size:clamp(28px,4.6vw,58px);line-height:1.02;letter-spacing:-.03em;color:var(--cafe);text-wrap:balance}
.dg-sub{margin:0;font-size:clamp(17px,1.5vw,20px);line-height:1.45;color:var(--cafe-claro);max-width:520px}
.dg-acao{position:relative;padding-top:6px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.dg-micro{font-size:14px;color:var(--cafe-claro);line-height:1.4}
.dg-lojas{font-size:14px;color:var(--cafe-claro);line-height:1.45}
.dg-lojas strong{color:var(--cafe)}
.dg-seta{display:none;position:absolute;left:430px;top:-34px}
@media (min-width:900px){.dg-seta{display:block}}
@media (max-width:760px){.dg-hero{gap:28px}.dg-visual{width:100%}}

/* Botão do grupo (topo, meio, fim e fixo) */
.dg-botao{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:58px;padding:0 18px;border-radius:999px;background:var(--botao);color:var(--botao-texto);font-weight:700;font-size:clamp(16px,4.4vw,18px);text-decoration:none;width:100%;max-width:420px;-webkit-tap-highlight-color:transparent}
.dg-botao:hover{color:var(--botao-texto)}
.dg-botao svg{flex:none}
/* Pulso só no botão do topo: começa 2 s depois de carregar, 3 vezes e para. Só transform e
   box-shadow (não mexe no layout). Para no toque, no foco e com "reduzir movimento". */
@keyframes dgPulso{0%{transform:scale(1);box-shadow:0 0 0 0 var(--halo)}50%{transform:scale(1.03);box-shadow:0 0 0 10px var(--halo)}100%{transform:scale(1);box-shadow:0 0 0 14px rgba(0,0,0,0)}}
#cta-topo{animation:dgPulso 1.6s ease-in-out 2s 3}
#cta-topo:hover,#cta-topo:focus,#cta-topo:active,#cta-topo[aria-busy]{animation:none}
@media (prefers-reduced-motion:reduce){#cta-topo{animation:none}}
.fallback{font-size:14px;line-height:1.4}
.fallback[hidden]{display:none}
.fallback a{display:inline-block;padding:6px 0;font-weight:700}

/* Versão C: primeira tela vinho */
html[data-variante="c"] .dg-heroi{background:var(--vinho);color:var(--creme)}
html[data-variante="c"] .dg-heroi{--logo-vinho:#5A1330}
html[data-variante="c"] .dg-heroi-sec{padding-bottom:56px}
html[data-variante="c"] .dg-heroi .dg-logo,html[data-variante="c"] h1{color:var(--creme)}
html[data-variante="c"] .dg-heroi .dg-dest{color:var(--creme)}
html[data-variante="c"] .dg-tag,html[data-variante="c"] .dg-sub,html[data-variante="c"] .dg-heroi .dg-micro{color:var(--rose)}
html[data-variante="c"] .dg-selo{background:transparent;color:var(--creme);border:2px solid rgba(247,239,227,.45)}
html[data-variante="c"] .dg-lojas{color:rgba(247,239,227,.8)}
html[data-variante="c"] .dg-lojas strong{color:var(--creme)}
html[data-variante="c"] .dg-heroi .fallback a{color:var(--creme)}

/* A: o grupo no celular */
.dg-phone{width:300px;max-width:100%;background:var(--cafe);border-radius:36px;padding:10px;box-shadow:0 24px 50px rgba(74,44,30,.22)}
.dg-phone-tela{background:#EFE7DA;border-radius:28px;overflow:hidden;display:flex;flex-direction:column;height:560px}
.dg-phone-topo{background:var(--vinho);color:var(--creme);padding:14px 14px 12px;display:flex;align-items:center;gap:10px}
.dg-phone-avatar{width:38px;height:38px;flex-shrink:0;border-radius:999px;background:var(--creme);display:flex;align-items:center;justify-content:center;color:var(--cafe)}
.dg-phone-nome{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-phone-sub{font-size:11px;color:var(--rose);margin-top:2px}
.dg-phone-conversa{padding:12px;display:flex;flex-direction:column;gap:10px;flex-grow:1}
.dg-phone-dia{align-self:center;background:#FFF8E6;color:#7a6a4a;font-size:10px;font-weight:500;padding:4px 10px;border-radius:8px}
.dg-phone-msgs{display:flex;flex-direction:column;gap:10px}
.dg-balao{background:#FFFFFF;border-radius:12px 12px 12px 4px;padding:8px;display:flex;flex-direction:column;gap:6px;box-shadow:0 1px 0 rgba(74,44,30,.08)}
.dg-balao-foto{position:relative;background:var(--creme);border-radius:10px;padding:10px;display:flex;align-items:center;justify-content:center;height:118px}
.dg-balao-img{width:96px;height:96px;background:#FFFFFF;border-radius:10px;object-fit:contain}
.dg-selo-marca{position:absolute;left:8px;top:8px;display:inline-flex;align-items:center;gap:4px;background:var(--creme);border-radius:999px;padding:3px 6px 3px 3px;color:var(--cafe);font-family:Fraunces,Georgia,serif;font-weight:900;font-size:10px}
.dg-balao-texto{font-size:12.5px;line-height:1.4;color:#1F1F1F}
.dg-balao-texto s{color:#777}
.dg-balao-link{color:#0B57D0}
.dg-balao-hora{font-size:10px;color:#8a8a8a;text-align:right}
@media (max-width:760px){.dg-phone-crop{max-height:372px;overflow:hidden;border-radius:36px 36px 0 0}}

/* B: mosaico das ofertas */
.dg-mosaico{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;max-width:520px}
.dg-ladrilho{aspect-ratio:1/1;background:#FFFFFF;border-radius:16px;display:flex;align-items:center;justify-content:center;padding:14%;overflow:hidden}
.dg-ladrilho-img{width:100%;height:100%;object-fit:contain}
.dg-ladrilho-mais{background:var(--mostarda);flex-direction:column;gap:2px;color:var(--cafe);text-align:center;padding:8px}
.dg-ladrilho-n{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:clamp(22px,3vw,34px);line-height:1;letter-spacing:-.03em}
.dg-ladrilho-t{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}

/* C: recibo da semana */
.dg-recibo{width:100%;max-width:440px}
.dg-recibo svg{display:block}
.dg-recibo-corpo{background:var(--creme);padding:10px 26px 22px;display:flex;flex-direction:column;gap:12px;color:var(--cafe)}
.dg-recibo-topo{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:2px dashed var(--borda);padding-bottom:10px}
.dg-recibo-titulo{font-family:Fraunces,Georgia,serif;font-weight:900;font-size:20px;letter-spacing:-.02em}
.dg-recibo-total{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cafe-claro)}
.dg-recibo-linhas{display:flex;flex-direction:column;gap:12px}
.dg-recibo-linha{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:4px 12px}
.dg-recibo-linha-sem{grid-template-columns:minmax(0,1fr) auto}
.dg-recibo-foto{grid-row:span 2;width:64px;height:64px;padding:4px;background:#fff;border-radius:10px}
.dg-recibo-img{display:block;width:100%;height:100%;object-fit:contain}
.dg-recibo-nome{grid-column:2/-1;font-size:15px;font-weight:500;line-height:1.3}
.dg-recibo-linha-sem .dg-recibo-nome{grid-column:1/-1}
.dg-recibo-nome s{font-size:12px;font-weight:400;color:var(--cafe-claro)}
.dg-recibo-preco{font-size:24px;line-height:1;letter-spacing:-.03em;color:var(--vinho);white-space:nowrap}
.dg-recibo-pct{background:var(--rose);color:var(--vinho);font-size:12px;font-weight:700;padding:5px 8px;border-radius:8px}
.dg-recibo-pe{border-top:2px dashed var(--borda);padding-top:10px;font-size:12px;color:var(--cafe-claro);line-height:1.4}

/* Faixa "N ofertas postadas no grupo esta semana" (A e B) */
.dg-faixa-sec{padding-top:56px;padding-bottom:8px;display:flex;flex-direction:column;gap:20px}
.dg-faixa{display:flex;flex-direction:column;gap:20px}
.dg-faixa-topo{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px}
h2{margin:0;font-size:clamp(24px,2.6vw,32px);line-height:1.05;letter-spacing:-.02em;color:var(--cafe)}
.dg-nota{font-size:13px;color:var(--cafe-claro)}
/* 4 colunas no computador e 2 no celular, como no modelo; com menos de 4 ofertas os cards não esticam */
.dg-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (min-width:700px){.dg-cards{grid-template-columns:repeat(4,minmax(0,1fr))}}
.dg-card{background:var(--papel);border:2px solid var(--borda);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:10px}
.dg-card-foto{position:relative;aspect-ratio:1/1;background:#FFFFFF;border-radius:16px;display:flex;align-items:center;justify-content:center;padding:14%;overflow:hidden}
.dg-card-img{width:100%;height:100%;object-fit:contain}
.dg-card-pct{position:absolute;left:10px;top:10px;background:var(--mostarda);color:var(--cafe);font-weight:700;font-size:13px;padding:6px 9px;border-radius:10px}
/* Título real de loja é comprido: no máximo 2 linhas (o nome curto se ajusta no painel) */
.dg-card-nome,.dg-recibo-nome-t,.dg-balao-nome{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.dg-card-nome{font-size:15px;font-weight:500;line-height:1.3}
.dg-card-precos{display:flex;flex-direction:column;gap:2px}
.dg-card-precos s{font-size:13px;color:var(--cafe-claro)}
.dg-card-precos .dg-preco{font-size:26px;line-height:1;letter-spacing:-.03em;color:var(--vinho)}
.dg-centro{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.dg-faixa-sec .dg-centro{padding-top:16px}

/* 3 cartões */
.dg-beneficios{padding-top:48px;padding-bottom:8px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:16px}
.dg-beneficio{background:var(--papel);border:2px solid var(--borda);border-radius:20px;padding:22px 24px;display:flex;flex-direction:column;gap:8px}
.dg-barra{width:40px;height:8px;border-radius:999px;background:var(--vinho)}
.dg-barra-cafe{background:var(--cafe)}
.dg-barra-mostarda{background:var(--mostarda)}
.dg-beneficio h3{margin:0;font-family:Fraunces,Georgia,serif;font-weight:900;font-variation-settings:'SOFT' 100,'opsz' 144;font-size:22px;line-height:1.1;letter-spacing:-.02em}
.dg-beneficio p{margin:0;font-size:15px;line-height:1.5;color:var(--cafe-claro)}
.dg-meio-c{padding-top:40px}

/* FAQ */
.dg-faq{padding-top:48px;padding-bottom:8px;display:flex;flex-direction:column;gap:10px}
.dg-faq h2{margin-bottom:8px}
details{background:var(--papel);border:2px solid var(--borda);border-radius:16px;padding:0 20px}
summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;font-size:17px;font-weight:500}
summary::-webkit-details-marker{display:none}
summary span{width:28px;height:28px;flex-shrink:0;border-radius:999px;background:var(--rose);color:var(--vinho);display:inline-flex;align-items:center;justify-content:center;font-weight:700}
details p{margin:0;font-size:15px;line-height:1.55;color:var(--cafe-claro);padding:0 0 18px}

/* Fim e rodapé */
.dg-fim{padding-top:40px}
footer{padding-top:48px;padding-bottom:40px;display:flex;flex-direction:column;gap:14px;font-size:13px;color:var(--cafe-claro);line-height:1.5}
.dg-rodape-topo{border-top:2px solid var(--borda);padding-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
footer .dg-logo .dg-marca{font-size:24px}
.dg-comissao{max-width:720px;margin:0}

/* Botão fixo no rodapé: aparece quando nenhum dos outros botões está na tela */
.fixo{position:fixed;left:0;right:0;bottom:0;z-index:5;padding:8px 16px calc(8px + env(safe-area-inset-bottom));background:rgba(247,239,227,.96);box-shadow:0 -4px 16px rgba(74,44,30,.14);display:flex;justify-content:center}
.fixo[hidden]{display:none}
@media (min-width:761px){.fixo{display:none}body.com-fixo{padding-bottom:0}}

/* Página de privacidade */
.dg-texto-longo{padding-top:32px;padding-bottom:16px;font-size:16px;line-height:1.6}
.dg-texto-longo h1{font-size:clamp(28px,4vw,40px);margin-bottom:16px}
.dg-texto-longo h2{font-family:Rubik,Arial,sans-serif;font-weight:700;font-variation-settings:normal;font-size:19px;letter-spacing:0;line-height:1.3;margin:28px 0 8px}
.dg-texto-longo p,.dg-texto-longo ul{margin:0 0 12px;color:var(--cafe)}
.dg-texto-longo ul{padding-left:20px}