:root{
    --rosa-bebe: #F8D7E3;
    --rosa-bebe-suave: #FCEAF1;
    --rosa-forte: #D6437B;
    --rosa-forte-escuro: #AE2E5F;
    --branco: #FFFFFF;
    --creme: #FFF8FA;
    --texto: #3E2A34;
    --texto-suave: #8A6C78;
    --linha: #F0D2DE;
  }

  *{margin:0;padding:0;box-sizing:border-box;}

  html{scroll-behavior:smooth;}

  body{
    background:var(--rosa-bebe-suave);
    color:var(--texto);
    font-family:'Manrope',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  h1,h2,h3,.brand{
    font-family:'Fraunces',serif;
    font-weight:500;
    letter-spacing:-0.01em;
  }

  a{color:inherit;text-decoration:none;}

  .container{
    max-width:1120px;
    margin:0 auto;
    padding:0 32px;
  }

  /* ---------- HEADER ---------- */
  header{
    position:sticky;
    top:0;
    z-index:70;
    padding:16px 20px;
    background:#2E1524;
  }

  .nav-wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:14px 22px;
    max-width:1180px;
    margin:0 auto;
    background:linear-gradient(180deg, #4A3540 0%, #3A2732 100%);
    border-radius:999px;
    box-shadow:0 16px 40px -14px rgba(62,42,52,0.45);
  }

  .brand-mark{
    display:flex;
    align-items:center;
    gap:12px;
  }
  .brand-badge{
    width:38px;height:38px;
    border-radius:50%;
    background:var(--rosa-bebe-suave);
    display:flex;align-items:center;justify-content:center;
    color:var(--rosa-forte-escuro);
    font-family:'Fraunces',serif;
    font-weight:600;
    font-size:15px;
    flex-shrink:0;
    border:1.5px solid rgba(248,215,227,0.5);
    overflow:hidden;
  }
  .brand-badge img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .brand{
    font-size:17px;
    color:var(--branco);
    line-height:1.15;
  }
  .brand span{
    display:block;
    font-family:'Manrope',sans-serif;
    font-size:10px;
    font-weight:600;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--rosa-bebe);
    margin-top:2px;
  }

  .nav-wrap nav ul{
    display:flex;
    gap:24px;
    list-style:none;
  }
  .nav-wrap nav a{
    font-size:12.5px;
    font-weight:600;
    letter-spacing:0.02em;
    text-transform:uppercase;
    color:#E9D2DC;
    position:relative;
    padding-bottom:4px;
    white-space:nowrap;
  }
  .nav-wrap nav a::after{
    content:'';
    position:absolute;
    left:0;bottom:0;
    width:0;height:2px;
    background:var(--rosa-bebe);
    transition:width .25s ease;
  }
  .nav-wrap nav a:hover{color:var(--branco);}
  .nav-wrap nav a:hover::after{width:100%;}

  .header-actions{
    display:flex;
    align-items:center;
    gap:18px;
  }
  .icon-btn{
    width:20px;height:20px;
    color:#E9D2DC;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;
    transition:color .2s ease;
  }
  .icon-btn:hover{color:var(--branco);}
  .icon-btn svg{width:100%;height:100%;}

  .btn-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 20px;
    border-radius:999px;
    font-size:13.5px;
    font-weight:700;
    color:var(--branco);
    background:linear-gradient(135deg, var(--rosa-forte) 0%, var(--rosa-forte-escuro) 100%);
    box-shadow:0 8px 18px -6px rgba(214,67,123,0.6);
    transition:transform .2s ease, box-shadow .2s ease;
    white-space:nowrap;
  }
  .btn-cta:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 22px -6px rgba(214,67,123,0.7);
  }
  .btn-cta svg{width:15px;height:15px;flex-shrink:0;}

  @media (max-width:980px){
    .nav-wrap nav{display:none;}
  }
  .btn-cta-calc{
    background:linear-gradient(135deg, #D6437B 0%, #8B2350 100%);
  }

  @media (max-width:760px){
    .btn-cta-calc{display:none;}
  }
  @media (max-width:560px){
    .header-actions .icon-btn{display:none;}
    .brand span{display:none;}
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding:96px 32px 64px;
    text-align:center;
  }

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--rosa-bebe-suave);
    border:1px solid var(--rosa-bebe);
    color:var(--rosa-forte-escuro);
    font-size:12px;
    font-weight:700;
    letter-spacing:0.1em;
    text-transform:uppercase;
    padding:8px 18px;
    border-radius:999px;
    margin-bottom:28px;
  }

  .hero h1{
    font-size:clamp(36px,6vw,64px);
    line-height:1.08;
    max-width:820px;
    margin:0 auto 20px;
    color:var(--texto);
  }
  .hero h1 em{
    font-style:italic;
    color:var(--rosa-forte);
  }

  .hero p{
    max-width:520px;
    margin:0 auto 40px;
    font-size:17px;
    line-height:1.65;
    color:var(--texto-suave);
  }

  .cta-row{
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:64px;
  }

  .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:15px 30px;
    border-radius:999px;
    font-weight:700;
    font-size:14.5px;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  }
  .btn-primary{
    background:var(--rosa-forte);
    color:var(--branco);
    box-shadow:0 10px 24px -8px rgba(214,67,123,0.55);
  }
  .btn-primary:hover{
    background:var(--rosa-forte-escuro);
    transform:translateY(-2px);
  }
  .btn-ghost{
    background:transparent;
    color:var(--rosa-forte-escuro);
    border:1.5px solid var(--rosa-bebe);
  }
  .btn-ghost:hover{
    background:var(--rosa-bebe-suave);
    transform:translateY(-2px);
  }

  /* Signature pulse line: ECG trace that resolves into a soft heart */
  .pulse-wrap{
    max-width:760px;
    margin:0 auto;
    opacity:0;
    animation:fadeIn 1s ease forwards .3s;
  }
  @keyframes fadeIn{to{opacity:1;}}

  .pulse-path{
    stroke-dasharray:1600;
    stroke-dashoffset:1600;
    animation:draw 2.6s cubic-bezier(.65,0,.35,1) forwards .5s;
  }
  @keyframes draw{to{stroke-dashoffset:0;}}

  .pulse-heart{
    opacity:0;
    transform-origin:center;
    animation:heartIn .6s ease forwards 2.7s, beat 2.4s ease-in-out infinite 3.4s;
  }
  @keyframes heartIn{to{opacity:1;}}
  @keyframes beat{
    0%,100%{transform:scale(1);}
    50%{transform:scale(1.08);}
  }

  @media (prefers-reduced-motion: reduce){
    .pulse-path, .pulse-heart, .pulse-wrap{animation:none !important; opacity:1 !important; stroke-dashoffset:0 !important;}
  }

  /* ---------- SECTION HEADINGS ---------- */
  .section{padding:88px 0;}
  .section-head{
    text-align:center;
    max-width:560px;
    margin:0 auto 52px;
  }
  .section-head .eyebrow{margin-bottom:18px;}
  .section-head h2{
    font-size:clamp(28px,4vw,40px);
    margin-bottom:14px;
  }
  .section-head p{
    color:var(--texto-suave);
    font-size:16px;
    line-height:1.6;
  }

  /* ---------- PRODUCTS (empty state, ready to receive cards) ---------- */
  #produtos{background:var(--branco);}

  .produtos-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:24px;
  }

  .produto-placeholder{
    border:1.5px dashed var(--rosa-bebe);
    border-radius:20px;
    background:var(--rosa-bebe-suave);
    padding:40px 28px;
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
    min-height:260px;
    justify-content:center;
  }
  .produto-placeholder .icone{
    width:44px;height:44px;
    border-radius:50%;
    background:var(--branco);
    display:flex;align-items:center;justify-content:center;
    color:var(--rosa-forte);
    font-size:20px;
  }
  .produto-placeholder h3{
    font-size:17px;
    color:var(--rosa-forte-escuro);
  }
  .produto-placeholder p{
    font-size:13.5px;
    color:var(--texto-suave);
    line-height:1.5;
  }

  .aviso-em-breve{
    margin-top:44px;
    text-align:center;
    background:var(--creme);
    border:1px solid var(--linha);
    border-radius:18px;
    padding:28px 24px;
    max-width:560px;
    margin-left:auto;
    margin-right:auto;
  }
  .aviso-em-breve p{
    font-size:15px;
    color:var(--texto-suave);
    line-height:1.6;
  }
  .aviso-em-breve strong{color:var(--rosa-forte-escuro);}

  /* ---------- SOBRE ---------- */
  #sobre{
    background:linear-gradient(180deg, var(--branco) 0%, var(--rosa-bebe-suave) 100%);
  }
  .sobre-grid{
    display:grid;
    grid-template-columns:220px 1fr;
    gap:48px;
    align-items:center;
  }
  @media (max-width:680px){
    .sobre-grid{grid-template-columns:1fr; text-align:center;}
  }
  .foto-placeholder{
    width:220px;height:220px;
    border-radius:50%;
    background:var(--rosa-bebe);
    border:6px solid var(--branco);
    box-shadow:0 20px 40px -16px rgba(214,67,123,0.35);
    display:flex;align-items:center;justify-content:center;
    color:var(--rosa-forte-escuro);
    font-family:'Fraunces',serif;
    font-size:15px;
    text-align:center;
    padding:20px;
    margin:0 auto;
    overflow:hidden;
    flex-shrink:0;
  }
  .foto-placeholder img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
  }
  #sobre h2{font-size:28px;margin-bottom:14px;}
  #sobre p{
    color:var(--texto-suave);
    font-size:15.5px;
    line-height:1.7;
    max-width:520px;
  }

  /* ---------- FOOTER ---------- */
  footer{
    background:var(--texto);
    color:var(--rosa-bebe-suave);
    padding:56px 32px 32px;
    text-align:center;
  }
  footer .brand{color:var(--branco);font-size:20px;margin-bottom:10px;}
  footer p{
    color:#C9A6B5;
    font-size:14px;
    max-width:420px;
    margin:0 auto 24px;
    line-height:1.6;
  }
  .footer-links{
    display:flex;
    gap:24px;
    justify-content:center;
    margin-bottom:28px;
    flex-wrap:wrap;
  }
  .footer-links a{
    font-size:13.5px;
    font-weight:600;
    color:var(--rosa-bebe);
  }
  .footer-links a:hover{color:var(--branco);}
  footer .linha-final{
    border-top:1px solid rgba(255,255,255,0.1);
    padding-top:22px;
    font-size:12.5px;
    color:#9C7A88;
  }

  .fade-up{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .7s ease, transform .7s ease;
  }
  .fade-up.visible{
    opacity:1;
    transform:translateY(0);
  }
