/* =========================================================
   IISIS — AJUSTES VISUAIS DA HOME
   Arquivo seguro: não substitui o CSS principal.
   Corrige fotos estouradas, melhora responsividade e evita cortes ruins.
   ========================================================= */

:root {
  --iisis-azul: #071C3A;
  --iisis-dourado: #C99A2E;
  --iisis-gelo: #F7F9FC;
}

.media-card {
  overflow: hidden;
  border-radius: 22px;
  background: #ffffff;
}

.media-card img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 280px;
  object-fit: cover;
  object-position: center 30%;
}

.hero .media-card img {
  height: 340px;
  object-position: center 30%;
}

.section .media-card img {
  max-height: 300px;
}

/* Imagens com pessoas/dashboards: reduz aproximação e melhora enquadramento */
.media-card img[src*="premium-operacao"],
.media-card img[src*="rh-processos"],
.media-card img[src*="solucoes-tech"] {
  object-position: center 26%;
}

/* Classe opcional: use quando quiser ver a imagem inteira sem corte */
.media-card.img-contain img {
  object-fit: contain;
  object-position: center;
  background: var(--iisis-gelo);
  padding: 14px;
}

/* Evita que cards de imagem fiquem gigantes em telas largas */
.hero-grid .media-card,
.split .media-card {
  max-width: 520px;
}

/* Melhora respiro do topo e evita sensação de conteúdo grudado no menu */
.hero {
  padding-top: clamp(44px, 6vw, 78px);
}

.site-header {
  z-index: 1000;
}

/* Proteção contra texto escondido em navegação por âncora */
html {
  scroll-padding-top: 120px;
}

/* Ajuste visual dos botões para manter presença comercial */
.btn,
.nav-cta,
.nav-login {
  white-space: nowrap;
}

/* Mobile */
@media (max-width: 768px) {
  .hero .media-card img,
  .media-card img,
  .section .media-card img {
    height: 220px;
    max-height: 220px;
  }

  .hero-grid .media-card,
  .split .media-card {
    max-width: 100%;
  }

  .hero {
    padding-top: 32px;
  }
}

@media (max-width: 480px) {
  .hero .media-card img,
  .media-card img,
  .section .media-card img {
    height: 190px;
    max-height: 190px;
  }
}
