/* Componentes compartilhados entre as páginas (a página só acrescenta o que é dela).
   Aqui: altura de uma tela, texto do topo, coluna de escolha com cartão de pedido, o + que abre a lista de itens,
   perguntas frequentes, botão grande, guia com caminhos para as outras páginas, chamada final suave. */

/* altura de uma "tela" descontando o cabeçalho (--extra existe só na prévia, por causa do aviso no topo) */
:root{--sec-h:calc(100vh - var(--cab-h) - var(--extra,0px))}
@supports (height:100svh){:root{--sec-h:calc(100svh - var(--cab-h) - var(--extra,0px))}}

/* a lista de itens fica atrás de uma linha com + (vira - ao abrir) */
details.detalhes,.cesta details.detalhes{border-top:0;padding-top:0}
.mais{list-style:none}
.mais::-webkit-details-marker{display:none}
.mais{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);min-height:56px;border-top:1px solid var(--linha);border-bottom:1px solid var(--linha);cursor:pointer;font-weight:500;color:var(--ink);user-select:none}
.mais__fechar,.detalhes[open] .mais__abrir{display:none}
.detalhes[open] .mais__fechar{display:inline}
.mais__icone{position:relative;flex:none;width:30px;height:30px;border:1.5px solid var(--ink);border-radius:50%;color:var(--ink);transition:background-color var(--t-rapido) var(--ease),color var(--t-rapido) var(--ease)}
.mais__icone::before,.mais__icone::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;border-radius:1px;background:currentColor;transform:translate(-50%,-50%);transition:transform var(--t-rapido) var(--ease)}
.mais__icone::after{transform:translate(-50%,-50%) rotate(90deg)}
.detalhes[open] .mais__icone::after{transform:translate(-50%,-50%) rotate(0deg)}
@media(hover:hover){.mais:hover .mais__icone{background:var(--ink);color:#fff}}
@media(prefers-reduced-motion:reduce){.mais__icone,.mais__icone::before,.mais__icone::after{transition:none}}
.detalhes__corpo{display:grid;gap:var(--s3);padding-bottom:var(--s2)}
.rotulo{margin:var(--s3) 0 0;font:600 12px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--suave)}
.detalhes .cardapio{list-style:none;margin:0;padding:0;display:block}
.detalhes .cardapio li{padding:9px 0;border-bottom:1px solid var(--linha);font-size:15px;line-height:1.4}
.detalhes .cardapio li:first-child{border-top:1px solid var(--linha)}
.detalhes__corpo>.cardapio:first-child li:first-child{border-top:0}

/* ---------- perguntas frequentes: seção própria ---------- */
.faq{display:grid;align-content:center;padding-block:var(--s8)}
@media(min-width:760px){.faq{min-height:var(--sec-h)}}
.faq__grade{display:grid;gap:var(--s6)}
@media(min-width:900px){.faq__grade{grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(32px,6vw,120px);align-items:start}.faq__cab{position:sticky;top:calc(var(--cab-h) + var(--s6))}}
.faq h2{font-size:clamp(2.25rem,1rem + 3.2vw,4.5rem);line-height:1.02;letter-spacing:-.02em}
.faq__lead{margin:var(--s3) 0 0;color:var(--suave)}
.faq__lista{border-top:1px solid var(--linha)}
.faq__item{border-bottom:1px solid var(--linha)}
.faq .mais{border:0;min-height:68px;padding-block:var(--s3);font-size:clamp(1.0625rem,1rem + .25vw,1.1875rem);line-height:1.35}
.faq__resposta{margin:0;padding:0 var(--s7) var(--s5) 0;max-width:62ch}
.faq__resposta p{margin:0 0 var(--s3)}
.faq__passos{margin:0;padding-left:1.25em}
.faq__passos li{margin:0 0 var(--s2);padding-left:.25em}

/* ---------- escolha: coluna principal + cartão de pedido ---------- */
.escolha{display:grid;gap:var(--s7)}
@media(min-width:1100px){.escolha{grid-template-columns:minmax(0,1fr) 340px;gap:clamp(32px,4vw,80px);align-items:start}}
.escolha__principal{min-width:0}

.btn--grande{min-height:64px;padding:0 40px;font-size:18px}
.ic--seta{transition:transform var(--t-medio) var(--ease)}
@media(hover:hover){.btn:hover .ic--seta{transform:translate(3px,-3px)}}
@media(prefers-reduced-motion:reduce){.ic--seta{transition:none}}

.capitulo__nota,.detalhes__nota{margin:0;font-size:14px;line-height:1.5;color:var(--suave)}

/* ---------- texto do topo (migalhas, título, apoio, botões e fatos) ---------- */
.topo__texto{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.migalhas{list-style:none;margin:0 0 var(--s5);padding:0;display:flex;flex-wrap:wrap;gap:var(--s2);font-size:14px;color:var(--suave)}
.migalhas li+li::before{content:"/";margin-right:var(--s2);color:var(--linha)}
.migalhas a{color:var(--suave);text-decoration:none}
@media(hover:hover){.migalhas a:hover{color:var(--ink);text-decoration:underline}}

.topo h1{font-size:clamp(2.5rem,.8rem + 4.6vw,6.5rem);line-height:.98;letter-spacing:-.025em}

.topo__lead{margin:var(--s5) 0 0;max-width:34em;font-size:clamp(1.0625rem,1rem + .35vw,1.3125rem)}

.topo__acoes{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}

.topo__fatos{list-style:none;margin:var(--s5) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);color:var(--suave)}

.topo__fatos li+li::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--ouro);margin-right:var(--s3);vertical-align:middle}

