/* ACENF: estilo comum às 3 páginas (cores tiradas da logo e do acenf.com.br) */
:root {
  --verde: #13322d; --verde-2: #1c463e; --noite: #0b1d1a; --mata: #2e6a58;
  --ouro: #d9b25c; --ouro-2: #f1d38c; --oliva: #a8a77c; --areia: #e8c9a8;
  --papel: #f4f2ea; --papel-2: #ebe6d8; --branco: #fffdf7; --tinta: #14231f; --cinza: #59665f;
  --linha: rgba(20, 35, 31, .12); --perigo: #b4362b; --zap: #1d8a5a;
  --raio: 16px; --sombra: 0 18px 40px -22px rgba(11, 29, 26, .45);
  --titulo: 'Josefin Sans', system-ui, sans-serif; --texto: 'DM Sans', system-ui, sans-serif;
  --caixa: min(1200px, calc(100% - 32px));
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--papel); color: var(--tinta); font: 400 17px/1.6 var(--texto); overflow-x: clip; }
img, video, svg { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4 { font-family: var(--titulo); font-weight: 700; line-height: 1.02; margin: 0; letter-spacing: -.01em; }
p { margin: 0; }
:focus-visible { outline: 3px solid var(--ouro); outline-offset: 3px; border-radius: 6px; }
.ic { width: 1.15em; height: 1.15em; flex: none; }
.caixa { width: var(--caixa); margin-inline: auto; }
.oculto { display: none !important; }
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* rótulo pequeno acima dos títulos */
.rotulo { display: inline-flex; align-items: center; gap: 10px; font: 600 13px/1 var(--titulo); letter-spacing: .18em; text-transform: uppercase; color: var(--mata); }
.rotulo::before { content: ''; width: 28px; height: 2px; background: currentColor; }
.escuro .rotulo, .rotulo.claro { color: var(--ouro); }

/* botões: preenchimento sobe no hover */
.botao { --f: var(--ouro); --t: var(--noite); --h: var(--ouro-2);
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px;
  border: 0; border-radius: 999px; background: linear-gradient(var(--h) 0 0) 0 100% / 100% 0 no-repeat, var(--f); color: var(--t);
  font: 600 15.5px/1 var(--texto); text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-size .35s cubic-bezier(.2,.8,.2,1), transform .2s; }
.botao:hover { background-size: 100% 100%; }
.botao:active { transform: scale(.98); }
.botao .ic { transition: transform .3s; }
.botao:hover .ic:last-child { transform: translateX(3px); }
.botao.claro { --f: transparent; --t: #fff; --h: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); }
.botao.verde { --f: var(--verde); --t: #fff; --h: var(--verde-2); }
.botao.linha { --f: transparent; --t: var(--verde); --h: rgba(19,50,45,.08); box-shadow: inset 0 0 0 1.5px var(--verde); }
.botao.zap { --f: var(--zap); --t: #fff; --h: #157049; }
.botao.perigo { --f: transparent; --t: var(--perigo); --h: rgba(180,54,43,.08); box-shadow: inset 0 0 0 1.5px currentColor; }
.botao.pequeno { min-height: 40px; padding: 0 16px; font-size: 14px; }
.botao[disabled] { opacity: .55; pointer-events: none; }
.link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--verde); text-decoration: none;
  background: linear-gradient(currentColor 0 0) 0 100% / 0 2px no-repeat; transition: background-size .35s; padding-bottom: 2px; }
.link:hover { background-size: 100% 2px; }
.escuro .link { color: var(--ouro-2); }

/* topo */
.topo { position: fixed; inset: 0 0 auto; z-index: 50; color: #fff; transition: background .35s, color .35s, box-shadow .35s; }
.topo .caixa { display: flex; align-items: center; gap: 28px; height: 76px; }
.topo.solido { background: rgba(244, 242, 234, .9); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); color: var(--tinta); box-shadow: 0 1px 0 var(--linha); }
.marca { display: flex; align-items: center; gap: 12px; text-decoration: none; margin-right: auto; }
.marca b { font: 700 30px/1 var(--titulo); letter-spacing: .03em; padding-top: 4px; }
.marca small { font: 500 10.5px/1.25 var(--texto); color: var(--oliva); max-width: 150px; }
.topo.solido .marca small { color: #7d7c55; }
.topo nav { display: flex; align-items: center; gap: 26px; font-weight: 500; font-size: 15px; }
.topo nav a:not(.botao) { text-decoration: none; background: linear-gradient(currentColor 0 0) 0 100% / 0 1.5px no-repeat; transition: background-size .3s; padding: 4px 0; }
.topo nav a:not(.botao):hover, .topo nav a[aria-current] { background-size: 100% 1.5px; }
.topo-menu { display: none; background: none; border: 0; padding: 8px; cursor: pointer; }
.topo-menu .ic { width: 28px; height: 28px; }
@media (max-width: 900px) {
  .topo-menu { display: block; }
  .topo nav { position: fixed; inset: 76px 0 auto; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 16px 20px;
    background: var(--papel); color: var(--tinta); box-shadow: 0 20px 30px -20px rgba(0,0,0,.4);
    clip-path: inset(0 0 100% 0); transition: clip-path .4s cubic-bezier(.2,.8,.2,1); }
  .topo nav a:not(.botao) { padding: 14px 4px; border-bottom: 1px solid var(--linha); background: none; }
  .topo nav .botao { margin-top: 14px; }
  .topo.aberto nav { clip-path: inset(0 0 0 0); }
  .topo.aberto { background: var(--papel); color: var(--tinta); }
}

/* seções */
.secao { padding-block: clamp(72px, 10vw, 136px); }
.escuro { background: var(--verde); color: #eef0e8; }
.titulo-secao { font-size: clamp(34px, 5vw, 60px); margin-top: 18px; }
.titulo-secao em { font-style: normal; color: var(--mata); }
.escuro .titulo-secao em { color: var(--ouro); }
.intro { max-width: 640px; color: var(--cinza); font-size: 18px; margin-top: 18px; }
.escuro .intro { color: #c2cbc3; }
.cabeca { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; margin-bottom: 44px; }

/* cartão de promoção (index e shopping) */
.grade-promos { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 22px; }
.promo { position: relative; display: flex; flex-direction: column; background: var(--branco); color: var(--tinta); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); transition: transform .3s; }
.promo:hover { transform: translateY(-4px); }
.promo-foto { position: relative; aspect-ratio: 4 / 5; background: var(--papel-2); overflow: hidden; }
.promo-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.promo:hover .promo-foto img { transform: scale(1.04); }
.selo { position: absolute; top: 12px; left: 12px; background: var(--ouro); color: var(--noite); font: 700 15px/1 var(--titulo); padding: 9px 12px 6px; border-radius: 999px; }
.promo-compartilhar { position: absolute; top: 10px; right: 10px; width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,253,247,.92); color: var(--verde); cursor: pointer; }
.promo-corpo { display: flex; flex-direction: column; gap: 8px; padding: 16px 16px 18px; flex: 1; }
.promo-loja { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--mata); text-decoration: none; }
.promo h3 { font: 600 17px/1.3 var(--texto); letter-spacing: 0; }
.promo-desc { font-size: 14px; color: var(--cinza); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.preco { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: auto; padding-top: 4px; }
.preco s { color: var(--cinza); font-size: 14px; }
.preco strong { font: 700 26px/1 var(--titulo); color: var(--verde); padding-top: 3px; }
.validade { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cinza); }
.promo .botao { margin-top: 6px; width: 100%; }
.logo-loja { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: var(--papel-2); flex: none; }
.logo-loja.mini { width: 26px; height: 26px; }
.logo-loja.sem { display: grid; place-items: center; background: var(--verde); color: var(--ouro); font: 700 22px/1 var(--titulo); padding-top: 3px; }
.logo-loja.mini.sem { font-size: 12px; }
.vazio { padding: 40px 24px; border: 1.5px dashed var(--linha); border-radius: var(--raio); text-align: center; color: var(--cinza); }
.escuro .vazio { border-color: rgba(255,255,255,.2); color: #c2cbc3; }
.vazio strong { display: block; font: 700 22px/1.2 var(--titulo); color: var(--tinta); margin-bottom: 8px; }
.escuro .vazio strong { color: #fff; }
.esqueleto { aspect-ratio: 4 / 6.4; border-radius: var(--raio); background: linear-gradient(100deg, rgba(255,255,255,.06) 30%, rgba(255,255,255,.14) 50%, rgba(255,255,255,.06) 70%) 0 0 / 300% 100%; animation: brilho 1.4s infinite linear; }
:not(.escuro) > .grade-promos .esqueleto, .claro-esq .esqueleto { background-color: var(--papel-2); }
@keyframes brilho { to { background-position: -150% 0; } }

/* formulários (parceiro) */
.campo { display: grid; gap: 6px; }
.campo > span { font-weight: 600; font-size: 14.5px; }
.campo small { color: var(--cinza); font-size: 13px; }
.campo input, .campo select, .campo textarea { width: 100%; min-height: 50px; padding: 12px 14px; border: 1.5px solid #cfc9b8; border-radius: 12px; background: var(--branco); transition: border-color .2s, box-shadow .2s; }
.campo textarea { min-height: 96px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--mata); box-shadow: 0 0 0 4px rgba(46,106,88,.15); }
.aviso { padding: 12px 14px; border-radius: 12px; font-size: 14.5px; background: #fbefd2; color: #6b4d0d; }
.aviso.erro { background: #f9e1dd; color: #8a2219; }
.aviso.ok { background: #dcefe4; color: #14583a; }

/* rodapé */
.rodape { background: var(--noite); color: #c2cbc3; padding: 72px 0 32px; font-size: 15px; }
.rodape-grade { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; }
.rodape .marca { color: #fff; }
.rodape h4 { font: 600 13px/1 var(--titulo); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro); margin-bottom: 16px; }
.rodape ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.rodape a { text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.rodape a:hover { color: #fff; }
.rodape-fim { margin-top: 56px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); font-size: 13px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
@media (max-width: 760px) { .rodape-grade { grid-template-columns: 1fr; } }

/* páginas internas começam abaixo do topo */
.pagina-interna main { padding-top: 76px; }

/* aparece ao rolar (só onde o navegador sabe; sem animação para quem pediu menos movimento) */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .revela { animation: revela linear both; animation-timeline: view(); animation-range: entry 0% cover 28%; }
    .revela-midia img, .revela-midia video { animation: abre linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
  }
}
@keyframes revela { from { opacity: 0; transform: translateY(46px); filter: blur(6px); } }
@keyframes abre { from { clip-path: inset(12% 8% 12% 8% round 24px); transform: scale(1.12); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; } }