/* NIOU Pop-up — front v1.3
 * L'image n'est jamais recadrée : la taille de la pop-up est calculée à partir
 * du format d'origine de l'image (--np-r = largeur / hauteur, --np-iw = largeur native).
 */
html.niou-popup-lock,
html.niou-popup-lock body { overflow: hidden !important; }

.niou-popup[hidden] { display: none !important; }

.niou-popup {
	--np-gap: 48px;
	position: fixed;
	inset: 0;
	z-index: 999999; /* au-dessus du header Divi */
	display: flex;
	align-items: center;
	justify-content: center;
	padding: calc(var(--np-gap) / 2);
	opacity: 0;
	transition: opacity .5s ease;
	-webkit-font-smoothing: antialiased;
}
.niou-popup.is-open { opacity: 1; }

.niou-popup__overlay {
	position: absolute;
	inset: 0;
	background: rgba(20, 20, 20, var(--np-overlay, .45));
	cursor: pointer;
}

/* ---------- Boîte ---------- */
.niou-popup__dialog {
	position: relative;
	display: flex;
	width: min(var(--np-max, 1010px), calc(100vw - var(--np-gap)));
	max-height: calc(100vh - var(--np-gap));
	max-height: calc(100dvh - var(--np-gap));
	background: var(--np-bg, #fff);
	color: var(--np-text, #c98e86);
	overflow: hidden;
	transform: translateY(16px);
	transition: transform .6s cubic-bezier(.2, .8, .2, 1);
	outline: none;
}
.niou-popup.is-open .niou-popup__dialog { transform: none; }

/* Image : toujours au format d'origine */
.niou-popup__media { position: relative; flex: 0 0 auto; line-height: 0; }
.niou-popup .niou-popup__media img {
	display: block;
	width: 100%;
	height: auto;
	max-width: none;
	margin: 0;
}
.niou-popup__media-link { display: block; }

/* ---------- Image à gauche / à droite ----------
 * La colonne image fait 50 % ; la largeur totale est bornée pour que l'image
 * entière tienne dans la hauteur de l'écran. La colonne texte prend la hauteur de l'image. */
.niou-popup--img-left .niou-popup__dialog,
.niou-popup--img-right .niou-popup__dialog {
	width: min(
		var(--np-max, 1010px),
		calc(100vw - var(--np-gap)),
		calc((100vh - var(--np-gap)) * var(--np-r, .75) * 2)
	);
	max-height: none;
}
.niou-popup--img-right .niou-popup__dialog { flex-direction: row-reverse; }
.niou-popup--img-left .niou-popup__media,
.niou-popup--img-right .niou-popup__media { flex: 0 0 50%; }
.niou-popup--img-left .niou-popup__body,
.niou-popup--img-right .niou-popup__body { flex: 1 1 50%; position: relative; min-width: 0; }
.niou-popup--img-left .niou-popup__inner,
.niou-popup--img-right .niou-popup__inner {
	position: absolute;
	inset: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* ---------- Image en haut ---------- */
.niou-popup--img-top .niou-popup__dialog {
	flex-direction: column;
	width: min(var(--np-max, 1010px), 680px, calc(100vw - var(--np-gap)));
	overflow-y: auto;
}

/* ---------- Sans image ---------- */
.niou-popup--img-none .niou-popup__dialog { width: min(var(--np-max, 1010px), 620px, calc(100vw - var(--np-gap))); overflow-y: auto; }

/* ---------- Plein pop-up : image seule ---------- */
.niou-popup--img-full .niou-popup__dialog {
	display: block;
	width: min(
		var(--np-max, 1010px),
		var(--np-iw, 9999px),
		calc(100vw - var(--np-gap)),
		calc((100vh - var(--np-gap)) * var(--np-r, .75))
	);
	max-height: none;
	background: transparent;
}

/* ---------- Contenu ---------- */
.niou-popup__inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 100%;
	padding: 64px 52px 56px;
	box-sizing: border-box;
	text-align: center;
}
.niou-popup__inner > * { width: 100%; max-width: 400px; }

.niou-popup .niou-popup__title {
	margin: 0 0 22px;
	padding: 0;
	color: inherit;
	font-family: inherit;
	font-size: clamp(19px, 1.65vw, 23px);
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: .03em;
	text-transform: uppercase;
}
.niou-popup__content {
	color: inherit;
	font-size: 13px;
	line-height: 1.8;
	letter-spacing: .02em;
}
.niou-popup__content > *:first-child { margin-top: 0; }
.niou-popup__content > *:last-child { margin-bottom: 0; padding-bottom: 0; }
.niou-popup__content p { padding-bottom: 0; margin: 0 0 1em; color: inherit; }
.niou-popup__content a:not(.et_pb_button) { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.niou-popup__content img { max-width: 100%; height: auto; }
.niou-popup__content ul, .niou-popup__content ol { text-align: left; display: inline-block; padding-left: 1.2em; }

/* ---------- CTA ---------- */
.niou-popup__cta { margin: 36px 0 0; padding: 0; }
.niou-popup__btn {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-decoration: none !important;
	transition: color .25s ease, background .25s ease, gap .25s ease;
}
.niou-popup__arrow { flex: 0 0 auto; display: block; }

.niou-popup--btn-link .niou-popup__btn { padding: 6px 0; background: none; color: var(--np-btn-bg, #c98e86) !important; }
.niou-popup--btn-link .niou-popup__btn:hover { gap: 20px; }

.niou-popup--btn-solid .niou-popup__btn {
	padding: 15px 34px;
	background: var(--np-btn-bg, #c98e86);
	border: 1px solid var(--np-btn-bg, #c98e86);
	color: var(--np-btn-text, #fff) !important;
}
.niou-popup--btn-solid .niou-popup__btn:hover { background: transparent; color: var(--np-btn-bg, #c98e86) !important; }

.niou-popup--btn-outline .niou-popup__btn {
	padding: 15px 34px;
	border: 1px solid var(--np-btn-bg, #c98e86);
	color: var(--np-btn-bg, #c98e86) !important;
}
.niou-popup--btn-outline .niou-popup__btn:hover { background: var(--np-btn-bg, #c98e86); color: var(--np-btn-text, #fff) !important; }

/* ---------- Fermer ---------- */
.niou-popup .niou-popup__close {
	position: absolute;
	top: 14px; right: 14px;
	z-index: 3;
	width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	padding: 0; margin: 0;
	border: 0; border-radius: 0;
	background: none;
	color: var(--np-text, #c98e86);
	cursor: pointer;
	transition: transform .3s ease;
}
.niou-popup .niou-popup__close:hover { transform: rotate(90deg); }
.niou-popup__close:focus-visible,
.niou-popup__btn:focus-visible,
.niou-popup__media-link:focus-visible { outline: 1px solid currentColor; outline-offset: 4px; }

/* Croix posée sur l'image : pastille pour rester lisible */
.niou-popup.niou-popup--img-right .niou-popup__close,
.niou-popup.niou-popup--img-top .niou-popup__close,
.niou-popup.niou-popup--img-full .niou-popup__close {
	top: 12px; right: 12px;
	width: 36px; height: 36px;
	background: var(--np-bg, #fff);
}

/* ---------- Tablette ---------- */
@media (max-width: 980px) {
	.niou-popup__inner { padding: 56px 32px 44px; }
}

/* ---------- Mobile : image en haut (format conservé), contenu dessous ---------- */
@media (max-width: 767px) {
	.niou-popup { --np-gap: 32px; }
	.niou-popup--img-left .niou-popup__dialog,
	.niou-popup--img-right .niou-popup__dialog {
		flex-direction: column;
		width: calc(100vw - var(--np-gap));
		max-height: calc(100dvh - var(--np-gap));
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.niou-popup--img-left .niou-popup__media,
	.niou-popup--img-right .niou-popup__media { flex: 0 0 auto; }
	.niou-popup--img-left .niou-popup__body,
	.niou-popup--img-right .niou-popup__body { flex: 0 0 auto; }
	.niou-popup--img-left .niou-popup__inner,
	.niou-popup--img-right .niou-popup__inner { position: static; overflow: visible; }
	.niou-popup__inner { padding: 36px 24px 32px; }
	.niou-popup .niou-popup__title { font-size: 19px; margin-bottom: 16px; }
	.niou-popup__cta { margin-top: 26px; }

	.niou-popup:not(.niou-popup--img-none) .niou-popup__close {
		top: 10px; right: 10px;
		width: 36px; height: 36px;
		background: var(--np-bg, #fff);
	}
}

@media (prefers-reduced-motion: reduce) {
	.niou-popup, .niou-popup__dialog, .niou-popup__close, .niou-popup__btn { transition: none; }
}