/*
 * AddonGain Landing — layout and component layer.
 *
 * Colours, fonts, sizes and spacing live in Elementor (global colours and
 * fonts of the kit, settings of each block): change them there. This file only
 * adds what Elementor (free) cannot do: square buttons with the brand shadow,
 * sticky / overlapping layouts, hover reveals, the video stage, focus styles.
 * Every rule hangs on an `ag-*` class set in Advanced > CSS Classes.
 */

:root {
	--ag-black: var(--e-global-color-agblack, #000);
	--ag-coral: var(--e-global-color-agcoral, #f67b56);
	--ag-violet: var(--e-global-color-agviolet, #c19be9);
	--ag-violet-ink: var(--e-global-color-agvink, #6e3fa3);
	--ag-peach: var(--e-global-color-agpeach, #fdeee7);
	--ag-lavender: var(--e-global-color-aglav, #f5edfb);
	--ag-border: var(--e-global-color-agborder, #ded9e3);
	--ag-border-strong: #b8b0c0;
	--ag-text-2: var(--e-global-color-agtext2, #625d6b);
	--ag-success: #247a4d;
	--ag-success-bg: #e8f6ed;
	--ag-ease: cubic-bezier(.2, .7, .2, 1);
	--ag-header-h: 80px;
	--ag-shadow-soft: 0 30px 60px -32px rgba(64, 30, 14, .35), 0 0 0 1px rgba(0, 0, 0, .05);
}

/* ------------------------------------------------------------------ base */
body.ag-landing-page {
	background: #fff;
	color: var(--ag-black);
	font-family: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
html:has(body.ag-landing-page) {
	scroll-padding-top: calc(var(--ag-header-h) + 16px);
}
@media (prefers-reduced-motion: no-preference) {
	html:has(body.ag-landing-page):not(.lenis) {
		scroll-behavior: smooth;
	}
}
/* Layers that slide in from the side never create a horizontal scroll
   (clip, unlike hidden, keeps the sticky blocks working). */
.ag-main {
	overflow-x: clip;
}
.ag-main ::selection,
.ag-header ::selection {
	background: var(--ag-coral);
	color: #000;
}
.ag-landing-page :focus-visible {
	outline: 3px solid var(--ag-violet-ink) !important;
	outline-offset: 3px !important;
	border-radius: 0;
}
.ag-main p,
.ag-header p,
.ag-footer p {
	margin-block: 0;
}
.ag-main .elementor-widget-text-editor p + p {
	margin-top: .8em;
}
.ag-main .elementor-widget-text-editor a,
.ag-footer .elementor-widget-text-editor a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
.ag-main .elementor-widget-text-editor a:hover {
	text-decoration-thickness: 2px;
}
.ag-main img {
	max-width: 100%;
}

/* Highlighted words: write them between <em> and </em> in a title. */
.ag-main .elementor-heading-title em {
	font-style: normal;
	background-image: linear-gradient(var(--ag-coral), var(--ag-coral));
	background-repeat: no-repeat;
	background-position: 0 88%;
	background-size: 100% .32em;
	padding: 0 .06em;
	margin: 0 -.06em;
	transition: background-size .9s var(--ag-ease);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}
.ag-main .elementor-heading-title em.ag-draw {
	background-size: 0% .32em;
}

/* Eyebrow: short coral bar before the label. */
.ag-eyebrow .elementor-heading-title {
	display: inline-flex;
	align-items: center;
	gap: 12px;
}
.ag-eyebrow .elementor-heading-title::before {
	content: "";
	flex: none;
	width: 28px;
	height: 3px;
	background: var(--ag-coral);
}
.ag-intro {
	max-width: 820px;
}
.ag-intro--center {
	margin-inline: auto;
	text-align: center;
}

/* --------------------------------------------------------------- buttons */
.ag-btn .elementor-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	border-radius: 0;
	text-align: center;
	transition: transform .18s var(--ag-ease), box-shadow .18s var(--ag-ease);
}
.ag-btn--small .elementor-button {
	min-height: 44px;
}
.ag-btn--primary .elementor-button {
	box-shadow: 3px 3px 0 var(--ag-black);
}
.ag-btn--primary .elementor-button:hover {
	transform: translate(-1px, -1px);
	box-shadow: 4px 4px 0 var(--ag-black);
}
.ag-btn--secondary .elementor-button:hover {
	transform: translate(-1px, -1px);
	box-shadow: 3px 3px 0 var(--ag-black);
}
.ag-btn .elementor-button:active {
	transform: translate(1px, 1px);
	box-shadow: 1px 1px 0 var(--ag-black);
}
.ag-btn--block,
.ag-btn--block .elementor-button {
	width: 100%;
}
@media (max-width: 767px) {
	.ag-hero-ctas .ag-btn,
	.ag-hero-ctas .ag-btn .elementor-button,
	.ag-guarantee .ag-btn .elementor-button,
	.ag-final .ag-btn .elementor-button {
		width: 100%;
	}
}

/* ---------------------------------------------------------------- header */
.ag-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 90;
	background: var(--ag-peach);
	transition: background-color .3s, box-shadow .3s;
}
.ag-header.is-scrolled {
	background: rgba(255, 255, 255, .94);
	-webkit-backdrop-filter: saturate(1.4) blur(12px);
	backdrop-filter: saturate(1.4) blur(12px);
	box-shadow: 0 1px 0 var(--ag-border);
}
.ag-header .ag-logo img {
	display: block;
	height: auto;
}
.ag-header .ag-logo a {
	display: flex;
	align-items: center;
	min-height: 44px;
}
.ag-nav {
	flex: 1 1 auto;
}
.ag-nav .elementor-icon-list-items {
	justify-content: center;
}
.ag-nav .elementor-icon-list-item a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	position: relative;
	color: var(--ag-black);
}
.ag-nav .elementor-icon-list-item a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 8px;
	height: 2px;
	background: var(--ag-coral);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s var(--ag-ease);
}
.ag-nav .elementor-icon-list-item a:hover::after,
.ag-nav .elementor-icon-list-item a:focus-visible::after {
	transform: scaleX(1);
}
.ag-header-actions {
	width: auto !important;
	flex: none;
}
@media (max-width: 1024px) {
	.ag-header > .e-con-inner {
		position: relative;
		flex-wrap: nowrap;
	}
	.ag-header .ag-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		padding: 8px 24px 20px;
		background: #fff;
		box-shadow: 0 1px 0 var(--ag-border), 0 24px 40px -24px rgba(0, 0, 0, .25);
	}
	.ag-header.is-open .ag-nav {
		display: block;
	}
	.ag-header.is-open {
		background: #fff;
	}
	.ag-header .ag-nav .elementor-icon-list-items {
		flex-direction: column;
		align-items: stretch;
	}
	.ag-header .ag-nav .elementor-icon-list-item {
		margin: 0 !important;
		padding: 0 !important;
		border-bottom: 1px solid var(--ag-border);
	}
	.ag-header .ag-nav .elementor-icon-list-item a {
		width: 100%;
		min-height: 52px;
		font-size: 17px;
	}
	.ag-header .ag-nav .elementor-icon-list-item a::after {
		display: none;
	}
}
@media (max-width: 479px) {
	/* Logo + Menu only on small phones: the CTA lives in the hero. */
	.ag-header-actions .ag-btn:not(.ag-menu-toggle) {
		display: none;
	}
}

/* ------------------------------------------------------- stage + thread */
.ag-stage {
	position: relative;
	isolation: isolate;
}
.ag-stage-photo img,
.ag-pair-photo img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
}
/* Hero + final: a tall photo card; the basket stays left, the belt has room. */
.ag-hero-stage .ag-stage-photo img,
.ag-final-stage .ag-stage-photo img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: 22% 50%;
	box-shadow: 0 40px 80px -48px rgba(96, 46, 20, .55);
}
@media (max-width: 1024px) {
	.ag-hero-stage .ag-stage-photo img,
	.ag-final-stage .ag-stage-photo img {
		aspect-ratio: 4 / 3;
	}
}
/* The belt: a separate transparent layer placed over the photo. */
.ag-stage > .ag-thread {
	position: absolute !important;
	z-index: 2;
	margin: 0 !important;
	pointer-events: none;
	--ag-rot: -8deg;
	left: 63%;
	top: 50%;
	width: 30% !important;
	max-width: none !important;
}
.ag-stage > .ag-thread--inbasket {
	--ag-rot: 14deg;
	left: 15%;
	top: 33%;
	width: 30% !important;
}
.ag-pair--lead > .ag-thread {
	left: 64%;
	top: 34%;
	width: 26% !important;
}
.ag-thread img {
	display: block;
	width: 100%;
	height: auto;
	transform: rotate(var(--ag-rot, 0deg));
	filter: drop-shadow(10px 16px 14px rgba(96, 46, 20, .26));
}
.ag-thread-label {
	display: none !important;
}

/* Annotation chips on the photos. */
.ag-stage > .ag-chip {
	position: absolute !important;
	z-index: 3;
	margin: 0 !important;
	width: auto !important;
	left: auto;
	right: 3%;
	top: 12%;
}
.ag-chip .elementor-heading-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: #fff;
	border: 1px solid var(--ag-black);
	border-radius: 4px;
	box-shadow: 3px 3px 0 var(--ag-black);
	white-space: nowrap;
}
.ag-chip--hero .elementor-heading-title::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	border: 2px solid var(--ag-black);
}
.ag-stage > .ag-chip--final {
	left: 6%;
	top: 8%;
}
.ag-chip--final .elementor-heading-title {
	background: var(--ag-success-bg);
}
.ag-chip--final .elementor-heading-title::before {
	content: "✓";
	color: var(--ag-success);
	font-weight: 700;
}
@media (max-width: 767px) {
	.ag-stage > .ag-chip {
		left: 4%;
		top: 4%;
	}
	.ag-chip .elementor-heading-title {
		font-size: 13px;
		padding: 6px 10px;
	}
}

