/* ==========================================================================
   NAVSI Production — DA sombre, cinématographique
   Classes utilisables dans Elementor : Avancé › Classes CSS
   ========================================================================== */

:root {
	/* Couleurs */
	--navsi-black: #0b0b0c;      /* fond principal */
	--navsi-surface: #121214;    /* sections alternées */
	--navsi-surface-2: #1a1a1d;  /* cartes */
	--navsi-line: rgba(244, 242, 238, 0.12);
	--navsi-white: #f4f2ee;      /* blanc cassé, texte principal */
	--navsi-muted: #9b9a97;      /* texte secondaire */
	--navsi-red: #e53436;        /* rouge du losange : accent unique, façon voyant REC */
	--navsi-red-deep: #5f252b;

	/* Typographie */
	--navsi-font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--navsi-font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
	--navsi-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

	--navsi-fs-display: clamp(2.75rem, 1.6rem + 5.2vw, 6.5rem);
	--navsi-fs-h1: clamp(2.25rem, 1.5rem + 3.2vw, 4.25rem);
	--navsi-fs-h2: clamp(1.75rem, 1.3rem + 1.9vw, 3rem);
	--navsi-fs-h3: clamp(1.15rem, 1rem + 0.5vw, 1.4rem);
	--navsi-fs-lead: clamp(1.05rem, 0.98rem + 0.35vw, 1.25rem);
	--navsi-fs-body: 1rem;
	--navsi-fs-meta: 0.75rem;

	/* Rythme */
	--navsi-gutter: clamp(16px, 4vw, 48px);
	--navsi-section: clamp(72px, 10vw, 160px);
	--navsi-max: 1280px;
	--navsi-max-text: 760px;
	--navsi-radius: 4px;
	--navsi-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* --------------------------------------------------------------------------
   Base (surcharge Astra)
   ----------------------------------------------------------------------- */

body.navsi,
body.navsi .site,
body.navsi .site-content,
body.navsi #content,
body.navsi .ast-separate-container,
body.navsi .ast-plain-container {
	background-color: var(--navsi-black);
	color: var(--navsi-white);
}

body.navsi {
	font-family: var(--navsi-font-body);
	font-size: var(--navsi-fs-body);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body.navsi h1,
body.navsi h2,
body.navsi h3,
body.navsi h4,
body.navsi .entry-title {
	font-family: var(--navsi-font-display);
	color: var(--navsi-white);
	letter-spacing: -0.02em;
	line-height: 1.05;
	font-weight: 700;
}

body.navsi a {
	color: var(--navsi-white);
	text-decoration-color: rgba(244, 242, 238, 0.35);
	text-underline-offset: 0.2em;
	transition: color 0.2s var(--navsi-ease), text-decoration-color 0.2s var(--navsi-ease);
}

body.navsi a:hover {
	color: var(--navsi-white);
	text-decoration-color: var(--navsi-red);
}

body.navsi ::selection {
	background: var(--navsi-red);
	color: #fff;
}

body.navsi :focus-visible {
	outline: 2px solid var(--navsi-red);
	outline-offset: 3px;
}

/* En-tête et pied de page Astra */
body.navsi .site-header,
body.navsi .ast-primary-header-bar,
body.navsi .main-header-bar,
body.navsi .ast-mobile-header-wrap .ast-primary-header-bar,
body.navsi .ast-above-header-bar,
body.navsi .ast-below-header-bar {
	background-color: rgba(11, 11, 12, 0.88);
	border-bottom-color: var(--navsi-line);
	-webkit-backdrop-filter: saturate(140%) blur(12px);
	backdrop-filter: saturate(140%) blur(12px);
}

body.navsi.ast-theme-transparent-header .site-header,
body.navsi.ast-theme-transparent-header .ast-primary-header-bar,
body.navsi.ast-theme-transparent-header .main-header-bar {
	background: linear-gradient(to bottom, rgba(11, 11, 12, 0.7), rgba(11, 11, 12, 0));
	border-bottom: 0;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

body.navsi .main-header-menu .menu-link,
body.navsi .ast-header-custom-item a,
body.navsi .ast-builder-menu .menu-item > .menu-link {
	color: var(--navsi-white);
	font-family: var(--navsi-font-body);
	font-weight: 500;
	font-size: 0.9rem;
	letter-spacing: 0.01em;
}

body.navsi .main-header-menu .menu-item:hover > .menu-link,
body.navsi .main-header-menu .current-menu-item > .menu-link,
body.navsi .main-header-menu .current-menu-ancestor > .menu-link {
	color: var(--navsi-white);
	box-shadow: inset 0 -2px 0 var(--navsi-red);
}

body.navsi .main-header-menu .sub-menu,
body.navsi .ast-mobile-popup-drawer .ast-mobile-popup-inner,
body.navsi .ast-mobile-header-content {
	background-color: var(--navsi-surface);
	border-color: var(--navsi-line);
}

body.navsi .ast-header-button-1 .ast-custom-button,
body.navsi .ast-header-button-1 .menu-link {
	background: var(--navsi-red);
	color: #fff;
	border-radius: var(--navsi-radius);
	font-weight: 600;
	border: 0;
}

body.navsi .site-header .custom-logo {
	max-height: 56px;
	width: auto;
}

body.navsi .site-footer,
body.navsi .site-primary-footer-wrap,
body.navsi .site-below-footer-wrap,
body.navsi .site-above-footer-wrap {
	background-color: var(--navsi-black);
	color: var(--navsi-muted);
	border-top: 1px solid var(--navsi-line);
}

body.navsi .site-footer a {
	color: var(--navsi-muted);
}

body.navsi .site-footer a:hover {
	color: var(--navsi-white);
}

/* --------------------------------------------------------------------------
   Utilitaires typographiques (Elementor › Avancé › Classes CSS)
   ----------------------------------------------------------------------- */

/* Petit label au-dessus d'un titre, avec voyant REC */
.navsi-eyebrow,
.navsi-eyebrow .elementor-heading-title {
	font-family: var(--navsi-font-mono) !important;
	font-size: var(--navsi-fs-meta) !important;
	font-weight: 500 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase;
	color: var(--navsi-muted) !important;
	line-height: 1.4 !important;
	margin: 0 0 1rem;
}

.navsi-eyebrow::before,
.navsi-eyebrow .elementor-heading-title::before {
	content: "";
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-right: 0.7em;
	border-radius: 50%;
	background: var(--navsi-red);
	vertical-align: 0.1em;
	box-shadow: 0 0 0 0 rgba(229, 52, 54, 0.6);
}

.navsi-eyebrow--live::before,
.navsi-eyebrow--live .elementor-heading-title::before {
	animation: navsi-rec 1.8s ease-out infinite;
}

/* Titre géant (hero, manifeste) */
.navsi-display,
.navsi-display .elementor-heading-title {
	font-family: var(--navsi-font-display) !important;
	font-size: var(--navsi-fs-display) !important;
	font-weight: 800 !important;
	line-height: 0.95 !important;
	letter-spacing: -0.035em !important;
	text-wrap: balance;
}

.navsi-h2,
.navsi-h2 .elementor-heading-title {
	font-size: var(--navsi-fs-h2) !important;
	font-weight: 700 !important;
	line-height: 1.05 !important;
	text-wrap: balance;
}

.navsi-lead,
.navsi-lead p {
	font-size: var(--navsi-fs-lead);
	line-height: 1.55;
	color: var(--navsi-white);
	max-width: var(--navsi-max-text);
	opacity: 0.86;
}

.navsi-muted,
.navsi-muted p {
	color: var(--navsi-muted) !important;
}

/* Métadonnées façon claquette de tournage */
.navsi-meta {
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--navsi-muted);
	margin: 0 0 0.5rem;
}

/* Grand chiffre (chiffres clés) */
.navsi-figure .elementor-counter-number-wrapper,
.navsi-figure .elementor-heading-title {
	font-family: var(--navsi-font-display) !important;
	font-weight: 800 !important;
	font-size: clamp(2.5rem, 1.8rem + 3vw, 4.5rem) !important;
	letter-spacing: -0.03em;
	color: var(--navsi-white) !important;
}

.navsi-figure .elementor-counter-title {
	font-family: var(--navsi-font-mono) !important;
	font-size: var(--navsi-fs-meta) !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--navsi-muted) !important;
}

/* --------------------------------------------------------------------------
   Sections (à appliquer sur les conteneurs Elementor)
   ----------------------------------------------------------------------- */

.navsi-section {
	padding-top: var(--navsi-section) !important;
	padding-bottom: var(--navsi-section) !important;
}

.navsi-surface {
	background-color: var(--navsi-surface) !important;
}

.navsi-rule {
	border-top: 1px solid var(--navsi-line) !important;
}

/* Hero vidéo : plein écran + dégradé de lisibilité + grain */
.navsi-hero {
	position: relative;
	isolation: isolate;
}

.navsi-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		linear-gradient(to top, rgba(11, 11, 12, 0.92) 0%, rgba(11, 11, 12, 0.25) 45%, rgba(11, 11, 12, 0.55) 100%);
}

.navsi-hero > .e-con-inner,
.navsi-hero > .elementor-container,
.navsi-hero > .elementor-element {
	position: relative;
	z-index: 2;
}

/* Grain filmique très léger */
.navsi-grain {
	position: relative;
}

.navsi-grain > .e-con-inner {
	position: relative;
	z-index: 2;
}

.navsi-grain::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0.07;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Bande de logos clients : monochrome, couleur au survol */
.navsi-logos img {
	filter: grayscale(1) brightness(1.6) contrast(0.9);
	opacity: 0.6;
	transition: opacity 0.3s var(--navsi-ease), filter 0.3s var(--navsi-ease);
	max-height: 48px;
	width: auto;
}

.navsi-logos img:hover {
	filter: none;
	opacity: 1;
}

/* Carte pilier (Produire / Finaliser / Diffuser) */
.navsi-pillar {
	border-top: 1px solid var(--navsi-line) !important;
	padding-top: 1.5rem !important;
	transition: border-color 0.3s var(--navsi-ease);
}

.navsi-pillar:hover {
	border-top-color: var(--navsi-red) !important;
}

/* --------------------------------------------------------------------------
   Pages Elementor (accueil, réalisations, formats originaux)
   ----------------------------------------------------------------------- */

/* Marges latérales constantes sur toutes les sections de premier niveau */
body.navsi .elementor > .e-con,
body.navsi .elementor > .e-parent {
	padding-left: var(--navsi-gutter) !important;
	padding-right: var(--navsi-gutter) !important;
}

/* Les couleurs par défaut d'Elementor ne doivent jamais passer devant la DA */
body.navsi .elementor-widget-heading .elementor-heading-title {
	color: var(--navsi-white);
	font-family: var(--navsi-font-display);
}

body.navsi .elementor-widget-text-editor {
	color: rgba(244, 242, 238, 0.82);
}

body.navsi .elementor-widget-text-editor p:last-child,
body.navsi .elementor-widget-text-editor ul:last-child {
	margin-bottom: 0;
}

.navsi-display--md,
.navsi-display--md .elementor-heading-title {
	font-size: clamp(2.4rem, 1.5rem + 3.6vw, 4.75rem) !important;
}

.navsi-h3 .elementor-heading-title {
	font-size: var(--navsi-fs-h3) !important;
	font-weight: 700 !important;
}

.navsi-index .elementor-heading-title {
	font-family: var(--navsi-font-mono) !important;
	font-size: var(--navsi-fs-meta) !important;
	letter-spacing: 0.14em;
	color: var(--navsi-red) !important;
}

/* Hero : losange du logo en filigrane + halo rouge */
.navsi-hero--diamond {
	background-color: var(--navsi-black);
	background-image:
		radial-gradient(ellipse 60% 55% at 78% 42%, rgba(229, 52, 54, 0.16), transparent 70%),
		url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect x='22' y='22' width='56' height='56' transform='rotate(45 50 50)' fill='none' stroke='%23E53436' stroke-opacity='0.55' stroke-width='0.25'/><rect x='27' y='27' width='46' height='46' transform='rotate(45 50 50)' fill='none' stroke='%23F4F2EE' stroke-opacity='0.08' stroke-width='0.2'/></svg>");
	background-repeat: no-repeat, no-repeat;
	background-size: 100% 100%, min(88vh, 900px) min(88vh, 900px);
	background-position: center, 92% 46%;
}

@media (max-width: 767px) {
	.navsi-hero--diamond {
		background-size: 100% 100%, 110vw 110vw;
		background-position: center, 60% 30%;
	}
}

.navsi-hero::after {
	background: linear-gradient(to top, rgba(11, 11, 12, 0.85) 0%, rgba(11, 11, 12, 0) 55%);
}

.navsi-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 32px;
	padding-top: 20px;
	border-top: 1px solid var(--navsi-line);
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--navsi-muted);
}

.navsi-hero__meta span:last-child {
	margin-left: auto;
}

@media (max-width: 767px) {
	.navsi-hero__meta span:last-child {
		margin-left: 0;
	}
}

.navsi-actions .elementor-widget {
	width: auto !important;
}

/* Bande « Ils sont passés à notre micro » */
.navsi-band .navsi-eyebrow {
	margin: 0 !important;
}

.navsi-names p {
	font-family: var(--navsi-font-display);
	font-weight: 600;
	font-size: clamp(1rem, 0.9rem + 0.5vw, 1.3rem);
	line-height: 1.6;
	color: var(--navsi-white);
	margin: 0;
}

