/* ==========================================================================
   TH MODAS SARZEDO — Link na bio
   Conceito: "VITRINE DE CARTAZ" — o brasão hexagonal na parede da loja.
   Geometria chanfrada derivada do hexágono da logo; bisel cromado derivado
   do contorno duplo do lettering; preço como âncora visual, igual aos posts.
   ========================================================================== */

/* ------------------------------- TOKENS ---------------------------------- */
:root{
  /* cores amostradas da logo e dos cartazes do feed */
  --red-900:#6E0308;
  --red-700:#A5060C;
  --red-600:#C20E12;   /* vermelho do brasão */
  --red-500:#E01B14;   /* vermelho vivo dos cartazes */
  --gold:#C9A24B;
  --gold-lt:#E8C06A;

  --bg:#08080A;
  --bg-2:#0D0D10;
  --surface:#141418;
  --surface-2:#1B1B21;

  --chrome-1:#FFFFFF;
  --chrome-2:#C9CED6;
  --chrome-3:#7E858F;

  --text:#F2F2F4;
  --muted:#93959D;
  --border:rgba(255,255,255,.09);
  --border-2:rgba(255,255,255,.16);

  /* geometria: chanfro do hexágono, nunca border-radius */
  --ch:14px;
  --ch-sm:9px;
  --cut:polygon(var(--ch) 0, 100% 0, 100% calc(100% - var(--ch)), calc(100% - var(--ch)) 100%, 0 100%, 0 var(--ch));
  --cut-sm:polygon(var(--ch-sm) 0, 100% 0, 100% calc(100% - var(--ch-sm)), calc(100% - var(--ch-sm)) 100%, 0 100%, 0 var(--ch-sm));
  --cut-all:polygon(var(--ch-sm) 0, calc(100% - var(--ch-sm)) 0, 100% var(--ch-sm), 100% calc(100% - var(--ch-sm)), calc(100% - var(--ch-sm)) 100%, var(--ch-sm) 100%, 0 calc(100% - var(--ch-sm)), 0 var(--ch-sm));

  /* espaçamento */
  --s1:6px; --s2:10px; --s3:16px; --s4:22px; --s5:32px; --s6:48px; --s7:68px;

  --wrap:640px;
  --ease:cubic-bezier(.2,.9,.25,1);

  --bevel:linear-gradient(150deg,var(--chrome-1) 0%,var(--chrome-3) 26%,#25252b 52%,var(--red-700) 82%,var(--red-500) 100%);
}

*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;text-size-adjust:100%;
  overflow-x:hidden;                 /* Android/Chrome: trava a rolagem lateral */
  scroll-behavior:smooth;
}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.55;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;   /* iOS: sem flash azul no toque */
}
/* toque imediato no Android (sem espera de duplo toque) */
a,button{touch-action:manipulation}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,p,figure,table{margin:0}
button{font:inherit}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;
  padding-left:calc(20px + env(safe-area-inset-left));
  padding-right:calc(20px + env(safe-area-inset-right))}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.skip{
  position:absolute;left:-9999px;top:0;z-index:99;
  background:var(--red-600);color:#fff;padding:12px 18px;font-weight:700;
}
.skip:focus{left:12px;top:12px}

:focus-visible{outline:2px solid var(--chrome-2);outline-offset:3px}

/* ----------------------------- TIPOGRAFIA -------------------------------- */
/* Archivo variável (wdth + itálico real) reproduz o lettering condensado
   itálico dos cartazes do feed. Barlow assina a leitura no mobile. */
.eyebrow{
  font-weight:700;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--chrome-3);margin-bottom:var(--s3);
}
.hero__h1,.secao__h2,.cartaz__nome,.preco,.feature__txt h2,.categorias__n{
  font-family:"Archivo","Roboto Condensed","Arial Narrow",Impact,sans-serif;
  font-style:italic;
  text-transform:uppercase;
}

