/* ============ Tokens ============ */
:root{
  --navy: #16264D;
  --navy-2: #223868;
  --gold: #F5B441;
  --gold-dark: #E29A1E;
  --sky: #EAF2FB;
  --green: #3FA772;
  --cream: #FFFDF7;
  --ink: #1B1B23;
  --ink-soft: #4C5670;
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --shadow-soft: 0 12px 30px -14px rgba(22,38,77,0.35);
  --font-display: "Fredoka", "Nunito", sans-serif;
  --font-body: "Nunito", sans-serif;
  --font-script: "Caveat", cursive;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:84px;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.55;
}
h1,h2,h3{
  font-family:var(--font-display);
  color:var(--navy);
  margin:0 0 .5em;
  line-height:1.15;
}
p{margin:0 0 1em;}
a{color:inherit;}
img,svg{display:block;max-width:100%;}
img{height:auto;}
picture{display:block;}
a:focus-visible, button:focus-visible{outline:3px solid var(--gold-dark); outline-offset:3px; border-radius:6px;}
.wrap{
  max-width:1160px;
  margin:0 auto;
  padding:0 24px;
}

.skip-link{
  position:absolute; left:16px; top:-60px; z-index:100;
  background:var(--navy); color:#fff;
  padding:.7em 1.2em; border-radius:var(--radius-sm);
  font-weight:700; text-decoration:none;
  transition:top .15s ease;
}
.skip-link:focus{top:12px;}