.navsi-names span {
	color: var(--navsi-red);
	padding: 0 0.35em;
}

/* Liens fléchés */
.navsi-arrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-weight: 600;
	text-decoration: none !important;
	color: var(--navsi-white) !important;
}

.navsi-arrow::after {
	content: "→";
	color: var(--navsi-red);
	transition: transform 0.25s var(--navsi-ease);
}

.navsi-arrow:hover::after {
	transform: translateX(4px);
}

/* Liste à puces carrées rouges */
.navsi-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 10px;
}

.navsi-list li {
	position: relative;
	padding-left: 22px;
	color: var(--navsi-white);
}

.navsi-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.62em;
	width: 7px;
	height: 7px;
	background: var(--navsi-red);
	transform: rotate(45deg);
}

/* Fiche technique en carte (section studio) */
.navsi-slate--card {
	grid-template-columns: 1fr;
	margin: 0;
	max-width: none;
}

.navsi-slate--card > div {
	background: var(--navsi-surface-2);
	padding: 20px 24px;
}

/* En-têtes de pages intérieures */
.navsi-pagehead {
	padding-top: clamp(140px, 16vw, 220px) !important;
	padding-bottom: clamp(40px, 5vw, 72px) !important;
}

.navsi-section--tight {
	padding-top: 0 !important;
}

.navsi-headrow .elementor-widget-button {
	align-self: flex-end;
}

@media (max-width: 767px) {
	.navsi-headrow .elementor-widget-button {
		align-self: flex-start;
	}
}

.navsi-cta-final {
	background: radial-gradient(ellipse 70% 80% at 50% 120%, rgba(229, 52, 54, 0.18), transparent 70%), var(--navsi-black);
}

.navsi-cta-final .navsi-actions {
	margin-top: 8px;
}

/* --------------------------------------------------------------------------
   Boutons
   ----------------------------------------------------------------------- */

.navsi-btn,
.navsi-elbtn .elementor-button {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	padding: 0.95em 1.6em !important;
	background: var(--navsi-red) !important;
	color: #fff !important;
	border: 1px solid var(--navsi-red) !important;
	border-radius: var(--navsi-radius) !important;
	font-family: var(--navsi-font-body) !important;
	font-weight: 600 !important;
	font-size: 0.95rem !important;
	line-height: 1.2 !important;
	letter-spacing: 0.01em;
	text-decoration: none !important;
	transition: background 0.25s var(--navsi-ease), border-color 0.25s var(--navsi-ease), transform 0.25s var(--navsi-ease);
}

.navsi-btn:hover,
.navsi-elbtn .elementor-button:hover {
	background: #c92a2c !important;
	border-color: #c92a2c !important;
	transform: translateY(-1px);
}

.navsi-btn--ghost,
.navsi-elbtn--ghost .elementor-button {
	background: transparent !important;
	border-color: rgba(244, 242, 238, 0.4) !important;
	color: var(--navsi-white) !important;
}

.navsi-btn--ghost:hover,
.navsi-elbtn--ghost .elementor-button:hover {
	background: var(--navsi-white) !important;
	border-color: var(--navsi-white) !important;
	color: var(--navsi-black) !important;
}

/* --------------------------------------------------------------------------
   Grilles Réalisations / Épisodes (shortcodes)
   ----------------------------------------------------------------------- */

.navsi-grid {
	display: grid;
	gap: clamp(20px, 2.5vw, 36px);
	grid-template-columns: 1fr;
}

@media (min-width: 700px) {
	.navsi-grid--2,
	.navsi-grid--3,
	.navsi-grid--4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.navsi-grid--3 {
		grid-template-columns: repeat(3, 1fr);
	}

	.navsi-grid--4 {
		grid-template-columns: repeat(4, 1fr);
	}
}

.navsi-card[hidden] {
	display: none;
}

.navsi-card__link {
	display: block;
	text-decoration: none !important;
	color: inherit;
}

.navsi-card__media {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--navsi-surface-2);
	border-radius: var(--navsi-radius);
}

.navsi-card__img,
.navsi-card__preview,
.navsi-card__placeholder {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.8s var(--navsi-ease), opacity 0.4s var(--navsi-ease);
}

.navsi-card__placeholder {
	background:
		radial-gradient(circle at 30% 20%, rgba(229, 52, 54, 0.18), transparent 55%),
		var(--navsi-surface-2);
}

.navsi-card__preview {
	opacity: 0;
}

.navsi-card.is-playing .navsi-card__preview {
	opacity: 1;
}

.navsi-card__link:hover .navsi-card__img {
	transform: scale(1.04);
}

.navsi-card__play {
	position: absolute;
	left: 16px;
	bottom: 16px;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: rgba(11, 11, 12, 0.55);
	border: 1px solid rgba(244, 242, 238, 0.35);
	color: #fff;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	transition: background 0.25s var(--navsi-ease), border-color 0.25s var(--navsi-ease);
}

.navsi-card__play svg {
	width: 18px;
	height: 18px;
}

.navsi-card__link:hover .navsi-card__play {
	background: var(--navsi-red);
	border-color: var(--navsi-red);
}

.navsi-card__body {
	padding-top: 1rem;
}

.navsi-card__title {
	font-family: var(--navsi-font-display);
	font-size: var(--navsi-fs-h3);
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 0.35rem;
	color: var(--navsi-white);
}

.navsi-card__tag {
	font-size: 0.875rem;
	color: var(--navsi-muted);
	margin: 0;
}

/* Filtres */
.navsi-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: clamp(24px, 3vw, 40px);
}

.navsi-filter__btn {
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0.7em 1.1em;
	background: transparent;
	color: var(--navsi-muted);
	border: 1px solid var(--navsi-line);
	border-radius: 999px;
	cursor: pointer;
	transition: all 0.2s var(--navsi-ease);
}

.navsi-filter__btn:hover {
	color: var(--navsi-white);
	border-color: rgba(244, 242, 238, 0.4);
	background: transparent;
}

.navsi-filter__btn[aria-pressed="true"] {
	color: #fff;
	background: var(--navsi-red);
	border-color: var(--navsi-red);
}

.navsi-empty {
	padding: 1.5rem;
	border: 1px dashed var(--navsi-line);
	color: var(--navsi-muted);
	font-size: 0.9rem;
}

/* Vidéo responsive */
.navsi-video {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #000;
	border-radius: var(--navsi-radius);
	overflow: hidden;
}

.navsi-video iframe,
.navsi-video video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* --------------------------------------------------------------------------
   Fiches projet / épisode
   ----------------------------------------------------------------------- */

.navsi-wrap {
	width: 100%;
	max-width: var(--navsi-max-text);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--navsi-gutter);
	padding-right: var(--navsi-gutter);
	box-sizing: border-box;
}

.navsi-wrap--wide {
	max-width: var(--navsi-max);
}

.navsi-single {
	padding: clamp(48px, 8vw, 120px) 0 clamp(64px, 8vw, 120px);
}

.navsi-single__title {
	font-size: var(--navsi-fs-h1);
	font-weight: 800;
	margin: 0 0 1.25rem;
	text-wrap: balance;
}

.navsi-single__media {
	margin-top: clamp(32px, 5vw, 64px);
	margin-bottom: clamp(32px, 5vw, 64px);
}

.navsi-single__img {
	width: 100%;
	height: auto;
	border-radius: var(--navsi-radius);
}

.navsi-single__content {
	color: rgba(244, 242, 238, 0.86);
}

.navsi-single__content img {
	border-radius: var(--navsi-radius);
}

.navsi-slate {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 1px;
	margin-top: 0;
	margin-bottom: clamp(32px, 5vw, 56px);
	background: var(--navsi-line);
	border: 1px solid var(--navsi-line);
	padding: 0 !important;
}

.navsi-slate > div {
	background: var(--navsi-black);
	padding: 14px 16px;
}

.navsi-slate dt {
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--navsi-muted);
	margin: 0 0 4px;
}

.navsi-slate dd {
	margin: 0;
	font-weight: 600;
	color: var(--navsi-white);
}

.navsi-more {
	margin-top: clamp(48px, 6vw, 88px);
}

.navsi-wrap.navsi-more {
	max-width: var(--navsi-max);
}

.navsi-cta {
	margin-top: clamp(56px, 8vw, 112px);
	padding-top: clamp(32px, 4vw, 48px);
	border-top: 1px solid var(--navsi-line);
}

.navsi-cta h2 {
	font-size: var(--navsi-fs-h2);
	margin: 0 0 1.5rem;
}

.navsi-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.navsi-pager {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	margin-top: clamp(48px, 6vw, 80px);
}

.navsi-pager a {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	font-family: var(--navsi-font-display);
	font-weight: 700;
	max-width: 48%;
}

.navsi-pager__next {
	margin-left: auto;
	text-align: right;
}

/* --------------------------------------------------------------------------
   Bouton WhatsApp flottant
   ----------------------------------------------------------------------- */

.navsi-wa {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 999;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px 12px 14px;
	background: var(--navsi-surface-2);
	color: var(--navsi-white) !important;
	border: 1px solid var(--navsi-line);
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
	transition: border-color 0.2s var(--navsi-ease), transform 0.2s var(--navsi-ease);
}

.navsi-wa svg {
	width: 20px;
	height: 20px;
	color: #25d366;
}

.navsi-wa:hover {
	border-color: rgba(244, 242, 238, 0.4);
	transform: translateY(-2px);
}

@media (max-width: 600px) {
	.navsi-wa span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.navsi-wa {
		padding: 14px;
	}
}

/* Astra : bouton « retour en haut » au-dessus du bouton WhatsApp */
body.navsi #ast-scroll-top {
	bottom: 84px;
	background-color: var(--navsi-surface-2);
}

/* --------------------------------------------------------------------------
   Formulaires (Forminator) — habillage sombre
   ----------------------------------------------------------------------- */