.nav-wrap nav a.active{
  color:var(--branco);
}
.nav-wrap nav a.active::after{
  width:100%;
}

/* ---------- PAGE HERO (subpáginas) ---------- */
.page-hero{
  position:relative;
  padding:76px 32px 48px;
  text-align:center;
  background:linear-gradient(180deg, var(--rosa-bebe-suave) 0%, var(--creme) 100%);
  border-bottom:1px solid var(--linha);
  overflow:hidden;
}
.page-hero::before{
  content:'';
  position:absolute;
  top:-120px; right:-120px;
  width:320px; height:320px;
  border-radius:50%;
  background:radial-gradient(circle, var(--rosa-bebe) 0%, transparent 70%);
  opacity:.6;
}
.page-hero::after{
  content:'';
  position:absolute;
  bottom:-140px; left:-100px;
  width:280px; height:280px;
  border-radius:50%;
  background:radial-gradient(circle, var(--rosa-bebe) 0%, transparent 70%);
  opacity:.5;
}
.page-hero .container{position:relative;z-index:1;}
.page-hero h1{
  font-size:clamp(32px,5vw,50px);
  line-height:1.1;
  max-width:640px;
  margin:0 auto 16px;
}
.page-hero h1 em{font-style:italic;color:var(--rosa-forte);}
.page-hero > .container > p{
  max-width:480px;
  margin:0 auto;
  color:var(--texto-suave);
  font-size:16px;
  line-height:1.65;
}
.mini-pulse{
  max-width:420px;
  margin:36px auto 0;
  opacity:0;
  animation:fadeIn 1s ease forwards .3s;
}
.mini-pulse .pulse-path{
  stroke-dasharray:900;
  stroke-dashoffset:900;
  animation:draw 1.8s cubic-bezier(.65,0,.35,1) forwards .4s;
}

