.ivy-intro--diptyque { padding: clamp( 72px, 8vw, 128px ) clamp( 20px, 5vw, 84px ); }
.ivy-intro--diptyque .ivy-intro__inner { display: grid; --ivy-gap: clamp( 44px, 4vw, 68px ); column-gap: var( --ivy-gap ); row-gap: var( --ivy-row-gap, clamp( 48px, 4.5vw, 76px ) ); grid-template-columns: minmax( 360px, calc( ( 100% - var( --ivy-gap ) ) * var( --ivy-columns, 40 ) / 100 ) ) minmax( 0, 1fr ); grid-template-rows: auto 1fr; max-width: 1520px; margin-inline: auto; }
.ivy-intro--diptyque .ivy-intro__header { grid-column: 2; margin: 0; align-self: start; }
.ivy-intro--diptyque .ivy-intro__eyebrow { display: block; margin-bottom: 18px; color: var( --ivy-eyebrow-color, var( --ivy-muted, rgb( 82 82 82 ) ) ); font-size: var( --ivy-font-label ); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.ivy-intro--diptyque .ivy-intro__title { margin: 0; color: var( --ivy-title-color, var( --ivy-ink, rgb( 17 17 17 ) ) ); line-height: 1.04; letter-spacing: -.025em; text-wrap: wrap; }
.ivy-intro--diptyque .ivy-intro__lower { display: grid; grid-column: 2; grid-template-columns: minmax( 210px, .72fr ) minmax( 0, 1.18fr ); gap: clamp( 32px, 3.8vw, 64px ); align-items: stretch; }
.ivy-intro--diptyque .ivy-intro__inner:not(:has(.ivy-intro__media--primary)) .ivy-intro__header, .ivy-intro--diptyque .ivy-intro__inner:not(:has(.ivy-intro__media--primary)) .ivy-intro__lower { grid-column: 1 / -1; }
.ivy-intro--diptyque .ivy-intro__lower:not(:has(.ivy-intro__media--secondary)) { grid-template-columns: 1fr; }
.ivy-intro--diptyque .ivy-intro__narrative { min-width: 0; align-self: start; }
.ivy-intro--diptyque .ivy-intro__text { max-width: 66ch; color: var( --ivy-text-color, var( --ivy-muted, rgb( 82 82 82 ) ) ); font-size: var( --ivy-font-body ); line-height: 1.62; }
.ivy-intro--diptyque .ivy-intro__text > :first-child { margin-top: 0; }
.ivy-intro--diptyque .ivy-intro__text > :last-child { margin-bottom: 0; }
.ivy-intro--diptyque .ivy-intro__actions { display: grid; gap: 12px; margin-top: 30px; }
.ivy-intro--diptyque .ivy-intro__cta { display: flex; width: 100%; min-height: 48px; align-items: center; justify-content: center; gap: .7em; padding: .78em 1.5em; border-radius: var( --ivy-cta-border-radius, 999px ); background: var( --ivy-cta-background-color, var( --ivy-accent, rgb( 17 17 17 ) ) ); color: var( --ivy-cta-color, var( --ivy-surface, rgb( 255 255 255 ) ) ); font-weight: 700; text-align: center; text-decoration: none; transition: transform 180ms ease; }
.ivy-intro--diptyque .ivy-intro__cta--secondary { border: var( --ivy-cta_secondary-border-width, 1px ) solid var( --ivy-cta_secondary-border-color, var( --ivy-ink, rgb( 17 17 17 ) ) ); background: var( --ivy-cta_secondary-background-color, transparent ); color: var( --ivy-cta_secondary-color, var( --ivy-ink, rgb( 17 17 17 ) ) ); }
.ivy-intro--diptyque .ivy-intro__cta::after { content: "→"; font-size: var( --ivy-font-label ); line-height: 1; }
.ivy-intro--diptyque .ivy-intro__cta:hover { transform: translateY( -2px ); }
.ivy-intro--diptyque .ivy-intro__cta:focus-visible { outline: 3px solid currentcolor; outline-offset: 4px; }
.ivy-intro--diptyque .ivy-intro__media { margin: 0; border-radius: var( --ivy-media-border-radius, clamp( 24px, 2.4vw, 40px ) ); }
.ivy-intro--diptyque .ivy-intro__media--primary { grid-row: 1 / span 2; }
.ivy-intro--diptyque .ivy-intro__media img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.ivy-intro--diptyque .ivy-intro__media--secondary { display: grid; min-height: 0; grid-template-rows: minmax( 0, 1fr ) auto; }
.ivy-intro--diptyque .ivy-intro__media-frame { position: relative; min-height: 0; overflow: hidden; border-radius: inherit; }
.ivy-intro--diptyque .ivy-intro__media-frame img { position: absolute; inset: 0; }
.ivy-intro--diptyque .ivy-intro__caption { margin-top: 10px; color: var( --ivy-caption-color, var( --ivy-muted, rgb( 82 82 82 ) ) ); font-size: var( --ivy-font-body ); }
.ivy-intro--diptyque.ivy-intro--media-right .ivy-intro__header,
.ivy-intro--diptyque.ivy-intro--media-right .ivy-intro__lower { grid-column: 1; }
.ivy-intro--diptyque.ivy-intro--media-right .ivy-intro__media--primary { grid-column: 2; }
/* En une colonne, le sens n'a plus de piste ou aller : une colonne 2 forcee
   creerait une piste implicite et laisserait l'image de cote. */
@media ( max-width: 900px ) {
	.ivy-intro--diptyque.ivy-intro--media-right .ivy-intro__header,
	.ivy-intro--diptyque.ivy-intro--media-right .ivy-intro__lower,
	.ivy-intro--diptyque.ivy-intro--media-right .ivy-intro__media--primary { grid-column: 1; }
}
@media ( max-width: 900px ) { .ivy-intro--diptyque .ivy-intro__inner { grid-template-columns: 1fr; grid-template-rows: auto; gap: 36px; } .ivy-intro--diptyque .ivy-intro__header, .ivy-intro--diptyque .ivy-intro__lower { grid-column: 1; } .ivy-intro--diptyque .ivy-intro__media--primary { grid-row: auto; } .ivy-intro--diptyque .ivy-intro__media--primary img { aspect-ratio: 4 / 3; } }
@media ( max-width: 640px ) { .ivy-intro--diptyque .ivy-intro__lower { grid-template-columns: 1fr; gap: 28px; } .ivy-intro--diptyque .ivy-intro__media--secondary { width: min( 82%, 360px ); height: auto; } .ivy-intro--diptyque .ivy-intro__media-frame { aspect-ratio: 1 / 1.04; } }
@media ( prefers-reduced-motion: reduce ) { .ivy-intro--diptyque .ivy-intro__cta { transition: none; } }