body.navsi .forminator-ui.forminator-custom-form .forminator-input,
body.navsi .forminator-ui.forminator-custom-form .forminator-textarea,
body.navsi .forminator-ui.forminator-custom-form select,
body.navsi .forminator-ui.forminator-custom-form .select2-selection {
	background-color: var(--navsi-surface-2) !important;
	border: 1px solid var(--navsi-line) !important;
	color: var(--navsi-white) !important;
	border-radius: var(--navsi-radius) !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-label,
body.navsi .forminator-ui.forminator-custom-form .forminator-description {
	color: var(--navsi-muted) !important;
	font-family: var(--navsi-font-body) !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-label {
	color: var(--navsi-white) !important;
	font-weight: 500 !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-checkbox-label,
body.navsi .forminator-ui.forminator-custom-form .forminator-checkbox__label,
body.navsi .forminator-ui.forminator-custom-form .forminator-consent__label,
body.navsi .forminator-ui.forminator-custom-form .forminator-checkbox span,
body.navsi .forminator-ui.forminator-custom-form .forminator-field-consent {
	color: rgba(244, 242, 238, 0.82) !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-checkbox-box,
body.navsi .forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box {
	background-color: var(--navsi-surface-2) !important;
	border: 1px solid rgba(244, 242, 238, 0.35) !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-input::placeholder,
body.navsi .forminator-ui.forminator-custom-form .forminator-textarea::placeholder {
	color: rgba(244, 242, 238, 0.4) !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-input:focus,
body.navsi .forminator-ui.forminator-custom-form .forminator-textarea:focus {
	border-color: var(--navsi-red) !important;
	box-shadow: none !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-file-upload .forminator-button,
body.navsi .forminator-ui.forminator-custom-form .forminator-upload-button {
	background: transparent !important;
	border: 1px solid rgba(244, 242, 238, 0.4) !important;
	color: var(--navsi-white) !important;
}

body.navsi .forminator-ui.forminator-custom-form .forminator-error-message {
	color: #ff8a8b !important;
	background: transparent !important;
}

body.navsi .forminator-select-dropdown-container--open .forminator-select-dropdown,
body.navsi .select2-container .select2-dropdown {
	background-color: var(--navsi-surface-2) !important;
	border-color: var(--navsi-line) !important;
	color: var(--navsi-white) !important;
}

body.navsi .select2-container .select2-results__option {
	color: var(--navsi-white) !important;
}

body.navsi .select2-container .select2-results__option--highlighted,
body.navsi .select2-container .select2-results__option[aria-selected="true"] {
	background-color: rgba(229, 52, 54, 0.22) !important;
}

body.navsi .forminator-ui.forminator-custom-form .select2-selection__rendered {
	color: var(--navsi-white) !important;
}

.navsi-form {
	margin-top: clamp(24px, 4vw, 48px);
}

body.navsi .forminator-ui.forminator-custom-form .forminator-button-submit {
	background: var(--navsi-red) !important;
	color: #fff !important;
	border-radius: var(--navsi-radius) !important;
	font-weight: 600 !important;
	padding: 0.95em 1.6em !important;
}

/* --------------------------------------------------------------------------
   Intro logo (accueil, une fois par session)
   ----------------------------------------------------------------------- */

.navsi-intro {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	background: var(--navsi-black);
	cursor: pointer;
	transition: opacity 0.6s var(--navsi-ease), visibility 0.6s;
	/* Sécurité : le calque disparaît seul même si le JavaScript ne s'exécute pas. */
	animation: navsi-intro-out 0.6s var(--navsi-ease) 3.2s forwards;
}

@keyframes navsi-intro-out {
	to {
		opacity: 0;
		visibility: hidden;
	}
}

.navsi-intro img {
	width: min(320px, 60vw);
	height: auto;
	opacity: 0;
	transform: scale(0.96);
	animation: navsi-intro-in 1.1s var(--navsi-ease) 0.1s forwards;
}

.navsi-intro.is-done {
	opacity: 0;
	visibility: hidden;
}

@keyframes navsi-intro-in {
	60% {
		opacity: 1;
		transform: scale(1);
		filter: drop-shadow(0 0 0 rgba(229, 52, 54, 0));
	}

	100% {
		opacity: 1;
		transform: scale(1);
		filter: drop-shadow(0 0 28px rgba(229, 52, 54, 0.45));
	}
}

@keyframes navsi-rec {
	0% {
		box-shadow: 0 0 0 0 rgba(229, 52, 54, 0.6);
	}

	70% {
		box-shadow: 0 0 0 8px rgba(229, 52, 54, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(229, 52, 54, 0);
	}
}

/* --------------------------------------------------------------------------
   Accessibilité : mouvement réduit
   ----------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.navsi-intro {
		display: none;
	}
}

/* ==========================================================================
   v2 — SIGNATURE « LE LOSANGE RÉVÈLE LA COULEUR »
   Toute image est étalonnée en noir et blanc ; la couleur n'existe
   qu'à travers le losange du logo.
   ========================================================================== */

:root {
	--navsi-grade: grayscale(1) contrast(1.14) brightness(0.78);
	--navsi-diamond-0: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);
	--navsi-diamond-in: polygon(50% 14%, 86% 50%, 50% 86%, 14% 50%);
	--navsi-diamond-full: polygon(50% -55%, 155% 50%, 50% 155%, -55% 50%);
	--navsi-diamond: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}

/* Typographie : Archivo élargi en capitales, écho aux lettres larges du logo */
.navsi-display,
.navsi-display .elementor-heading-title,
.navsi-h2,
.navsi-h2 .elementor-heading-title,
.navsi-single__title,
.navsi-cta h2 {
	font-stretch: 125% !important;
	font-variation-settings: "wdth" 125;
	text-transform: uppercase;
	letter-spacing: -0.02em !important;
}

.navsi-display,
.navsi-display .elementor-heading-title {
	font-weight: 900 !important;
	font-size: clamp(2.6rem, 1.2rem + 6.2vw, 7.4rem) !important;
	line-height: 0.92 !important;
}

.navsi-display--md,
.navsi-display--md .elementor-heading-title {
	font-size: clamp(2.2rem, 1.2rem + 4.2vw, 5.4rem) !important;
}

.navsi-h2,
.navsi-h2 .elementor-heading-title {
	font-weight: 800 !important;
	font-size: clamp(1.7rem, 1.1rem + 2.4vw, 3.4rem) !important;
	line-height: 0.98 !important;
}

/* Petit losange rouge en fin de titre */
.navsi-glyph {
	display: inline-block;
	width: 0.2em;
	height: 0.2em;
	margin-left: 0.12em;
	background: var(--navsi-red);
	transform: rotate(45deg) translateY(-0.06em);
	vertical-align: baseline;
}

/* Eyebrow : le point devient losange */
.navsi-eyebrow::before,
.navsi-eyebrow .elementor-heading-title::before {
	width: 7px;
	height: 7px;
	border-radius: 0;
	transform: rotate(45deg);
	vertical-align: 0.15em;
}

/* --------------------------------------------------------------------------
   Cadre losange (repris du logo)
   ----------------------------------------------------------------------- */

.navsi-frame {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.navsi-frame__line {
	fill: none;
	stroke: var(--navsi-red);
	stroke-width: 1.5px;
}

.navsi-frame__ticks line {
	stroke: var(--navsi-white);
	stroke-width: 3px;
	stroke-linecap: butt;
	vector-effect: non-scaling-stroke;
}

/* --------------------------------------------------------------------------
   Image à révélation (cartes, services, bande, visuels)
   ----------------------------------------------------------------------- */

.navsi-reveal {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: var(--navsi-ratio, 16/9);
	overflow: hidden;
	background: var(--navsi-surface-2);
	border-radius: 2px;
	isolation: isolate;
}

.navsi-reveal__base,
.navsi-reveal__color {
	position: absolute;
	inset: 0;
	display: block;
}

.navsi-reveal img {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	display: block;
	transform: scale(1.02);
	transition: transform 1.4s var(--navsi-ease);
}

.navsi-reveal__base img {
	filter: var(--navsi-grade);
}

.navsi-reveal__color {
	clip-path: var(--navsi-diamond-0);
	transition: clip-path 0.9s var(--navsi-ease);
	z-index: 1;
}

.navsi-reveal--empty {
	background:
		radial-gradient(circle at 50% 50%, rgba(229, 52, 54, 0.14), transparent 60%),
		var(--navsi-surface-2);
}

/* Survol : le losange s'ouvre jusqu'à couvrir l'image */
@media (hover: hover) {
	.navsi-card__link:hover .navsi-reveal__color,
	.navsi-service:hover .navsi-reveal__color,
	.navsi-strip__item:hover .navsi-reveal__color,
	.navsi-visual--rect:hover .navsi-reveal__color {
		clip-path: var(--navsi-diamond-full);
	}

	.navsi-card__link:hover .navsi-reveal img,
	.navsi-service:hover .navsi-reveal img {
		transform: scale(1.06);
	}
}

/* Tactile : la fenêtre losange s'allume quand l'image entre à l'écran */
@media (hover: none) {
	.navsi-reveal.is-inview .navsi-reveal__color {
		clip-path: var(--navsi-diamond-in);
	}
}

/* Visuel losange : l'image entière découpée en losange, cœur en couleur */
.navsi-visual {
	margin: 0;
}

.navsi-visual--losange {
	position: relative;
	max-width: 560px;
	margin-inline: auto;
}

.navsi-reveal--losange {
	clip-path: var(--navsi-diamond);
	background: transparent;
	overflow: visible;
}

.navsi-reveal--losange .navsi-reveal__color {
	clip-path: var(--navsi-diamond-in);
}

.navsi-visual--losange .navsi-reveal__frame {
	position: absolute;
	inset: -5%;
	width: 110%;
	height: 110%;
	pointer-events: none;
}

.navsi-visual--losange .navsi-reveal {
	clip-path: none;
}

.navsi-visual--losange .navsi-reveal__base,
.navsi-visual--losange .navsi-reveal__color {
	clip-path: var(--navsi-diamond);
}

.navsi-visual--losange .navsi-reveal__color {
	clip-path: var(--navsi-diamond-in);
}

.navsi-visual--losange:hover .navsi-reveal__color {
	clip-path: var(--navsi-diamond);
}

.navsi-visual figcaption {
	margin-top: 14px;
	text-align: center;
}

/* --------------------------------------------------------------------------
   HERO viseur
   ----------------------------------------------------------------------- */

body.navsi .elementor > .e-con.navsi-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background: var(--navsi-black);
}

/* Le widget du fond sort du flux et couvre tout le hero */
.navsi-hero .elementor-widget-shortcode:has(.navsi-hm) {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	z-index: 0;
}

.navsi-hero .elementor-widget-shortcode:has(.navsi-hm) > .elementor-widget-container,
.navsi-hero .elementor-widget-shortcode:has(.navsi-hm) .elementor-shortcode {
	height: 100%;
}

.navsi-hero > .e-con,
.navsi-hero > .elementor-element:not(.elementor-widget-shortcode) {
	position: relative;
	z-index: 2;
}

.navsi-hero::after {
	z-index: 1;
	background:
		linear-gradient(90deg, rgba(11, 11, 12, 0.92) 0%, rgba(11, 11, 12, 0.55) 38%, rgba(11, 11, 12, 0) 62%),
		linear-gradient(to top, rgba(11, 11, 12, 0.95) 0%, rgba(11, 11, 12, 0) 40%);
}

.navsi-inner {
	width: 100%;
	max-width: var(--navsi-max) !important;
	margin-inline: auto !important;
}

.navsi-hm {
	--cx: 71%;
	--cy: 47%;
	--r: min(34vh, 23vw);
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.navsi-hm__layer {
	position: absolute;
	inset: 0;
}

.navsi-hm__layer img {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	object-position: 60% 50%;
	animation: navsi-kenburns 18s var(--navsi-ease) both;
}

.navsi-hm__base img {
	filter: var(--navsi-grade) brightness(0.8);
}

.navsi-hm__color {
	clip-path: polygon(
		var(--cx) calc(var(--cy) - var(--r)),
		calc(var(--cx) + var(--r)) var(--cy),
		var(--cx) calc(var(--cy) + var(--r)),
		calc(var(--cx) - var(--r)) var(--cy)
	);
	animation: navsi-iris 1.6s var(--navsi-ease) 0.4s both;
}

.navsi-hm__frame {
	position: absolute;
	left: calc(var(--cx) - var(--r) * 1.06);
	top: calc(var(--cy) - var(--r) * 1.06);
	width: calc(var(--r) * 2.12);
	height: calc(var(--r) * 2.12);
	z-index: 3;
	pointer-events: none;
	animation: navsi-fade 1.2s var(--navsi-ease) 0.9s both;
}

.navsi-hm--fond .navsi-hm__frame--ghost {
	--r: min(42vh, 30vw);
	left: calc(50% - var(--r));
	top: calc(50% - var(--r));
	width: calc(var(--r) * 2);
	height: calc(var(--r) * 2);
	opacity: 0.55;
}

.navsi-hm--fond .navsi-hm__base img {
	filter: var(--navsi-grade) brightness(0.55);
}

.navsi-hm__tc,
.navsi-hm__label {
	position: absolute;
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--navsi-white);
	white-space: nowrap;
}

.navsi-hm__tc {
	left: 100%;
	top: 50%;
	transform: translate(12px, -50%);
}

.navsi-hm__tc b {
	color: var(--navsi-red);
	font-weight: 500;
}

.navsi-hm__tc b::before {
	content: "";
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-right: 8px;
	background: var(--navsi-red);
	transform: rotate(45deg);
	animation: navsi-blink 1.2s steps(1) infinite;
}

.navsi-hm__label {
	left: 50%;
	top: 100%;
	transform: translate(-50%, 14px);
	color: var(--navsi-muted);
}

.navsi-hm__grain {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	opacity: 0.09;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

@media (max-width: 1024px) {
	.navsi-hm {
		--cx: 50%;
		--cy: 34%;
		--r: min(36vw, 30vh);
	}

	.navsi-hero::after {
		background:
			linear-gradient(to top, rgba(11, 11, 12, 0.98) 0%, rgba(11, 11, 12, 0.82) 42%, rgba(11, 11, 12, 0.1) 75%);
	}

	.navsi-hm__tc {
		left: 50%;
		top: auto;
		bottom: 100%;
		transform: translate(-50%, -12px);
	}

	.navsi-hm__label {
		display: none;
	}
}

@keyframes navsi-kenburns {
	from { transform: scale(1.08); }
	to { transform: scale(1); }
}

@keyframes navsi-iris {
	from {
		clip-path: polygon(var(--cx) var(--cy), var(--cx) var(--cy), var(--cx) var(--cy), var(--cx) var(--cy));
	}
}

@keyframes navsi-fade {
	from { opacity: 0; transform: scale(0.96); }
}

@keyframes navsi-blink {
	50% { opacity: 0; }
}

.navsi-hero .navsi-lead p {
	max-width: 560px;
}

.navsi-hero__meta {
	position: relative;
	z-index: 2;
}

/* --------------------------------------------------------------------------
   Bande défilante (extraits de tournage)
   ----------------------------------------------------------------------- */

body.navsi .elementor > .e-con.navsi-strip-section {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.navsi-strip {
	display: flex;
	gap: 12px;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.navsi-strip__track {
	display: flex;
	gap: 12px;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	animation: navsi-strip 60s linear infinite;
}

.navsi-strip:hover .navsi-strip__track {
	animation-play-state: paused;
}

.navsi-strip__item {
	position: relative;
	width: clamp(220px, 24vw, 380px);
	flex-shrink: 0;
	margin: 0;
}

.navsi-strip__id {
	position: absolute;
	left: 10px;
	bottom: 8px;
	z-index: 2;
	font-family: var(--navsi-font-mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	color: rgba(244, 242, 238, 0.75);
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
}

@keyframes navsi-strip {
	to { transform: translateX(calc(-100% - 12px)); }
}

/* --------------------------------------------------------------------------
   Cartes réalisations / épisodes (v2)
   ----------------------------------------------------------------------- */

.navsi-card__media {
	aspect-ratio: auto;
	background: transparent;
	border-radius: 2px;
	overflow: visible;
}

.navsi-card__play {
	z-index: 3;
}

.navsi-card__title {
	font-stretch: 112%;
	font-variation-settings: "wdth" 112;
}

/* Vedette : premier projet en pleine largeur, titre posé sur l'image */
.navsi-grid--vedette {
	grid-template-columns: 1fr;
}

@media (min-width: 700px) {
	.navsi-grid--vedette {
		grid-template-columns: repeat(2, 1fr);
	}
}

.navsi-card--vedette {
	grid-column: 1 / -1;
}

.navsi-card--vedette .navsi-card__link {
	position: relative;
}

.navsi-card--vedette .navsi-reveal {
	aspect-ratio: 21 / 9;
}

@media (max-width: 699px) {
	.navsi-card--vedette .navsi-reveal {
		aspect-ratio: 4 / 5;
	}
}

.navsi-card--vedette .navsi-card__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	padding: clamp(20px, 3vw, 40px);
	background: linear-gradient(to top, rgba(11, 11, 12, 0.92), rgba(11, 11, 12, 0));
}

.navsi-card--vedette .navsi-card__title {
	font-size: clamp(1.6rem, 1rem + 2.6vw, 3.4rem);
	font-weight: 800;
	text-transform: uppercase;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	line-height: 0.98;
	letter-spacing: -0.02em;
	max-width: 16ch;
}

.navsi-card--vedette .navsi-card__play {
	left: auto;
	right: clamp(20px, 3vw, 40px);
	bottom: auto;
	top: clamp(20px, 3vw, 40px);
	width: 64px;
	height: 64px;
}

/* --------------------------------------------------------------------------
   Services (Produire / Finaliser / Diffuser)
   ----------------------------------------------------------------------- */

.navsi-service {
	gap: 16px !important;
}

.navsi-service .navsi-index .elementor-heading-title {
	display: inline-grid;
	place-items: center;
	width: 38px;
	height: 38px;
	position: relative;
}

.navsi-service .navsi-index .elementor-heading-title::before {
	content: "";
	position: absolute;
	inset: 6px;
	border: 1px solid var(--navsi-red);
	transform: rotate(45deg);
	transition: background 0.3s var(--navsi-ease);
}

.navsi-service:hover .navsi-index .elementor-heading-title::before {
	background: rgba(229, 52, 54, 0.2);
}

/* --------------------------------------------------------------------------
   Séparateurs : filet + losange
   ----------------------------------------------------------------------- */

body.navsi .elementor > .e-con.navsi-rule {
	position: relative;
}

body.navsi .elementor > .e-con.navsi-rule::after {
	content: "";
	position: absolute;
	top: -4px;
	left: var(--navsi-gutter);
	width: 7px;
	height: 7px;
	background: var(--navsi-black);
	border: 1px solid var(--navsi-red);
	transform: rotate(45deg);
	z-index: 3;
}

/* --------------------------------------------------------------------------
   CTA final sur image
   ----------------------------------------------------------------------- */

body.navsi .elementor > .e-con.navsi-cta-photo {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 78vh;
}

.navsi-cta-photo .elementor-widget-shortcode:has(.navsi-hm) {
	position: absolute !important;
	inset: 0;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	z-index: 0;
}

.navsi-cta-photo .elementor-widget-shortcode:has(.navsi-hm) .elementor-widget-container,
.navsi-cta-photo .elementor-widget-shortcode:has(.navsi-hm) .elementor-shortcode {
	height: 100%;
}

.navsi-cta-photo > .e-con {
	position: relative;
	z-index: 2;
}

.navsi-center {
	text-align: center;
	align-items: center !important;
}

.navsi-center .navsi-actions {
	justify-content: center;
}

/* Figures inline (approche) */
.navsi-figures {
	border-top: 1px solid var(--navsi-line);
	padding-top: 28px !important;
}

.navsi-figures .navsi-figure .elementor-heading-title {
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	font-size: clamp(2.2rem, 1.6rem + 2.4vw, 3.6rem) !important;
}

/* Intro : le losange se trace, puis le logo apparaît */
.navsi-intro__stage {
	position: relative;
	width: min(360px, 70vw);
	aspect-ratio: 1;
	display: grid;
	place-items: center;
}

.navsi-intro__frame {
	position: absolute;
	inset: 0;
}

.navsi-intro__frame .navsi-frame__line {
	stroke-dasharray: 100;
	stroke-dashoffset: 100;
	animation: navsi-draw 1s var(--navsi-ease) forwards;
}

.navsi-intro__frame .navsi-frame__ticks {
	opacity: 0;
	animation: navsi-fade-in 0.4s ease 0.8s forwards;
}

.navsi-intro img {
	width: 72%;
	animation-delay: 0.6s;
}

@keyframes navsi-draw {
	to { stroke-dashoffset: 0; }
}

@keyframes navsi-fade-in {
	to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.navsi-strip__track {
		animation: none;
	}

	.navsi-hm__color,
	.navsi-hm__frame,
	.navsi-hm__layer img {
		animation: none;
	}
}

/* --- Correctifs v2.0.1 --- */

/* Un seul losange par label (Elementor pose la classe sur le wrapper ET le titre) */
.elementor-widget.navsi-eyebrow::before {
	content: none !important;
	display: none !important;
}

/* Timecode au-dessus du sommet du losange (jamais coupé par le bord de l'écran) */
.navsi-hm__tc {
	left: 50%;
	top: auto;
	bottom: 100%;
	transform: translate(-50%, -14px);
}

.navsi-visual--losange {
	max-width: 620px;
	width: 100%;
}

@media (max-width: 767px) {
	.navsi-hm {
		--cx: 58%;
		--cy: 22%;
		--r: min(30vw, 20vh);
	}

	body.navsi .elementor > .e-con.navsi-hero {
		padding-top: 96px !important;
	}

	.navsi-hm__tc {
		font-size: 10px;
	}

	.navsi-hero__meta span:nth-child(-n+3) {
		display: none;
	}
}

/* --- Correctifs v2.1 --- */

/* Les grilles Elementor ne doivent jamais écraser la hauteur des cartes */
body.navsi .e-con:has(> .navsi-service),
body.navsi .e-con:has(> .e-con > .navsi-service) {
	grid-template-rows: none !important;
	grid-auto-rows: auto !important;
}

body.navsi .elementor-widget-shortcode {
	flex-shrink: 0;
}

/* Hero : losange un peu plus bas pour dégager l'en-tête */
.navsi-hm {
	--cy: 52%;
	--r: min(32vh, 22vw);
}

@media (max-width: 1024px) {
	.navsi-hm {
		--cx: 50%;
		--cy: 30%;
		--r: min(34vw, 22vh);
	}
}

@media (max-width: 767px) {
	.navsi-hm {
		--cx: 54%;
		--cy: 29%;
		--r: min(30vw, 17vh);
	}

	.navsi-hm__tc {
		display: none;
	}
}

/* CTA centré */
.navsi-center .navsi-lead p {
	margin-inline: auto;
	text-align: center;
	max-width: 620px;
}

/* Façade vidéo : image étalonnée, losange au survol, lecture au clic */
.navsi-video--facade {
	background: transparent;
}

.navsi-video__btn {
	all: unset;
	position: absolute;
	inset: 0;
	display: block;
	cursor: pointer;
}

.navsi-video__btn .navsi-reveal {
	position: absolute;
	inset: 0;
	height: 100%;
	aspect-ratio: auto;
}

.navsi-video__play {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 3;
	width: 76px;
	height: 76px;
	display: grid;
	place-items: center;
	transform: translate(-50%, -50%);
	color: #fff;
	transition: transform 0.3s var(--navsi-ease);
}

.navsi-video__play::before {
	content: "";
	position: absolute;
	inset: 10px;
	background: rgba(229, 52, 54, 0.92);
	transform: rotate(45deg);
	transition: background 0.3s var(--navsi-ease);
}

.navsi-video__play svg {
	position: relative;
	width: 22px;
	height: 22px;
	margin-left: 3px;
}

@media (hover: hover) {
	.navsi-video__btn:hover .navsi-reveal__color {
		clip-path: var(--navsi-diamond-full);
	}

	.navsi-video__btn:hover .navsi-video__play {
		transform: translate(-50%, -50%) scale(1.08);
	}
}

.navsi-video__btn:focus-visible {
	outline: 2px solid var(--navsi-red);
	outline-offset: 4px;
}

/* --- v2.2 : pages intérieures --- */

.navsi-item {
	border-top: 1px solid var(--navsi-line);
	padding-top: 24px !important;
	transition: border-color 0.3s var(--navsi-ease);
}

.navsi-item:hover {
	border-top-color: var(--navsi-red);
}

.navsi-item .navsi-muted a {
	display: inline-flex;
	margin-top: 6px;
}

.navsi-feature .navsi-list {
	margin-bottom: 8px;
}

@media (max-width: 1024px) {
	.navsi-feature--flip > .e-con:first-child {
		order: 2;
	}
}

.navsi-contact-big,
.navsi-contact-big a {
	font-family: var(--navsi-font-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: clamp(1.2rem, 1rem + 0.9vw, 1.7rem);
	color: var(--navsi-white) !important;
	text-decoration: none !important;
	word-break: break-word;
}

.navsi-contact-big .navsi-btn {
	font-family: var(--navsi-font-body);
	font-size: 0.95rem;
	font-stretch: 100%;
}

.navsi-social {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 22px;
	margin-top: 24px;
}

.navsi-social a {
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none !important;
	color: var(--navsi-muted) !important;
}

.navsi-social a::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-right: 8px;
	background: var(--navsi-red);
	transform: rotate(45deg);
	vertical-align: 0.15em;
}

.navsi-social a:hover {
	color: var(--navsi-white) !important;
}

/* Carte Google en noir et blanc, comme toutes les images du site */
.navsi-map iframe {
	filter: grayscale(1) invert(0.92) contrast(0.92) brightness(0.9);
	border-radius: 2px;
	min-height: 420px;
}

.navsi-map {
	height: 100%;
}

.navsi-form--panel {
	background: var(--navsi-surface);
	border: 1px solid var(--navsi-line);
	padding: clamp(20px, 3vw, 40px) !important;
	border-radius: 2px;
}

#reserver {
	scroll-margin-top: 90px;
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* --- v2.2.1 --- */

/* Timecode sous le losange (jamais dans l'en-tête), libellé caméra masqué */
.navsi-hm__tc {
	top: 100%;
	bottom: auto;
	left: 50%;
	transform: translate(-50%, 18px);
}

.navsi-hm__label {
	display: none;
}

/* Pages intérieures : losange plus petit et plus à droite, pour laisser respirer les titres */
.navsi-hero--page .navsi-hm {
	--cx: 77%;
	--cy: 50%;
	--r: min(29vh, 16vw);
}

@media (max-width: 1024px) {
	.navsi-hero--page .navsi-hm {
		--cx: 62%;
		--cy: 30%;
		--r: min(30vw, 18vh);
	}
}

@media (max-width: 767px) {
	.navsi-hero--page .navsi-hm {
		--cx: 60%;
		--cy: 27%;
		--r: min(28vw, 15vh);
	}
}

/* Fiches techniques : une seule colonne, sans case vide */
.navsi-slate.navsi-slate--card {
	grid-template-columns: 1fr;
}

/* --- v2.2.2 --- */

/* Les blocs image ne doivent jamais être comprimés par le flex d'Elementor */
body.navsi .e-con > .elementor-widget-shortcode:not(:has(.navsi-hm)) {
	flex: 0 0 auto !important;
	height: auto !important;
	min-height: 0;
}

/* Mobile : le losange s'empile au-dessus du titre, plus aucun chevauchement */
@media (max-width: 767px) {
	.navsi-hm,
	.navsi-hero--page .navsi-hm {
		--cx: 50%;
		--r: 27vw;
		--cy: calc(88px + 27vw);
	}

	body.navsi .elementor > .e-con.navsi-hero {
		padding-top: calc(88px + 54vw + 44px) !important;
		min-height: 0 !important;
	}

	.navsi-hero::after {
		background: linear-gradient(to top, rgba(11, 11, 12, 0.98) 0%, rgba(11, 11, 12, 0.9) 48%, rgba(11, 11, 12, 0.35) 78%, rgba(11, 11, 12, 0.55) 100%);
	}
}

/* Elementor passe les conteneurs en « wrap » sur mobile : en colonne, cela écrase
   la hauteur des images à ratio fixe. On garde le wrap uniquement pour les boutons. */
body.navsi .e-con.e-flex:not(.navsi-actions) {
	--flex-wrap: nowrap;
	--flex-wrap-mobile: nowrap;
	flex-wrap: nowrap !important;
}

/* ==========================================================================
   v2.3 — fiches v2, pied de page éditorial, menu mobile plein écran,
   transitions losange entre pages, apparitions au défilement
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fiches : hero viseur
   ----------------------------------------------------------------------- */

body.navsi .navsi-sp {
	flex: 1 1 100%;
	width: 100%;
	min-width: 0;
}

.navsi-sh {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	min-height: min(94vh, 1000px);
	padding: clamp(150px, 20vh, 230px) var(--navsi-gutter) clamp(44px, 7vh, 84px);
	box-sizing: border-box;
	background: var(--navsi-black);
}

.navsi-sh > .navsi-hm {
	z-index: 0;
}

.navsi-sh__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--navsi-max);
	margin-inline: auto;
}

.navsi-sh__inner > :not(.navsi-hero__meta) {
	max-width: min(58%, 780px);
}

.navsi-sh__title {
	margin: 0.15em 0 0.4em;
	font-family: var(--navsi-font-display);
	font-weight: 900;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 0.92;
	font-size: clamp(2.4rem, 1.1rem + 4.4vw, 6rem);
	color: var(--navsi-white);
	text-wrap: balance;
	overflow-wrap: break-word;
	hyphens: auto;
}

.navsi-sh--sm .navsi-sh__title {
	font-size: clamp(1.9rem, 1rem + 2.7vw, 4.1rem);
	line-height: 0.96;
}

.navsi-sh__lead {
	margin: 0 0 clamp(28px, 4vh, 44px);
}

.navsi-sh .navsi-hero__meta {
	margin-top: 8px;
}

.navsi-hero__meta a {
	color: var(--navsi-white) !important;
	text-decoration: none !important;
}

.navsi-hero__meta a::after {
	content: " ↗";
	color: var(--navsi-red);
}

@media (max-width: 1024px) {
	.navsi-sh {
		min-height: 92vh;
	}

	.navsi-sh__inner > :not(.navsi-hero__meta) {
		max-width: 100%;
	}
}

@media (max-width: 767px) {
	.navsi-sh {
		min-height: 0;
		padding-top: calc(88px + 54vw + 44px);
		padding-bottom: 36px;
	}

	.navsi-sh .navsi-hero__meta span:nth-child(n) {
		display: inline;
	}

	.navsi-sh .navsi-hero__meta {
		justify-content: space-between;
	}

	.navsi-sh .navsi-hero__meta span:not(:first-child):not(:last-child) {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   Fiches : sections
   ----------------------------------------------------------------------- */

.navsi-sp__sec {
	padding: clamp(64px, 9vw, 140px) 0 0;
}

.navsi-sp__sec--first {
	padding-top: clamp(48px, 6vw, 96px);
}

.navsi-sp__grid {
	display: grid;
	grid-template-columns: minmax(260px, 4fr) 7fr;
	gap: clamp(32px, 6vw, 112px);
	align-items: start;
}

.navsi-sp__aside {
	position: sticky;
	top: 110px;
}

.navsi-sp__slate {
	margin: 0;
	gap: 1px;
}

.navsi-sp__slate > div {
	background: var(--navsi-surface);
}

.navsi-sp__body {
	max-width: 68ch;
	font-size: 1.05rem;
	line-height: 1.75;
	color: rgba(244, 242, 238, 0.8);
}

.navsi-sp__body > p:first-child {
	margin-top: 0;
	font-size: var(--navsi-fs-lead);
	line-height: 1.55;
	color: var(--navsi-white);
}

.navsi-sp__body h2,
.navsi-sp__body h3 {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 2.4em 0 0.9em;
	font-family: var(--navsi-font-display);
	font-weight: 800;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	text-transform: uppercase;
	letter-spacing: 0.01em;
	font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.35rem);
	color: var(--navsi-white);
}

.navsi-sp__body h2::before,
.navsi-sp__body h3::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	background: var(--navsi-red);
	transform: rotate(45deg);
}

.navsi-sp__body ul {
	margin: 0 0 1.6em;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--navsi-line);
}

.navsi-sp__body ul li {
	position: relative;
	padding: 14px 0 14px 28px;
	border-bottom: 1px solid var(--navsi-line);
	color: var(--navsi-white);
}

.navsi-sp__body ul li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 1.35em;
	width: 6px;
	height: 6px;
	background: var(--navsi-red);
	transform: rotate(45deg);
}

.navsi-sp__body a {
	color: var(--navsi-white);
	text-decoration: underline;
	text-decoration-color: var(--navsi-red);
	text-underline-offset: 4px;
}

.navsi-sp__label {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: clamp(20px, 3vw, 32px);
	padding-top: 18px;
	border-top: 1px solid var(--navsi-line);
}

.navsi-sp__label .navsi-eyebrow,
.navsi-sp__label .navsi-meta {
	margin: 0 !important;
}

.navsi-sp__label a.navsi-meta {
	color: var(--navsi-white);
	text-decoration: none;
}

@media (max-width: 1024px) {
	.navsi-sp__grid {
		grid-template-columns: 1fr;
	}

	.navsi-sp__aside {
		position: static;
	}
}

/* Galerie « Sur le plateau » : mosaïque 8/4 · 4/8 · 6/6 */
.navsi-gal {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-auto-rows: clamp(220px, 30vw, 520px);
	gap: 12px;
}

.navsi-gal__item {
	position: relative;
	margin: 0;
	grid-column: span 6;
	min-width: 0;
}

.navsi-gal__item:nth-child(6n+1),
.navsi-gal__item:nth-child(6n+4) {
	grid-column: span 8;
}

.navsi-gal__item:nth-child(6n+2),
.navsi-gal__item:nth-child(6n+3) {
	grid-column: span 4;
}

.navsi-gal__item:last-child:nth-child(6n+3),
.navsi-gal__item:last-child:nth-child(6n+5) {
	grid-column: span 12;
}

.navsi-gal__item .navsi-reveal {
	height: 100%;
	aspect-ratio: auto;
}

.navsi-gal__id {
	position: absolute;
	left: 12px;
	bottom: 10px;
	z-index: 2;
	font-family: var(--navsi-font-mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	color: rgba(244, 242, 238, 0.78);
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
}

@media (hover: hover) {
	.navsi-gal__item:hover .navsi-reveal__color,
	.navsi-next__link:hover .navsi-reveal__color {
		clip-path: var(--navsi-diamond-full);
	}

	.navsi-gal__item:hover .navsi-reveal img {
		transform: scale(1.05);
	}
}

@media (max-width: 767px) {
	.navsi-gal {
		grid-template-columns: 1fr;
		grid-auto-rows: 62vw;
		gap: 8px;
	}

	.navsi-gal__item,
	.navsi-gal__item:nth-child(n) {
		grid-column: auto;
	}
}

/* CTA de fiche */
.navsi-sp-cta {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: min(78vh, 760px);
	margin-top: clamp(80px, 10vw, 160px);
	padding: clamp(80px, 10vw, 140px) var(--navsi-gutter);
	box-sizing: border-box;
	text-align: center;
}

.navsi-sp-cta::after {
	background: radial-gradient(ellipse 70% 70% at 50% 50%, rgba(11, 11, 12, 0.35), rgba(11, 11, 12, 0.85)) !important;
}

.navsi-sp-cta__inner {
	position: relative;
	z-index: 2;
	max-width: 900px;
}

.navsi-sp-cta__title {
	margin: 0 0 1.6rem;
	font-family: var(--navsi-font-display);
	font-weight: 900;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 0.95;
	font-size: clamp(2rem, 1rem + 3.6vw, 4.8rem);
	text-wrap: balance;
}

.navsi-sp-cta .navsi-cta__actions {
	justify-content: center;
}

/* Projet / épisode suivant : bandeau plein cadre */
.navsi-next__link {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: clamp(340px, 62vh, 660px);
	overflow: hidden;
	isolation: isolate;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
}

.navsi-next__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.navsi-next__media .navsi-reveal {
	height: 100%;
	aspect-ratio: auto;
	border-radius: 0;
}

.navsi-next__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(to top, rgba(11, 11, 12, 0.94) 0%, rgba(11, 11, 12, 0.35) 55%, rgba(11, 11, 12, 0.6) 100%);
}

.navsi-next__inner {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: end;
	gap: 18px 32px;
	width: 100%;
	max-width: var(--navsi-max);
	margin: 0 auto;
	padding: 0 var(--navsi-gutter) clamp(36px, 6vh, 72px);
	box-sizing: content-box;
}

.navsi-next__meta {
	grid-column: 1 / -1;
	display: flex;
	justify-content: space-between;
	padding-top: 16px;
	border-top: 1px solid rgba(244, 242, 238, 0.22);
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--navsi-muted);
}

.navsi-next__title {
	font-family: var(--navsi-font-display);
	font-weight: 900;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 0.92;
	font-size: clamp(2rem, 0.8rem + 4.6vw, 6rem);
	text-wrap: balance;
	transition: transform 0.7s var(--navsi-ease);
}

.navsi-next__go {
	position: relative;
	display: grid;
	place-items: center;
	width: clamp(56px, 6vw, 92px);
	aspect-ratio: 1;
	margin-bottom: 0.3em;
}

.navsi-next__go::before {
	content: "";
	position: absolute;
	inset: 14%;
	border: 1.5px solid var(--navsi-red);
	transform: rotate(45deg);
	transition: background 0.4s var(--navsi-ease), transform 0.7s var(--navsi-ease);
}

.navsi-next__go svg {
	position: relative;
	width: 38%;
	height: 38%;
	transition: transform 0.5s var(--navsi-ease);
}

@media (hover: hover) {
	.navsi-next__link:hover .navsi-next__title {
		transform: translateX(14px);
	}

	.navsi-next__link:hover .navsi-next__go::before {
		background: var(--navsi-red);
		transform: rotate(135deg);
	}

	.navsi-next__link:hover .navsi-next__go svg {
		transform: translateX(3px);
	}
}

@media (max-width: 767px) {
	.navsi-next__inner {
		grid-template-columns: 1fr;
	}

	.navsi-next__go {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   Pied de page éditorial
   ----------------------------------------------------------------------- */

.navsi-foot {
	position: relative;
	overflow: hidden;
	padding-top: clamp(72px, 9vw, 128px);
	background: var(--navsi-black);
	border-top: 1px solid var(--navsi-line);
}

.navsi-foot__top {
	display: grid;
	grid-template-columns: 1.35fr 1.3fr repeat(3, minmax(0, 1fr));
	gap: clamp(28px, 3.5vw, 56px);
}

.navsi-foot__logo img {
	display: block;
	width: 118px;
	height: auto;
}

.navsi-foot__baseline {
	max-width: 34ch;
	margin: 22px 0 28px;
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--navsi-muted);
}

.navsi-foot__h {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 18px;
	font-family: var(--navsi-font-mono);
	font-size: var(--navsi-fs-meta);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--navsi-muted);
}

.navsi-foot__h::before {
	content: "";
	width: 6px;
	height: 6px;
	background: var(--navsi-red);
	transform: rotate(45deg);
}

.navsi-foot__h--gap {
	margin-top: 36px;
}

.navsi-foot__list {
	display: grid;
	gap: 11px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.navsi-foot__list li {
	margin: 0;
	color: var(--navsi-white);
	font-size: 0.95rem;
}

.navsi-foot__list a {
	color: var(--navsi-white) !important;
	text-decoration: none !important;
	background: linear-gradient(var(--navsi-red), var(--navsi-red)) 0 100% / 0 1px no-repeat;
	transition: background-size 0.4s var(--navsi-ease);
}

.navsi-foot__list a:hover,
.navsi-foot__list .current-menu-item > a {
	background-size: 100% 1px;
}

.navsi-foot__list--big a {
	font-family: var(--navsi-font-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: clamp(1rem, 0.9rem + 0.3vw, 1.18rem);
	white-space: nowrap;
}

.navsi-foot__list--addr li {
	display: grid;
	gap: 3px;
}

.navsi-foot__list--addr .navsi-meta {
	margin: 0;
	font-size: 10px;
}

.navsi-foot__arrow::after {
	content: " ↗";
	color: var(--navsi-red);
}

/* Signature : NAVSI au trait, la couleur n'apparaît que dans le losange */
.navsi-foot__mark {
	--mx: 50%;
	--my: 50%;
	--mr: 0px;
	position: relative;
	margin-top: clamp(64px, 8vw, 120px);
	margin-bottom: calc(-0.07 * min(20.5vw, 330px));
	user-select: none;
	-webkit-user-select: none;
}

.navsi-foot__word {
	display: block;
	text-align: center;
	white-space: nowrap;
	font-family: var(--navsi-font-display);
	font-weight: 900;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	font-size: min(20.5vw, 330px);
	line-height: 0.8;
	letter-spacing: -0.03em;
}

.navsi-foot__word--line {
	color: transparent;
	-webkit-text-stroke: 1px rgba(244, 242, 238, 0.2);
}

.navsi-foot__word--fill {
	position: absolute;
	inset: 0;
	color: var(--navsi-red);
	background: var(--navsi-mark-img, none) center 40% / cover, var(--navsi-red);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	clip-path: polygon(var(--mx) calc(var(--my) - var(--mr)), calc(var(--mx) + var(--mr)) var(--my), var(--mx) calc(var(--my) + var(--mr)), calc(var(--mx) - var(--mr)) var(--my));
}

body.navsi .site-footer,
body.navsi .site-below-footer-wrap {
	position: relative;
	z-index: 1;
	border-top: 0;
}

body.navsi .site-below-footer-wrap {
	border-top: 1px solid var(--navsi-line);
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body.navsi .site-below-footer-wrap .ast-footer-copyright,
body.navsi .site-below-footer-wrap .menu-link {
	font-size: 11px !important;
	color: var(--navsi-muted) !important;
}

@media (max-width: 1024px) {
	.navsi-foot__top {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 40px 24px;
	}

	.navsi-foot__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 767px) {
	.navsi-foot__word {
		font-size: 21vw;
	}

	.navsi-foot__mark {
		margin-bottom: -1.5vw;
	}
}

/* --------------------------------------------------------------------------
   Menu mobile plein écran
   ----------------------------------------------------------------------- */

body.navsi #ast-mobile-popup .ast-mobile-popup-inner,
body.navsi #ast-mobile-popup.active .ast-mobile-popup-inner {
	max-width: none;
	width: 100%;
	opacity: 1;
	transform: none;
	color: var(--navsi-white);
	background:
		radial-gradient(ellipse 90% 45% at 100% 0%, rgba(229, 52, 54, 0.13), transparent 65%),
		var(--navsi-black) !important;
	box-shadow: none;
	clip-path: polygon(calc(100% - 44px) 44px, calc(100% - 44px) 44px, calc(100% - 44px) 44px, calc(100% - 44px) 44px);
	transition: clip-path 0.55s var(--navsi-ease);
}

body.navsi #ast-mobile-popup.active .ast-mobile-popup-inner {
	clip-path: polygon(calc(100% - 44px) -260vh, calc(100% + 260vh) 44px, calc(100% - 44px) 260vh, calc(-260vh) 44px);
	transition: clip-path 0.8s var(--navsi-ease);
}

body.navsi #ast-mobile-popup .ast-mobile-popup-overlay {
	display: none;
}

body.navsi #ast-mobile-popup .ast-mobile-popup-header {
	align-items: center;
	min-height: 76px;
	padding: 12px var(--navsi-gutter) 0;
}

body.navsi #ast-mobile-popup .ast-mobile-popup-header::before {
	content: "Menu";
	margin-right: auto;
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--navsi-muted);
}

body.navsi #ast-mobile-popup .menu-toggle-close {
	position: relative;
	width: 52px;
	height: 52px;
	padding: 0;
	justify-content: center;
	align-items: center;
	color: var(--navsi-white) !important;
}

body.navsi #ast-mobile-popup .menu-toggle-close::before {
	content: "";
	position: absolute;
	inset: 9px;
	border: 1.5px solid var(--navsi-red);
	transform: rotate(45deg);
}