/* Floating companion of the belt (created by landing.js, large screens). */
/* Collapsed = the belt thumbnail only, in the page margin; the status label
   unfolds for a moment each time the story moves on. */
.ag-companion {
	position: fixed;
	left: 12px;
	bottom: 16px;
	z-index: 80;
	display: flex;
	align-items: center;
	padding: 5px;
	background: #fff;
	border: 1px solid var(--ag-black);
	border-radius: 8px;
	box-shadow: 3px 3px 0 var(--ag-black);
	font: 600 14px/1.3 'Hanken Grotesk', system-ui, sans-serif;
	color: var(--ag-black);
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .35s var(--ag-ease), transform .35s var(--ag-ease);
	pointer-events: none;
}
.ag-companion.is-visible {
	opacity: 1;
	transform: none;
}
.ag-companion-thumb {
	flex: none;
	width: 40px;
	height: 40px;
	border-radius: 6px;
	background: var(--ag-peach);
}
.ag-companion {
	display: grid;
	grid-template-columns: 40px 0fr;
	transition: opacity .35s var(--ag-ease), transform .35s var(--ag-ease), grid-template-columns .45s var(--ag-ease);
}
.ag-companion.is-expanded {
	grid-template-columns: 40px 1fr;
}
.ag-companion-text {
	min-width: 0;
	overflow: hidden;
	white-space: nowrap;
	opacity: 0;
	transition: opacity .3s var(--ag-ease);
}
.ag-companion.is-expanded .ag-companion-text {
	opacity: 1;
}
.ag-companion-text > * {
	display: block;
	padding: 0 10px 0 12px;
}
.ag-companion-text small {
	display: block;
	font-weight: 500;
	font-size: 12px;
	color: var(--ag-text-2);
}
.ag-thread-fly {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 81;
	pointer-events: none;
	will-change: transform, width;
	filter: drop-shadow(10px 16px 14px rgba(96, 46, 20, .26));
	display: none;
}

/* ------------------------------------------------------------------ hero */
.ag-hero-title .elementor-heading-title {
	text-wrap: balance;
}
.ag-hero-lead {
	max-width: 560px;
}
.ag-proofs .elementor-icon-list-items {
	row-gap: 6px;
}
.ag-proofs .elementor-icon-list-icon svg {
	width: 14px;
	height: 14px;
}
.ag-compat {
	border-bottom: 1px solid var(--ag-border);
}
.ag-compat-list p {
	color: var(--ag-text-2);
	letter-spacing: .01em;
}

