/* ==========================================================================
   MARCA — DRA. CARINA ROCHA | ADVOCACIA
   Recria o linkbio antigo (WordPress/Elementor): hero em foto com o nome e a
   chamada em arte embaixo, caixa "Links reunidos" com 2 cards em arte sobre
   fundo claro, carrossel de fotos (6 por tela / 2 no celular) e rodapé branco.
   Medidas copiadas do CSS do Elementor (post-12.css).
   ========================================================================== */

/* ---- Hero -------------------------------------------------------------- */
.hero {
  min-height: 960px;
  padding: 10px 10px 60px;
  justify-content: flex-end;
}
/* sem folga no topo: a foto fica ancorada em cima, como no original.
   O parallax só desce a camada, então a borda superior nunca aparece. */
.hero__bg {
  inset: 0;
  background-position: center top;
}
.hero__inner {
  width: 100%;
  max-width: 1140px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.hero__titulo,
.hero__chamada { line-height: 0; }
.hero__titulo img { display: block; width: 578px; max-width: 100%; height: auto; }
.hero__chamada img { display: block; width: 512px; max-width: 100%; height: auto; }

.hero__divisor {
  display: block;
  width: 27%;
  padding: 9px 0;
}
.hero__divisor::before {
  content: "";
  display: block;
  border-top: 1px solid #dec180;
}

/* ---- Links reunidos ---------------------------------------------------- */
.links {
  display: flex;
  justify-content: center;
  padding: 10px 10px 0;
}
.links__caixa {
  width: 50%;
  padding: 70px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  background: url("../assets/fundo-links.webp") center bottom / cover no-repeat #fff;
}
.links__titulo { line-height: 0; width: 100%; text-align: center; padding: 6px 0 2px; }
.links__titulo img { width: 22%; height: auto; }

.cards {
  width: 100%;
  display: flex;
  grid-template-columns: none;
  gap: 20px;
  padding: 10px;
  margin: 0;
}
.card {
  flex: 1 1 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  overflow: visible;
}
.card img { height: auto; }
.card:hover img { transform: none; }          /* arte com texto: sem zoom */
.card.is-visible:hover,
.card:hover {
  transform: translateY(-8px);                /* o mesmo -8px do original */
  box-shadow: none;
}
.card.is-visible:active,
.card:active { transform: translateY(-3px); }

/* ---- Carrossel --------------------------------------------------------- */
.vitrine { padding: 80px 0 72px; }
.trilho {
  gap: 7px;
  padding: 0;
  margin: 0 10px;                             /* recorta nas bordas, como o swiper */
}
.slide {
  width: calc((100% - 35px) / 6);             /* 6 fotos visíveis */
  scroll-snap-align: start;
}
.slide__foto { aspect-ratio: 1066 / 1600; }

.pontos { gap: 12px; margin-top: 18px; }
.pontos button { width: 6px; height: 6px; }
.pontos button[aria-current="true"] { transform: none; }

/* ---- Rodapé branco com a arte "Todos os direitos reservados" ------------ */
.footer { padding: 15px 10px; }
.footer__inner { max-width: 1140px; margin: 0 auto; line-height: 0; }
.footer__inner img { width: 22%; height: auto; }

@media (prefers-reduced-motion: reduce) {
  .card:hover, .card.is-visible:hover { transform: none; }
}

/* ---- Breakpoints do original ------------------------------------------- */
@media (max-width: 1366px) {
  .hero { min-height: 908px; }
  .links__caixa { width: 86%; }
}
@media (max-width: 1200px) {
  .hero { min-height: 893px; }
}
@media (max-width: 1024px) {
  .links__caixa { width: 100%; }
}

/* ---- Celular ----------------------------------------------------------- */
@media (max-width: 767px) {
  .hero {
    min-height: 618px;
    padding: 10px 10px 40px;
  }
  .hero__bg {
    background:
      var(--hero-img-mobile) center top / cover no-repeat,
      var(--hero-base);
  }
  .hero__titulo img  { width: 85%; margin: 0 auto; }
  .hero__chamada img { width: 69%; margin: 0 auto; }
  .hero__titulo, .hero__chamada { width: 100%; }
  .hero__divisor { padding: 2px 0; }

  .links__caixa {
    width: 100%;
    padding: 25px 10px 45px;
    background-image: url("../assets/fundo-links-mobile.webp");
  }
  .links__titulo img { width: 43%; }
  .cards { flex-direction: column; padding: 0; }

  .slide { width: calc((100% - 7px) / 2); }   /* 2 fotos por vez */

  .footer { padding: 16px 10px; }
  .footer__inner img { width: 59%; }
}
@media (max-width: 560px) {
  .cards { margin-top: 0; }                   /* anula o -35px do núcleo */
}