body.navsi #ast-mobile-popup .menu-toggle-close svg {
	position: relative;
	width: 18px;
	height: 18px;
}

body.navsi #ast-mobile-popup .ast-mobile-popup-content {
	display: flex;
	flex-direction: column;
	gap: 26px;
	flex: 1;
	overflow-y: auto;
	padding: 8px var(--navsi-gutter) 36px;
}

body.navsi #ast-mobile-popup .ast-builder-menu-mobile,
body.navsi #ast-mobile-popup .main-header-bar-navigation,
body.navsi #ast-mobile-popup .main-navigation,
body.navsi #ast-mobile-popup .main-header-menu {
	width: 100%;
	background: transparent !important;
}

body.navsi #ast-hf-mobile-menu {
	counter-reset: navsi-mm;
	border-top: 1px solid var(--navsi-line);
}

body.navsi #ast-hf-mobile-menu > .menu-item {
	border: 0 !important;
	border-bottom: 1px solid var(--navsi-line) !important;
}

body.navsi #ast-hf-mobile-menu > .menu-item > .menu-link {
	display: flex !important;
	align-items: baseline;
	gap: 14px;
	padding: 15px 44px 15px 0 !important;
	border: 0 !important;
	font-family: var(--navsi-font-display) !important;
	font-weight: 800 !important;
	font-stretch: 125%;
	font-variation-settings: "wdth" 125;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	font-size: clamp(1.45rem, 6.6vw, 2.4rem) !important;
	line-height: 1.02;
	color: var(--navsi-white) !important;
	background: transparent !important;
	box-shadow: none !important;
}