/* ---------- ESTEIRA (produtos reais na index) ---------- */
#esteira{
  background:transparent;
}

.esteira-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:24px;
}

.produto-card{
  background:var(--creme);
  border:1px solid var(--linha);
  border-radius:20px;
  padding:32px 28px;
  display:flex;
  flex-direction:column;
  gap:14px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.produto-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 36px -18px rgba(214,67,123,0.35);
}

.produto-card .tag{
  display:inline-flex;
  align-self:flex-start;
  background:var(--rosa-bebe-suave);
  color:var(--rosa-forte-escuro);
  font-size:11px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  padding:5px 12px;
  border-radius:999px;
}

.produto-card h3{
  font-family:'Fraunces',serif;
  font-size:20px;
  color:var(--texto);
}

.produto-card p{
  font-size:14.5px;
  line-height:1.6;
  color:var(--texto-suave);
  flex-grow:1;
}

.produto-card .rodape-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:6px;
}

.produto-card .preco{
  font-family:'Fraunces',serif;
  font-size:22px;
  color:var(--rosa-forte-escuro);
}
.produto-card .preco span{
  font-family:'Manrope',sans-serif;
  font-size:12px;
  color:var(--texto-suave);
  font-weight:600;
}

.produto-card .btn-card{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 18px;
  border-radius:999px;
  background:var(--rosa-forte);
  color:var(--branco);
  font-size:13px;
  font-weight:700;
  transition:background .2s ease, transform .2s ease;
}
.produto-card .btn-card:hover{
  background:var(--rosa-forte-escuro);
  transform:translateY(-1px);
}

/* ---------- ESTEIRA (carrossel) ---------- */
.carrossel-wrap{
  position:relative;
}

.carrossel{
  display:flex;
  gap:20px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:6px 4px 20px;
  -ms-overflow-style:none;
  scrollbar-width:none;
  cursor:grab;
}
.carrossel.arrastando{
  cursor:grabbing;
  scroll-behavior:auto;
}
.carrossel::-webkit-scrollbar{display:none;}

.carrossel-card{
  flex:0 0 320px;
  scroll-snap-align:start;
  background:var(--branco);
  border:1px solid var(--linha);
  border-radius:18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
  user-select:none;
}
.carrossel-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 32px -16px rgba(214,67,123,0.35);
}

