/*
 * Services empiles. Cadre sous .ivy-services--empilee : le CSS de tout le
 * rayon peut etre charge sur la meme page (piege connu, PASSATION §3).
 * Engagement 5 : aucun hexadecimal, valeurs de repli comprises.
 */
.ivy-services--empilee { padding:clamp(72px,10vw,150px) clamp(20px,5vw,72px); background: transparent; }
.ivy-services--empilee .ivy-services__header { width:100%; max-width:none; margin:0 auto 64px; }
.ivy-services--empilee .ivy-services__eyebrow { display:block; margin-bottom:16px; color:var(--ivy-eyebrow-color,rgb(82 82 82)); font-size:var( --ivy-font-label ); font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.ivy-services--empilee .ivy-services__title { width:100%; max-width:none; margin:0; color:var(--ivy-title-color,rgb(17 17 17)); line-height:.95; letter-spacing:-.06em; }
.ivy-services--empilee .ivy-services__text { width:100%; max-width:none; color:var(--ivy-text-color,rgb(82 82 82)); }
.ivy-services--empilee .ivy-services__list { max-width:1120px; margin:auto; }

/* Empilement mesure : +14 px par rang, six rangs. Fiche R-05. */
.ivy-services--empilee .ivy-services__item { position:sticky; top:24px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); min-height:520px; margin-bottom:24px; overflow:hidden; border-radius: var( --ivy-radius-surface, 24px ); background:var(--ivy-item-background-color,rgb(255 255 255)); box-shadow:0 10px 36px rgb(20 20 20 / 10%); }
.ivy-services--empilee .ivy-services__item:nth-child(2) { top:38px; }
.ivy-services--empilee .ivy-services__item:nth-child(3) { top:52px; }
.ivy-services--empilee .ivy-services__item:nth-child(4) { top:66px; }
.ivy-services--empilee .ivy-services__item:nth-child(5) { top:80px; }
.ivy-services--empilee .ivy-services__item:nth-child(n+6) { top:94px; }
/*
 * Une carte SANS image ne laisse pas une demi-largeur vide. Mesure sur la
 * vitrine en retirant la figure : la colonne editoriale tombait a 498 px
 * dans une carte de 996. Le centrage vertical, lui, tenait deja (80/80,
 * 107/108, 84/84 px de part et d'autre) — il n'est pas en cause.
 */
.ivy-services--empilee .ivy-services__item-copy:only-child { grid-column:1 / -1; align-items:center; text-align:center; }
.ivy-services--empilee .ivy-services__item-copy:only-child .ivy-services__item-text { max-width:52ch; }
.ivy-services--empilee .ivy-services__item-copy:only-child .ivy-services__result { border-left:0; padding-left:0; }
.ivy-services--empilee .ivy-services__item-copy:only-child .ivy-services__item-cta { align-self:center; }
.ivy-services--empilee .ivy-services__media { margin:0; }
/* Ratio choisi (`media_ratio`) : la carte prend la forme de sa photo, plancher de 520px retire ;
   le texte s'etire sur la meme hauteur. Garde par la presence d'une classe explicite. */
.ivy-services--empilee:is( .ivy-services--ratio-16-9, .ivy-services--ratio-4-3, .ivy-services--ratio-1-1, .ivy-services--ratio-3-4, .ivy-services--ratio-4-5 ) .ivy-services__item { min-height:0; }
.ivy-services--empilee:is( .ivy-services--ratio-16-9, .ivy-services--ratio-4-3, .ivy-services--ratio-1-1, .ivy-services--ratio-3-4, .ivy-services--ratio-4-5 ) .ivy-services__media { aspect-ratio:var( --ivy-services-ratio ); align-self:stretch; min-height:0; }
.ivy-services--empilee .ivy-services__media img { display:block; width:100%; height:100%; object-fit:cover; border-radius: inherit; }
.ivy-services--empilee .ivy-services__item-copy { display:flex; flex-direction:column; justify-content:center; gap:18px; padding:clamp(32px,6vw,80px); }
.ivy-services--empilee .ivy-services__number { color:var(--ivy-item_number-color,rgb(82 82 82)); font-size:var( --ivy-font-label ); font-weight:700; letter-spacing:.16em; }
.ivy-services--empilee .ivy-services__item-title { margin:0; color:var(--ivy-item_title-color,rgb(17 17 17)); line-height:.95; letter-spacing:-.05em; }
.ivy-services--empilee .ivy-services__item-text { max-width:34ch; margin:0; color:var(--ivy-item_text-color,rgb(82 82 82)); font-size:var( --ivy-font-body ); line-height:1.5; }

