/* =========================================================
   Dra. Marilia Fernandes Mathias — Odontopediatria
   Paleta retirada das cores reais do consultório:
   parede menta, faixa rosa, cadeira turquesa, barquinho coral,
   patinho amarelo.
   ========================================================= */

:root{
  --menta:        #A9DCD0;
  --menta-clara:  #E9F6F1;
  --menta-fundo:  #F4FBF8;
  --rosa:         #F3DAE0;
  --rosa-clara:   #FBEEF1;
  --turquesa:     #1F8C86;
  --turquesa-esc: #10514E;
  --tinta:        #123B39;
  --coral:        #EF6C4D;
  --coral-esc:    #D2543A;
  --amarelo:      #FFC24B;
  --branco:       #FFFFFF;
  --cinza:        #5E7B78;

  --disp: "Fraunces", Georgia, serif;
  --corpo: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mao: "Caveat", cursive;

  --r-g: 28px;
  --r-m: 18px;
  --r-p: 12px;

  --sombra-s: 0 2px 8px rgba(18,59,57,.06);
  --sombra-m: 0 10px 30px rgba(18,59,57,.10);
  --sombra-g: 0 22px 60px rgba(18,59,57,.16);

  --wrap: min(1160px, 90vw);
}

*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }

html{ scroll-behavior:smooth; scroll-padding-top:96px; }

body{
  margin:0;
  background:var(--menta-fundo);
  color:var(--tinta);
  font-family:var(--corpo);
  font-size:clamp(16px,.55vw + 14px,17.5px);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; height:auto; display:block; }

h1,h2,h3{
  font-family:var(--disp);
  font-variation-settings:"SOFT" 40,"WONK" 1;
  line-height:1.08;
  letter-spacing:-.015em;
  margin:0 0 .5em;
  font-weight:600;
}

h1{ font-size:clamp(2.5rem,6vw,4.4rem); }
h2{ font-size:clamp(1.9rem,3.4vw,3rem); }
h3{ font-size:clamp(1.15rem,1.4vw,1.35rem); letter-spacing:-.005em; }

p{ margin:0 0 1em; }
a{ color:inherit; }

.wrap{ width:var(--wrap); margin-inline:auto; }

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--turquesa); color:#fff; padding:12px 20px; border-radius:0 0 12px 0;
}
.skip:focus{ left:0; }

:focus-visible{ outline:3px solid var(--coral); outline-offset:3px; border-radius:4px; }

.eyebrow{
  font:700 .72rem/1 var(--corpo);
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--turquesa); margin:0 0 1rem;
}

.nota-mao{
  font-family:var(--mao);
  font-size:1.4rem; color:var(--turquesa);
  transform:rotate(-2.5deg);
  margin:1.6rem 0 0; opacity:.9;
}
.nota-mao-esq{ transform:rotate(2deg); }

/* ---------- BALÃO: NÃO ATENDEMOS CONVÊNIOS ---------- */
.balao-convenios{
  position:relative;
  display:inline-block;
  margin:1.5rem 0 0;
  padding:.85rem 1.5rem;
  background:var(--coral);
  color:#fff;
  font:700 1rem/1.3 var(--corpo);
  border-radius:100px;
  box-shadow:0 10px 24px rgba(239,108,77,.35);
  animation:balao-pulsa 2.6s ease-in-out infinite;
}
.balao-convenios b{ font-weight:800; }
.balao-convenios::after{
  content:"";
  position:absolute; left:32px; bottom:-9px;
  width:0; height:0;
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-top:10px solid var(--coral);
}
@keyframes balao-pulsa{
  0%,100%{ transform:translateY(0) rotate(-1.2deg); }
  50%    { transform:translateY(-5px) rotate(-1.2deg); }
}
.balao-contato{
  margin:1.8rem 0 1.6rem;
  background:var(--amarelo);
  color:var(--turquesa-esc);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.balao-contato::after{ border-top-color:var(--amarelo); }
@media (prefers-reduced-motion:reduce){
  .balao-convenios{ animation:none; }
}

.alerta-forte{
  display:inline-block;
  background:#FFE9E2;
  color:var(--coral-esc);
  padding:.12rem .5rem;
  border-radius:8px;
  font-weight:800;
}

/* ---------- BOTÕES ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font:700 .95rem/1 var(--corpo);
  padding:1.05rem 1.9rem; border-radius:100px;
  border:2px solid transparent; cursor:pointer;
  text-decoration:none; transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.btn svg{ width:20px; height:20px; fill:currentColor; }
.btn:hover{ transform:translateY(-3px); }

.btn-coral{ background:var(--coral); color:#fff; box-shadow:0 10px 24px rgba(239,108,77,.32); }
.btn-coral:hover{ background:var(--coral-esc); box-shadow:0 16px 34px rgba(239,108,77,.4); }

.btn-turq{ background:var(--turquesa); color:#fff; box-shadow:0 10px 24px rgba(31,140,134,.3); }
.btn-turq:hover{ background:var(--turquesa-esc); }

.btn-ghost{ background:transparent; color:var(--turquesa-esc); border-color:rgba(31,140,134,.4); }
.btn-ghost:hover{ background:rgba(31,140,134,.1); border-color:var(--turquesa); }

.btn-sm{ padding:.7rem 1.25rem; font-size:.85rem; }

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(244,251,248,.82);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(31,140,134,.12);
}
.nav-inner{
  width:var(--wrap); margin-inline:auto;
  display:flex; align-items:center; gap:1.4rem;
  min-height:72px;
}
.nav-brand{ display:flex; align-items:center; gap:.65rem; text-decoration:none; margin-right:auto; }
.nav-tooth{ width:30px; height:33px; flex:none; }
.nav-marca{
  height:38px; width:38px; object-fit:contain; object-position:center;
  flex:none; padding:3px; border-radius:50%;
  background:var(--menta-clara); box-shadow:inset 0 0 0 1.5px rgba(31,140,134,.18);
}
.nav-brand:hover .nav-marca{ animation:pulinho .5s ease; }
.nav-tooth path:first-of-type{ fill:#fff; stroke:var(--turquesa); stroke-width:2.4; stroke-linejoin:round; }
.nav-tooth .eye{ fill:var(--turquesa-esc); }
.nav-tooth .smile{ fill:none; stroke:var(--turquesa-esc); stroke-width:2; stroke-linecap:round; }
.nav-brand:hover .nav-tooth{ animation:pulinho .5s ease; }

.nav-name{ display:flex; flex-direction:column; line-height:1.1; }
.nav-name b{ font-family:var(--disp); font-weight:600; font-size:1.05rem; }
.nav-name i{ font-style:normal; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--cinza); }

.nav-links{ display:flex; gap:1.5rem; }
.nav-links a{
  font-size:.87rem; font-weight:600; text-decoration:none; color:var(--tinta);
  padding:.3rem 0; position:relative;
}
.nav-links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:2px;
  background:var(--coral); border-radius:2px; transition:right .25s ease;
}
.nav-links a:hover::after{ right:0; }

.burger{ display:none; width:44px; height:44px; border:0; background:transparent; cursor:pointer; padding:10px; }
.burger span{ display:block; height:2.5px; background:var(--tinta); border-radius:2px; margin:4px 0; transition:.25s ease; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* ---------- HERO / PAREDE ---------- */
.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#BEE5DB 0%,var(--menta) 55%,#9BD3C7 100%);
  padding:clamp(56px,7vw,96px) 0 180px;
}

.sky{ position:absolute; inset:0; pointer-events:none; }
.cloud{ position:absolute; fill:rgba(255,255,255,.78); width:130px; }
.c1{ top:9%;  left:-14%; width:170px; animation:deriva 62s linear infinite; }
.c2{ top:26%; left:-30%; width:110px; opacity:.7; animation:deriva 84s linear infinite 6s; }
.c3{ top:52%; left:-24%; width:150px; opacity:.6; animation:deriva 100s linear infinite 20s; }
.c4{ top:70%; left:-40%; width:90px;  opacity:.5; animation:deriva 74s linear infinite 34s; }

