/* O que o JS do Elementor e dos plugins fazia, refeito em CSS. O visual vem do base.css (CSS compilado da
   página original no WordPress, gerado pelo _fontes/montar.py). */

html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 90px; }

/* Cabeçalho fixo no topo (era o jquery.sticky) */
.topo-fixo { position: sticky !important; top: 0; z-index: 99; }

/* Galeria das clínicas (era o e-gallery): 3 colunas, 2 no celular, proporção 3:2, espaço de 10 px */
.elementor-widget-gallery .elementor-gallery__container {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; height: auto !important;
}
@media (max-width: 1024px) { .elementor-widget-gallery .elementor-gallery__container { grid-template-columns: repeat(2, 1fr); } }
.elementor-widget-gallery .e-gallery-item { position: relative !important; display: block; overflow: hidden; width: auto !important; top: auto !important; left: auto !important; }
.elementor-widget-gallery .e-gallery-image {
  position: relative !important; padding-bottom: 66.6667% !important; height: 0;
  background-size: cover; background-position: center; transition: transform .4s;
}
.elementor-widget-gallery .e-gallery-item:hover .e-gallery-image { transform: scale(1.04); }

/* Ampliação das fotos da galeria (era o lightbox do Elementor) */
.amplia { position: fixed; inset: 0; z-index: 9999; background: rgba(0, 0, 0, .9); display: flex; align-items: center; justify-content: center; }
.amplia[hidden] { display: none; }
.amplia img { max-width: 92vw; max-height: 86vh; object-fit: contain; }
.amplia button {
  position: absolute; background: none; border: 0; color: #fff; cursor: pointer; padding: 14px;
  font: 300 34px/1 sans-serif; opacity: .8;
}
.amplia button:hover, .amplia button:focus-visible { opacity: 1; }
.amplia .fechar { top: 8px; right: 12px; }
.amplia .ant { left: 8px; top: 50%; transform: translateY(-50%); }
.amplia .prox { right: 8px; top: 50%; transform: translateY(-50%); }
.amplia .legenda { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; color: #ddd; font: 14px/1.4 Poppins, sans-serif; }

/* Avaliações do Google (o loader do Trustindex mostrava o modelo e animava o carrossel) */
.ti-estatico .ti-reviews-container-wrapper { scroll-behavior: smooth; }
.ti-estatico .ti-review-content.aberto { height: auto !important; -webkit-line-clamp: unset !important; }
.ti-estatico img.ti-star { display: inline-block; }

/* Janela "Agende sua consulta" (29/10, no molde da LP da Dra. Lívia, com as cores e fontes desta página) */
.janela { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.janela[hidden] { display: none; }
.janela__fundo { position: absolute; inset: 0; background: rgba(12, 37, 48, .78); animation: janela-aparece .2s ease; }
.janela__caixa {
  position: relative; width: 100%; max-width: 480px; max-height: calc(100vh - 32px); overflow-y: auto;
  background: #fff; color: #1D1D1D; border-radius: 16px; padding: 40px 36px 32px;
  box-shadow: 0 24px 60px rgba(12, 37, 48, .35); font-family: Poppins, sans-serif;
  animation: janela-sobe .25s ease;
}
.janela__sobre { margin: 0 0 10px; font: 500 12px/1.3 Montserrat, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #2D86AD; }
.janela__titulo { margin: 0; font: 500 30px/1.15 Poppins, sans-serif; color: #184A60; }
.janela__texto { margin: 12px 0 0; font-size: 15px; line-height: 1.6; color: #555; }
.janela form { margin-top: 24px; }
.janela .campo + .campo { margin-top: 20px; }
.janela .campo label { display: block; margin-bottom: 6px; font: 600 12px/1 Montserrat, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #184A60; }
.janela .campo input {
  display: block; width: 100%; box-sizing: border-box; padding: 10px 2px; border: 0; border-bottom: 1.5px solid #c9d6dc;
  border-radius: 0; background: transparent; font: 400 16px/1.4 Poppins, sans-serif; color: #1D1D1D; outline: none;
  transition: border-color .15s;
}
.janela .campo input::placeholder { color: #9aa9b0; }
.janela .campo input:focus { border-bottom-color: #2D86AD; }
.janela .campo input[aria-invalid="true"] { border-bottom-color: #c0392b; }
.janela .campo__erro { margin: 6px 0 0; font-size: 13px; color: #c0392b; }
.janela__enviar {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 28px; padding: 15px 20px;
  border: 0; border-radius: 10px; background: #18A52B; color: #fff; cursor: pointer;
  font: 600 16px/1 Poppins, sans-serif; transition: background-color .15s, transform .15s;
}
.janela__enviar:hover { background: #148a24; transform: translateY(-1px); }
.janela__enviar:focus-visible { outline: 3px solid #2D86AD; outline-offset: 3px; }
.janela__enviar svg { width: 20px; height: 20px; }
.janela__teste { margin: 12px 0 0; font-size: 12px; line-height: 1.5; color: #555; word-break: break-all; }
.janela__fechar {
  position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; padding: 8px; border: 0; border-radius: 50%;
  background: transparent; color: #184A60; cursor: pointer; opacity: .7; transition: opacity .15s, background-color .15s;
}
.janela__fechar:hover, .janela__fechar:focus-visible { opacity: 1; background: #eef3f5; }
.janela__fechar svg { width: 20px; height: 20px; }
.sem-rolagem { overflow: hidden; }
@keyframes janela-aparece { from { opacity: 0; } }
@keyframes janela-sobe { from { opacity: 0; transform: translateY(12px); } }
@media (max-width: 480px) {
  .janela__caixa { padding: 36px 22px 24px; }
  .janela__titulo { font-size: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  .janela__fundo, .janela__caixa { animation: none; }
  html { scroll-behavior: auto; }
  .ti-estatico .ti-reviews-container-wrapper { scroll-behavior: auto; }
}