/* uma seção por cesta, uma por tela: foto grande de um lado, cardápio do outro, alternando */
.capitulos{display:block}
.capitulo{display:grid;gap:var(--s6);align-content:center;align-items:center;padding-block:var(--s7);border-top:1px solid var(--linha);scroll-margin-top:calc(var(--cab-h) + var(--s4))}
@media(min-width:760px){
  .capitulo{min-height:var(--sec-h);grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,72px)}
  .capitulo:nth-child(even){grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .capitulo:nth-child(even) .capitulo__fotos{order:2}
}
.capitulo__fotos{display:grid;gap:var(--s3);justify-items:center}
.capitulo__fotos .slot{aspect-ratio:4/5;width:100%;max-width:min(100%,calc((var(--sec-h) - 112px) * .8))}
.capitulo__fotos:has(.slot + .slot){grid-template-columns:1fr 1fr;align-items:start}
.capitulo__fotos:has(.slot + .slot) .slot{max-width:none}
.capitulo__fotos:has(.slot + .slot) .slot + .slot{margin-top:var(--s7)}
.capitulo[data-escolhida="true"]{outline:0}
.capitulo[data-escolhida="true"] .capitulo__fotos .slot{outline:2px solid var(--ink);outline-offset:4px}
.capitulo__texto{display:grid;gap:var(--s4);align-content:center;max-width:44rem}
.capitulo__nome{font:500 clamp(2.25rem,1rem + 3.2vw,4.5rem)/1.02 var(--serif);letter-spacing:-.02em;text-wrap:balance}
.capitulo__intro{margin:0;font-size:clamp(1.0625rem,1rem + .35vw,1.3125rem);line-height:1.55}
.capitulo__muda{margin:0;font-size:15px;line-height:1.55;color:var(--suave)}
.capitulo__muda b{font-weight:600;color:var(--ink)}
.capitulo__liga{margin:0;font-size:15px;line-height:1.55;color:var(--suave)}
.capitulo__liga a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ouro);text-underline-offset:3px}
.capitulo__fim{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s3);margin-top:var(--s3)}
.capitulo__preco{margin:0;font:600 clamp(1.5rem,1.2rem + 1vw,2.25rem)/1.1 var(--sans);font-variant-numeric:tabular-nums;color:var(--ink)}

/* ---------- painel de chamada final: chocolate com feixes de luz dourada nas laterais e moldura dupla ----------
   (referência: painel escuro de chamada com feixes de luz; aqui na paleta da marca. Só gradientes, sem imagem e sem animação contínua) */