.card-imagem{
  height:190px;
  background:linear-gradient(135deg, var(--rosa-bebe) 0%, var(--rosa-forte) 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.card-imagem:has(img){
  height:auto;
}
.card-imagem img{
  width:100%;
  height:auto;
  display:block;
}
.card-imagem span{
  font-family:'Fraunces',serif;
  font-style:italic;
  color:rgba(255,255,255,0.85);
  font-size:17px;
}
.card-imagem.vazia{
  background:var(--rosa-bebe-suave);
  border-bottom:1px dashed var(--rosa-bebe);
}
.card-imagem.vazia span{color:var(--rosa-forte-escuro);}

.card-corpo{
  padding:22px 22px 24px;
  display:flex;
  flex-direction:column;
  gap:9px;
  flex-grow:1;
}
.card-corpo .tag{
  display:inline-flex;
  align-self:flex-start;
  background:var(--rosa-bebe-suave);
  color:var(--rosa-forte-escuro);
  font-size:11px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  padding:5px 11px;
  border-radius:999px;
}
.card-corpo h3{
  font-family:'Fraunces',serif;
  font-size:19px;
  color:var(--texto);
  line-height:1.25;
}
.card-corpo p{
  font-size:14px;
  line-height:1.55;
  color:var(--texto-suave);
  flex-grow:1;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.card-corpo .preco-mini{
  font-family:'Fraunces',serif;
  font-size:18px;
  color:var(--rosa-forte-escuro);
  margin-top:2px;
}
.card-corpo .btn-mini{
  margin-top:8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 18px;
  border-radius:999px;
  background:var(--rosa-forte);
  color:var(--branco);
  font-size:13.5px;
  font-weight:700;
  transition:background .2s ease, transform .2s ease;
}
.card-corpo .btn-mini:hover{
  background:var(--rosa-forte-escuro);
  transform:translateY(-1px);
}

.carrossel-seta{
  position:absolute;
  top:45%;
  transform:translateY(-50%);
  width:38px;height:38px;
  border-radius:50%;
  background:var(--branco);
  border:1px solid var(--linha);
  box-shadow:0 8px 20px -8px rgba(62,42,52,0.25);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--rosa-forte-escuro);
  cursor:pointer;
  z-index:2;
  transition:background .2s ease, transform .2s ease;
}
.carrossel-seta:hover{background:var(--rosa-bebe-suave);}
.carrossel-seta svg{width:18px;height:18px;}
.carrossel-seta.esquerda{left:-18px;}
.carrossel-seta.direita{right:-18px;}

@media (max-width:640px){
  .carrossel-seta{display:none;}
}

/* ---------- PRODUTOS POR FASE ---------- */
#fases{background:transparent;}

.fases-subtitulo{
  text-align:center;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-size:18px;
  color:var(--rosa-forte-escuro);
  max-width:640px;
  white-space:nowrap;
  margin:0 auto 36px;
  line-height:1.5;
}
@media (max-width:640px){
  .fases-subtitulo{
    white-space:normal;
    font-size:16px;
  }
}

.fases-botoes{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  justify-content:center;
  margin-bottom:48px;
}

.fase-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:13px 26px;
  border-radius:999px;
  font-size:14.5px;
  font-weight:700;
  color:var(--branco);
  background:linear-gradient(135deg, var(--rosa-forte) 0%, var(--rosa-forte-escuro) 100%);
  border:none;
  cursor:pointer;
  box-shadow:0 8px 18px -8px rgba(214,67,123,0.5);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.fase-btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.05);
}
.fase-btn.selecionado{
  outline:3px solid var(--rosa-bebe);
  outline-offset:2px;
}

