/*
 * En-tête Landes Cuisines & Bains, DA Showroom : sur-header fin (téléphone, adresse,
 * Qui sommes-nous, réseaux), barre principale noire semi-opaque floutée en collant,
 * menu en capitales espacées avec soulignement jaune sur l'entrée courante, bouton
 * « Obtenir un devis » jaune (réglages Astra), menu mobile plein écran sombre.
 *
 * Réglages Astra attendus (import-astra-settings) : mobile-header-type off-canvas (le type
 * full-screen n'est plus rendu du tout avec Astra 4.14.0 + Astra Pro 4.13.10 : bouton burger sans
 * menu, constaté le 12/10/2026 ; le tiroir off-canvas est passé en pleine largeur ci-dessous),
 * header-mobile-items.popup = [mobile-menu, html-3, button-1], menu « Menu mobile »
 * affecté à l'emplacement mobile_menu, mobile-header-breakpoint 1200.
 *
 * Structure Astra 4.x :
 *   #masthead .ast-above-header-bar            sur-header (desktop seulement : absent des zones mobile)
 *   #masthead .ast-primary-header-bar          barre principale (desktop et #ast-mobile-header)
 *   #ast-mobile-popup                          menu mobile, rendu HORS de #masthead
 */
:root {
	--lcb-ligne-sombre: #2F3237;       /* lignes sur fond noir (DA2 --ligne) */
	--lcb-texte-sombre: #D7D9DC;       /* texte courant sur fond noir */
	--lcb-label-sombre: #9AA0A6;       /* libellés et liens secondaires sur fond noir */
	--lcb-graphite: #1F2124;
}

/* ---------------------------------------------------------------- sur-header */
#masthead .ast-above-header-bar {
	font-size: 12px;
	letter-spacing: .06em;
	color: var(--lcb-label-sombre);
	border-bottom: 1px solid var(--lcb-ligne-sombre);
}
#masthead .ast-above-header-bar .ast-builder-html-element { line-height: 1.4; }
#masthead .ast-above-header-bar .lcb-topbar { display: flex; align-items: center; gap: 0; flex-wrap: wrap; }
#masthead .ast-above-header-bar .lcb-topbar a,
#masthead .ast-above-header-bar .lcb-topbar .lcb-topbar-tel a {
	color: var(--lcb-label-sombre);
	text-decoration: none;
	transition: color .2s;
}
#masthead .ast-above-header-bar .lcb-topbar a:hover,
#masthead .ast-above-header-bar .lcb-topbar a:focus-visible { color: var(--mx-accent); }
/* Séparateurs « · » entre les éléments, sans élément HTML supplémentaire. */
#masthead .ast-above-header-bar .lcb-topbar > * + *::before {
	content: "·";
	margin: 0 10px;
	color: var(--lcb-ligne-sombre);
	color: color-mix(in srgb, var(--lcb-label-sombre) 60%, transparent);
}
#masthead .ast-above-header-bar .lcb-topbar--right { justify-content: flex-end; }
#masthead .ast-above-header-bar .lcb-topbar-qsn { color: #fff; font-weight: 700; }

/* ---------------------------------------------------------------- barre principale */
#masthead .ast-primary-header-bar {
	border-bottom: 1px solid var(--lcb-ligne-sombre);
}
/* En collant : fond semi-opaque flouté (Astra pose le fond plein en inline, on le voile). */
#masthead .ast-primary-header-bar.ast-header-sticked,
#masthead.ast-header-sticked .ast-primary-header-bar,
#masthead .ast-primary-header-bar.ast-sticky-active {
	background: rgba(20, 21, 23, .9) !important;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: none;
}

/* Logo : largeur Astra, hauteur au ratio (functions.php) ; blanc sur le noir. */
.site-logo-img .custom-logo-link img,
.site-logo-img img.custom-logo { width: 100%; max-width: 70px; height: auto; }
.ast-sticky-main-shrink #masthead .ast-sticky-shrunk .site-logo-img img,
.ast-sticky-header-shrink .ast-sticky-shrunk .site-logo-img img { max-height: 55px !important; width: 100%; }

