:root{
  --cream:#FAF4EC;
  --ink:#1B1512;
  --pink:#F23D7F;
  --pink-deep:#D42A68;
  --peach:#FFD9C4;
  --lime:#D8E84E;
  --wa:#25D366;
  --radius:22px;
  --shadow-pop:6px 6px 0 var(--ink);
  --font-display:"Big Shoulders Display",sans-serif;
  --font-body:"Hanken Grotesk",sans-serif;
  --font-hand:"Caveat",cursive;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--ink);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--pink);color:var(--cream)}

/* grain */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
}

h1,h2,h3,.display{font-family:var(--font-display);text-transform:uppercase;line-height:.92;letter-spacing:.01em}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.hand{font-family:var(--font-hand);text-transform:none;letter-spacing:0}
.outline{color:transparent;-webkit-text-stroke:2px var(--ink)}
.outline.pink{-webkit-text-stroke:2px var(--pink)}

/* ============ HEADER ============ */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(250,244,236,.88);backdrop-filter:blur(12px);
  border-bottom:2px solid var(--ink);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-family:var(--font-display);font-weight:900;font-size:1.55rem;text-transform:uppercase;text-decoration:none;display:flex;align-items:center;gap:.5rem}
.logo .dot{width:12px;height:12px;border-radius:50%;background:var(--pink);display:inline-block}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{text-decoration:none;font-weight:600;font-size:.92rem;position:relative}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-4px;height:3px;width:0;background:var(--pink);transition:width .25s}
.nav-links a:hover::after,.nav-links a.ativo::after{width:100%}
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--font-body);font-weight:700;font-size:.95rem;
  padding:.8rem 1.5rem;border-radius:999px;text-decoration:none;
  border:2px solid var(--ink);cursor:pointer;
  transition:transform .18s,box-shadow .18s;
}
.btn:hover{transform:translate(-3px,-3px);box-shadow:var(--shadow-pop)}
.btn-pink{background:var(--pink);color:#fff}
.btn-ink{background:var(--ink);color:var(--cream)}
.btn-ghost{background:transparent}
.btn-wa{background:var(--wa);color:var(--ink)}
.nav .btn{padding:.55rem 1.2rem;font-size:.85rem}
.burger{display:none;background:none;border:none;font-size:1.6rem;cursor:pointer;color:var(--ink)}

/* ============ HERO (home) ============ */
.hero{padding:150px 0 40px;position:relative}
.hero-grid{display:grid;grid-template-columns:1.25fr .85fr;gap:2.5rem;align-items:center}
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.85rem;
  letter-spacing:.14em;text-transform:uppercase;
  background:var(--peach);border:2px solid var(--ink);border-radius:999px;
  padding:.45rem 1.1rem;margin-bottom:1.4rem;box-shadow:3px 3px 0 var(--ink);
}
.hero h1{font-size:clamp(3.4rem,9.5vw,7.6rem);font-weight:900}
.hero h1 .row{display:block}
.hero h1 .hand{
  font-size:clamp(2.6rem,7vw,5.6rem);font-weight:700;color:var(--pink);
  display:inline-block;transform:rotate(-2deg);
}
.hero-sub{font-size:1.12rem;max-width:34rem;margin:1.6rem 0 2.1rem;line-height:1.65;color:#3d332d}
.hero-ctas{display:flex;gap:1rem;flex-wrap:wrap}
.hero-note{margin-top:1.1rem;font-family:var(--font-hand);font-size:1.25rem;color:var(--pink-deep);transform:rotate(-1.5deg)}

.hero-visual{position:relative;justify-self:center}

/* retrato nas subpáginas: mesma linguagem do hero da home, em escala menor */
.page-hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:2.5rem;align-items:center}
.page-hero-grid .photo-blob{width:min(290px,78vw)}
.page-hero-grid p.lead{max-width:34rem}
.photo-blob{
  width:min(360px,80vw);aspect-ratio:3/4;border-radius:180px 180px 26px 26px;
  border:3px solid var(--ink);position:relative;overflow:hidden;
  background:linear-gradient(160deg,#ffe1ec 0%,#f0729f 100%);
  box-shadow:10px 10px 0 var(--peach),10px 10px 0 2px var(--ink);
}
.photo-blob img{width:100%;height:100%;object-fit:cover}
.sticker{
  position:absolute;font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  border:2px solid var(--ink);border-radius:14px;padding:.5rem .9rem;font-size:1rem;
  background:var(--lime);box-shadow:4px 4px 0 var(--ink);white-space:nowrap;z-index:2;
}
.sticker.s1{top:6%;left:-14%;transform:rotate(-8deg);background:var(--lime)}
.sticker.s2{bottom:16%;right:-12%;transform:rotate(5deg);background:var(--pink);color:#fff}
.sticker.s3{bottom:-5%;left:-6%;transform:rotate(-4deg);background:var(--cream)}

/* ============ PAGE HERO (subpáginas) ============ */
.page-hero{padding:140px 0 56px;border-bottom:2px solid var(--ink);position:relative;overflow:hidden}
.page-hero .sec-tag{margin-bottom:.2rem}
.page-hero h1{font-size:clamp(3rem,8vw,6rem);font-weight:900}
.page-hero p.lead{font-size:1.15rem;max-width:38rem;margin-top:1.2rem;line-height:1.65;color:#3d332d}
.crumb{font-size:.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1.2rem;display:inline-block;color:#7a6c62}
.crumb a{text-decoration:none;color:var(--pink-deep)}

/* ============ MARQUEE ============ */
.marquee{
  background:var(--pink);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);
  overflow:hidden;padding:.85rem 0;margin-top:56px;
}
.marquee.no-mt{margin-top:0}
.marquee-track{display:flex;width:max-content;animation:scroll 26s linear infinite}
.marquee span{
  font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--cream);
  text-transform:uppercase;padding:0 1.2rem;white-space:nowrap;
}
.marquee span em{font-style:normal;color:var(--ink)}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ============ SEÇÕES ============ */
section{padding:96px 0}
.sec-head{margin-bottom:3rem}
.sec-tag{
  font-family:var(--font-hand);font-size:1.5rem;color:var(--pink-deep);
  display:inline-block;transform:rotate(-2deg);margin-bottom:.4rem;
}
.sec-head h2{font-size:clamp(2.6rem,6vw,4.6rem);font-weight:900}
.sec-link{margin-top:1rem;display:inline-block;font-weight:700;text-decoration:none;border-bottom:3px solid var(--pink)}
.sec-link:hover{color:var(--pink-deep)}

/* SOBRE */
.sobre-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.sobre-copy p{font-size:1.08rem;line-height:1.7;color:#3d332d;margin-bottom:1.1rem}
.sobre-copy strong{color:var(--ink)}
.pillars{display:flex;flex-direction:column;gap:1.1rem}
.pillar{
  display:flex;gap:1.2rem;align-items:flex-start;background:#fff;
  border:2px solid var(--ink);border-radius:var(--radius);padding:1.3rem 1.5rem;
  transition:transform .18s,box-shadow .18s;
}
.pillar:hover{transform:translate(-4px,-4px);box-shadow:var(--shadow-pop)}
.pillar .num{
  font-family:var(--font-display);font-weight:900;font-size:2rem;color:var(--pink);
  line-height:1;min-width:2.4rem;
}
.pillar h3{font-size:1.35rem;margin-bottom:.3rem}
.pillar p{font-size:.98rem;line-height:1.55;color:#4a403a}

/* polaroid / foto solta */
.polaroid{
  background:#fff;border:2px solid var(--ink);border-radius:14px;padding:.8rem .8rem 1rem;
  box-shadow:8px 8px 0 var(--peach),8px 8px 0 2px var(--ink);transform:rotate(2deg);
}
.polaroid img{border-radius:8px;border:1.5px solid var(--ink)}
.polaroid figcaption{font-family:var(--font-hand);font-size:1.25rem;text-align:center;margin-top:.6rem;color:var(--pink-deep)}

/* HISTÓRIA (cards estilo carrossel IG) */
.historia-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8rem}
.hist-card{
  border:2.5px solid var(--ink);border-radius:18px;overflow:hidden;background:#fff;
  box-shadow:7px 7px 0 var(--ink);transition:transform .2s;
}
.hist-card:nth-child(1){transform:rotate(-1.6deg)}
.hist-card:nth-child(2){transform:rotate(1deg) translateY(12px)}
.hist-card:nth-child(3){transform:rotate(2deg)}
.hist-card:hover{transform:translateY(-8px) rotate(0)}
.hist-card img{width:100%;aspect-ratio:1;object-fit:cover}
.hist-card figcaption{padding:.9rem 1rem;font-family:var(--font-hand);font-size:1.3rem;color:var(--pink-deep);text-align:center}

/* grid de fotos lifestyle */
.life-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.life-grid figure{border:2.5px solid var(--ink);border-radius:16px;overflow:hidden;box-shadow:6px 6px 0 var(--ink);position:relative}
.life-grid img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4;transition:transform .35s}
.life-grid figure:hover img{transform:scale(1.05)}
.life-grid figure.wide{grid-column:span 2}
.life-grid figure.wide img{aspect-ratio:16/10}

/* CUPONS */
.sec-peach{background:var(--peach);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.filtros{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2.4rem}
.chip{
  font-family:var(--font-body);font-weight:700;font-size:.85rem;
  border:2px solid var(--ink);background:#fff;border-radius:999px;
  padding:.5rem 1.1rem;cursor:pointer;transition:all .15s;
}
.chip:hover{background:var(--lime)}
.chip.active{background:var(--ink);color:var(--cream)}
.cupons-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.cupom-card{
  background:#fff;border:2px solid var(--ink);border-radius:var(--radius);
  padding:1.5rem;display:flex;flex-direction:column;gap:.9rem;
  transition:transform .18s,box-shadow .18s;position:relative;
}
.cupom-card:hover{transform:translate(-4px,-4px);box-shadow:var(--shadow-pop)}
.cupom-top{display:flex;align-items:center;gap:.9rem}
.mono{
  width:52px;height:52px;border-radius:14px;border:2px solid var(--ink);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  font-family:var(--font-display);font-weight:900;font-size:1.4rem;color:var(--ink);
}
.cupom-card h3{font-size:1.3rem;line-height:1}
.cat{
  font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  background:var(--peach);border:1.5px solid var(--ink);border-radius:6px;
  padding:.15rem .5rem;display:inline-block;margin-top:.35rem;
}
.cupom-card>p{font-size:.93rem;line-height:1.5;color:#4a403a;flex-grow:1}
.code-row{display:flex;gap:.6rem;align-items:stretch}
.code{
  flex:1;display:flex;align-items:center;justify-content:center;
  border:2px dashed var(--pink);border-radius:12px;background:#FFF0F6;
  font-weight:800;letter-spacing:.12em;font-size:.98rem;color:var(--pink-deep);
  padding:.55rem .5rem;cursor:pointer;user-select:none;transition:background .15s;
}
.code:hover{background:#FFE1EE}
.code.copied{background:var(--lime);border-color:var(--ink);color:var(--ink)}
.code-row .go{
  display:flex;align-items:center;justify-content:center;width:46px;
  border:2px solid var(--ink);border-radius:12px;background:var(--pink);color:#fff;
  text-decoration:none;font-weight:800;font-size:1.1rem;transition:transform .15s;
}
.code-row .go:hover{transform:scale(1.08)}
/* card sem cupom (vitrine de links): o botao ocupa a linha toda */
.code-row .go.wide{width:100%;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;gap:.4rem}
.cupons-note{
  margin-top:2.2rem;text-align:center;font-family:var(--font-hand);
  font-size:1.4rem;color:var(--pink-deep);transform:rotate(-1deg);
}

/* passos (como usar cupom) */
.passos{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:1rem}
.passo{background:#fff;border:2px solid var(--ink);border-radius:var(--radius);padding:1.6rem}
.passo .pnum{
  font-family:var(--font-display);font-weight:900;font-size:2.6rem;color:var(--pink);line-height:1;
}
.passo h3{font-size:1.25rem;margin:.5rem 0 .4rem}
.passo p{font-size:.95rem;line-height:1.55;color:#4a403a}

/* COMUNIDADE (dark) */
.sec-dark{background:var(--ink);color:var(--cream);position:relative;overflow:hidden}
.sec-dark .sec-tag{color:var(--lime)}
.comu-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:center;position:relative;z-index:1}
.comu-title{font-size:clamp(3rem,8vw,6.4rem);font-weight:900;color:var(--cream)}
.comu-title .outline-l{color:transparent;-webkit-text-stroke:2px var(--pink)}
.comu-copy{font-size:1.1rem;line-height:1.7;color:#d9cfc6;margin:1.4rem 0 2rem;max-width:32rem}
.comu-perks{list-style:none;display:flex;flex-direction:column;gap:.8rem;margin-bottom:2.2rem}
.comu-perks li{display:flex;gap:.7rem;align-items:baseline;font-size:1rem;color:#efe7de}
.comu-perks li::before{content:"👊🏽";flex-shrink:0}
.comu-card{
  background:#241C18;border:2px solid var(--pink);border-radius:var(--radius);
  padding:1.2rem 1.2rem 2rem;text-align:center;transform:rotate(1.5deg);
  box-shadow:8px 8px 0 var(--pink);
}
.comu-card img{border-radius:14px;border:2px solid var(--pink);margin-bottom:1.2rem;aspect-ratio:4/5;object-fit:cover;width:100%}
.comu-card h3{font-size:1.9rem;color:var(--cream);margin-bottom:.6rem}
.comu-card p{color:#c9bdb3;font-size:.98rem;line-height:1.55;margin-bottom:1.6rem}
.big-ghost{
  position:absolute;bottom:-2.2rem;left:0;right:0;text-align:center;
  font-family:var(--font-display);font-weight:900;font-size:clamp(6rem,17vw,15rem);
  text-transform:uppercase;color:transparent;-webkit-text-stroke:1px rgba(250,244,236,.14);
  pointer-events:none;white-space:nowrap;line-height:1;
}
.dark-panel{
  background:#241C18;border:2px solid #3a2f28;border-radius:var(--radius);padding:1.8rem;
}
.dark-panel h3{color:var(--lime);font-size:1.4rem;margin-bottom:.6rem}
.dark-panel p,.dark-panel li{color:#d9cfc6;font-size:1rem;line-height:1.65}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}

/* CONTEÚDO — capas de vídeo */
.feed-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-bottom:2.6rem}
.cover{
  aspect-ratio:9/16;border-radius:28px;border:3px solid var(--ink);position:relative;overflow:hidden;
  box-shadow:7px 7px 0 var(--ink);transition:transform .2s;display:block;text-decoration:none;
}
.cover img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.cover:hover{transform:translateY(-8px) rotate(0deg) !important}
.cover:hover img{transform:scale(1.06)}
.cover:nth-child(1){transform:rotate(-2.5deg)}
.cover:nth-child(2){transform:rotate(1.2deg) translateY(14px)}
.cover:nth-child(3){transform:rotate(2.6deg)}
.cover .play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:64px;height:64px;border-radius:50%;background:rgba(250,244,236,.92);
  border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:1.4rem;z-index:2;color:var(--ink);
}
.cover .cap{
  position:absolute;left:0;right:0;bottom:0;padding:2.2rem 1rem 1rem;
  font-family:var(--font-hand);font-size:1.35rem;color:var(--cream);z-index:2;
  background:linear-gradient(transparent,rgba(27,21,18,.85));
}
.follow-row{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* CTA faixa final */
.cta-band{padding:80px 0;text-align:center}
.cta-band h2{font-size:clamp(2.4rem,6vw,4.2rem);margin-bottom:1.6rem}

/* FOOTER */
footer{background:var(--ink);color:#b7aca2;border-top:3px solid var(--pink);padding:56px 0 32px}
.foot-grid{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;margin-bottom:2.4rem}
.foot-brand{font-family:var(--font-display);font-weight:900;font-size:1.8rem;color:var(--cream);text-transform:uppercase}
.foot-links{display:flex;gap:1.6rem;list-style:none;flex-wrap:wrap}
.foot-links a{text-decoration:none;font-size:.92rem}
.foot-links a:hover{color:var(--pink)}
.foot-note{font-size:.8rem;border-top:1px solid #3a3029;padding-top:1.4rem;line-height:1.6}
.foot-note .tag{color:var(--lime)}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* toast */
#toast{
  position:fixed;bottom:26px;left:50%;transform:translate(-50%,120px);
  background:var(--ink);color:var(--cream);border:2px solid var(--lime);
  border-radius:999px;padding:.7rem 1.5rem;font-weight:700;font-size:.92rem;
  z-index:1000;transition:transform .3s ease;pointer-events:none;
}
#toast.show{transform:translate(-50%,0)}

/* ============ ADIÇÕES — briefing jul/2026 (estrategista + desafio pago) ============ */
/* métricas / prova social (mídia kit) */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:1.6rem}
.stat{background:#fff;border:2px solid var(--ink);border-radius:var(--radius);padding:1.4rem 1.2rem;box-shadow:5px 5px 0 var(--ink)}
.stat .snum{font-family:var(--font-display);font-weight:900;font-size:2.3rem;line-height:1;color:var(--pink)}
.stat .slabel{font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#4a403a;margin-top:.4rem}
.stats-note{font-family:var(--font-hand);font-size:1.25rem;color:var(--pink-deep);margin-top:1rem;transform:rotate(-1deg)}
.sec-dark .stat{background:#241C18;border-color:var(--pink)}
/* ao lado do retrato a coluna encurta: 2x2 em vez de 4 em linha */
.comu-grid .stats{grid-template-columns:repeat(2,1fr);margin-top:0}
.sec-dark .stat .slabel{color:#c9bdb3}

/* chips de marcas parceiras */
.brand-chips{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}
.bchip{font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:1rem;
  border:2px solid var(--ink);border-radius:999px;padding:.5rem 1.1rem;background:#fff;box-shadow:3px 3px 0 var(--ink)}
.sec-dark .bchip{background:#241C18;color:var(--cream)}

/* selo de preço */
.price-tag{display:inline-flex;align-items:baseline;gap:.5rem;background:var(--lime);border:2px solid var(--ink);
  border-radius:16px;padding:.55rem 1.1rem;box-shadow:4px 4px 0 var(--ink);transform:rotate(-1.5deg)}
.price-tag .pv{font-family:var(--font-display);font-weight:900;font-size:1.9rem;line-height:1;color:var(--ink)}
.price-tag .pl{font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink)}

/* depoimentos */
.depos{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem}
.depo{background:#241C18;border:2px solid #3a2f28;border-radius:var(--radius);padding:1.5rem}
.depo p{color:#d9cfc6;font-size:1rem;line-height:1.6;font-style:italic}
.depo .who{display:block;margin-top:.9rem;font-family:var(--font-hand);font-style:normal;font-size:1.25rem;color:var(--lime)}

/* ============ RESPONSIVO ============ */
@media(max-width:960px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .depos{grid-template-columns:1fr}
  .cupons-grid{grid-template-columns:repeat(2,1fr)}
  .hero-grid,.page-hero-grid{grid-template-columns:1fr;gap:3.5rem}
  .hero-visual{margin-top:1rem}
  .sobre-grid,.comu-grid,.grid-2{grid-template-columns:1fr;gap:2.5rem}
  .historia-grid,.passos{grid-template-columns:1fr;gap:2rem}
  .hist-card:nth-child(2){transform:rotate(1deg)}
  .life-grid{grid-template-columns:repeat(2,1fr)}
  .life-grid figure.wide{grid-column:span 2}
  .sticker.s1{left:-4%}
  .sticker.s2{right:-4%}
}
@media(max-width:820px){
  .nav-links{
    display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;
    background:var(--cream);border-bottom:2px solid var(--ink);padding:1.4rem 24px;gap:1.1rem;
  }
  .nav-links.open{display:flex}
  .burger{display:block}
  .nav .btn{display:none}
}
@media(max-width:640px){
  section{padding:64px 0}
  .hero{padding-top:120px}
  .page-hero{padding:120px 0 44px}
  .cupons-grid,.feed-grid,.life-grid{grid-template-columns:1fr}
  .life-grid figure.wide{grid-column:span 1}
  .cover{width:100%;max-width:300px;margin:0 auto}
  .hero-ctas .btn{width:100%;justify-content:center}
  .code{font-size:.88rem;letter-spacing:.08em}
}

/* ============ HOVER DOS CARDS — padronização jul/2026 ============ */
/* Idioma da casa: card com borda faz "pop" (translate -4,-4 + sombra dura);
   card torto/fotográfico faz "lift". A sombra --shadow-pop é ink: em fundo
   escuro ela some, por isso .sec-dark e a página do Goxxtosas usam pink/lima. */

.passo{transition:transform .2s,box-shadow .2s}
.passo:hover{transform:translate(-4px,-4px);box-shadow:var(--shadow-pop)}

.stat{transition:transform .2s,box-shadow .2s}
.stat:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--ink)}
.sec-dark .stat:hover{box-shadow:8px 8px 0 var(--pink)}

.comu-card{transition:transform .25s,box-shadow .25s}
.comu-card:hover{transform:rotate(0deg) translateY(-6px);box-shadow:12px 12px 0 var(--pink)}

.depo{transition:transform .2s,box-shadow .2s,border-color .2s}
.depo:hover{transform:translate(-4px,-4px);border-color:var(--lime);box-shadow:6px 6px 0 var(--lime)}

@media(prefers-reduced-motion:reduce){
  .passo,.stat,.comu-card,.depo{transition:none}
  .passo:hover,.stat:hover,.depo:hover{transform:none}
  .comu-card:hover{transform:none}
}

/* Redeclarados DEPOIS de .reveal.in (l.314) de propósito: como todo card tem
   class="... reveal", o transform:none do .reveal.in vencia por ordem (mesma
   especificidade 0-2-0) e matava o movimento — sobrava só a sombra. */
.pillar:hover{transform:translate(-4px,-4px)}
.cupom-card:hover{transform:translate(-4px,-4px)}
.hist-card:hover{transform:translateY(-8px) rotate(0)}

@media(prefers-reduced-motion:reduce){
  .pillar:hover,.cupom-card:hover,.hist-card:hover{transform:none}
}

/* ============ CURSOR EMOJI 3D — jul/2026 ============ */
/* Arte: Fluent Emoji 3D (Microsoft, MIT) — mesmo modelo nas duas pontas.
   TOM DE PELE: pasta "Medium" do repo (= 🏽, o mesmo dos emojis do site,
   pedido da cliente em 20/08/2026). Se mudar o tom dos emojis, trocar aqui
   também: microsoft/fluentui-emoji › assets › Backhand index pointing up|down › Medium › 3D.
   PNG, não SVG: Chrome não suporta cursor SVG. 32px (browser ignora >128px).
   O padrão é o 👇 girado 150°: fica na MESMA silhueta da seta do SO — ponta do
   dedo em cima-à-esquerda, corpo da mão embaixo-à-direita. Girar mudou a ponta
   de lugar, então o hotspot foi remedido nos pixels: 17 0 (topo).
   O 👆 do clicável tem a ponta em 11 0. Fallback após a vírgula se o PNG cair. */

body{cursor:url("../img/cursor-down.png?v=2") 17 0, auto}

a,button,.btn,.chip,.code,.cover,.go,.burger,summary,label,[role="button"]{
  cursor:url("../img/cursor-up.png?v=2") 11 0, pointer;
}

/* texto continua com cursor de texto — não atrapalhar seleção/leitura */
input,textarea,select,p,h1,h2,h3{cursor:auto}
a p,a h1,a h2,a h3,.cover *,.btn *{cursor:inherit}

/* touch não tem cursor: evita custo à toa */
@media (hover:none){
  body,a,button,.btn,.chip,.code,.cover,.go,.burger{cursor:auto}
}

/* ============ ANTES x DEPOIS (Projeto Goxxtosas — ago/2026) ============ */
.ad-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(.8rem,3.5vw,1.8rem);
  max-width:720px;margin:0 auto;position:relative;align-items:start;
}
.ad-card{
  position:relative;margin:0;background:var(--cream);
  border:3px solid var(--cream);border-radius:var(--radius);
  overflow:hidden;box-shadow:8px 8px 0 var(--pink);
  transition:transform .25s,box-shadow .25s;
}
.ad-card:first-of-type{transform:rotate(-1.4deg)}
.ad-card:last-of-type{transform:rotate(1.4deg)}
.ad-card:hover{transform:rotate(0) translateY(-6px);box-shadow:12px 12px 0 var(--lime)}
.ad-card img{display:block;width:100%;aspect-ratio:9/16;object-fit:cover}
.ad-tag{
  position:absolute;top:10px;left:10px;z-index:2;
  font-family:var(--font-display);font-weight:900;text-transform:uppercase;
  letter-spacing:.06em;font-size:clamp(.72rem,2.4vw,.9rem);
  padding:.35rem .85rem;border:2px solid var(--ink);border-radius:999px;
  box-shadow:3px 3px 0 var(--ink);
}
.ad-tag.antes{background:var(--cream);color:var(--ink)}
.ad-tag.depois{background:var(--pink);color:#fff}
.ad-seta{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-4deg);
  z-index:3;width:clamp(42px,11vw,62px);height:clamp(42px,11vw,62px);
  display:grid;place-items:center;border-radius:50%;
  background:var(--lime);border:3px solid var(--ink);
  box-shadow:4px 4px 0 var(--ink);
  font-family:var(--font-display);font-weight:900;font-size:clamp(1.1rem,3.5vw,1.6rem);
  color:var(--ink);
}
.ad-note{
  text-align:center;margin-top:1.6rem;
  font-family:var(--font-hand);font-size:1.35rem;color:var(--lime);
  transform:rotate(-1.2deg);
}
@media(prefers-reduced-motion:reduce){
  .ad-card,.ad-card:hover{transition:none;transform:none}
}