/* Animação ao rolar (só ativa via JS) */
.js-reveal .reveal{opacity:0; transform:translateY(18px); transition:opacity .5s ease, transform .5s ease;}
.js-reveal .reveal.is-visible{opacity:1; transform:none;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

/* ============ Buttons ============ */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  font-family:var(--font-display);
  font-weight:600;
  text-decoration:none;
  border-radius:999px;
  padding:.85em 1.6em;
  border:2px solid transparent;
  transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
  cursor:pointer;
}
.btn:focus-visible{outline:3px solid var(--navy); outline-offset:3px;}
.btn-primary{
  background:var(--green);
  color:#fff;
  box-shadow:var(--shadow-soft);
}
.btn-primary:hover{transform:translateY(-2px); background:#369061;}
.btn-ghost{
  background:transparent;
  border-color:var(--navy);
  color:var(--navy);
}
.btn-ghost:hover{background:var(--navy); color:#fff;}
.btn-small{padding:.55em 1.1em; font-size:.92rem;}
.btn-large{padding:1em 2em; font-size:1.1rem;}

/* ============ Header ============ */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,253,247,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(22,38,77,0.08);
}
.header-inner{
  display:flex;
  align-items:center;
  gap:1.5rem;
  padding:14px 24px;
}
.brand{display:flex; align-items:center; gap:.6rem; text-decoration:none;}
.brand picture{flex-shrink:0;}
.brand-logo{width:44px; height:44px; object-fit:contain; border-radius:50%; flex-shrink:0;}
.brand-text{display:flex; flex-direction:column; line-height:1.05;}
.brand-text strong{font-family:var(--font-display); font-size:1.15rem; color:var(--navy);}
.brand-text em{font-style:normal; font-size:.72rem; letter-spacing:.02em; color:var(--ink-soft);}
.main-nav{
  margin-left:auto;
  display:flex;
  gap:1.6rem;
}
.main-nav a{
  text-decoration:none;
  font-weight:700;
  color:var(--navy);
  font-size:.95rem;
  position:relative;
}
.main-nav a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-6px;
  height:2px; background:var(--gold);
  transform:scaleX(0); transform-origin:left;
  transition:transform .2s ease;
}
.main-nav a:hover::after,
.main-nav a.is-active::after{transform:scaleX(1);}
.nav-social{
  display:flex; align-items:center; gap:.4em;
}
.nav-social:hover{color:var(--gold-dark);}
.header-cta{margin-left:.5rem;}
.nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:40px; height:40px;
  border:none; background:none;
  cursor:pointer;
  margin-left:auto;
}
.nav-toggle span{
  display:block; height:2px; background:var(--navy); border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ============ Hero ============ */
.hero{
  position:relative;
  padding:64px 0 80px;
  overflow:hidden;
}
.hero-inner{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:48px;
  align-items:center;
}
.hero h1{
  font-size:clamp(2.1rem, 4vw, 3rem);
  max-width:14ch;
}
.ink-highlight{
  background:linear-gradient(180deg, transparent 62%, var(--gold) 62%);
}
.lede{font-size:1.1rem; color:var(--ink-soft); max-width:46ch;}
.age-pill{
  display:inline-flex; align-items:center; gap:.5em;
  background:var(--navy); color:#fff;
  font-weight:700; font-size:.95rem;
  padding:.6em 1.1em; border-radius:999px;
  margin-bottom:1.6rem;
}
.hero-actions{display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:1.2rem;}
.hero-note{color:var(--ink-soft); font-size:.9rem;}

.hero-art{position:relative; min-height:360px; display:flex; justify-content:center;}
.hero-art picture{position:relative; z-index:1;}
.blob{position:absolute; border-radius:50%;}
.blob-a{width:300px; height:300px; background:var(--sky); top:-20px; right:0; z-index:0;}
.blob-b{width:150px; height:150px; background:var(--gold); opacity:.25; bottom:10px; left:0; z-index:0;}
.hero-photo{
  position:relative; z-index:1;
  width:min(340px, 78vw);
  aspect-ratio:559/785;
  object-fit:cover;
  object-position:top center;
  border-radius:32px 32px 32px 120px;
  border:6px solid #fff;
  box-shadow:var(--shadow-soft);
}
.speech-bubble{
  position:absolute; top:-10px; right:2%;
  background:#fff; border:2px solid var(--navy);
  border-radius:22px 22px 22px 4px;
  padding:14px 18px;
  font-family:var(--font-script);
  font-size:1.35rem; line-height:1.15;
  color:var(--navy);
  box-shadow:var(--shadow-soft);
  z-index:2;
  max-width:220px;
}

/* ============ Benefits ============ */
.benefits{padding:72px 0;}
.benefits h2, .modalidades h2{
  font-size:clamp(1.6rem, 3vw, 2.1rem);
  text-align:center;
  margin-bottom:.3em;
}
.benefit-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
  margin-top:2.4rem;
}
.benefit-card{
  background:#fff;
  border-radius:var(--radius-md);
  padding:28px 22px;
  box-shadow:0 10px 24px -18px rgba(22,38,77,0.4);
  border:1px solid rgba(22,38,77,0.06);
  transition:transform .2s ease, box-shadow .2s ease;
}
.benefit-card:hover{transform:translateY(-4px); box-shadow:0 18px 30px -18px rgba(22,38,77,0.45);}
.benefit-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:50%;
  font-size:1.4rem; margin-bottom:.9rem;
}
.icon-gold{background:#FFF3DA;}
.icon-blue{background:#E4F0FF;}
.icon-pink{background:#FFE7EC;}
.icon-green{background:#EAF7EE;}
.benefit-card h3{font-size:1.05rem;}
.benefit-card p{color:var(--ink-soft); font-size:.95rem; margin-bottom:0;}

/* ============ Modalidades ============ */
.modalidades{background:var(--navy); color:#fff; padding:80px 0;}
.modalidades h2{color:#fff;}
.section-lede{text-align:center; color:#C9D4EC; margin-bottom:2.4rem;}
.mode-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-bottom:2.6rem;
}
.mode-card{
  border-radius:var(--radius-md);
  padding:28px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.14);
}
.mode-icon{font-size:2rem; display:block; margin-bottom:.6rem;}
.mode-card h3{color:#fff;}
.mode-card p{color:#C9D4EC; margin-bottom:0;}

.checklist{
  list-style:none; margin:0 0 2.4rem; padding:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.9rem 2rem;
  max-width:820px;
  margin-left:auto; margin-right:auto;
}
.checklist li{
  position:relative;
  padding-left:1.9rem;
  color:#E7ECF8;
}
.checklist li::before{
  content:"✓";
  position:absolute; left:0; top:0;
  width:1.3rem; height:1.3rem;
  border-radius:50%;
  background:var(--green);
  color:#fff;
  font-size:.8rem;
  display:flex; align-items:center; justify-content:center;
}
.callout{
  background:var(--gold);
  color:var(--navy);
  border-radius:var(--radius-md);
  padding:24px 28px;
  max-width:720px;
  margin:0 auto;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.4rem 1rem;
}
.callout strong{font-family:var(--font-display); font-size:1.15rem; flex-basis:100%;}
.callout span{flex:1 1 260px;}
.callout .btn{background:var(--navy); color:#fff; box-shadow:none;}
.callout .btn:hover{background:var(--navy-2);}

/* ============ A domicílio ============ */
.domicilio{background:var(--sky); padding:80px 0;}
.domicilio-inner{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
.eyebrow{
  display:inline-block; margin-bottom:.8rem;
  font-weight:800; font-size:.85rem; letter-spacing:.04em; text-transform:uppercase;
  color:var(--gold-dark);
}
.domicilio h2{font-size:clamp(1.6rem, 3vw, 2.1rem);}
.domicilio-text p{color:var(--ink-soft);}
.domicilio-text .btn{margin-top:.4rem;}
.domicilio-list{list-style:none; margin:0; padding:0; display:grid; gap:14px;}
.domicilio-list li{
  display:flex; gap:.9rem; align-items:flex-start;
  background:#fff; border-radius:var(--radius-md);
  padding:18px 20px;
  box-shadow:0 10px 24px -18px rgba(22,38,77,0.4);
}
.domicilio-list li > span{font-size:1.5rem; line-height:1.2;}
.domicilio-list strong{display:block; font-family:var(--font-display); color:var(--navy);}
.domicilio-list div span{color:var(--ink-soft); font-size:.95rem;}

/* ============ Dúvidas ============ */
.faq{padding:72px 0 16px;}
.faq h2{font-size:clamp(1.6rem, 3vw, 2.1rem); text-align:center; margin-bottom:1.6rem;}
.faq-list{max-width:760px; margin:0 auto; display:grid; gap:12px;}
.faq details{
  background:#fff; border-radius:var(--radius-sm);
  border:1px solid rgba(22,38,77,0.1);
  padding:0 20px;
}
.faq summary{
  cursor:pointer; list-style:none;
  padding:18px 28px 18px 0; position:relative;
  font-family:var(--font-display); font-weight:600; color:var(--navy);
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"+"; position:absolute; right:0; top:50%; transform:translateY(-50%);
  font-size:1.4rem; color:var(--gold-dark); transition:transform .2s ease;
}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg);}
.faq details p{color:var(--ink-soft); margin:0 0 18px;}

/* ============ Como começar ============ */
.steps{padding:80px 0;}
.steps h2{font-size:clamp(1.6rem, 3vw, 2.1rem); text-align:center; margin-bottom:.3em;}
.steps .section-lede{color:var(--ink-soft);}
.step-list{
  list-style:none; margin:0; padding:0;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
.step-card{
  position:relative;
  background:#fff;
  border-radius:var(--radius-md);
  padding:32px 24px 26px;
  border:2px dashed rgba(22,38,77,0.16);
  text-align:center;
}
.step-number{
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:50%;
  background:var(--gold); color:var(--navy);
  font-family:var(--font-display); font-weight:700; font-size:1.4rem;
  margin-bottom:.9rem;
}
.step-card h3{font-size:1.15rem;}
.step-card p{color:var(--ink-soft); margin:0;}

/* ============ Info bar ============ */
.info-bar{background:var(--sky); padding:40px 0;}
.info-bar-inner{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
.info-item{display:flex; gap:.8rem; align-items:flex-start;}
.info-icon{font-size:1.4rem; line-height:1.2;}
.info-item strong{display:block; color:var(--navy); font-family:var(--font-display); font-size:1rem;}
.info-text{color:var(--ink-soft); font-size:.9rem;}
.info-text a{color:var(--navy); font-weight:700;}

/* ============ CTA ============ */
.cta{padding:88px 0; text-align:center;}
.cta h2{font-size:clamp(1.7rem, 3.2vw, 2.3rem); max-width:20ch; margin:0 auto .3em;}
.cta p{color:var(--ink-soft); max-width:44ch; margin:0 auto 1.8rem;}
.cta-instagram{
  display:flex; align-items:center; gap:.5em;
  width:fit-content;
  margin:1.4rem auto 0;
  color:var(--navy);
  font-weight:700;
  text-decoration:none;
  border-bottom:2px solid transparent;
  transition:border-color .15s ease, color .15s ease;
}
.cta-instagram:hover{border-color:var(--gold); color:var(--gold-dark);}

/* ============ Footer ============ */
.site-footer{background:var(--navy); color:#C9D4EC; padding:32px 0 0;}
.footer-inner{text-align:center;}
.footer-logo{width:72px; height:72px; object-fit:contain; margin:0 auto 12px; display:block;}
.footer-tagline{
  font-family:var(--font-script);
  font-size:1.4rem;
  color:var(--gold);
  margin-bottom:.6rem;
}
.footer-social{
  display:inline-flex; align-items:center; gap:.5em;
  color:#E7ECF8;
  text-decoration:none;
  font-weight:700;
  font-size:.92rem;
  margin-bottom:.8rem;
}
.footer-social:hover{color:var(--gold);}
.footer-copy{font-size:.85rem; margin:0 0 .5rem;}
.footer-credit{
  margin-top:20px;
  border-top:1px solid rgba(255,255,255,0.08);
  padding:14px 16px;
  display:flex; justify-content:center; align-items:center;
  text-align:center;
}
.credit-pill{
  display:inline-block;
  margin:0 auto;
  font-size:.82rem;
  color:#E7ECF8;
  padding:.45em 1.1em;
  border-radius:999px;
  border:1px solid rgba(63,167,114,0.45);
  background:#123524;
}
.credit-heart{color:#E5484D;}
.credit-pill a{color:#fff; font-weight:800; text-decoration:underline; text-underline-offset:2px;}
.credit-pill a:hover{color:var(--gold);}

/* ============ WhatsApp float ============ */
.whatsapp-float{
  position:fixed;
  right:22px; bottom:22px;
  width:58px; height:58px;
  background:var(--green);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px -8px rgba(0,0,0,0.45);
  z-index:60;
  text-decoration:none;
  transform:translateY(0);
  transition:transform .2s ease, opacity .2s ease;
}
.whatsapp-float:hover{transform:translateY(-3px);}
.whatsapp-float.is-hidden{opacity:0; transform:translateY(16px); pointer-events:none;}

/* ============ Responsive ============ */
@media (max-width:1080px){
  .main-nav{
    position:absolute; top:100%; left:0; right:0;
    background:var(--cream);
    flex-direction:column;
    gap:0;
    padding:8px 24px 16px;
    border-bottom:1px solid rgba(22,38,77,0.1);
    box-shadow:0 18px 30px -20px rgba(22,38,77,0.4);
    display:none;
  }
  .main-nav.is-open{display:flex;}
  .main-nav a{padding:.8rem 0; font-size:1.05rem; border-bottom:1px solid rgba(22,38,77,0.06);}
  .main-nav a:last-child{border-bottom:none;}
  .main-nav a::after{display:none;}
  .main-nav a.is-active{color:var(--gold-dark);}
  .header-cta{margin-left:auto;}
  .nav-toggle{display:flex; margin-left:.25rem;}
}

@media (max-width:900px){
  .step-list{grid-template-columns:1fr; max-width:480px; margin:0 auto;}
  .domicilio-inner{grid-template-columns:1fr; gap:32px;}
  .hero-inner{grid-template-columns:1fr; text-align:center;}
  .hero h1{max-width:none; margin-left:auto; margin-right:auto;}
  .lede{margin-left:auto; margin-right:auto;}
  .hero-actions{justify-content:center;}
  .hero-art{order:-1; min-height:280px;}
  .benefit-grid{grid-template-columns:repeat(2, 1fr);}
  .mode-grid{grid-template-columns:1fr;}
  .checklist{grid-template-columns:1fr;}
  .info-bar-inner{grid-template-columns:1fr;}
}

@media (max-width:640px){
  .header-cta{display:none;}
  .nav-toggle{margin-left:auto;}
  .wrap, .header-inner, .main-nav{padding-left:16px; padding-right:16px;}
  .hero{padding:40px 0 56px;}
  .benefit-grid{grid-template-columns:1fr;}
  .speech-bubble{position:static; margin:0 auto 1rem; max-width:260px;}
  .hero-art{display:flex; flex-direction:column; align-items:center;}
}