.fase-btn.azul{
  background:linear-gradient(135deg, #7FA8D9 0%, #4C74B0 100%);
  box-shadow:0 8px 18px -8px rgba(76,116,176,0.5);
}
.fase-btn.amarelo{
  background:linear-gradient(135deg, #F0C24E 0%, #D9A62E 100%);
  color:var(--texto);
  box-shadow:0 8px 18px -8px rgba(217,166,46,0.45);
}
.fase-btn[data-fase="todos"]{
  background:var(--branco);
  color:var(--texto);
  border:1.5px solid var(--linha);
  box-shadow:none;
}
.fase-btn[data-fase="todos"]:hover{
  background:var(--creme);
}
.fase-btn[data-fase="todos"].selecionado{
  outline-color:var(--linha);
}

/* ---------- VITRINE (reordenável por fase) ---------- */
.vitrine-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:20px;
  margin-top:8px;
}

.vitrine-card{
  background:var(--creme);
  border:1px solid var(--linha);
  border-radius:16px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  will-change:transform;
}
.vitrine-card:hover{
  box-shadow:0 14px 26px -14px rgba(214,67,123,0.3);
}

.vitrine-imagem{
  background:linear-gradient(135deg, var(--cor-img-1, var(--fase-gestante-suave1)) 0%, var(--cor-img-2, var(--fase-gestante-suave2)) 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  text-align:center;
  transition:background .4s ease;
  overflow:hidden;
}
.vitrine-imagem:has(img){
  padding:0;
}
.vitrine-imagem img{
  width:100%;
  height:auto;
  display:block;
}
.vitrine-imagem span{
  font-family:'Fraunces',serif;
  font-style:italic;
  color:var(--texto);
  opacity:.75;
  font-size:12.5px;
  line-height:1.3;
}

.vitrine-corpo{
  padding:14px 16px 16px;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex-grow:1;
}
.vitrine-corpo .tag{
  display:inline-flex;
  align-self:flex-start;
  background:var(--rosa-bebe-suave);
  color:var(--rosa-forte-escuro);
  font-size:10px;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding:3px 9px;
  border-radius:999px;
}
.vitrine-corpo h3{
  font-family:'Fraunces',serif;
  font-size:14.5px;
  color:var(--texto);
  line-height:1.3;
}
.vitrine-corpo .btn-mini{
  margin-top:auto;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  padding:7px 14px;
  border-radius:999px;
  background:var(--rosa-forte);
  color:var(--branco);
  font-size:11.5px;
  font-weight:700;
  transition:background .2s ease, transform .2s ease;
}
.vitrine-corpo .btn-mini:hover{
  background:var(--rosa-forte-escuro);
  transform:translateY(-1px);
}

/* ---------- CORES POR FASE (aura + botões) ---------- */
:root{
  --fase-tentante: #FDEFF4;
  --fase-tentante-escuro: #E9A7C0;
  --fase-gestante: #F8D7E3;
  --fase-gestante-escuro: #D97BA0;
  --fase-puerpera: #D6437B;
  --fase-puerpera-escuro: #AE2E5F;
  --fase-mae-anjo: #7A2748;
  --fase-mae-anjo-escuro: #591A33;
  --fase-pai: #7FA8D9;
  --fase-pai-escuro: #4C74B0;
  --fase-rede: #F0C24E;
  --fase-rede-escuro: #D9A62E;
}

.fase-btn[data-fase="tentante"]{
  background:linear-gradient(135deg, var(--fase-tentante) 0%, var(--fase-tentante-escuro) 100%);
  color:var(--rosa-forte-escuro);
  box-shadow:0 8px 18px -8px rgba(233,167,192,0.6);
}
.fase-btn[data-fase="gestante"]{
  background:linear-gradient(135deg, var(--fase-gestante) 0%, var(--fase-gestante-escuro) 100%);
  color:var(--rosa-forte-escuro);
  box-shadow:0 8px 18px -8px rgba(217,123,160,0.55);
}
.fase-btn[data-fase="puerpera"]{
  background:linear-gradient(135deg, var(--fase-puerpera) 0%, var(--fase-puerpera-escuro) 100%);
  color:var(--branco);
}
.fase-btn[data-fase="mae-de-anjo"]{
  background:linear-gradient(135deg, var(--fase-mae-anjo) 0%, var(--fase-mae-anjo-escuro) 100%);
  color:var(--branco);
  box-shadow:0 8px 18px -8px rgba(89,26,51,0.55);
}
.fase-btn[data-fase="pai"]{
  background:linear-gradient(135deg, var(--fase-pai) 0%, var(--fase-pai-escuro) 100%);
  color:var(--branco);
}
.fase-btn[data-fase="rede-de-apoio"]{
  background:linear-gradient(135deg, var(--fase-rede) 0%, var(--fase-rede-escuro) 100%);
  color:var(--texto);
}

/* ---------- Destaque da vitrine ao filtrar ---------- */
.vitrine-card.em-destaque{
  box-shadow:
    0 0 0 1px var(--aura-cor, transparent),
    0 0 36px 6px var(--aura-brilho, transparent),
    0 16px 30px -16px rgba(62,42,52,0.3);
}
.vitrine-card.fora-filtro{
  opacity:.4;
  filter:saturate(.7);
}
.vitrine-divisor{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  gap:12px;
  margin:8px 0 4px;
  color:var(--texto-suave);
  font-size:12px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.vitrine-divisor::before,
.vitrine-divisor::after{
  content:'';
  flex:1;
  height:1px;
  background:var(--linha);
}

/* ---------- Tons suaves para o topo dos cards (por fase) ---------- */
:root{
  --fase-tentante-suave1: #FDF6F9;
  --fase-tentante-suave2: #F6D9E4;
  --fase-gestante-suave1: #FBEAF1;
  --fase-gestante-suave2: #F0BFD3;
  --fase-puerpera-suave1: #F6D9E4;
  --fase-puerpera-suave2: #E8A4C0;
  --fase-mae-anjo-suave1: #EFD8E0;
  --fase-mae-anjo-suave2: #C98CA8;
  --fase-pai-suave1: #E7EEF8;
  --fase-pai-suave2: #A9C3E3;
  --fase-rede-suave1: #FDF3DC;
  --fase-rede-suave2: #EFCF7E;
}

/* ---------- PAGE HERO ESCURO (contraste em tons de rosa) ---------- */
.page-hero.escuro{
  background:linear-gradient(180deg, #2E1524 0%, var(--rosa-bebe-suave) 100%);
}
.page-hero.escuro::before{
  background:radial-gradient(circle, rgba(214,67,123,0.35) 0%, transparent 70%);
  opacity:1;
}
.page-hero.escuro::after{
  background:radial-gradient(circle, rgba(233,167,192,0.25) 0%, transparent 70%);
  opacity:1;
}
.page-hero.escuro .eyebrow{
  background:rgba(248,215,227,0.12);
  border-color:rgba(248,215,227,0.25);
  color:var(--fase-tentante);
}
.page-hero.escuro h1{
  color:var(--branco);
}
.page-hero.escuro h1 em{
  color:var(--fase-tentante);
}
.page-hero.escuro > .container > p{
  color:#D9AEBF;
}
.page-hero.escuro .mini-pulse .pulse-path{
  stroke:var(--fase-tentante);
}

/* ---------- HERO PRINCIPAL ESCURO (index) ---------- */
.hero.escuro{
  background:linear-gradient(180deg, #2E1524 0%, var(--rosa-bebe-suave) 100%);
}
.hero.escuro .eyebrow{
  background:rgba(248,215,227,0.12);
  border-color:rgba(248,215,227,0.25);
  color:var(--fase-tentante);
}
.hero.escuro h1{color:var(--branco);}
.hero.escuro h1 em{color:var(--fase-tentante);}
.hero.escuro p{color:#D9AEBF;}

.hero.escuro .btn-ghost{
  color:var(--branco);
  border-color:rgba(248,215,227,0.4);
}
.hero.escuro .btn-ghost:hover{
  background:rgba(248,215,227,0.12);
}

/* ---------- PRODUTOS GRANDES (páginas de categoria) ---------- */
.produtos-grid-grande{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:24px;
}
.produto-grande{
  background:var(--branco);
  border:1px solid var(--linha);
  border-radius:18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.produto-grande:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 32px -16px rgba(214,67,123,0.35);
}

/* ---------- Imagens reais nos cards ---------- */

/* ---------- SEÇÃO APP ENTRE MÃES ---------- */
#app-entre-maes{
  background:linear-gradient(180deg,
    var(--rosa-bebe-suave) 0%,
    #2E1524 14%,
    #2E1524 86%,
    var(--rosa-bebe-suave) 100%);
}
.app-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:56px;
  align-items:center;
}
@media (max-width:800px){
  .app-grid{grid-template-columns:1fr; text-align:center;}
}
.app-mockup{
  position:relative;
  width:100%;
  max-width:280px;
  margin:0 auto;
  aspect-ratio:9/19.5;
  border-radius:38px;
  padding:12px;
  background:linear-gradient(160deg, #2A2A2A 0%, #151515 100%);
  box-shadow:0 30px 60px -20px rgba(214,67,123,0.4), inset 0 0 0 2px rgba(255,255,255,0.06);
}
.app-mockup::before{
  content:'';
  position:absolute;
  top:12px; left:50%;
  transform:translateX(-50%);
  width:38%; height:20px;
  background:#151515;
  border-radius:0 0 16px 16px;
  z-index:2;
}
.app-mockup .app-tela{
  width:100%;
  height:100%;
  border-radius:26px;
  overflow:hidden;
  background:var(--rosa-bebe-suave);
}
.app-mockup img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
#app-entre-maes h2{
  font-size:clamp(26px,4vw,38px);
  color:var(--branco);
  margin-bottom:16px;
  line-height:1.2;
}
#app-entre-maes .app-lista{
  list-style:none;
  margin:20px 0 28px;
  padding:0;
}
#app-entre-maes .app-lista li{
  color:#E6C9D6;
  font-size:15px;
  line-height:1.6;
  padding-left:22px;
  position:relative;
  margin-bottom:8px;
}
#app-entre-maes .app-lista li::before{
  content:'✦';
  position:absolute;
  left:0;
  color:var(--fase-tentante);
  font-size:12px;
  top:4px;
}
.app-botoes{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
@media (max-width:800px){
  .app-botoes{justify-content:center;}
}
.app-botoes a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 26px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--rosa-forte) 0%, var(--rosa-forte-escuro) 100%);
  color:var(--branco);
  font-weight:700;
  font-size:14px;
  box-shadow:0 10px 24px -8px rgba(214,67,123,0.55);
  transition:transform .2s ease;
}
.app-botoes a:hover{transform:translateY(-2px);}