/* --------------------------------------------- video scrollytelling (2) */
/* Default = simple stacked layout: phones, reduced motion, editor, no JS. */
.ag-video-pin {
	color: #fff;
	overflow: hidden;
}
.ag-video-pin > .ag-video {
	width: 100%;
	margin: 0 !important;
}
.ag-video .elementor-wrapper {
	aspect-ratio: 16 / 9;
	--video-aspect-ratio: 1.77777;
	background: #000;
}
.ag-video video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.ag-video-captions {
	padding: 24px 16px 8px;
}
.ag-caption {
	padding: 20px 22px;
	background: #fff;
	color: var(--ag-black);
	border-radius: 8px;
}
.ag-caption-time .elementor-heading-title {
	text-transform: none;
}
.ag-notif {
	margin: 8px 16px 32px !important;
	width: auto !important;
	padding: 14px 18px 14px 14px;
	background: #fff;
	color: var(--ag-black);
	border-radius: 8px;
}
.ag-notif-icon {
	flex: none;
	width: 40px !important;
}
.ag-notif-icon img {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 8px;
	background: var(--ag-peach);
	padding: 6px;
	box-sizing: border-box;
	object-fit: contain;
}
.ag-notif-title .elementor-heading-title {
	font-weight: 700;
}
@media (min-width: 768px) {
	.ag-video-captions {
		padding: 40px 40px 8px;
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.ag-notif {
		margin: 16px 40px 48px !important;
		max-width: 460px;
	}
}
/* Enhanced = pinned full-screen stage, driven by the scroll (landing.js). */
.ag-video-pin.is-staged {
	/* Pinned just below the sticky header (see landing.js): no box is ever hidden behind it. */
	height: calc(100vh - var(--ag-header-h));
	height: calc(100svh - var(--ag-header-h));
	min-height: 480px;
	display: block !important;
	position: relative;
}
.ag-video-pin.is-staged > .ag-video {
	position: absolute !important;
	inset: 0;
	height: 100%;
}
.ag-video-pin.is-staged .elementor-wrapper {
	aspect-ratio: auto;
	height: 100%;
}
.ag-video-pin.is-staged .ag-video-captions {
	position: absolute !important;
	left: max(40px, calc((100vw - 1200px) / 2));
	bottom: clamp(56px, 9vh, 110px);
	width: min(520px, 42vw) !important;
	padding: 0;
	display: grid !important;
	grid-template-columns: 1fr;
}
.ag-video-pin.is-staged .ag-caption {
	grid-area: 1 / 1;
	align-self: end;
	opacity: 0;
	visibility: hidden;
	transform: translateY(24px);
	box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .55);
}
.ag-video-pin.is-staged .ag-notif {
	position: absolute !important;
	right: max(40px, calc((100vw - 1200px) / 2));
	top: clamp(24px, 5vh, 56px);
	margin: 0 !important;
	width: min(380px, 36vw) !important;
	opacity: 0;
	visibility: hidden;
	box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .5);
}
.ag-video-progress {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: rgba(255, 255, 255, .18);
	z-index: 4;
}
.ag-video-progress span {
	display: block;
	height: 100%;
	width: 100%;
	background: var(--ag-coral);
	transform-origin: left;
	transform: scaleX(0);
}

/* -------------------------------------------- 3. ce qui t'échappe */
.ag-pair-caption .elementor-heading-title {
	display: flex;
	align-items: center;
	gap: 10px;
}
.ag-pair-caption .elementor-heading-title::before {
	content: "";
	width: 18px;
	height: 2px;
	background: var(--ag-black);
}
.ag-pair-stack .ag-pair {
	flex: 1 1 0;
}
.ag-situations {
	border-top: 1px solid var(--ag-black);
}
.ag-situation {
	padding: 36px 0;
	border-bottom: 1px solid var(--ag-border);
}
.ag-situation-num {
	flex: none;
	width: 128px !important;
}
.ag-situation-num .elementor-heading-title {
	font-size: clamp(44px, 5vw, 64px) !important;
	color: transparent !important;
	-webkit-text-stroke: 1.5px var(--ag-black);
}
.ag-situation-copy {
	max-width: 760px;
}
.ag-situation-punch p {
	display: flex;
	gap: 12px;
	font-weight: 600;
}
.ag-situation-punch p::before {
	content: "";
	flex: none;
	width: 3px;
	background: var(--ag-coral);
}
.ag-calc-line > .ag-counter {
	flex: 1 1 0;
	text-align: center;
}
.ag-calc .elementor-counter {
	align-items: center;
}
.ag-calc .elementor-counter-number-wrapper {
	justify-content: center;
	font-variant-numeric: tabular-nums;
}
.ag-calc .elementor-counter-title {
	text-align: center;
}
.ag-calc-op {
	flex: none;
	width: auto !important;
}
.ag-calc-op .elementor-heading-title {
	color: var(--ag-text-2);
	font-weight: 400 !important;
}
.ag-counter--result .elementor-counter-number-wrapper {
	background: linear-gradient(var(--ag-coral), var(--ag-coral)) no-repeat 50% 92% / 100% .22em;
}
.ag-calc-note {
	max-width: 680px;
	margin-inline: auto;
}
@media (max-width: 767px) {
	.ag-situation-num {
		width: auto !important;
	}
	.ag-calc-op .elementor-heading-title {
		font-size: 36px !important;
	}
}

/* ------------------------------------------------ 4. comment ça marche */
.ag-step {
	padding: 40px 0;
	border-top: 1px solid var(--ag-border);
}
.ag-step-copy {
	flex: 1 1 0;
}
.ag-step-media {
	flex: 1 1 0;
}
.ag-step-media img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: var(--ag-shadow-soft);
	background: #fff;
}
.ag-step-caption p {
	display: inline-block;
	padding: 6px 10px;
	background: var(--ag-peach);
	border-radius: 4px;
}
.ag-disclaimer p {
	font-size: 13px;
}
/* Enhanced (landing.js, ≥ 1025 px): steps scroll on the left, the screen of
   the active step stays visible on the right and changes with the step. */
