/**
 * Styles minimaux pour le module GooeyHoverEffect.
 * À inclure sur les pages qui utilisent l’effet gooey.
 */

/* Canvas WebGL : derrière le contenu (Codrops : #scene z-index 3, contenu z-index 5) */
.gooey-hover-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}

/* Bloc cible : position relative pour que l’image ait des dimensions */
.js-gooey-hover {
  position: relative;
}

/* Cartes « Poursuivre » (home) : cible = .home-poursuivre-card__visual.js-gooey-hover (pas le lien) */
.home-poursuivre-card__visual.js-gooey-hover {
  overflow: hidden;
  /* Renforce home_page : base du visuel droite (joint au bandeau), même si un autre shorthand traîne */
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.home-poursuivre-card__visual.js-gooey-hover .home-poursuivre-card__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  /* border-radius ne descend pas aux enfants : sans ça, img { inherit } lisait 0 sur le média */
  border-radius: inherit;
}

/* Remplissage cover (texture WebGL alignée sur getBoundingClientRect du bloc visuel) */
.home-poursuivre-card__visual.js-gooey-hover .home-poursuivre-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  object-fit: cover;
  object-position: center;
  box-sizing: border-box;
  /* Même coins que le visuel (haut arrondi, bas nuls), y compris avant is-loaded */
  border-radius: inherit;
}

/* Zone image path-card : clipping cohérent avec le cadre (utilisé page Parcours, etc.) */
.path-card .path-card__media {
  overflow: hidden;
  border-radius: inherit;
}

/* Image : masquée une fois le mesh chargé ; la hitbox reste sur le parent */
.js-gooey-hover img.is-loaded {
  opacity: 0;
  pointer-events: auto;
}

/* Cartes « Poursuivre » : remplissage cover (hauteur explicite sur le bloc visuel) — pas de height:auto ici */
.js-gooey-hover:not(.home-poursuivre-card__visual) img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
  transition: opacity 0.3s ease;
}