/* -------------------------------- HERO ----------------------------------- */
.hero{
  position:relative;overflow:hidden;
  padding:calc(env(safe-area-inset-top) + 32px) 0 0;
  background:
    radial-gradient(120% 70% at 50% -18%, rgba(194,14,18,.42) 0%, rgba(110,3,8,.14) 42%, transparent 70%),
    linear-gradient(#0B0B0E,var(--bg));
}
.hero__glow{
  position:absolute;inset:auto 0 -40% 0;height:70%;
  background:radial-gradient(60% 100% at 50% 100%, rgba(224,27,20,.16), transparent 70%);
  pointer-events:none;
}
/* riscos diagonais: mesma textura raspada do "TH" da logo */
.hero__scratch{
  position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(115deg,transparent 0 26px,rgba(255,255,255,.028) 26px 27px);
  -webkit-mask-image:linear-gradient(#000 30%,transparent 88%);
  mask-image:linear-gradient(#000 30%,transparent 88%);
}
/* mascote da própria logo, em screen para o fundo preto sumir */
.hero__mascote{
  position:absolute;right:-30px;bottom:0;width:min(155px,37vw);height:auto;
  opacity:.27;mix-blend-mode:screen;pointer-events:none;
  filter:grayscale(1) contrast(1.3) brightness(.62);
}
.hero__in{position:relative;z-index:2;padding-bottom:var(--s6);text-align:left}

/* brasão: placa hexagonal cromada (do badge da logo) com o selo circular dentro */
:root{--hex:polygon(50% 0,93.3% 25%,93.3% 75%,50% 100%,6.7% 75%,6.7% 25%)}
.brasao{
  position:relative;width:106px;height:106px;margin-bottom:var(--s3);
  display:grid;place-items:center;
}
.brasao__ring{
  position:absolute;inset:0;
  background:conic-gradient(from 200deg,var(--chrome-1),var(--red-500) 20%,#33333b 40%,var(--chrome-2) 58%,var(--red-600) 80%,var(--chrome-1));
  clip-path:var(--hex);
  filter:drop-shadow(0 0 16px rgba(224,27,20,.4));
}
.brasao__ring::after{
  content:"";position:absolute;inset:3px;background:#08080A;clip-path:var(--hex);
}
.brasao img{
  position:relative;z-index:1;
  width:78%;height:78%;object-fit:cover;border-radius:50%;
  background:#000;
}

.hero__h1{
  font-variation-settings:"wdth" 64,"wght" 900;
  font-size:clamp(2.9rem,15.5vw,4.6rem);
  line-height:.86;letter-spacing:-.015em;
  margin-bottom:var(--s3);
}
.hero__h1 .line{display:block;overflow:hidden}
.hero__h1 .line>span{display:block}
.hero__h1 em{
  font-style:italic;
  background:linear-gradient(180deg,#FF4A3D,var(--red-600) 55%,var(--red-900));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 26px rgba(224,27,20,.28);
}
.hero__sub{color:var(--muted);font-size:1.02rem;max-width:34ch;margin-bottom:var(--s4);text-wrap:pretty}

/* selo de status calculado do horário real da loja */
.status{
  display:inline-flex;align-items:center;gap:9px;
  padding:8px 14px 8px 12px;margin-bottom:var(--s4);
  background:var(--surface-2);border:1px solid var(--border-2);
  clip-path:var(--cut-all);
  font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.status__dot{
  width:9px;height:9px;background:var(--chrome-3);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);flex:none;
}
.status.is-aberto .status__dot{background:#4ADE80;box-shadow:0 0 10px rgba(74,222,128,.8);animation:pulso 2.2s infinite}
.status.is-fechado .status__dot{background:var(--red-500)}
.status.is-aberto{border-color:rgba(74,222,128,.35)}
@keyframes pulso{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}

.hero__acoes{display:grid;gap:12px}

/* ------------------------------ BOTÕES ----------------------------------- */
.btn{
  position:relative;display:flex;align-items:center;gap:12px;
  min-height:62px;padding:12px 16px;
  clip-path:var(--cut-sm);
  transition:transform .16s var(--ease),box-shadow .2s var(--ease),background .2s;
  will-change:transform;
}
.btn__txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.btn__txt strong{
  font-weight:800;font-size:.92rem;letter-spacing:.075em;line-height:1.1;
}
.btn__txt small{font-size:.78rem;line-height:1.25;opacity:.72;font-weight:500}
.btn .ico{width:22px;height:22px;flex:none}
.btn .ico--seta{width:19px;height:19px;opacity:.7;margin-left:auto}

.btn--primary{
  background:linear-gradient(150deg,var(--red-500),var(--red-600) 46%,var(--red-900));
  color:#fff;
  box-shadow:0 10px 26px -12px rgba(224,27,20,.9), inset 0 1px 0 rgba(255,255,255,.28);
}
.btn--primary::after{
  content:"";position:absolute;inset:0;clip-path:var(--cut-sm);
  border:1px solid rgba(255,255,255,.28);pointer-events:none;
}
.btn--primary:active{transform:translateY(2px);box-shadow:0 4px 12px -8px rgba(224,27,20,.9)}

.btn--ghost{
  background:var(--surface);color:var(--text);
  box-shadow:inset 0 0 0 1px var(--border-2);
}
.btn--ghost .ico{color:var(--red-500)}
.btn--ghost:active{transform:translateY(2px);background:var(--surface-2)}

.btn--compact{min-height:54px;padding:10px 14px}
.btn--compact .btn__txt strong{font-size:.85rem}
.btn--compact .btn__txt small{font-size:.7rem}

/* ---------------------------- FAIXA HAZARD -------------------------------- */
/* derivada das faixas diagonais vermelhas dos cartazes — estática, é divisor */
.hazard{
  height:9px;
  background:repeating-linear-gradient(115deg,var(--red-600) 0 13px,#0B0B0E 13px 26px);
  opacity:.85;
}

/* ------------------------------ SELOS ------------------------------------- */
.selos{background:var(--bg-2);padding:var(--s4) 0}
.selos__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.selo{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:2px}
.selo .ico{width:20px;height:20px;color:var(--red-500)}
.selo p{display:flex;flex-direction:column;line-height:1.2}
.selo strong{font-size:.86rem;font-weight:700}
.selo span{font-size:.79rem;color:var(--muted)}

/* ------------------------------ SEÇÕES ------------------------------------ */
.secao{padding:var(--s7) 0}
.secao--novidade{padding:0 0 var(--s5)}
.rotulo{display:flex;align-items:center;gap:12px;margin-bottom:var(--s3)}
.rotulo span{
  font-size:.68rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;
  color:var(--red-500);white-space:nowrap;
}
.rotulo i{height:1px;flex:1;background:linear-gradient(90deg,var(--red-600),transparent)}
.secao__h2{
  font-variation-settings:"wdth" 68,"wght" 800;
  font-size:clamp(2rem,9vw,2.8rem);line-height:.9;letter-spacing:-.01em;
  margin-bottom:var(--s3);
}
.secao__h2--sm{font-size:clamp(1.7rem,7.5vw,2.2rem)}
.secao__h2 em,.feature__txt h2 em{
  font-style:italic;color:var(--red-500);
  text-shadow:0 0 22px rgba(224,27,20,.3);
}
.secao__intro{color:var(--muted);font-size:.95rem;max-width:38ch;margin-bottom:var(--s5)}

/* ------------------------------ CARTAZES ---------------------------------- */
.cartazes{display:grid;gap:16px}
.cartaz{
  padding:1.5px;                      /* espessura do bisel cromado */
  background:var(--bevel);
  clip-path:var(--cut);
}
.cartaz--gold{background:linear-gradient(150deg,var(--gold-lt),var(--chrome-3) 30%,#232329 55%,var(--gold) 100%)}
.cartaz__in{
  background:linear-gradient(175deg,var(--surface),#0F0F13);
  clip-path:var(--cut);
}
.cartaz__foto{
  position:relative;height:168px;overflow:hidden;
  background:radial-gradient(70% 120% at 50% 40%,#1c1c22,#08080A 78%);
}
.cartaz__foto img{
  width:100%;height:100%;object-fit:cover;object-position:center 42%;
  filter:contrast(1.06) saturate(1.05);
}
/* peça alta (calça): mostra o produto inteiro sobre a placa preta, como catálogo */
.cartaz__foto--peca{height:224px}
.cartaz__foto--peca img{object-fit:contain;object-position:center;padding:14px 0 20px}
.cartaz__foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,8,10,.35) 0%,transparent 30%,rgba(8,8,10,.9) 100%);
}
.tag{
  position:absolute;z-index:2;left:0;top:14px;
  padding:6px 14px 6px 12px;
  font-size:.67rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  clip-path:polygon(0 0,100% 0,calc(100% - 9px) 100%,0 100%);
}
.tag--red{background:var(--red-600);color:#fff}
.tag--gold{background:linear-gradient(100deg,var(--gold-lt),var(--gold));color:#1a1200}
.feature .tag{position:static;display:inline-block;margin-bottom:12px}

.cartaz__corpo{padding:var(--s4) var(--s3) var(--s3)}
.cartaz__nome{
  font-variation-settings:"wdth" 72,"wght" 800;
  font-size:1.5rem;line-height:1;margin-bottom:12px;
}
.atributos{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--s4)}
.atributos li{
  font-size:.75rem;font-weight:600;color:var(--chrome-2);
  padding:5px 10px;background:rgba(255,255,255,.05);
  border-left:2px solid var(--red-600);
}
.cartaz__pe{display:grid;gap:14px}

/* preço: o numeral gigante é a âncora visual, igual aos cartazes do feed */
.preco{
  position:relative;display:flex;align-items:flex-end;gap:2px;
  font-variation-settings:"wdth" 62,"wght" 900;
  line-height:.8;color:var(--chrome-1);
  text-shadow:0 3px 0 rgba(0,0,0,.55);
}
.preco__cur{font-size:1.05rem;align-self:flex-start;margin-top:.35em;color:var(--red-500);letter-spacing:.02em}
.preco__int{font-size:3.9rem;letter-spacing:-.03em}
.preco__cent{font-size:1.35rem;margin-bottom:.42em}
.preco__de{
  position:absolute;top:-1.35em;left:0;
  font-family:"Barlow",sans-serif;font-style:normal;font-weight:600;
  font-size:.78rem;letter-spacing:.04em;color:var(--muted);
  text-decoration:line-through;text-decoration-color:var(--red-500);
  text-shadow:none;
}
.preco__pre{
  position:absolute;top:-1.3em;left:0;
  font-family:"Barlow",sans-serif;font-style:normal;font-weight:700;
  font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-lt);
  text-shadow:none;
}
.preco--gold .preco__int{
  background:linear-gradient(180deg,#FFF0C9,var(--gold-lt) 45%,#9A751F);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:none;
}
.preco--gold .preco__cur{color:var(--gold-lt)}

.ressalva{
  margin-top:var(--s4);padding:12px 14px;
  background:rgba(255,255,255,.035);border-left:2px solid var(--chrome-3);
  font-size:.82rem;color:var(--muted);line-height:1.45;
}

/* ---------------------------- BLOCO NOVIDADE ------------------------------ */
.feature{
  background:var(--bevel);padding:1.5px;clip-path:var(--cut);
}
.feature>*{background:linear-gradient(160deg,#17171C,#0C0C0F);clip-path:var(--cut)}
.feature{display:grid}
.feature__foto{height:150px;overflow:hidden;position:relative}
.feature__foto img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
.feature__foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(12,12,15,.95) 100%);
}
.feature__txt{padding:var(--s4) var(--s3) var(--s5)}
.feature__txt h2{
  font-variation-settings:"wdth" 70,"wght" 800;
  font-size:clamp(1.6rem,7vw,2.1rem);line-height:.95;margin-bottom:10px;
}
.feature__txt p{color:var(--muted);font-size:.93rem;margin-bottom:var(--s3)}

.link-seta{
  display:inline-flex;align-items:center;gap:8px;
  font-weight:700;font-size:.82rem;letter-spacing:.05em;
  color:var(--chrome-1);
  border-bottom:1px solid var(--red-600);padding-bottom:3px;
}
.link-seta .ico{width:17px;height:17px;color:var(--red-500);transition:transform .2s var(--ease)}
.link-seta:active .ico{transform:translateX(4px)}

/* ----------------------------- CATEGORIAS --------------------------------- */
.categorias{display:grid;gap:8px}
.categorias a{
  display:flex;align-items:center;gap:14px;
  padding:15px 16px;background:var(--surface);
  clip-path:var(--cut-sm);
  box-shadow:inset 0 0 0 1px var(--border);
  transition:background .18s,transform .16s var(--ease);
}
.categorias a:active{transform:translateX(4px);background:var(--surface-2)}
.categorias__n{
  font-variation-settings:"wdth" 62,"wght" 900;
  font-size:1.5rem;line-height:1;color:transparent;
  -webkit-text-stroke:1px var(--chrome-3);
  flex:none;width:38px;
}
.categorias__txt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.categorias__txt strong{font-size:.95rem;font-weight:700}
.categorias__txt small{font-size:.81rem;color:var(--muted);line-height:1.3}
.categorias .ico{width:18px;height:18px;color:var(--red-500);flex:none}
.categorias li:nth-child(odd) a{background:var(--bg-2)}

/* ----------------------------- CONFIANÇA ---------------------------------- */
.secao--confianca{background:var(--bg-2)}
.confianca{display:grid;gap:var(--s5)}
/* tira do feed: os próprios cartazes fixados do perfil, como prova de atividade */
.feed{
  display:block;background:var(--bevel);padding:1.5px;clip-path:var(--cut);
  transition:transform .18s var(--ease);
}
.feed:active{transform:translateY(2px)}
.feed__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;
  background:var(--bevel);
}
.feed__grid img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
.feed__pe{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:13px 15px;background:var(--surface);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--ch)),calc(100% - var(--ch)) 100%,0 100%);
  font-size:.82rem;color:var(--muted);
}
.feed__pe strong{color:var(--text);font-weight:700}
.feed__pe .ico{width:17px;height:17px;color:var(--red-500);flex:none}
.fatos{display:grid;gap:14px;margin:var(--s4) 0 var(--s4)}
.fatos li{display:flex;gap:13px;align-items:flex-start}
.fatos__ico{
  flex:none;width:40px;height:40px;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--red-600),var(--red-900));
  clip-path:polygon(50% 0,93.3% 25%,93.3% 75%,50% 100%,6.7% 75%,6.7% 25%);
}
.fatos__ico .ico{width:19px;height:19px;color:#fff}
.fatos p{display:flex;flex-direction:column;gap:2px}
.fatos strong{font-size:.93rem;font-weight:700}
.fatos span{font-size:.86rem;color:var(--muted);line-height:1.4}

/* ---------------------------- LOCALIZAÇÃO --------------------------------- */
.local{background:var(--bevel);padding:1.5px;clip-path:var(--cut)}
.local__in{background:var(--surface);clip-path:var(--cut);padding:var(--s4) var(--s3)}
.local__end{
  font-size:1.12rem;font-weight:700;line-height:1.28;margin-bottom:var(--s4);
  padding-left:12px;border-left:3px solid var(--red-600);
}
.local__end span{display:block;font-size:.84rem;font-weight:500;color:var(--muted);margin-top:4px}

.mapa{position:relative;margin-bottom:var(--s3)}
#mapa{
  height:230px;background:#101014;clip-path:var(--cut-sm);
  box-shadow:inset 0 0 0 1px var(--border-2);
}
/* tema escuro só nos tiles: pino, popup e controles mantêm a cor da marca */
#mapa .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.92) saturate(.7)}
#mapa .leaflet-container{background:#101014;font-family:"Barlow",sans-serif}
#mapa .leaflet-control-attribution{background:rgba(8,8,10,.8);color:var(--muted);font-size:9px}
#mapa .leaflet-control-attribution a{color:var(--chrome-3)}
#mapa .leaflet-bar a{background:var(--surface-2);color:var(--text);border-color:var(--border-2)}
#mapa .leaflet-bar a:hover{background:var(--red-700);color:#fff}
/* capa de gesto cooperativo: no celular o dedo rola a página até o usuário liberar */
.mapa__toque{
  position:absolute;inset:0;z-index:600;
  display:grid;place-items:center;
  background:rgba(8,8,10,.42);border:0;cursor:pointer;
  clip-path:var(--cut-sm);
  -webkit-backdrop-filter:blur(.5px);backdrop-filter:blur(.5px);
}
.mapa__toque:active span{transform:translateY(1px);background:rgba(28,28,34,.96)}
.mapa__toque span{transition:transform .15s var(--ease),background .15s;
  padding:10px 16px;background:rgba(20,20,24,.92);
  box-shadow:inset 0 0 0 1px var(--border-2);
  clip-path:var(--cut-sm);
  font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text);
}
.mapa__centrar{
  position:absolute;right:10px;bottom:26px;z-index:700;
  padding:8px 12px;background:var(--red-600);color:#fff;border:0;
  clip-path:var(--cut-sm);cursor:pointer;
  font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
}
.mapa__centrar:active{transform:translateY(1px)}
.mapa__fallback{
  display:block;padding:18px;text-align:center;background:var(--surface-2);
  font-weight:700;font-size:.85rem;
}
.local__acoes{display:grid;gap:10px;margin-bottom:var(--s4)}

.horarios{width:100%;border-collapse:collapse;font-size:.92rem}
.horarios th,.horarios td{padding:11px 0;text-align:left;border-top:1px solid var(--border)}
.horarios th{font-weight:600;color:var(--muted)}
.horarios td{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.horarios tr.is-hoje th{color:var(--text)}
.horarios tr.is-hoje td{color:var(--red-500)}
.horarios tr.is-hoje th::after{
  content:"hoje";margin-left:8px;padding:2px 7px;background:var(--red-900);color:#fff;
  font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  clip-path:var(--cut-sm);
}

/* ------------------------------- REDES ------------------------------------ */
.secao--redes{padding-top:0}
.redes{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.redes a{
  display:flex;align-items:center;gap:11px;padding:14px;
  background:var(--surface);clip-path:var(--cut-sm);
  box-shadow:inset 0 0 0 1px var(--border);
  transition:transform .16s var(--ease)
}
.redes a:active{transform:translateY(2px)}
.redes .ico{width:22px;height:22px;color:var(--red-500);flex:none}
.redes span{display:flex;flex-direction:column;min-width:0}
.redes strong{font-size:.85rem;font-weight:700}
.redes small{font-size:.76rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis}

/* ------------------------------ RODAPÉ ------------------------------------ */
.rodape{
  border-top:1px solid var(--border);
  background:linear-gradient(180deg,var(--bg-2),#050506);
  padding:var(--s6) 0 calc(112px + env(safe-area-inset-bottom));
  text-align:center;
}
.rodape__logo{
  width:64px;height:64px;margin:0 auto var(--s3);
  border-radius:50%;opacity:.92;
  box-shadow:0 0 0 1px var(--border-2),0 0 22px -6px rgba(224,27,20,.55);
}
.rodape__marca{
  font-family:"Archivo","Roboto Condensed","Arial Narrow",sans-serif;font-style:italic;font-variation-settings:"wdth" 68,"wght" 800;
  font-size:1.25rem;letter-spacing:.02em;text-transform:uppercase;
}
.rodape__tag{
  font-size:.68rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;
  color:var(--red-500);margin-bottom:var(--s4);
}
.rodape__dados{font-size:.86rem;color:var(--muted);line-height:1.6;margin-bottom:var(--s3)}
.rodape__dados a{color:var(--chrome-2);border-bottom:1px solid var(--border-2)}
.rodape__cred{font-size:.74rem;color:#5C5E65}

/* ------------------------------ CTA FIXO ---------------------------------- */
.fixo{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  padding:10px calc(16px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));
  background:linear-gradient(180deg,rgba(8,8,10,0),rgba(8,8,10,.94) 42%);
  transform:translateY(120%);opacity:0;
  transition:transform .32s var(--ease),opacity .24s;
  pointer-events:none;
}
.fixo.is-on{transform:none;opacity:1;pointer-events:auto}
.btn--fixo{width:100%;max-width:var(--wrap);margin-inline:auto;min-height:58px}

/* ------------------------------ ÍCONES ------------------------------------ */
.ico{
  fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:square;stroke-linejoin:miter;
}
.ico--wa{fill:currentColor;stroke:none}

/* ------------------------------- MOTION ----------------------------------- */
/* "carimbo": o brasão entra como um selo batido na página */
[data-anim]{opacity:0}
[data-anim="stamp"]{
  animation:carimbo .58s var(--ease) .05s forwards;
}
@keyframes carimbo{
  0%{opacity:0;transform:scale(1.16) rotate(-4deg);filter:blur(3px)}
  60%{opacity:1;filter:blur(0)}
  100%{opacity:1;transform:none;filter:blur(0)}
}
.brasao__ring{animation:giro 3.6s var(--ease) .1s 1 forwards}
@keyframes giro{from{transform:rotate(-90deg)}to{transform:rotate(270deg)}}

[data-anim="up"]{transform:translateY(14px)}
[data-anim="mask"]>span{transform:translateY(105%)}
/* o cartaz entra da esquerda, como um cartaz sendo colado na vitrine —
   só transform/opacity para não brigar com o chanfro em clip-path */
[data-anim="cartaz"]{transform:translateX(-20px) scaleX(.985);transform-origin:left center}

.hero [data-anim]{animation:entra .6s var(--ease) var(--d,0s) forwards}
.hero [data-anim="mask"]{opacity:1}
.hero [data-anim="mask"]{animation:none}
.hero [data-anim="mask"]>span{animation:sobe .62s var(--ease) var(--d,0s) forwards}

.is-in[data-anim="up"]{animation:entra .55s var(--ease) var(--d,0s) forwards}
.is-in[data-anim="cartaz"]{animation:cola .62s var(--ease) var(--d,0s) forwards}

@keyframes entra{to{opacity:1;transform:none}}
@keyframes sobe{to{transform:none}}
@keyframes cola{to{opacity:1;transform:none}}

/* preço entra depois do cartaz colado */
.is-in .preco{animation:selo .42s var(--ease) .26s backwards}
@keyframes selo{from{transform:scale(1.22);opacity:0}to{transform:none;opacity:1}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  /* clip-path NÃO é resetado aqui: é o chanfro da marca, não animação */
  [data-anim]{opacity:1!important;transform:none!important}
  [data-anim="mask"]>span{transform:none!important}
  .brasao__ring{transform:none}
}

/* ------------------------------ RESPONSIVO -------------------------------- */
/* ---- telas baixas (iPhone SE, e qualquer celular dentro do navegador do
   Instagram, que come ~140px entre barra de topo e barra inferior):
   o hero encolhe para o CTA principal continuar na primeira dobra ---- */
@media (max-width:699px) and (max-height:740px){
  .hero{padding-top:calc(env(safe-area-inset-top) + 18px)}
  .brasao{width:86px;height:86px;margin-bottom:12px}
  .eyebrow{font-size:.68rem;margin-bottom:9px}
  .hero__h1{font-size:clamp(2.35rem,13vw,3.2rem);margin-bottom:11px}
  .hero__sub{font-size:.95rem;margin-bottom:15px}
  .status{margin-bottom:16px;padding:7px 12px 7px 11px}
  .hero__in{padding-bottom:var(--s5)}
  .btn{min-height:56px}
}

@media (max-width:359px){
  .wrap{padding-inline:15px}
  .hero__h1{font-size:2.45rem}
  .secao__h2{font-size:1.75rem}
  .preco__int{font-size:3.15rem}
  .cartaz__nome{font-size:1.3rem}
  .btn{min-height:58px;gap:10px}
  .btn__txt strong{font-size:.85rem}
  .btn__txt small{font-size:.69rem}
  .selos__grid{gap:6px}
  .selo strong{font-size:.76rem}
  .selo span{font-size:.68rem}
  .categorias__n{width:32px;font-size:1.3rem}
  .redes{grid-template-columns:1fr}
}

@media (min-width:700px){
  :root{--wrap:1040px;--ch:18px}
  .hero{padding-top:calc(env(safe-area-inset-top) + 64px)}
  .hero__in{padding-bottom:88px}
  .hero__mascote{width:auto;height:min(92%,560px);opacity:.3;right:3%}
  .brasao{width:148px;height:148px}
  .hero__h1{font-size:5.6rem}
  .hero__sub{font-size:1.1rem;max-width:42ch}
  .hero__acoes{grid-template-columns:1.25fr 1fr;max-width:760px}
  .selos__grid{gap:24px}
  .selo{flex-direction:row;align-items:center;gap:12px}

  .cartazes{grid-template-columns:repeat(3,1fr);gap:20px}
  .cartaz__in{display:flex;flex-direction:column;height:100%}
  .cartaz__corpo{display:flex;flex-direction:column;flex:1}
  .cartaz__pe{margin-top:auto}
  /* na coluna estreita do desktop a peça inteira comunica melhor que o recorte */
  .cartaz__foto,.cartaz__foto--peca{height:236px}
  .cartaz__foto img{object-fit:contain;object-position:center;padding:18px}
  .cartaz__foto--peca img{padding:14px 0 20px}

  .feature{grid-template-columns:.9fr 1.1fr;align-items:stretch}
  .feature__foto{height:100%;min-height:280px}
  .feature__foto img{object-position:center 55%}
  .feature__txt{padding:var(--s6) var(--s5)}

  .categorias{grid-template-columns:1fr 1fr}
  .confianca{grid-template-columns:.85fr 1.15fr;gap:var(--s6);align-items:center}
  .local__in{padding:var(--s5)}
  #mapa{height:330px}
  .local__acoes{grid-template-columns:1fr 1fr}
  .secao{padding:96px 0}
  .redes{max-width:560px}
}

@media (min-width:1100px){
  :root{--wrap:1140px}
  .hero__h1{font-size:6.4rem}
}