.app-titulo-linha{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:16px;
}
.app-icone{
  width:44px;
  height:44px;
  border-radius:14px;
  flex-shrink:0;
  box-shadow:0 6px 14px -4px rgba(0,0,0,0.3);
}
.app-titulo-linha h2{margin-bottom:0;}

/* ---------- ECOSSISTEMA (animação interativa de órbita) ---------- */
.ecossistema{
  position:relative;
  width:320px;
  height:320px;
  margin:44px auto 0;
}
@media (max-width:420px){
  .ecossistema{width:260px;height:260px;}
}

.orbita-anel{
  position:absolute;
  inset:0;
  border-radius:50%;
  border:1.5px dashed rgba(248,215,227,0.3);
  animation:orbita-girar 36s linear infinite;
}
.orbita-anel.pausado{
  animation-play-state:paused;
}
.orbita-anel.pausado .orbita-giro{
  animation-play-state:paused;
}
@keyframes orbita-girar{
  to{transform:rotate(360deg);}
}
@keyframes orbita-girar-reverso{
  to{transform:rotate(-360deg);}
}

.orbita-centro{
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  width:84px;height:84px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--rosa-forte) 0%, var(--rosa-forte-escuro) 100%);
  color:var(--branco);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Fraunces',serif;
  font-size:14px;
  font-weight:600;
  box-shadow:0 12px 28px -10px rgba(214,67,123,0.6);
  z-index:2;
}

.orbita-no{
  position:absolute;
  top:50%; left:50%;
  width:0; height:0;
}
.orbita-giro{
  position:absolute;
  transform:rotate(var(--angulo)) translate(126px) rotate(calc(-1 * var(--angulo)));
  animation:orbita-girar-reverso 36s linear infinite;
}
@media (max-width:420px){
  .orbita-giro{transform:rotate(var(--angulo)) translate(100px) rotate(calc(-1 * var(--angulo)));}
}

.orbita-visual{
  width:68px;height:68px;
  margin:-34px;
  border-radius:50%;
  background:var(--branco);
  border:3px solid var(--cor-no);
  color:var(--texto);
  font-family:'Manrope',sans-serif;
  font-size:10.5px;
  font-weight:700;
  text-align:center;
  line-height:1.15;
  padding:4px;
  cursor:pointer;
  box-shadow:0 10px 22px -8px rgba(0,0,0,0.4);
  transition:transform .25s ease, box-shadow .25s ease;
}
.orbita-visual:hover,
.orbita-visual.ativo{
  transform:scale(1.15);
  box-shadow:0 14px 28px -8px rgba(0,0,0,0.5);
}
.orbita-visual.ativo{
  background:var(--cor-no);
  color:var(--branco);
}

.ecossistema-legenda{
  position:absolute;
  bottom:-52px;
  left:50%;
  transform:translateX(-50%);
  width:280px;
  text-align:center;
  color:#E6C9D6;
  font-size:13.5px;
  line-height:1.5;
  font-style:italic;
  font-family:'Fraunces',serif;
}

.page-hero:has(.ecossistema){
  padding-bottom:100px;
}

/* ---------- CALCULADORA DE IDADE GESTACIONAL ---------- */
#calculadora{
  background:linear-gradient(180deg, var(--rosa-bebe-suave) 0%, var(--creme) 100%);
}

.calc-card{
  max-width:720px;
  margin:0 auto;
  background:var(--branco);
  border-radius:28px;
  box-shadow:0 30px 60px -24px rgba(214,67,123,0.28);
  padding:44px 36px;
  border:1px solid var(--linha);
}
@media (max-width:640px){
  .calc-card{padding:32px 22px;}
}

