/* Modèle 07 — Carousel 3D (coverflow) : une carte centrale dominante, les cartes voisines
   visibles partiellement sur les côtés, réduites et assombries. Ratio propre au modèle
   (pas de classe .ss-ratio-* fournie — la hauteur est définie ici).

   Important : la transformation coverflow s'applique à une carte de largeur FIXE
   (.tpl-07-card) à l'intérieur de chaque .ss-slide, jamais à la diapositive elle-même
   (qui reste pleine largeur, comme l'exige le moteur) — sans cela, translateX(±62%) se
   calcule sur 100% de la largeur du slider et éjecte les voisines hors de l'écran. */

.tpl-07.ss-slider{
  height:64vh; min-height:460px; max-height:640px;
  background:var(--brand-primary);
}
.tpl-07 .ss-track{ position:relative; width:100%; height:100%; perspective:1400px; }

.tpl-07 .ss-slide{
  position:absolute; inset:0; transition:opacity .5s var(--ease);
  /* La diapositive reste pleine largeur (exigée par le moteur) mais ne doit JAMAIS capter
     les clics en dehors de sa propre carte : sinon la diapositive active (pleine largeur,
     transparente hors de sa carte) intercepte les clics destinés aux cartes voisines qui
     peuvent visuellement dépasser dans son emprise. Seule .tpl-07-card réactive pointer-events. */
  pointer-events:none;
}
.tpl-07 .ss-slide.is-active{ opacity:1; visibility:visible; z-index:3; }
.tpl-07 .ss-slide.is-prev,
.tpl-07 .ss-slide.is-next{ opacity:1; visibility:visible; z-index:2; }
.tpl-07 .ss-slide:not(.is-active):not(.is-prev):not(.is-next){ opacity:0; }

/* --- La carte : largeur fixe (bornée en vw), recentrée par margin-left négatif constant ;
   seule sa position `left` et son `transform` changent selon l'état. --- */
.tpl-07-card{
  position:absolute; top:8%; height:84%; left:50%;
  width:min(44vw,520px);
  margin-left:calc(-1 * min(44vw,520px) / 2);
  display:flex; flex-direction:column;
  border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-lg);
  background:var(--brand-surface);
  transition:left .5s var(--ease), transform .5s var(--ease), filter .5s var(--ease);
  transform:scale(1); filter:brightness(1);
  pointer-events:auto;
}
.tpl-07 .ss-slide.is-active .tpl-07-card{ left:50%; transform:scale(1); filter:brightness(1); }
.tpl-07 .ss-slide.is-prev .tpl-07-card{ left:11%; transform:scale(.78); filter:brightness(.6); cursor:pointer; }
.tpl-07 .ss-slide.is-next .tpl-07-card{ left:89%; transform:scale(.78); filter:brightness(.6); cursor:pointer; }

.tpl-07-card .ss-media{ position:relative; inset:auto; flex:1; min-height:0; }
.tpl-07-card .tpl-07-label{
  flex:none; margin:0; padding:var(--space-3) var(--space-3) var(--space-4);
  text-align:center; font:700 var(--fs-sm)/1.3 var(--brand-font-heading);
  color:var(--brand-text); background:var(--brand-surface);
}

@media (max-width:720px){
  .tpl-07.ss-slider{ height:56vh; min-height:380px; }
  .tpl-07-card{ width:min(60vw,320px); margin-left:calc(-1 * min(60vw,320px) / 2); }
  .tpl-07 .ss-slide.is-prev .tpl-07-card{ left:4%; }
  .tpl-07 .ss-slide.is-next .tpl-07-card{ left:96%; }
  .tpl-07-card .tpl-07-label{ font-size:var(--fs-xs); padding:var(--space-2) var(--space-2) var(--space-3); }
}