@media (min-width: 1025px) {
	.ag-steps.is-staged {
		display: grid !important;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		column-gap: 72px;
		position: relative;
	}
	.ag-steps.is-staged > .ag-step {
		display: contents !important;
	}
	.ag-steps.is-staged .ag-step-copy {
		grid-column: 1;
		min-height: 78vh;
		justify-content: center;
		padding: 6vh 0 6vh 28px;
		position: relative;
	}
	/* Inactive steps are toned down with the secondary text colour (still
	   AA-readable), never with a transparency that would break the contrast. */
	.ag-steps.is-staged .ag-step-copy:not(.is-active) .elementor-heading-title {
		color: var(--ag-text-2) !important;
		transition: color .4s var(--ag-ease);
	}
	.ag-steps.is-staged .ag-step-copy:not(.is-active) .ag-step-caption p {
		background: transparent;
		color: var(--ag-text-2);
	}
	.ag-steps.is-staged .ag-step-copy::before {
		content: "";
		position: absolute;
		left: 0;
		top: 6vh;
		bottom: 6vh;
		width: 2px;
		background: var(--ag-border);
	}
	.ag-steps.is-staged .ag-step-copy.is-active::before {
		background: var(--ag-coral);
		width: 3px;
	}
	/* Rows of each step are set by landing.js (works with any number of steps). */
	.ag-steps.is-staged .ag-step-media {
		grid-column: 2;
		align-self: start;
		position: sticky;
		top: calc(var(--ag-header-h) + 6vh);
		height: calc(100vh - var(--ag-header-h) - 12vh);
		display: flex !important;
		align-items: center;
		justify-content: center;
		opacity: 0;
		transform: translateY(28px) scale(.98);
		transition: opacity .6s var(--ag-ease), transform .7s var(--ag-ease);
	}
	.ag-steps.is-staged .ag-step-media.is-active {
		opacity: 1;
		transform: none;
	}
	.ag-steps.is-staged .ag-step-media img {
		width: auto;
		max-width: 100%;
		max-height: 100%;
		object-fit: contain;
	}
}
.ag-demo-video .elementor-wrapper {
	border-radius: 8px;
	overflow: hidden;
	box-shadow: var(--ag-shadow-soft);
}
@media (max-width: 1024px) {
	.ag-demo-video {
		width: 100% !important;
	}
}
/* Cover shown whole, with a play button in the brand style (coral disc
   ringed in black, like the "+" of the cover). It sits under the cover's
   headline, aligned on its left edge, so it never hides the words. */
.ag-demo-video .elementor-custom-embed-play {
	inset-block-start: 69%;
	inset-inline-start: 6.8%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(36px, 8.5%); /* the whole cover is the touch target */
	aspect-ratio: 1;
	border: 2px solid var(--ag-black);
	border-radius: 50%;
	background: var(--ag-coral);
	box-shadow: 3px 3px 0 var(--ag-black);
	transition: transform .2s var(--ag-ease), box-shadow .2s var(--ag-ease);
}
.ag-demo-video .elementor-custom-embed-play svg {
	display: none;
}
.ag-demo-video .elementor-custom-embed-play::before {
	content: "";
	width: 34%;
	height: 40%;
	margin-inline-start: 8%;
	background: var(--ag-black);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.ag-demo-video .elementor-custom-embed-image-overlay:hover .elementor-custom-embed-play,
.ag-demo-video .elementor-custom-embed-play:focus-visible {
	transform: translate(-1px, calc(-50% - 1px));
	box-shadow: 4px 4px 0 var(--ag-black);
}
.ag-demo-video .elementor-custom-embed-play:focus-visible {
	outline: 3px solid var(--ag-violet-ink) !important;
	outline-offset: 3px !important;
	border-radius: 50%;
}

/* -------------------------------------------- 5. email qui s'assemble */
.ag-mail {
	box-shadow: 0 50px 90px -48px rgba(70, 30, 90, .45), 0 0 0 1px rgba(0, 0, 0, .02);
	transform-style: preserve-3d;
}
.ag-mail-head {
	border-bottom: 1px solid var(--ag-border);
}
.ag-mail-head .elementor-heading-title {
	text-transform: none;
}
.ag-mail-logo img {
	display: block;
	margin: 0 auto;
	height: auto;
}
.ag-mail-product {
	margin: 0 28px 20px !important;
	width: auto !important;
}
.ag-mail-foot {
	border-top: 1px solid #e5e5e2;
	margin: 0 28px !important;
	width: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.ag-mail-text .elementor-heading-title u {
	text-underline-offset: 3px;
}
.ag-btn--shop .elementor-button {
	min-height: 46px;
}
.ag-btn--shop .elementor-button:hover,
.ag-btn--shop .elementor-button:active {
	transform: none;
	box-shadow: none;
}
.ag-mail-product > .ag-thread {
	flex: none;
	width: 168px !important;
	padding: 14px;
	background: #fff;
	border-radius: 8px;
	--ag-rot: -6deg;
}
.ag-mail-product-copy {
	flex: 1 1 auto;
}
.ag-mail-coupon {
	margin: 0 28px 20px !important;
	width: auto !important;
}
.ag-mail-coupon > .elementor-widget {
	width: auto !important;
}
.ag-mail-code .elementor-heading-title {
	display: inline-block;
	padding: 10px 18px;
	background: #fff;
	border: 1px solid #b6cbc1;
	border-radius: 6px;
	letter-spacing: .06em;
	font-family: Arial, Helvetica, sans-serif !important;
	font-size: 19px !important;
	font-weight: 700 !important;
}
.ag-mail-points {
	margin: 0 28px 28px !important;
	width: auto !important;
	background: var(--ag-lavender);
	border: 1px solid var(--ag-violet);
	border-radius: 8px;
}
.ag-mail-points-icon {
	flex: none;
	width: auto !important;
}
.ag-mail-points-icon .elementor-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--ag-violet);
}
@media (max-width: 767px) {
	.ag-mail-coupon,
	.ag-mail-points {
		margin-inline: 16px !important;
	}
	.ag-mail-product > .ag-thread {
		width: 140px !important;
	}
}