body.navsi #ast-hf-mobile-menu > .menu-item > .menu-link::before {
	counter-increment: navsi-mm;
	content: counter(navsi-mm, decimal-leading-zero);
	flex: none;
	width: 22px;
	font-family: var(--navsi-font-mono);
	font-size: 10px;
	font-weight: 500;
	font-stretch: 100%;
	letter-spacing: 0.1em;
	color: var(--navsi-muted);
	transform: translateY(-1.1em);
}

body.navsi #ast-hf-mobile-menu > .current-menu-item > .menu-link::after,
body.navsi #ast-hf-mobile-menu > .current-menu-ancestor > .menu-link::after {
	content: "";
	flex: none;
	align-self: center;
	width: 9px;
	height: 9px;
	margin-left: 4px;
	background: var(--navsi-red);
	transform: rotate(45deg);
}

body.navsi #ast-hf-mobile-menu .dropdown-menu-toggle {
	display: none !important;
}

body.navsi #ast-mobile-popup .ast-menu-toggle {
	top: 14px !important;
	right: 0 !important;
	width: 44px;
	height: 44px;
	color: var(--navsi-white) !important;
	background: transparent !important;
	border: 0 !important;
}

body.navsi #ast-mobile-popup .ast-menu-toggle .ast-icon svg {
	margin-top: 0;
	fill: currentColor;
}

