/* Diaporama de l'accueil (mu-plugin bp-skeditions-diaporama.php). Chaque diapositive garde le style du grand bloc. */
.sk-diapo { position: relative; min-width: 0; width: 100%; height: 100%; }
.sk-diapo__piste { position: relative; display: flex; height: 100%; overflow-x: auto; border-radius: var(--radius-xl); scroll-snap-type: x mandatory; scrollbar-width: none; }
.sk-diapo__piste::-webkit-scrollbar { display: none; }
.sk-diapo__piste:focus { outline: none; }
.sk-diapo__slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.sk-diapo .sk-hero__texte h2 { margin: 0; font-size: var(--fs-60); text-wrap: balance; }

.sk-diapo--multi .sk-hero__banniere { padding-bottom: calc(var(--sp-48) + 32px); }
.sk-diapo__commandes { position: absolute; left: 50%; bottom: 16px; z-index: 5; display: flex; align-items: center; gap: 4px; padding: 4px 6px; border-radius: 22px; background: var(--color-white); box-shadow: var(--shadow-soft); transform: translateX(-50%); }
.sk-diapo__fleche { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--color-dark); cursor: pointer; transition: background-color .15s; }
.sk-diapo__fleche:hover, .sk-diapo__fleche:focus-visible { background: var(--color-primary-soft); color: var(--color-primary); }
.sk-diapo__point { width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; }
.sk-diapo__point::before { content: ""; display: block; width: 10px; height: 10px; margin: auto; border-radius: 50%; background: var(--color-text-muted); transition: background-color .2s, transform .2s; }
.sk-diapo__point:hover::before { background: var(--color-dark); }
.sk-diapo__point[aria-current="true"]::before { background: var(--color-primary); transform: scale(1.25); }

@media (max-width: 767px) {
	.sk-diapo--multi .sk-hero__banniere { padding-bottom: 72px; }
}

/* Mobile (04/11/2026) : toute la diapositive tient dans le premier écran. Les couvertures passent en tête, plus petites ;
   le texte se resserre ; le long paragraphe (champ « Texte ») est masqué — il reste sur ordinateur ; le bouton contour
   devient un lien texte à côté du bouton plein. Les diapositives s'étirent à la plus haute (piste en flex) : la page ne
   saute pas au changement. Rien ne change dans l'administration. */
@media (max-width: 767px) {
	.sk-diapo .sk-hero__banniere { display: flex; flex-direction: column; gap: var(--sp-16); padding: var(--sp-20) var(--sp-20) 68px; }
	.sk-diapo .sk-hero__banniere > .sk-couvertures { order: -1; --sk-h: 220px; flex: none; width: 100%; margin-bottom: var(--sp-8); }
	/* les couvertures tiennent dans leur cadre (inclinées, elles débordaient sur le surtitre) ; le texte passe devant leur ombre */
	.sk-diapo .sk-couvertures .sk-couvertures__livre { width: min(40%, calc(var(--sk-h) * .56)); }
	.sk-diapo .sk-couvertures--2 .sk-couvertures__livre { width: min(46%, calc(var(--sk-h) * .56)); }
	.sk-diapo .sk-couvertures--1 .sk-couvertures__livre { width: min(60%, calc(var(--sk-h) * .6)); }
	.sk-diapo .sk-couvertures__livre img { box-shadow: 0 14px 24px rgba(17, 20, 45, .25); }
	.sk-diapo .sk-hero__texte { position: relative; z-index: 5; }
	.sk-diapo .sk-hero__texte { gap: var(--sp-8); }
	.sk-diapo .sk-hero__texte .sk-surtitre { margin: 0; font-size: 12px; }
	.sk-diapo .sk-hero__texte :is(h1, h2) { font-size: clamp(26px, 7.6vw, 32px); line-height: 1.12; }
	.sk-diapo .sk-hero__texte .sk-hero__chapo { font-size: 17px; line-height: 1.35; }
	.sk-diapo .sk-hero__texte > p:not(.sk-surtitre):not(.sk-hero__chapo) { display: none; }
	.sk-diapo .sk-hero__boutons { flex-wrap: nowrap; align-items: center; gap: var(--sp-16); margin-top: var(--sp-8); }
	.sk-diapo .sk-hero__boutons .sk-btn:not(.sk-btn--contour) { flex: none; min-height: 48px; padding-inline: var(--sp-20); }
	.sk-diapo .sk-hero__boutons .sk-btn--contour { min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--color-primary); font-size: 15px; text-decoration: underline; text-underline-offset: 3px; white-space: normal; text-align: left; }
	.sk-diapo__commandes { bottom: 14px; }
}
