/* --------------------------------------------------
   Swup – transition du contenu remplacé
-------------------------------------------------- */

.transition-fade {
  opacity: 1;
  transition: opacity 0.1s ease-in-out;
}

html.is-animating .transition-fade {
  opacity: 0;
}

/* --------------------------------------------------
   Frame – états globaux
-------------------------------------------------- */

[data-frame-part].is-visible { opacity: 1; pointer-events: auto; }
[data-frame-part].is-invisible { opacity: 0; pointer-events: none; }
[data-frame-part].is-full { opacity: 1; pointer-events: auto; }

/* --------------------------------------------------
   Top-left – position & animation
-------------------------------------------------- */

[data-top-left] {
  position: fixed;
  top: 0;
  left: 0;

  /* supprime l'espace entre Y et le rest */
  display: flex;
  align-items: baseline;
  gap: 0;

  transform: translateY(0);
  transition: transform 0.3s ease-in-out;
}

[data-top-left].is-contact {
  transform: translateY(2.2vw);
}

/* --------------------------------------------------
   Top-left – texte (rest injecté via JS)
-------------------------------------------------- */

.top-left__y,
.top-left__rest {
  color: inherit;
}

/* rest invisible par défaut (quand il existe mais qu'on quitte contact) */
.top-left__rest {
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  transform: translateX(-0.035em);
  pointer-events: none;
}

/* rest visible en contact */
[data-top-left].is-contact .top-left__rest {
  opacity: 1;
  pointer-events: auto;
}

/* --------------------------------------------------
   Hover
-------------------------------------------------- */

/* default : hover sur Y uniquement */
.top-left__y:hover { color: var(--color-text-hover); }

/* contact : hover n'importe où sur le lien => tout se colore */
[data-top-left].is-contact:hover { color: var(--color-text-hover); }

.frame__bottom-left-text {
  opacity: 0;
  transition: opacity 0.25s ease;
  white-space: nowrap;
}

.frame__bottom-left-text:not(:empty) {
  opacity: 1;
}

