/* =========================================================
   Pipocas Universitárias
   Paleta e formas tiradas da própria barraca: toldo listrado,
   balde vermelho e amarelo, papel creme, chapéu de formatura.
   ========================================================= */

:root{
  --vinho:        #4A2A38;
  --vinho-deep:   #2E1922;
  --vinho-ink:    #1B0E14;
  --vermelho:     #E12510;
  --vermelho-esc: #B01C0B;
  --amarelo:      #FCD02B;
  --amarelo-esc:  #E0B117;
  --creme:        #F8EEDC;
  --creme-2:      #F0E1C7;
  --creme-3:      #E4D0AF;
  --rosa:         #F2C6D0;
  --zap:          #1FAF54;
  --zap-esc:      #17853F;

  --ink:          #2A1620;
  --ink-soft:     #6B5460;
  --on-dark:      #F6E9D6;
  --on-dark-soft: #C3A9B4;

  --ff-disp: "Fraunces", "Iowan Old Style", Georgia, serif;
  --ff-body: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --ff-mono: "DM Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --wonk: "SOFT" 100, "WONK" 1;

  --wrap: 1180px;
  --gut: clamp(1.15rem, 4vw, 2.5rem);
  --r-lg: 22px;
  --r-md: 14px;
  --r-sm: 9px;

  --sec-y: clamp(3.8rem, 7vw, 6.5rem);
}

*, *::before, *::after{ box-sizing: border-box; }

/* o titulo da secao nao pode ficar embaixo da nav fixa */
[id]{ scroll-margin-top: 84px; }

a, button, summary, .chips li{
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(225,37,16,.16);
}

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; color-scheme: light; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background: var(--creme);
  color: var(--ink);
  font-family: var(--ff-body);
  font-size: clamp(1rem, .96rem + .2vw, 1.09rem);
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, video{ display:block; max-width:100%; height:auto; }
a{ color: inherit; }
h1,h2,h3,h4{ margin:0; font-family: var(--ff-disp); font-variation-settings: var(--wonk); line-height:1.02; letter-spacing:-.015em; }
p{ margin:0 0 1em; }
ul,ol{ margin:0; padding:0; list-style:none; }

::selection{ background: var(--amarelo); color: var(--vinho-ink); }

:where(a,button,summary,details,input):focus-visible{
  outline: 3px solid var(--vermelho);
  outline-offset: 3px;
  border-radius: 4px;
}

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background: var(--vinho); color: var(--on-dark);
  padding:.8rem 1.2rem; border-radius:0 0 var(--r-sm) 0; font-weight:600;
}
.skip:focus{ left:0; }

.wrap{ width:100%; max-width: var(--wrap); margin-inline:auto; padding-inline: var(--gut); }
.wrap--narrow{ max-width: 780px; }

