/* ============================================================
   S-Law — Responsive global (breakpoints 991px tablette / 767px mobile)
   Feuille unique du thème : override des styles desktop définis
   dans les pages Bricks (_cssCustom). Chargée sur tout le site.
   ============================================================ */

/* Burger caché sur desktop */
#nav-burger { display: none; background: transparent; border: 0; padding: 10px; cursor: pointer; }

/* « Nous ? » est le seul libellé du menu à contenir une espace : dès que la
   rangée manque de place, lui seul se coupait en deux lignes (« Nous » /
   « ? »), ce qui décalait tout l'item vers le haut. */
#main-menu .brxe-text-link { white-space: nowrap; flex-shrink: 0; }

/* Entre 992 et 1400px (iPad, petits portables), la rangée complète (861px)
   plus le logo (270px) ne tient pas : le menu chevauchait le logo.
   On resserre progressivement plutôt que de basculer sur le burger. */
@media (min-width: 992px) and (max-width: 1399px) {
	#main-menu { gap: 30px !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
	#main-menu { gap: 22px !important; }
	#main-menu .brxe-text-link { font-size: 16px !important; }
	#site-logo { width: 180px !important; }
}

/* Complianz : onglet « Gérer le consentement » à GAUCHE
   (la droite est occupée par le bouton back-to-top) */
button.cmplz-manage-consent { right: auto !important; left: 20px !important; }

/* ------------------------------------------------------------------
   Bloc « Bouton » de l'éditeur WordPress dans le corps des articles.
   Le lien du bouton héritait du rouge de « #post-content a » (spécificité
   101, qui bat le .wp-block-button__link de WordPress) sur le fond sombre
   par défaut de Gutenberg. On le repasse en bouton plein rouge, texte
   blanc, aligné sur les boutons du reste du site — les liens du texte
   courant restent rouges.
   Réglages calqués sur #post-hero-back, le bouton rouge natif de la même
   page, pour que les deux soient indiscernables.
   ------------------------------------------------------------------ */
#post-content .wp-block-button__link,
#post-content .wp-element-button {
	background-color: #C70707;
	color: #ffffff;
	border-radius: 100px;
	padding: 16px 34px;
	border: 0;
	font-family: "PoppinsLight"; font-weight: 400; font-size: 15px; line-height: 18px;
	text-decoration: none;
	transition: background-color .3s ease;
}
/* « #post-content a:hover » rétablit un soulignement sur tous les liens du
   corps de texte : on le neutralise pour les seuls boutons. */
#post-content .wp-block-button__link:hover,
#post-content .wp-element-button:hover {
	background-color: #333333;
	color: #ffffff;
	text-decoration: none;
}
/* Variante « contour » du même bloc */
#post-content .is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: #C70707;
	border: 1px solid #C70707;
}
#post-content .is-style-outline .wp-block-button__link:hover {
	background-color: #C70707;
	color: #ffffff;
	text-decoration: none;
}

/* Onglet « Rendez-vous » des fiches avocats : les coordonnées sont passées
   AVANT le formulaire. Leur marge d'origine (80px en haut, 0 en bas) avait été
   réglée pour la position inverse — on l'inverse aussi, sinon le bloc décolle
   du titre et se colle au formulaire.
   L'écart sous le titre était de 14px : les marges verticales adjacentes
   fusionnent, c'est la marge basse du h4 qui l'emportait. 34px pour obtenir
   les 20px supplémentaires demandés. */
.av-tab-panel[data-panel="rendez-vous"] ul.av-contact-icons {
	margin-top: 34px !important;
	margin-bottom: 70px !important;
}

/* ------------------------------------------------------------------
   Sélecteur de langue — shortcode [slaw_lang], dernier item de #main-menu
   Pastille ronde blanche portant le code de la langue courante ; au clic,
   menu déroulant des autres langues (prévu pour en accueillir d'autres).
   ------------------------------------------------------------------ */
.slaw-lang { position: relative; display: inline-flex; align-items: center; }

