/*
  Actualites - Immersive Background Presets
  V20.7 - Professional look + Mobile optimization

  Notes:
  - actualites.php adds a preset class on <main> (page_class):
      page--actualites actualites-sharp
      page--actualites actualites-cinematic
  - We use CSS variables per preset and apply them to the background media and overlay.
*/

/* Safe fallback */
.page--actualites {
  --bg-blur: 6px;
  --bg-brightness: 1.05;
  --bg-contrast: 1.10;
  --bg-saturate: 1.08;
  --bg-scale: 1.04;

  --ov-radial-a: 0.25;
  --ov-radial-b: 0.55;
  --ov-top: 0.55;
  --ov-bottom: 0.80;
}

/* Sharp Premium (default) */
.page--actualites.actualites-sharp {
  --bg-blur: 6px;
  --bg-brightness: 1.05;
  --bg-contrast: 1.10;
  --bg-saturate: 1.08;
  --bg-scale: 1.04;

  --ov-radial-a: 0.25;
  --ov-radial-b: 0.55;
  --ov-top: 0.55;
  --ov-bottom: 0.80;
}

/* Cinematic Dark */
.page--actualites.actualites-cinematic {
  --bg-blur: 10px;
  --bg-brightness: 0.95;
  --bg-contrast: 1.05;
  --bg-saturate: 1.00;
  --bg-scale: 1.06;

  --ov-radial-a: 0.35;
  --ov-radial-b: 0.70;
  --ov-top: 0.65;
  --ov-bottom: 0.90;
}

/* Crystal (ultra net & clair) */
.page--actualites.actualites-crystal {
  --bg-blur: 0px;
  --bg-brightness: 1.15;
  --bg-contrast: 1.18;
  --bg-saturate: 1.12;
  --bg-scale: 1.00;

  --ov-radial-a: 0.10;
  --ov-radial-b: 0.30;
  --ov-top: 0.30;
  --ov-bottom: 0.60;
}

/* Apply to the background media element (video or div background) */
.page--actualites .actualitesBg__media {
  filter: blur(var(--bg-blur))
          brightness(var(--bg-brightness))
          contrast(var(--bg-contrast))
          saturate(var(--bg-saturate));
  transform: scale(var(--bg-scale));
  will-change: transform, filter;
}

/* Overlay: professional, readable, not "muddy" */
.page--actualites .actualitesBg__overlay {
  background:
    radial-gradient(
      ellipse at center,
      rgba(0,0,0,var(--ov-radial-a)) 0%,
      rgba(0,0,0,var(--ov-radial-b)) 70%
    ),
    linear-gradient(
      to bottom,
      rgba(0,0,0,var(--ov-top)),
      rgba(0,0,0,var(--ov-bottom))
    );
}

/* Mobile optimization: reduce blur and GPU cost, keep clarity */
@media (max-width: 768px) {
  .page--actualites.actualites-sharp {
    --bg-blur: 3px;
    --bg-brightness: 1.02;
    --bg-contrast: 1.05;
    --bg-saturate: 1.05;
    --bg-scale: 1.02;
  }

  .page--actualites.actualites-cinematic {
    --bg-blur: 5px;
    --bg-brightness: 0.98;
    --bg-contrast: 1.03;
    --bg-saturate: 1.00;
    --bg-scale: 1.03;
  }

  .page--actualites.actualites-crystal {
    --bg-blur: 0px;
    --bg-brightness: 1.12;
    --bg-contrast: 1.12;
    --bg-saturate: 1.08;
    --bg-scale: 1.00;
  }
}

/* Accessibility: if user prefers reduced motion, reduce filter work a bit */
@media (prefers-reduced-motion: reduce) {
  .page--actualites .actualitesBg__media {
    filter: brightness(var(--bg-brightness)) contrast(var(--bg-contrast)) saturate(var(--bg-saturate));
    transform: none;
  }
}