@keyframes deriva{ to{ transform:translateX(180vw); } }

.borboleta{ position:absolute; width:38px; top:38%; left:8%; animation:voo 26s ease-in-out infinite; }
.borboleta path{ fill:#EBA7BC; }
.borboleta .corpo{ fill:none; stroke:#8B5C6B; stroke-width:2.2; stroke-linecap:round; }
.borboleta .asa-e{ transform-origin:20px 17px; animation:asa 1.1s ease-in-out infinite; }
.borboleta .asa-d{ transform-origin:20px 17px; animation:asa 1.1s ease-in-out infinite reverse; }
@keyframes asa{ 50%{ transform:scaleX(.35); } }
@keyframes voo{
  0%{ transform:translate(0,0) } 20%{ transform:translate(20vw,-8vh) }
  45%{ transform:translate(42vw,6vh) } 70%{ transform:translate(64vw,-10vh) }
  100%{ transform:translate(88vw,4vh) }
}

.hero-grid{
  position:relative; z-index:2;
  display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,5vw,4.5rem); align-items:center;
}
.hero-text h1{ color:var(--turquesa-esc); text-shadow:0 2px 0 rgba(255,255,255,.35); }
.hero-text h1 em{ font-style:italic; color:var(--coral-esc); font-variation-settings:"SOFT" 60,"WONK" 1; }
.hero-text .eyebrow{ color:var(--turquesa-esc); }
.lead{ font-size:clamp(1.02rem,1.2vw,1.18rem); max-width:34em; color:#1A5C58; font-weight:500; }
.hero-acoes{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem; }
.hero-acoes .btn-ghost{ color:var(--turquesa-esc); border-color:rgba(16,81,78,.45); background:rgba(255,255,255,.35); }
.hero-acoes .btn-ghost:hover{ background:rgba(255,255,255,.7); }

/* logo do hero */
.hero-selo{ display:flex; flex-direction:column; align-items:center; }
.logo-palco{ position:relative; width:min(360px,74vw); }
.logo-img{
  width:100%; height:auto; position:relative; z-index:2;
  filter:drop-shadow(0 14px 26px rgba(18,59,57,.18));
  animation:logo-entra 1.1s cubic-bezier(.2,.9,.3,1.3) both .15s, logo-boia 6s ease-in-out infinite 1.3s;
  transform-origin:50% 70%;
}
@keyframes logo-entra{
  0%{ opacity:0; transform:scale(.72) translateY(26px) rotate(-4deg); }
  60%{ opacity:1; }
  100%{ opacity:1; transform:scale(1) translateY(0) rotate(0); }
}
@keyframes logo-boia{ 50%{ transform:translateY(-10px) rotate(.8deg); } }

.bolhas{ position:absolute; inset:0; width:100%; height:100%; z-index:1; overflow:visible; }
.bolhas .b{ fill:rgba(255,255,255,.75); stroke:rgba(255,255,255,.95); stroke-width:1.5; opacity:0; }
.bolhas .b1{ animation:sobe 6s ease-in-out infinite 1.4s; }
.bolhas .b2{ animation:sobe 7.5s ease-in-out infinite 2.2s; }
.bolhas .b3{ animation:sobe 5.5s ease-in-out infinite 3.1s; }
.bolhas .b4{ animation:sobe 8s ease-in-out infinite 1.9s; }
.bolhas .b5{ animation:sobe 6.8s ease-in-out infinite 4s; }
.bolhas .b6{ animation:sobe 7s ease-in-out infinite 2.7s; }
@keyframes sobe{
  0%{ opacity:0; transform:translateY(0) scale(.5); }
  15%{ opacity:.9; }
  70%{ opacity:.7; }
  100%{ opacity:0; transform:translateY(-170px) translateX(14px) scale(1.15); }
}

.selo-sub{
  font-family:var(--mao); font-size:1.35rem; color:var(--turquesa-esc);
  margin:.9rem 0 0; opacity:0; animation:surgir .8s ease forwards 1.1s;
}
@keyframes surgir{ to{ opacity:1; } }

/* grama e rodapé de parede */
.grama{ position:absolute; left:0; right:0; bottom:26px; height:120px; z-index:1; }
.grama-svg{ width:100%; height:100%; }
.grama-svg .morro{ fill:rgba(140,205,140,.5); }
.grama-svg .tufos path{ fill:#6FB86B; opacity:.85; }
.grama-svg .taboas path{ stroke:#7CA55B; stroke-width:2.4; fill:none; }
.grama-svg .taboas ellipse{ fill:#A2793F; }

.rodape-parede{
  position:absolute; left:0; right:0; bottom:0; height:26px;
  background:var(--rosa);
  border-top:7px solid #fff;
  box-shadow:0 -3px 6px rgba(18,59,57,.07);
}

/* ---------- FAIXA DE INFOS ---------- */
.faixa{ background:var(--rosa); padding:1.6rem 0 2rem; }
.faixa-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.chip{
  display:flex; gap:.85rem; align-items:center;
  background:rgba(255,255,255,.62); border-radius:var(--r-m);
  padding:1rem 1.1rem; transition:transform .2s ease, background .2s ease;
}
.chip:hover{ transform:translateY(-4px); background:#fff; }
a.chip{ text-decoration:none; color:inherit; }
.chip svg{ width:26px; height:26px; flex:none; fill:none; stroke:var(--turquesa); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.chip .ico-chip-wa{ fill:#25D366; stroke:none; }
.chip .estrela{ fill:var(--amarelo); stroke:var(--amarelo); }
.chip b{ display:block; font-size:.95rem; }
.chip span{ display:block; font-size:.78rem; color:var(--cinza); line-height:1.4; }

/* ---------- SEÇÕES ---------- */
.sec{ padding:clamp(70px,8.5vw,130px) 0; position:relative; }
.sec-clara{ background:var(--menta-fundo); }
.sec-menta{ background:var(--menta-clara); }
.sec-rosa{ background:var(--rosa-clara); }
.sec-escura{ background:linear-gradient(160deg,var(--turquesa-esc),#17706C); color:#EAF6F2; }

.cabeca{ max-width:44rem; margin-bottom:clamp(2.4rem,4vw,3.6rem); }
.cabeca .sub{ color:var(--cinza); font-size:1.02rem; margin:0; }
.sec-escura .cabeca .sub{ color:rgba(234,246,242,.75); }

/* ---------- SOBRE ---------- */
.sobre-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.sobre-fotos{ position:relative; padding-bottom:2.5rem; }
.foto{ margin:0; }
.foto img{ border-radius:var(--r-g); box-shadow:var(--sombra-g); }
.foto-grande{ position:relative; }
.foto-grande figcaption{
  font-family:var(--mao); font-size:1.25rem; color:var(--turquesa);
  margin-top:.9rem; max-width:19rem;
}
.foto-peq,.foto-peq2{ position:absolute; }
.foto-peq{ width:40%; right:-4%; bottom:24%; }
.foto-peq img{ border-radius:var(--r-m); border:6px solid #fff; box-shadow:var(--sombra-m); }
.foto-peq2{ width:19%; left:-6%; top:8%; }
.foto-peq2 img{ border-radius:var(--r-m); border:6px solid #fff; box-shadow:var(--sombra-m); }
.foto-peq{ animation:flutua 7s ease-in-out infinite; }
.foto-peq2{ animation:flutua 9s ease-in-out infinite 1.5s; }
@keyframes flutua{ 50%{ transform:translateY(-12px); } }

.lista-check{ list-style:none; padding:0; margin:2rem 0 0; display:grid; gap:.7rem; }
.lista-check li{ position:relative; padding-left:2rem; font-weight:500; }
.lista-check li::before{
  content:""; position:absolute; left:0; top:.42em; width:18px; height:18px; border-radius:50%;
  background:var(--menta);
  box-shadow:inset 0 0 0 2px var(--turquesa);
}
.lista-check li::after{
  content:""; position:absolute; left:5px; top:.72em; width:8px; height:4px;
  border-left:2.4px solid var(--turquesa-esc); border-bottom:2.4px solid var(--turquesa-esc);
  transform:rotate(-45deg);
}

/* ---------- CARDS DE SERVIÇO ---------- */
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.2rem; align-items:start; }
.card.aberto{ grid-column:1 / -1; }
@media (min-width:900px){
  .card.aberto .card-corpo p,
  .card.aberto .card-corpo ul,
  .card.aberto .card-corpo .quando{ padding-inline:2rem; }
  .card.aberto .card-acao{ padding-inline:2rem; }
}
.card{
  background:#fff; border-radius:var(--r-g); box-shadow:var(--sombra-s);
  border:1.5px solid rgba(31,140,134,.14); overflow:hidden;
  transition:box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.card:hover{ box-shadow:var(--sombra-m); transform:translateY(-4px); border-color:rgba(31,140,134,.35); }
.card.aberto{ border-color:var(--turquesa); box-shadow:var(--sombra-m); }

.card-topo{
  width:100%; display:flex; align-items:center; gap:1rem; text-align:left;
  background:none; border:0; cursor:pointer; padding:1.5rem 1.5rem; font:inherit; color:inherit;
}
.card .ico{
  width:52px; height:52px; flex:none; border-radius:16px;
  background:var(--menta-clara); display:grid; place-items:center;
  transition:background .25s ease, transform .35s ease;
}
.card:hover .ico{ background:var(--menta); transform:rotate(-6deg); }
.card .ico svg{ width:28px; height:28px; fill:none; stroke:var(--turquesa-esc); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.card .ico svg .pt{ fill:var(--coral); stroke:none; }
.card .ico svg .raio{ stroke:var(--coral); stroke-width:2; }
.card .ico svg .raiz{ stroke-dasharray:3 3; }
.card-tit{ font-family:var(--disp); font-weight:600; font-size:1.1rem; line-height:1.25; flex:1; }

.mais{ width:26px; height:26px; flex:none; position:relative; }
.mais::before,.mais::after{
  content:""; position:absolute; inset:50% 3px auto 3px; height:2.4px; border-radius:2px;
  background:var(--turquesa); transform:translateY(-50%); transition:transform .3s ease;
}
.mais::after{ transform:translateY(-50%) rotate(90deg); }
.card.aberto .mais::after{ transform:translateY(-50%) rotate(0); }

.card-corpo{
  max-height:0; overflow:hidden;
  transition:max-height .42s cubic-bezier(.4,0,.2,1);
}
/* altura calculada pelo JS ao abrir */
.card-corpo p{ margin:0 0 .8rem; padding:0 1.5rem; font-size:.93rem; color:var(--cinza); }
.card-corpo ul{ list-style:none; margin:0 0 1rem; padding:0 1.5rem; font-size:.93rem; color:var(--cinza); }
.card-corpo li{ position:relative; padding-left:1.1rem; margin-bottom:.35rem; }
.card-corpo li::before{ content:""; position:absolute; left:0; top:.62em; width:6px; height:6px; border-radius:50%; background:var(--amarelo); }
.card-corpo .quando{
  color:var(--turquesa-esc); font-size:.88rem;
  background:var(--menta-clara); padding:.95rem 1.5rem; margin:0;
}

/* ---------- METODOLOGIA ---------- */
.passos{ list-style:none; margin:0; padding:0; display:grid; gap:1rem; counter-reset:p; }
.passo{
  display:grid; grid-template-columns:auto 1fr; gap:1.5rem; align-items:start;
  background:#fff; border-radius:var(--r-g); padding:1.7rem 1.9rem;
  box-shadow:var(--sombra-s); position:relative;
  transition:transform .25s ease, box-shadow .25s ease;
}
.passo:hover{ transform:translateX(6px); box-shadow:var(--sombra-m); }
.passo .num{
  width:52px; height:52px; border-radius:50%; flex:none;
  display:grid; place-items:center;
  font-family:var(--disp); font-weight:700; font-size:1.4rem; color:#fff;
  background:var(--turquesa);
  box-shadow:0 6px 16px rgba(31,140,134,.3);
}
.passo:nth-child(2) .num{ background:var(--coral); box-shadow:0 6px 16px rgba(239,108,77,.3); }
.passo:nth-child(3) .num{ background:var(--amarelo); color:var(--turquesa-esc); box-shadow:0 6px 16px rgba(255,194,75,.35); }
.passo:nth-child(4) .num{ background:#7CB9A5; }
.passo:nth-child(5) .num{ background:var(--turquesa-esc); }
.passo .num{ grid-column:1; grid-row:1 / span 2; }
.passo h3{ grid-column:2; grid-row:1; margin-bottom:.35rem; }
.passo p{ grid-column:2; grid-row:2; }
.passo p{ margin:0; color:var(--cinza); font-size:.96rem; }

@media (min-width:860px){
  .passos::before{
    content:""; position:absolute; left:calc(1.9rem + 26px); top:60px; bottom:60px; width:2px;
    background:repeating-linear-gradient(180deg,rgba(31,140,134,.35) 0 8px,transparent 8px 16px);
  }
  .passos{ position:relative; }
}

/* ---------- DIFERENCIAIS ---------- */
.difs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:1.2rem; }
.dif{
  background:#fff; border-radius:var(--r-g); padding:2rem 1.8rem;
  box-shadow:var(--sombra-s); transition:transform .25s ease, box-shadow .25s ease;
}
.dif:hover{ transform:translateY(-6px); box-shadow:var(--sombra-m); }
.dif svg{
  width:38px; height:38px; fill:none; stroke:var(--coral); stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round; margin-bottom:1rem;
}
.dif svg .fantasma{ stroke:rgba(239,108,77,.35); }
.dif p{ margin:0; color:var(--cinza); font-size:.95rem; }

/* ---------- CARTAS DE CURIOSIDADE ---------- */
.cartas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.2rem; }
.carta{
  position:relative; min-height:230px; border:0; padding:0; cursor:pointer;
  background:none; font:inherit; color:inherit; text-align:left;
  perspective:1200px;
}
.face{
  position:absolute; inset:0; border-radius:var(--r-g); padding:1.7rem;
  display:flex; flex-direction:column; gap:.7rem;
  backface-visibility:hidden; transition:transform .6s cubic-bezier(.5,.05,.3,1), box-shadow .3s ease;
  box-shadow:var(--sombra-s);
}
.frente{ background:#fff; border:1.5px solid rgba(31,140,134,.16); justify-content:space-between; }
.verso{
  background:linear-gradient(155deg,var(--turquesa),#17706C); color:#EAF6F2;
  transform:rotateY(180deg); justify-content:center;
}
.carta[aria-pressed="true"] .frente{ transform:rotateY(-180deg); }
.carta[aria-pressed="true"] .verso{ transform:rotateY(0); }
.carta:hover .face{ box-shadow:var(--sombra-m); }
.carta-tag{
  align-self:flex-start;
  font:800 .66rem/1 var(--corpo); letter-spacing:.16em; text-transform:uppercase;
  color:var(--turquesa-esc); background:var(--menta-clara);
  padding:.5rem .85rem; border-radius:100px;
}
.carta-stat{
  font-family:var(--disp); font-variation-settings:"SOFT" 40,"WONK" 1;
  font-weight:600; font-size:1.9rem; line-height:1; color:var(--amarelo);
  letter-spacing:-.02em;
}
.carta-p{ font-family:var(--disp); font-weight:600; font-size:1.16rem; line-height:1.2; }
.carta-r{ font-size:.95rem; line-height:1.6; }
.virar{
  font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700;
  color:var(--turquesa); display:flex; align-items:center; gap:.4rem;
}
.virar::after{ content:"↻"; font-size:1rem; }

.aviso{ margin-top:2rem; font-size:.82rem; color:var(--cinza); max-width:46rem; }

/* ---------- CRONÔMETRO ---------- */
.timer-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.timer-legenda{ list-style:none; padding:0; margin:1.5rem 0 0; display:grid; gap:.55rem; counter-reset:t; }
.timer-legenda li{
  display:flex; align-items:center; gap:.8rem; font-weight:600; font-size:.95rem;
  color:var(--cinza); transition:color .25s ease;
}
.timer-legenda li span{
  width:14px; height:14px; border-radius:50%; background:rgba(31,140,134,.2); flex:none;
  transition:background .25s ease, transform .25s ease;
}
.timer-legenda li.ativa{ color:var(--turquesa-esc); }
.timer-legenda li.ativa span{ background:var(--coral); transform:scale(1.4); }
.timer-legenda li.feita span{ background:var(--turquesa); }

.timer-caixa{
  background:#fff; border-radius:var(--r-g); padding:2.5rem;
  box-shadow:var(--sombra-m); text-align:center;
}
.timer-relogio{ position:relative; width:min(260px,70vw); margin:0 auto 1.6rem; }
.timer-relogio svg{ width:100%; transform:rotate(-90deg); }
.timer-relogio .trilha{ fill:none; stroke:var(--menta-clara); stroke-width:14; }
.timer-relogio .progresso{
  fill:none; stroke:var(--coral); stroke-width:14; stroke-linecap:round;
  stroke-dasharray:540.4; stroke-dashoffset:540.4; transition:stroke-dashoffset .3s linear, stroke .4s ease;
}
.timer-centro{ position:absolute; inset:0; display:grid; place-content:center; gap:.2rem; }
.timer-centro strong{ font-family:var(--disp); font-size:2.9rem; font-weight:600; line-height:1; }
.timer-centro span{ font-size:.76rem; color:var(--cinza); max-width:150px; }
.timer-botoes{ display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; }

/* ---------- DEPOIMENTOS ---------- */
.depos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:1.4rem; }
.depo{
  margin:0; background:#fff; border-radius:var(--r-g); padding:2rem 1.9rem;
  box-shadow:var(--sombra-s); position:relative; transition:transform .25s ease, box-shadow .25s ease;
}
.depo:hover{ transform:translateY(-5px); box-shadow:var(--sombra-m); }
.estrelas{ color:var(--amarelo); letter-spacing:.14em; font-size:1.05rem; margin-bottom:.7rem; }
.depo blockquote{ margin:0 0 .9rem; }
.depo blockquote p{
  font-family:var(--disp); font-weight:600; font-size:1.28rem; line-height:1.25;
  color:var(--turquesa-esc); margin:0;
}
.depo-res{ font-size:.93rem; color:var(--cinza); }
.depo figcaption{ font-weight:700; font-size:.9rem; border-top:1px solid rgba(31,140,134,.15); padding-top:.9rem; }
.depo figcaption span{ font-weight:500; color:var(--cinza); font-size:.8rem; }

/* ---------- QUIZ ---------- */
.quiz-caixa{
  background:#fff; border-radius:var(--r-g); padding:clamp(1.8rem,4vw,3rem);
  box-shadow:var(--sombra-m); max-width:820px; margin-inline:auto;
}
.quiz-barra{ height:8px; border-radius:6px; background:var(--menta-clara); overflow:hidden; }
.quiz-barra span{
  display:block; height:100%; width:0; border-radius:6px;
  background:linear-gradient(90deg,var(--turquesa),var(--amarelo));
  transition:width .45s cubic-bezier(.4,0,.2,1);
}
.quiz-contador{
  font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700;
  color:var(--turquesa); margin:1rem 0 1.2rem;
}
.quiz-pergunta{ font-size:clamp(1.4rem,2.4vw,1.9rem); margin-bottom:1.4rem; }
.quiz-opcoes{ display:grid; gap:.7rem; }
.quiz-op{
  display:flex; align-items:center; gap:1rem; width:100%; text-align:left;
  background:var(--menta-fundo); border:1.5px solid rgba(31,140,134,.18); border-radius:var(--r-m);
  padding:1.05rem 1.3rem; font:600 .98rem/1.4 var(--corpo); color:var(--tinta); cursor:pointer;
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.quiz-op:hover{ background:var(--menta-clara); border-color:var(--turquesa); transform:translateX(5px); }
.quiz-op i{
  width:26px; height:26px; border-radius:50%; flex:none; font-style:normal;
  display:grid; place-items:center; font-size:.78rem; font-weight:800;
  background:#fff; border:1.5px solid rgba(31,140,134,.3); color:var(--turquesa);
}
.quiz-op:hover i{ background:var(--turquesa); color:#fff; border-color:var(--turquesa); }
.quiz-rodape{ display:flex; gap:.6rem; margin-top:1.6rem; }

.quiz-anima{ animation:entrar .35s ease; }
@keyframes entrar{ from{ opacity:0; transform:translateY(12px); } }

.res-selo{
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--menta-clara); color:var(--turquesa-esc);
  padding:.5rem 1rem; border-radius:100px; font-size:.75rem; font-weight:800;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:1rem;
}
.res-selo-alerta{ background:rgba(239,108,77,.14); color:var(--coral-esc); }
.res-tit{ font-size:clamp(1.6rem,3vw,2.3rem); margin-bottom:.6rem; }
.res-texto{ color:var(--cinza); }
.res-lista{ list-style:none; padding:0; margin:1.2rem 0 1.6rem; display:grid; gap:.5rem; }
.res-lista li{ position:relative; padding-left:1.6rem; font-size:.95rem; }
.res-lista li::before{
  content:"✓"; position:absolute; left:0; color:var(--turquesa); font-weight:800;
}
.res-acoes{ display:flex; flex-wrap:wrap; gap:.7rem; }
.res-nota{ font-size:.82rem; color:var(--cinza); margin-top:1.2rem; }

/* ---------- CONTATO ---------- */
.contato-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.sec-escura .eyebrow{ color:var(--amarelo); }
.sec-escura h2{ color:#fff; }
.sec-escura p{ color:rgba(234,246,242,.82); }
.contato-linhas{ display:grid; gap:.6rem; margin:2rem 0; }
.linha{
  display:flex; gap:1rem; align-items:flex-start; text-decoration:none;
  background:rgba(255,255,255,.08); border-radius:var(--r-m); padding:1.1rem 1.3rem;
  transition:background .2s ease, transform .2s ease;
}
a.linha:hover{ background:rgba(255,255,255,.16); transform:translateX(5px); }
.linha svg{ width:24px; height:24px; flex:none; fill:none; stroke:var(--amarelo); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.linha span{ font-size:.86rem; color:rgba(234,246,242,.75); line-height:1.5; }
.linha b{ display:block; color:#fff; font-size:1rem; }

.contato-foto{ margin:0; }
.contato-foto img{ border-radius:var(--r-g); box-shadow:var(--sombra-g); }
.contato-foto figcaption{ font-family:var(--mao); font-size:1.3rem; color:var(--menta); margin-top:.9rem; }

/* ---------- RODAPÉ ---------- */
.rodape{ background:var(--tinta); color:rgba(234,246,242,.7); padding:3.5rem 0 2.5rem; }
.rodape-grid{ display:grid; grid-template-columns:1.2fr 1fr 1.2fr; gap:2rem; }
.rodape-logo{
  width:130px; height:auto; margin-bottom:1.1rem; display:block;
  background:rgba(255,255,255,.94); border-radius:20px; padding:.7rem .8rem;
}
.rodape-tooth path:first-of-type{ fill:transparent; stroke:var(--menta); }
.rodape-tooth .eye{ fill:var(--menta); }
.rodape-tooth .smile{ stroke:var(--menta); }
.rodape-nome{ font-family:var(--disp); font-size:1.05rem; color:#fff; margin:0 0 .3rem; line-height:1.3; }
.rodape-min{ font-size:.82rem; margin:0 0 .6rem; }
.rodape-legal{ opacity:.6; font-size:.75rem; }
.rodape nav{ display:flex; flex-direction:column; gap:.5rem; }
.rodape nav a,.rodape-min a{ color:rgba(234,246,242,.8); text-decoration:none; font-size:.86rem; }
.rodape nav a:hover,.rodape-min a:hover{ color:var(--amarelo); }

/* ---------- WHATSAPP FLUTUANTE ---------- */
.wa-flutuante{
  position:fixed; right:20px; bottom:20px; z-index:90;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; display:grid; place-items:center;
  box-shadow:0 10px 26px rgba(37,211,102,.4);
  transition:transform .22s ease;
}
.wa-flutuante svg{ width:30px; height:30px; fill:#fff; }
.wa-flutuante:hover{ transform:scale(1.09) rotate(-6deg); }

/* ---------- REVELAÇÃO NO SCROLL ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.reveal.dentro{ opacity:1; transform:none; }

/* ---------- RESPONSIVO ---------- */
@media (max-width:1000px){
  .faixa-grid{ grid-template-columns:repeat(2,1fr); }
  .hero-grid,.sobre-grid,.timer-grid,.contato-grid{ grid-template-columns:1fr; }
  .hero-selo{ order:-1; }
  .logo-selo{ width:min(280px,64vw); }
  .rodape-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width:820px){
  .nav-links{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; gap:0; padding:.5rem 5vw 1.5rem;
    background:var(--menta-fundo); border-bottom:1px solid rgba(31,140,134,.14);
    box-shadow:var(--sombra-m);
    display:none;
  }
  .nav-links.aberto{ display:flex; }
  .nav.menu-aberto{ background:var(--menta-fundo); }
  .nav-links a{ padding:.85rem 0; border-bottom:1px solid rgba(31,140,134,.1); }
  .burger{ display:block; }
  .nav-cta{ display:none; }
  .sobre-fotos{ padding-bottom:0; }
  .foto-peq{ position:relative; width:46%; right:auto; bottom:auto; margin:1rem 0 0 auto; animation:none; }
  .foto-peq2{ width:24%; left:-3%; top:6%; }
  .hero{ padding-bottom:160px; }
  .logo-selo{ width:min(230px,58vw); }
  .selo-sub{ font-size:1.15rem; }
}

@media (max-width:560px){
  .faixa-grid{ grid-template-columns:1fr; }
  .rodape-grid{ grid-template-columns:1fr; }
  .passo{ grid-template-columns:1fr; gap:.8rem; }
  .btn{ width:100%; }
  .btn-sm{ width:auto; }
  .hero-acoes{ flex-direction:column; align-items:stretch; }
}

/* ---------- MOVIMENTO REDUZIDO ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  .reveal{ opacity:1; transform:none; }
  .logo-selo .anel-ext,.logo-selo .anel-int,.logo-selo .dente-corpo,
  .logo-selo .boca,.logo-selo .brilho{ stroke-dashoffset:0; }
  .logo-selo .dente-corpo{ fill-opacity:1; }
  .logo-selo .anel-texto,.logo-selo .olhos circle,.selo-sub{ opacity:1; }
}

/* =========================================================
   ADIÇÕES — versão 2
   ========================================================= */

/* ---------- JOANINHAS NA GRAMA ---------- */
.joaninha{ position:absolute; bottom:8px; width:30px; }
.joaninha .corpo{ fill:#D8322B; }
.joaninha .cabeca{ fill:#231F1E; }
.joaninha .linha{ stroke:#231F1E; stroke-width:1.6; fill:none; }
.joaninha .pinta{ fill:#231F1E; }
.joaninha .antena{ stroke:#231F1E; stroke-width:1.6; fill:none; stroke-linecap:round; }
.joaninha .olho{ fill:#fff; }
.j1{ left:8%;  width:28px; animation:caminhar 34s linear infinite; }
.j2{ left:2%;  width:22px; animation:caminhar 44s linear infinite 6s; }
.j3{ right:14%; width:26px; transform:scaleX(-1); animation:caminhar-volta 38s linear infinite 3s; }
@keyframes caminhar{
  0%{ transform:translateX(0) rotate(0deg); }
  25%{ transform:translateX(16vw) rotate(2deg); }
  50%{ transform:translateX(30vw) rotate(-2deg); }
  75%{ transform:translateX(46vw) rotate(2deg); }
  100%{ transform:translateX(62vw) rotate(0deg); }
}
@keyframes caminhar-volta{
  0%{ transform:scaleX(-1) translateX(0); }
  50%{ transform:scaleX(-1) translateX(24vw) rotate(2deg); }
  100%{ transform:scaleX(-1) translateX(48vw); }
}

/* ---------- SEÇÃO GESTANTES ---------- */
.sec-gestante{
  background:linear-gradient(165deg,#FBEEF1 0%,#F6E2E8 55%,#F1DCE4 100%);
  position:relative; overflow:hidden;
}
.sec-gestante::before{
  content:""; position:absolute; right:-140px; top:-120px; width:420px; height:420px;
  border-radius:50%; background:rgba(255,255,255,.5); pointer-events:none;
}
.gest-topo{ max-width:52rem; margin-bottom:clamp(2rem,4vw,3rem); position:relative; }
.tarja{
  display:inline-block; background:var(--coral); color:#fff;
  font:800 .7rem/1 var(--corpo); letter-spacing:.16em; text-transform:uppercase;
  padding:.6rem 1.1rem; border-radius:100px; margin-bottom:1.2rem;
  box-shadow:0 8px 20px rgba(239,108,77,.3);
}
.gest-topo h2{ color:#8A3F55; }
.gest-lead{ font-size:clamp(1.02rem,1.3vw,1.16rem); color:#6B4552; font-weight:500; margin:0; }

.gest-linha{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:1.2rem; position:relative; }
.gest-card{
  background:#fff; border-radius:var(--r-g); padding:2rem 1.8rem;
  box-shadow:var(--sombra-s); border-top:5px solid var(--coral);
  transition:transform .25s ease, box-shadow .25s ease;
}
.gest-card:hover{ transform:translateY(-6px); box-shadow:var(--sombra-m); }
.gest-card:nth-child(2){ border-top-color:var(--amarelo); }
.gest-card:nth-child(3){ border-top-color:var(--turquesa); }
.gest-marco{
  display:inline-block; font-family:var(--disp); font-weight:700; font-size:1.5rem;
  color:var(--coral); margin-bottom:.5rem; letter-spacing:-.02em;
}
.gest-card:nth-child(2) .gest-marco{ color:#C99414; }
.gest-card:nth-child(3) .gest-marco{ color:var(--turquesa); }
.gest-card h3{ margin-bottom:.6rem; }
.gest-card p{ font-size:.94rem; color:var(--cinza); }
.gest-obs{
  font-size:.86rem !important; background:var(--menta-fundo);
  padding:.9rem 1rem; border-radius:var(--r-p); margin:0;
}
.gest-lista{ list-style:none; padding:0; margin:0; display:grid; gap:.5rem; }
.gest-lista li{ position:relative; padding-left:1.5rem; font-size:.92rem; color:var(--cinza); }
.gest-lista li::before{
  content:""; position:absolute; left:0; top:.55em; width:8px; height:8px;
  border-radius:50%; background:var(--turquesa);
}
.gest-cta{
  margin-top:2.2rem; background:#fff; border-radius:var(--r-g);
  padding:1.6rem 2rem; box-shadow:var(--sombra-s);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.2rem;
}
.gest-cta p{ margin:0; font-family:var(--disp); font-size:1.2rem; font-weight:600; color:var(--turquesa-esc); }

/* ---------- DRA. MARÍLIA ---------- */
.dra-grid{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.dra-fotos{ position:sticky; top:96px; display:grid; gap:1rem; }
.dra-retrato img{ border-radius:var(--r-g); box-shadow:var(--sombra-g); }
.dra-retrato,.dra-acao{ margin:0; }
.dra-acao img{ border-radius:var(--r-m); box-shadow:var(--sombra-m); }
.dra-acao figcaption{ font-family:var(--mao); font-size:1.2rem; color:var(--turquesa); margin-top:.7rem; }
.dra-titulo{
  font:700 .78rem/1.4 var(--corpo); letter-spacing:.14em; text-transform:uppercase;
  color:var(--coral); margin:-.3rem 0 1.4rem;
}
.dra-texto p{ color:var(--cinza); font-size:.98rem; }
.dra-numeros{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
  margin:2rem 0; padding:1.5rem 0; border-top:1px solid rgba(31,140,134,.18); border-bottom:1px solid rgba(31,140,134,.18);
}
.dra-numeros b{
  display:block; font-family:var(--disp); font-weight:600; font-size:1.7rem;
  color:var(--turquesa-esc); line-height:1;
}
.dra-numeros span{ font-size:.78rem; color:var(--cinza); line-height:1.4; display:block; margin-top:.4rem; }
.dra-fecho{
  font-family:var(--disp); font-size:1.18rem; font-style:italic; line-height:1.4;
  color:var(--turquesa-esc) !important;
}

/* ---------- CARROSSEL ---------- */
.carrossel{ position:relative; }
.car-palco{ overflow:hidden; border-radius:var(--r-g); }
.car-trilho{ display:flex; transition:transform .5s cubic-bezier(.4,0,.2,1); }
.car-slide{ margin:0; min-width:100%; position:relative; }
.car-slide img{
  width:100%; aspect-ratio:16/10; object-fit:cover; display:block; background:var(--menta-clara);
}
.carrossel-peq .car-slide img{ aspect-ratio:4/3; }
.car-slide figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:2.6rem 1.6rem 1.3rem;
  background:linear-gradient(to top,rgba(11,45,43,.92),rgba(11,45,43,.72) 45%,transparent);
  color:rgba(255,255,255,.86); font-size:.9rem; line-height:1.5;
}
.car-slide figcaption b{
  display:block; font-family:var(--disp); font-weight:600; font-size:1.2rem;
  color:#fff; margin-bottom:.25rem;
}
.car-controles{ display:flex; align-items:center; justify-content:center; gap:1rem; margin-top:1.1rem; }
.car-btn{
  width:46px; height:46px; border-radius:50%; flex:none; cursor:pointer;
  background:#fff; border:1.5px solid rgba(31,140,134,.25);
  display:grid; place-items:center; transition:background .2s ease, transform .2s ease, border-color .2s ease;
}
.car-btn svg{ width:22px; height:22px; fill:none; stroke:var(--turquesa-esc); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.car-btn:hover{ background:var(--turquesa); border-color:var(--turquesa); transform:scale(1.06); }
.car-btn:hover svg{ stroke:#fff; }
.car-pontos{ display:flex; gap:.5rem; }
.car-ponto{
  width:9px; height:9px; border-radius:50%; border:0; padding:0; cursor:pointer;
  background:rgba(31,140,134,.28); transition:width .25s ease, background .25s ease;
}
.car-ponto.ativo{ width:26px; border-radius:6px; background:var(--turquesa); }

.murais-grid{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,4vw,3.5rem);
  align-items:center; margin-top:clamp(2.5rem,5vw,4rem);
}
.murais-texto h3{ font-size:clamp(1.4rem,2.2vw,1.9rem); margin-bottom:.8rem; }
.murais-texto p{ color:var(--cinza); }

/* ---------- CARD DESTAQUE / URGÊNCIA ---------- */
.card-destaque{ border-color:rgba(239,108,77,.4); background:linear-gradient(180deg,#FFF7F4,#fff 40%); }
.card-destaque .ico{ background:rgba(239,108,77,.14); }
.card-destaque .ico svg{ stroke:var(--coral-esc); }
.card-urgencia .ico{ background:rgba(239,108,77,.12); }
.card-acao{ display:flex; flex-wrap:wrap; gap:.6rem; padding:1.1rem 1.5rem 1.5rem; }
.card-acao .btn{ width:auto; }

/* ---------- DUO: REFORÇO POSITIVO + BIOSSEGURANÇA ---------- */
.duo{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; }
.duo-bloco{
  background:#fff; border-radius:var(--r-g); padding:2.2rem 2rem;
  box-shadow:var(--sombra-s); transition:transform .25s ease, box-shadow .25s ease;
}
.duo-bloco:hover{ transform:translateY(-4px); box-shadow:var(--sombra-m); }
.duo-selo{
  display:inline-block; font:800 .68rem/1 var(--corpo); letter-spacing:.16em; text-transform:uppercase;
  padding:.55rem 1rem; border-radius:100px; margin-bottom:1rem;
}
.duo-selo-coral{ background:rgba(239,108,77,.14); color:var(--coral-esc); }
.duo-selo-turq{ background:var(--menta-clara); color:var(--turquesa-esc); }
.duo-lista{ list-style:none; padding:0; margin:1.2rem 0 0; display:grid; gap:1rem; }
.duo-lista li{ font-size:.93rem; color:var(--cinza); padding-left:1.6rem; position:relative; }
.duo-lista li b{ display:block; color:var(--tinta); font-size:.98rem; margin-bottom:.15rem; }
.duo-lista li::before{
  content:""; position:absolute; left:0; top:.5em; width:9px; height:9px; border-radius:50%;
  background:var(--coral);
}
.duo-check{ gap:.7rem; }
.duo-check li{ padding-left:1.8rem; }
.duo-check li::before{
  content:"✓"; background:none; color:var(--turquesa); font-weight:800;
  width:auto; height:auto; top:0; font-size:1rem;
}

/* ---------- JOGO ---------- */
.sec-jogo{ background:linear-gradient(160deg,var(--turquesa-esc),#17706C 60%,#1C7E72); color:#EAF6F2; }
.cabeca-clara h2{ color:#fff; }
.cabeca-clara .eyebrow{ color:var(--amarelo); }
.cabeca-clara .sub{ color:rgba(234,246,242,.78); }

.jogo-caixa{
  background:#fff; color:var(--tinta); border-radius:var(--r-g);
  padding:clamp(1.6rem,3.5vw,2.6rem); box-shadow:var(--sombra-g);
  max-width:860px; margin-inline:auto;
}
.jogo-hud{ display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.8rem; }
.jogo-passo{ font:800 .72rem/1 var(--corpo); letter-spacing:.15em; text-transform:uppercase; color:var(--turquesa); }
.jogo-placar{
  font:800 .75rem/1 var(--corpo); background:var(--menta-clara); color:var(--turquesa-esc);
  padding:.5rem .9rem; border-radius:100px;
}
.jogo-barra{ height:8px; border-radius:6px; background:var(--menta-clara); overflow:hidden; margin-bottom:1.6rem; }
.jogo-barra span{
  display:block; height:100%; width:0; border-radius:6px;
  background:linear-gradient(90deg,var(--turquesa),var(--amarelo)); transition:width .4s ease;
}
.jogo-pergunta{ font-size:clamp(1.3rem,2.2vw,1.75rem); margin-bottom:1.3rem; }
.jogo-opcoes{ display:grid; gap:.65rem; }
.jogo-op{
  display:flex; align-items:center; gap:.9rem; width:100%; text-align:left;
  background:var(--menta-fundo); border:1.5px solid rgba(31,140,134,.18); border-radius:var(--r-m);
  padding:1rem 1.2rem; font:600 .97rem/1.4 var(--corpo); color:var(--tinta); cursor:pointer;
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}
.jogo-op i{
  width:26px; height:26px; border-radius:50%; flex:none; font-style:normal;
  display:grid; place-items:center; font-size:.78rem; font-weight:800;
  background:#fff; border:1.5px solid rgba(31,140,134,.3); color:var(--turquesa);
}
.jogo-op:not(:disabled):hover{ background:var(--menta-clara); border-color:var(--turquesa); transform:translateX(5px); }
.jogo-op:disabled{ cursor:default; }
.jogo-op.certa{ background:rgba(31,140,134,.12); border-color:var(--turquesa); }
.jogo-op.certa i{ background:var(--turquesa); border-color:var(--turquesa); color:#fff; }
.jogo-op.errada{ background:rgba(239,108,77,.1); border-color:var(--coral); }
.jogo-op.errada i{ background:var(--coral); border-color:var(--coral); color:#fff; }
.jogo-op.apagada{ opacity:.5; }

.jogo-feedback{
  margin-top:1.2rem; padding:1.1rem 1.3rem; border-radius:var(--r-m);
  background:var(--menta-clara); font-size:.94rem; animation:entrar .3s ease;
}
.jogo-feedback b{ display:block; margin-bottom:.2rem; }
.jogo-feedback.ops{ background:rgba(239,108,77,.1); }
.jogo-rodape{ display:flex; justify-content:flex-end; margin-top:1.2rem; }

.jogo-fim{ text-align:center; animation:entrar .4s ease; }
.jogo-nota{
  font-family:var(--disp); font-weight:700; font-size:clamp(3.4rem,9vw,5rem); line-height:1;
  color:var(--turquesa); letter-spacing:-.03em;
}
.jogo-nota small{ font-size:2rem; color:var(--cinza); }
.jogo-medalha{ font-size:3rem; line-height:1; margin-bottom:.4rem; }
.jogo-fim h3{ font-size:clamp(1.5rem,3vw,2.1rem); margin:.6rem 0 .5rem; }
.jogo-fim p{ color:var(--cinza); max-width:32rem; margin-inline:auto; }
.jogo-gabarito{ list-style:none; padding:0; margin:1.8rem 0 0; display:grid; gap:.5rem; text-align:left; }
.jogo-gabarito li{
  display:flex; gap:.8rem; align-items:flex-start; font-size:.9rem; color:var(--cinza);
  background:var(--menta-fundo); padding:.8rem 1rem; border-radius:var(--r-p);
}
.jogo-gabarito .mk{ flex:none; font-weight:800; }
.jogo-gabarito .ok{ color:var(--turquesa); }
.jogo-gabarito .no{ color:var(--coral); }
.jogo-fim .btn{ margin-top:1.6rem; }

/* ---------- CRONÔMETRO: NOTA ---------- */
.timer-nota{ font-size:.78rem; color:var(--cinza); margin:1rem 0 0; }

/* ---------- RESPONSIVO v2 ---------- */
@media (max-width:1000px){
  .dra-grid,.murais-grid,.duo{ grid-template-columns:1fr; }
  .dra-fotos{ position:static; grid-template-columns:1fr 1fr; }
  .dra-acao figcaption{ font-size:1.05rem; }
}
@media (max-width:620px){
  .dra-fotos{ grid-template-columns:1fr; }
  .dra-numeros{ grid-template-columns:1fr; gap:1.2rem; text-align:left; }
  .gest-cta{ flex-direction:column; align-items:stretch; text-align:center; }
  .car-slide figcaption{ font-size:.84rem; padding:2.2rem 1.1rem 1.1rem; }
  .car-slide figcaption b{ font-size:1.05rem; }
  .card-acao .btn{ width:100%; }
}
@media (prefers-reduced-motion:reduce){
  .joaninha{ animation:none !important; }
  .car-trilho{ transition:none; }
}

/* =========================================================
   ABERTURA ANIMADA COM O LOGO
   ========================================================= */
.abertura{
  position:fixed; inset:0; z-index:9999;
  display:grid; place-items:center; overflow:hidden;
  animation:abertura-sai .9s ease forwards 3.2s;
}
.abertura-fundo{
  position:absolute; inset:0;
  background:radial-gradient(circle at 50% 42%,#EAF7F2 0%,#C4E7DD 45%,#A9DCD0 100%);
}
.abertura-bolhas{ position:absolute; inset:0; width:100%; height:100%; }
.abertura-bolhas circle{
  fill:rgba(255,255,255,.6); stroke:rgba(255,255,255,.9); stroke-width:2;
  animation:bolha-sobe 2.6s ease-in forwards;
}
.abertura-bolhas circle:nth-child(1){ animation-delay:.05s; }
.abertura-bolhas circle:nth-child(2){ animation-delay:.35s; }
.abertura-bolhas circle:nth-child(3){ animation-delay:.15s; }
.abertura-bolhas circle:nth-child(4){ animation-delay:.55s; }
.abertura-bolhas circle:nth-child(5){ animation-delay:.25s; }
.abertura-bolhas circle:nth-child(6){ animation-delay:.75s; }
.abertura-bolhas circle:nth-child(7){ animation-delay:.45s; }
.abertura-bolhas circle:nth-child(8){ animation-delay:.65s; }
@keyframes bolha-sobe{
  0%{ opacity:0; transform:translateY(0) scale(.4); }
  20%{ opacity:.95; }
  100%{ opacity:0; transform:translateY(-780px) translateX(28px) scale(1.2); }
}

.abertura-centro{ position:relative; text-align:center; padding:1rem; }
.abertura-logo{
  width:min(330px,66vw); height:auto; margin-inline:auto;
  filter:drop-shadow(0 18px 32px rgba(18,59,57,.2));
  animation:logo-splash 1.5s cubic-bezier(.2,.9,.28,1.25) both .1s;
}
@keyframes logo-splash{
  0%{ opacity:0; transform:scale(.55) rotate(-7deg); }
  45%{ opacity:1; transform:scale(1.06) rotate(2deg); }
  70%{ transform:scale(.98) rotate(-1deg); }
  100%{ opacity:1; transform:scale(1) rotate(0); }
}
.abertura-nome{
  font-family:var(--disp); font-weight:600; font-size:clamp(1.05rem,2.4vw,1.4rem);
  color:var(--turquesa-esc); margin:.6rem 0 0; letter-spacing:.01em;
  opacity:0; animation:nome-entra .8s ease forwards 1s;
}
@keyframes nome-entra{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

@keyframes abertura-sai{ to{ opacity:0; visibility:hidden; } }
.abertura.fim{ display:none; }
body.travado{ overflow:hidden; }

@media (prefers-reduced-motion:reduce){
  .abertura{ display:none; }
  .logo-img{ animation:none; }
  .bolhas{ display:none; }
  .selo-sub{ opacity:1; }
}

/* =========================================================
   ADIÇÕES — FADA MEL (mascote virtual)
   ========================================================= */

/* ---------- LINK DA MASCOTE NO MENU ---------- */
.nav-links a.nav-fada{ color:#7B5CA8; }
.nav-links a.nav-fada::after{ background:#9F7ED0; }
.nav-links a.nav-fada[aria-current="page"]::after{ right:0; }

@media (min-width:821px) and (max-width:1120px){
  .nav-links{ gap:1.05rem; }
  .nav-links a{ font-size:.82rem; }
}

/* ---------- TIRA DA MASCOTE NA PÁGINA INICIAL ---------- */
.sec-fada-tira{
  background:linear-gradient(160deg,#EFF6FE 0%,#E7F1FC 45%,#FBEEF5 100%);
  overflow:hidden;
  padding:clamp(54px,6.5vw,88px) 0;
}
.fada-tira-grid{
  display:grid; grid-template-columns:minmax(0,.42fr) minmax(0,1fr);
  gap:clamp(1.5rem,4vw,3.5rem); align-items:center;
}
.fada-tira-foto{ display:block; }
.fada-tira-foto img{
  width:min(280px,60vw); margin-inline:auto;
  filter:drop-shadow(0 20px 34px rgba(90,110,160,.28));
  animation:fada-flutua 6s ease-in-out infinite;
}
.fada-tira-foto:hover img{ animation-play-state:paused; transform:scale(1.03) rotate(-2deg); transition:transform .4s ease; }
.fada-tira-texto h2{ color:#5B4A86; margin-bottom:.6rem; }
.fada-tira-texto .eyebrow{ color:#7B5CA8; }
.fada-tira-texto p{ color:#5C6480; max-width:38em; }
.fada-tira-acoes{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem; }

@keyframes fada-flutua{
  0%,100%{ transform:translateY(0) rotate(-1.5deg); }
  50%    { transform:translateY(-16px) rotate(1.5deg); }
}

/* ---------- FADINHA DECORATIVA NA ESCOVAÇÃO ---------- */
.sec-escovacao{ overflow:hidden; }
.timer-lado{ position:relative; }

.fada-escovacao{
  position:absolute; z-index:3;
  top:-104px; right:-16px;
  width:clamp(104px,13vw,152px);
  text-decoration:none;
  display:block;
  animation:fada-flutua 5.4s ease-in-out infinite;
}
.fada-escovacao img{
  width:100%;
  filter:drop-shadow(0 14px 22px rgba(60,90,140,.26));
}
.fada-escovacao:hover img{ transform:scale(1.05) rotate(-3deg); transition:transform .35s ease; }
.fada-legenda{
  display:block; text-align:center; white-space:nowrap;
  font-family:var(--mao); font-size:1.05rem; line-height:1.15;
  color:#7B5CA8; transform:rotate(-3deg); margin-top:.35rem;
}
.fada-brilhos{ position:absolute; inset:-8% -14%; width:128%; height:116%; pointer-events:none; }
.fada-brilhos .br{ fill:#FFC24B; opacity:0; }
.fada-brilhos .b-a{ animation:fada-cintila 3.2s ease-in-out infinite .2s; }
.fada-brilhos .b-b{ animation:fada-cintila 3.2s ease-in-out infinite 1.1s; }
.fada-brilhos .b-c{ animation:fada-cintila 3.2s ease-in-out infinite 1.9s; }
.fada-brilhos .b-d{ animation:fada-cintila 3.2s ease-in-out infinite 2.6s; }

@keyframes fada-cintila{
  0%,100%{ opacity:0; transform:scale(.5); }
  45%    { opacity:.95; transform:scale(1.15); }
}

@media (max-width:1000px){
  /* em coluna única a fadinha ganha um espaço só dela, acima do relógio */
  .timer-lado{ padding-top:158px; }
  .fada-escovacao{ top:0; right:26px; width:104px; }
}
@media (max-width:560px){
  .timer-lado{ padding-top:146px; }
  .fada-escovacao{ right:30px; width:96px; }
  .fada-legenda{ font-size:.95rem; }
}

/* ---------- PÁGINA DA MASCOTE: APRESENTAÇÃO ---------- */
.fada-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#DCEBFB 0%,#CFE3FA 48%,#F3E3EE 100%);
  padding:clamp(48px,6vw,84px) 0 clamp(60px,7vw,96px);
}
.fada-ceu{ position:absolute; inset:0; pointer-events:none; }
.fada-ceu .cloud{ fill:rgba(255,255,255,.8); }
.fada-purpurina{ position:absolute; inset:0; width:100%; height:100%; }
.fada-purpurina .pp{ fill:#FFD36A; opacity:0; }
.fada-purpurina .p1{ animation:fada-cintila 4s ease-in-out infinite .1s; }
.fada-purpurina .p2{ animation:fada-cintila 4s ease-in-out infinite .7s; }
.fada-purpurina .p3{ animation:fada-cintila 4s ease-in-out infinite 1.3s; }
.fada-purpurina .p4{ animation:fada-cintila 4s ease-in-out infinite 1.9s; }
.fada-purpurina .p5{ animation:fada-cintila 4s ease-in-out infinite 2.4s; fill:#fff; }
.fada-purpurina .p6{ animation:fada-cintila 4s ease-in-out infinite 2.9s; fill:#fff; }
.fada-purpurina .p7{ animation:fada-cintila 4s ease-in-out infinite 3.3s; }
.fada-purpurina .p8{ animation:fada-cintila 4s ease-in-out infinite 3.7s; fill:#fff; }

.fada-hero-grid{
  position:relative; z-index:2;
  display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(2rem,5vw,4rem); align-items:center;
}

.fada-retrato{ margin:0; text-align:center; }
.fada-retrato img{
  width:min(400px,78vw); margin-inline:auto;
  filter:drop-shadow(0 26px 44px rgba(70,95,150,.3));
  animation:fada-flutua 7s ease-in-out infinite;
}
.fada-retrato figcaption{
  font-family:var(--mao); font-size:1.35rem; color:#6B5497;
  margin-top:.8rem; transform:rotate(-1.5deg);
}

.fada-fala h1{
  font-size:clamp(2rem,4.2vw,3.2rem);
  color:#4E3E7A; text-shadow:0 2px 0 rgba(255,255,255,.4);
  margin-bottom:1.2rem;
}
.fada-fala h1 em{ font-style:italic; color:#B0568B; font-variation-settings:"SOFT" 60,"WONK" 1; }
.fada-fala .eyebrow{ color:#7B5CA8; }
.fada-emoji{ white-space:nowrap; font-size:.7em; }

.fada-balao{
  position:relative;
  background:rgba(255,255,255,.9);
  border:1.5px solid rgba(123,92,168,.2);
  border-radius:var(--r-g);
  padding:clamp(1.4rem,2.6vw,2.1rem);
  box-shadow:var(--sombra-m);
}
.fada-balao::before{
  content:""; position:absolute; left:-11px; top:44px;
  width:22px; height:22px; background:rgba(255,255,255,.9);
  border-left:1.5px solid rgba(123,92,168,.2);
  border-bottom:1.5px solid rgba(123,92,168,.2);
  transform:rotate(45deg);
}
.fada-balao p{ color:#5A5B7A; font-size:.98rem; }
.fada-balao p:last-child{ margin-bottom:0; }
.fada-balao .fada-ola{
  font-family:var(--disp); font-weight:600; font-size:clamp(1.1rem,1.7vw,1.35rem);
  color:#4E3E7A; line-height:1.35;
}

.fada-assinatura{
  font-family:var(--mao); font-size:clamp(1.35rem,2.4vw,1.8rem);
  color:#B0568B; text-align:center;
  margin:1.6rem 0 0; transform:rotate(-1deg);
}
.fada-acoes{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem; }

@media (max-width:940px){
  .fada-hero-grid{ grid-template-columns:1fr; }
  .fada-balao::before{ left:38px; top:-11px; transform:rotate(135deg); }
}

/* ---------- PÁGINA DA MASCOTE: ONDE ELA APARECE ---------- */
.fada-lugares{ display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:1.2rem; }
.fada-lugar{
  background:#fff; border:1.5px solid rgba(123,92,168,.16);
  border-radius:var(--r-m); padding:1.6rem 1.5rem;
  text-decoration:none; color:inherit;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  display:flex; flex-direction:column;
}
.fada-lugar:hover{ transform:translateY(-6px); box-shadow:var(--sombra-m); border-color:#9F7ED0; }
.fada-lugar-ico{ font-size:2rem; line-height:1; margin-bottom:.7rem; }
.fada-lugar h3{ color:#4E3E7A; margin-bottom:.5rem; }
.fada-lugar p{ color:var(--cinza); font-size:.93rem; flex:1; }
.fada-lugar-link{ font-weight:700; font-size:.86rem; color:#7B5CA8; }

/* ---------- PÁGINA DA MASCOTE: CONVITE ---------- */
.fada-convite{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.fada-convite-nota{ font-size:.82rem; margin-top:1.4rem; }
.fada-convite-foto{ margin:0; }
.fada-convite-foto img{ border-radius:var(--r-g); box-shadow:var(--sombra-g); }
.fada-convite-foto figcaption{ font-family:var(--mao); font-size:1.3rem; color:var(--menta); margin-top:.9rem; }

@media (max-width:1000px){
  .fada-convite{ grid-template-columns:1fr; }
  .fada-tira-grid{ grid-template-columns:1fr; text-align:center; }
  .fada-tira-texto p{ margin-inline:auto; }
  .fada-tira-acoes{ justify-content:center; }
}
@media (max-width:560px){
  .fada-tira-acoes{ flex-direction:column; align-items:stretch; }
  .fada-acoes{ flex-direction:column; align-items:stretch; }
}

@media (prefers-reduced-motion:reduce){
  .fada-tira-foto img,.fada-retrato img,.fada-escovacao{ animation:none !important; }
  .fada-brilhos,.fada-purpurina{ display:none; }
}