body.navsi #ast-hf-mobile-menu .sub-menu {
	padding: 0 0 14px 36px !important;
	border: 0 !important;
}

body.navsi #ast-hf-mobile-menu .sub-menu .menu-link {
	padding: 7px 0 !important;
	border: 0 !important;
	font-family: var(--navsi-font-body) !important;
	font-size: 1rem !important;
	color: var(--navsi-muted) !important;
	background: transparent !important;
}

body.navsi #ast-hf-mobile-menu .sub-menu .menu-link .ast-icon,
body.navsi #ast-hf-mobile-menu .sub-menu .menu-link::before {
	display: none;
}

body.navsi #ast-mobile-popup .ast-header-button-1 {
	padding: 0 !important;
}

body.navsi #ast-mobile-popup .ast-header-button-1 .ast-custom-button {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 17px 20px !important;
	font-size: 1rem;
}

body.navsi #ast-mobile-popup .ast-header-button-1 .ast-builder-button-wrap,
body.navsi #ast-mobile-popup .ast-header-button-1 .ast-custom-button-link {
	display: block;
	width: 100%;
}

body.navsi #ast-mobile-popup .ast-header-html-1 {
	padding: 0 !important;
	margin-top: auto;
}

.navsi-mm-contact {
	display: grid;
	gap: 8px;
	padding-top: 20px;
	border-top: 1px solid var(--navsi-line);
}

.navsi-mm-contact .navsi-meta {
	margin: 0 0 4px;
}

.navsi-mm-contact a {
	font-family: var(--navsi-font-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
}

.navsi-mm-contact p {
	display: contents;
}

/* Entrée en cascade des éléments du menu */
body.navsi #ast-mobile-popup #ast-hf-mobile-menu > .menu-item,
body.navsi #ast-mobile-popup .ast-mobile-popup-content > .ast-builder-layout-element:not(.ast-builder-menu) {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item,
body.navsi #ast-mobile-popup.active .ast-mobile-popup-content > .ast-builder-layout-element:not(.ast-builder-menu) {
	opacity: 1;
	transform: none;
	transition: opacity 0.6s var(--navsi-ease), transform 0.8s var(--navsi-ease);
}

body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(1) { transition-delay: 0.16s; }
body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(2) { transition-delay: 0.2s; }
body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(3) { transition-delay: 0.24s; }
body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(4) { transition-delay: 0.28s; }
body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(5) { transition-delay: 0.32s; }
body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(6) { transition-delay: 0.36s; }
body.navsi #ast-mobile-popup.active #ast-hf-mobile-menu > .menu-item:nth-child(n+7) { transition-delay: 0.4s; }
body.navsi #ast-mobile-popup.active .ast-mobile-popup-content > .ast-builder-layout-element:not(.ast-builder-menu) { transition-delay: 0.44s; }

/* --------------------------------------------------------------------------
   Transition entre pages : la nouvelle page s'ouvre dans le losange,
   l'ancienne repasse en noir et blanc (Chrome, Edge, Safari 18.2+).
   ----------------------------------------------------------------------- */

@view-transition {
	navigation: auto;
}

::view-transition-old(root) {
	animation: navsi-vt-out 0.7s var(--navsi-ease) both;
}

::view-transition-new(root) {
	animation: navsi-vt-in 0.85s var(--navsi-ease) both;
}

@keyframes navsi-vt-in {
	from { clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%); }
	to { clip-path: polygon(50% -55%, 155% 50%, 50% 155%, -55% 50%); }
}

@keyframes navsi-vt-out {
	to {
		opacity: 0.4;
		transform: scale(0.97);
		filter: grayscale(1) brightness(0.6);
	}
}

/* --------------------------------------------------------------------------
   Apparitions au défilement (classes posées par navsi.js, sous la ligne de flottaison uniquement)
   ----------------------------------------------------------------------- */

.navsi-r {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition: opacity 0.9s var(--navsi-ease) var(--d, 0s), transform 1.1s var(--navsi-ease) var(--d, 0s);
}

.navsi-r.is-in {
	opacity: 1;
	transform: none;
}

/* Les images se dévoilent de bas en haut */
.navsi-r .navsi-reveal:not(.navsi-reveal--losange) {
	clip-path: inset(100% 0 0 0);
	transition: clip-path 1.2s var(--navsi-ease) calc(var(--d, 0s) + 0.1s);
}

.navsi-r.is-in .navsi-reveal:not(.navsi-reveal--losange) {
	clip-path: inset(0 0 0 0);
}

/* Le cadre losange se trace */
.navsi-r .navsi-reveal__frame .navsi-frame__line {
	stroke-dasharray: 100;
	stroke-dashoffset: 100;
	transition: stroke-dashoffset 1.6s var(--navsi-ease) calc(var(--d, 0s) + 0.2s);
}

.navsi-r.is-in .navsi-reveal__frame .navsi-frame__line {
	stroke-dashoffset: 0;
}

@media (prefers-reduced-motion: reduce) {
	@view-transition {
		navigation: none;
	}

	body.navsi #ast-mobile-popup .ast-mobile-popup-inner,
	body.navsi #ast-mobile-popup.active .ast-mobile-popup-inner {
		clip-path: none;
		transition: none;
	}

	body.navsi #ast-mobile-popup #ast-hf-mobile-menu > .menu-item,
	body.navsi #ast-mobile-popup .ast-mobile-popup-content > .ast-builder-layout-element {
		opacity: 1 !important;
		transform: none !important;
	}
}

@media print {
	.navsi-r,
	.navsi-r .navsi-reveal {
		opacity: 1 !important;
		transform: none !important;
		clip-path: none !important;
	}
}

/* v2.3 : ajustements menu mobile */
body.navsi #ast-hf-mobile-menu > .menu-item > .menu-link {
	font-size: clamp(1.3rem, 6vw, 2.3rem) !important;
}

body.navsi #ast-hf-mobile-menu .sub-menu .menu-item {
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	min-height: 0 !important;
}

body.navsi #ast-hf-mobile-menu .sub-menu .menu-link {
	line-height: 1.4 !important;
	padding: 8px 0 !important;
}

body.navsi #ast-mobile-popup button:focus:not(:focus-visible),
body.navsi #ast-mobile-popup a:focus:not(:focus-visible),
body.navsi .menu-toggle:focus:not(:focus-visible) {
	outline: 0 !important;
}

body.navsi #ast-mobile-popup :focus-visible {
	outline: 2px solid var(--navsi-red) !important;
	outline-offset: 2px;
}

@media (max-width: 767px) {
	.navsi-sp__label span.navsi-meta {
		display: none;
	}
}

/* L'en-tête et le bouton WhatsApp restent fixes pendant la transition losange */
body.navsi #masthead {
	view-transition-name: navsi-header;
}

body.navsi .navsi-wa {
	view-transition-name: navsi-wa;
}

::view-transition-group(navsi-header),
::view-transition-group(navsi-wa) {
	animation-duration: 0.45s;
	z-index: 10;
}

/* v2.4 : une ou deux vidéos par fiche, formats verticaux (reels) */
.navsi-films {
	display: grid;
	gap: clamp(16px, 2.5vw, 32px);
	margin: 0;
}

.navsi-films--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.navsi-films:has(.navsi-video--portrait) {
	max-width: 880px;
	margin-inline: auto;
}

.navsi-films--1:has(.navsi-video--portrait) {
	max-width: 440px;
}

.navsi-films__item {
	margin: 0;
	min-width: 0;
}

.navsi-films__item figcaption {
	display: grid;
	gap: 6px;
	margin-top: 14px;
	font-size: 0.95rem;
	line-height: 1.5;
	color: rgba(244, 242, 238, 0.82);
}

.navsi-films__item figcaption .navsi-meta {
	margin: 0;
}

.navsi-video--portrait video {
	object-fit: cover;
}

@media (max-width: 767px) {
	.navsi-films--2 {
		grid-template-columns: 1fr;
	}

	.navsi-films:has(.navsi-video--portrait) {
		max-width: 420px;
	}
}

/* ==========================================================================
   v3 — CLARTÉ « AGENCE »
   Une seule apparition du losange par écran, deux niveaux de titres,
   la couleur pour le travail, moins d'éléments, plus d'air.
   ========================================================================== */

:root {
	--navsi-section: clamp(96px, 11vw, 168px);
	--navsi-section-lg: clamp(128px, 15vw, 240px);
}

/* --- Règle du losange --------------------------------------------------- */

body.navsi .elementor > .e-con.navsi-rule::after {
	display: none;
}

.navsi-rule {
	border-top: 0 !important;
}

.navsi-h2 .navsi-glyph,
.navsi-sel__title .navsi-glyph {
	display: none;
}

/* Les anciens visuels losange deviennent des images rectangulaires sobres */
.navsi-visual--losange {
	max-width: none;
}

.navsi-visual--losange .navsi-reveal {
	aspect-ratio: 4 / 5 !important;
}

.navsi-visual--losange .navsi-reveal__base,
.navsi-visual--losange .navsi-reveal__color {
	clip-path: none !important;
}

