/* ==========================================================================
   partenaires.css - fidelite visuelle RParc pour /partenaires/ et
   /associations-du-parc/ (scope .page-template-template-partenaires).
   Reproduit le look RParc : hero image foncee, intro claire, niveaux de
   logos partenaires (Gold / Institutionnels) en grille, CTA newsletter en
   bande accent. Couleurs : var(--fp-*) uniquement (aucun #hex en dur).
   Images de fond RParc semees en fallback editable.
   ========================================================================== */

/* — Hero : plein cadre, fond image, surtitre en accent comme le RParc — */
.page-template-template-partenaires .fp-hero {
  min-height: min(72vh, 620px);
}
.page-template-template-partenaires .fp-hero:not(.fp-has-slider) .fp-hero-slide {
  background-image: url("https://raiffeisen-parc.ch/wp-content/uploads/2025/12/Raiffeisen-Parc_Piqo_21-12-2025-44-1024x682.webp");
  background-size: cover;
  background-position: center;
}
.page-template-template-partenaires .fp-hero-overlay {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--fp-dark) 35%, transparent) 0%,
    color-mix(in srgb, var(--fp-dark) 62%, transparent) 60%,
    color-mix(in srgb, var(--fp-dark) 85%, transparent) 100%
  );
}
.page-template-template-partenaires .fp-hero-title {
  font-size: clamp(2.4rem, 5.5vw, 4.2rem);
}

/* — Intro : "Un ecosysteme de partenaires d'exception" — texte large centre — */
.page-template-template-partenaires .fp-intro {
  text-align: center;
}
.page-template-template-partenaires .fp-intro .fp-eyebrow {
  justify-content: center;
}
.page-template-template-partenaires .fp-intro .fp-lead {
  max-width: 24ch;
  margin-inline: auto;
}
.page-template-template-partenaires .fp-intro .fp-prose {
  margin-inline: auto;
  text-align: center;
}

/* — Sections de logos partenaires : reprises de la galerie/feature-icons —
   On reutilise .fp-galerie et .fp-features pour afficher les blocs logos.
   Niveau "Gold" sur fond clair, niveau "Institutionnels" plus discret. */
.page-template-template-partenaires .fp-galerie .fp-lead,
.page-template-template-partenaires .fp-features .fp-lead {
  text-align: center;
  margin-inline: auto;
}

/* Grille de logos : cases blanches, large, logos contenus et centres */
.page-template-template-partenaires .fp-galerie-grid {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.page-template-template-partenaires .fp-galerie-item {
  aspect-ratio: 16 / 9;
  background-color: var(--fp-paper);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid var(--fp-line);
  border-radius: var(--fp-radius);
  padding: 22px;
  box-shadow: var(--fp-shadow);
  filter: grayscale(1);
  opacity: .78;
  transition: filter .2s ease, opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}
.page-template-template-partenaires .fp-galerie-item:hover {
  filter: grayscale(0);
  opacity: 1;
  transform: translateY(-3px) scale(1);
  box-shadow: var(--fp-shadow-lg);
}

/* Niveau institutionnel : grille resserree, presence plus sobre */
.page-template-template-partenaires .fp-features {
  background: var(--fp-cream);
}
.page-template-template-partenaires .fp-features-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.page-template-template-partenaires .fp-feature {
  border-radius: var(--fp-radius);
}

/* Cartes partenaires (si la page utilise une grille de cartes/associations) */
.page-template-template-partenaires .fp-card-media {
  background-color: var(--fp-cream);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  aspect-ratio: 16 / 10;
}

/* — Split eventuel (presentation d'un partenaire majeur) — */
.page-template-template-partenaires .fp-split-photo {
  background-color: var(--fp-cream);
}

/* — CTA newsletter : bande accent coloree, centree comme le RParc — */
.page-template-template-partenaires .fp-cta-section {
  background: var(--fp-secondary);
}
.page-template-template-partenaires .fp-cta-overlay {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--fp-secondary) 72%, transparent),
    color-mix(in srgb, var(--fp-primary-dark) 82%, transparent)
  );
}
.page-template-template-partenaires .fp-cta-lead {
  font-size: clamp(1.7rem, 3.5vw, 2.6rem);
}

@media (max-width: 720px) {
  .page-template-template-partenaires .fp-galerie-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }
  .page-template-template-partenaires .fp-galerie-item {
    padding: 16px;
  }
}