/* MG Studio MSS — en-tête [mss_header]
 * Bandeau fixe (logo · coordonnées · connexion · burger) + menu inline desktop + menu plein écran.
 * Palette : dégradé 2 couleurs #465f9d → #e4794a ; police Raleway (celle du site).
 * z-index volontairement SOUS les tiroirs d'administration (999990+) et sous la barre d'admin WP.
 */

.mssh-wrap, .mssh-bar, .mssh-navmenu {
	--mssh-ink: var(--gcid-primary-color, #707070);
	--mssh-blue: #465f9d;
	--mssh-orange: #e4794a;
	--mssh-grad: linear-gradient(135deg, #465f9d, #e4794a);
	--mssh-font: 'Raleway', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.mssh-wrap {
	--mssh-barh: 58px;
	/* Le menu inline (sous le bandeau) est posé en absolu en haut de page : il ne repousse plus le contenu. */
	position: absolute;
	width: 100%;
	z-index: 99999;
}

/* ============================ Bandeau fixe ============================ */
.mssh-bar {
	position: fixed; top: 0; left: 0; right: 0; z-index: 999999;
	height: var(--mssh-barh, 58px);
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 0 20px; background: #fff; overflow-x: clip;   /* le burger glisse depuis la droite : ne jamais dépasser de l'écran */
	box-shadow: 0 4px 14px -10px rgba(0, 0, 0, .3);
	font-family: var(--mssh-font);
}
body.admin-bar .mssh-bar { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar .mssh-bar { top: 46px; } }

.mssh-bar__left  { display: flex; align-items: center; gap: 14px; min-width: 0; }
.mssh-bar__right { display: flex; align-items: center; gap: 10px; margin-left: auto; }

/* réserve la hauteur du bandeau (il est hors flux) */
.mssh-spacer { height: var(--mssh-barh, 58px); }

/* Logo : --mssh-logo-h déclarée sur .mssh-bar (le bandeau est déplacé dans <body> par le JS,
   une variable posée sur .mssh-wrap serait perdue). */
.mssh-bar { --mssh-logo-h: calc(var(--mssh-barh, 58px) - 20px); }
.mssh-bar__logo { display: inline-flex; align-items: center; line-height: 0; flex: none; }
.mssh-bar__logo img { height: var(--mssh-logo-h); width: auto; display: block; transition: height .35s cubic-bezier(.2, .8, .2, 1); }

/* Par défaut (mobile-first) */
.mssh-main { display: none; }

/* ============================ Réseaux ============================ */
.mssh-social { display: none; align-items: center; gap: 6px; }
.mssh-social a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 36px; height: 36px; border-radius: 12px; color: var(--mssh-ink);
	background: rgba(0, 0, 0, .05); text-decoration: none;
	transition: color .2s, background .2s, transform .2s, box-shadow .2s;
}
.mssh-social a:hover { color: #fff; background: var(--mssh-grad); transform: translateY(-2px); box-shadow: 0 8px 16px rgba(0, 0, 0, .18); }
.mssh-social svg { width: 18px; height: 18px; fill: currentColor; display: block; }

/* ============================ Boutons ============================ */
.mssh-actions { display: inline-flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.mssh-btn {
	display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: 999px;
	font: 700 13px/1 var(--mssh-font); letter-spacing: .2px; text-decoration: none; color: #fff; border: 0; cursor: pointer;
	transition: transform .15s ease, box-shadow .2s ease, filter .15s ease;
}
.mssh-btn svg { width: 16px; height: 16px; fill: currentColor; display: block; flex: none; }
.mssh-btn span { white-space: nowrap; color: #fff; }
.mssh-btn:hover { transform: translateY(-2px); filter: brightness(.94); }
.mssh-btn:focus-visible { outline: 2px solid var(--mssh-blue); outline-offset: 2px; }

.mssh-btn--phone { background: var(--mssh-blue);   box-shadow: 0 4px 12px rgba(70, 95, 157, .30); }
.mssh-btn--mail  { background: var(--mssh-green);  box-shadow: 0 6px 16px rgba(153, 192, 15, .30); }
.mssh-btn--mail span { color: #1e2a05; }
.mssh-btn--mail svg  { color: #1e2a05; }

/* Connexion / déconnexion : icône seule dans un rond */
.mssh-btn--circle { width: 34px; height: 34px; padding: 0; border-radius: 50%; justify-content: center; gap: 0; }
.mssh-btn--login { background: var(--mssh-orange); box-shadow: 0 4px 12px rgba(228, 121, 74, .32); }
.mssh-btn--login.is-logout { background: #5a6b7b; box-shadow: 0 4px 12px rgba(90, 107, 123, .30); }
.mssh-btn--circle svg { width: 16px; height: 16px; }

@media (max-width: 720px) {
	.mssh-bar { padding: 0 12px; }
	.mssh-btn:not(.mssh-btn--circle) { width: 34px; height: 34px; padding: 0; justify-content: center; gap: 0; }
	.mssh-btn:not(.mssh-btn--circle) span { display: none; }   /* icône seule sur petit écran */
}

/* ============================ Burger ============================ */
.mssh__burger {
	position: static; flex: none; width: 36px; height: 36px; padding: 0; border: 0; cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center; background: transparent; box-shadow: none;
	transition: transform .2s ease;
}
.mssh__burger:active { transform: scale(.94); }
.mssh__burger-grid {
	width: 26px; height: 26px; display: block;
	background: var(--mssh-grad);
	-webkit-mask:
		radial-gradient(circle 3px at 4px 4px,   #000 96%, transparent 100%),
		radial-gradient(circle 3px at 13px 4px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 22px 4px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 4px 13px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 13px 13px, #000 96%, transparent 100%),
		radial-gradient(circle 3px at 22px 13px, #000 96%, transparent 100%),
		radial-gradient(circle 3px at 4px 22px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 13px 22px, #000 96%, transparent 100%),
		radial-gradient(circle 3px at 22px 22px, #000 96%, transparent 100%);
	mask:
		radial-gradient(circle 3px at 4px 4px,   #000 96%, transparent 100%),
		radial-gradient(circle 3px at 13px 4px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 22px 4px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 4px 13px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 13px 13px, #000 96%, transparent 100%),
		radial-gradient(circle 3px at 22px 13px, #000 96%, transparent 100%),
		radial-gradient(circle 3px at 4px 22px,  #000 96%, transparent 100%),
		radial-gradient(circle 3px at 13px 22px, #000 96%, transparent 100%),
		radial-gradient(circle 3px at 22px 22px, #000 96%, transparent 100%);
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	transition: transform .45s cubic-bezier(.65, 0, .35, 1);
}
.mssh__burger:hover .mssh__burger-grid { transform: rotate(90deg); }
.mssh__burger.is-open .mssh__burger-grid { transform: rotate(225deg) scale(.9); }

/* ============================ Menu plein écran ============================ */
.mssh-navmenu {
	position: fixed; inset: 0; z-index: 99997;
	display: flex; align-items: center; justify-content: center; background: #fff;
	opacity: 0; visibility: hidden;
	clip-path: circle(0px at calc(100% - 38px) 29px);
	transition: clip-path .55s cubic-bezier(.76, 0, .24, 1), opacity .35s ease, visibility 0s linear .55s;
	font-family: var(--mssh-font);
}
.mssh-navmenu::before {
	content: ""; position: absolute; bottom: -15%; left: -10%; width: 55vw; height: 55vw; border-radius: 50%; pointer-events: none;
	background: radial-gradient(circle, rgba(70, 95, 157, .12), rgba(255, 255, 255, 0) 70%);
}
/* Logo en filigrane très léger, centré derrière les liens (fichier SVG mis en cache, pas de SVG inline). */
.mssh-navmenu.has-watermark::after {
	content: ""; position: absolute; left: 50%; top: 50%; z-index: 0; pointer-events: none;
	width: min(82vw, 800px); aspect-ratio: 597.575 / 430.421; transform: translate(-50%, -50%);
	background: var(--mssh-watermark) center / contain no-repeat; opacity: .07;
}
.mssh-navmenu__inner { position: relative; z-index: 1; }

.mssh-navmenu.is-open {
	opacity: 1; visibility: visible;
	clip-path: circle(160% at calc(100% - 38px) 29px);
	transition: clip-path .6s cubic-bezier(.76, 0, .24, 1), opacity .35s ease;
}
.mssh-navmenu__inner { width: 100%; max-height: 100vh; overflow-y: auto; padding: 96px 24px 56px; text-align: center; }
.mssh-navmenu__list { list-style: none; margin: 0 auto; padding: 0; max-width: 560px; }
.mssh-navmenu__list > li { margin: 0; padding: 4px 0; opacity: 0; transform: translateY(22px); transition: opacity .45s ease, transform .45s ease; }
.mssh-navmenu__list li li { margin: 0; opacity: 1; transform: none; }
.mssh-navmenu.is-open .mssh-navmenu__list > li { opacity: 1; transform: none; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(1) { transition-delay: .12s; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(2) { transition-delay: .17s; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(3) { transition-delay: .22s; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(4) { transition-delay: .27s; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(5) { transition-delay: .32s; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(6) { transition-delay: .37s; }
.mssh-navmenu.is-open .mssh-navmenu__list > li:nth-child(n+7) { transition-delay: .42s; }

/* Mêmes typo et style que le menu inline : Raleway 600, gris, dégradé de marque
   au survol et sur la page courante — seule la taille change (zone de clic confortable). */
.mssh-navmenu__list a {
	display: inline-block; padding: 12px 10px; font-size: clamp(19px, 2.2vw, 24px); font-weight: 600; letter-spacing: .03em; line-height: 1.3;
	color: var(--mssh-ink); text-decoration: none; transition: color .2s ease, transform .2s ease;
}
.mssh-navmenu__list a:hover,
.mssh-navmenu__list li.current-menu-item > a,
.mssh-navmenu__list li.current_page_item > a,
.mssh-navmenu__list li.current-menu-parent > a,
.mssh-navmenu__list li.current-menu-ancestor > a {
	background: var(--mssh-grad); -webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: transparent;
}
.mssh-navmenu__list a:hover { transform: translateX(3px); }

/* Sous-menus : même famille, un cran plus petits, bien détachés du parent */
.mssh-navmenu__list .sub-menu { list-style: none; margin: 2px 0 12px; padding: 0 0 0 0; }
.mssh-navmenu__list .sub-menu a { font-size: clamp(16px, 1.6vw, 19px); padding: 9px 10px; }

@media (max-width: 720px) {
	.mssh-navmenu__inner { padding: 84px 20px 48px; }
	.mssh-navmenu__list > li { padding: 6px 0; }
	.mssh-navmenu__list a { font-size: 21px; padding: 14px 12px; }
	.mssh-navmenu__list .sub-menu a { font-size: 17px; padding: 11px 12px; }
}

body.mssh-noscroll { overflow: hidden; }

/* ============================ Desktop ≥ 1024px ============================ */
@media (min-width: 1024px) {
	.mssh-social { display: inline-flex; }

	/* Logo grand au repos, rétréci une fois .is-scrolled */
	.mssh-bar { --mssh-logo-h-large: calc(var(--mssh-barh, 58px) - 6px); }
	.mssh-bar__logo img { height: var(--mssh-logo-h-large); }
	.mssh-bar.is-scrolled .mssh-bar__logo img { height: var(--mssh-logo-h); }

	/* Le burger garde sa place à droite (pas de décalage des boutons) et glisse au scroll */
	.mssh__burger { opacity: 0; transform: translateX(28px); pointer-events: none; transition: opacity .35s ease, transform .4s cubic-bezier(.2, .8, .2, 1); }
	.mssh-bar.is-scrolled .mssh__burger { opacity: 1; transform: none; pointer-events: auto; }

	.mssh-main { display: flex; flex-direction: column; align-items: flex-end; padding: 0 24px; font-family: var(--mssh-font); }
	.mssh__nav { display: flex; justify-content: flex-end; width: 100%; padding: 11px 0 14px; }

	.mssh-nav__list {
		position: relative; list-style: none; margin: 0; padding: 0 !important;
		display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px 30px;
	}
	/* Filet en dégradé de marque sous le menu seul */
	.mssh-nav__list::after {
		content: ""; position: absolute; left: 0; right: 0; bottom: -10px; height: 2px; background: var(--mssh-grad);
	}
	.mssh-nav__list > li { margin: 0; position: relative; list-style-type: none; }
	.mssh-nav__list a {
		display: inline-block; padding: 5px 2px; font-weight: 600; font-size: 16px; letter-spacing: .03em;
		color: var(--mssh-ink); text-decoration: none; white-space: nowrap; transition: color .2s ease;
	}
	.mssh-nav__list > li > a:hover,
	.mssh-nav__list > li.current-menu-item > a,
	.mssh-nav__list > li.current_page_item > a,
	.mssh-nav__list > li.current-menu-parent > a,
	.mssh-nav__list > li.current-menu-ancestor > a {
		background: var(--mssh-grad); -webkit-background-clip: text; background-clip: text;
		-webkit-text-fill-color: transparent; color: transparent;
	}
	.mssh-nav__list .menu-item-has-children > a::after { content: "\25BE"; margin-left: 6px; font-size: .72em; vertical-align: middle; }

	/* Sous-menus (survol) */
	.mssh-nav__list .sub-menu {
		list-style: none; margin: 0; padding: 8px 0; position: absolute; top: 100%; left: 50%;
		transform: translateX(-50%) translateY(8px); min-width: 230px; background: #fff;
		border-radius: 12px; box-shadow: 0 12px 34px rgba(0, 0, 0, .16);
		opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s ease, transform .2s ease; z-index: 100;
	}
	.mssh-nav__list > li.menu-item-has-children::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 10px; }
	.mssh-nav__list > li:hover > .sub-menu,
	.mssh-nav__list > li:focus-within > .sub-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
	.mssh-nav__list .sub-menu li { margin: 0; }
	.mssh-nav__list .sub-menu a { display: block; padding: 9px 20px; text-align: left; font-size: 15px; letter-spacing: 0; }
	.mssh-nav__list .sub-menu a:hover {
		background: rgba(70, 95, 157, .09); -webkit-text-fill-color: var(--mssh-blue); color: var(--mssh-blue);
	}
}

@media (prefers-reduced-motion: reduce) {
	.mssh__burger-grid, .mssh-navmenu, .mssh-navmenu__list li { transition: none !important; }
}