/* ------------------------------------------------------- 6. comparatif */
.ag-cmp {
	border-top: 2px solid var(--ag-black);
}
.ag-cmp-row {
	display: grid !important;
	grid-template-columns: minmax(220px, 1.6fr) repeat(4, minmax(118px, 1fr));
	align-items: stretch;
	border-bottom: 1px solid var(--ag-border);
	transition: background-color .25s;
	position: relative;
	cursor: default;
}
.ag-cmp-row > .elementor-element {
	width: auto !important;
	margin: 0 !important;
	padding: 18px 16px;
	display: flex;
	align-items: center;
}
.ag-cmp-row--head > .elementor-element {
	padding-block: 14px;
}
.ag-cmp-row--head .elementor-heading-title {
	font-weight: 700;
}
.ag-cmp-th--ag .elementor-heading-title {
	font-size: 16px;
}
.ag-cmp-th--ag,
.ag-cmp-cell--ag {
	background: var(--ag-peach);
}
.ag-cmp-cell .elementor-icon-list-items {
	width: 100%;
}
.ag-cmp-cell .elementor-icon-list-item {
	align-items: center;
}
.ag-cmp-cell .elementor-icon-list-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	border: 1px solid var(--ag-black);
	flex: none;
}
.ag-cmp-cell .elementor-icon-list-icon {
	padding: 0 !important;
	margin: 0 !important;
	position: static !important;
	top: auto !important;
}
.ag-cmp-cell .elementor-icon-list-icon svg {
	display: block;
	width: 12px !important;
	height: 12px !important;
	margin: 0 !important;
	position: static !important;
	top: auto !important;
}
.ag-cmp-cell--ag .elementor-icon-list-icon {
	background: var(--ag-coral);
}
.ag-cmp-cell .elementor-icon-list-text {
	color: var(--ag-black);
}
.ag-cmp-row:not(.ag-cmp-row--head):hover,
.ag-cmp-row:not(.ag-cmp-row--head):focus-within,
.ag-cmp-row.is-open {
	background: #faf9fb;
}
.ag-cmp-row:not(.ag-cmp-row--head):hover .ag-cmp-cell--ag,
.ag-cmp-row:focus-within .ag-cmp-cell--ag,
.ag-cmp-row.is-open .ag-cmp-cell--ag {
	background: #fbe4d9;
}
.ag-cmp-label .elementor-heading-title {
	display: flex;
	align-items: center;
	gap: 10px;
}
.ag-cmp-row:not(.ag-cmp-row--head) .ag-cmp-label .elementor-heading-title::after {
	content: "+";
	margin-left: auto;
	font-weight: 400;
	color: var(--ag-text-2);
	transition: transform .3s var(--ag-ease);
}
.ag-cmp-row:hover .ag-cmp-label .elementor-heading-title::after,
.ag-cmp-row:focus-within .ag-cmp-label .elementor-heading-title::after,
.ag-cmp-row.is-open .ag-cmp-label .elementor-heading-title::after {
	transform: rotate(45deg);
}
.ag-cmp-row > .ag-cmp-detail {
	grid-column: 1 / -1;
	display: grid !important;
	grid-template-rows: 0fr;
	opacity: 0;
	padding: 0 !important;
	transition: grid-template-rows .4s var(--ag-ease), opacity .3s;
}
.ag-cmp-row > .ag-cmp-detail > * {
	min-height: 0;
	overflow: hidden;
}
.ag-cmp-row:hover > .ag-cmp-detail,
.ag-cmp-row:focus-within > .ag-cmp-detail,
.ag-cmp-row.is-open > .ag-cmp-detail {
	grid-template-rows: 1fr;
	opacity: 1;
}
.ag-cmp-detail p {
	max-width: 720px;
	padding: 0 16px;
}
/* Bottom space inside the clipped box, so the closed row is exactly 0 px tall. */
.ag-cmp-detail p::after {
	content: "";
	display: block;
	height: 20px;
}
.ag-cmp-row[tabindex]:focus-visible {
	outline-offset: -3px !important;
}
@media (max-width: 1024px) {
	.ag-cmp {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x proximity;
	}
	.ag-cmp-row {
		min-width: 760px;
		grid-template-columns: 200px repeat(4, minmax(130px, 1fr));
	}
	.ag-cmp-row > .ag-cmp-label,
	.ag-cmp-row > .elementor-element:first-child {
		position: sticky;
		left: 0;
		z-index: 1;
		background: #fff;
		box-shadow: 1px 0 0 var(--ag-border);
	}
	.ag-cmp-row > .ag-cmp-detail {
		position: sticky;
		left: 0;
		max-width: calc(100vw - 32px);
		background: transparent;
		box-shadow: none;
	}
}

/* ---------------------------------------------------------- 7. tarifs */
.ag-cover-chip .elementor-heading-title {
	display: inline-block;
	padding: 8px 14px;
	background: #fff;
	border: 1px solid var(--ag-black);
	border-radius: 4px;
}
.ag-cover-chip--total .elementor-heading-title {
	background: var(--ag-coral);
	box-shadow: 3px 3px 0 var(--ag-black);
}
.ag-cover-chip,
.ag-cover-op {
	width: auto !important;
}
.ag-plans {
	max-width: 960px;
	margin-inline: auto;
	width: 100%;
}
.ag-plan {
	position: relative;
	transition: transform .35s var(--ag-ease), box-shadow .35s var(--ag-ease);
}
.ag-plan:hover {
	transform: translateY(-4px);
	box-shadow: 0 30px 60px -36px rgba(64, 30, 14, .45);
}
.ag-plan--best {
	box-shadow: 6px 6px 0 var(--ag-black);
}
.ag-plan--best:hover {
	box-shadow: 8px 8px 0 var(--ag-black);
}
.ag-plan > .ag-badge {
	position: absolute !important;
	top: -16px;
	left: 32px;
	width: auto !important;
	margin: 0 !important;
}
.ag-badge .elementor-heading-title {
	display: inline-block;
	padding: 6px 12px;
	background: var(--ag-coral);
	border: 1px solid var(--ag-black);
	border-radius: 4px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: 12px;
}
.ag-price .elementor-heading-title {
	font-variant-numeric: tabular-nums;
}
.ag-price-line > .elementor-widget {
	width: auto !important;
}
.ag-plan-features .elementor-icon-list-icon svg {
	width: 14px;
	height: 14px;
}
.ag-plan > .ag-btn {
	margin-top: auto !important;
}

/* -------------------------------------------- 8. garantie, pour qui, faq */
.e-con.ag-seal {
	flex: none !important;
	width: 232px !important;
	height: 232px !important;
	border-radius: 50% !important;
	background: var(--ag-coral);
	border: 2px solid var(--ag-black);
	box-shadow: 6px 6px 0 var(--ag-black);
	position: relative;
}
.ag-seal::after {
	content: "";
	position: absolute;
	inset: 12px;
	border-radius: 50%;
	border: 1px dashed rgba(0, 0, 0, .55);
}
.ag-seal-num,
.ag-seal-unit {
	width: auto !important;
	text-align: center;
}
.ag-seal-num .elementor-heading-title {
	font-size: 104px !important;
	line-height: .9 !important;
}
@media (max-width: 767px) {
	.e-con.ag-seal {
		width: 168px !important;
		height: 168px !important;
	}
	.ag-seal-num .elementor-heading-title {
		font-size: 72px !important;
	}
}
.ag-fit--no .elementor-icon-list-text {
	color: var(--ag-text-2);
}
.ag-fit-list .elementor-icon-list-item {
	align-items: flex-start !important;
}
.ag-fit-list .elementor-icon-list-icon {
	padding-top: .35em;
}
.ag-fit-list .elementor-icon-list-icon svg {
	width: 14px;
	height: 14px;
}
@media (min-width: 1025px) {
	.ag-faq-head {
		position: sticky;
		top: calc(var(--ag-header-h) + 32px);
		align-self: flex-start;
	}
}
.ag-faq-list .e-n-accordion-item {
	border: 0;
	border-bottom: 1px solid var(--ag-border);
	margin: 0 !important;
}
.ag-faq-list .e-n-accordion-item:first-child {
	border-top: 1px solid var(--ag-black);
}
.ag-faq-list .e-n-accordion-item-title {
	padding: 22px 0 !important;
	border: 0 !important;
	background: transparent !important;
	min-height: 44px;
	gap: 24px;
	justify-content: space-between;
}
.ag-faq-list .e-n-accordion-item-title-text {
	margin: 0;
	font-size: inherit;
}
/* Open / close icon: a perfect 44 px circle (never stretched by the flex row)
   with the + and − drawn in CSS, so both states keep the same size, centre and
   stroke. The widget's own icons stay set in Elementor (they make the icon
   area appear) and are only hidden here. */
