/* -------------------------------------------------------
   Abalone – Limitation de contenu
   Usage : ajouter limit-{px} comme classe CSS sur la
   colonne/section Divi, ex: limit-200 ou limit-500
   ------------------------------------------------------- */

/*
 * z-index: 0 crée un contexte d'empilement sur le conteneur.
 * Tous les z-index Divi internes sont ainsi relatifs à ce bloc,
 * et ne peuvent pas "fuiter" au-dessus de .abl-fade.
 */
[class*="limit-"] {
	position: relative;
	z-index: 0;
}

/*
 * .abl-clip  → overflow:hidden  (clip du texte)
 * z-index: 1 crée un contexte d'empilement :
 * les éléments Divi imbriqués restent confinés à l'intérieur.
 */
.abl-clip {
	position: relative;
	z-index: 1;
	overflow: hidden;
	/* max-height + transition appliqués en JS */
}

/*
 * .abl-fade  → dégradé overlay, enfant de .abl-clip.
 * bottom: 0 → toujours collé à la ligne de coupe du clip,
 * indépendamment des paddings Divi du conteneur.
 * z-index max : confiné au contexte d'empilement de .abl-clip,
 * il passe au-dessus de tous les z-index Divi internes sans
 * pouvoir "fuiter" au-dessus du reste de la page.
 * transform: translateZ(0) force le rendu GPU sur iOS Safari.
 */
.abl-fade {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100px;
	z-index: 2147483647;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #f2f1EB 100%);
	pointer-events: none;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	transition: opacity 0.3s ease;
}

.abl-fade.is-hidden {
	opacity: 0;
}

/* Bouton — centré avec trait gauche/droite */
.abl-toggle-btn {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	margin-top: 14px;
	background: none;
	border: none;
	cursor: pointer;
	font-family: 'NeueMachina-Regular', sans-serif;
	font-size: 25px;
	font-weight: 100;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: inherit;
	padding: 0;
	text-decoration: none;
	white-space: nowrap;
	position: relative;
	z-index: 2;
}

/* Traits gauche et droite */
.abl-toggle-btn::before,
.abl-toggle-btn::after {
	content: "";
	flex: 1;
	 
	background: currentColor;
	opacity: 0.35;
}

.abl-toggle-btn:focus-visible {
	 
}
