/* ==========================================================================
   Zooplan+ — Melhorias (correções + polish)
   Camada adicional carregada por último. Não altera os arquivos originais.
   ========================================================================== */

:root{
  --zp-green-deep:#123a2a;
  --zp-green:#1e6b4a;
  --zp-green-soft:#2e8b60;
  --zp-shadow:rgba(18,58,42,.14);
  --zp-shadow-strong:rgba(18,58,42,.24);
}

/* --------------------------------------------------------------------------
   1) CORREÇÃO CRÍTICA: revelar elementos que o Elementor deixaria escondidos
   (as animações de entrada dependem de JS que não roda de forma confiável
   offline — sem isto, seções inteiras ficam em branco).
   -------------------------------------------------------------------------- */
.elementor-invisible{
  visibility:visible !important;
  opacity:1 !important;
  animation:none !important;
  transform:none !important;
}

/* --------------------------------------------------------------------------
   2) Rolagem suave + compensação do cabeçalho fixo para as âncoras do menu
   -------------------------------------------------------------------------- */
html{ scroll-behavior:smooth; }
#sobre, #servicos, #contato{ scroll-margin-top:130px; }

/* --------------------------------------------------------------------------
   3) BOTÕES — transição, elevação no hover e sombra consistente
   -------------------------------------------------------------------------- */
.elementor-button,
.ekit-btn,
a.elementor-button-link{
  transition:transform .25s ease, box-shadow .25s ease, background-color .25s ease, filter .25s ease !important;
  will-change:transform;
}
.elementor-button:hover,
a.elementor-button-link:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 26px var(--zp-shadow-strong);
  filter:saturate(1.05);
}
.elementor-button:active{ transform:translateY(-1px); }

/* Botão "Agende sua Consulta" e CTAs do cabeçalho ganham um brilho sutil */
header .elementor-button,
.elementor-sticky .elementor-button{ box-shadow:0 6px 16px var(--zp-shadow); }

/* --------------------------------------------------------------------------
   4) CARDS de serviço / icon-box — cantos suaves, hover elevado
   -------------------------------------------------------------------------- */
.elementor-widget-icon-box .elementor-icon-box-wrapper,
.elementor-widget-image-box .elementor-image-box-wrapper{
  transition:transform .3s ease, box-shadow .3s ease;
}

/* Contêineres que funcionam como “cartões” (fundo branco/claro) */
.e-con.e-child[data-element_type="container"]{
  transition:transform .3s ease, box-shadow .3s ease;
}

/* Elevação no hover apenas para cards com fundo preenchido */
.elementor-widget-icon-box:hover .elementor-icon-box-wrapper{
  transform:translateY(-4px);
}

/* Ícones dos serviços com micro-interação */
.elementor-widget-icon-box .elementor-icon,
.elementor-widget-icon .elementor-icon{
  transition:transform .3s ease;
}
.elementor-widget-icon-box:hover .elementor-icon,
.elementor-widget-icon:hover .elementor-icon{
  transform:scale(1.08) rotate(-3deg);
}

/* --------------------------------------------------------------------------
   5) HERO — subtítulo agora é mais longo: largura e respiro controlados
   -------------------------------------------------------------------------- */
.elementor-element-d37629f{ max-width:680px; margin-left:auto; margin-right:auto; }
.elementor-element-d37629f p{
  line-height:1.6;
  font-size:1.02rem;
  opacity:.95;
}
.elementor-element-7c897b45 .elementor-heading-title{
  text-wrap:balance;
}
/* leve gradiente escuro sobre o slideshow para o texto respirar */
.elementor-element-373e3c99::before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,26,18,.35) 0%, rgba(6,26,18,.55) 100%);
  pointer-events:none; z-index:1;
}
.elementor-element-373e3c99 > .e-con-inner,
.elementor-element-373e3c99 > .elementor-element{ position:relative; z-index:2; }

/* --------------------------------------------------------------------------
   6) Instagram — feed vazio offline: esconder grade vazia e destacar o CTA
   -------------------------------------------------------------------------- */
#sbi_images:empty{ display:none !important; }
#sb_instagram{ min-height:0 !important; padding-bottom:0 !important; }
.sbi_follow_btn{ display:flex; justify-content:center; margin-top:8px; }
.sbi_follow_btn a{
  border-radius:999px !important;
  padding:14px 30px !important;
  font-weight:600 !important;
  transition:transform .25s ease, box-shadow .25s ease !important;
}
.sbi_follow_btn a:hover{ transform:translateY(-3px); box-shadow:0 12px 24px rgba(49,233,43,.35) !important; }

