/* =============================================================================
   PERFORMANCE SPEED — Maurice Bardèche ARCHIV
   Allègement runtime : CLS, paint, scroll, mobile.
   ============================================================================= */

/* ---------- LCP : réserver l’espace du héros ---------- */
.hero-section {
  min-height: min(72vh, 720px);
  contain: layout style;
}

.mb-hero-canvas {
  min-height: min(52vh, 520px);
  aspect-ratio: 16 / 9;
  contain: paint;
}

@media (max-width: 767px) {
  .hero-section {
    min-height: auto;
  }

  .mb-hero-canvas {
    min-height: 38vh;
    aspect-ratio: 4 / 3;
  }
}

/* ---------- Contenu sous la ligne de flottaison ---------- */
.lfc-main > section:not(.hero-section) {
  content-visibility: auto;
  contain-intrinsic-size: auto 600px;
}

.ej-footer {
  content-visibility: auto;
  contain-intrinsic-size: auto 320px;
}

/* ---------- Paint : grain & blur ---------- */
@media (max-width: 991px) {
  body {
    background-attachment: scroll !important;
  }

  .navbar {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

html[data-theme="light"] body {
  background-size: 160px 160px;
}

/* ---------- Animations : propriétés compositées ---------- */
.mm-in {
  will-change: opacity, transform;
}

.mm-in:not(.active) {
  will-change: auto;
}

.ej-timeline-item.visible,
.ej-timeline-item.mm-in {
  will-change: auto;
}

/* ---------- Galerie : ratio stable ---------- */
.gallery-card {
  aspect-ratio: 3 / 4;
}

.gallery-card picture,
.gallery-card .gallery-card-image {
  aspect-ratio: inherit;
}

/* ---------- Polices : métriques de repli (réduit CLS) ---------- */
body {
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.heading---h2,
h1,
h2,
h3 {
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
}

@media (prefers-reduced-motion: reduce) {
  .mm-in {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .ej-timeline-item {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
