/*
 * pricing/onglets — transposition de `.lp-offres`, `.lp-offre` et `.lp-demarrage` (maquette Les Jolies Clés) : fond sombre,
 * titre et onglets à gauche (5fr), détail de l'offre à droite (7fr) avec son taux en très grand, puis « offert au démarrage »
 * sous un filet. Sans JavaScript, les deux offres s'empilent (le runtime pose `hidden` sur les panneaux non choisis).
 * Engagement 5 : aucun hexadécimal, valeurs de repli comprises.
 */
.ivy-pricing--onglets { padding: clamp( 88px, 10vw, 144px ) max( clamp( 20px, 5vw, 64px ), calc( ( 100% - 1240px ) / 2 ) ); color: var( --ivy-on-deep-muted, rgb( 249 246 241 / 78% ) ); }
.ivy-pricing--onglets .ivy-pricing__grid { display: grid; grid-template-columns: 5fr 7fr; gap: clamp( 40px, 7vw, 112px ); align-items: start; }
.ivy-pricing--onglets .ivy-pricing__title { margin: 0; color: var( --ivy-title-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); line-height: 1.2; }
.ivy-pricing--onglets .ivy-pricing__tabs { display: grid; gap: 12px; margin-top: clamp( 28px, 4vw, 48px ); }
.ivy-pricing--onglets .ivy-pricing__tab { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; box-sizing: border-box; min-block-size: 64px; padding: 14px 20px; border: 1px solid var( --ivy-tab-border-color, rgb( 184 151 90 / 50% ) ); border-radius: var( --ivy-radius-action, 4px ); background: var( --ivy-tab-background-color, transparent ); color: var( --ivy-tab-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); font: inherit; text-align: left; cursor: pointer; transition: background-color 200ms cubic-bezier( .2, .7, .2, 1 ), color 200ms cubic-bezier( .2, .7, .2, 1 ), transform 160ms cubic-bezier( .2, .7, .2, 1 ); }
.ivy-pricing--onglets .ivy-pricing__tab:active { transform: scale( .98 ); }
.ivy-pricing--onglets .ivy-pricing__tab-name { font-family: var( --ivy-font-titre, inherit ); font-size: inherit; }
.ivy-pricing--onglets .ivy-pricing__tab-note { color: var( --ivy-tab_note-color, var( --ivy-accent-on-deep, rgb( 184 151 90 ) ) ); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.ivy-pricing--onglets .ivy-pricing__tab[aria-selected="true"] { background: var( --ivy-accent, rgb( 184 151 90 ) ); color: var( --ivy-on-accent, rgb( 37 29 23 ) ); }
.ivy-pricing--onglets .ivy-pricing__tab[aria-selected="true"] .ivy-pricing__tab-note { color: var( --ivy-on-accent, rgb( 37 29 23 ) ); }
@media ( hover: hover ) and ( pointer: fine ) { .ivy-pricing--onglets .ivy-pricing__tab[aria-selected="false"]:hover { background: rgb( 184 151 90 / 16% ); } }
.ivy-pricing--onglets .ivy-pricing__tab:focus-visible,
.ivy-pricing--onglets .ivy-pricing__cta:focus-visible { outline: 2px solid var( --ivy-gold-light, rgb( 230 214 168 ) ); outline-offset: 3px; }
.ivy-pricing--onglets .ivy-pricing__plan[hidden] { display: none; }
.ivy-pricing--onglets .ivy-pricing__plan + .ivy-pricing__plan { margin-top: 56px; }
.ivy-pricing--onglets .ivy-pricing__plan-title { margin: 0; color: var( --ivy-plan_title-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); }
.ivy-pricing--onglets .ivy-pricing__rate { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 16px; margin: 12px 0 0; }
.ivy-pricing--onglets .ivy-pricing__value { font-family: var( --ivy-font-titre, inherit ); line-height: .95; letter-spacing: -.03em; color: var( --ivy-plan_value-color, var( --ivy-accent-on-deep, rgb( 184 151 90 ) ) ); font-variant-numeric: lining-nums; }
.ivy-pricing--onglets .ivy-pricing__unit { color: var( --ivy-plan_unit-color, inherit ); }
.ivy-pricing--onglets .ivy-pricing__lead { max-inline-size: 640px; }
.ivy-pricing--onglets .ivy-pricing__plan-text { max-inline-size: 640px; margin: 24px 0 0; padding-top: 24px; border-top: 1px solid rgb( 184 151 90 / 35% ); color: var( --ivy-plan_text-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); }
.ivy-pricing--onglets .ivy-pricing__groups { display: grid; grid-template-columns: repeat( 2, minmax( 0, 1fr ) ); gap: 28px clamp( 24px, 4vw, 56px ); margin-top: 28px; }
.ivy-pricing--onglets .ivy-pricing__group-heading { margin: 0; color: var( --ivy-plan_group-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); font-weight: 600; line-height: 1.4; }
.ivy-pricing--onglets .ivy-pricing__list { display: grid; gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.ivy-pricing--onglets .ivy-pricing__item,
.ivy-pricing--onglets .ivy-pricing__panel-item { position: relative; padding-left: 20px; line-height: 1.6; }
.ivy-pricing--onglets .ivy-pricing__item { color: var( --ivy-plan_item-color, inherit ); }
.ivy-pricing--onglets .ivy-pricing__panel-item { color: var( --ivy-panel_item-color, inherit ); }
.ivy-pricing--onglets .ivy-pricing__item::before,
.ivy-pricing--onglets .ivy-pricing__panel-item::before { content: ''; position: absolute; left: 2px; top: .68em; inline-size: 5px; block-size: 5px; border-radius: 50%; background: var( --ivy-accent, rgb( 184 151 90 ) ); }
.ivy-pricing--onglets .ivy-pricing__starter { display: grid; grid-template-columns: 4fr 8fr; gap: 24px clamp( 24px, 5vw, 72px ); margin-top: clamp( 48px, 6vw, 88px ); padding-top: clamp( 28px, 3vw, 40px ); border-top: 1px solid rgb( 184 151 90 / 35% ); }
.ivy-pricing--onglets .ivy-pricing__panel-title { margin: 0; color: var( --ivy-panel_title-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); line-height: 1.2; }
.ivy-pricing--onglets .ivy-pricing__panel-label { display: block; margin-top: 8px; color: var( --ivy-panel_label-color, var( --ivy-accent-on-deep, rgb( 184 151 90 ) ) ); font-family: var( --ivy-font-body-family, inherit ); font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.ivy-pricing--onglets .ivy-pricing__starter-list { display: grid; grid-template-columns: repeat( 2, minmax( 0, 1fr ) ); gap: 10px clamp( 24px, 3vw, 40px ); margin: 0; padding: 0; list-style: none; }
:where( .ivy-pricing--onglets ) .ivy-pricing__cta { color: var( --ivy-cta-color, var( --ivy-on-deep, rgb( 251 248 242 ) ) ); background: var( --ivy-cta-background-color, transparent ); border: 1px solid var( --ivy-cta-border-color, var( --ivy-accent, rgb( 184 151 90 ) ) ); grid-column: 2; justify-self: start; display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; transition: background-color 250ms cubic-bezier( .2, .7, .2, 1 ); }
@media ( hover: hover ) and ( pointer: fine ) { :where( .ivy-pricing--onglets ) .ivy-pricing__cta:hover { background: rgb( 184 151 90 / 20% ); } }
@media ( max-width: 899px ) {
	.ivy-pricing--onglets .ivy-pricing__grid,
	.ivy-pricing--onglets .ivy-pricing__starter { grid-template-columns: minmax( 0, 1fr ); }
	.ivy-pricing--onglets .ivy-pricing__groups,
	.ivy-pricing--onglets .ivy-pricing__starter-list { grid-template-columns: minmax( 0, 1fr ); }
	:where( .ivy-pricing--onglets ) .ivy-pricing__cta { grid-column: 1; }
}