/* ============================================================
   Melhorias de layout — carregado por último (override Elementor)
   Escopo: seção #Procedimentos (abas CORPORAL / FACIAL / NÃO CIRÚRGICOS)
   Usa :has() (suportado em todos os navegadores atuais).
   ============================================================ */

/* ---- grade responsiva uniforme (wrapper que contém os cards) ---- */
#Procedimentos [role="tabpanel"] > .e-con.e-child,
#Procedimentos .e-con.e-child:has(> .e-con.e-child > .elementor-widget-image) {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(248px, 1fr)) !important;
  gap: 22px !important;
  width: 100% !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
  align-items: stretch !important;
}

/* ---- o card ---- */
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background: #ffffff !important;
  border: 1px solid #e6ece8 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  padding: 0 0 22px !important;
  box-shadow: 0 1px 2px rgba(16, 40, 28, .05) !important;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}
#Procedimentos .e-con.e-child:has(> .elementor-widget-image):hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 42px -14px rgba(16, 40, 28, .24) !important;
  border-color: #cfe0d5 !important;
}

/* ---- imagem no topo, proporção fixa, zoom suave no hover ---- */
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image {
  width: 100% !important;
  margin: 0 0 16px !important;
  overflow: hidden !important;
}
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-image img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  transition: transform .5s ease !important;
}
#Procedimentos .e-con.e-child:has(> .elementor-widget-image):hover > .elementor-widget-image img {
  transform: scale(1.06) !important;
}

/* ---- respiro lateral pro conteúdo de texto ---- */
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-heading,
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-text-editor,
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .e-con {
  width: auto !important;
  max-width: none !important;
  padding-inline: 22px !important;
  text-align: left !important;
}

#Procedimentos .e-con.e-child:has(> .elementor-widget-image) .elementor-heading-title {
  font-size: 1.2rem !important;
  line-height: 1.25 !important;
  margin-bottom: 8px !important;
  color: #14241c !important;
  text-wrap: balance;
}
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) .elementor-widget-text-editor,
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) .elementor-widget-text-editor p {
  font-size: .95rem !important;
  line-height: 1.55 !important;
  color: #5b6660 !important;
  text-wrap: pretty;
}

/* ---- botão "Agendar" fixo no rodapé, largura total do card ---- */
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .elementor-widget-button,
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) > .e-con:last-child {
  margin-top: auto !important;
  padding-inline: 22px !important;
  padding-top: 16px !important;
}
#Procedimentos .e-con.e-child:has(> .elementor-widget-image) .elementor-button {
  width: 100% !important;
  justify-content: center !important;
}