.ag-faq-list .e-n-accordion-item-title-header {
	flex: 1 1 auto;
	min-width: 0;
}
.ag-faq-list .e-n-accordion-item-title-icon {
	position: relative;
	display: block !important;
	flex: 0 0 44px !important;
	width: 44px !important;
	height: 44px !important;
	min-width: 44px;
	min-height: 44px;
	aspect-ratio: 1 / 1;
	box-sizing: border-box;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--ag-black);
	border-radius: 50%;
	background: #fff;
	transition: background-color .25s;
}
.ag-faq-list .e-n-accordion-item-title-icon > span {
	display: none !important;
}
.ag-faq-list .e-n-accordion-item-title-icon::before,
.ag-faq-list .e-n-accordion-item-title-icon::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 14px;
	height: 2px;
	margin: -1px 0 0 -7px;
	background: var(--ag-black);
	border-radius: 1px;
	transition: transform .25s var(--ag-ease), opacity .2s;
}
.ag-faq-list .e-n-accordion-item-title-icon::after {
	transform: rotate(90deg);
}
.ag-faq-list .e-n-accordion-item[open] .e-n-accordion-item-title-icon {
	background: var(--ag-coral);
}
.ag-faq-list .e-n-accordion-item[open] .e-n-accordion-item-title-icon::after {
	transform: rotate(0deg);
	opacity: 0;
}
.ag-faq-list .e-n-accordion-item > .e-con,
.ag-faq-answer {
	border: 0 !important;
	padding: 0 68px 22px 0 !important;
	background: transparent !important;
}

/* ---------------------------------------------------------------- footer */
.ag-footer a {
	color: #fff;
}
.ag-footer .ag-logo--footer img {
	display: block;
	height: auto;
}
.ag-footer-links .elementor-icon-list-items {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, auto));
	column-gap: 40px;
	row-gap: 4px;
}
.ag-footer-links .elementor-icon-list-item {
	margin: 0 !important;
	padding: 0 !important;
}
.ag-footer-links .elementor-icon-list-item a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}
.ag-footer-links .elementor-icon-list-item a:hover .elementor-icon-list-text {
	text-decoration: underline;
	text-underline-offset: 4px;
}
.ag-footer-legal {
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .2);
}
.ag-footer-legal p {
	opacity: .8;
}
.ag-footer :focus-visible {
	outline-color: #fff !important;
}
@media (max-width: 767px) {
	.ag-footer-links .elementor-icon-list-items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ------------------------------------- light layer (phones / tablets) */
.ag-lite .ag-lite-rv {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .7s var(--ag-ease), transform .7s var(--ag-ease);
}
.ag-lite .ag-lite-rv.is-in {
	opacity: 1;
	transform: none;
}

/* =================================================== Devenir affilié */
.ag-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	margin: 0 !important;
}

/* ---- hero visual: one link, then regular payments ---- */
.ag-aff-visual {
	box-shadow: 6px 6px 0 var(--ag-black);
}
.ag-aff-visual-step {
	position: relative;
	padding: 9px 0;
}
.ag-aff-visual-step + .ag-aff-visual-step::before {
	content: "";
	position: absolute;
	left: 17px;
	top: -9px;
	width: 2px;
	height: 18px;
	background: var(--ag-border-strong);
}
.ag-aff-visual-num {
	flex: none;
	width: auto !important;
}
.ag-aff-visual-num .elementor-heading-title {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--ag-black);
	border-radius: 50%;
	background: #fff;
	font-variant-numeric: tabular-nums;
}
.ag-aff-payments {
	margin-top: 14px !important;
	padding-top: 18px !important;
	border-top: 1px solid var(--ag-border);
}
.ag-aff-payment {
	background: var(--ag-peach);
	border-radius: 8px;
}
.ag-aff-payment-month {
	flex: 1 1 auto;
}
.ag-aff-payment-amount {
	flex: none;
	width: auto !important;
}
.ag-aff-payment-amount .elementor-heading-title {
	display: inline-block;
	padding: 4px 10px;
	background: var(--ag-coral);
	border: 1px solid var(--ag-black);
	border-radius: 4px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.ag-aff-visual-note {
	margin-top: 14px !important;
}
@keyframes agPop {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}
.ag-pop {
	animation: agPop .5s var(--ag-ease) both;
}

/* ---- discreet action bar ---- */
.ag-actionbar .ag-actionbar-text {
	flex: 1 1 auto;
}
.ag-actionbar .ag-btn {
	flex: none;
	width: auto !important;
}
.ag-actionbar.is-bar {
	position: fixed !important;
	left: 50%;
	bottom: 16px;
	z-index: 85;
	width: min(720px, calc(100% - 32px)) !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 8px 8px 8px 20px !important;
	background: #fff;
	border: 1px solid var(--ag-black);
	border-radius: 8px;
	box-shadow: 3px 3px 0 var(--ag-black);
	transform: translate(-50%, calc(100% + 40px));
	visibility: hidden;
	transition: transform .35s var(--ag-ease), visibility 0s linear .35s;
}
.ag-actionbar.is-bar.is-visible {
	transform: translate(-50%, 0);
	visibility: visible;
	transition: transform .35s var(--ag-ease), visibility 0s;
}
.ag-actionbar-close {
	position: relative;
	flex: none;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
}
.ag-actionbar-close::before,
.ag-actionbar-close::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 16px;
	height: 2px;
	margin: -1px 0 0 -8px;
	background: var(--ag-black);
	transform: rotate(45deg);
}
.ag-actionbar-close::after {
	transform: rotate(-45deg);
}
.ag-actionbar-close:hover {
	background: var(--ag-peach);
}
@media (max-width: 600px) {
	.ag-actionbar.is-bar {
		bottom: 8px;
		width: calc(100% - 16px) !important;
		padding: 8px !important;
	}
	.ag-actionbar.is-bar .ag-actionbar-text {
		display: none;
	}
	.ag-actionbar.is-bar .ag-btn {
		flex: 1 1 auto;
	}
	.ag-actionbar.is-bar .ag-btn .elementor-button {
		width: 100%;
	}
}