.navsi-visual--losange .navsi-reveal__color,
.navsi-visual--losange .navsi-reveal__frame {
	display: none;
}

.navsi-visual figcaption {
	text-align: left;
}

/* --- Deux niveaux de titres --------------------------------------------- */

.navsi-h2,
.navsi-h2 .elementor-heading-title {
	font-weight: 600 !important;
	font-stretch: 100% !important;
	font-variation-settings: "wdth" 100 !important;
	text-transform: none !important;
	letter-spacing: -0.03em !important;
	line-height: 1.04 !important;
	font-size: clamp(2rem, 1.2rem + 2.6vw, 3.6rem) !important;
	text-wrap: balance;
}

.navsi-manifesto,
.navsi-manifesto .elementor-heading-title {
	font-family: var(--navsi-font-display) !important;
	font-weight: 500 !important;
	font-stretch: 100%;
	text-transform: none !important;
	letter-spacing: -0.035em !important;
	line-height: 1.08 !important;
	font-size: clamp(2rem, 1rem + 3.6vw, 4.6rem) !important;
	color: var(--navsi-white) !important;
	max-width: 22ch;
	text-wrap: balance;
}

.navsi-manifesto em {
	font-style: normal;
	color: var(--navsi-muted);
}

/* --- La couleur pour le travail ----------------------------------------- */

.navsi-card .navsi-reveal__base img,
.navsi-gal__item .navsi-reveal__base img,
.navsi-next__media .navsi-reveal__base img,
.navsi-films .navsi-reveal__base img,
.navsi-sp__sec--film .navsi-reveal__base img {
	filter: none;
}

.navsi-card .navsi-reveal__color,
.navsi-gal__item .navsi-reveal__color,
.navsi-next__media .navsi-reveal__color,
.navsi-films .navsi-reveal__color,
.navsi-sp__sec--film .navsi-reveal__color {
	display: none;
}

.navsi-card .navsi-reveal,
.navsi-gal__item .navsi-reveal {
	background: var(--navsi-surface);
}

/* --- Cartes allégées : image, titre, une ligne --------------------------- */

.navsi-card__play,
.navsi-card__body .navsi-meta {
	display: none !important;
}

.navsi-card__body {
	padding-top: 16px;
}

.navsi-card__title {
	margin: 0 0 4px !important;
	font-size: clamp(1.05rem, 1rem + 0.3vw, 1.25rem);
	font-weight: 600;
	font-stretch: 100%;
	font-variation-settings: "wdth" 100;
	letter-spacing: -0.01em;
}

.navsi-card__tag {
	color: var(--navsi-muted);
	font-size: 0.9rem;
	margin: 0;
}

.navsi-card--vedette .navsi-card__title {
	font-size: clamp(1.8rem, 1rem + 3vw, 3.8rem);
}

/* --- Projets sélectionnés (accueil) ------------------------------------- */

.navsi-sel {
	display: grid;
	gap: clamp(64px, 9vw, 140px);
}

.navsi-sel__link {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 20px clamp(16px, 2vw, 32px);
	align-items: end;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
}

.navsi-sel__media {
	position: relative;
	overflow: hidden;
	border-radius: 2px;
}

.navsi-sel__media .navsi-reveal {
	aspect-ratio: 16 / 10;
}

.navsi-sel__item--full .navsi-sel__media {
	grid-column: 1 / -1;
}

.navsi-sel__item--full .navsi-sel__media .navsi-reveal {
	aspect-ratio: 21 / 9;
}

.navsi-sel__item--full .navsi-sel__body {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: baseline;
	gap: 24px;
}

.navsi-sel__item--l .navsi-sel__media {
	grid-column: 1 / 9;
}

.navsi-sel__item--l .navsi-sel__body {
	grid-column: 9 / 13;
}

.navsi-sel__item--r .navsi-sel__media {
	grid-column: 5 / 13;
	grid-row: 1;
}

.navsi-sel__item--r .navsi-sel__body {
	grid-column: 1 / 5;
	grid-row: 1;
	text-align: right;
}

.navsi-sel__num {
	display: block;
	margin-bottom: 14px;
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	color: var(--navsi-red);
}

.navsi-sel__title {
	margin: 0 0 10px !important;
	font-family: var(--navsi-font-display);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	font-size: clamp(1.8rem, 1rem + 2.4vw, 3.4rem);
	color: var(--navsi-white);
	text-wrap: balance;
}

.navsi-sel__line {
	margin: 0;
	color: var(--navsi-muted);
	font-size: 0.95rem;
}

.navsi-sel__item--full .navsi-sel__num {
	margin: 0;
}

.navsi-sel__item--full .navsi-sel__title {
	font-size: clamp(2.2rem, 1rem + 4vw, 5.2rem);
	margin: 0 !important;
}

.navsi-sel__media img {
	transition: transform 1.2s var(--navsi-ease);
}

@media (hover: hover) {
	.navsi-sel__link:hover .navsi-sel__media img {
		transform: scale(1.035);
	}
}

@media (max-width: 900px) {
	.navsi-sel__link,
	.navsi-sel__item--full .navsi-sel__body {
		display: block;
	}

	.navsi-sel__body {
		margin-top: 18px;
		text-align: left !important;
	}

	.navsi-sel__media .navsi-reveal,
	.navsi-sel__item--full .navsi-sel__media .navsi-reveal {
		aspect-ratio: 4 / 3;
	}

	.navsi-sel__item--full .navsi-sel__num {
		margin-bottom: 12px;
	}

	.navsi-sel__item--full .navsi-sel__line {
		margin-top: 8px;
	}
}

/* --- Index des services -------------------------------------------------- */

.navsi-idx {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--navsi-line);
}

.navsi-idx__item {
	margin: 0;
	border-bottom: 1px solid var(--navsi-line);
}

.navsi-idx__row {
	display: grid;
	grid-template-columns: 64px minmax(0, 1.1fr) minmax(0, 1fr) 48px;
	align-items: center;
	gap: 24px;
	padding: clamp(24px, 3vw, 40px) 0;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
	transition: padding 0.5s var(--navsi-ease), color 0.3s;
}

.navsi-idx__num {
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	color: var(--navsi-muted);
}

.navsi-idx__title {
	font-family: var(--navsi-font-display);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	font-size: clamp(1.8rem, 1rem + 2.6vw, 3.8rem);
}

.navsi-idx__desc {
	color: var(--navsi-muted);
	font-size: 0.98rem;
	line-height: 1.55;
	max-width: 42ch;
}

.navsi-idx__go {
	justify-self: end;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--navsi-line);
	border-radius: 50%;
	transition: background 0.3s, border-color 0.3s, transform 0.5s var(--navsi-ease);
}

.navsi-idx__go svg {
	width: 18px;
	height: 18px;
}

@media (hover: hover) {
	.navsi-idx:hover .navsi-idx__row {
		color: rgba(244, 242, 238, 0.35) !important;
	}

	.navsi-idx .navsi-idx__row:hover {
		color: var(--navsi-white) !important;
		padding-left: 16px;
	}

	.navsi-idx__row:hover .navsi-idx__go {
		background: var(--navsi-red);
		border-color: var(--navsi-red);
		transform: rotate(-45deg);
	}
}

@media (max-width: 767px) {
	.navsi-idx__row {
		grid-template-columns: 40px 1fr 36px;
		gap: 8px 12px;
	}

	.navsi-idx__desc {
		grid-column: 2 / 3;
		font-size: 0.92rem;
	}

	.navsi-idx__go {
		grid-row: 1;
		grid-column: 3;
		width: 36px;
		height: 36px;
	}
}

/* --- Mur de références --------------------------------------------------- */

.navsi-wall {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--navsi-line);
	border-left: 1px solid var(--navsi-line);
}

.navsi-wall__cell {
	display: grid;
	place-items: center;
	min-height: clamp(96px, 9vw, 140px);
	margin: 0;
	padding: 16px;
	border-right: 1px solid var(--navsi-line);
	border-bottom: 1px solid var(--navsi-line);
	text-align: center;
	font-family: var(--navsi-font-display);
	font-weight: 600;
	font-stretch: 112%;
	font-size: clamp(0.92rem, 0.85rem + 0.35vw, 1.15rem);
	letter-spacing: -0.01em;
	color: var(--navsi-muted);
	transition: color 0.3s, background 0.3s;
}

.navsi-wall__cell img {
	max-width: 70%;
	max-height: 44px;
	filter: grayscale(1) brightness(2);
	opacity: 0.6;
	transition: opacity 0.3s;
}

.navsi-wall__cell:hover {
	color: var(--navsi-white);
	background: var(--navsi-surface);
}

.navsi-wall__cell:hover img {
	opacity: 1;
}

@media (max-width: 767px) {
	.navsi-wall {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* --- Curseur « Voir » et image flottante -------------------------------- */

.navsi-cursor,
.navsi-float {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9998;
	pointer-events: none;
	will-change: transform;
}

.navsi-cursor__label {
	position: absolute;
	left: 0;
	top: 0;
	display: grid;
	place-items: center;
	width: 84px;
	height: 84px;
	margin: -42px 0 0 -42px;
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #fff;
	opacity: 0;
	transform: scale(0.4);
	transition: opacity 0.3s, transform 0.45s var(--navsi-ease);
}

.navsi-cursor__label::before {
	content: "";
	position: absolute;
	inset: 10px;
	z-index: -1;
	background: var(--navsi-red);
	transform: rotate(45deg);
}

.navsi-cursor.is-on .navsi-cursor__label {
	opacity: 1;
	transform: scale(1);
}

.navsi-float {
	width: clamp(240px, 22vw, 360px);
	aspect-ratio: 4 / 3;
	margin: 0;
}

.navsi-float img,
.navsi-float video {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 2px;
	transform: translate(-50%, -50%) scale(0.85);
	opacity: 0;
	transition: opacity 0.35s, transform 0.6s var(--navsi-ease);
}

.navsi-float.is-on img,
.navsi-float.is-on.has-video video {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1);
}

.navsi-float.has-video img {
	opacity: 0 !important;
}

@media (hover: none), (prefers-reduced-motion: reduce) {
	.navsi-cursor,
	.navsi-float {
		display: none;
	}
}

/* --- Réalisations : vue Grille / Liste ---------------------------------- */

.navsi-work {
	position: relative;
}

.navsi-view {
	position: absolute;
	right: 0;
	top: 0;
	display: flex;
	gap: 4px;
}

.navsi-view__btn {
	padding: 8px 14px !important;
	background: transparent !important;
	border: 1px solid var(--navsi-line) !important;
	border-radius: 999px !important;
	font-family: var(--navsi-font-mono) !important;
	font-size: 11px !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--navsi-muted) !important;
	cursor: pointer;
}

.navsi-view__btn[aria-pressed="true"] {
	color: var(--navsi-white) !important;
	border-color: var(--navsi-white) !important;
}

.navsi-rows {
	display: none;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--navsi-line);
}

.navsi-work[data-view="list"] .navsi-rows {
	display: block;
}

.navsi-work[data-view="list"] .navsi-grid {
	display: none;
}

.navsi-rows__item {
	margin: 0;
	border-bottom: 1px solid var(--navsi-line);
}

.navsi-rows__item[hidden] {
	display: none;
}

.navsi-rows__row {
	display: grid;
	grid-template-columns: 48px minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1.2fr) 56px;
	align-items: baseline;
	gap: 20px;
	padding: 22px 0;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
	transition: color 0.3s, padding 0.5s var(--navsi-ease);
}

.navsi-rows__num,
.navsi-rows__year {
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.12em;
	color: var(--navsi-muted);
}

.navsi-rows__year {
	text-align: right;
}

.navsi-rows__title {
	font-family: var(--navsi-font-display);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	font-size: clamp(1.6rem, 1rem + 2.2vw, 3.2rem);
}

.navsi-rows__client,
.navsi-rows__format {
	font-size: 0.92rem;
	color: var(--navsi-muted);
}

@media (hover: hover) {
	.navsi-rows:hover .navsi-rows__row {
		color: rgba(244, 242, 238, 0.32) !important;
	}

	.navsi-rows .navsi-rows__row:hover {
		color: var(--navsi-white) !important;
		padding-left: 14px;
	}
}

@media (max-width: 767px) {
	.navsi-view {
		position: static;
		margin-bottom: 16px;
	}

	.navsi-rows__row {
		grid-template-columns: 32px 1fr;
		gap: 4px 12px;
	}

	.navsi-rows__client,
	.navsi-rows__format {
		grid-column: 2;
	}

	.navsi-rows__year {
		display: none;
	}
}

/* --- En-tête fixe : se compacte, se range en descendant, revient en remontant --- */

body.navsi #masthead {
	position: fixed !important;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	right: 0;
	z-index: 999;
	transition: transform 0.5s var(--navsi-ease);
}

body.navsi #masthead .main-header-bar,
body.navsi #masthead .ast-primary-header-bar {
	transition: background 0.4s, min-height 0.4s var(--navsi-ease), backdrop-filter 0.4s;
}

body.navsi.navsi-scrolled #masthead .main-header-bar,
body.navsi.navsi-scrolled #masthead .ast-primary-header-bar {
	background: rgba(11, 11, 12, 0.78) !important;
	-webkit-backdrop-filter: saturate(140%) blur(16px);
	backdrop-filter: saturate(140%) blur(16px);
	border-bottom: 1px solid var(--navsi-line) !important;
}