.cta-final{padding-block:var(--s7) var(--s8)}
.palco{position:relative;display:grid;place-items:center;min-height:clamp(340px,50svh,500px);padding:clamp(40px,7vw,96px) clamp(20px,5vw,72px);overflow:hidden;isolation:isolate;text-align:center;color:#d9cbbb;
  border-radius:clamp(24px,3.4vw,44px);background:radial-gradient(70% 100% at 50% 0%,rgba(196,156,111,.14),transparent 62%),var(--choc);
  box-shadow:inset 0 0 0 1px rgba(196,156,111,.26),0 0 0 8px #fff,0 0 0 9px var(--linha)}
.palco__miolo{position:relative;z-index:1;display:grid;justify-items:center;gap:var(--s5);max-width:42rem}
.palco h2{color:#fff;font:500 clamp(1.75rem,1rem + 3.4vw,4rem)/1.08 var(--serif);letter-spacing:-.02em;text-wrap:balance}
.palco p{margin:0;max-width:44ch;font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);line-height:1.55}
.palco .btn--grande{margin-top:var(--s2)}
.palco__luz{position:absolute;top:0;bottom:0;width:36%;pointer-events:none;z-index:0}
.palco__luz--e{left:0;background:radial-gradient(60% 80% at 58% 0%,rgba(196,156,111,.36),transparent 72%)}
.palco__luz--d{right:0;background:radial-gradient(60% 80% at 42% 0%,rgba(196,156,111,.36),transparent 72%)}
.palco__luz::before,.palco__luz::after{content:"";position:absolute;top:-12%;bottom:-12%;width:2px;border-radius:2px;
  background:linear-gradient(180deg,transparent,rgba(240,212,170,.95) 24%,rgba(196,156,111,.9) 72%,transparent);box-shadow:0 0 16px 2px rgba(196,156,111,.5)}
.palco__luz::after{width:1px;opacity:.65;box-shadow:none}
.palco__luz--e::before{left:34%;transform:skewX(-27deg)}
.palco__luz--e::after{left:40%;transform:skewX(-27deg)}
.palco__luz--d::before{right:34%;transform:skewX(27deg)}
.palco__luz--d::after{right:40%;transform:skewX(27deg)}
@media(max-width:759px){
  .palco__luz{width:34%}
  .palco__luz::after{display:none}
  .palco__luz--e::before{left:38%;transform:skewX(-10deg)}
  .palco__luz--d::before{right:38%;transform:skewX(10deg)}
}
@media(min-width:760px){
  /* textura de linhas finas nos cantos de baixo */
  .palco::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(118deg,rgba(255,255,255,.06) 0 1px,transparent 1px 5px);
    -webkit-mask-image:radial-gradient(42% 75% at 0% 100%,#000,transparent 72%),radial-gradient(42% 75% at 100% 100%,#000,transparent 72%);
    mask-image:radial-gradient(42% 75% at 0% 100%,#000,transparent 72%),radial-gradient(42% 75% at 100% 100%,#000,transparent 72%)}
}
/* entrada: a luz abre das laterais quando o painel aparece (só opacity e transform) */
@media(prefers-reduced-motion:no-preference){
  html.js .palco__luz{opacity:0;transition:opacity 1500ms var(--mv-ease) 150ms,transform 1700ms var(--mv-ease) 150ms}
  html.js .palco__luz--e{transform:translateX(-36px)}
  html.js .palco__luz--d{transform:translateX(36px)}
  html.js .palco.mv-in .palco__luz{opacity:1;transform:none}
}

/* ---------- escolha: o título da seção só existe para leitores de tela e buscadores (o topo já mostra a régua ou o título) ---------- */
.escolha__principal>h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- guia: texto próprio e caminhos para as outras páginas ---------- */
.guia{display:grid;align-content:center;padding-block:var(--s8);border-top:1px solid var(--linha)}
@media(min-width:760px){.guia{min-height:var(--sec-h)}}
.guia__grade{display:grid;gap:var(--s7)}
@media(min-width:900px){.guia__grade{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(32px,6vw,120px);align-items:start}}
.guia h2{margin-bottom:var(--s5);font-size:clamp(2.25rem,1rem + 3.2vw,4.5rem);line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
.guia__texto p{margin:0 0 var(--s4);max-width:58ch;font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);line-height:1.6}
.guia__texto a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--ouro);text-underline-offset:3px}
.guia__caminhos{list-style:none;margin:0;padding:0;border-top:1px solid var(--linha)}
.caminho{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--s4);padding:var(--s5) 0;border-bottom:1px solid var(--linha);color:var(--ink);text-decoration:none}
.caminho__titulo{display:block;font:500 clamp(1.125rem,1rem + .5vw,1.5rem)/1.25 var(--serif)}
.caminho__detalhe{display:block;margin-top:4px;font-size:14px;line-height:1.4;color:var(--suave)}
.caminho .ic{width:22px;height:22px;transition:transform var(--t-rapido) var(--ease)}
@media(hover:hover){.caminho:hover .ic{transform:translateX(4px)}.caminho:hover .caminho__titulo{text-decoration:underline;text-decoration-color:var(--ouro);text-decoration-thickness:2px;text-underline-offset:5px}}
@media(prefers-reduced-motion:reduce){.caminho .ic{transition:none}}

