/*
 * intro/portrait-colle — transposition de `.portrait` (maquette Les Jolies Clés, La fondatrice) : portrait 11/12 collé
 * (5fr), fin cadre décalé, texte à droite (6fr) sous un filet ; le premier paragraphe est plus grand, en police de titre.
 * Engagement 5 : aucun hexadécimal, valeurs de repli comprises.
 */
.ivy-intro--portrait-colle { padding: clamp( 56px, 7vw, 104px ) max( clamp( 20px, 5vw, 64px ), calc( ( 100% - 1240px ) / 2 ) ) clamp( 88px, 10vw, 144px ); }
.ivy-intro--portrait-colle .ivy-intro__inner { display: grid; grid-template-columns: 5fr 6fr; gap: clamp( 48px, 8vw, 128px ); align-items: start; }
.ivy-intro--portrait-colle .ivy-intro__media { position: sticky; top: calc( var( --ivy-navbar-h, 88px ) + 48px ); isolation: isolate; margin: 0; padding-left: 18px; }
.ivy-intro--portrait-colle .ivy-intro__media::before { content: ''; position: absolute; inset: -18px 18px 18px 0; z-index: -1; border: 1px solid var( --ivy-media-border-color, var( --ivy-accent, rgb( 184 151 90 ) ) ); border-radius: var( --ivy-radius-surface, 4px ); }
.ivy-intro--portrait-colle .ivy-intro__photo { position: relative; overflow: hidden; aspect-ratio: 11 / 12; border-radius: var( --ivy-radius-surface, 4px ); background: var( --ivy-surface-sunk, rgb( 238 230 216 ) ); }
.ivy-intro--portrait-colle .ivy-intro__photo img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; object-position: var( --ivy-intro-focus, 50% 50% ); }
.ivy-intro--portrait-colle.ivy-intro--focus-top .ivy-intro__photo img { --ivy-intro-focus: 50% 0%; }
.ivy-intro--portrait-colle.ivy-intro--focus-bottom .ivy-intro__photo img { --ivy-intro-focus: 50% 100%; }
.ivy-intro--portrait-colle .ivy-intro__eyebrow { display: block; margin-bottom: 18px; color: var( --ivy-eyebrow-color, var( --ivy-gold-text, rgb( 138 106 51 ) ) ); font-size: var( --ivy-font-label ); font-weight: 600; line-height: 1.6; letter-spacing: .22em; text-transform: uppercase; }
.ivy-intro--portrait-colle .ivy-intro__title { margin: 0; color: var( --ivy-title-color, var( --ivy-ink, rgb( 58 50 38 ) ) ); line-height: 1.15; }
.ivy-intro--portrait-colle .ivy-intro__caption { margin: 20px 0 0; color: var( --ivy-caption-color, var( --ivy-ink, rgb( 58 50 38 ) ) ); font-family: var( --ivy-font-titre, inherit ); line-height: 1.45; }
.ivy-intro--portrait-colle .ivy-intro__body { margin-top: 40px; padding-top: 40px; border-top: 1px solid var( --ivy-line, rgb( 184 151 90 / 45% ) ); }
.ivy-intro--portrait-colle .ivy-intro__text { color: var( --ivy-text-color, var( --ivy-muted, rgb( 107 98 82 ) ) ); }
.ivy-intro--portrait-colle .ivy-intro__text p { margin: 0; font-size: inherit; }
.ivy-intro--portrait-colle .ivy-intro__text p + p { margin-top: 1.1em; }
.ivy-root.ivy-intro--portrait-colle .ivy-intro__inner .ivy-intro__body .ivy-intro__text > p:first-child { color: var( --ivy-ink, rgb( 58 50 38 ) ); font-family: var( --ivy-font-titre, inherit ); font-size: calc( var( --ivy-font-lead ) * 1.16 ); line-height: 1.5; }
@media ( max-width: 599px ) { .ivy-root.ivy-intro--portrait-colle .ivy-intro__inner .ivy-intro__body .ivy-intro__text > p:first-child { font-size: calc( var( --ivy-font-lead ) * .96 ); } }
.ivy-intro--portrait-colle .ivy-intro__actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 36px; }
:where( .ivy-intro--portrait-colle ) .ivy-intro__cta { color: var( --ivy-cta-color, var( --ivy-on-accent, rgb( 37 29 23 ) ) ); background: var( --ivy-cta-background-color, var( --ivy-accent, rgb( 184 151 90 ) ) ); border: 1px solid var( --ivy-cta-border-color, var( --ivy-accent, rgb( 184 151 90 ) ) ); display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; }
:where( .ivy-intro--portrait-colle ) .ivy-intro__cta--secondary { color: var( --ivy-cta_secondary-color, var( --ivy-ink, rgb( 58 50 38 ) ) ); background: var( --ivy-cta_secondary-background-color, transparent ); border: 1px solid var( --ivy-cta_secondary-border-color, var( --ivy-accent, rgb( 184 151 90 ) ) ); }
@media ( max-width: 899px ) {
	.ivy-intro--portrait-colle .ivy-intro__inner { grid-template-columns: minmax( 0, 1fr ); }
	.ivy-intro--portrait-colle .ivy-intro__media { position: static; max-inline-size: 460px; }
}