/* Cardápio Dog King — estética do cardápio impresso (frente e verso).
   Layout: faixas rasgadas por categoria, cartões quadrados com cabeçalho colorido. */
@font-face { font-family: 'Montserrat'; font-weight: 300; font-display: swap; src: url(../fonts/montserrat-latin-300-normal.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 400; font-display: swap; src: url(../fonts/montserrat-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 500; font-display: swap; src: url(../fonts/montserrat-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 600; font-display: swap; src: url(../fonts/montserrat-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 700; font-display: swap; src: url(../fonts/montserrat-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 800; font-display: swap; src: url(../fonts/montserrat-latin-800-normal.woff2) format('woff2'); }
@font-face { font-family: 'Montserrat'; font-weight: 900; font-display: swap; src: url(../fonts/montserrat-latin-900-normal.woff2) format('woff2'); }

:root {
  /* cores tiradas do cardápio impresso */
  --vinho: #3b1314;        /* Campeões de Venda */
  --marrom: #7a2f1c;       /* Clássicos (cartões) */
  --marrom-faixa: #822d18; /* Clássicos (faixa) */
  --verde: #70a55b;        /* Lanche Vegetariano */
  --grafite: #525952;      /* Exclusivos e Adicionais */
  --cinza: #5f625d;        /* Batatas e Combos */
  --bege: #dfd9c5;         /* fundo dos cartões (frente) */
  --bege-verso: #d8d1b6;   /* fundo dos cartões (verso) */
  --papel: #f0f2f1;        /* fundo da página */
  --azul: #084b93;         /* Bebidas e Pudim */
  --amarelo: #ffc22e;
  --laranja: #f68021;
  --vermelho: #ff2d16;     /* preço do combo */
  --vermelho-verso: #d42a26;
  --preco-lanche: #ff2d16; /* preço do lanche (vermelho, pedido do cliente) */
  --tinta: #141414;
  --texto: #2e2e2e;
  --branco: #ffffff;
  --f: 'Montserrat', 'Arial Black', 'Helvetica Neue', Arial, sans-serif;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  font-family: var(--f);
  color: var(--texto);
  background-color: var(--papel);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.37 0 0 0 0 0.36 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  line-height: 1.4;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 2px; }

.wrap {
  max-width: 1320px; margin: 0 auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}

/* ---------- borda de papel rasgado ---------- */
.rasgado { position: relative; }
.rasgado::before, .rasgado::after {
  content: ""; position: absolute; left: 0; right: 0; height: 14px;
  background: inherit; background-image: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 2.5 L12.5 6.4 L22.2 6.1 L28.5 1.7 L35.4 9.3 L42.7 7.3 L58.2 5.0 L73.9 9.6 L82.8 2.2 L91.9 0.5 L103.7 4.7 L115.2 1.6 L123.3 5.3 L132.4 5.5 L141.4 8.0 L149.8 6.3 L164.6 3.9 L180.4 5.2 L194.0 5.9 L200.4 8.6 L212.1 0.9 L225.0 6.8 L235.6 2.8 L246.3 1.6 L259.4 10.9 L273.6 4.9 L286.3 5.6 L293.9 1.6 L307.6 3.5 L317.5 0.2 L328.0 9.8 L342.2 0.8 L352.4 9.8 L368.0 2.8 L376.3 5.8 L388.2 1.0 L398.4 6.7 L413.9 6.2 L426.1 1.5 L441.1 9.7 L455.0 5.0 L462.1 1.6 L468.7 2.6 L478.1 1.0 L485.7 4.6 L491.9 1.8 L499.4 4.5 L509.0 9.5 L525.0 5.8 L531.8 4.4 L540.5 0.5 L546.7 1.6 L554.2 1.3 L565.5 2.6 L578.4 4.7 L586.1 6.3 L599.9 3.2 L614.0 2.6 L628.1 2.2 L636.3 4.6 L642.6 3.8 L651.2 10.6 L661.7 3.0 L677.2 3.2 L685.5 3.0 L697.7 2.5 L708.5 9.0 L715.4 10.1 L729.2 5.8 L737.0 4.3 L751.0 1.2 L761.0 2.2 L768.7 2.5 L783.8 0.4 L798.0 2.0 L807.5 2.3 L813.7 1.9 L824.9 1.3 L839.6 0.6 L848.2 3.4 L860.0 5.2 L867.3 1.1 L877.9 10.0 L888.1 1.5 L899.4 1.2 L909.8 1.0 L923.8 5.7 L937.1 4.3 L948.3 8.8 L955.3 3.5 L964.1 6.1 L975.7 10.1 L986.2 6.1 L997.3 5.5 L1000 4.868217908192509 L1000 14 Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 2.5 L12.5 6.4 L22.2 6.1 L28.5 1.7 L35.4 9.3 L42.7 7.3 L58.2 5.0 L73.9 9.6 L82.8 2.2 L91.9 0.5 L103.7 4.7 L115.2 1.6 L123.3 5.3 L132.4 5.5 L141.4 8.0 L149.8 6.3 L164.6 3.9 L180.4 5.2 L194.0 5.9 L200.4 8.6 L212.1 0.9 L225.0 6.8 L235.6 2.8 L246.3 1.6 L259.4 10.9 L273.6 4.9 L286.3 5.6 L293.9 1.6 L307.6 3.5 L317.5 0.2 L328.0 9.8 L342.2 0.8 L352.4 9.8 L368.0 2.8 L376.3 5.8 L388.2 1.0 L398.4 6.7 L413.9 6.2 L426.1 1.5 L441.1 9.7 L455.0 5.0 L462.1 1.6 L468.7 2.6 L478.1 1.0 L485.7 4.6 L491.9 1.8 L499.4 4.5 L509.0 9.5 L525.0 5.8 L531.8 4.4 L540.5 0.5 L546.7 1.6 L554.2 1.3 L565.5 2.6 L578.4 4.7 L586.1 6.3 L599.9 3.2 L614.0 2.6 L628.1 2.2 L636.3 4.6 L642.6 3.8 L651.2 10.6 L661.7 3.0 L677.2 3.2 L685.5 3.0 L697.7 2.5 L708.5 9.0 L715.4 10.1 L729.2 5.8 L737.0 4.3 L751.0 1.2 L761.0 2.2 L768.7 2.5 L783.8 0.4 L798.0 2.0 L807.5 2.3 L813.7 1.9 L824.9 1.3 L839.6 0.6 L848.2 3.4 L860.0 5.2 L867.3 1.1 L877.9 10.0 L888.1 1.5 L899.4 1.2 L909.8 1.0 L923.8 5.7 L937.1 4.3 L948.3 8.8 L955.3 3.5 L964.1 6.1 L975.7 10.1 L986.2 6.1 L997.3 5.5 L1000 4.868217908192509 L1000 14 Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.rasgado::before { top: -13px; }
.rasgado::after { bottom: -13px; transform: scaleY(-1);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 2.1 L14.8 0.8 L26.4 2.5 L33.7 5.4 L40.5 1.7 L53.2 10.0 L60.7 7.6 L68.1 2.9 L76.3 1.2 L87.2 2.5 L94.8 6.2 L104.2 4.2 L117.4 6.5 L127.8 4.3 L140.1 1.6 L155.9 10.7 L163.0 1.4 L176.8 2.3 L187.0 2.5 L195.6 10.2 L207.3 1.9 L213.8 5.3 L220.6 1.9 L234.6 9.6 L241.3 1.4 L250.6 10.3 L259.3 6.3 L267.7 2.6 L274.2 4.1 L283.3 3.9 L294.3 4.5 L300.4 1.2 L313.8 2.9 L324.5 0.3 L338.7 6.0 L353.1 6.1 L365.9 1.0 L380.3 7.4 L390.3 1.5 L397.6 8.4 L406.2 1.8 L420.6 2.0 L429.4 3.9 L440.0 5.5 L448.6 2.9 L460.1 10.7 L469.2 1.0 L479.0 6.0 L487.0 1.0 L495.6 5.0 L502.1 4.0 L510.4 6.3 L523.9 8.2 L538.7 4.3 L554.5 8.2 L567.0 9.4 L581.9 8.3 L596.0 6.2 L607.1 2.4 L621.3 9.9 L634.1 3.3 L640.5 4.6 L647.5 1.7 L659.8 7.8 L670.7 9.0 L684.2 6.4 L696.8 8.4 L705.3 3.7 L718.6 8.4 L734.3 4.8 L745.1 8.7 L757.3 1.8 L764.8 8.4 L773.8 1.1 L780.4 7.7 L793.3 3.9 L804.5 5.7 L811.7 0.6 L827.5 0.1 L838.1 2.9 L848.6 3.1 L864.0 6.8 L871.4 10.5 L878.8 1.5 L893.6 3.3 L908.6 1.2 L914.6 5.5 L923.7 4.4 L932.8 0.0 L946.3 0.4 L961.6 10.0 L970.5 4.9 L986.5 4.6 L996.8 1.5 L1000 7.008055969863154 L1000 14 Z'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 2.1 L14.8 0.8 L26.4 2.5 L33.7 5.4 L40.5 1.7 L53.2 10.0 L60.7 7.6 L68.1 2.9 L76.3 1.2 L87.2 2.5 L94.8 6.2 L104.2 4.2 L117.4 6.5 L127.8 4.3 L140.1 1.6 L155.9 10.7 L163.0 1.4 L176.8 2.3 L187.0 2.5 L195.6 10.2 L207.3 1.9 L213.8 5.3 L220.6 1.9 L234.6 9.6 L241.3 1.4 L250.6 10.3 L259.3 6.3 L267.7 2.6 L274.2 4.1 L283.3 3.9 L294.3 4.5 L300.4 1.2 L313.8 2.9 L324.5 0.3 L338.7 6.0 L353.1 6.1 L365.9 1.0 L380.3 7.4 L390.3 1.5 L397.6 8.4 L406.2 1.8 L420.6 2.0 L429.4 3.9 L440.0 5.5 L448.6 2.9 L460.1 10.7 L469.2 1.0 L479.0 6.0 L487.0 1.0 L495.6 5.0 L502.1 4.0 L510.4 6.3 L523.9 8.2 L538.7 4.3 L554.5 8.2 L567.0 9.4 L581.9 8.3 L596.0 6.2 L607.1 2.4 L621.3 9.9 L634.1 3.3 L640.5 4.6 L647.5 1.7 L659.8 7.8 L670.7 9.0 L684.2 6.4 L696.8 8.4 L705.3 3.7 L718.6 8.4 L734.3 4.8 L745.1 8.7 L757.3 1.8 L764.8 8.4 L773.8 1.1 L780.4 7.7 L793.3 3.9 L804.5 5.7 L811.7 0.6 L827.5 0.1 L838.1 2.9 L848.6 3.1 L864.0 6.8 L871.4 10.5 L878.8 1.5 L893.6 3.3 L908.6 1.2 L914.6 5.5 L923.7 4.4 L932.8 0.0 L946.3 0.4 L961.6 10.0 L970.5 4.9 L986.5 4.6 L996.8 1.5 L1000 7.008055969863154 L1000 14 Z'/%3E%3C/svg%3E"); }
.so-baixo::before { display: none; }
.so-cima::after { display: none; }

/* ---------- topo ---------- */
.topo { background: var(--azul); color: var(--branco); padding-block: 22px 26px; z-index: 2; }
.topo .wrap { display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap; text-align: center; }
.topo .logo { width: 132px; height: auto; filter: drop-shadow(0 3px 6px rgba(0,0,0,.25)); }
.topo .marca { display: grid; gap: 4px; justify-items: center; }
.topo h1 { margin: 0; font-weight: 900; font-size: clamp(30px, 8vw, 46px); letter-spacing: .01em; line-height: 1; text-transform: uppercase; }
.topo .bairro { font-weight: 800; font-size: 14px; letter-spacing: .28em; text-transform: uppercase; color: var(--amarelo); }
.topo .redes { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin-top: 6px; }

.rede { display: inline-flex; align-items: center; gap: 7px; font-weight: 500; font-size: 13px; text-decoration: none; letter-spacing: .02em; }
.rede svg { width: 20px; height: 20px; flex: none; }

/* ---------- navegação ---------- */
.nav {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20;
  background: rgba(240, 242, 241, .96);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  box-shadow: 0 2px 10px rgba(20, 20, 20, .12);
}
.nav .wrap { display: flex; gap: 8px; overflow-x: auto; padding-block: 10px; scrollbar-width: none; }
.nav .wrap::-webkit-scrollbar { display: none; }
.nav a {
  flex: none; text-decoration: none; font-weight: 800; font-size: 12.5px; text-transform: uppercase;
  letter-spacing: .04em; padding: 8px 13px; color: var(--branco); background: var(--c, var(--grafite));
}
.nav a[aria-current="true"] { box-shadow: inset 0 -4px 0 var(--amarelo); }

/* ---------- faixas de seção ---------- */
.secao { padding-block: 0 46px; scroll-margin-top: 64px; }
.faixa { background: var(--c); color: var(--branco); padding-block: 22px; margin-block: 30px 30px; text-align: center; }
.faixa h2 { margin: 0; font-weight: 900; text-transform: uppercase; font-size: clamp(26px, 6.4vw, 48px); letter-spacing: .015em; line-height: 1.05; text-wrap: balance; }
.faixa h2 .vida { display: inline-block; height: 1.55em; width: auto; vertical-align: -0.42em; margin-left: .05em; }

.t-vinho { --c: var(--vinho); }
.t-marrom { --c: var(--marrom); }
.t-marrom-faixa { --c: var(--marrom-faixa); }
.t-verde { --c: var(--verde); }
.t-grafite { --c: var(--grafite); }
.t-cinza { --c: var(--cinza); }
.t-azul { --c: var(--azul); }

/* ---------- grade de cartões ---------- */
.grade { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.grade > .card { flex: 1 1 280px; max-width: 322px; min-width: 0; }
@media (max-width: 640px) { .grade > .card { max-width: none; } }
.grade[data-n="5"], .grade[data-n="6"] { max-width: 1000px; margin-inline: auto; }

.card { background: var(--bege); display: flex; flex-direction: column; box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.card-h { margin: 0; background: var(--c); color: var(--branco); text-align: center; padding: 16px 12px 15px; text-transform: uppercase; font-size: 20px; line-height: 1.1; }
.card-h .pre { font-weight: 400; }
.card-h strong { font-weight: 800; }
.card-foto { width: 100%; height: auto; aspect-ratio: 465 / 285; object-fit: contain; object-position: center top; }
.card-b { display: grid; gap: 10px; padding: 6px 10px 18px; flex: 1; align-content: start; }

.precos { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 14px; }
.preco { display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.preco .rot { font-weight: 900; font-size: 11px; color: var(--tinta); letter-spacing: .02em; }
.preco .val { font-weight: 700; font-size: 17.5px; font-variant-numeric: tabular-nums; }
.preco.lanche .val { color: var(--preco-lanche); }
.preco.combo .val { color: var(--vermelho); }
.desc { margin: 0; text-align: center; font-size: 14px; font-weight: 400; color: var(--texto); text-wrap: balance; }

/* ---------- batatas e combos (verso) ---------- */
.card.verso { background: var(--bege-verso); }
.card.verso .card-h { padding: 12px 12px 13px; }
.card.verso .card-h small { display: block; font-size: 15px; font-weight: 400; letter-spacing: .03em; }
.card.verso .card-h strong { display: block; font-size: 22px; font-weight: 700; white-space: nowrap; }
.foto-box { position: relative; }

.porcao { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; }
.porcao .porcao-t { margin: 0 0 2px; font-weight: 900; font-size: 21px; color: var(--tinta); text-transform: uppercase; }
.porcao ul { margin: 0; padding: 0; list-style: none; font-weight: 500; font-size: 14.5px; color: #262626; line-height: 1.3; }
.preco-grande { color: var(--vermelho-verso); font-weight: 800; font-size: 31px; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums; }
.preco-grande small { font-size: .62em; font-weight: 800; margin-right: 5px; }

.combo-b { text-align: center; justify-items: center; }
.combo-b ul { margin: 0; padding: 0; list-style: none; font-weight: 500; font-size: 15px; color: #262626; line-height: 1.35; }
.combo-b .obs { margin: 0; font-size: 12.5px; color: #4a4a4a; max-width: 34ch; }

/* selo vermelho da batata frita */
.selo {
  position: absolute; left: 7%; top: 7%; width: 146px; aspect-ratio: 1; border-radius: 50%;
  background: #e2392f; color: var(--branco); transform: rotate(-12deg);
  display: grid; place-content: center; justify-items: center; text-align: center; gap: 1px;
  text-transform: uppercase; font-weight: 800; box-shadow: 0 4px 10px rgba(0,0,0,.18);
}
.selo::before { content: ""; position: absolute; inset: 6px; border: 1.5px solid rgba(255,255,255,.9); border-radius: 50%; }
.selo .por { font-size: 10.5px; }
.selo .v { font-size: 23px; line-height: 1.05; white-space: nowrap; }
.selo .t { font-size: 8.6px; line-height: 1.2; max-width: 104px; }

/* ---------- adicionais ---------- */
.adicionais { background: var(--grafite); color: var(--branco); padding-block: 28px 30px; margin-block: 30px 46px; }
.adicionais .wrap { display: grid; grid-template-columns: auto 1fr; gap: 18px 40px; align-items: center; }
.adicionais h2 { margin: 0; color: var(--amarelo); font-weight: 900; font-size: clamp(30px, 6vw, 44px); text-transform: uppercase; letter-spacing: .01em; }
.lista-pontos { list-style: none; margin: 0; padding: 0; columns: 3 230px; column-gap: 34px; }
.lista-pontos li { display: flex; align-items: baseline; gap: 6px; break-inside: avoid; padding-block: 3px; font-weight: 800; font-size: 13.5px; text-transform: uppercase; letter-spacing: .02em; }
.lista-pontos li .pontos { flex: 1; border-bottom: 2px dotted currentColor; opacity: .55; transform: translateY(-4px); min-width: 12px; }
.lista-pontos li .p { color: var(--amarelo); font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lista-pontos li .p small { font-size: .75em; margin-right: 3px; }

/* ---------- bebidas e pudim ---------- */
.azul { background: var(--azul); color: var(--branco); padding-block: 36px 34px; margin-top: 30px; }
.azul .wrap { display: grid; grid-template-columns: 1.25fr 1fr; gap: 36px; align-items: center; }
.bebidas { display: grid; grid-template-columns: 210px 1fr; gap: 6px 22px; align-items: end; min-width: 0; }
.bebidas .foto { grid-row: span 2; width: 210px; }
.bebidas .lettering { width: min(250px, 70%); margin-bottom: 4px; }
.bebidas .lista-pontos { columns: 1; }
.bebidas .lista-pontos li { font-weight: 900; font-size: 15.5px; color: var(--branco); }
.bebidas .lista-pontos li .p { color: var(--laranja); font-weight: 900; }
.pudim { display: grid; grid-template-columns: 180px 1fr; gap: 10px 22px; align-items: center; }
.pudim img.foto { width: 180px; border-radius: 50%; }
.pudim .nome { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.pudim .nome b { font-weight: 900; font-size: 46px; line-height: 1; letter-spacing: .02em; }
.pudim .nome img { width: 150px; }
.pudim .valor { color: var(--amarelo); font-weight: 800; font-size: 46px; line-height: 1; margin-top: 10px; font-variant-numeric: tabular-nums; }
.pudim .un { font-weight: 800; font-size: 14px; letter-spacing: .08em; text-transform: uppercase; margin-top: 4px; }

.rodape { background: var(--azul); color: var(--branco); padding-block: 8px 34px; }
.rodape .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid rgba(255,255,255,.18); padding-top: 22px; }
.rodape .redes { display: grid; gap: 8px; }
.rodape .rede { font-size: 17px; }
.rodape .rede svg { width: 26px; height: 26px; }
.rodape .logo { width: 104px; }

@media (max-width: 860px) {
  .azul .wrap { grid-template-columns: 1fr; }
  .adicionais .wrap { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .bebidas { grid-template-columns: 1fr; justify-items: center; }
  .bebidas .foto { grid-row: auto; width: 180px; order: 2; }
  .bebidas .lettering { order: 1; }
  .bebidas .lista-pontos { order: 3; width: 100%; }
  .bebidas .lista-pontos li { font-size: 13px; }
  .pudim { grid-template-columns: 120px 1fr; }
  .pudim img.foto { width: 120px; }
  .pudim .nome b { font-size: 34px; }
  .pudim .nome img { width: 110px; }
  .pudim .valor { font-size: 38px; }
  .card-h { font-size: 19px; }
}


/* ===== pedidos do cliente (31/10) ===== */

/* 5) a palavra KIDS com letras coloridas chamativas */
.kids-tag {
  display: inline-block;
  font-weight: 900;
  letter-spacing: .04em;
  font-size: 1.08em;
  background: linear-gradient(92deg,#ff2d16 0%,#ff8a00 18%,#ffd400 36%,#41c04a 54%,#0aa6e0 72%,#7b4dff 88%,#ff2d9b 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  -webkit-text-stroke: .7px rgba(0,0,0,.55);
  paint-order: stroke fill;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.7));
}
.card .kids-tag { animation: kidsPula 2.4s ease-in-out infinite; }
@keyframes kidsPula {
  0%, 92%, 100% { transform: translateY(0) rotate(0deg); }
  94% { transform: translateY(-3px) rotate(-2deg); }
  96% { transform: translateY(-1px) rotate(2deg); }
}
@media (prefers-reduced-motion: reduce) { .card .kids-tag { animation: none; } }

/* 6) banner que ocupa o espaço sobrando na linha dos combos */
.card.promo-combos {
  background: #d42a26;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 26px 18px;
  border-radius: 14px;
  gap: 10px;
  box-shadow: 0 6px 0 rgba(0,0,0,.18), 0 0 0 4px #ffc22e inset;
  position: relative;
  overflow: hidden;
  min-height: 240px;
}
.card.promo-combos::before {
  content: "";
  position: absolute; inset: -40%;
  background: repeating-linear-gradient(45deg, rgba(255,255,255,.14) 0 12px, transparent 12px 24px);
  animation: promoGira 14s linear infinite;
}
@keyframes promoGira { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .card.promo-combos::before { animation: none; } }
.promo-combos .pc-topo {
  font-weight: 900; font-size: 13px; letter-spacing: .18em;
  background: #ffc22e; color: #3b1314; padding: 5px 12px; border-radius: 999px;
  position: relative; z-index: 1;
}
.promo-combos .pc-titulo {
  font-weight: 900; font-size: 30px; line-height: .95; letter-spacing: -.01em;
  text-transform: uppercase; position: relative; z-index: 1;
  text-shadow: 0 3px 0 rgba(0,0,0,.25);
}
.promo-combos .pc-titulo em {
  font-style: normal; display: block; color: #ffc22e; font-size: 1.12em;
}
.promo-combos .pc-sub { font-weight: 700; font-size: 13.5px; line-height: 1.35; position: relative; z-index: 1; opacity: .97; }
@media (max-width: 640px) {
  .card.promo-combos { min-height: 180px; padding: 20px 14px; }
  .promo-combos .pc-titulo { font-size: 24px; }
}


/* 6b) os 4 cartões da linha dos combos caberem juntos (banner no espaço que sobra) */
#combos .grade { max-width: 1260px; margin-inline: auto; }
#combos .grade > .card { flex: 1 1 270px; max-width: 300px; }
@media (max-width: 860px) {
  #combos .grade > .card { flex: 1 1 260px; max-width: none; }
}