/* ---------- chamada final suave (Românticas e Infantis): selo, título grande, apoio e botão grande, centrados sob um fio de ouro, sem painel escuro ---------- */
.chamada-calma{padding-block:var(--s7) var(--s8)}
.chamada-calma__miolo{display:grid;justify-items:center;gap:var(--s5);padding-top:clamp(40px,8svh,96px);border-top:1px solid var(--ouro);text-align:center}
@media(min-width:760px){.chamada-calma{display:grid;align-content:center;min-height:min(86svh,780px)}.chamada-calma>.container{width:100%}}
.chamada-calma__selo,.avaliacoes__selo,.selo{display:inline-flex;align-items:center;gap:10px;margin:0;padding:8px 18px;border:1px solid var(--linha);border-radius:var(--r-pilula);font:600 12px/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--suave)}
@media(max-width:479px){.chamada-calma__selo,.avaliacoes__selo,.selo{padding:7px 14px;font-size:11px;letter-spacing:.06em}}
.chamada-calma__selo::before,.avaliacoes__selo::before,.selo::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ouro)}
.chamada-calma h2{font:500 clamp(2.25rem,.9rem + 4.6vw,5rem)/1.05 var(--serif);letter-spacing:-.02em;text-wrap:balance}
.chamada-calma__apoio{margin:0;max-width:40ch;font-size:clamp(1.0625rem,1rem + .35vw,1.3125rem);line-height:1.55;color:var(--suave)}
.chamada-calma .btn--grande{margin-top:var(--s2)}
/* o título quebra onde a frase pede, sem "a", "em" ou "e" sozinho no fim da linha */
@media(min-width:900px){.quebra-desk{display:block}}

/* ---------- aviso de data especial: a seção do gancho, em faixa dourada com texto chocolate (6,7 para 1) ----------
   Usada na landing Dia das Crianças (botão para o formulário) e nas Infantis (botão para a landing). O título usa a fonte da marca (Playfair Display, sem fonte extra). O modificador .aviso--faixa é a versão mais baixa, para ficar entre outras seções. */