/* Menu : soulignement jaune de l'entrée courante, blanc au survol (couleurs Astra). */
#masthead .main-header-menu > .menu-item > .menu-link {
	position: relative;
	padding-top: 8px;
	padding-bottom: 8px;
	background: none !important;
}
#masthead .main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: 0;
	height: 2px;
	background: var(--mx-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s var(--mx-ease);
}
#masthead .main-header-menu > .menu-item:hover > .menu-link::after,
#masthead .main-header-menu > .menu-item:focus-within > .menu-link::after,
#masthead .main-header-menu > .current-menu-item > .menu-link::after,
#masthead .main-header-menu > .current-menu-ancestor > .menu-link::after,
#masthead .main-header-menu > .current_page_parent > .menu-link::after { transform: scaleX(1); }

/* Sous-menus (aucun au lancement) : angles vifs, fond noir, filet. */
#masthead .main-header-menu .sub-menu { border: 1px solid var(--lcb-ligne-sombre); border-radius: 0; box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .6); }

/* Bouton header : le div .ast-custom-button porte le fond (réglages Astra). */
#masthead .ast-builder-button-wrap .ast-custom-button { line-height: 1; transition: background .25s, color .25s; }
#masthead .ast-header-button-1 { padding-left: 14px; }

/* ---------------------------------------------------------------- tablette et mobile (< 1200 px) */
@media (max-width: 1200px) {
	#masthead .ast-primary-header-bar { padding: 0; }
	.site-logo-img .custom-logo-link img, .site-logo-img img.custom-logo { max-width: 64px; }
	/* Sticky Astra Pro pose un max-width inline calculé au chargement : barre bord à bord. */
	#masthead #ast-mobile-header .ast-primary-header-bar.ast-sticky-active,
	#masthead #ast-mobile-header .ast-primary-header-bar.ast-header-sticked { max-width: none !important; margin: 0 !important; }
	/* Bouton burger : carré bordé, trait blanc (couleur Astra). */
	#masthead .ast-mobile-header-wrap .ast-button-wrap .menu-toggle,
	#masthead .ast-mobile-header-wrap .ast-button-wrap .ast-mobile-menu-trigger-minimal {
		width: 44px; height: 44px; padding: 0; border: 1px solid var(--lcb-ligne-sombre); border-radius: 0; background: transparent; justify-content: center;
	}
	#masthead .ast-mobile-header-wrap .ast-button-wrap .menu-toggle svg { width: 22px; height: 22px; }
}
@media (max-width: 767px) {
	.site-logo-img .custom-logo-link img, .site-logo-img img.custom-logo { max-width: 56px; }
}

/* ---------------------------------------------------------------- menu mobile plein écran
   #ast-mobile-popup est rendu hors de #masthead : préfixe obligatoire pour passer
   au-dessus des sélecteurs Astra à quatre classes. Fond noir (off-canvas-background),
   entrées en capitales, « Qui sommes-nous » + téléphone (html-3) puis bouton devis. */
#ast-mobile-popup .ast-mobile-popup-inner { background: var(--mx-appoint); color: var(--lcb-texte-sombre); }
/* Plein écran, quel que soit le type : Astra pose width 90 % avec #ast-mobile-popup-wrapper (1,2,0). */
#ast-mobile-popup-wrapper #ast-mobile-popup .ast-mobile-popup-inner { border-radius: 0; max-width: none; width: 100%; }
/* html-3 (Qui sommes-nous, téléphone) : Astra lui pose 20 px de padding latéral, il se décalait par rapport au menu et au bouton. */
#ast-mobile-popup .ast-mobile-popup-content .ast-header-html-3 { padding-left: 0; padding-right: 0; }
#ast-mobile-popup .ast-mobile-popup-overlay { background: rgba(20, 21, 23, .7); }

#ast-mobile-popup .ast-mobile-popup-header { padding: 16px 20px 0; }
#ast-mobile-popup .menu-toggle-close {
	width: 44px; height: 44px; padding: 0; display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--lcb-ligne-sombre); border-radius: 0; background: transparent; color: #fff;
}
#ast-mobile-popup .menu-toggle-close:hover,
#ast-mobile-popup .menu-toggle-close:focus-visible { background: var(--mx-accent); color: var(--mx-titre); border-color: var(--mx-accent); }
#ast-mobile-popup .menu-toggle-close .ast-close-svg { width: 20px; height: 20px; }