.slaw-lang-toggle {
	width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%;
	background: #ffffff; color: #252525; cursor: pointer;
	font-family: "PoppinsSemiBold"; font-weight: 400; font-size: 13px; line-height: 1;
	letter-spacing: .5px; display: flex; align-items: center; justify-content: center;
	transition: background-color .3s ease, color .3s ease, transform .3s ease;
}
.slaw-lang-toggle:hover,
.slaw-lang[data-open] .slaw-lang-toggle { background: #C70707; color: #ffffff; }
.slaw-lang-toggle:focus-visible { outline: 2px solid #C70707; outline-offset: 3px; }

.slaw-lang-menu {
	position: absolute; top: calc(100% + 12px); right: 0; z-index: 200;
	margin: 0; padding: 6px; list-style: none; min-width: 62px;
	background: #ffffff; border-radius: 10px; box-shadow: 0 12px 30px rgba(0,0,0,0.18);
	opacity: 0; transform: translateY(-6px); visibility: hidden;
	transition: opacity .25s ease, transform .25s ease, visibility .25s;
}
/* visibility plutôt que display : le menu s'anime et reste hors de l'arbre
   d'accessibilité tant qu'il est fermé */
.slaw-lang[data-open] .slaw-lang-menu { opacity: 1; transform: none; visibility: visible; }

/* La flèche du menu, rattachée à la pastille */
.slaw-lang-menu::before {
	content: ""; position: absolute; top: -5px; right: 15px; width: 10px; height: 10px;
	background: #ffffff; transform: rotate(45deg); border-radius: 2px;
}

/* Seul le code à deux lettres est affiché : l'item est centré, pas aligné à gauche */
.slaw-lang-item {
	display: flex; align-items: center; justify-content: center;
	padding: 9px 11px; border-radius: 7px; text-decoration: none;
	transition: background-color .25s ease;
}
.slaw-lang-item:hover { background: #f4f4f4; }
.slaw-lang-code {
	font-family: "PoppinsSemiBold"; font-weight: 400; font-size: 13px; letter-spacing: .5px;
	color: #252525; transition: color .25s ease;
}
.slaw-lang-item:hover .slaw-lang-code { color: #C70707; }

/* Entre 992 et 1199px, la pastille accompagne la réduction du menu.
   (Règle placée ici, après la définition de base, pour la surclasser.) */
@media (min-width: 992px) and (max-width: 1199px) {
	.slaw-lang-toggle { width: 34px; height: 34px; font-size: 12px; }
}

/* Menu burger : pastille agrandie et menu centré sous elle.
   Bricks enveloppe le shortcode dans un .brxe-shortcode de bloc pleine
   largeur : sans le recentrer, la pastille se colle au bord gauche de
   l'overlay et le menu déroulant sort de l'écran. */
@media (max-width: 991px) {
	html.slaw-nav-open #main-menu .brxe-shortcode {
		display: flex; justify-content: center; width: 100%;
	}
	html.slaw-nav-open .slaw-lang-toggle { width: 52px; height: 52px; font-size: 16px; }
	html.slaw-nav-open .slaw-lang-menu { right: 50%; transform: translateX(50%) translateY(-6px); }
	html.slaw-nav-open .slaw-lang[data-open] .slaw-lang-menu { transform: translateX(50%); }
	html.slaw-nav-open .slaw-lang-menu::before { right: 50%; margin-right: -5px; }
}

@media (prefers-reduced-motion: reduce) {
	.slaw-lang-menu { transition: none; }
}

/* ============================== ≤ 991px ============================== */
@media (max-width: 991px) {

	/* ===== Header : logo réduit + burger + panneau plein écran ===== */
	#site-logo { width: 170px !important; top: 22px !important; left: 20px !important; }
	/* centré sur le logo (74px) puis remonté de 20px à la demande d'Olivier */
	#nav-burger { display: block; position: absolute; top: 54px; right: 16px; width: 46px; height: 46px; z-index: 1001; }
	#nav-burger .burger-bar { display: block; position: relative; width: 26px; height: 2px; margin: 0 auto; background: #ffffff; transition: background .2s ease; }
	#nav-burger .burger-bar::before, #nav-burger .burger-bar::after { content: ""; position: absolute; left: 0; width: 26px; height: 2px; background: #ffffff; transition: transform .25s ease, top .25s ease; }
	#nav-burger .burger-bar::before { top: -8px; }
	#nav-burger .burger-bar::after { top: 8px; }
	html.slaw-nav-open #nav-burger .burger-bar { background: transparent; }
	html.slaw-nav-open #nav-burger .burger-bar::before { top: 0; transform: rotate(45deg); }
	html.slaw-nav-open #nav-burger .burger-bar::after { top: 0; transform: rotate(-45deg); }

	#main-menu { display: none !important; }
	html.slaw-nav-open #main-menu {
		display: flex !important; position: fixed !important;
		top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
		width: 100% !important; background: rgba(10, 10, 10, 0.97); z-index: 1000;
		flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 30px !important;
	}
	html.slaw-nav-open #main-menu .brxe-text-link { font-size: 24px; line-height: 1.4; }
	/* boule clignotante un peu plus écartée du mot dans le panneau */
	html.slaw-nav-open #main-menu .brxe-text-link::after { right: -18px; }
	html.slaw-nav-open { overflow: hidden; }
	/* le header est un stacking context (z-100) : menu ouvert → il doit passer devant tout */
	html.slaw-nav-open #brx-header { z-index: 3000 !important; }

	/* ===== Heros (toutes pages) ===== */
	[id$="-hero-title"] { font-size: 44px !important; line-height: 1.15 !important; padding: 0 16px; }
	[id$="-bc"] { flex-wrap: wrap; padding: 0 16px; }
	[id$="-bc"] a, [id$="-bc"] span { font-size: 16px !important; }

	/* ===== Home ===== */
	#hero-slogan { left: 20px !important; right: 20px !important; }
	#hero-slogan .brxe-animated-typing, #hero-slogan .brxe-animated-typing * { font-size: 42px !important; line-height: 1.2 !important; }
	#frame-wrap { margin-top: -60px !important; padding: 0 16px; }
	#frame { padding: 30px 16px !important; min-height: 0 !important; }
	#damier { grid-template-columns: 1fr 1fr !important; grid-template-rows: none !important; grid-template-areas: none !important; aspect-ratio: auto !important; }
	#damier > * { grid-area: auto !important; }
	/* cellules en ratio fixe, image en cover — sinon les cellules s'écrasent hors du grid desktop */
	#damier > .brxe-block { height: auto !important; min-height: 0 !important; aspect-ratio: 3 / 2; overflow: hidden; position: relative; }
	#damier .brxe-image { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; }
	#damier .brxe-image img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; }
	/* titres toujours visibles (avec boule) sur léger voile, taille lisible */
	#damier .cell-title { opacity: 1 !important; font-size: 16px !important; line-height: 1.3 !important; }
	#damier .cell-title::after { opacity: 1 !important; transform: none; animation: slaw-dot-pulse 1.2s ease-in-out infinite; }
	#damier > .brxe-block::after { background: rgba(30, 30, 30, 0.35) !important; }
	#news-inner { padding: 50px 20px !important; }
	#news .news-card, #news .news-card:nth-child(even) { flex-direction: column !important; }
	/* photo centrée (marges identiques) + cadre texte collé sous l'image
	   (flex: 0 0 auto — le flex-basis 516px desktop devient la HAUTEUR en colonne) */
	#news .news-card .news-img { flex: 0 0 auto !important; }
	#news .news-card .brxe-image, #news .news-card .brxe-image img { width: 100% !important; height: auto !important; margin: 0 auto !important; }
	#news .news-frame { margin: 10px 0 0 0 !important; padding: 24px 18px; }
	#news-title { font-size: 34px !important; }

	/* ===== Lames « Un rendez-vous ? » / CTA (toutes pages) ===== */
	[id$="-rdv-ext"], #contact-ext, #post-cta-ext { min-height: 320px !important; padding: 50px 20px; }
	[id$="-rdv-inner"] h2, #contact-inner h2, #post-cta-inner h2 { font-size: 32px !important; line-height: 1.2 !important; }

	/* ===== Grilles ===== */
	#exp-grid { grid-template-columns: 1fr 1fr !important; grid-auto-flow: row !important; }
	.exp-title { font-size: 22px !important; line-height: 26px !important; left: 20px !important; }
	#news-list-grid { grid-template-columns: 1fr 1fr !important; }
	#news-list-inner { padding: 50px 20px !important; }

	/* ===== Corps de pages ===== */
	[id$="-body-inner"] { padding: 50px 20px !important; }

	/* ===== Fiches avocats : onglets ===== */
	.av-tab-btn { font-size: 13px; padding: 7px 16px; }

	/* ===== Footer / copyright : tout centré ===== */
	#footer-inner { grid-template-columns: 1fr !important; gap: 40px !important; padding: 50px 24px 30px !important; text-align: center; }
	#footer .footer-title { text-align: center; }
	#footer .footer-list { align-items: center !important; }
	/* boule inline devant le 1er mot (l'absolu la collait au bord de la boîte sur 2 lignes) */
	#footer .footer-ball-link { padding-left: 0 !important; }
	#footer .footer-ball-link::before { position: static !important; display: inline-block; margin-right: 10px; vertical-align: 1px; }
	#footer .footer-ball-link::after { left: 0 !important; width: 100% !important; }
	#footer .footer-info-link, #footer .footer-info-item { justify-content: center; }
	#footer .footer-lead { text-align: center; }
	#footer-socials { justify-content: center !important; }
	#copyright .cp-sep { display: none; }
	#copyright-inner { flex-direction: column !important; gap: 8px !important; padding: 14px 24px !important; text-align: center; }
}

/* ============================== ≤ 767px ============================== */
@media (max-width: 767px) {

	/* Heros */
	[id$="-hero-title"] { font-size: 34px !important; }
	#hero-slogan .brxe-animated-typing, #hero-slogan .brxe-animated-typing * { font-size: 38px !important; line-height: 1.25 !important; }
	/* le texte qui change passe à la ligne sous « Votre avocat, » */
	#hero-slogan .brxe-animated-typing .typed::before { content: "\A"; white-space: pre; }
	#post-hero-title { font-size: 24px !important; line-height: 1.3 !important; }

	/* Damier home : 1 colonne, titre plus grand */
	#damier { grid-template-columns: 1fr !important; }
	#damier .cell-title { font-size: 18px !important; }
	#exp-grid { grid-template-columns: 1fr !important; }
	#news-list-grid { grid-template-columns: 1fr !important; }

	/* Grille équipe */
	#team-grid { grid-template-columns: 1fr !important; }
	.team-name { font-size: 22px !important; line-height: 26px !important; left: 20px !important; bottom: 20px !important; }
	.team-collab-box { left: 20px !important; bottom: 20px !important; }
	.team-collab-title, .team-collab-box a { font-size: 22px !important; line-height: 26px !important; }

	/* Single post : barre de partage sous l'article, horizontale */
	#post-share { position: static !important; transform: none !important; flex-direction: row !important; justify-content: center; margin: 30px auto 0 auto; }
	#post-share .share-label { display: none; }

	/* Page Contact : carte puis box empilées, contenu centré, sous le menu (z-index) */
	#contact-map-sec { height: auto !important; min-height: 0 !important; }
	#slaw-map { position: relative !important; inset: auto !important; height: 380px !important; }
	#contact-over { position: relative !important; top: auto !important; right: auto !important; transform: none !important; width: 100% !important; max-width: 100% !important; z-index: 10 !important; text-align: center; }
	#contact-over h3 { text-align: center; }
	#contact-over li { justify-content: center; }
	#contact-over .contact-socials { justify-content: center; margin-top: 16px; }
	#contact-mouse { display: none; }
	/* moins d'espace entre la box (réseaux sociaux) et le formulaire */
	#contact-main { padding: 30px 20px 60px 20px !important; }

	/* Souris de scroll un peu plus petite */
	[id$="-mouse"] { width: 60px !important; height: 60px !important; }
}

/* Honeypot anti-spam de Gravity Forms : champ piège que seuls les robots
   remplissent. La CSS par défaut de Gravity Forms, qui le masque, est
   désactivée sur le site (rg_gforms_disable_css) : on le masque ici. Hors
   écran plutôt que display:none seul, comme Gravity Forms, pour que les
   robots le voient toujours dans le DOM. */
.gform_wrapper .gform_validation_container,
.gform_validation_container {
	display: none !important;
	position: absolute !important;
	left: -9000px !important;
}