.aviso{background:var(--ouro);color:var(--choc);padding-block:var(--s8);scroll-margin-top:var(--cab-h)}
@media(min-width:760px){.aviso{display:grid;align-content:center;min-height:min(72svh,680px)}}
.aviso>.container{width:100%}
.aviso__grade{display:grid;gap:var(--s7);align-items:center}
@media(min-width:900px){.aviso__grade{grid-template-columns:minmax(0,1.5fr) auto;gap:clamp(32px,6vw,120px)}}
.aviso__rotulo{margin:0 0 var(--s3);font:600 12px/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.aviso__titulo{max-width:16ch;font:500 clamp(2.25rem,1rem + 4.4vw,5.25rem)/1.04 var(--serif);letter-spacing:-.02em;text-wrap:balance;color:var(--choc)}
.aviso__corpo{margin:var(--s5) 0 0;max-width:36em;font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.55}
.aviso__nota{margin:var(--s4) 0 0;max-width:44em;font-size:14px;line-height:1.5}
.aviso :focus-visible{outline-color:var(--choc)}
.aviso--faixa{padding-block:var(--s7)}
@media(min-width:760px){.aviso--faixa{min-height:min(52svh,520px)}}

/* ---------- avaliações reais do Google: cabeçalho centrado, resumo da nota, um depoimento em destaque e os outros em duas colunas ----------
   Estrutura de painel de depoimentos (referência do Lombra), na paleta da marca: cartões brancos com fio, ouro só nas estrelas e no fio do título.
   Entrada: os cartões sobem escalonados e as estrelas se preenchem da esquerda para a direita (só clip-path e opacity; desligado com prefers-reduced-motion). */
.avaliacoes{padding-block:var(--s8);border-top:1px solid var(--linha)}
.avaliacoes>.container{width:100%}
.avaliacoes__cab{display:grid;justify-items:center;gap:var(--s4);text-align:center}
.avaliacoes h2{max-width:16ch;font-size:clamp(2.25rem,1rem + 3.2vw,4.5rem);line-height:1.04;letter-spacing:-.02em;text-wrap:balance}
/* a segunda parte do título leva itálico e um fio de ouro por baixo (o ouro só como linha) */
.avaliacoes h2 em{font-style:italic;background:linear-gradient(transparent 86%,var(--ouro) 86% 93%,transparent 93%)}
.avaliacoes__apoio{margin:0;max-width:46ch;font-size:15px;line-height:1.55;color:var(--suave)}
.avaliacoes__resumo{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--s3) var(--s5);margin:var(--s6) 0 var(--s7)}
.avaliacoes__nota{font:500 clamp(1.75rem,1.4rem + 1.2vw,2.25rem)/1 var(--serif);color:var(--ink);padding-bottom:.12em}
.avaliacoes__texto{margin:0;font-size:14px;line-height:1.45;color:var(--suave)}
.avaliacoes__resumo .link-seta{font-size:14px}
.estrelas{display:inline-flex;gap:2px;color:var(--ouro)}
.estrelas .ic{width:22px;height:22px}
.avaliacoes__lista{list-style:none;margin:0;padding:0;display:grid;gap:clamp(12px,1.6vw,24px)}
@media(min-width:760px){.avaliacoes__lista{grid-template-columns:repeat(2,minmax(0,1fr))}.aval--destaque{grid-column:1 / -1}}
.aval{display:grid;min-width:0}
.aval>figure{margin:0;display:flex;flex-direction:column;gap:var(--s4);height:100%;padding:clamp(20px,2.4vw,32px);border:1px solid var(--linha);border-radius:var(--r-card);background:#fff}
.aval__autor{order:-1;display:flex;align-items:center;gap:var(--s3)}
.aval__inicial{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ouro-tint);color:var(--choc);font:600 16px/1 var(--sans)}
.aval__id{display:grid;gap:4px;min-width:0}
.aval__nome{font:600 16px/1.3 var(--sans);color:var(--ink)}
.aval .estrelas .ic{width:15px;height:15px}
.aval blockquote{margin:0;flex:1}
.aval blockquote p{margin:0;font-size:16px;line-height:1.65;color:var(--texto)}
.aval--destaque blockquote p{max-width:72ch;font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.6}
.aval__fonte{margin:0;display:flex;align-items:center;gap:8px;font:600 11px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--suave)}
.aval__fonte::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ouro)}
@media(prefers-reduced-motion:no-preference){
  html.js .aval .estrelas,html.js .avaliacoes__resumo .estrelas{clip-path:inset(0 100% 0 0);transition:clip-path 1000ms var(--mv-ease) calc(var(--i,0) * 90ms + 400ms)}
  html.js .aval.mv-in .estrelas,html.js .avaliacoes__resumo.mv-in .estrelas{clip-path:inset(0)}
}

/* ---------- números e marcas: balões com números que contam à esquerda; à direita o título e as marcas que usamos passando ----------
   Estrutura de uma referência do Lombra (20/09/2026), na paleta da marca: balões brancos com fio, um fio de ouro curto no alto e um leve tom de ouro que se dissolve.
   Logos, práticas dos bons sites de "logo cloud": mesma altura óptica por logo (--h em cada item), cinza com opacidade reduzida e cor no hover, bordas que se dissolvem
   (máscara do .marquee), rolagem lenta que pausa ao passar o mouse e fica parada com prefers-reduced-motion. O espaço entre as logos é padding do item, e não gap: assim a
   volta do laço (-50%) cai exatamente no início, sem salto. */