.calc-topo{
  text-align:center;
  margin-bottom:32px;
}
.calc-topo h2{
  font-size:clamp(24px,4vw,32px);
  color:var(--texto);
  margin-bottom:10px;
}
.calc-topo p{
  color:var(--texto-suave);
  font-size:15px;
  max-width:440px;
  margin:0 auto;
  line-height:1.55;
}

.calc-form{
  display:flex;
  flex-direction:column;
  gap:8px;
  max-width:380px;
  margin:0 auto;
}
.calc-form label{
  font-weight:700;
  font-size:14px;
  color:var(--texto);
}
.calc-subtexto{
  font-size:12.5px;
  color:var(--texto-suave);
  margin-bottom:6px;
}
.calc-campo-data{
  position:relative;
  margin-bottom:14px;
}
.calc-form input[type="date"]{
  width:100%;
  padding:14px 46px 14px 16px;
  border-radius:14px;
  border:1.5px solid var(--linha);
  background:var(--creme);
  font-family:'Manrope',sans-serif;
  font-size:15px;
  color:var(--texto);
  margin-bottom:0;
  transition:border-color .2s ease;
  -webkit-appearance:none;
  appearance:none;
}
.calc-form input[type="date"]:focus{
  outline:none;
  border-color:var(--rosa-forte);
}
.calc-form input[type="date"]::-webkit-calendar-picker-indicator{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  opacity:0;
  cursor:pointer;
}
.calc-icone-calendario{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  color:var(--rosa-forte-escuro);
  pointer-events:none;
}
.calc-erro{
  background:#FBE7EC;
  border:1px solid #F0B8C6;
  color:#B23A55;
  font-size:13.5px;
  padding:10px 14px;
  border-radius:12px;
  margin-bottom:14px;
  text-align:center;
}
.calc-form .btn{
  width:100%;
}

.calc-resultado{
  margin-top:36px;
}
.calc-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:16px;
  margin-bottom:32px;
}
.calc-mini-card{
  background:var(--rosa-bebe-suave);
  border-radius:18px;
  padding:20px 16px;
  text-align:center;
}
.calc-label{
  display:block;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--rosa-forte-escuro);
  margin-bottom:8px;
}
.calc-valor{
  display:block;
  font-family:'Fraunces',serif;
  font-size:19px;
  color:var(--texto);
  line-height:1.3;
}

.calc-timeline{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  margin-bottom:28px;
  flex-wrap:wrap;
}
.calc-timeline-etapa{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:600;
  color:var(--texto-suave);
  min-width:88px;
}
.calc-timeline-ponto{
  width:18px;height:18px;
  border-radius:50%;
  background:var(--linha);
  border:2px solid var(--branco);
  box-shadow:0 0 0 2px var(--linha);
  transition:background .3s ease, box-shadow .3s ease;
}
.calc-timeline-etapa.ativo{
  color:var(--rosa-forte-escuro);
}
.calc-timeline-etapa.ativo .calc-timeline-ponto{
  background:var(--rosa-forte);
  box-shadow:0 0 0 2px var(--rosa-forte);
}
.calc-timeline-linha{
  width:56px;
  height:2px;
  background:var(--linha);
  margin-bottom:26px;
}
@media (max-width:480px){
  .calc-timeline-linha{width:28px;}
}

.calc-mensagem{
  text-align:center;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-size:16px;
  color:var(--rosa-forte-escuro);
  max-width:440px;
  margin:0 auto 28px;
  line-height:1.55;
}

#calc-refazer{
  display:block;
  margin:0 auto;
}

.calc-form[hidden],
.calc-resultado[hidden]{
  display:none !important;
}

/* ---------- CALCULADORA: paleta rosa/magenta com brilho gloss ---------- */
.calc-card{
  position:relative;
  background:linear-gradient(160deg, #E85D8A 0%, #D6437B 42%, #8B2350 100%);
  color:var(--branco);
  overflow:hidden;
  box-shadow:0 32px 60px -20px rgba(139,35,80,0.55);
}
.calc-card::before{
  content:'';
  position:absolute;
  top:-45%; left:-10%;
  width:120%; height:75%;
  background:radial-gradient(ellipse at top, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0) 68%);
  pointer-events:none;
  z-index:0;
}
.calc-card::after{
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:46%;
  background:linear-gradient(180deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
  border-radius:28px 28px 0 0;
  pointer-events:none;
  z-index:0;
}
.calc-card > *{position:relative; z-index:1;}

.calc-card .calc-topo h2{color:var(--branco);}
.calc-card .calc-topo p{color:rgba(255,255,255,0.85);}

.calc-card .calc-form label{color:var(--branco);}
.calc-card .calc-subtexto{color:rgba(255,255,255,0.75);}
.calc-card .calc-form input[type="date"]{
  background:rgba(255,255,255,0.94);
  border:1.5px solid rgba(255,255,255,0.55);
  color:var(--texto);
}
.calc-card .calc-form input[type="date"]:focus{
  border-color:var(--branco);
}

.calc-card .calc-form .btn-primary{
  background:var(--branco);
  color:#8B2350;
  box-shadow:0 12px 26px -10px rgba(0,0,0,0.35);
}
.calc-card .calc-form .btn-primary:hover{
  background:#FCEAF1;
  transform:translateY(-2px);
}

.calc-card .calc-erro{
  background:rgba(255,255,255,0.94);
  border:1px solid var(--branco);
  color:#8B2350;
}

.calc-card .calc-mini-card{
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.28);
}
.calc-card .calc-label{color:rgba(255,255,255,0.85);}
.calc-card .calc-valor{color:var(--branco);}

