/* Essai Version_2 : micro-interactions sobres pour images, liens et boutons. */

.hero-img,
.section-image,
.strip-image,
.page-hero-image,
.tangible-hero-media img,
.tangible-image-break img,
.principle-image-pair img {
  transition: opacity 360ms ease, filter 360ms ease;
}

.primary-nav a,
.language-nav a,
.site-footer a,
.text-block a:not(.button),
.simple-page a:not(.button) {
  position: relative;
  display: inline-block;
  transition:
    color 260ms ease,
    transform 260ms ease;
}

.primary-nav a::after,
.language-nav a::after,
.site-footer a::after,
.text-block a:not(.button)::after,
.simple-page a:not(.button)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.36em;
  height: 1px;
  background: linear-gradient(90deg, rgba(212, 175, 55, 0), rgba(212, 175, 55, 0.82), rgba(212, 175, 55, 0));
  transform: scaleX(0);
  transform-origin: center;
  opacity: 0;
  transition:
    transform 320ms ease,
    opacity 320ms ease;
}

.primary-nav a:hover,
.language-nav a:hover,
.site-footer a:hover,
.text-block a:not(.button):hover,
.simple-page a:not(.button):hover {
  color: var(--gold);
  transform: translateY(-1px);
}

.primary-nav a:hover::after,
.language-nav a:hover::after,
.site-footer a:hover::after,
.text-block a:not(.button):hover::after,
.simple-page a:not(.button):hover::after {
  transform: scaleX(1);
  opacity: 1;
}

.button {
  transition:
    transform 260ms ease,
    box-shadow 260ms ease,
    background-color 260ms ease,
    color 260ms ease,
    border-color 260ms ease;
}

.button:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(212, 175, 55, 0.16);
}

.button.primary:hover {
  background: #e0bd49;
}

.button.ghost:hover {
  background: rgba(212, 175, 55, 0.1);
}

.info-card {
  transition:
    transform 420ms ease,
    border-color 420ms ease,
    box-shadow 420ms ease;
}

.info-card:hover {
  transform: translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
  .primary-nav a,
  .language-nav a,
  .site-footer a,
  .button,
  .info-card {
    transition: none;
  }

  .primary-nav a:hover,
  .language-nav a:hover,
  .site-footer a:hover,
  .button:hover,
  .info-card:hover {
    transform: none;
  }
}
