/* ==========================================================================
   MARCA — FLOR DE CANELA | MODA FEMININA
   Recria o linkbio antigo (WordPress/Elementor, página /links/): textura
   creme cobrindo logo + cards, logo em arte, dois cards em arte (versões
   próprias para celular), arte "Faça uma parceria" e faixa oliva no rodapé.
   Medidas copiadas do Elementor: 115/70 px de respiro no desktop,
   70/70 px no celular.
   ========================================================================== */

/* ---- Fundo texturizado: cobre hero + cards (não o rodapé) ------------- */
.fundo {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  background: var(--bg) url("../assets/fundo.webp") center top / cover no-repeat;
  padding: 115px 10px 70px;
}

/* ---- Hero: só o logo em arte, sem foto -------------------------------- */
.hero {
  padding: 10px;
  overflow: visible;
}
.hero__bg { display: none; }
.hero__logo {
  width: var(--hero-logo);
  max-width: 100%;
  margin: 0 auto;
}

/* ---- Cards em arte, uma coluna ---------------------------------------- */
.page { flex: 0 0 auto; }

.cards {
  grid-template-columns: 1fr;
  justify-items: center;
  gap: 30px;
  margin: 115px 0 0;
  padding: 10px;
}
.card {
  width: 100%;
  max-width: 800px;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  background: transparent;
}
.card picture { display: block; }
.card img { height: auto; }
.card:hover img { transform: none; }        /* arte com texto: sem zoom */
.card.is-visible:hover,
.card:hover {
  transform: translateY(-10px);             /* mesmo hover do Elementor */
  box-shadow: none;
}
.card.is-visible:active,
.card:active { transform: translateY(-4px); }

.card--parceria { max-width: 329px; }       /* 75% da arte de 439 px */

/* ---- Rodapé oliva ----------------------------------------------------- */
.footer { padding: 10px; }
.footer small {
  display: block;
  font-size: 14px;
  font-weight: 400;
  line-height: 14px;
}

/* ---- Tablet: logo a 65% da coluna, como no original ------------------- */
@media (max-width: 1024px) {
  .hero__inner { width: 100%; }
  .hero__logo { width: 65%; }
}

/* ---- Celular ---------------------------------------------------------- */
@media (max-width: 767px) {
  .fundo {
    background-image: url("../assets/fundo-mobile.webp");
    padding: 70px 10px 70px;
  }
  .hero__logo { width: 65%; max-width: 65%; }
  .cards { gap: 20px; margin-top: 70px; }
  .card--parceria { max-width: 75%; }
}
