/* =====================================================
   CONSEIL SNDGK — Bandes des études de cas

   Fichier AUTONOME, chargé uniquement par etudes-de-cas.html et
   etudes-de-cas-en.html : ne modifie ni premium.css ni premium-themes.css.
   Dépend de fond-anime.css et fond-anime.js, à charger avant.

   CE QU'IL FAIT — il transforme trois cartes empilées dans une seule section
   en TROIS BANDES pleine largeur, chacune portant le fond animé de sa nature.

   D'OÙ VIENT L'EFFET. Pas de l'emphase sur les chiffres : ces cas sont
   annoncés comme inspirés de missions réelles, et grossir des chiffres
   composites augmenterait l'écart entre la mise en scène et leur valeur de
   preuve. L'effet vient du RYTHME — trois moments distincts, chacun avec sa
   respiration et son fond — et de l'ÉCHELLE des marqueurs //01 à //03.
   Les blocs .case-stats gardent donc exactement leur traitement d'origine.

   LA CARTE FLOTTE SUR L'ANIMATION. Le fond animé occupe toute la bande ;
   la carte reste opaque et centrée à 880 px, si bien que l'animation
   respire de part et d'autre. L'ombre portée la décolle du fond — sans
   elle, la carte et l'animation se lisent sur le même plan et l'ensemble
   devient bruyant.
===================================================== */

/* La bande : le fond animé a besoin d'un contexte de positionnement, que
   fond-anime.css pose déjà sur .fond-anime. On ne règle ici que le rythme. */
body.page-cas .cas-bande {
  padding-top: clamp(3.5rem, 8vh, 6rem);
  padding-bottom: clamp(3.5rem, 8vh, 6rem);
}

/* Le marqueur de bande. Plus grand que le .label courant : c'est lui qui
   porte le changement d'échelle, et il annonce chaque cas comme un moment
   plutôt que comme un élément de liste. */
body.page-cas .cas-bande .sec-head .label {
  font-size: clamp(1.4rem, 3vw, 2.1rem);
  letter-spacing: 0.02em;
}

/* La carte, posée sur l'animation.
   z-index : le canevas de fond-anime.css est en z-index 0 ; la carte doit
   passer devant, sans quoi l'animation la traverserait visuellement. */
body.page-cas .cas-bande .case-card {
  position: relative;
  z-index: 1;
  max-width: 880px;
  margin: 0 auto;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 18px 44px rgba(30, 22, 14, 0.10);
}

body.page-cas .cas-bande .case-card:hover {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 26px 60px rgba(30, 22, 14, 0.15);
}

/* L'en-tête de bande passe devant l'animation, comme la carte. */
body.page-cas .cas-bande .sec-head {
  position: relative;
  z-index: 1;
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
}

/* Sous 700 px, l'ombre portée n'apporte plus rien (la carte occupe presque
   toute la largeur, l'animation n'est plus visible autour) et elle coûte un
   calcul de compositing à chaque défilement. */
@media (max-width: 699px) {
  body.page-cas .cas-bande .case-card { box-shadow: none; }
}