/* --------------------------------------------------------------------------
   7) Vídeo de fundo do YouTube (offline fica em branco) → imagem de reserva
   -------------------------------------------------------------------------- */
.elementor-element-1319b7fe{
  background-image:url('../images/woman-examining-dog-with-stethoscope-RXTCHY7-1024x1024.jpg');
  background-size:cover; background-position:center;
}
.elementor-element-1319b7fe .elementor-background-video-container{
  opacity:.999; /* mantém o vídeo por cima quando houver rede */
}

/* --------------------------------------------------------------------------
   8) Galeria de imagens — zoom suave no hover
   -------------------------------------------------------------------------- */
.elementor-widget-image img{
  transition:transform .45s ease, filter .45s ease;
  border-radius:10px;
}
.elementor-widget-image:hover img{ transform:scale(1.03); }

/* --------------------------------------------------------------------------
   9) Banner de cookies — barra inferior enxuta (o JS cuida do fechamento)
   -------------------------------------------------------------------------- */
#zp-cookie-tamed{
  position:fixed !important;
  left:50% !important; transform:translateX(-50%) !important;
  bottom:16px !important; top:auto !important;
  width:min(960px, calc(100% - 32px)) !important;
  border-radius:16px !important;
  box-shadow:0 18px 48px rgba(0,0,0,.28) !important;
  z-index:99998 !important;
  padding:6px 10px !important;
}
#zp-cookie-tamed .cookie-notice-container{
  max-width:100% !important; margin:0 !important; padding:10px 12px !important;
  display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap;
}
#zp-cookie-tamed #cn-notice-text,
#zp-cookie-tamed .cookie-notice-container > span{ color:#fff; font-size:.9rem; }
#zp-cookie-tamed a.cn-set-cookie,
#zp-cookie-tamed #cn-accept-cookie,
#zp-cookie-tamed .cn-button{
  border-radius:999px !important; padding:9px 22px !important; font-weight:600 !important;
  transition:transform .2s ease, box-shadow .2s ease !important;
}
#zp-cookie-tamed a.cn-set-cookie:hover,
#zp-cookie-tamed #cn-accept-cookie:hover{ transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.3) !important; }

/* --------------------------------------------------------------------------
   10) Refinos globais
   -------------------------------------------------------------------------- */
img{ max-width:100%; }
a{ transition:color .2s ease, opacity .2s ease; }

/* links do menu com sublinhado animado */
.elementskit-navbar-nav > li > a{ position:relative; }
.elementskit-navbar-nav > li > a::after{
  content:""; position:absolute; left:12px; right:12px; bottom:6px; height:2px;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .28s ease; opacity:.7;
}
.elementskit-navbar-nav > li > a:hover::after{ transform:scaleX(1); }

/* todos os itens do menu vêm marcados como "active" no clone — normaliza */
.elementskit-navbar-nav > li.menu-item > a.active{ font-weight:inherit; }

/* seleção de texto na cor da marca */
::selection{ background:var(--zp-green-soft); color:#fff; }

/* --------------------------------------------------------------------------
   11) DEPOIMENTOS reconstruídos (cards estáticos das avaliações do Google)
   -------------------------------------------------------------------------- */
.zp-reviews{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:22px;
  width:100%;
  max-width:1160px;
  margin:36px auto 8px;
  padding:0 16px;
}
.zp-review-card{
  background:#ffffff;
  border-radius:18px;
  padding:24px 24px 22px;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
  display:flex; flex-direction:column; gap:12px;
  transition:transform .3s ease, box-shadow .3s ease;
  border:1px solid rgba(18,58,42,.06);
}
.zp-review-card:hover{ transform:translateY(-6px); box-shadow:0 26px 56px rgba(0,0,0,.26); }
.zp-review-head{ display:flex; align-items:center; gap:12px; }
.zp-avatar{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%;
  color:#fff; font-weight:700; font-size:16px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px rgba(0,0,0,.15);
}
.zp-review-meta{ display:flex; flex-direction:column; line-height:1.25; flex:1 1 auto; min-width:0; }
.zp-review-meta strong{ color:#123a2a; font-size:1rem; }
.zp-review-meta small{ color:#7a8a83; font-size:.8rem; }
.zp-review-head .zp-g{ flex:0 0 auto; }
.zp-stars{ color:#f5a623; font-size:1.05rem; letter-spacing:2px; }
.zp-review-text{
  color:#40514a; font-size:.95rem; line-height:1.6; margin:0;
  display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; overflow:hidden;
}