#ast-mobile-popup .ast-mobile-popup-content,
#ast-mobile-popup .ast-desktop-popup-content { padding: 24px 24px 40px; display: flex; flex-direction: column; justify-content: center; min-height: calc(100% - 60px); }
#ast-mobile-popup .ast-builder-menu-mobile .main-header-menu { display: block; }
#ast-mobile-popup .main-header-menu .menu-item { position: relative; }
#ast-mobile-popup .main-header-menu > .menu-item > .menu-link {
	display: block;
	padding: 16px 0;
	font-weight: 700;
	font-size: 22px;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1.2;
	color: #fff;
	border-bottom: 1px solid var(--lcb-ligne-sombre);
	background: none;
}
#ast-mobile-popup .main-header-menu > .current-menu-item > .menu-link,
#ast-mobile-popup .main-header-menu > .current-menu-ancestor > .menu-link { color: var(--mx-accent); }
#ast-mobile-popup .main-header-menu .menu-link .ast-icon.icon-arrow { display: none; }
#ast-mobile-popup .main-header-menu .menu-item-has-children > .menu-link { padding-right: 44px; }
#ast-mobile-popup .main-header-menu .menu-item-has-children > .ast-menu-toggle {
	position: absolute; top: 0; right: 0; bottom: auto; width: 44px; height: 58px; margin: 0; padding: 0;
	display: flex; align-items: center; justify-content: center; color: #fff; background: none; box-shadow: none; border: 0; border-radius: 0;
}
#ast-mobile-popup .main-header-menu .ast-menu-toggle .ast-arrow-svg { width: 14px; height: auto; transition: transform .25s var(--mx-ease); }
#ast-mobile-popup .main-header-menu .ast-menu-toggle.ast-submenu-expanded .ast-arrow-svg,
#ast-mobile-popup .main-header-menu .ast-menu-toggle[aria-expanded="true"] .ast-arrow-svg { transform: rotate(180deg); }
#ast-mobile-popup .main-header-menu .sub-menu { position: static; width: auto; margin: 0 0 12px; padding: 4px 0 4px 16px; background: none; border: 0; border-left: 2px solid var(--lcb-ligne-sombre); border-radius: 0; box-shadow: none; }
#ast-mobile-popup .main-header-menu .sub-menu .menu-link { display: block; padding: 10px 0; font-size: 15px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--lcb-texte-sombre); background: none; border: 0; }

/* Bloc secondaire du menu mobile (html-3) : Qui sommes-nous et téléphone. */
#ast-mobile-popup .lcb-drawer-extra { display: flex; flex-direction: column; gap: 6px; padding: 24px 0 8px; }
#ast-mobile-popup .lcb-drawer-extra a { color: var(--lcb-texte-sombre); text-decoration: none; font-size: 15px; letter-spacing: .04em; }
#ast-mobile-popup .lcb-drawer-extra .lcb-drawer-tel a { font-size: 22px; font-weight: 800; letter-spacing: -0.01em; color: #fff; }
#ast-mobile-popup .lcb-drawer-extra a:hover { color: var(--mx-accent); }

/* Bouton devis : pleine largeur, jaune, texte anthracite. */
#ast-mobile-popup .ast-header-button-1 { padding: 16px 0 0; justify-content: stretch; }
#ast-mobile-popup .ast-builder-button-wrap { padding: 0; width: 100%; }
#ast-mobile-popup .ast-builder-button-wrap .ast-custom-button-link { display: block; width: 100%; padding: 0; text-decoration: none; }
#ast-mobile-popup .ast-builder-button-wrap .ast-custom-button {
	display: block; width: 100%; padding: 18px 24px; border-radius: 0;
	background: var(--mx-accent); color: var(--mx-titre);
	font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; line-height: 1; text-align: center;
}
#ast-mobile-popup .ast-builder-button-wrap .ast-custom-button-link:hover .ast-custom-button,
#ast-mobile-popup .ast-builder-button-wrap .ast-custom-button-link:focus-visible .ast-custom-button { background: var(--mx-accent-2); color: var(--mx-titre); }

@media (prefers-reduced-motion: reduce) {
	#masthead .main-header-menu > .menu-item > .menu-link::after,
	#ast-mobile-popup .main-header-menu .ast-menu-toggle .ast-arrow-svg { transition: none; }
}