body.navsi #masthead .site-primary-header-wrap {
	transition: min-height 0.4s var(--navsi-ease);
}

body.navsi.navsi-scrolled #masthead .site-primary-header-wrap {
	min-height: 64px !important;
}

body.navsi .site-header .custom-logo {
	transition: max-height 0.4s var(--navsi-ease);
}

body.navsi.navsi-scrolled .site-header .custom-logo {
	max-height: 40px;
}

body.navsi.navsi-hdr-hidden #masthead {
	transform: translateY(-110%);
}

body.navsi:not(.ast-theme-transparent-header) #content {
	padding-top: 88px;
}

/* --- WhatsApp : icône seule ; barre d'action sur mobile ----------------- */

.navsi-wa {
	width: 52px;
	height: 52px;
	padding: 0 !important;
	justify-content: center;
}

.navsi-wa span {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.navsi-wa svg {
	width: 22px;
	height: 22px;
}

.navsi-mbar {
	display: none;
}

@media (max-width: 767px) {
	.navsi-wa {
		display: none !important;
	}

	.navsi-mbar {
		position: fixed;
		left: 12px;
		right: 12px;
		bottom: calc(12px + env(safe-area-inset-bottom));
		z-index: 998;
		display: flex;
		gap: 8px;
		padding: 8px;
		background: rgba(18, 18, 20, 0.88);
		-webkit-backdrop-filter: blur(16px);
		backdrop-filter: blur(16px);
		border: 1px solid var(--navsi-line);
		border-radius: 14px;
		transform: translateY(140%);
		transition: transform 0.5s var(--navsi-ease);
	}

	.navsi-mbar.is-on {
		transform: none;
	}

	.navsi-mbar__main {
		flex: 1;
		justify-content: center;
		border-radius: 8px !important;
	}

	.navsi-mbar__wa {
		display: grid;
		place-items: center;
		width: 50px;
		border: 1px solid var(--navsi-line);
		border-radius: 8px;
		color: #25d366 !important;
	}

	.navsi-mbar__wa svg {
		width: 22px;
		height: 22px;
	}

	body.ast-popup-nav-open .navsi-mbar {
		display: none;
	}
}

/* --- Fiches : brief, réponse, générique --------------------------------- */

.navsi-case {
	display: grid;
	gap: 28px;
	margin-bottom: 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid var(--navsi-line);
}

.navsi-case__part p {
	margin: 0;
}

.navsi-sp__body .navsi-case__h {
	display: block;
	margin: 0 0 10px;
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	font-weight: 500;
	font-stretch: 100%;
	letter-spacing: 0.14em;
	color: var(--navsi-red);
}

.navsi-sp__body .navsi-case__h::before {
	content: none;
}

.navsi-case__part:first-child p {
	font-size: var(--navsi-fs-lead);
	line-height: 1.55;
	color: var(--navsi-white);
}

.navsi-sp__credits-h {
	margin-top: 32px !important;
}

.navsi-credits {
	margin: 0;
	display: grid;
	gap: 10px;
}

.navsi-credits div {
	display: grid;
	gap: 2px;
}

.navsi-credits dt {
	font-family: var(--navsi-font-mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--navsi-muted);
}

.navsi-credits dd {
	margin: 0;
	color: var(--navsi-white);
	font-size: 0.95rem;
}

/* --- Hero vidéo : couleur dans le losange, voile N&B partout ailleurs ---- */

.navsi-hm__media video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.navsi-hm__veil {
	position: absolute;
	inset: 0;
	z-index: 1;
	-webkit-backdrop-filter: grayscale(1) contrast(1.12) brightness(0.62);
	backdrop-filter: grayscale(1) contrast(1.12) brightness(0.62);
	clip-path: polygon(evenodd,
		0 0, 100% 0, 100% 100%, 0 100%, 0 0,
		var(--cx) calc(var(--cy) - var(--r)),
		calc(var(--cx) + var(--r)) var(--cy),
		var(--cx) calc(var(--cy) + var(--r)),
		calc(var(--cx) - var(--r)) var(--cy),
		var(--cx) calc(var(--cy) - var(--r)));
	animation: navsi-veil 1.6s var(--navsi-ease) 0.4s both;
}

@keyframes navsi-veil {
	from {
		clip-path: polygon(evenodd,
			0 0, 100% 0, 100% 100%, 0 100%, 0 0,
			var(--cx) var(--cy), var(--cx) var(--cy), var(--cx) var(--cy), var(--cx) var(--cy), var(--cx) var(--cy));
	}
}

@media (prefers-reduced-motion: reduce) {
	.navsi-hm__veil {
		animation: none;
	}
}

/* --- Lenis --------------------------------------------------------------- */

html.lenis,
html.lenis body {
	height: auto;
}

html.lenis {
	scroll-behavior: auto !important;
}

.lenis.lenis-smooth iframe {
	pointer-events: none;
}

.lenis.lenis-stopped {
	overflow: clip;
}

/* --- Rythme ------------------------------------------------------------- */

.navsi-section--lg {
	padding-top: var(--navsi-section-lg) !important;
	padding-bottom: var(--navsi-section-lg) !important;
}

.navsi-headline {
	display: flex !important;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
}

.navsi-textlink a,
a.navsi-textlink {
	font-family: var(--navsi-font-mono);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
	border-bottom: 1px solid var(--navsi-red);
	padding-bottom: 4px;
}

@media (max-width: 767px) {
	body.navsi .e-con.navsi-headline {
		flex-direction: column !important;
		align-items: flex-start !important;
	}
}

.navsi-idx,
.navsi-wall,
.navsi-rows,
.navsi-sel {
	padding-left: 0 !important;
	margin-left: 0 !important;
}

.navsi-textlink a,
a.navsi-textlink {
	white-space: nowrap;
}

@media (max-width: 767px) {
	#ast-scroll-top {
		bottom: calc(92px + env(safe-area-inset-bottom)) !important;
	}
}

/* Numéros de liste : chiffres simples (le losange reste rare) */
.navsi-index .elementor-heading-title {
	display: block !important;
	width: auto !important;
	height: auto !important;
	font-family: var(--navsi-font-mono) !important;
	font-size: 11px !important;
	letter-spacing: 0.14em !important;
	color: var(--navsi-red) !important;
}

.navsi-index .elementor-heading-title::before,
.navsi-index .elementor-heading-title::after {
	display: none !important;
}

/* --- Savoir-faire v3.1 : panneaux d'images ------------------------------ */

.navsi-panels {
	display: flex;
	gap: 10px;
	height: clamp(520px, 74vh, 760px);
}

.navsi-panel {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	overflow: hidden;
	border-radius: 2px;
	color: var(--navsi-white) !important;
	text-decoration: none !important;
	background: var(--navsi-surface);
	transition: flex-grow 0.9s var(--navsi-ease);
	isolation: isolate;
}

.navsi-panel.is-active {
	flex-grow: 3.4;
}

.navsi-panel__media,
.navsi-panel__media img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
}

.navsi-panel__media img {
	filter: var(--navsi-grade) brightness(0.7);
	transform: scale(1.08);
	transition: filter 0.9s var(--navsi-ease), transform 1.4s var(--navsi-ease);
}

.navsi-panel.is-active .navsi-panel__media img {
	filter: none;
	transform: scale(1);
}

.navsi-panel::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(to top, rgba(11, 11, 12, 0.92) 0%, rgba(11, 11, 12, 0.35) 45%, rgba(11, 11, 12, 0.15) 100%);
}

.navsi-panel__num {
	position: absolute;
	top: 22px;
	left: 22px;
	z-index: 2;
	font-family: var(--navsi-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	color: var(--navsi-white);
}

.navsi-panel.is-active .navsi-panel__num {
	color: var(--navsi-red);
}

/* Titre vertical des panneaux fermés */
.navsi-panel__vtitle {
	position: absolute;
	left: 22px;
	bottom: 26px;
	z-index: 2;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	font-family: var(--navsi-font-display);
	font-weight: 600;
	font-size: clamp(1.3rem, 1rem + 0.9vw, 1.9rem);
	letter-spacing: -0.02em;
	white-space: nowrap;
	transition: opacity 0.4s;
}

.navsi-panel.is-active .navsi-panel__vtitle {
	opacity: 0;
}

/* Contenu du panneau ouvert */
.navsi-panel__body {
	position: absolute;
	left: clamp(22px, 2.6vw, 40px);
	right: clamp(22px, 2.6vw, 40px);
	bottom: clamp(24px, 3vw, 44px);
	z-index: 2;
	display: grid;
	gap: 14px;
	max-width: 560px;
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.35s, transform 0.6s var(--navsi-ease);
	pointer-events: none;
}

.navsi-panel.is-active .navsi-panel__body {
	opacity: 1;
	transform: none;
	transition-delay: 0.3s;
}

.navsi-panel__title {
	font-family: var(--navsi-font-display);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
	font-size: clamp(2rem, 1rem + 2.8vw, 4rem);
}

.navsi-panel__desc {
	font-size: 1rem;
	line-height: 1.55;
	color: rgba(244, 242, 238, 0.82);
	max-width: 44ch;
}

.navsi-panel__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.navsi-panel__tags span {
	padding: 6px 11px;
	border: 1px solid rgba(244, 242, 238, 0.28);
	border-radius: 999px;
	font-family: var(--navsi-font-mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	background: rgba(11, 11, 12, 0.25);
}

.navsi-panel__go {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 6px;
	font-family: var(--navsi-font-mono);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.navsi-panel__go svg {
	width: 18px;
	height: 18px;
	color: var(--navsi-red);
	transition: transform 0.4s var(--navsi-ease);
}

.navsi-panel:hover .navsi-panel__go svg {
	transform: translateX(4px);
}

.navsi-panel:focus-visible {
	outline: 2px solid var(--navsi-red);
	outline-offset: 3px;
}

/* Tablette et mobile : cartes empilées, tout est visible */
@media (max-width: 900px) {
	.navsi-panels {
		flex-direction: column;
		height: auto;
		gap: 12px;
	}

	.navsi-panel,
	.navsi-panel.is-active {
		flex: none;
		min-height: clamp(380px, 110vw, 520px);
	}

	.navsi-panel__media img,
	.navsi-panel.is-active .navsi-panel__media img {
		filter: brightness(0.85);
		transform: none;
	}

	.navsi-panel__vtitle {
		display: none;
	}

	.navsi-panel__body,
	.navsi-panel.is-active .navsi-panel__body {
		opacity: 1;
		transform: none;
	}

	.navsi-panel__num {
		color: var(--navsi-red);
	}
}

@media (prefers-reduced-motion: reduce) {
	.navsi-panel,
	.navsi-panel__media img,
	.navsi-panel__body {
		transition: none !important;
	}
}

/* --- Savoir-faire mobile v3.2 : carrousel horizontal à glisser --------- */

@media (max-width: 900px) {
	.navsi-panels {
		flex-direction: row;
		gap: 10px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding-left: 0;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 4px;
	}

	.navsi-panels::-webkit-scrollbar {
		display: none;
	}

	.navsi-panel,
	.navsi-panel.is-active {
		flex: 0 0 80%;
		min-height: 0;
		aspect-ratio: 4 / 5;
		scroll-snap-align: start;
	}

	.navsi-panel__tags {
		display: none;
	}

	.navsi-panel__body,
	.navsi-panel.is-active .navsi-panel__body {
		left: 20px;
		right: 20px;
		bottom: 22px;
		gap: 10px;
	}

	.navsi-panel__title {
		font-size: clamp(1.7rem, 7.4vw, 2.4rem);
	}

	.navsi-panel__desc {
		font-size: 0.92rem;
		line-height: 1.5;
	}

	.navsi-panel__num {
		top: 18px;
		left: 20px;
	}

	.navsi-panel__go {
		margin-top: 2px;
	}
}

/* Indicateur de position sous le carrousel (mobile) */
.navsi-panels-dots {
	display: none;
}

@media (max-width: 900px) {
	.navsi-panels-dots {
		display: flex;
		gap: 6px;
		margin-top: 18px;
	}

	.navsi-panels-dots span {
		width: 22px;
		height: 2px;
		background: var(--navsi-line);
		transition: background 0.3s, width 0.4s var(--navsi-ease);
	}

	.navsi-panels-dots span.is-on {
		width: 40px;
		background: var(--navsi-red);
	}
}

/* Zooms lents (Ken Burns CSS) : rendu GPU, sans accrochage au pixel */
.navsi-hm__layer img,
.navsi-panel__media img,
.navsi-reveal img,
.navsi-sel__media img {
	will-change: transform;
	backface-visibility: hidden;
	transform-origin: 50% 50%;
}

/* v3.1.3 — plus de zoom lent (source de scintillement dans Chrome) :
   l'image du hero se pose en 1,6 s au chargement puis reste fixe. */
.navsi-hm__layer img {
	animation: navsi-settle 1.6s var(--navsi-ease) both;
}

@keyframes navsi-settle {
	from { transform: scale(1.035); }
	to { transform: none; }
}

.navsi-reveal img {
	transform: none;
	transition: transform 0.8s var(--navsi-ease);
}

.navsi-sel__media img,
.navsi-panel__media img {
	transition-duration: 0.8s;
}

.navsi-reveal img,
.navsi-sel__media img {
	will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
	.navsi-hm__layer img {
		animation: none;
	}
}