/* =========================================================
   SOURIRE PRESTIGE — Navbar
   Transparente → blanche au scroll, mega menu, menu mobile plein écran.
   ========================================================= */

.sp-navbar {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: var(--z-navbar);
	padding-block: var(--space-5);
	transition: background var(--duration-base) var(--ease-premium), padding var(--duration-base) var(--ease-premium), box-shadow var(--duration-base) var(--ease-premium), border-color var(--duration-base) var(--ease-premium);
	background: transparent;
	border-bottom: 1px solid transparent;
}
.sp-navbar.is-scrolled {
	background: rgba(255, 255, 255, 0.92);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	padding-block: var(--space-3);
	box-shadow: 0 1px 0 var(--sp-border);
}
.sp-navbar.is-open { background: var(--sp-white); }

.sp-navbar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); }

.sp-navbar__logo { display: flex; align-items: center; gap: var(--space-2); flex-shrink: 0; }
.sp-navbar__logo img { height: 42px; width: auto; }
.sp-navbar__logo img.sp-logo--light { display: none; }
.sp-navbar__logo img.sp-logo--dark { display: block; }

.sp-navbar__menu { display: flex; align-items: center; gap: var(--space-7); }
.sp-navbar__link {
	position: relative;
	font-size: var(--fs-small);
	font-weight: 500;
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
	padding-block: var(--space-2);
	color: var(--sp-black);
}
.sp-navbar__link::after {
	content: '';
	position: absolute;
	left: 0; right: 100%;
	bottom: -2px;
	height: 1px;
	background: currentColor;
	transition: right var(--duration-base) var(--ease-premium);
}
.sp-navbar__link:hover::after, .sp-navbar__link.is-active::after { right: 0; }

.sp-navbar__actions { display: flex; align-items: center; gap: var(--space-5); }

.sp-navbar__toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	color: var(--sp-black);
}
.sp-navbar__toggle .sp-icon { width: 22px; height: 22px; }
.sp-navbar__toggle .sp-icon--close { display: none; }
.sp-navbar.is-open .sp-navbar__toggle .sp-icon--menu { display: none; }
.sp-navbar.is-open .sp-navbar__toggle .sp-icon--close { display: block; }

/* ---- Mega menu Prestations ---- */
.sp-mega { position: relative; }
.sp-mega__panel {
	position: absolute;
	top: calc(100% + 1.5rem);
	left: 50%;
	transform: translateX(-50%) translateY(8px);
	width: min(720px, 90vw);
	background: var(--sp-white);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-lift);
	padding: var(--space-6);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-2);
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--duration-fast) var(--ease-premium), transform var(--duration-fast) var(--ease-premium);
}
.sp-mega:hover .sp-mega__panel, .sp-mega:focus-within .sp-mega__panel {
	opacity: 1;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}
.sp-mega__item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4); border-radius: var(--radius-sm); color: var(--sp-black); }
.sp-mega__item:hover { background: var(--sp-off-white); }
.sp-mega__icon { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--sp-off-white); display: flex; align-items: center; justify-content: center; color: var(--sp-accent); }
.sp-mega__item:hover .sp-mega__icon { background: var(--sp-white); }
.sp-mega__title { font-family: var(--font-display); font-size: var(--fs-body-lg); font-weight: 500; }
.sp-mega__desc { font-size: var(--fs-caption); color: var(--sp-text-muted); }

@media (max-width: 1099px) {
	.sp-navbar__menu { display: none; }
	.sp-navbar__cta.sp-hide-mobile { display: none; }
}

/* ---- Menu mobile plein écran ---- */
.sp-mobile-menu {
	position: fixed;
	inset: 0;
	z-index: calc(var(--z-navbar) - 1);
	background: var(--sp-white);
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--space-8) var(--section-padding-x);
	transform: translateY(-100%);
	transition: transform var(--duration-slow) var(--ease-out-expo);
}
.sp-mobile-menu.is-open { transform: translateY(0); }
.sp-mobile-menu__list { display: flex; flex-direction: column; gap: var(--space-5); }
.sp-mobile-menu__link { font-family: var(--font-display); font-size: clamp(1.75rem, 1.4rem + 2vw, 2.75rem); font-weight: 500; }
.sp-mobile-menu__sub { margin-top: var(--space-3); padding-left: var(--space-5); display: flex; flex-direction: column; gap: var(--space-2); }
.sp-mobile-menu__sub a { font-family: var(--font-body); font-size: var(--fs-body); color: var(--sp-text-muted); }
.sp-mobile-menu__footer { margin-top: var(--space-9); display: flex; flex-direction: column; gap: var(--space-4); }
.sp-mobile-menu__contact { display: flex; align-items: center; gap: var(--space-3); font-size: var(--fs-small); }
.sp-mobile-menu__socials { display: flex; gap: var(--space-4); }
.sp-mobile-menu__socials .sp-icon { width: 20px; height: 20px; }

@media (min-width: 1100px) {
	.sp-mobile-menu, .sp-navbar__toggle { display: none; }
}