.numeros{padding-block:var(--s8);border-top:1px solid var(--linha);--esc:1}
@media(max-width:599px){.numeros{--esc:.78}}
.numeros>.container{width:100%}
.numeros__grade{display:grid;gap:var(--s6) clamp(32px,5vw,96px);grid-template-areas:"cab" "cartoes" "marcas"}
@media(min-width:960px){.numeros__grade{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"cartoes cab" "cartoes marcas";row-gap:var(--s7);align-items:center}}
.numeros__cab{grid-area:cab;display:grid;justify-items:start;gap:var(--s4)}
@media(min-width:960px){.numeros__cab{align-self:end}}
.numeros h2{max-width:19ch;font:500 clamp(1.875rem,1rem + 2.4vw,3.5rem)/1.08 var(--serif);letter-spacing:-.02em;text-wrap:balance}
.numeros h2 em{font-style:italic;background:linear-gradient(transparent 86%,var(--ouro) 86% 93%,transparent 93%)}
.numeros__cartoes{grid-area:cartoes;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.4vw,20px)}
.numeros__cartoes>li:last-child:nth-child(odd){grid-column:1 / -1}
.numero{position:relative;display:grid;align-content:center;justify-items:center;gap:var(--s2);min-height:clamp(150px,17vw,210px);padding:var(--s5) var(--s3);text-align:center;border:1px solid var(--linha);border-radius:var(--r-card);background:radial-gradient(70% 90% at 50% 0%,var(--ouro-tint),#fff 74%)}
.numero::before{content:"";position:absolute;top:-1px;left:50%;width:44px;height:2px;translate:-50% 0;border-radius:2px;background:var(--ouro)}
.numero__valor{margin:0;font:600 clamp(2.25rem,1.3rem + 2.6vw,3.5rem)/1 var(--sans);letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.numero__rotulo{margin:0;max-width:22ch;min-height:2.8em;font-size:15px;line-height:1.4;color:var(--suave)}
/* balão que leva a outra parte da página: o link do rótulo se estica pelo balão inteiro */
.numero__rotulo a{color:inherit;text-decoration:underline;text-decoration-color:var(--ouro);text-underline-offset:3px}
.numero--link a::after{content:"";position:absolute;inset:0;border-radius:var(--r-card)}
@media(hover:hover){.numero--link:hover{border-color:var(--ouro)}}
.numeros__marcas{grid-area:marcas;min-width:0}
.numeros__sub{display:flex;align-items:center;gap:var(--s4);margin:0;font:600 15px/1.3 var(--sans);color:var(--ink)}
.numeros__sub::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--linha),transparent)}
.marcas__faixa{margin-top:var(--s4)}
.marcas__lista{list-style:none;margin:0;padding:0;gap:0;animation-duration:80s}
@media(max-width:599px){.marcas__lista{animation-duration:60s}}
.marca{display:flex;align-items:center;padding-inline:clamp(24px,3.2vw,48px)}
.marca img{display:block;height:calc(var(--h) * var(--esc));width:auto;filter:grayscale(1);opacity:.72;transition:filter var(--t-medio) var(--ease),opacity var(--t-medio) var(--ease)}
@media(hover:hover){.marca:hover img{filter:none;opacity:1}}
.marcas__nota{margin:var(--s4) 0 0;font-size:12px;line-height:1.5;color:var(--suave)}
@media(prefers-reduced-motion:reduce){
  /* sem movimento: uma fileira estática com as marcas do primeiro conjunto */
  .marcas__lista{justify-content:flex-start;flex-wrap:wrap;row-gap:var(--s4);animation:none}
  .marca{padding-inline:var(--s5)}
  .marca img{transition:none}
}
/* celular: as marcas não correm, ficam paradas e quebram em linhas (só o primeiro conjunto; a cópia é escondida no movimento.css) */
@media(max-width:899px){
  .marquee .marcas__lista{width:auto;justify-content:flex-start;flex-wrap:wrap;row-gap:var(--s4)}
  .marquee .marca{padding-inline:var(--s4)}
}