/* Affichage mobile des cartes : limite + slider (swipe) + pagination.
   Piloté par data-m-swiper / data-m-limit (posés par render_block) et par
   cards-mobile.js. Tout est borné à 900px, là où les grilles passent déjà
   en une seule colonne. */

/* Les dots n'existent qu'en slider mobile : cachés par défaut. */
.sbd-dots{ display:none; justify-content:center; gap:.5rem; margin-top:1.25rem; }
.sbd-dots button{
	width:8px; height:8px; padding:0; border:none; border-radius:50%;
	background:var(--sand-2); cursor:pointer;
	-webkit-appearance:none; appearance:none;
	transition:background .2s ease, transform .2s ease;
}
.sbd-dots button:hover{ background:var(--amber-lt); }
.sbd-dots button.is-active{ background:var(--amber); transform:scale(1.3); }

@media(max-width:900px){
	/* Slider : la grille devient un rail horizontal à scroll-snap. */
	.sbd-cards[data-m-swiper]{
		display:flex;
		flex-wrap:nowrap;
		gap:1rem;
		overflow-x:auto;
		scroll-snap-type:x mandatory;
		scroll-padding-inline:1.25rem;
		-webkit-overflow-scrolling:touch;
		scrollbar-width:none;
		padding-bottom:.25rem;
	}
	.sbd-cards[data-m-swiper]::-webkit-scrollbar{ display:none; }
	.sbd-cards[data-m-swiper] > *{
		flex:0 0 84%;
		scroll-snap-align:center;
		min-width:0;
	}
	/* Les cartes du rail restent visibles même si l'animation reveal n'a pas
	   encore été déclenchée par le défilement horizontal. */
	.sbd-cards[data-m-swiper] > .reveal{ opacity:1; transform:none; }

	/* Cartes masquées par la limite (classe posée par cards-mobile.js). */
	.sbd-cards .is-m-hidden{ display:none !important; }

	/* Dots visibles uniquement sous un rail slider. */
	.sbd-cards[data-m-swiper] + .sbd-dots{ display:flex; }
}

/* Ajustements par bloc (mobile). */
@media(max-width:900px){
	/* Méthode : les cartes sont petites, on en montre 2 par vue dans le rail
	   (au lieu d'une seule), avec un calage sur le bord gauche. */
	.sbd-block-method .sbd-cards[data-m-swiper] > *{
		flex-basis:calc((100% - 1rem) / 2);
		scroll-snap-align:start;
	}

	/* Abonnements : le rail occupe quasi toute la largeur (on neutralise le
	   padding du container autour), et le padding interne des cartes est
	   légèrement réduit, pour dé-serrer le contenu. */
	.sbd-block-solutions .sol-grid[data-m-swiper]{
		margin-inline:calc(-1 * clamp(1.25rem, 4vw, 3rem));
		padding-inline:.5rem;
		scroll-padding-inline:.5rem;
	}
	.sbd-block-solutions .sol-card{ padding:1.5rem; }
}