/* ---- earnings calculator (built by landing.js) ---- */
.ag-calc-widget {
	width: 100% !important;
	max-width: 1040px;
}
.ag-calc-static {
	padding: 32px 24px;
	text-align: center;
	background: #fff;
	border: 1px solid var(--ag-black);
	border-radius: 8px;
}
.ag-calc-static p {
	margin: 0 0 8px;
	color: var(--ag-text-2);
}
.ag-calc-static .ag-est-static-amount {
	font-size: 22px;
	color: var(--ag-black);
}
.ag-calc-static .ag-est-static-amount span {
	font-size: 56px;
	font-weight: 700;
	letter-spacing: -.03em;
	background: linear-gradient(var(--ag-coral), var(--ag-coral)) no-repeat 0 90% / 100% .28em;
}
.ag-est {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	grid-template-areas: "controls result" "controls year";
	gap: 28px 56px;
	padding: 40px;
	background: #fff;
	border: 1px solid var(--ag-black);
	border-radius: 8px;
	box-shadow: 6px 6px 0 var(--ag-black);
	color: var(--ag-black);
	font-family: 'Hanken Grotesk', system-ui, sans-serif;
}
.ag-est p {
	margin: 0;
}
.ag-est-result { grid-area: result; }
.ag-est-controls { grid-area: controls; align-self: center; }
.ag-est-year { grid-area: year; }
.ag-est-amount {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 12px;
	font-size: clamp(56px, 6.4vw, 84px);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.03em;
	font-variant-numeric: tabular-nums;
}
.ag-est-num {
	padding: 0 .04em;
	background: linear-gradient(var(--ag-coral), var(--ag-coral)) no-repeat 0 88% / 100% .26em;
}
.ag-est-per {
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--ag-text-2);
}
.ag-est-sub {
	margin-top: 12px !important;
	font-size: 17px;
	color: var(--ag-text-2);
}
.ag-est-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 10px;
}
.ag-est-label {
	font-size: 17px;
	font-weight: 600;
}
.ag-est-stepper {
	display: flex;
	align-items: stretch;
	border: 1px solid var(--ag-black);
	border-radius: 4px;
	overflow: hidden;
}
.ag-est-step {
	position: relative;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 0;
	background: #fff;
	cursor: pointer;
	transition: background-color .2s;
}
.ag-est-step:hover:not(:disabled) {
	background: var(--ag-peach);
}
.ag-est-step::before,
.ag-est-plus::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 14px;
	height: 2px;
	margin: -1px 0 0 -7px;
	background: var(--ag-black);
}
.ag-est-plus::after {
	transform: rotate(90deg);
}
.ag-est-step:disabled {
	cursor: not-allowed;
	opacity: .35;
}
.ag-est-input {
	width: 64px;
	height: 48px;
	padding: 0;
	border: 0;
	border-left: 1px solid var(--ag-black);
	border-right: 1px solid var(--ag-black);
	border-radius: 0;
	background: #fff;
	color: var(--ag-black);
	font: 700 22px/1 'Hanken Grotesk', system-ui, sans-serif;
	font-variant-numeric: tabular-nums;
	text-align: center;
	-moz-appearance: textfield;
	appearance: textfield;
}
.ag-est-input::-webkit-outer-spin-button,
.ag-est-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.ag-est-range {
	--fill: 30%;
	display: block;
	width: 100%;
	height: 44px;
	margin: 4px 0 0;
	background: transparent;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}