.calc-card .calc-timeline-etapa{color:rgba(255,255,255,0.65);}
.calc-card .calc-timeline-ponto{
  background:rgba(255,255,255,0.3);
  border-color:rgba(255,255,255,0.5);
  box-shadow:0 0 0 2px rgba(255,255,255,0.3);
}
.calc-card .calc-timeline-etapa.ativo{color:var(--branco);}
.calc-card .calc-timeline-etapa.ativo .calc-timeline-ponto{
  background:var(--branco);
  box-shadow:0 0 0 2px var(--branco);
}
.calc-card .calc-timeline-linha{background:rgba(255,255,255,0.3);}

.calc-card .calc-mensagem{color:var(--branco);}

.calc-card #calc-refazer{
  background:transparent;
  border:1.5px solid rgba(255,255,255,0.6);
  color:var(--branco);
}
.calc-card #calc-refazer:hover{
  background:rgba(255,255,255,0.16);
}

/* ---------- REDE CONECTADA (animação da hero principal) ---------- */
.rede-wrap{
  max-width:900px;
  margin:32px auto 0;
  opacity:0;
  animation:fadeIn 1s ease forwards .3s;
}

.rede-linhas line{
  stroke-dasharray:6 7;
  animation:rede-fluxo 3s linear infinite;
}
@keyframes rede-fluxo{
  to{stroke-dashoffset:-130;}
}

.rede-corada path:first-child{
  transform-box:fill-box;
  transform-origin:center;
  animation:rede-pulsar-central 2.4s ease-in-out infinite;
}
@keyframes rede-pulsar-central{
  0%,100%{transform:scale(1.7);}
  50%{transform:scale(1.85);}
}

.rede-no{
  transform-box:fill-box;
  transform-origin:center;
  animation:rede-pulsar-no 3.2s ease-in-out infinite;
}
.rede-no:nth-child(2){animation-delay:.3s;}
.rede-no:nth-child(3){animation-delay:.6s;}
.rede-no:nth-child(4){animation-delay:.9s;}
.rede-no:nth-child(5){animation-delay:1.2s;}
.rede-no:nth-child(6){animation-delay:1.5s;}
@keyframes rede-pulsar-no{
  0%,100%{transform:scale(1); opacity:.85;}
  50%{transform:scale(1.25); opacity:1;}
}

circle{
  animation:rede-glow-respira 4s ease-in-out infinite;
}
@keyframes rede-glow-respira{
  0%,100%{opacity:.7;}
  50%{opacity:1;}
}

@media (prefers-reduced-motion: reduce){
  .rede-linhas line, .rede-corada path:first-child, .rede-no, circle{
    animation:none !important;
  }
}

/* ---------- MENU HAMBÚRGUER (mobile) ---------- */
.menu-hamburguer{
  display:none;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
  width:38px;
  height:38px;
  background:none;
  border:none;
  cursor:pointer;
  flex-shrink:0;
  z-index:60;
}
.menu-hamburguer span{
  display:block;
  width:22px;
  height:2px;
  background:var(--branco);
  border-radius:2px;
  transition:transform .3s ease, opacity .3s ease;
}
.menu-hamburguer.aberto span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}
.menu-hamburguer.aberto span:nth-child(2){
  opacity:0;
}
.menu-hamburguer.aberto span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}

@media (max-width:980px){
  .menu-hamburguer{display:flex;}
}

.menu-mobile{
  position:fixed;
  top:0; left:0; right:0;
  height:100vh;
  background:linear-gradient(180deg, #3A2732 0%, #2A1220 100%);
  z-index:55;
  display:flex;
  flex-direction:column;
  padding:100px 32px 40px;
  transform:translateY(-100%);
  opacity:0;
  transition:transform .35s ease, opacity .3s ease;
  overflow-y:auto;
}
.menu-mobile.aberto{
  transform:translateY(0);
  opacity:1;
}
.menu-mobile nav ul{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.menu-mobile nav a{
  display:block;
  padding:16px 4px;
  font-size:19px;
  font-weight:600;
  color:var(--branco);
  border-bottom:1px solid rgba(248,215,227,0.15);
}
.menu-mobile nav a.active{
  color:var(--fase-tentante);
}
.menu-mobile .menu-mobile-extra{
  margin-top:28px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.menu-mobile .menu-mobile-extra a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:15px;
  border-radius:999px;
  font-weight:700;
  font-size:15px;
  color:var(--branco);
}
.menu-mobile .menu-mobile-extra a.calc{
  background:linear-gradient(135deg, #D6437B 0%, #8B2350 100%);
}
.menu-mobile .menu-mobile-extra a.suporte{
  background:linear-gradient(135deg, var(--rosa-forte) 0%, var(--rosa-forte-escuro) 100%);
}
.menu-mobile .menu-mobile-extra a svg{
  width:18px;height:18px;flex-shrink:0;
}

body.menu-aberto-body{
  overflow:hidden;
}

.menu-mobile-fechar{
  position:absolute;
  top:22px;
  right:24px;
  width:40px;
  height:40px;
  border-radius:50%;
  background:rgba(255,255,255,0.1);
  border:none;
  color:var(--branco);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:2;
}
.menu-mobile-fechar svg{width:20px;height:20px;}

.menu-mobile-fases-titulo{
  font-size:12px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.55);
  margin:6px 0 14px;
}
.menu-mobile-fases-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.menu-mobile-fases-grid .fase-btn{
  font-size:13px;
  padding:10px 18px;
}