/* ================= Bites — landing no modelo da MadNutz =================
   Mapa de cores do modelo → Bites:
   vermelho (cor da marca) → rosa · amarelo (destaque) → azul-céu (tons das nuvens da embalagem)
   escuro → vinho · laranja (contato) → azul-céu · vermelho do rodapé → rosa escuro */
:root{
  color-scheme:light;
  --rosa:#E9418B; --rosa-2:#F46AA6; --rosa-esc:#C4246B; --rosa-claro:#FFD6E7; --rosa-bg:#FFF0F6;
  --azul:#B8E6FA; --azul-claro:#DDF3FC; --azul-forte:#7CCFF2; --azul-esc:#4FB4E3; --creme:#FFF6EC; --pipoca:#FFF3DC; --caramelo:#D9954A;
  --tinta:#3A1026; --tinta-2:#7A4A62; --escuro:#1E0712; --linha:#F6CFE0; --zap:#1FAF5A; --fx:var(--azul);
  --display:"Anton",Impact,"Arial Narrow",sans-serif;
  --corpo:"Gantari",system-ui,-apple-system,"Segoe UI",sans-serif;
  --topo-h:64px;
  /* céu aquarelado (azul das nuvens) */
  --ceu:radial-gradient(ellipse 60% 45% at 18% 22%,rgba(255,255,255,.7),transparent 70%),radial-gradient(ellipse 50% 40% at 78% 30%,rgba(124,207,242,.55),transparent 70%),radial-gradient(ellipse 55% 45% at 60% 80%,rgba(255,255,255,.55),transparent 70%),radial-gradient(ellipse 45% 35% at 10% 90%,rgba(124,207,242,.5),transparent 70%),linear-gradient(160deg,var(--azul-claro),var(--azul) 55%,#A6DEF8);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-behavior:auto}
body{font-family:var(--corpo);color:#fff;background:var(--rosa);line-height:1.5;font-size:16px}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
h1,h2,h3{text-wrap:balance}
.num{font-variant-numeric:tabular-nums}
:focus-visible{outline:3px solid var(--azul);outline-offset:2px;border-radius:6px}
.caixa{max-width:1200px;margin:0 auto;padding:0 20px}
@media (min-width:768px){.caixa{padding:0 32px}}
@media (min-width:1200px){.caixa{padding:0 24px}}
section[id],main[id]{scroll-margin-top:var(--topo-h)}
.oval{display:inline-grid;place-items:center;width:84px;height:44px;background:#fff;border:2.5px solid var(--rosa-esc);border-radius:50%;color:var(--rosa);font-family:var(--display);font-size:20px;letter-spacing:.08em}

/* pulsação dos CTAs (como no modelo) */
@keyframes pulsa-azul{0%{transform:scale(1);box-shadow:0 4px 0 rgba(0,0,0,.3),0 0 0 0 rgba(184,230,250,.7)}50%{transform:scale(1.06);box-shadow:0 4px 0 rgba(0,0,0,.3),0 0 0 16px rgba(184,230,250,0)}100%{transform:scale(1);box-shadow:0 4px 0 rgba(0,0,0,.3),0 0 0 0 rgba(184,230,250,0)}}
@keyframes pulsa-rosa{0%{transform:scale(1);box-shadow:0 4px 0 rgba(0,0,0,.3),0 0 0 0 rgba(233,65,139,.6)}50%{transform:scale(1.06);box-shadow:0 4px 0 rgba(0,0,0,.3),0 0 0 16px rgba(233,65,139,0)}100%{transform:scale(1);box-shadow:0 4px 0 rgba(0,0,0,.3),0 0 0 0 rgba(233,65,139,0)}}

/* ===== HEADER ===== */
.topo{position:sticky;top:0;z-index:50;background:var(--rosa);transition:box-shadow .3s}
.topo.rolou{box-shadow:0 8px 24px -12px rgba(90,10,50,.6)}
.topo-l{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--topo-h)}
.logo{flex-shrink:0;display:flex;align-items:center}
.logo img{height:52px;width:auto}
.menu{display:none}
@media (min-width:768px){.menu{display:flex;gap:32px;margin-left:auto;margin-right:24px}}
.menu a{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;transition:color .2s}
.menu a:hover,.menu a.ativo{color:var(--azul)}
.bt-sacola{position:relative;display:flex;align-items:center;color:#fff;padding:6px;transition:color .2s}
.bt-sacola:hover{color:var(--azul)}
.bt-sacola svg{width:28px;height:28px}
.badge{position:absolute;top:-2px;right:-6px;min-width:20px;height:20px;border-radius:999px;background:var(--tinta);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.badge.pula,.barra-sacola .qt.pula{animation:pula .55s cubic-bezier(.3,1.6,.5,1)}
@keyframes pula{40%{transform:scale(1.6)}}
.engole{animation:engole .6s cubic-bezier(.3,1.5,.5,1)}
@keyframes engole{0%{transform:scale(1)}25%{transform:scale(1.25) rotate(-8deg)}50%{transform:scale(.9) rotate(5deg)}75%{transform:scale(1.06)}100%{transform:scale(1)}}
.barra-sacola.engole{animation:engole-barra .6s cubic-bezier(.3,1.5,.5,1)}
@keyframes engole-barra{0%,100%{transform:translate(-50%,0) scale(1)}30%{transform:translate(-50%,0) scale(1.06)}60%{transform:translate(-50%,0) scale(.97)}}

/* ===== HERO ===== */
.hero{--pac-h:min(52vh,400px);background:var(--rosa);overflow:hidden;text-align:center;position:relative}
@media (max-width:560px){.hero{--pac-h:min(40vh,300px)}}
.hero-mascote{position:relative;display:flex;justify-content:center;padding-top:48px}
.hero-mascote-in{position:relative}
.pacote{position:relative;display:block;height:var(--pac-h);aspect-ratio:200/262;padding:0;transform-origin:50% 100%}
.pacote.caindo{animation:cai 1s cubic-bezier(.3,1.4,.5,1) both .2s}
.pacote.estoura{animation:estoura .7s cubic-bezier(.3,1.6,.5,1)}
@keyframes estoura{0%{transform:scale(1)}25%{transform:scale(1.1,.88)}55%{transform:scale(.94,1.08)}80%{transform:scale(1.02,.98)}100%{transform:scale(1)}}
@keyframes cai{from{transform:translateY(-120vh) rotate(-14deg)}}
.pacote.balanca{animation:balanca 2.4s ease-in-out infinite}
@keyframes balanca{0%,70%,100%{transform:rotate(0)}76%{transform:rotate(-5deg)}84%{transform:rotate(4deg)}92%{transform:rotate(-2deg)}}
.pacote svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 26px 34px rgba(90,10,50,.5))}
.pacote .tampa{transform-box:fill-box;transform-origin:0% 100%;transition:transform .9s cubic-bezier(.2,.7,.2,1),opacity .6s}
.pacote.aberto .tampa{transform:translate(-40px,-120px) rotate(-38deg);opacity:0}
.estouro{position:absolute;left:50%;top:10%;width:0;height:0;z-index:5}
.estouro svg{position:absolute;width:32px;height:30px;left:-16px;top:-15px;color:#FFF8EA;opacity:0;filter:drop-shadow(0 3px 4px rgba(90,10,50,.35))}
.estouro svg.car{color:var(--caramelo)}
.ovelha-selo{position:absolute;left:calc(50% - var(--pac-h) * .38 - 70px);bottom:-4px;width:120px;height:120px;object-fit:cover;object-position:18% 30%;border-radius:50%;border:5px solid #fff;box-shadow:0 12px 24px -10px rgba(90,10,50,.6);transform:rotate(-10deg);animation:espia .9s cubic-bezier(.3,1.5,.5,1) both 1s}
@keyframes espia{from{transform:scale(0) rotate(-40deg)}}
.dica{position:absolute;left:calc(50% + var(--pac-h) * .38 + 4px);top:calc(48px + 18%);font-weight:800;font-size:14px;background:var(--tinta);color:#fff;padding:6px 12px;border-radius:999px;transform:rotate(6deg);white-space:nowrap;animation:aparece .6s ease both 1.8s;transition:opacity .4s}
.dica::before{content:"";position:absolute;left:-6px;top:50%;margin-top:-6px;border:6px solid transparent;border-right-color:var(--tinta);border-left:0}
.dica.some{opacity:0}
@media (max-width:560px){.ovelha-selo{width:84px;height:84px;left:calc(50% - var(--pac-h) * .38 - 56px)}.dica{left:auto;right:10px;top:22px}}
.hero-titulo{font-family:var(--display);font-weight:400;font-size:clamp(3.2rem,9vw,6.5rem);line-height:1;text-transform:uppercase;color:#fff;padding:32px 16px;letter-spacing:.01em}
.hero-bt-mobile{display:none}
@media (max-width:768px){
  .hero-bt-mobile{display:inline-block;background:var(--tinta);color:var(--azul);font-family:var(--display);font-size:20px;letter-spacing:.05em;text-transform:uppercase;padding:14px 40px;border-radius:6px;white-space:nowrap;box-shadow:0 4px 0 rgba(0,0,0,.3);margin-bottom:24px;animation:pulsa-azul 1.4s ease-in-out infinite}
  .hero-bt-mobile:active{transform:scale(.97) translateY(2px);box-shadow:none;animation:none}
}
.ticker{background:radial-gradient(ellipse 30% 120% at 20% 50%,rgba(255,255,255,.55),transparent 70%),radial-gradient(ellipse 30% 120% at 75% 50%,rgba(124,207,242,.45),transparent 70%),var(--azul);overflow:hidden;padding:18px 0}
.ticker-trilho{display:flex;width:max-content;white-space:nowrap;animation:marquee 22s linear infinite;font-family:var(--display);font-size:clamp(28px,4vw,45px);color:#fff;text-shadow:0 3px 0 var(--rosa-esc),0 0 14px rgba(196,36,107,.35);text-transform:uppercase;line-height:1.2}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ===== QUEM SOMOS ===== */
.sobre{background:var(--rosa);padding:40px 16px 64px}
.sobre-caixa{max-width:1152px;margin:0 auto;display:flex;flex-direction:column;gap:56px}
.sobre-linha{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.sobre-txt{position:relative}
.sobre-estrela{position:absolute;top:-36px;right:0;width:104px;color:var(--pipoca);opacity:.6;transform:rotate(14deg);pointer-events:none}
.sobre h2{font-family:var(--display);font-weight:400;font-size:clamp(1.9rem,4vw,3.1rem);text-transform:uppercase;line-height:1.08;color:#fff;margin:0 0 20px;position:relative}
.sobre p{font-size:18px;line-height:1.7;font-weight:500;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.25)}
.sobre p+p{margin-top:12px}
.dest-txt{color:var(--azul);font-weight:800}
.sobre-img{display:flex;justify-content:center}
.sobre-img-cta{position:relative}
.img-pacote{max-width:240px;width:100%;transform:rotate(-12deg);filter:drop-shadow(0 20px 40px rgba(0,0,0,.35))}
.img-pacote.foto{border-radius:22px;border:6px solid #fff}
.img-bandeja{max-width:440px;width:100%;filter:drop-shadow(0 24px 34px rgba(90,10,50,.45))}
.img-bandeja.foto{border-radius:24px}
.sobre-bt-mobile{display:none}
@media (max-width:768px){
  .sobre-linha{grid-template-columns:1fr;gap:32px}
  .primeiro{order:2}.ultimo{order:1}
  .sobre-img-cta{flex-direction:column;align-items:center;gap:26px}
  .sobre-bt-mobile{display:inline-block;background:var(--azul);color:var(--tinta);font-family:var(--display);font-size:20px;letter-spacing:.05em;text-transform:uppercase;padding:14px 40px;border-radius:6px;white-space:nowrap;box-shadow:0 4px 0 rgba(0,0,0,.3);animation:pulsa-azul 1.4s ease-in-out infinite}
}

/* ===== ELEVANDO MOMENTOS (seção escura) ===== */
.momentos{position:relative;background:var(--ceu);min-height:60vh;overflow:hidden;display:flex;flex-direction:column}
.momentos-lado{position:absolute;bottom:0;height:88%;max-height:88%;width:auto;object-fit:contain;pointer-events:none;display:none;filter:drop-shadow(0 20px 36px rgba(40,90,130,.4))}
.momentos-lado.foto{height:62%;border-radius:24px;border:6px solid #fff;bottom:9%}
@media (min-width:768px){.momentos-lado{display:block}}
.momentos-esq{left:-2%;transform:rotate(-8deg);transform-origin:bottom left}
.momentos-dir{right:-2%;transform:rotate(12deg);transform-origin:bottom right}
.momentos-txt{position:relative;z-index:10;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:96px 24px 48px}
.momentos h2{font-family:var(--display);font-weight:400;font-size:clamp(3rem,8vw,5.5rem);text-transform:uppercase;color:var(--rosa);line-height:1.05;margin:0 0 16px;text-shadow:0 5px 0 #fff}
.momentos p{font-size:18px;color:var(--tinta);max-width:500px;line-height:1.6;margin:0 0 40px;font-weight:500}
.momentos-bt{display:inline-block;background:var(--rosa);color:#fff;font-family:var(--display);font-size:20px;letter-spacing:.05em;text-transform:uppercase;padding:14px 40px;border-radius:6px;box-shadow:0 4px 0 rgba(0,0,0,.3);animation:pulsa-rosa 1.4s ease-in-out infinite}
.momentos-bt:active{transform:scale(.97) translateY(2px);box-shadow:none;animation:none}
.onda{line-height:0;position:relative;z-index:5}
.onda svg{width:100%;height:70px;display:block;fill:var(--rosa)}

/* ===== FAIXA ===== */
.faixa-sabores{background:var(--rosa);color:rgba(255,255,255,.92);text-align:center;padding:40px 16px;font-family:var(--display);font-size:clamp(1.2rem,3vw,1.8rem);text-transform:uppercase;letter-spacing:.06em}

/* ===== PRODUTOS — carrossel ===== */
.kits{position:relative;overflow:hidden;background:var(--rosa)}
.kits-prog{height:3px;background:rgba(255,255,255,.12)}
.kits-prog-fill{height:100%;width:0;background:linear-gradient(to right,var(--azul),#fff);transition:width .7s ease}
.kits-brilho{pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse 90% 70% at 50% 105%,rgba(196,36,107,.55) 0%,transparent 60%);z-index:0}
.kits-dentro{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:56px 16px 0}
.kits-cab{text-align:center}
.kits-sobrelinha{color:var(--azul);font-size:11px;font-weight:900;letter-spacing:.35em;text-transform:uppercase;margin:0 0 10px}
.kits-titulo{font-family:var(--display);font-weight:400;font-size:clamp(3.5rem,9vw,6rem);text-transform:uppercase;color:#fff;line-height:.95}
.carrossel{position:relative;padding:52px 0 36px;margin:0 -16px}
.carrossel-janela{overflow:hidden}
.carrossel-trilho{display:flex;gap:24px;transition:transform .55s cubic-bezier(.25,.46,.45,.94);will-change:transform;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y;padding:10px 0 24px}
.carrossel-trilho.arrastando{transition:none;cursor:grabbing}
.kit{flex-shrink:0;width:min(340px,78vw);position:relative;transform-origin:center bottom;transition:transform .55s cubic-bezier(.25,.46,.45,.94),opacity .55s ease}
.kit-brilho{display:none;position:absolute;inset:-10px 30px -16px;background:rgba(58,16,38,.35);filter:blur(48px);border-radius:50%;z-index:0;pointer-events:none}
.kit.ativo .kit-brilho{display:block}
.kit-card{position:relative;z-index:1;background:#fff;color:var(--tinta);border-radius:16px;overflow:hidden;width:100%;transition:transform .1s ease,box-shadow .4s ease}
.kit.ativo .kit-card{box-shadow:0 30px 60px -20px rgba(58,16,38,.55)}
.kit:not(.ativo) .kit-card *{pointer-events:none}
.kit-selo{position:absolute;top:12px;left:12px;z-index:10;background:var(--azul);color:var(--tinta);font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:4px 12px;border-radius:20px}
.kit-foto{display:flex;align-items:center;justify-content:center;width:100%;background:#fff;height:230px;overflow:hidden}
.kit-foto img{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none;pointer-events:none}
.kit-foto.recorte img{height:210px;width:auto;object-fit:contain}
.kit-info{padding:12px 20px 20px;text-align:center}
.kit-nome{font-family:var(--display);font-weight:400;font-size:2rem;text-transform:uppercase;color:var(--tinta);line-height:1.1;margin:0 0 4px}
.kit-vem{font-size:14px;font-weight:800;color:var(--rosa-esc);letter-spacing:.04em;margin:0 0 6px}
.kit-desc{font-size:13px;color:#9a8390;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kit-preco{display:flex;flex-direction:column;align-items:center;gap:3px;margin:10px 0 14px}
.kit-de{font-size:17px;color:#b3a2ab;text-decoration:line-through;line-height:1.3}
.kit-por{font-family:var(--display);font-size:2.6rem;color:var(--tinta);line-height:1.05}
.kit-extra{font-size:12px;color:#8d7784;line-height:1.4}
.kit-brinde{font-size:12px;font-weight:700;color:var(--tinta);line-height:1.4}
.kit-bt{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--tinta);color:#fff;font-family:var(--display);font-size:1.1rem;letter-spacing:.05em;text-transform:uppercase;padding:14px 20px;border-radius:12px;transition:opacity .15s,transform .1s,background .2s}
.kit-bt svg{width:18px;height:18px}
.kit-bt:hover{background:var(--rosa-esc)}
.kit-bt:active{transform:scale(.97)}
.carrossel-seta{position:absolute;top:50%;transform:translateY(-50%);z-index:20;padding:12px;color:rgba(255,255,255,.45);transition:color .2s;display:flex;align-items:center}
.carrossel-seta:hover{color:#fff}
.carrossel-seta svg{width:40px;height:40px}
.carrossel-seta.ant{left:0}.carrossel-seta.ant svg{transform:scaleX(-1)}
.carrossel-seta.prox{right:0}
.kits-pilulas{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding-bottom:56px}
.kit-pilula{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.14);color:rgba(255,255,255,.7);transition:background .3s,color .3s,box-shadow .3s}
.kit-pilula[aria-selected="true"]{background:var(--tinta);color:var(--azul);box-shadow:0 4px 18px rgba(58,16,38,.5)}

/* ===== ONDE ENCONTRAR (carrossel de mapas) ===== */
.onde{position:relative;background:var(--escuro);overflow:hidden}
.onde::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 100%,rgba(233,65,139,.3),transparent 65%);pointer-events:none}
.onde-dentro{position:relative;max-width:1280px;margin:0 auto;padding:64px 16px 0}
.onde .kits-titulo{color:var(--azul)}
.onde .kits-sobrelinha{color:var(--rosa-2)}
.mapas{position:relative;margin:44px -16px 0}
.mapas-trilho{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:10px calc(50% - min(760px,86vw) / 2) 30px;overscroll-behavior-x:contain}
.mapas-trilho::-webkit-scrollbar{display:none}
.mapa-card{flex:none;width:min(760px,86vw);scroll-snap-align:center;background:#fff;color:var(--tinta);border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -24px rgba(0,0,0,.7);transform:scale(.92);opacity:.5;transition:transform .5s cubic-bezier(.25,.46,.45,.94),opacity .5s}
.mapa-card.ativo{transform:none;opacity:1}
.mapa-quadro{position:relative;height:clamp(260px,42vw,400px);background:var(--rosa-claro)}
.mapa-quadro iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.mapa-trava{position:absolute;inset:0;z-index:2;display:flex;align-items:flex-end;justify-content:center;padding:14px;background:transparent;cursor:pointer}
.mapa-trava span{background:rgba(30,7,18,.82);color:#fff;font-size:12.5px;font-weight:800;padding:7px 14px;border-radius:999px;opacity:0;transform:translateY(6px);transition:.3s}
.mapa-trava:hover span,.mapa-trava:focus-visible span{opacity:1;transform:none}
@media (hover:none){.mapa-trava span{opacity:1;transform:none}}
.mapa-card.solto .mapa-trava{display:none}
.mapa-pino{position:absolute;right:14px;top:14px;z-index:3;display:flex;align-items:center;gap:6px;background:var(--rosa);color:#fff;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px 6px 9px;border-radius:999px;box-shadow:0 6px 16px -6px rgba(0,0,0,.5);pointer-events:none}
.mapa-pino svg{width:15px;height:15px}
.mapa-info{display:flex;align-items:center;gap:16px;padding:16px 20px}
.mapa-info img{width:64px;height:64px;border-radius:12px;object-fit:cover;flex:none}
.mapa-txt{flex:1;min-width:0}
.mapa-nome{font-family:var(--display);font-weight:400;font-size:1.9rem;text-transform:uppercase;line-height:1.05}
.mapa-sub{font-size:14px;color:var(--tinta-2)}
.mapa-bt{flex:none;display:inline-flex;align-items:center;gap:8px;background:var(--tinta);color:#fff;font-family:var(--display);font-size:1.05rem;letter-spacing:.05em;text-transform:uppercase;padding:13px 20px;border-radius:12px;transition:background .2s}
.mapa-bt:hover{background:var(--rosa-esc)}
.mapa-bt svg{width:18px;height:18px}
@media (max-width:560px){.mapa-info{flex-wrap:wrap}.mapa-info img{width:52px;height:52px}.mapa-bt{width:100%;justify-content:center}}
.mapas .carrossel-seta{top:calc(10px + clamp(260px,42vw,400px) / 2)}
@media (max-width:767px){.mapas .carrossel-seta{display:none}}
.onde .kits-pilulas{padding:10px 0 64px}

/* ===== PÁGINA DO PRODUTO — montar kit (modelo MadNutz) ===== */
body.em-produto main{display:none}
.pag{position:relative;min-height:calc(100vh - var(--topo-h));padding:28px 0 90px;background:radial-gradient(ellipse 70% 60% at 50% 40%,rgba(196,36,107,.28),transparent 70%),var(--escuro);color:#fff}
.pag-caixa{max-width:1140px;margin:0 auto;padding:0 20px}
.pag-voltar{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);padding:6px 0;margin-bottom:22px;transition:color .2s}
.pag-voltar:hover{color:var(--azul)}
.pag-grade{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"foto dir" "texto dir";column-gap:56px;row-gap:28px;align-items:start}
.pag.entra .pag-grade>*,.pag.entra .pag-esq>*{animation:pag-entra .7s cubic-bezier(.16,.84,.24,1) both}
.pag.entra .pag-dir{animation-delay:.08s}
@keyframes pag-entra{from{opacity:0;transform:translateY(24px)}}
.pag-esq{display:contents}
.pag-foto{grid-area:foto;border-radius:16px;overflow:hidden;border:2px solid var(--rosa);background:#fff;aspect-ratio:3/2}
.pag-foto img{width:100%;height:100%;object-fit:cover}
.pag-foto.recorte{background:radial-gradient(ellipse 60% 50% at 30% 30%,rgba(255,255,255,.7),transparent 70%),linear-gradient(160deg,var(--azul-claro),var(--azul))}
.pag-foto.recorte img{object-fit:contain;padding:22px}
/* caixa 3D */
.pag-foto.com-giro{aspect-ratio:auto;height:clamp(420px,52vw,600px);border-color:var(--azul-forte);background:url(img/combos/ceu.webp) center/cover,var(--azul)}
.giro{position:relative;width:100%;height:100%;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}
.giro.girando{cursor:grabbing}
.giro-cena{perspective:1300px;width:var(--w);height:var(--h);margin-top:-18px}
.giro-caixa{position:relative;width:var(--w);height:var(--h);transform-style:preserve-3d;will-change:transform}
.pag-foto.recorte .giro-face,.giro-face{position:absolute;padding:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;pointer-events:none}
/* frente e costas: faixas horizontais que seguem a curva do papel (posição calculada no site.js) */
.giro-face.faixa{left:0;width:var(--w);background-repeat:no-repeat;transform-origin:50% 100%}
.giro-face.frente{background-image:var(--img-frente)}
.giro-face.costas{background-image:var(--img-costas)}
/* laterais com o bico */
.pag-foto.recorte .giro-face.lado,.giro-face.lado{top:0;left:calc((var(--w) - var(--d)) / 2 - .5px);width:calc(var(--d) + 1px);height:var(--h);object-fit:fill}
.giro-face.dir{transform:rotateY(90deg) translateZ(calc(var(--w) / 2 - .5px))}
.giro-face.esq{transform:rotateY(-90deg) translateZ(calc(var(--w) / 2 - .5px))}
.giro::after{content:"";position:absolute;left:50%;bottom:38px;width:calc(var(--w) * 1.1);height:18px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(40,90,130,.35),transparent);pointer-events:none}
.giro-dica{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);background:rgba(30,7,18,.78);color:#fff;font-size:12px;font-weight:800;padding:6px 14px;border-radius:999px;white-space:nowrap;pointer-events:none;transition:opacity .4s}
.giro.girando .giro-dica{opacity:0}
.pag-texto{grid-area:texto}
.pag-texto p{font-size:16px;line-height:1.65;color:rgba(255,255,255,.9)}
.pag-texto p+p{margin-top:12px}
.pag-texto b{color:#fff}
.pag-dir{grid-area:dir}
.pag-titulo{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pag-titulo h1{font-family:var(--display);font-weight:400;font-size:clamp(2.6rem,5vw,4rem);text-transform:uppercase;line-height:1}
.pag-selo{border:1.5px solid var(--azul);color:var(--azul);background:rgba(184,230,250,.08);font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:4px}
.pag-preco{display:flex;flex-direction:column;gap:2px;margin:18px 0 28px}
.pag-de{color:rgba(255,255,255,.6);font-size:15px}
.pag-por{font-family:var(--display);font-weight:400;font-size:2.8rem;line-height:1.05}
.pag-cada{color:var(--rosa-2);font-weight:800;font-size:15px}
.pag-barra{position:relative;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);border-radius:10px;padding:11px 14px;overflow:hidden;font-size:14px;color:rgba(255,255,255,.75)}
.pag-barra i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,rgba(233,65,139,.45),rgba(124,207,242,.45));transition:width .5s cubic-bezier(.3,1.3,.5,1)}
.pag-barra span{position:relative}
.pag-barra b{color:#fff}
.pag-rotulo{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.4);margin:12px 0 10px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}
.pag-montar.avulso .pag-barra,.pag-montar.avulso .pag-rotulo{display:none}
.pag-sabores{display:flex;flex-direction:column;gap:8px}
.pag-sabor{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.03);transition:border-color .3s,background .3s}
.pag-sabor.tem{border-color:var(--rosa);background:rgba(233,65,139,.1)}
.pag-sabor-img{width:54px;height:54px;border-radius:10px;overflow:hidden;flex:none;border:1px solid rgba(255,255,255,.12);background:linear-gradient(160deg,var(--azul-claro),var(--azul))}
.pag-sabor-img img{width:100%;height:100%;object-fit:contain;padding:3px}
.pag-sabor-img img.foto{object-fit:cover;padding:0}
.pag-sabor-nome{flex:1;min-width:0;display:flex;flex-direction:column}
.pag-sabor-nome b{font-size:15px}
.pag-sabor-nome small{font-size:12px;color:rgba(255,255,255,.5)}
.pag-passo{display:flex;align-items:center;gap:12px}
.pag-passo button{width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(255,255,255,.55);color:#fff;font-size:19px;line-height:1;display:grid;place-items:center;transition:background .2s,opacity .2s,transform .15s}
.pag-passo .pag-menos{border-color:var(--rosa);color:var(--rosa-2)}
.pag-passo button:disabled{opacity:.18;cursor:default}
.pag-passo button:not(:disabled):hover{background:rgba(255,255,255,.1)}
.pag-passo button:not(:disabled):active{transform:scale(.88)}
.pag-passo output{min-width:18px;text-align:center;font-weight:900;color:var(--azul);font-size:17px}
.pag-passo output.pula{animation:pula .5s cubic-bezier(.3,1.6,.5,1)}
.pag-bt{margin-top:30px;width:100%;padding:17px;border-radius:12px;background:#6E1A41;color:rgba(255,255,255,.45);font-family:var(--display);font-size:1.3rem;letter-spacing:.06em;text-transform:uppercase;transition:background .3s,color .3s,box-shadow .3s}
.pag-bt:disabled{cursor:not-allowed}
.pag-bt.pronto{background:var(--rosa);color:#fff;animation:pulsa-rosa 1.4s ease-in-out infinite}
.pag-bt.pronto:hover{background:var(--rosa-esc)}
@media (max-width:860px){
  .pag-grade{grid-template-columns:1fr;grid-template-areas:"foto" "dir" "texto"}
}
.chuva{position:fixed;left:0;top:0;z-index:85;pointer-events:none;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35))}
.sac-det{display:block;color:var(--rosa-esc)!important;font-weight:700}

/* ===== CONTATO ===== */
.contato{background:var(--ceu);color:var(--tinta)}
.contato-grade{display:grid;grid-template-columns:1fr 1fr;min-height:520px}
@media (max-width:768px){.contato-grade{grid-template-columns:1fr}.contato-img{padding:24px 24px 0 0}.contato-img img{max-height:360px;-webkit-mask-image:linear-gradient(to bottom,#000 82%,transparent);mask-image:linear-gradient(to bottom,#000 82%,transparent)}}
/* a foto é reta na esquerda e embaixo: fica colada no canto inferior esquerdo */
.contato-img{display:flex;align-items:flex-end;justify-content:flex-start;padding:40px 24px 0 0;overflow:hidden}
.contato-img img{width:auto;height:auto;max-width:100%;max-height:600px;filter:drop-shadow(12px 20px 30px rgba(40,90,130,.3))}
.contato-col{display:flex;flex-direction:column;justify-content:center;padding:48px 32px;max-width:616px;margin:0 auto;width:100%}
.contato h2{font-family:var(--display);font-weight:400;font-size:clamp(2.1rem,4vw,3.4rem);text-transform:uppercase;line-height:1.08;margin:0 0 12px}
.contato-desc{font-size:15px;line-height:1.6;margin:0 0 24px}
.contato-form-caixa{background:#fff;border-radius:16px;padding:24px}
.contato-form{display:flex;flex-direction:column;gap:16px}
.form-linha-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:480px){.form-linha-2{grid-template-columns:1fr}}
.contato-form label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;color:var(--tinta)}
.contato-form input,.contato-form textarea{padding:10px 14px;border:1px solid #eadde3;border-radius:8px;font:inherit;font-size:15px;color:var(--tinta);outline:none;transition:box-shadow .2s,border-color .2s;resize:none;width:100%}
.contato-form input:focus,.contato-form textarea:focus{border-color:var(--rosa);box-shadow:0 0 0 2px rgba(233,65,139,.2)}
.contato-enviar{background:var(--tinta);color:#fff;font-weight:900;font-size:14px;letter-spacing:.1em;text-transform:uppercase;padding:12px 20px;border-radius:8px;transition:background .2s}
.contato-enviar:hover{background:var(--rosa-esc)}
.contato-nota{font-size:13px;color:var(--tinta-2);text-align:center;margin-top:12px}

/* ===== RODAPÉ ===== */
.rodape{background:var(--rosa-esc);color:#fff;position:relative}
.rodape-grade{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px;padding-top:56px;padding-bottom:48px}
@media (max-width:900px){.rodape-grade{grid-template-columns:1fr 1fr}.rodape-marca{grid-column:1/-1}}
@media (max-width:520px){.rodape-grade{padding-top:36px;padding-bottom:28px;gap:24px}}
.rodape-marca{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.rodape-logo img{width:170px;height:auto}
.rodape-logo .oval{width:130px;height:70px;font-size:30px}
.redes{display:flex;gap:10px}
.redes a{width:38px;height:38px;border-radius:50%;background:#fff;color:var(--rosa-esc);display:grid;place-items:center;transition:background .15s,color .15s}
.redes a:hover{background:var(--azul);color:var(--tinta)}
.redes svg{width:19px;height:19px}
.rodape-col h3{font-size:16px;font-weight:800;margin:0 0 16px}
.rodape-col ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.rodape-col a,.rodape-col span{font-size:13px;color:rgba(255,255,255,.85);transition:color .15s}
.rodape-col a:hover{color:var(--azul)}
.rodape-base{border-top:1px solid rgba(255,255,255,.2);padding:18px 0 calc(18px + env(safe-area-inset-bottom,0px))}
.rodape-base-l{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:11.5px;color:rgba(255,255,255,.75)}
@media (max-width:767px){.rodape-base{padding-bottom:96px}}

/* ===== WhatsApp flutuante + barra da sacola ===== */
.zap-flutua{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:44;width:60px;height:60px;border-radius:50%;background:var(--zap);color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -6px rgba(0,0,0,.45);transition:transform .5s cubic-bezier(.2,1.2,.3,1)}
.zap-flutua svg{width:32px;height:32px}
body.tem-barra .zap-flutua{transform:translateY(-76px)}
.barra-sacola{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translate(-50%,160%);width:min(440px,calc(100% - 32px));z-index:45;border-radius:14px;background:var(--tinta);color:#fff;display:flex;align-items:center;gap:12px;padding:14px 16px;font-weight:800;font-size:15px;box-shadow:0 16px 36px -12px rgba(0,0,0,.6);transition:transform .55s cubic-bezier(.2,1.2,.3,1)}
.barra-sacola.on{transform:translate(-50%,0)}
.barra-sacola .qt{background:var(--rosa);border-radius:8px;padding:2px 9px;display:inline-block}
.barra-sacola .vr{margin-left:auto}

/* ===== painéis (produto e sacola) ===== */
.veu{position:fixed;inset:0;background:rgba(30,7,18,.55);z-index:60;opacity:0;pointer-events:none;transition:opacity .4s}
.veu.on{opacity:1;pointer-events:auto}
.painel{position:fixed;left:50%;bottom:0;width:min(560px,100%);max-height:92vh;max-height:92dvh;z-index:61;background:var(--creme);color:var(--tinta);border-radius:24px 24px 0 0;transform:translate(-50%,105%);transition:transform .55s cubic-bezier(.2,.9,.2,1);display:flex;flex-direction:column;overflow:hidden}
.painel.on{transform:translate(-50%,0)}
.painel .alca{width:44px;height:5px;border-radius:3px;background:var(--linha);margin:10px auto 0;flex:none}
.painel .rola{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:8px 16px 16px}
.painel .fecha{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;z-index:2;font-size:20px;line-height:1;color:var(--tinta)}
.painel .pe{flex:none;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--linha);background:#fff}
@keyframes zoomin{from{transform:scale(1.12)}}
.selo{display:inline-block;background:var(--azul);color:var(--tinta);font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:4px 12px;border-radius:20px}
.camadas{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}
.camadas span{font-size:12.5px;font-weight:700;background:var(--rosa-bg);border:1px solid var(--linha);border-radius:8px;padding:4px 9px}
.linha-add{display:flex;gap:10px;align-items:center}
.passo{display:flex;align-items:center;background:var(--rosa-bg);border-radius:12px;border:1px solid var(--linha)}
.passo button{width:42px;height:46px;font-size:22px;font-weight:700;color:var(--rosa-esc)}
.passo button:disabled{opacity:.3;cursor:default}
.passo output{min-width:26px;text-align:center;font-weight:800;font-size:16px}
.bt{border-radius:12px;background:var(--tinta);color:#fff;font-weight:800;font-size:15.5px;padding:14px 16px;display:flex;align-items:center;justify-content:center;gap:8px;flex:1;position:relative;overflow:hidden;transition:transform .2s,background .2s}
.bt:hover{background:var(--rosa-esc)}
.bt:active{transform:scale(.97)}
.bt.zap{background:var(--zap)}
.bt.zap[aria-disabled="true"]{background:#B9D9C6;cursor:not-allowed}
@media (min-width:860px){
  #p-sacola{left:auto;right:0;top:0;bottom:0;width:440px;max-height:none;height:100%;border-radius:24px 0 0 24px;transform:translateX(105%)}
  #p-sacola.on{transform:none}
  #p-sacola .alca{display:none}
  #p-sacola .rola{padding:16px 24px}
  #p-sacola .pe{padding:14px 24px 20px}
}
.sac-titulo{font-family:var(--display);font-weight:400;font-size:32px;text-transform:uppercase;margin:10px 0 12px}
.sac-item{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px dashed var(--linha)}
.sac-item img{width:56px;height:56px;border-radius:12px;object-fit:contain;padding:3px;background:linear-gradient(160deg,var(--azul-claro),var(--azul))}
.sac-item b{display:block;font-size:14.5px;line-height:1.2}
.sac-item small{color:var(--tinta-2);font-size:12.5px}
.sac-item .passo button{width:34px;height:36px;font-size:19px}
.sac-item .passo output{min-width:20px;font-size:14px}
.sac-vazia{text-align:center;padding:10px 0 20px}
.sac-vazia img{width:190px;margin:0 auto 6px;border-radius:20px}
.sac-vazia b{font-family:var(--display);font-weight:400;font-size:24px;text-transform:uppercase;display:block}
.sac-vazia p{color:var(--tinta-2);margin:6px 0 14px}
.form{display:grid;gap:10px;margin-top:16px}
.form label{display:grid;gap:5px;font-weight:700;font-size:13.5px}
.form input,.form textarea{font:inherit;font-size:16px;border:1.5px solid var(--linha);border-radius:10px;padding:11px 12px;background:#fff;color:var(--tinta);width:100%}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--rosa);box-shadow:0 0 0 3px rgba(233,65,139,.18)}
.modo{display:grid;grid-template-columns:1fr 1fr;background:var(--rosa-bg);border:1px solid var(--linha);border-radius:12px;padding:4px;position:relative}
.modo button{padding:10px;font-weight:800;border-radius:9px;position:relative;z-index:1;transition:color .3s}
.modo button[aria-pressed="true"]{color:#fff}
.modo .pilula{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);background:var(--rosa);border-radius:9px;transition:transform .45s cubic-bezier(.2,1.1,.3,1)}
.modo.ret .pilula{transform:translateX(100%)}
.campo-end{display:grid;grid-template-rows:1fr;transition:grid-template-rows .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.campo-end.fecha-end{grid-template-rows:0fr;opacity:0}
.campo-end>label{overflow:hidden}
.total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;font-weight:700}
.total b{font-family:var(--display);font-weight:400;font-size:26px;color:var(--rosa-esc)}
.aviso{font-size:12.5px;color:var(--tinta-2);text-align:center;margin:8px 0 0}

/* pipoca que voa até a sacola */
.voa{position:fixed;left:0;top:0;width:26px;z-index:80;pointer-events:none;color:var(--pipoca);filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))}
.toast{position:fixed;left:50%;top:calc(var(--topo-h) + 14px);transform:translate(-50%,-30px);opacity:0;z-index:90;background:var(--tinta);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;font-size:14px;transition:.45s cubic-bezier(.2,1.2,.3,1);pointer-events:none;white-space:nowrap}
.toast.on{transform:translate(-50%,0);opacity:1}

/* ===== efeitos ===== */
.fx-barra{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--azul);z-index:90;pointer-events:none}
html.fx [data-revela]{opacity:0;transform:translate3d(0,34px,0);transition:opacity .9s cubic-bezier(.16,.84,.24,1),transform .9s cubic-bezier(.16,.84,.24,1);transition-delay:var(--atraso,0s)}
html.fx [data-revela="lado"]{transform:translate3d(-40px,0,0)}
html.fx [data-revela="zoom"]{transform:scale(.93)}
html.fx [data-revela].visto{opacity:1;transform:none}
.onda-clique{position:absolute;border-radius:50%;pointer-events:none;background:currentColor;opacity:.3;transform:translate(-50%,-50%) scale(0);animation:fx-onda .75s cubic-bezier(.2,.7,.2,1) forwards;z-index:0}
@keyframes fx-onda{to{transform:translate(-50%,-50%) scale(1);opacity:0}}
.ti-letras span{display:inline-block;transform:translateY(110%);opacity:0;animation:fx-letra .9s cubic-bezier(.16,.84,.24,1) forwards;animation-delay:calc(var(--atraso-base,0s) + var(--i) * 35ms)}
.ti-letras{display:inline-flex;overflow:hidden;padding-bottom:.06em}
@keyframes fx-letra{to{transform:none;opacity:1}}
@keyframes aparece{from{opacity:0;transform:translateY(14px) rotate(6deg)}}
@media (prefers-reduced-motion:reduce){
  html.fx [data-revela]{transition-duration:.01s!important;transform:none!important}
  *,*::before,*::after{animation-duration:.01s!important;animation-iteration-count:1!important;animation-delay:0s!important}
  .onda-clique{display:none}
}