.ag-est-range::-webkit-slider-runnable-track {
	height: 12px;
	border: 1px solid var(--ag-black);
	border-radius: 999px;
	background: linear-gradient(90deg, var(--ag-coral) var(--fill), #efecf2 var(--fill));
}
.ag-est-range::-webkit-slider-thumb {
	width: 32px;
	height: 32px;
	margin-top: -11px;
	border: 2px solid var(--ag-black);
	border-radius: 50%;
	background: #fff;
	box-shadow: 2px 2px 0 var(--ag-black);
	-webkit-appearance: none;
}
.ag-est-range::-moz-range-track {
	height: 10px;
	border: 1px solid var(--ag-black);
	border-radius: 999px;
	background: #efecf2;
}
.ag-est-range::-moz-range-progress {
	height: 10px;
	border-radius: 999px;
	background: var(--ag-coral);
}
.ag-est-range::-moz-range-thumb {
	width: 28px;
	height: 28px;
	border: 2px solid var(--ag-black);
	border-radius: 50%;
	background: #fff;
	box-shadow: 2px 2px 0 var(--ag-black);
}
.ag-est-range:focus-visible {
	outline: 3px solid var(--ag-violet-ink);
	outline-offset: 4px;
}
.ag-est-scale,
.ag-est-axis {
	display: flex;
	justify-content: space-between;
	font-size: 13px;
	color: var(--ag-text-2);
}
.ag-est-plans {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px;
	margin-top: 24px;
	padding: 4px;
	border: 1px solid var(--ag-black);
	border-radius: 4px;
	background: #fff;
}
.ag-est-plan {
	min-height: 48px;
	padding: 8px 10px;
	border: 0;
	border-radius: 2px;
	background: transparent;
	color: var(--ag-black);
	font: 600 15px/1.2 'Hanken Grotesk', system-ui, sans-serif;
	cursor: pointer;
	transition: background-color .25s var(--ag-ease);
}
.ag-est-plan:hover:not(.is-active) {
	background: var(--ag-peach);
}
.ag-est-plan.is-active {
	background: var(--ag-coral);
	box-shadow: inset 0 0 0 1px var(--ag-black);
}
.ag-est-plan.is-active::before {
	content: "✓ ";
}
.ag-est-bars {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	align-items: end;
	gap: 6px;
	height: 120px;
	border-bottom: 1px solid var(--ag-black);
}
.ag-est-bar {
	display: flex;
	align-items: flex-end;
	height: 100%;
}
.ag-est-bar i {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 3px 3px 0 0;
	background: var(--ag-coral);
	box-shadow: inset 0 0 0 1px var(--ag-black);
	transform: scaleY(.02);
	transform-origin: bottom;
	transition: transform .34s var(--ag-ease);
}
.ag-est-bar:nth-child(2) i { transition-delay: 20ms; }
.ag-est-bar:nth-child(3) i { transition-delay: 40ms; }
.ag-est-bar:nth-child(4) i { transition-delay: 60ms; }
.ag-est-bar:nth-child(5) i { transition-delay: 80ms; }
.ag-est-bar:nth-child(6) i { transition-delay: 100ms; }
.ag-est-bar:nth-child(7) i { transition-delay: 120ms; }
.ag-est-bar:nth-child(8) i { transition-delay: 140ms; }
.ag-est-bar:nth-child(9) i { transition-delay: 160ms; }
.ag-est-bar:nth-child(10) i { transition-delay: 180ms; }
.ag-est-bar:nth-child(11) i { transition-delay: 200ms; }
.ag-est-bar:nth-child(12) i { transition-delay: 220ms; }
.ag-est-axis {
	margin-top: 6px;
}
.ag-est-total {
	margin-top: 14px !important;
	font-size: 16px;
}
.ag-est-total b {
	font-size: 20px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
@media (max-width: 767px) {
	.ag-est {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: "result" "controls" "year";
		gap: 22px;
		padding: 22px 18px;
		box-shadow: 4px 4px 0 var(--ag-black);
	}
	.ag-est-amount {
		font-size: 52px;
	}
	.ag-est-plan {
		font-size: 14px;
	}
	.ag-est-bars {
		height: 84px;
		gap: 4px;
	}
}

/* ---- proof: the three real screens share one height ---- */
@media (min-width: 1025px) {
	.ag-aff-proof > .ag-aff-shot {
		flex: var(--ag-ratio, 1) 1 0 !important;
		min-width: 0;
	}
}
.ag-aff-shot-img a {
	display: block;
	cursor: zoom-in;
}
.ag-aff-shot-img img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	background: #fff;
	box-shadow: var(--ag-shadow-soft);
}

/* ---- animated paths (steps, commission frieze) ---- */
.ag-path {
	position: relative;
}
.ag-path > .ag-path-node {
	position: relative;
	z-index: 1;
}
.ag-path-track {
	position: absolute;
	z-index: 0;
	height: 2px;
	background: var(--ag-border);
	transform: translateY(-1px);
	pointer-events: none;
}
.ag-path.is-vertical > .ag-path-track {
	width: 2px;
	height: auto;
	transform: translateX(-1px);
}
.ag-path-track > span {
	position: absolute;
	inset: 0;
	background: var(--ag-black);
	transform: scaleX(0);
	transform-origin: left center;
}
.ag-path.is-vertical > .ag-path-track > span {
	transform-origin: center top;
}
.ag-path.is-auto > .ag-path-track > span {
	transition: transform 1.2s var(--ag-ease);
}
.ag-aff-step {
	flex: 1 1 0;
}
.ag-aff-step-num {
	width: auto !important;
}
.ag-aff-step-num .elementor-heading-title {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border: 1px solid var(--ag-black);
	border-radius: 50%;
	background: #fff;
	font-size: 20px !important;
	font-variant-numeric: tabular-nums;
	transition: background-color .35s var(--ag-ease), box-shadow .35s var(--ag-ease);
}
.ag-aff-step.is-on .ag-aff-step-num .elementor-heading-title {
	background: var(--ag-coral);
	box-shadow: 3px 3px 0 var(--ag-black);
}
.ag-aff-step-kicker .elementor-heading-title {
	color: var(--ag-text-2);
}
.ag-aff-tick {
	flex: 1 1 0;
	min-width: 0;
}
.ag-aff-tick-chip,
.ag-aff-tick-label {
	width: auto !important;
}
.ag-aff-tick-chip .elementor-heading-title {
	display: inline-grid;
	place-items: center;
	min-width: 64px;
	height: 44px;
	padding: 0 12px;
	border: 1px solid var(--ag-black);
	border-radius: 999px;
	background: #fff;
	font-weight: 700 !important;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	transition: background-color .35s var(--ag-ease), box-shadow .35s var(--ag-ease);
}
.ag-aff-tick.is-on .ag-aff-tick-chip .elementor-heading-title {
	background: var(--ag-coral);
	box-shadow: 2px 2px 0 var(--ag-black);
}
.ag-aff-tick--end .ag-aff-tick-chip .elementor-heading-title {
	border-style: dashed;
}
@media (max-width: 767px) {
	/* Stacked steps and frieze: number / chip on the left, text on the right. */
	.ag-aff-step {
		padding-left: 76px;
		min-height: 56px;
	}
	.ag-aff-step > .ag-aff-step-num {
		position: absolute !important;
		left: 0;
		top: 0;
	}
	.ag-aff-tick {
		flex-direction: row !important;
		align-items: center !important;
		gap: 16px !important;
	}
	.ag-aff-tick-label .elementor-heading-title {
		text-align: left !important;
	}
}

/* ---- doubts: question / answer rows ---- */
.ag-aff-doubt-list {
	border-top: 2px solid var(--ag-black);
}
.ag-aff-doubt {
	border-bottom: 1px solid var(--ag-border);
}
.ag-aff-doubt-a {
	flex: 1 1 0;
}

/* ---- final call ---- */
.ag-aff-final-title,
.ag-aff-final-text,
.ag-aff-estimate-note {
	max-width: 820px;
}

/* ---- Elementor editor ---- */
.elementor-editor-active .ag-actionbar {
	outline: 1px dashed var(--ag-border-strong);
}
.elementor-editor-active .ag-actionbar::before {
	content: "Bandeau d'action : sur le site, il apparaît en bas de l'écran après le hero.";
	position: absolute;
	top: -22px;
	left: 0;
	font-size: 12px;
	color: var(--ag-text-2);
}

/* ---------------------------------------- Elementor editor: show all */
.elementor-editor-active .ag-thread-label {
	display: block !important;
	padding: 6px 10px;
	border: 1px dashed var(--ag-border-strong);
	color: var(--ag-text-2);
	background: #fff;
}
.elementor-editor-active .ag-thread-label .elementor-heading-title::before {
	content: "Étiquette du fil rouge (invisible sur le site) : ";
	font-weight: 400;
}
.elementor-editor-active .ag-cmp-row > .ag-cmp-detail {
	grid-template-rows: 1fr;
	opacity: 1;
}

/* ------------------------------------------------------ reduced motion */
@media (prefers-reduced-motion: reduce) {
	.ag-main *,
	.ag-header,
	.ag-companion {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
	.ag-main .elementor-invisible {
		visibility: visible !important;
	}
	.ag-main .elementor-heading-title em.ag-draw {
		background-size: 100% .32em;
	}
	.ag-plan:hover {
		transform: none;
	}
}

/* ------------------------------------------------- Lenis (smooth scroll) */
html.lenis,
html.lenis body {
	height: auto;
}
.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}
.lenis.lenis-stopped {
	overflow: hidden;
}