/* ---------------- Signature: o toldo ---------------- */
.awning{
  --s: clamp(15px, 2.6vw, 27px);
  height: calc(var(--s) * 2.4);
  background: repeating-linear-gradient(90deg,
    var(--vermelho) 0 calc(var(--s) * 2),
    var(--amarelo)  calc(var(--s) * 2) calc(var(--s) * 4));
  filter: drop-shadow(0 3px 0 rgba(74,42,56,.14));
  -webkit-mask:
    radial-gradient(var(--s) var(--s) at 50% 0, #000 97%, #0000 100%) 0 100% / calc(var(--s) * 2) var(--s) repeat-x,
    linear-gradient(#000,#000) 0 0 / 100% calc(100% - var(--s) + 1px) no-repeat;
  mask:
    radial-gradient(var(--s) var(--s) at 50% 0, #000 97%, #0000 100%) 0 100% / calc(var(--s) * 2) var(--s) repeat-x,
    linear-gradient(#000,#000) 0 0 / 100% calc(100% - var(--s) + 1px) no-repeat;
}
.awning--flip{ transform: rotate(180deg); }

/* fita fina que separa blocos */
.rule{
  height: 9px;
  background: repeating-linear-gradient(-45deg,
    var(--vermelho) 0 12px,
    var(--amarelo)  12px 24px);
}

/* ---------------- Nav ---------------- */
.nav{
  position: sticky; top:0; z-index:90;
  background: var(--vinho-deep);
  color: var(--on-dark);
  border-bottom: 1px solid rgba(246,233,214,.13);
}
.nav__in{
  max-width: var(--wrap); margin-inline:auto;
  padding: .55rem max(var(--gut), env(safe-area-inset-left)) .55rem max(var(--gut), env(safe-area-inset-right));
  display:flex; align-items:center; gap: clamp(.8rem, 2.5vw, 2rem);
}
.brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; margin-right:auto; }
.brand img{
  width: 46px; height:46px; object-fit: contain;
  background: var(--creme); border-radius:50%; padding:5px 5px 7px;
  box-shadow: 0 0 0 2px var(--amarelo);
}
.brand__txt{
  font-family: var(--ff-disp); font-variation-settings: var(--wonk);
  font-weight:800; font-size:.94rem; line-height:1.02; letter-spacing:-.01em;
}
.brand__txt em{ font-style:normal; color: var(--amarelo); }

.nav__links{ display:flex; gap: clamp(.7rem, 1.8vw, 1.6rem); }
.nav__links a{
  text-decoration:none; font-size:.88rem; font-weight:500;
  color: var(--on-dark-soft); padding:.4rem 0; position:relative;
  transition: color .18s ease;
}
.nav__links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:.1rem;
  height:2px; background: var(--amarelo); transition: right .22s ease;
}
.nav__links a:hover{ color: var(--creme); }
.nav__links a:hover::after{ right:0; }

.nav__burger{
  display:none; width:42px; height:38px; border:0; background:transparent;
  padding:9px 7px; cursor:pointer;
}
.nav__burger span{ display:block; height:2px; background: var(--on-dark); margin:4px 0; transition: transform .25s ease, opacity .2s ease; }
.nav__burger[aria-expanded="true"] span:nth-child(1){ transform: translateY(6px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__burger[aria-expanded="true"] span:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

.nav__mob{
  display:none; flex-direction:column; padding: .4rem var(--gut) 1.2rem;
  border-top:1px solid rgba(246,233,214,.12);
}
.nav__mob a{
  text-decoration:none; padding:.75rem 0; font-size:1.05rem; font-weight:500;
  border-bottom:1px solid rgba(246,233,214,.09);
}

/* ---------------- Botões ---------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family: var(--ff-body); font-weight:600; font-size:.94rem;
  text-decoration:none; cursor:pointer; border:0;
  padding:.72rem 1.25rem; border-radius:100px;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.btn:active{ transform: translateY(1px); }
.btn__ico{ display:inline-flex; }

.btn--zap{ background: var(--zap); color:#fff; box-shadow: 0 2px 0 var(--zap-esc); }
.btn--zap:hover{ background: #23c15f; box-shadow: 0 4px 14px rgba(31,175,84,.34), 0 2px 0 var(--zap-esc); transform: translateY(-2px); }

.btn--red{ background: var(--vermelho); color:#fff; box-shadow: 0 2px 0 var(--vermelho-esc); }
.btn--red:hover{ transform: translateY(-2px); box-shadow: 0 5px 16px rgba(225,37,16,.3), 0 2px 0 var(--vermelho-esc); }

.btn--ghost{ background: transparent; color: var(--vinho); box-shadow: inset 0 0 0 2px rgba(74,42,56,.32); }
.btn--ghost:hover{ background: var(--vinho); color: var(--creme); box-shadow: inset 0 0 0 2px var(--vinho); }

.btn--lg{ padding:.95rem 1.7rem; font-size:1.02rem; }
.btn--xl{ padding:1.15rem 2.3rem; font-size:clamp(1.15rem,2.8vw,1.55rem); font-weight:700; letter-spacing:-.01em; font-variant-numeric: tabular-nums; }

.nav__cta{ padding:.55rem 1.05rem; font-size:.87rem; }

/* ---------------- Hero ---------------- */
.hero{ background: var(--creme); position:relative; }
.hero__in{
  max-width: var(--wrap); margin-inline:auto;
  padding: clamp(2.2rem,4.5vw,3.6rem) var(--gut) clamp(2.6rem,5vw,4.2rem);
  display:grid; grid-template-columns: 1.12fr .88fr;
  gap: clamp(1.6rem, 4vw, 3.4rem); align-items:center;
}

.eyebrow{
  font-family: var(--ff-mono); font-size:.74rem; letter-spacing:.14em;
  text-transform:uppercase; color: var(--vermelho); margin:0 0 1rem;
}
.eyebrow--light{ color: var(--amarelo); }

.hero__h1{
  font-size: clamp(2.4rem, 5.6vw, 4.15rem);
  font-weight: 800;
  color: var(--vinho-ink);
  margin-bottom: 1.15rem;
  text-wrap: balance;
  max-width: 15ch;
}
.hero__h1 em{
  font-style:normal; color: var(--vermelho);
  display:inline-block; position:relative;
}
.hero__h1 em::after{
  content:""; position:absolute; left:-.02em; right:-.02em; bottom:.03em; height:.13em;
  background: var(--amarelo); z-index:-1; border-radius:2px;
}
.hero__sub{
  font-size: clamp(1.04rem, 1.9vw, 1.18rem);
  color: var(--ink-soft); max-width: 40ch; margin-bottom:1.7rem;
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:1.4rem; }
.hero__note{ font-size:.9rem; color: var(--ink-soft); margin:0; }
.hero__note strong{ color: var(--vinho); font-weight:700; font-variant-numeric: tabular-nums; }

.hero__media{ position:relative; justify-self:center; width:100%; max-width: 355px; }
.hero__media::before{
  content:""; position:absolute; inset: 18px -18px -18px 18px;
  background: var(--vinho); border-radius: 175px 175px 20px 20px;
  z-index:0;
}
.reel{
  margin:0; position:relative; z-index:1;
  border-radius: 175px 175px 20px 20px;
  overflow:hidden;
  box-shadow: 0 26px 50px -26px rgba(43,22,32,.55);
  outline: 6px solid var(--creme); outline-offset:-3px;
}
.reel video{ width:100%; aspect-ratio: 4/5; object-fit: cover; }
.reel__toggle{
  position:absolute; right:.7rem; top:.7rem; z-index:2;
  width:32px; height:32px; border-radius:50%; border:0; cursor:pointer;
  background: rgba(27,14,20,.6); color: var(--creme);
  display:grid; place-items:center; backdrop-filter: blur(4px);
  opacity:.5; transition: opacity .2s ease, background .2s ease;
}
.reel:hover .reel__toggle, .reel__toggle:focus-visible{ opacity:1; }
.reel__toggle:hover{ background: rgba(27,14,20,.85); }

.stamp{
  position:absolute; z-index:3; left:-13%; bottom:12%;
  width: clamp(104px, 15vw, 138px); aspect-ratio:1;
  background: var(--amarelo); border-radius:50%;
  display:grid; place-items:center;
  box-shadow: 0 8px 22px rgba(43,22,32,.28);
  transform: rotate(-9deg);
  border: 2px solid var(--vinho-ink);
}
.stamp svg{ position:absolute; inset:0; width:100%; height:100%; animation: spin 34s linear infinite; }
.stamp__t{ font-family: var(--ff-mono); font-size:13.5px; letter-spacing:.03em; fill: var(--vinho-ink); }
.stamp__n{
  font-family: var(--ff-disp); font-variation-settings: var(--wonk);
  font-weight:900; font-size: clamp(1.85rem,3.2vw,2.35rem); line-height:.8;
  color: var(--vinho-ink); display:grid; justify-items:center;
}
.stamp__n small{ font-family: var(--ff-mono); font-size:.36em; letter-spacing:.16em; text-transform:uppercase; font-weight:400; margin-top:.28em; }
@keyframes spin{ to{ transform: rotate(360deg); } }

/* ---------------- Ticker ---------------- */
.ticker{
  background: var(--amarelo);
  border-block: 2px solid var(--vinho-ink);
  overflow:hidden; padding:.6rem 0;
  display:flex;
}
.ticker__track{ display:flex; width:max-content; animation: slide 46s linear infinite; }
.ticker__set{ display:flex; align-items:center; white-space:nowrap; }
.ticker__set b{
  font-family: var(--ff-disp); font-variation-settings: var(--wonk);
  font-weight:700; font-size: clamp(1rem,2vw,1.28rem); color: var(--vinho-ink);
}
.ticker__set i{
  font-style:normal; font-size:0; padding:0 .95rem; display:inline-flex; align-items:center;
}
.ticker__set i::before{
  content:""; width:7px; height:7px; border-radius:50%;
  background: var(--vermelho); display:block;
}
@keyframes slide{ to{ transform: translateX(-50%); } }
.ticker:hover .ticker__track{ animation-play-state: paused; }

/* ---------------- Seções ---------------- */
.sec{ padding-block: var(--sec-y); }
.sec--tight{ padding-block: clamp(3rem,6vw,5rem); }
.sec--cream{ background: var(--creme); }
.sec--dark{
  background: var(--vinho-deep); color: var(--on-dark);
  background-image: radial-gradient(circle at 1px 1px, rgba(246,233,214,.07) 1px, transparent 0);
  background-size: 26px 26px;
}
.sec--dark .sec__lead{ color: var(--on-dark-soft); }

.sec__head{ margin-bottom: clamp(1.9rem,3.5vw,2.8rem); max-width: 62ch; }
.sec__head--center{ margin-inline:auto; text-align:center; }
.sec__h2{
  font-size: clamp(2.05rem, 5.2vw, 3.35rem); font-weight:800;
  color: inherit; margin-bottom:.7rem;
}
.sec--cream .sec__h2{ color: var(--vinho-ink); }
.sec__lead{ font-size: clamp(1rem,1.7vw,1.14rem); color: var(--ink-soft); margin:0; }

.lnk{ color: var(--vermelho); text-underline-offset:3px; text-decoration-thickness:2px; font-weight:600; }
.sec--dark .lnk{ color: var(--amarelo); }

/* ---------------- Bento de estações ---------------- */
.bento{
  display:grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(.85rem, 1.6vw, 1.3rem);
  grid-auto-flow: dense;
}
.card{
  background: #fff; border-radius: var(--r-lg); overflow:hidden;
  border: 1px solid rgba(74,42,56,.14);
  box-shadow: 0 2px 0 rgba(74,42,56,.08);
  display:flex; flex-direction:column;
  transition: transform .2s ease, box-shadow .2s ease;
}
.card:hover{ transform: translateY(-4px); box-shadow: 0 16px 30px -18px rgba(43,22,32,.5); }
.card img{ width:100%; aspect-ratio: 4/3; object-fit: cover; flex: 1 1 auto; min-height:0; transition: transform .5s cubic-bezier(.2,.7,.3,1); }
.card:hover img{ transform: scale(1.045); }
.card__body{ padding: 1.1rem 1.15rem 1.3rem; flex: 0 0 auto; }
.card__body h3{
  font-size: clamp(1.15rem,1.9vw,1.4rem); font-weight:800; color: var(--vinho-ink);
  margin-bottom:.45rem; padding-bottom:.45rem;
  border-bottom: 2px solid var(--amarelo); display:inline-block;
}
.card__body p{ margin:0; font-size:.94rem; color: var(--ink-soft); line-height:1.55; }

.card--tall{ grid-row: span 2; }
.card--tall img{ aspect-ratio: 3/4; }
.card--wide{ grid-column: span 2; }
.card--wide img{ aspect-ratio: 16/9; }

/* ---------------- Diversão ---------------- */
.play{
  display:grid; grid-template-columns: repeat(4,1fr);
  gap: clamp(.85rem,1.6vw,1.3rem);
}
.play__big{ grid-column: span 2; grid-row: span 2; }
.play__big, .play__item{
  position:relative; border-radius: var(--r-lg); overflow:hidden;
  background: rgba(246,233,214,.06);
  border:1px solid rgba(246,233,214,.14);
  min-height: 190px;
}
.play__big img, .play__item img{
  width:100%; height:100%; object-fit:cover; position:absolute; inset:0;
  transition: transform .55s cubic-bezier(.2,.7,.3,1);
}
.play__big:hover img, .play__item:hover img{ transform: scale(1.05); }
.play__cap{
  position:relative; z-index:2; padding: 1.05rem 1.15rem;
  margin-top: auto; display:flex; flex-direction:column; justify-content:flex-end;
  height:100%;
  background: linear-gradient(to top, rgba(27,14,20,.93) 0%, rgba(27,14,20,.6) 40%, rgba(27,14,20,0) 78%);
}
.play__cap h3{ font-size:1.22rem; font-weight:800; color: var(--creme); margin-bottom:.25rem; }
.play__cap p{ margin:0; font-size:.9rem; color: var(--on-dark-soft); }
.play__item--txt{ background: var(--vermelho); border-color: var(--vermelho); display:flex; }
.play__item--txt .play__cap{ background:none; justify-content:center; }
.play__item--txt p{ color: rgba(255,255,255,.9); }

/* ---------------- Split (frente de loja) ---------------- */
.split{
  display:grid; grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4.5rem); align-items:center;
}
.split__media{ position:relative; padding-bottom: 2.2rem; padding-right:2rem; }
.split__img{ border-radius: var(--r-lg); box-shadow: 0 20px 40px -24px rgba(43,22,32,.6); }
.split__img--a{ width:100%; aspect-ratio: 4/5; object-fit:cover; }
.split__img--b{
  position:absolute; right:0; bottom:0; width:46%;
  aspect-ratio: 1; object-fit:cover;
  border: 7px solid var(--creme); border-radius: var(--r-md);
}
.split__copy .sec__h2{ margin-bottom:1rem; }
.split__copy p{ color: var(--ink-soft); }

.ticks{ margin: 1.5rem 0 1.9rem; display:grid; gap:.6rem; }
.ticks li{ position:relative; padding-left:1.85rem; font-size:.98rem; }
.ticks li::before{
  content:"🍿"; position:absolute; left:0; top:.05em; font-size:.9rem;
}

/* ---------------- Cardápio ---------------- */
.menu{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(1rem,2.4vw,1.8rem); }
.menu__board{
  background: var(--creme); color: var(--vinho-ink);
  border-radius: var(--r-lg); padding: clamp(1.5rem,3vw,2.3rem);
  box-shadow: inset 0 0 0 2px var(--creme), inset 0 0 0 5px var(--vinho-deep);
}
.menu__board--alt{ background: var(--amarelo); }
.menu__title{
  font-size: clamp(1.5rem,2.8vw,1.95rem); font-weight:800; margin-bottom:1.2rem;
  padding-bottom:.6rem; border-bottom: 2px dashed rgba(74,42,56,.35);
}
.menu__list li{
  display:grid; grid-template-columns: auto 1fr auto;
  align-items: baseline; padding:.62rem 0;
  border-bottom: 1px solid rgba(74,42,56,.1);
}
.menu__list li:last-child{ border-bottom:0; }
.menu__name{ font-weight:600; font-size:1.02rem; }
.menu__dots{ border-bottom: 2px dotted rgba(74,42,56,.35); margin:0 .6rem; transform: translateY(-.25em); }
.menu__price{ font-weight:700; font-size:1.1rem; color: var(--vermelho); white-space:nowrap; font-variant-numeric: tabular-nums; letter-spacing:-.01em; }
.menu__board--alt .menu__price{ color: var(--vinho-ink); }
.menu__desc{ grid-column: 1 / -1; font-size:.86rem; color: var(--ink-soft); margin-top:.15rem; }
.menu__foot{ margin:1.1rem 0 0; font-size:.88rem; color: var(--ink-soft); font-style:italic; }
.menu__note{
  margin: clamp(1.4rem,3vw,2.2rem) auto 0; max-width: 70ch; text-align:center;
  font-size:.92rem; color: var(--on-dark-soft);
}

/* ---------------- Chips + prova ---------------- */
.chips{ display:flex; flex-wrap:wrap; gap:.55rem; margin-bottom: clamp(2.2rem,5vw,3.5rem); }
.chips li{
  padding:.5rem 1.05rem; border-radius:100px; font-size:.93rem; font-weight:500;
  background:#fff; border:1px solid rgba(74,42,56,.16); color: var(--vinho);
}
.proof{ display:grid; grid-template-columns: .85fr 1.15fr; gap: clamp(1.4rem,3.5vw,3rem); align-items:center; }
.proof__fig{ margin:0; }
.proof__fig img{ width:100%; aspect-ratio: 4/3; object-fit:cover; border-radius: var(--r-lg); }
.proof__h3{
  font-size: clamp(1.45rem,2.8vw,1.9rem); font-weight:800; color: var(--vinho-ink);
  margin-bottom:1.2rem;
}
.proof__list ul{ display:grid; gap:1rem; }
.proof__list li{
  display:grid; gap:.15rem; padding-left:1.5rem; position:relative;
  border-left: 3px solid var(--amarelo);
}
.proof__list li b{ font-weight:700; font-size:1.02rem; color: var(--vinho-ink); }
.proof__list li span{ font-size:.93rem; color: var(--ink-soft); line-height:1.5; }

/* ---------------- Passos ---------------- */
.steps{ display:grid; grid-template-columns: repeat(3,1fr); gap: clamp(1.2rem,3vw,2.4rem); counter-reset:s; }
.step{ position:relative; padding-top:1.4rem; border-top: 2px solid rgba(246,233,214,.22); }
.step__n{
  font-family: var(--ff-disp); font-variation-settings: var(--wonk);
  font-weight:900; font-size: clamp(2.4rem,5vw,3.4rem); line-height:.9;
  color: var(--amarelo); display:block; margin-bottom:.5rem;
}
.step h3{ font-size:1.32rem; font-weight:800; color: var(--creme); margin-bottom:.5rem; }
.step p{ margin:0; color: var(--on-dark-soft); font-size:.97rem; }

/* ---------------- Galeria ---------------- */
.gal{
  display:grid; grid-template-columns: repeat(4,1fr);
  gap: clamp(.7rem,1.4vw,1.1rem);
}
.gal figure{ margin:0; border-radius: var(--r-md); overflow:hidden; }
.gal img{
  width:100%; height:100%; aspect-ratio:1; object-fit:cover;
  transition: transform .45s cubic-bezier(.2,.7,.3,1);
}
.gal figure:hover img{ transform: scale(1.06); }

/* ---------------- FAQ ---------------- */
.faq details{
  border-bottom: 1px solid rgba(74,42,56,.16);
  padding: .35rem 0;
}
.faq summary{
  cursor:pointer; list-style:none; padding: 1rem 2.2rem 1rem 0; position:relative;
  font-family: var(--ff-disp); font-variation-settings: var(--wonk);
  font-weight:700; font-size: clamp(1.05rem,2vw,1.22rem); color: var(--vinho-ink);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+"; position:absolute; right:.2rem; top:50%; transform: translateY(-50%);
  font-family: var(--ff-mono); font-size:1.5rem; color: var(--vermelho);
  transition: transform .22s ease;
}
.faq details[open] summary::after{ transform: translateY(-50%) rotate(45deg); }
.faq details p{ margin:0 0 1.1rem; color: var(--ink-soft); max-width: 62ch; }

/* ---------------- CTA ---------------- */
.cta{ background: var(--vermelho); color:#fff; position:relative; }
.cta .awning{ position:absolute; top:0; left:0; right:0; }
.cta__in{
  padding-block: clamp(5rem,10vw,8rem) clamp(3.5rem,7vw,5.5rem);
  text-align:center;
}
.cta .eyebrow--light{ color: var(--amarelo); }
.cta__h2{
  font-size: clamp(2.2rem,6vw,4rem); font-weight:800; color:#fff; margin-bottom:.9rem;
}
.cta__sub{ font-size:1.06rem; color: rgba(255,255,255,.85); margin-bottom:2rem; }
.cta .btn--xl{ background: var(--amarelo); color: var(--vinho-ink); box-shadow: 0 3px 0 var(--amarelo-esc); }
.cta .btn--xl:hover{ transform: translateY(-3px); box-shadow: 0 10px 24px rgba(27,14,20,.3), 0 3px 0 var(--amarelo-esc); }
.cta__alt{ margin: 1.6rem 0 0; font-size:.94rem; color: rgba(255,255,255,.82); }
.cta__alt a{ color:#fff; text-underline-offset:3px; }

/* ---------------- Rodapé ---------------- */
.foot{ background: var(--vinho-ink); color: var(--on-dark); padding-top: clamp(3rem,6vw,4.5rem); }
.foot__in{
  display:grid; grid-template-columns: 1.5fr 1fr 1fr .8fr;
  gap: clamp(1.6rem,3.5vw,3rem); padding-bottom: 2.6rem;
}
.foot__brand img{
  width:66px; height:66px; object-fit:contain; background: var(--creme);
  border-radius:50%; padding:7px 7px 10px; margin-bottom:1rem;
}
.foot__brand p{ font-size:.92rem; color: var(--on-dark-soft); max-width:34ch; margin:0; }
.foot__col h4{
  font-family: var(--ff-mono); font-weight:500; font-size:.74rem; letter-spacing:.13em;
  text-transform:uppercase; color: var(--amarelo); margin-bottom:.85rem;
}
.foot__col p{ font-size:.93rem; color: var(--on-dark-soft); margin:0 0 .55rem; line-height:1.5; }
.foot__col a{ text-decoration:none; border-bottom:1px solid rgba(246,233,214,.3); padding-bottom:1px; }
.foot__col a:hover{ color: var(--amarelo); border-color: var(--amarelo); }
.foot__base{
  border-top:1px solid rgba(246,233,214,.13);
  padding-block:1.4rem calc(1.4rem + env(safe-area-inset-bottom));
}
.foot__base p{ margin:0; font-size:.8rem; color: rgba(195,169,180,.75); font-family: var(--ff-mono); }

/* ---------------- WhatsApp flutuante ---------------- */
.float-zap{
  position: fixed;
  right: calc(clamp(.9rem,3vw,1.7rem) + env(safe-area-inset-right));
  bottom: calc(clamp(.9rem,3vw,1.7rem) + env(safe-area-inset-bottom));
  z-index:80; width:58px; height:58px; border-radius:50%;
  background: var(--zap); color:#fff; display:grid; place-items:center;
  box-shadow: 0 8px 22px rgba(27,14,20,.35);
  opacity:0; visibility:hidden; transform: translateY(14px) scale(.9);
  transition: opacity .28s ease, transform .28s ease, visibility .28s;
}
.float-zap.on{ opacity:1; visibility:visible; transform:none; }
.float-zap:hover{ background:#23c15f; transform: scale(1.06); }

/* ---------------- Reveal ---------------- */
.rv{ opacity:0; transform: translateY(22px); transition: opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1); }
.rv.in{ opacity:1; transform:none; }

/* ---------------- Responsivo ---------------- */
@media (max-width: 1040px){
  .bento{ grid-template-columns: repeat(3,1fr); }
  .card--tall{ grid-row: span 1; }
  .card--tall img{ aspect-ratio:4/3; }
  .gal{ grid-template-columns: repeat(3,1fr); }
  .foot__in{ grid-template-columns: 1fr 1fr; }
}

@media (max-width: 880px){
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{ display:block; }
  .nav__mob[data-open="true"]{ display:flex; }
  .hero__in{ grid-template-columns: 1fr; text-align:left; }
  .hero__sub{ max-width:none; }
  .hero__media{ max-width: 330px; margin-top:.5rem; }
  .split{ grid-template-columns:1fr; }
  .split__media{ max-width: 420px; }
  .menu{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .proof{ grid-template-columns:1fr; }
  .play{ grid-template-columns: repeat(2,1fr); }
  .play__big{ grid-column: span 2; grid-row: span 1; min-height: 260px; }
}

@media (max-width: 620px){
  .bento{ grid-template-columns: repeat(2,1fr); }
  .card--wide{ grid-column: span 2; }
  .gal{ grid-template-columns: repeat(2,1fr); }
  .foot__in{ grid-template-columns:1fr; }
  .hero__cta .btn{ width:100%; }
  .stamp{ left:auto; right:-4%; bottom:4%; }
}

@media (max-width: 430px){
  .bento{ grid-template-columns:1fr; }
  .card--wide{ grid-column: span 1; }
  .play{ grid-template-columns:1fr; }
  .play__big{ grid-column: span 1; }
}

@media (prefers-reduced-motion: reduce){
  .ticker__track, .stamp svg{ animation: none; }
  .card:hover img, .gal figure:hover img, .play__big:hover img, .play__item:hover img{ transform:none; }
  .rv{ opacity:1; transform:none; transition:none; }
  *, *::before, *::after{ transition-duration:.01ms !important; }
}