/*
 * Deux listes, jamais une seule ligne d'icone par item : Elementor ne sait
 * pas imbriquer un repeteur dans un repeteur, donc l'icone se choisit une
 * fois PAR LISTE (`card_includes_icon`/`card_excludes_icon`), pas par ligne.
 */
.ivy-services--empilee .ivy-services__includes,
.ivy-services--empilee .ivy-services__excludes { display:grid; row-gap:8px; margin:10px 0 0; padding:0; list-style:none; }
.ivy-services--empilee .ivy-services__include,
.ivy-services--empilee .ivy-services__exclude { display:flex; align-items:baseline; gap:8px; max-width:34ch; color:var(--ivy-item_include-color,rgb(82 82 82)); font-size:var( --ivy-font-body ); line-height:1.4; }
.ivy-services--empilee .ivy-services__exclude { color:var(--ivy-item_exclude-color,rgb(82 82 82)); }
.ivy-services--empilee .ivy-services__include-icon,
.ivy-services--empilee .ivy-services__exclude-icon { display:inline-grid; flex:0 0 auto; min-width:1em; min-height:1em; margin-top:.2em; place-items:center; color:var(--ivy-item_include_icon-color,currentColor); font-size:calc( 1rem * var( --ivy-text-scale, 1 ) ); line-height:1; }
.ivy-services--empilee .ivy-services__exclude-icon { color:var(--ivy-item_exclude_icon-color,currentColor); }
.ivy-services--empilee .ivy-services__include-icon svg,
.ivy-services--empilee .ivy-services__exclude-icon svg { width:1em; height:1em; fill:currentcolor; }

.ivy-services--empilee .ivy-services__result { margin:0; padding:18px 20px; border-left:2px solid var(--ivy-item_result-border-color,rgb(17 17 17)); background:var(--ivy-item_result-background-color,transparent); }
.ivy-services--empilee .ivy-services__result-text { margin:0; color:var(--ivy-item_result-color,rgb(17 17 17)); font-size:var( --ivy-font-body ); font-weight:500; line-height:1.4; }
.ivy-services--empilee .ivy-services__result-author { margin-top:8px; color:var(--ivy-item_author-color,rgb(82 82 82)); font-size:var( --ivy-font-label ); letter-spacing:.04em; }

.ivy-services--empilee .ivy-services__item-cta { align-self:flex-start; padding:.75em 1.3em; border:1px solid var(--ivy-item_cta-border-color,rgb(17 17 17)); border-radius: var( --ivy-radius-action, 999px ); background:var(--ivy-item_cta-background-color,transparent); color:var(--ivy-item_cta-color,rgb(17 17 17)); font-size:var( --ivy-font-label ); font-weight:600; text-decoration:none; transition:transform 180ms cubic-bezier(.23,1,.32,1),background-color 180ms ease,color 180ms ease; }
.ivy-services--empilee .ivy-services__item-cta:hover,.ivy-services--empilee .ivy-services__item-cta:focus-visible { transform:translateY(-2px); }
.ivy-services--empilee .ivy-services__item-cta:focus-visible { outline:2px solid currentColor; outline-offset:4px; }

/* Mobile : ni epinglage, ni contenu masque. */
@media(max-width:900px) {
	.ivy-services--empilee .ivy-services__item,.ivy-services--empilee .ivy-services__item:nth-child(n) { position:relative; top:auto; grid-template-columns:minmax(0,1fr); min-height:0; }
	.ivy-services--empilee .ivy-services__media { aspect-ratio:var( --ivy-services-ratio, 4/3 ); }
	.ivy-services--empilee .ivy-services__item-copy { padding:32px; }
}

@media(prefers-reduced-motion:reduce) {
	.ivy-services--empilee *, .ivy-services--empilee *::before, .ivy-services--empilee *::after { animation:none !important; scroll-behavior:auto; transition:none !important; }
}
.ivy-services--empilee.ivy-services--ratio-16-9 { --ivy-services-ratio: 16 / 9; }
.ivy-services--empilee.ivy-services--ratio-4-3 { --ivy-services-ratio: 4 / 3; }
.ivy-services--empilee.ivy-services--ratio-1-1 { --ivy-services-ratio: 1 / 1; }
.ivy-services--empilee.ivy-services--ratio-3-4 { --ivy-services-ratio: 3 / 4; }
.ivy-services--empilee.ivy-services--ratio-4-5 { --ivy-services-ratio: 4 / 5; }