/*
Theme Name:   Vovô Pet Child
Theme URI:    https://vovopet.net
Description:  Tema-filho do Astra para o Vovô Pet. Aplica o redesign visual (Baloo 2 + Mulish, paleta da marca) sem alterar o tema-pai. Reversível: desativar volta ao Astra puro.
Author:       Vovô Pet
Template:     astra
Version:      1.0.5
Text Domain:  vovopet-child
*/

/* ============================================================
   VOVÔ PET — TOKENS (design system do protótipo)
   ============================================================ */
:root{
  --vp-sky:#3DB2FF;    --vp-sky-d:#1E8FE0;
  --vp-sun:#FFD23F;    --vp-sun-d:#F0B400;
  --vp-gum:#FF6B9D;    --vp-gum-d:#E84B82;
  --vp-sprout:#5FD068; --vp-sprout-d:#3FB04A;
  --vp-grape:#7C5CFC;  --vp-grape-d:#6342E8;
  --vp-ink:#2B2D52;    --vp-ink-soft:#6E708F;
  --vp-paper:#FFFFFF;  --vp-mist:#F4F7FE;
  --vp-r:28px; --vp-r-sm:18px; --vp-r-pill:999px;
}

/* ============================================================
   TIPOGRAFIA — Baloo 2 (títulos) + Mulish (corpo)
   (fontes enfileiradas via functions.php)
   ============================================================ */
body,
.entry-content,
.ast-container{
  font-family:'Mulish', system-ui, -apple-system, sans-serif;
  color:var(--vp-ink);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5,h6,
.entry-title,
.site-title,
.ast-button,.button,button,
.menu-item a{
  font-family:'Baloo 2', sans-serif;
  line-height:1.18;
  font-weight:700;
  color:var(--vp-ink);
}

/* ============================================================
   CABEÇALHO / LOGO
   ============================================================ */
.site-header,
.ast-primary-header-bar{
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);
}
.custom-logo,
.site-logo-img .custom-logo{
  max-height:54px;
  width:auto;
}
/* Itens de menu estilo "pílula" */
.main-header-menu .menu-item > a{
  color:var(--vp-ink-soft);
  border-radius:var(--vp-r-pill);
  transition:.16s;
}
.main-header-menu .menu-item > a:hover,
.main-header-menu .current-menu-item > a{
  color:var(--vp-ink);
  background:var(--vp-mist);
}

/* ============================================================
   BOTÕES "estilo brinquedo" (sombra sólida embaixo)
   ============================================================ */
.ast-button,.button,
.wp-block-button__link,
input[type=submit]{
  font-family:'Baloo 2',sans-serif;
  font-weight:600;
  border:none;
  border-radius:var(--vp-r-pill);
  background:var(--vp-sky);
  color:#fff;
  box-shadow:0 9px 0 -2px var(--vp-sky-d);
  transition:transform .16s ease, box-shadow .16s ease;
}
.ast-button:hover,.button:hover,
.wp-block-button__link:hover,
input[type=submit]:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 0 -2px var(--vp-sky-d);
  background:var(--vp-sky);
  color:#fff;
}

/* ============================================================
   CONTEÚDO DO ARTIGO (.entry-content)
   ============================================================ */
.entry-content{ font-size:1.08rem; }
.entry-content > p{ margin:0 0 20px; }

.entry-content h2{
  font-size:1.7rem;
  color:var(--vp-ink);
  margin:40px 0 14px;
  scroll-margin-top:100px;
}
.entry-content h3{
  font-size:1.28rem;
  color:var(--vp-ink);
  margin:26px 0 10px;
}
.entry-content strong{ color:var(--vp-sky-d); font-weight:700; }

/* Listas com patinha */
.entry-content ul{ list-style:none; padding-left:4px; margin:0 0 20px; }
.entry-content ul li{ position:relative; padding:6px 0 6px 32px; }
.entry-content ul li::before{
  content:"🐾"; position:absolute; left:0; top:6px; font-size:.95rem;
}
.entry-content ol{ counter-reset:n; list-style:none; padding-left:4px; margin:0 0 20px; }
.entry-content ol li{ position:relative; padding:6px 0 6px 40px; counter-increment:n; }
.entry-content ol li::before{
  content:counter(n); position:absolute; left:0; top:6px;
  width:24px; height:24px; background:var(--vp-sky); color:#fff;
  border-radius:50%; font-family:'Baloo 2'; font-weight:700; font-size:.85rem;
  display:grid; place-items:center;
}

/* ============================================================
   TÍTULO + META do post
   ============================================================ */
.entry-title{
  font-size:2.6rem; font-weight:800; letter-spacing:-.5px;
  color:var(--vp-ink);
}
.ast-single-post .entry-meta,
.entry-meta{
  color:var(--vp-ink-soft);
  font-family:'Baloo 2'; font-weight:500;
}

/* ============================================================
   GEO INTRO (parágrafo factual antes da imagem)
   class injetada via Colab futuramente: .vp-geo
   ============================================================ */
.vp-geo,
.entry-content > p.vp-geo{
  font-size:1.04rem; color:#444; line-height:1.7;
  border-left:4px solid var(--vp-grape);
  padding:10px 0 10px 18px;
  margin:2px 0 26px;
  font-style:italic;
  background:linear-gradient(90deg,#F3F0FF,transparent);
}

/* ============================================================
   IMAGEM DESTACADA no topo (decisão: featured no topo)
   estilizada via single template / functions
   ============================================================ */
.vp-featured-top{
  max-width:980px; margin:6px auto 30px;
  border-radius:var(--vp-r); overflow:hidden;
  box-shadow:0 26px 50px -28px rgba(43,45,82,.5);
}
.vp-featured-top img{ width:100%; height:auto; display:block; }

/* ============================================================
   RODAPÉ
   ============================================================ */
.site-footer,
.ast-footer-overlay{
  border-top:1px solid #EEF1F8;
}
.site-footer h2,.site-footer h4{ font-family:'Baloo 2'; }

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media(max-width:921px){
  .entry-title{ font-size:2.0rem; }
}