/* La pépinière */
.ab-hero { margin: 0 clamp(20px, 3.4vw, 48px); aspect-ratio: 21 / 9; border-radius: 12px; overflow: hidden; background: #e7e4dc; }
.ab-hero img { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 50% 60%; }
.ab-who { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(32px, 5vw, 96px); align-items: start; }
.ab-who__txt { display: grid; gap: 18px; }
.ab-who [lang="ar"] { font-family: "IBM Plex Sans Arabic", var(--font-text); }

.ab-place { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 96px); align-items: center; padding: 0 clamp(20px, 3.4vw, 48px) clamp(56px, 10vh, 120px); }
.ab-place { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; padding-block-start: 0; }
.ab-place__facts { list-style: none; margin: 0; padding: 0; display: grid; font: 400 15px/1.45 var(--font-text); }
.ab-place__facts li { display: flex; gap: 14px; align-items: flex-start; padding-block: 16px; border-block-start: 1px solid rgba(18,20,18,.12); }
.ab-place__facts li:last-child { padding-block-start: 22px; }
.ab-place__facts svg { inline-size: 24px; block-size: 24px; flex: none; fill: none; stroke: var(--zellige); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ab-place__facts b { display: block; font: 400 21px/1.25 var(--font-serif); }
.ab-place__facts span { opacity: .85; }
.ab-who__side { display: grid; gap: clamp(24px, 4vh, 40px); }
.ab-who__pic { margin: 0; display: grid; gap: 10px; }
.ab-who__pic img { inline-size: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; display: block; }
.ab-who__pic figcaption { font: 400 13px/1.4 var(--font-text); opacity: .62; }
.ab-who__txt { padding-block-start: clamp(0px, 8vw, 120px); }
@media (max-width: 900px) { .ab-who__txt { padding: 0; } }
.ab-place__txt { display: grid; gap: 18px; justify-items: start; }

.ab-grow { display: grid; gap: clamp(40px, 7vh, 72px); }
.ab-grow__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 96px); align-items: end; }
.ab-grow .steps li { border-color: rgba(246,246,242,.25); }
.ab-grow .steps p { color: rgba(246,246,242,.8); opacity: 1; }

.ab-team { display: grid; gap: clamp(40px, 7vh, 72px); }
.ab-team__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 96px); align-items: end; }
.roles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 2.4vw, 40px); }
.roles li { display: grid; gap: 10px; align-content: start; padding-block-start: 20px; border-block-start: 1px solid rgba(18,20,18,.2); }
.roles svg { inline-size: 30px; block-size: 30px; fill: none; stroke: var(--zellige); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.roles h3 { margin: 6px 0 0; font: 400 26px/1.15 var(--font-serif); letter-spacing: -.015em; }
.roles p { margin: 0; font: 400 15px/1.55 var(--font-text); opacity: .78; }

.ab-promise { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 28px clamp(32px, 5vw, 96px); align-items: start; }
.promise { list-style: none; margin: 0; padding: 0; display: grid; }
.promise li { display: grid; gap: 6px; padding-block: 18px; border-block-start: 1px solid rgba(18,20,18,.15); }
.promise li:first-child { padding-block-start: 0; border: 0; }
.promise b { font: 400 clamp(24px, 2.2vw, 30px)/1.15 var(--font-serif); }
.promise span { font: 400 16px/1.55 var(--font-text); opacity: .8; max-inline-size: 40em; }
.ab-promise__acts { grid-column: 2; display: flex; flex-wrap: wrap; gap: 12px; }

@media (max-width: 1100px) { .roles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .ab-hero { aspect-ratio: 4 / 3; }
  .ab-who, .ab-place, .ab-grow__head, .ab-team__head, .ab-promise { grid-template-columns: minmax(0, 1fr); }
  .ab-promise__acts { grid-column: auto; }
}
@media (max-width: 600px) { .roles { grid-template-columns: minmax(0, 1fr); } }
