/*
Theme Name: Expertise Child
Theme URI: https://expertise.qodeinteractive.com
Description: Thème enfant d'Expertise pour le site Legal Squad.
Template: expertise
Version: 1.4.69
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: expertise-child
*/

/* ==========================================================================
   1. Polices
   Noir Pro pour le texte, MADE Mirage pour les grands titres.

   Noir Pro : les fichiers web déclarent des métriques verticales
   (730 / -270) différentes de celles avec lesquelles la maquette a été
   composée (945 / -255, relevées sur le rendu Figma). Les descripteurs
   ascent-override et descent-override alignent la ligne de base du
   navigateur sur celle de la maquette, sans modifier les fichiers.

   MADE Mirage : le fichier présent est la version « personal use »
   (Regular seule). Il sera remplacé par les fichiers web de la licence
   achetée, Regular et Medium, sous le même nom de famille.
   ========================================================================== */

@font-face {
	font-family: "Noir Pro";
	src: url("assets/fonts/noir-pro-light.woff2") format("woff2"),
		url("assets/fonts/noir-pro-light.woff") format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
	ascent-override: 94.5%;
	descent-override: 25.5%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Noir Pro";
	src: url("assets/fonts/noir-pro-regular.woff2") format("woff2"),
		url("assets/fonts/noir-pro-regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	ascent-override: 94.5%;
	descent-override: 25.5%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Noir Pro";
	src: url("assets/fonts/noir-pro-italic.woff2") format("woff2"),
		url("assets/fonts/noir-pro-italic.woff") format("woff");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
	ascent-override: 94.5%;
	descent-override: 25.5%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Noir Pro";
	src: url("assets/fonts/noir-pro-medium.woff2") format("woff2"),
		url("assets/fonts/noir-pro-medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
	ascent-override: 94.5%;
	descent-override: 25.5%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "Noir Pro";
	src: url("assets/fonts/noir-pro-bold.woff2") format("woff2"),
		url("assets/fonts/noir-pro-bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
	ascent-override: 94.5%;
	descent-override: 25.5%;
	line-gap-override: 0%;
}

@font-face {
	font-family: "MADE Mirage";
	src: url("assets/fonts/made-mirage-regular.woff2") format("woff2"),
		url("assets/fonts/made-mirage-regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   2. Variables
   Les valeurs fluides atteignent celles de la maquette à 1440 px de large.
   ========================================================================== */

:root {
	--ls-color-taupe: #ab9988;
	--ls-color-taupe-light: #f7f6f4;
	--ls-color-beige: #f8f7f0;
	--ls-color-ink: #1e1e1e;
	--ls-color-black: #000;
	--ls-color-graphite: #3d3d3d;
	--ls-color-line: #ccc;
	--ls-color-field-line: #b3b3b3;
	--ls-color-button-hover-text: #d9d9d9;
	--ls-font-text: "Noir Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--ls-font-display: "MADE Mirage", Georgia, "Times New Roman", serif;
	--ls-gutter: clamp(1.25rem, -0.654rem + 7.81vw, 6.375rem);
	--ls-footer-gutter: clamp(1.25rem, -0.654rem + 7.81vw, 4.375rem);
	--ls-wrap: 77.25rem;
	--ls-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	--ls-ease-appear: cubic-bezier(0.57, 0.57, 0, 0.97);
	--ls-ease-wipe: cubic-bezier(0.65, 0, 0.35, 1);
}

/* ==========================================================================
   3. Familles de polices
   Le thème parent et Expertise Core fixent « Inter Tight » sur les sélecteurs
   ci-dessous (relevés dans main.min.css et expertise-core.min.css, hors
   WooCommerce, non installé). Les mêmes sélecteurs reçoivent Noir Pro.
   ========================================================================== */

body,
.qodef-h3,
h3,
.qodef-h4,
h4,
.qodef-h5,
h5,
.qodef-h6,
h6,
.wp-block-quote,
blockquote,
.qodef-theme-button,
button[type=submit],
input[type=submit],
.mfp-bottom-bar .mfp-counter,
.mfp-bottom-bar .mfp-title,
.qodef-comment-item #respond .comment-reply-title,
.qodef-m-filter .qodef-m-filter-item,
.wp-block-button .wp-block-button__link,
.qodef-mobile-header-navigation ul li ul li>a,
.qodef-mobile-header-navigation>ul>li>a,
.qodef-header-navigation>ul>li>a,
.qodef-header-navigation>ul>li.qodef-menu-item--narrow ul li>a,
.qodef-svg--drag-cursor text,
.widget.widget_rss ul .rsswidget,
.widget.widget_block .wp-block-button .wp-block-button__link,
.qodef-background-text .qodef-m-background-text,
.qodef-fullscreen-menu>ul>li>a,
.qodef-fullscreen-menu .qodef-drop-down-second-inner ul li>a,
#qodef-page-header .qodef-header-logo-link.qodef-source--textual,
.qodef-header-switch-navigation ul li a,
.qodef-header--vertical-sliding .qodef-header-vertical-sliding-navigation>ul>li>a,
.qodef-header--vertical-sliding .qodef-header-vertical-sliding-navigation>ul>li .qodef-drop-down-second-inner ul li>a,
.qodef-map-marker-holder .qodef-info-window-inner .qodef-info-window-location,
#qodef-page-mobile-header .qodef-mobile-header-logo-link.qodef-source--textual,
#qodef-side-area-mobile-header .qodef-m-navigation ul li ul li>a,
#qodef-side-area-mobile-header .qodef-m-navigation>ul>li>a,
.qodef-header-navigation ul li.qodef-menu-item--wide .qodef-drop-down-second-inner>ul>li ul li>a,
.qodef-twitter-list.qodef-layout--columns #ctf .ctf-author-name,
.qodef-twitter-list.qodef-layout--columns #ctf .ctf-context,
.qodef-twitter-list.qodef-layout--columns #ctf .ctf-tweet-meta,
.qodef-twitter-list.qodef-layout--columns #ctf .ctf-twitterlink,
.qodef-events-list.qodef-item-layout--info-table .qodef-e-date,
.qodef-events-list.qodef-item-layout--info-table .qodef-e-date .qodef-e-day,
.qodef-events-list.qodef-item-layout--info-table .qodef-e-speaker,
#qodef-single-portfolio-navigation .qodef-m-nav-label,
.qodef-banner .qodef-m-subtitle,
.qodef-button.qodef-html--link,
.qodef-dropcaps .qodef-m-letter,
.qodef-interactive-link-showcase .qodef-m-item .qodef-e-title,
.qodef-progress-bar.qodef-layout--circle .qodef-m-value,
.qodef-slicer-slider .qodef-m-pagination,
.qodef-slicer-slider .qodef-m-pagination-length,
.qodef-stamp,
.qodef-stamp .qodef-m-centered-text,
.qodef-tabs.qodef-layout--simple .qodef-tabs-navigation li a,
.qodef-text-marquee .qodef-m-content,
.qodef-vertical-split-slider .qodef-m-label .qodef-m-label-counter,
.qodef-vertical-split-slider-responsive .qodef-m-label .qodef-m-label-counter,
.qodef-vertical-split-slider .qodef-m-label .qodef-m-label-text,
.qodef-vertical-split-slider-responsive .qodef-m-label .qodef-m-label-text,
.qodef-social-share .qodef-social-title,
#qodef-page-spinner.qodef-layout--textual .qodef-m-text,
.qodef-social-icons-group .qodef-icon-holder.qodef--textual,
#qodef-page-header .widget_expertise_core_svg_icon .qodef-m-text,
.qodef-wishlist-dropdown .qodef-m-link-count,
.qodef-working-hours-list .qodef-e-time {
	font-family: var(--ls-font-text);
}

.qodef-h1,
h1,
.qodef-h2,
h2,
.qodef--default-title {
	font-family: var(--ls-font-display);
	font-synthesis: none;
}

.qodef-h1,
h1,
.qodef--default-title {
	font-weight: 500;
}

.qodef-h2,
h2 {
	font-weight: 400;
}

/* ==========================================================================
   4. Couleurs du texte
   ========================================================================== */

body,
.qodef-h1,
h1,
.qodef-h2,
h2,
.qodef-h3,
h3,
.qodef-h4,
h4,
.qodef-h5,
h5,
.qodef-h6,
h6,
.qodef--default-title {
	color: var(--ls-color-ink);
}

/* ==========================================================================
   5. Éléments communs
   ========================================================================== */

/*
 * Défilement doux : coupé au niveau de la racine, à dessein.
 *
 * Le thème parent amène la page aux ancres du menu et au bouton « retour en
 * haut » avec une animation jQuery sur scrollTop. Elementor, lui, pose
 * « html { scroll-behavior: smooth } » dans frontend.min.css. Les deux ne
 * peuvent pas cohabiter : chaque pas de l'animation déclenche un défilement
 * doux natif qui annule le précédent, et la page ne bouge plus du tout. Les
 * entrées Expertises, Honoraires et Contact du menu ainsi que le bouton de
 * retour en haut restaient donc sans effet.
 *
 * Le sélecteur « html:root » passe devant celui d'Elementor par sa seule
 * spécificité, sans « !important » et sans dépendre de l'ordre de chargement,
 * qui place la feuille d'Elementor après celle du thème enfant. Le défilement
 * reste animé, mais par le thème, et les rares défilements pilotés par le
 * thème enfant demandent « behavior » explicitement (assets/js/site.js).
 */
html:root {
	scroll-behavior: auto;
}

.ls-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/*
 * Groupe de mots qui ne se coupe pas en fin de ligne, trait d'union compris
 * (« Jean-Baptiste Giniès », « Moyen-Orient ») : avec une simple espace
 * insécable, le navigateur couperait au trait d'union.
 */
.ls-nowrap {
	white-space: nowrap;
}

/* Les pages construites avec Elementor gèrent leurs propres marges. */
body.elementor-page #qodef-page-inner {
	padding: 0;
}

/* Bouton taupe : widget Bouton d'Elementor et bouton d'envoi du formulaire. */
.ls-section .ls-button .elementor-button,
.ls-form .wpcf7-submit.ls-form__submit {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	/* Un input de type submit ne dispose pas ses enfants en boîte flexible :
	   seul text-align aligne son libellé de la même façon sur tous les moteurs. */
	text-align: left;
	box-sizing: border-box;
	/*
	 * Largeur fixe de la maquette. Volontairement pas de plafond en pourcentage :
	 * le conteneur du bouton s'ajuste à son contenu, un « min(…, 100%) » se
	 * résoudrait donc contre la largeur du texte et réduirait le bouton à 133,63 px
	 * sur toutes les tailles d'écran (mesuré). À 200 % de taille de police sur un
	 * écran de 320 px, le fond du bouton est rogné à droite, mais son libellé,
	 * aligné à gauche, reste entièrement lisible et cliquable.
	 */
	width: 10.375rem;
	min-width: 0;
	height: 3.125rem;
	margin: 0;
	padding: 0 0 0 1.9375rem;
	border: 0;
	border-radius: 0;
	background-color: var(--ls-color-taupe);
	box-shadow: none;
	color: #fff;
	font-family: var(--ls-font-text);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.25s var(--ls-ease), color 0.25s var(--ls-ease);
}

.ls-section .ls-button .elementor-button:hover,
.ls-section .ls-button .elementor-button:focus-visible,
.ls-form .wpcf7-submit.ls-form__submit:hover,
.ls-form .wpcf7-submit.ls-form__submit:focus-visible {
	background-color: var(--ls-color-ink);
	color: var(--ls-color-button-hover-text);
}

.ls-section .ls-button .elementor-button:focus-visible,
.ls-form .wpcf7-submit.ls-form__submit:focus-visible,
.ls-plus:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 3px;
}

.ls-section .ls-button .elementor-button-content-wrapper,
.ls-section .ls-button .elementor-button-text {
	display: block;
	line-height: 1;
}

/*
 * Le thème parent retire l'outline de tous les boutons d'envoi. Les deux boutons
 * de la maquette ont leur propre repère ci-dessus ; cette règle couvre les autres
 * (recherche, commentaires) pour qu'aucun ne reste sans repère au clavier.
 */
body[class] :is(input[type="submit"], button[type="submit"], .qodef-theme-button):focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* Le thème ne donne aucun repère de focus à son champ de recherche. */
body[class] .qodef-search-form-field:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 2px;
}

/* Repère de focus au clavier sur tous les liens, dans leur propre couleur. */
body[class] a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/*
 * Sauf sur le fond taupe du pied de page et de la zone latérale : le beige du
 * texte n'y atteint que 2,56 pour 1, en dessous du rapport de 3 pour 1 attendu
 * d'un repère de focus. L'encre y monte à 6,07 pour 1.
 */
body[class] #qodef-page-footer #qodef-page-footer-top-area a:focus-visible,
body[class] #qodef-side-area a:focus-visible {
	outline-color: var(--ls-color-ink);
}

/* Lien « Aller au contenu » : visible au premier appui sur Tab, dans le style des boutons. */
body[class] .skip-link.screen-reader-text:focus {
	top: 0.625rem;
	left: 0.625rem;
	padding: 1.1875rem 1.9375rem;
	border-radius: 0;
	background-color: var(--ls-color-ink);
	box-shadow: 0 0 0 3px #fff;
	color: #fff;
	font-family: var(--ls-font-text);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 3px;
}

/* Titre de page atteint par le lien « Aller au contenu » (assets/js/site.js). */
body[class] .qodef-page-title h1[tabindex="-1"]:focus {
	outline: none;
}

body[class] .qodef-page-title h1[tabindex="-1"]:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 4px;
}

/* Carré « + » ajouté par assets/js/legal-squad.js. */
.ls-plus {
	position: absolute;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3.0625rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background-color: #fff;
	color: var(--ls-color-black);
	cursor: pointer;
	transition: background-color 0.25s var(--ls-ease), color 0.25s var(--ls-ease);
}

.ls-plus::before {
	content: "";
	display: block;
	flex: 0 0 auto;
	width: var(--ls-plus-icon-width, 0.8125rem);
	height: var(--ls-plus-icon-height, 0.8125rem);
	background-color: currentColor;
	-webkit-mask: url("assets/svg/icon-plus.svg?v=1444") center / 100% 100% no-repeat;
	mask: url("assets/svg/icon-plus.svg?v=1444") center / 100% 100% no-repeat;
	transform: translate(var(--ls-plus-shift-x, 0px), var(--ls-plus-shift-y, 0px));
}

.ls-plus:focus-visible {
	background-color: var(--ls-color-taupe);
	color: #fff;
}

/*
 * Survol du carré : réservé aux appareils qui en ont un. Sur un écran tactile,
 * le survol simulé restait appliqué après l'appui et le carré gardait son fond
 * taupe jusqu'au prochain appui ailleurs.
 */
@media (hover: hover) {
	.ls-plus:hover {
		background-color: var(--ls-color-taupe);
		color: #fff;
	}
}

/*
 * Le titre d'un bloc repliable ouvre et ferme comme le carré « + », auquel le
 * clic est renvoyé (assets/js/legal-squad.js). Il en prend donc le curseur, et
 * son survol allume le carré : les deux se lisent comme une seule commande.
 * Le carré reste le seul élément du parcours clavier, le titre n'est qu'une
 * cible plus large pour la souris.
 */
.ls-reveal.is-ready .ls-reveal__title {
	cursor: pointer;
}

@media (hover: hover) {
	.ls-section .ls-reveal.is-ready:has(.ls-reveal__title:hover) > .ls-plus {
		background-color: var(--ls-color-taupe);
		color: #fff;
	}
}

/*
 * Bloc ouvert : le « + » devient « - », même barre horizontale, même place.
 * Les deux tracés portent shape-rendering="crispEdges" : la barre ne mesure
 * que 1,3 px une fois le dessin mis à l'échelle, et son épaisseur apparente
 * dépendait sinon de la position du carré dans la page. Le carré ouvert tombe
 * sur un pixel entier, les carrés fermés sur un demi-pixel à cause du filet de
 * 1,5 px qui sépare les rangées : le tiret ressortait plus pâle que les « + ».
 * Les arêtes sont désormais calées sur la grille de pixels, les six signes ont
 * exactement la même densité.
 *
 * Le suffixe ?v= des deux adresses suit le numéro de version du thème : il
 * n'est là que pour écarter la copie en cache des navigateurs et du CDN le
 * jour où l'un des deux tracés change.
 */
.ls-section .ls-reveal.is-open > .ls-plus::before {
	-webkit-mask-image: url("assets/svg/icon-minus.svg?v=1444");
	mask-image: url("assets/svg/icon-minus.svg?v=1444");
}

/* Saut de ligne de la maquette, retiré quand la colonne se rétrécit. */
@media only screen and (max-width: 1024px) {
	.ls-section br.ls-br-desktop {
		display: none;
	}
}

/*
 * Entre 1025 et 1365 px, la colonne est déjà plus étroite que dans la
 * maquette et certains sauts ne tombent plus en fin de ligne : un mot restait
 * seul (« temps, » dans les honoraires entre 1160 et 1330 px ; « Alvarez, »
 * puis « basé » dans la présentation du cabinet jusqu'à 1205 px). Chaque saut
 * est retiré, avec une marge, sous la largeur où il cesse de tomber juste.
 * Le premier saut de la présentation reste en place dès 1100 px : sans lui,
 * « Legal Squad » se coupait sur deux lignes à partir de 1205 px.
 */
@media only screen and (max-width: 1365px) {
	.ls-section .ls-fees__lead br.ls-br-desktop {
		display: none;
	}
}

@media only screen and (max-width: 1279px) {
	.ls-section .ls-team__text br.ls-br-desktop:nth-of-type(2) {
		display: none;
	}
}

@media only screen and (max-width: 1099px) {
	.ls-section .ls-team__text br.ls-br-desktop {
		display: none;
	}
}

/* ==========================================================================
   6. Apparition au défilement
   Le mécanisme vient du thème : « qodef--custom-appear » est la classe
   d'accroche de son module qodefAppear, qui pose « qodef--appeared » sur le
   bloc dès qu'il entre dans la fenêtre (15 % visible, images chargées). Le
   thème ne livre aucun style pour cette classe : le mouvement se décrit ici,
   et functions.php pose la classe sur les blocs retenus.

   Le mouvement reprend celui de la démo du thème, relevé sur ses widgets
   (liste d'équipe, vitrine de liens) : aucun fondu, jamais. Le contenu glisse
   de 20 px vers sa place en 0,6 s, accélération cubic-bezier(0.57, 0.57, 0,
   0.97) ; les images se dévoilent de gauche à droite par clip-path en 0,6 s,
   accélération cubic-bezier(0.65, 0, 0.35, 1). Aucun fondu : c'est ce qui
   distingue ce thème d'une apparition générique.

   Aucune de ces deux propriétés n'agit sur la mise en page : clip-path ne
   déplace rien, et la translation s'arrête à « transform: none ». La géométrie
   mesurée sur la maquette reste donc intacte au pixel près. Sans fondu, un
   incident laisse un texte lisible plutôt qu'un texte invisible.

   La classe « ls-anim » de l'élément racine vient d'un court script placé en
   tête de page. Sans JavaScript, ou quand le visiteur demande moins
   d'animations, elle est absente : rien n'est masqué ni décalé.
   ========================================================================== */

/* Contenu : glissement de 20 px, comme le contenu des listes du thème. */
html.ls-anim .qodef--custom-appear {
	transform: translateX(-20px);
	transition: transform 0.6s var(--ls-ease-appear) var(--ls-appear-delay, 0s);
}

html.ls-anim .qodef--custom-appear.qodef--appeared {
	transform: none;
}

/*
 * Images : dévoilement de gauche à droite, comme les images du thème.
 *
 * Le découpage porte sur l'image, pas sur le bloc surveillé. Un bloc découpé à
 * largeur nulle n'est jamais vu comme visible par un IntersectionObserver : son
 * dévoilement ne partirait jamais. Le thème place d'ailleurs le découpage sur
 * l'image à l'intérieur de ses widgets, et non sur le widget lui-même.
 */
html.ls-anim :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media).qodef--custom-appear {
	transform: none;
}

html.ls-anim :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media).qodef--custom-appear img {
	clip-path: inset(0 100% 0 0);
	transition: clip-path 0.6s var(--ls-ease-wipe) var(--ls-appear-delay, 0s), transform 0.6s var(--ls-ease-appear);
}

html.ls-anim :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media).qodef--custom-appear.qodef--appeared img {
	clip-path: inset(0);
}

/* Blocs voisins : chacun démarre un peu après le précédent. */
html.ls-anim .qodef--custom-appear:nth-child(2) {
	--ls-appear-delay: 0.08s;
}

html.ls-anim .qodef--custom-appear:nth-child(3) {
	--ls-appear-delay: 0.16s;
}

html.ls-anim .qodef--custom-appear:nth-child(4) {
	--ls-appear-delay: 0.24s;
}

html.ls-anim .qodef--custom-appear:nth-child(5) {
	--ls-appear-delay: 0.32s;
}

html.ls-anim .qodef--custom-appear:nth-child(n + 6) {
	--ls-appear-delay: 0.4s;
}

/*
 * Filet de sécurité : si le réglage système change après l'affichage, plus rien
 * ne bouge et rien n'est dévoilé partiellement.
 */
@media (prefers-reduced-motion: reduce) {
	html.ls-anim .qodef--custom-appear,
	html.ls-anim .qodef--custom-appear.qodef--appeared,
	html.ls-anim .qodef--custom-appear img,
	html.ls-anim :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media).qodef--custom-appear img,
	html.ls-anim :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media).qodef--custom-appear.qodef--appeared img {
		transform: none;
		clip-path: none;
		transition: none;
	}
}

/* ==========================================================================
   6 bis. Dépliage animé et survols
   Le dépliage anime la hauteur du bloc entre ses deux états, tels quels :
   ni l'état fermé ni l'état ouvert ne sont modifiés, la mesure de géométrie
   reste identique. Les survols ne déplacent rien non plus : seules la couleur
   d'un filet et l'échelle d'une image à l'intérieur de son cadre changent.
   ========================================================================== */

/* Pendant l'animation, le bloc masque ce qui dépasse de sa hauteur du moment. */
/*
 * Pendant le dépliage, le contenu est coupé au ras du bloc, sauf sur six pixels
 * autour : le carré « + » déborde de cinq pixels quand il porte son repère de
 * focus, qui serait sinon amputé pendant les 320 millisecondes de l'animation,
 * c'est-à-dire juste après l'appui sur Entrée.
 */
.ls-section .ls-reveal.is-animating {
	overflow: hidden;
	overflow: clip;
	overflow-clip-margin: 0.375rem;
}

/*
 * La biographie aligne son texte en bas. Pendant l'animation, l'aligner en haut
 * découvre le début du texte au lieu de le couper.
 */
.ls-section .ls-member.is-animating .ls-member__bio.elementor-widget.elementor-widget {
	justify-content: flex-start;
}

/* Survols : réservés aux appareils qui en ont un, pour ne pas rester collés au doigt. */
@media (hover: hover) {
	.ls-section :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media) img {
		transition: transform 0.6s var(--ls-ease-appear);
	}

	/*
	 * La carte d'un avocat est une seule unité, photo et biographie comprises :
	 * son survol agrandit la photo. Les grandes images réagissent à leur
	 * propre survol : la grille du contact contient tout le formulaire, celle
	 * des expertises toute la liste et celle de L'équipe toutes les cartes,
	 * l'image aurait donc grandi pendant la saisie ou pendant la lecture.
	 */
	.ls-section .ls-member:hover .ls-member__photo img,
	.ls-section .ls-team__media:hover img,
	.ls-section .ls-expertises__media:hover img,
	.ls-section .ls-contact__media:hover img {
		transform: scale(1.04);
	}

	.ls-section .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-expertise.e-con:not(:last-child) {
		transition: border-color 0.3s var(--ls-ease);
	}

	.ls-section .ls-member:hover .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-expertise.e-con:not(:last-child):hover {
		border-bottom-color: var(--ls-color-ink);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ls-section :is(.ls-member__photo, .ls-team__media, .ls-expertises__media, .ls-contact__media) img,
	.ls-section .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-expertise.e-con:not(:last-child) {
		transition: none;
	}

	.ls-section .ls-member:hover .ls-member__photo img,
	.ls-section .ls-team__media:hover img,
	.ls-section .ls-expertises__media:hover img,
	.ls-section .ls-contact__media:hover img {
		transform: none;
	}
}

/* ==========================================================================
   7. Structure des sections de l'accueil
   Les conteneurs Elementor sont en pleine largeur, sans marge interne :
   la mise en page est définie ici. Les mesures commentées sont celles de
   la maquette à 1440 px.
   ========================================================================== */

/*
 * Elementor ne déclare pas l'affichage des conteneurs sous 768 px : la
 * valeur est posée ici pour toutes les largeurs.
 */
.ls-section.e-con,
.ls-section .e-con {
	display: flex;
	flex-direction: column;
	gap: 0;
	padding: 0;
}

.ls-section .ls-wrap.e-con {
	width: min(100% - 2 * var(--ls-gutter), var(--ls-wrap));
	max-width: none;
	margin-right: auto;
	margin-left: auto;
}

.ls-section .elementor-widget.elementor-widget {
	width: 100%;
	max-width: 100%;
	margin: 0;
}

.ls-section .elementor-widget-text-editor p {
	margin: 0;
}

/* Titres de section : MADE Mirage 96 px, interlignage 96 px. */
.ls-section .ls-title .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(2.75rem, 1.5395rem + 4.9658vw, 6rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.03em;
}

.ls-section .elementor-widget-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ==========================================================================
   8. Hero
   ========================================================================== */

/*
 * Hauteur de la maquette : 825 px à 1440 px de large. Sur un écran peu haut
 * (téléphone à l'horizontale, petit ordinateur portable), le hero raccourcit
 * juste assez pour que le titre et le bouton restent visibles à l'ouverture
 * de la page, le bouton à 24 px du bas de l'écran. Partout ailleurs, la
 * hauteur ne change pas. « --ls-hero-top » : hauteur de l'en-tête placé
 * au-dessus du hero sur tablette et téléphone (sur ordinateur, l'en-tête se
 * superpose au haut du hero). 100svh : hauteur visible quand les barres du
 * navigateur sont affichées.
 */
.ls-section.ls-hero.e-con {
	--ls-hero-height: clamp(34rem, 57.3vw, 51.5625rem);
	--ls-hero-bottom: clamp(4rem, 9.5139vw, 8.5625rem);
	--ls-hero-top: 0rem;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: var(--ls-hero-height);
	overflow: hidden;
	background-color: var(--ls-color-graphite);
	isolation: isolate;
}

@supports (height: 100svh) {
	.ls-section.ls-hero.e-con {
		min-height: min(var(--ls-hero-height), calc(100svh - var(--ls-hero-top) + var(--ls-hero-bottom) - 1.5rem));
	}
}

@media only screen and (max-width: 1200px) {
	.ls-section.ls-hero.e-con {
		--ls-hero-top: 4.375rem;
	}
}

.ls-section.ls-hero .ls-hero__media.elementor-widget {
	position: absolute;
	inset: 0;
	z-index: -1;
	height: 100%;
}

/*
 * Vidéo de la bannière (voir functions.php) : même cadrage que l'image, qui
 * est son image d'attente. La vidéo la remplace quand legal-squad.js
 * s'exécute ; sans JavaScript, l'image reste. Aux adresses d'essai, qui
 * peuvent montrer une autre vidéo, l'image est masquée dès l'affichage.
 */
.ls-section.ls-hero .ls-hero__media video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body.ls-hero-essai .ls-section.ls-hero .ls-hero__media img {
	visibility: hidden;
}

/*
 * Voiles de la bannière (voir functions.php), posés sur le bloc de l'image,
 * sous le titre et sous l'en-tête ; ils couvrent aussi l'image d'attente.
 * Version retenue par le cabinet le 05/11/2026 : voile clair en haut, sans
 * voile en bas.
 * - Suffixe -voile : noir à 55 % en bas de la bannière, nul à 90 % de sa
 *   hauteur. Le titre et le bouton restent lisibles pendant toute la vidéo.
 * - Suffixes -haut-sombre et -haut-clair : noir ou blanc à 70 % en haut de la
 *   bannière, nul à 35 % de sa hauteur, pour la lisibilité de l'en-tête.
 *   Sur ordinateur seulement : en dessous de 1 201 px, l'en-tête est
 *   au-dessus de la bannière, sur fond blanc.
 * Les deux voiles se superposent quand les deux sont demandés.
 */
body.ls-hero-voile .ls-section.ls-hero .ls-hero__media.elementor-widget {
	--ls-hero-veil-bottom: linear-gradient(to top, rgb(0 0 0 / 55%), rgb(0 0 0 / 0%) 90%);
}

@media only screen and (min-width: 1201px) {
	body.ls-hero-haut-sombre .ls-section.ls-hero .ls-hero__media.elementor-widget {
		--ls-hero-veil-top: linear-gradient(to bottom, rgb(0 0 0 / 70%), rgb(0 0 0 / 0%) 35%);
	}

	body.ls-hero-haut-clair .ls-section.ls-hero .ls-hero__media.elementor-widget {
		--ls-hero-veil-top: linear-gradient(to bottom, rgb(255 255 255 / 70%), rgb(255 255 255 / 0%) 35%);
	}
}

body.ls-hero-voile .ls-section.ls-hero .ls-hero__media.elementor-widget::after,
body.ls-hero-haut-sombre .ls-section.ls-hero .ls-hero__media.elementor-widget::after,
body.ls-hero-haut-clair .ls-section.ls-hero .ls-hero__media.elementor-widget::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--ls-hero-veil-top, none), var(--ls-hero-veil-bottom, none);
	pointer-events: none;
}

/*
 * En-tête en beige sur le voile noir du haut (suffixe -haut-sombre) :
 * monogramme, liens, icône du menu et filet, à la place de l'encre et du
 * noir. Le reste ne change pas : survol de l'icône en taupe, repère de focus
 * avec son liseré blanc, barre collante sur fond blanc.
 */
@media only screen and (min-width: 1201px) {
	body.ls-hero-haut-sombre #qodef-page-header #qodef-page-header-inner {
		border-bottom-color: var(--ls-color-beige);
	}

	body.ls-hero-haut-sombre #qodef-page-header #qodef-page-header-inner .qodef-header-logo-link,
	body.ls-hero-haut-sombre #qodef-page-header #qodef-page-header-inner .qodef-header-navigation > ul > li > a,
	body.ls-hero-haut-sombre #qodef-page-header #qodef-page-header-inner .qodef-side-area-opener {
		color: var(--ls-color-beige);
	}

	body.ls-hero-haut-sombre #qodef-page-header #qodef-page-header-inner .qodef-side-area-opener:hover {
		color: var(--ls-color-taupe);
	}
}

/* Titre à 122 px du bord, bouton à 123 px, bouton à 137 px du bas. */
.ls-section.ls-hero .ls-hero__content.e-con {
	width: min(100% - 2 * var(--ls-gutter), var(--ls-wrap));
	margin: 0 auto;
	padding: 0 0 var(--ls-hero-bottom) clamp(0rem, 1.3889vw, 1.25rem);
}

/*
 * Deux lignes de 84 px. La marge de 27,5 px (28 px sur la maquette) place
 * la ligne de base de MADE Mirage au pixel près.
 */
.ls-section.ls-hero .ls-hero__title .elementor-heading-title {
	max-width: 44.0625rem;
	margin: 0 0 clamp(1.25rem, 1.9098vw, 1.71875rem);
	color: var(--ls-color-beige);
	font-family: var(--ls-font-display);
	font-size: clamp(2.875rem, 1.7143rem + 4.7625vw, 6rem);
	font-weight: 500;
	line-height: 0.875;
	letter-spacing: -0.04em;
}

.ls-section.ls-hero .ls-button.elementor-widget {
	align-self: flex-start;
	width: auto;
	margin-left: 1px;
}

/* ==========================================================================
   9. L'équipe
   ========================================================================== */

/* Titre à 96 px du haut, 171 px sous les cartes. */
.ls-section.ls-team.e-con {
	padding: clamp(4rem, 2.5rem + 3.9vw, 6rem) 0 clamp(4.5rem, 2rem + 9.7vw, 10.6875rem);
}

/* Colonnes de 572 et 527 px séparées de 109 px, 28 px libres à droite. */
.ls-section .ls-team__grid.e-con {
	display: grid;
	grid-template-columns: minmax(0, 46.2783%) minmax(0, 42.6375%);
	justify-content: start;
	align-items: start;
	column-gap: 8.8188%;
}

/* Interlignage de 97 px (101 %). */
.ls-section .ls-team__intro .ls-title .elementor-heading-title {
	line-height: 1.0104;
}

.ls-section .ls-team__text.elementor-widget.elementor-widget {
	width: calc(100% - 0.375rem);
	margin: clamp(1.75rem, 0.9rem + 1.9vw, 2.5625rem) 0 0 0.375rem;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: clamp(1.125rem, 1.0788rem + 0.1925vw, 1.25rem);
	font-weight: 300;
	line-height: 1.2;
}

.ls-section .ls-team__text.elementor-widget p + p {
	margin-top: 1.2em;
}

.ls-section .ls-team__members.e-con {
	display: flex;
	flex-direction: column;
	gap: 4.125rem;
	padding-top: 1.75rem;
}

/* Carte de 280 px : photo, identité, biographie calée sur le filet. */
.ls-section .ls-member.e-con {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 17.5rem;
}

.ls-section .ls-member__head.e-con {
	display: flex;
	flex-direction: row;
	flex: 0 0 auto;
	flex-wrap: nowrap;
	align-items: flex-start;
	min-height: 10.1875rem;
}

.ls-section .ls-member__photo.elementor-widget.elementor-widget {
	flex: 0 0 auto;
	width: 8.9375rem;
	height: 8.9375rem;
	margin: 0.625rem 1rem 0.625rem 0.625rem;
	overflow: hidden;
	border-radius: 50%;
	background-color: var(--ls-color-taupe-light);
}

.ls-section .ls-member__identity.e-con {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 0.34375rem;
	width: auto;
	min-width: 0;
	/* 5,5 px et 62,5 px de la maquette, exprimés en rem : le nom reste centré sur
	   la photo quand le visiteur agrandit la taille de police (mesuré : le nom
	   remontait de 48 px par rapport au centre de la photo à 200 %). */
	margin-top: 3.90625rem;
}

.ls-section .ls-member__role .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: 0.625rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
}

.ls-section .ls-member__name .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
}

/*
 * Biographie en bas de carte : dernière ligne à 12 px du filet de 1,5 px.
 * Largeurs de texte de la maquette : 465 px, puis 479 px pour la seconde carte.
 */
.ls-section .ls-member__bio.elementor-widget.elementor-widget {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: flex-end;
	gap: 0;
	padding: 0 3.875rem 0.75rem 0;
	border-bottom: 1.5px solid var(--ls-color-line);
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 0.9375rem;
	font-weight: 300;
	line-height: 1;
}

.ls-section .ls-member:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget {
	padding-right: 3rem;
	padding-bottom: 0.625rem;
}

.ls-section .ls-member__bio.elementor-widget p + p {
	margin-top: 1em;
}

.ls-section .ls-member.is-ready:not(.is-open) .ls-member__bio p:not(:first-child) {
	display: none;
}

/*
 * Biographie ouverte (cadres « BIO » de la maquette) : Noir Pro Regular 13 px
 * sur 13 px, une ligne vide entre les paragraphes, carré « + » sous le texte.
 */
.ls-section .ls-member.is-open .ls-member__bio.elementor-widget.elementor-widget {
	padding-top: 3.375rem;
	padding-bottom: 3.40625rem; /* 54,5 px, exprimé en rem pour suivre la taille de police */
	font-size: 0.8125rem;
	font-weight: 400;
}

.ls-section .ls-member.is-open:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget {
	padding-top: 3.0625rem;
	padding-right: 2.75rem;
	padding-bottom: 3.21875rem; /* 51,5 px, exprimé en rem pour suivre la taille de police */
}

/*
 * Carré de 48 x 49 px posé sur le filet, icône décalée comme sur la maquette.
 *
 * Le filet de 1,5 px est arrondi aux pixels de l'écran : 1 px sur un écran
 * standard, 1,5 px sur un écran Retina, 1,33 px à trois pixels par point. Un
 * carré placé à 1 px du bas recouvrait donc le haut du filet sur les écrans
 * denses, qui paraissait plus fin sous le carré, surtout au survol quand il
 * passe à l'encre. Le carré descend jusqu'au bas de la carte et réserve en
 * dessous une bordure transparente de la même épaisseur que le filet, arrondie
 * de la même façon ; son fond s'arrête au-dessus d'elle (background-clip). Le
 * carré peint garde ses 48 x 49 px et se pose exactement sur le filet à toutes
 * les densités (vérifié à 1, 1,25, 1,5, 2 et 3 pixels par point).
 */
.ls-section .ls-member > .ls-plus {
	right: 0;
	bottom: 0;
	box-sizing: content-box;
	border-bottom: 1.5px solid transparent;
	background-clip: padding-box;
	--ls-plus-shift-x: -0.5px;
	--ls-plus-shift-y: 1px;
}

/*
 * Associés et collaborateur. Demande du cabinet du 05/11/2026 : un avocat
 * collaborateur arrive le 1er janvier, en distinguant « Avocats Associés »
 * et « Avocat Collaborateur ». Préparé sur l'aperçu de l'accueil
 * (?apercu=nouveautes, voir functions.php). Un titre au-dessus de chaque
 * groupe de cartes ; les cartes des associés gardent leur conteneur et leurs
 * réglages, celle du collaborateur est dans un second conteneur de cartes.
 * Titres en MADE Mirage, à l'échelle des villes de « Nos bureaux ».
 *
 * Sur ordinateur, le haut des capitales du premier titre est à la hauteur de
 * celui de « L'équipe ». Les deux tailles suivent la largeur de l'écran
 * jusqu'à 1 440 px : la marge suit le même calcul (métriques de MADE Mirage,
 * capitales de 0,70 em), plafonnée au-delà.
 */
.ls-section .ls-team__people.e-con {
	display: flex;
	flex-direction: column;
	gap: 0;
	padding-top: min(0.498vw, 0.443rem);
}

.ls-section .ls-team__people .ls-team__members.e-con {
	padding-top: 0;
}

.ls-section .ls-team__group.elementor-widget.elementor-widget {
	margin: 0 0 2.25rem;
}

.ls-section .ls-team__members + .ls-team__group.elementor-widget.elementor-widget {
	margin-top: 6rem;
}

.ls-section .ls-team__group .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-black);
	font-family: var(--ls-font-display);
	font-size: clamp(1.875rem, 1.6429rem + 0.9524vw, 2.5rem);
	font-weight: 400;
	line-height: 1;
}

/*
 * Photo sous le texte de L'équipe. Demande du cabinet du 05/11/2026 : avec la
 * carte du collaborateur, la colonne des cartes s'allonge et laissait un grand
 * blanc sous le texte. Sur ordinateur, la colonne du texte prend la hauteur de
 * celle des cartes et la photo occupe la place qui reste : son bas tombe sur le
 * filet de la dernière carte à toutes les largeurs, ses bords suivent ceux du
 * texte. Photo du cabinet (vue sur l'Arc de Triomphe depuis le bureau),
 * recadrée en 4:5. Entre 1 025 et 1 440 px, le cadre s'affine (rapport mesuré
 * de 0,58 à 0,81) : l'image est rognée sur les côtés, l'Arc reste au centre.
 * Écart sous le texte : 40 px à 1 025 px, 48 px dès 1 440 px, où la mise en
 * page cesse de s'élargir.
 */
.ls-section .ls-team__intro.e-con:has(> .ls-team__media) {
	align-self: stretch;
}

.ls-section .ls-team__media.elementor-widget.elementor-widget {
	position: relative;
	flex: 1 1 auto;
	width: calc(100% - 0.375rem);
	min-height: 18rem;
	margin: clamp(2.5rem, 1.265rem + 1.9277vw, 3rem) 0 0 0.375rem;
	overflow: hidden;
	background-color: var(--ls-color-taupe-light);
}

.ls-section .ls-team__media.elementor-widget img {
	position: absolute;
	inset: 0;
}

/* ==========================================================================
   10. Chiffres clés
   ========================================================================== */

/* Bande de 235 px : 52 px au-dessus, 51 px en dessous. */
.ls-section.ls-figures.e-con {
	padding: clamp(2.5rem, 3.6112vw, 3.25rem) 0 clamp(2.5rem, 3.5417vw, 3.1875rem);
	background-color: var(--ls-color-taupe-light);
}

/* Blocs de 276, 260 et 263 px séparés de 46 px, groupe décalé de 6,5 px. */
.ls-section .ls-figures__list.e-con {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem 2.875rem;
	padding-left: 0.8125rem;
}

.ls-section .ls-figure.e-con {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	width: auto;
	min-width: 16.25rem;
}

.ls-section .ls-figure.e-con:nth-child(1) {
	min-width: 17.25rem;
}

.ls-section .ls-figure.e-con:nth-child(3) {
	min-width: 16.4375rem;
}

.ls-section .ls-figure__value .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(4rem, 2.9788rem + 4.1905vw, 6.75rem);
	font-weight: 400;
	line-height: 1;
	white-space: nowrap;
}

/* Signe « + » en 96 px dans une ligne de 108 px, sans agrandir la ligne. */
.ls-section .ls-figure__value .ls-figure__sign {
	font-size: 0.888889em;
	line-height: 1;
}

.ls-section .ls-figure__label .elementor-heading-title {
	margin: 0.125rem 0 0;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 300;
	line-height: calc(22 / 18);
}

/* ==========================================================================
   11. Nos expertises
   ========================================================================== */

/*
 * Titre à 135,5 px du haut de section. Les 160 px sous l'image appartiennent à
 * la section des honoraires (section 12), pour que le lien « Honoraires » du
 * menu n'amène pas son titre collé au bord haut de l'écran.
 */
.ls-section.ls-expertises.e-con {
	padding: clamp(4.5rem, 9.41vw, 8.46875rem) 0 0;
}

/* Image de 616 x 682 px à 104 px du bord, liste de 618 px collée à l'image. */
.ls-section .ls-expertises__grid.e-con {
	display: grid;
	grid-template-columns: minmax(0, 616fr) minmax(0, 618fr);
	align-items: start;
	margin-top: clamp(2.5rem, 4.757vw, 4.28125rem);
	padding-left: 2px;
}

.ls-section .ls-expertises__media.elementor-widget.elementor-widget {
	grid-column: 1;
	grid-row: 1;
	height: auto;
	aspect-ratio: 616 / 682;
	overflow: hidden;
	background-color: var(--ls-color-taupe-light);
}

/*
 * Photo des deux associés (séance d'octobre 2026), plus haute que le cadre :
 * les deux silhouettes entières, chaussures comprises, avec de l'air au-dessus
 * des têtes. Le cadrage est propre à cette photo, à revoir si elle change.
 */
.ls-section .ls-expertises__media.elementor-widget.elementor-widget img {
	object-position: 50% 70%;
}

.ls-section .ls-expertises__list.e-con {
	grid-column: 2;
	grid-row: 1;
	display: flex;
	flex-direction: column;
}

/*
 * Lignes de la liste : titre à 61 px du bord gauche et à 20 px du bord droit.
 * Les écarts propres à chaque ligne de la maquette sont repris plus bas.
 */
.ls-section .ls-expertise.e-con {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	padding: calc(var(--ls-expertise-title, 3.125rem) - 0.5px) 1.25rem var(--ls-expertise-bottom, 2rem) 3.8125rem;
}

.ls-section .ls-expertise.e-con:not(:last-child) {
	border-bottom: 1.5px solid var(--ls-color-line);
}

.ls-section .ls-expertise__title .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: clamp(1.375rem, 1.0469rem + 1.3542vw, 2.25rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.04em;
	text-transform: uppercase;
}

/* Texte ouvert : 16 px sur 16 px, 17 px sous le titre, 27,5 px au-dessus du filet. */
.ls-section .ls-expertise__text.elementor-widget.elementor-widget {
	width: min(100% + 1px, 30.1875rem);
	margin: 1.09375rem 0 0 -1px;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1;
}

/* Valeur relevée sur la maquette, qui n'existe qu'à 1440 px : sous 1025 px, le
   remplissage responsive de la ligne s'applique dans les deux états. */
@media only screen and (min-width: 1025px) {
	.ls-section .ls-expertise.e-con.is-open {
		padding-bottom: 1.6875rem;
	}
}

.ls-section .ls-expertise.is-ready:not(.is-open) .ls-expertise__text {
	display: none;
}

.ls-section .ls-expertise > .ls-plus {
	top: var(--ls-expertise-plus, 2.0625rem);
	right: 0;
	width: 4rem;
	height: 4rem;
	--ls-plus-icon-width: 17.33px;
	--ls-plus-icon-height: 16.98px;
	--ls-plus-shift-x: -0.67px;
	--ls-plus-shift-y: 1.31px;
}

@media only screen and (min-width: 1025px) {
	.ls-section .ls-expertise.e-con:nth-child(1) {
		--ls-expertise-title: 2.625rem;
		--ls-expertise-plus: 1.5625rem;
	}

	.ls-section .ls-expertise.e-con:nth-child(3) {
		--ls-expertise-title: 3.4375rem;
		--ls-expertise-plus: 2.75rem;
		--ls-expertise-bottom: 2.375rem;
	}
}

/* ==========================================================================
   12. Honoraires
   ========================================================================== */

/*
 * Les 160 px qui séparent l'image des expertises du titre « Honoraires » sont
 * le haut de cette section, et non plus le bas de la précédente. La page ne
 * bouge pas d'un pixel, mais le lien « Honoraires » du menu, qui amène le haut
 * de la section en haut de l'écran, montre désormais cet espace au-dessus du
 * titre (161 px à 1 440 px, 73 px sur téléphone) au lieu d'un titre collé au
 * bord (1 px). Le demi-pixel qui faisait jusqu'ici le haut de la section
 * s'ajoute à cet espace : le titre et tout ce qui suit restent à leur place.
 */
.ls-section.ls-fees.e-con {
	padding: calc(clamp(4.5rem, 11.12vw, 10rem) + 0.5px) 0 clamp(4.5rem, 11.53vw, 10.375rem);
}

/*
 * Colonnes de 532 et 670 px séparées de 75 px : comme sur la maquette, la
 * seconde dépasse de 41 px le bord droit de la grille.
 */
.ls-section .ls-fees__grid.e-con {
	display: grid;
	grid-template-columns: minmax(0, 532fr) minmax(0, 670fr);
	align-items: start;
	column-gap: 4.6875rem;
	width: calc(100% + min(2.5625rem, var(--ls-gutter)));
	margin-top: clamp(2.5rem, 4.6875vw, 4.21875rem);
}

.ls-section .ls-fees__intro.e-con {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-top: 1.21875rem;
}

.ls-section .ls-fees__lead .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: clamp(1.625rem, 1.3929rem + 0.9524vw, 2.25rem);
	font-weight: 400;
	line-height: calc(34 / 36);
}

.ls-section .ls-fees__intro .ls-fees__text.elementor-widget.elementor-widget {
	width: min(100%, 23.75rem);
	margin-top: 1.96875rem;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 300;
	line-height: calc(22 / 18);
}

.ls-section .ls-fees__intro .ls-button.elementor-widget.elementor-widget {
	width: auto;
	margin-top: 2.5rem;
}

/* Blocs de 304 x 168 px, 62 px entre les colonnes, 34 px entre les lignes. */
/* La maquette laisse 62 px entre les deux colonnes pour 1440 px de contenu.
   Sous cette largeur (une fenêtre de 1440 px avec sa barre de défilement en
   laisse 1425), la gouttière se resserre pour garder les colonnes à leur
   largeur et les titres sur une ligne, comme dans la maquette. À 1440 px et
   au-delà, la valeur reste 62 px. */
.ls-section .ls-fees__list.e-con {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 19rem));
	justify-content: start;
	gap: 2.125rem;
	column-gap: clamp(2.5rem, 100% - 37.8rem, 3.875rem);
}

.ls-section .ls-fee.e-con {
	display: flex;
	flex-direction: column;
	min-height: 10.5rem;
}

.ls-section .ls-fee--forfait.e-con {
	grid-column: 2;
	grid-row: 1;
}

.ls-section .ls-fee--resultat.e-con {
	grid-column: 1;
	grid-row: 2;
}

/*
 * Quatrième formule, « Abonnement », demandée par le cabinet le 13/10/2026 et
 * absente de la maquette : elle occupe la case restée libre, à droite de
 * « résultat », avec les mêmes dimensions que les trois autres blocs.
 */
.ls-section .ls-fee--abonnement.e-con {
	grid-column: 2;
	grid-row: 2;
}

/* Pictogramme de 83 px ; titre à 99 px du haut du bloc. */
.ls-section .ls-fee__title.elementor-widget::before {
	content: "";
	display: block;
	width: 5.1875rem;
	height: 5.1875rem;
	margin: 0 0 0.96875rem;
	background-color: currentColor;
	-webkit-mask: var(--ls-fee-icon, none) center / contain no-repeat;
	mask: var(--ls-fee-icon, none) center / contain no-repeat;
}

/*
 * Les pictogrammes « forfait » et « résultat » sont posés 3 px plus bas.
 * Celui d'« abonnement » suit « résultat », son voisin de ligne, pour que les
 * deux cadres de la seconde ligne soient alignés. Le titre reste à 99 px du
 * haut du bloc dans tous les cas.
 */
.ls-section .ls-fee--forfait .ls-fee__title.elementor-widget::before,
.ls-section .ls-fee--resultat .ls-fee__title.elementor-widget::before,
.ls-section .ls-fee--abonnement .ls-fee__title.elementor-widget::before {
	margin: 0.1875rem 0 0.78125rem;
}

.ls-section .ls-fee--temps {
	--ls-fee-icon: url("assets/svg/picto-temps-passe.svg");
}

.ls-section .ls-fee--forfait {
	--ls-fee-icon: url("assets/svg/picto-forfait.svg");
}

.ls-section .ls-fee--resultat {
	--ls-fee-icon: url("assets/svg/picto-resultat.svg");
}

/*
 * Pas de pictogramme dans la maquette pour cette formule : un calendrier
 * avec une flèche qui tourne, dessiné dans le même style que les trois
 * autres (cadre de 83 px, trait de 4 px, extrémités arrondies).
 */
.ls-section .ls-fee--abonnement {
	--ls-fee-icon: url("assets/svg/picto-abonnement.svg");
}

.ls-section .ls-fee__title .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1.5rem;
	font-weight: 400;
	line-height: 1;
	text-wrap: balance;
}

/*
 * Entre 1025 et 1439 px, les colonnes de blocs se resserrent (273 px à
 * 1280 px, 293 px à 1366 px) alors que « Honoraires au temps passé » demande
 * 301 px en 24 px : ce titre passait seul sur deux lignes. La taille suit
 * maintenant la largeur des colonnes, de 24 px à 1440 px jusqu'à 19,5 px vers
 * 1195 px, avec 2 % de marge pour les écarts de rendu des polices. En dessous,
 * un titre trop long se coupe en deux lignes équilibrées.
 */
@media only screen and (min-width: 1025px) {
	.ls-section .ls-fee__title .elementor-heading-title {
		font-size: clamp(1.21875rem, 1.8605vw - 0.1709rem, 1.5rem);
	}
}

.ls-section .ls-fee__text.elementor-widget.elementor-widget {
	width: min(100%, 18.8125rem);
	margin-top: 0.8125rem;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 0.9375rem;
	font-weight: 300;
	line-height: 1;
}

/* ==========================================================================
   13. Contact et formulaire
   ========================================================================== */

.ls-section.ls-contact.e-con {
	padding: 0 0 clamp(4.5rem, 10.382vw, 9.34375rem);
}

/*
 * Image de 509 x 713 px, colonne de texte à 76 px de l'image : comme sur la
 * maquette, cette colonne de 679 px dépasse de 28 px le bord droit de la grille.
 */
.ls-section .ls-contact__grid.e-con {
	display: grid;
	grid-template-columns: minmax(0, 509fr) minmax(0, 651fr);
	align-items: start;
	column-gap: 4.75rem;
}

.ls-section .ls-contact__media.elementor-widget.elementor-widget {
	grid-column: 1;
	grid-row: 1;
	height: auto;
	aspect-ratio: 509 / 713;
	overflow: hidden;
	background-color: var(--ls-color-taupe-light);
}

.ls-section .ls-contact__body.e-con {
	grid-column: 2;
	grid-row: 1;
	display: flex;
	flex-direction: column;
	width: auto;
	margin-right: calc(min(1.75rem, var(--ls-gutter)) * -1);
	padding-top: 3.4375rem;
}

.ls-section .ls-contact__title .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(2.25rem, 1.8095rem + 1.8095vw, 3.4375rem);
	font-weight: 400;
	line-height: 1;
}

.ls-section .ls-contact__intro.elementor-widget.elementor-widget {
	margin-top: 1.5625rem;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 300;
	line-height: calc(22 / 18);
}

.ls-section .ls-contact__form.elementor-widget.elementor-widget {
	margin-top: 4.5rem;
}

/* Champs de 298 px séparés de 69 px, champ « Sujet » de 665 px. */
.ls-form .ls-form__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 18.625rem));
	justify-content: start;
	column-gap: 4.3125rem;
}

.ls-form .ls-field {
	margin: 0 0 4.125rem;
}

.ls-form .ls-field--wide {
	width: min(100%, 41.5625rem);
}

.ls-form .ls-field__label {
	display: block;
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1;
	text-transform: uppercase;
	cursor: pointer;
}

.ls-form .wpcf7-form-control-wrap {
	display: block;
}

/* Champ de 68 px, filet de 2 px compris. */
.ls-form .wpcf7-form-control.wpcf7-text,
.ls-form .wpcf7-form-control.wpcf7-textarea {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: 4.25rem;
	min-height: 4.25rem;
	margin: 0;
	padding: 1.75rem 0 0.5rem;
	border: 0;
	border-bottom: 2px solid var(--ls-color-field-line);
	border-radius: 0;
	background-color: transparent;
	box-shadow: none;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 300;
	line-height: 1.5rem;
	letter-spacing: 0;
	cursor: text;
	transition: border-color 0.25s var(--ls-ease);
}

/* Le champ grandit avec son contenu : pas de poignée de redimensionnement, absente de la maquette. */
@supports (field-sizing: content) {
	.ls-form .wpcf7-form-control.wpcf7-textarea {
		resize: none;
		field-sizing: content;
		/* Sans hauteur automatique, la hauteur fixe de la règle commune l'emporte
		   et le champ reste bloqué à 68 px, sans poignée pour l'agrandir. */
		height: auto;
		max-height: 15rem;
	}
}

@supports not (field-sizing: content) {
	.ls-form .wpcf7-form-control.wpcf7-textarea {
		resize: vertical;
	}
}

.ls-form .wpcf7-form-control.wpcf7-text:focus,
.ls-form .wpcf7-form-control.wpcf7-textarea:focus {
	border-bottom-color: var(--ls-color-ink);
	outline: none;
}

.ls-form .wpcf7-form-control.wpcf7-text:focus-visible,
.ls-form .wpcf7-form-control.wpcf7-textarea:focus-visible {
	box-shadow: 0 2px 0 var(--ls-color-ink);
}

/* En contraste forcé, les ombres ne sont pas rendues : repère de focus dessiné. */
@media (forced-colors: active) {
	.ls-form .wpcf7-form-control.wpcf7-text:focus-visible,
	.ls-form .wpcf7-form-control.wpcf7-textarea:focus-visible {
		outline: 2px solid CanvasText;
		outline-offset: 2px;
	}
}

/*
 * Champ refusé : le filet passe au rouge. Le sélecteur reprend les deux classes
 * de la règle du champ, sans quoi celle-ci, plus précise, garderait son filet
 * gris et rien ne signalerait le champ à reprendre.
 */
.ls-form .wpcf7-not-valid,
.ls-form .wpcf7-form-control.wpcf7-text.wpcf7-not-valid,
.ls-form .wpcf7-form-control.wpcf7-textarea.wpcf7-not-valid {
	border-bottom-color: #9b2c2c;
}

.ls-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 0.5rem;
	color: #9b2c2c;
	font-family: var(--ls-font-text);
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.3;
}

.ls-form .ls-form__actions {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.ls-form .wpcf7-spinner {
	margin: 0;
}

.ls-form .ls-form__notice {
	max-width: 32rem;
	margin: 1.25rem 0 0;
	color: var(--ls-color-graphite);
	font-family: var(--ls-font-text);
	font-size: 0.8125rem;
	font-weight: 300;
	line-height: 1.4;
}

/*
 * Lien de la mention vers la politique de confidentialité : même traitement que
 * les liens des documents de Complianz. Souligné pour être repérable autrement
 * que par la couleur, le texte voisin étant presque aussi foncé.
 */
.ls-form .ls-form__notice a {
	color: var(--ls-color-ink);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color 0.25s var(--ls-ease);
}

.ls-form .ls-form__notice a:hover {
	color: var(--ls-color-graphite);
	text-decoration-thickness: 2px;
}

/*
 * Champ piège contre les envois automatiques (functions.php) : hors de la vue,
 * du parcours au clavier et des lecteurs d'écran. Il n'est pas masqué par
 * « display: none », que certains robots savent repérer.
 */
.wpcf7 form .ls-form__trap {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.ls-section .wpcf7 form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: 0.875rem 1rem;
	border: 1px solid var(--ls-color-taupe);
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.4;
}

/*
 * Zone de réponse vide : masquée. Contact Form 7 la laisse affichée quand deux
 * champs sont validés en même temps, par exemple après un remplissage automatique
 * du nom et de l'adresse e-mail par le navigateur.
 */
.ls-section .wpcf7 form .wpcf7-response-output:empty {
	display: none;
}

/* Filet rouge pour tous les messages d'erreur, envoi écarté compris. */
.ls-section .wpcf7 form.invalid .wpcf7-response-output,
.ls-section .wpcf7 form.failed .wpcf7-response-output,
.ls-section .wpcf7 form.spam .wpcf7-response-output,
.ls-section .wpcf7 form.aborted .wpcf7-response-output {
	border-color: #9b2c2c;
}

/* ==========================================================================
   14. Cabinets
   ========================================================================== */

.ls-section.ls-offices.e-con {
	padding: 0 0 clamp(4.5rem, 9.41vw, 8.46875rem);
}

/* Titre sur 486 px, liste à 95 px du titre. */
.ls-section .ls-offices__grid.e-con {
	display: grid;
	grid-template-columns: minmax(0, 486fr) minmax(0, 655fr);
	align-items: start;
	column-gap: 5.9375rem;
}

.ls-section .ls-offices__title .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(2.375rem, 1.7714rem + 2.48vw, 4rem);
	font-weight: 400;
	line-height: 1;
}

/*
 * Avec une barre de défilement classique (Windows), une fenêtre de 1440 px ne
 * laisse que 480 px au titre : « cabinets à Paris et » (481 px) passait à la
 * ligne et le titre ne coupait plus comme la maquette. Il peut désormais
 * déborder de 8 px sur la gouttière de 95 px qui le sépare de la liste.
 */
@media only screen and (min-width: 1025px) {
	.ls-section .ls-offices__title .elementor-heading-title {
		margin-right: -0.5rem;
	}
}

/* Deux colonnes de 299 px séparées de 56 px, repère à 43,5 px du titre. */
.ls-section .ls-offices__list.e-con {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 18.6875rem));
	justify-content: start;
	gap: 3rem 3.5rem;
	padding-top: 2.71875rem;
}

.ls-section .ls-office__city.elementor-widget::before {
	content: "";
	display: block;
	width: 3.375rem;
	height: 4.25rem;
	margin-bottom: 1.4375rem;
	background-color: var(--ls-color-black);
	-webkit-mask: url("assets/svg/icon-pin.svg") left center / contain no-repeat;
	mask: url("assets/svg/icon-pin.svg") left center / contain no-repeat;
}

.ls-section .ls-office__city .elementor-heading-title {
	margin: 0;
	color: var(--ls-color-black);
	font-family: var(--ls-font-display);
	font-size: clamp(1.875rem, 1.6429rem + 0.9524vw, 2.5rem);
	font-weight: 500;
	font-synthesis: none;
	line-height: 1;
}

.ls-section .ls-office__address.elementor-widget.elementor-widget {
	margin-top: 0.96875rem;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: clamp(1.125rem, 0.9821rem + 0.58vw, 1.5rem);
	font-weight: 300;
	line-height: calc(29 / 24);
	text-transform: uppercase;
}

/* ==========================================================================
   15. En-tête, zone latérale et retour en haut
   ========================================================================== */

/*
 * Barre de 63 px, filet noir compris ; marges de 100 et 99 px à 1440 px.
 * Au-delà, le contenu de la barre s'aligne sur la colonne des sections
 * (--ls-wrap), comme le titre des pages et le contenu.
 */
#qodef-page-header {
	height: 3.9375rem;
	background-color: #fff;
}

#qodef-page-header #qodef-page-header-inner {
	align-items: flex-start;
	justify-content: flex-start;
	padding: 0 calc(max(var(--ls-gutter), (100% - var(--ls-wrap)) / 2) - 3px) 0 calc(max(var(--ls-gutter), (100% - var(--ls-wrap)) / 2) - 2px);
	border-bottom: 1px solid var(--ls-color-black);
}

/* Monogramme de 47 x 41 px à 10 px du haut (voir functions.php). */
#qodef-page-header #qodef-page-header-inner .qodef-header-logo-link {
	height: auto;
	max-height: none;
	margin: 0.625rem 2.641875rem 0 0;
	color: var(--ls-color-ink);
}

#qodef-page-header #qodef-page-header-inner .qodef-header-logo-link svg {
	display: block;
	width: 2.9375rem;
	height: 2.5625rem;
}

#qodef-page-header #qodef-page-header-inner .qodef-header-navigation {
	height: auto;
	margin: 0;
}

#qodef-page-header #qodef-page-header-inner .qodef-header-navigation > ul {
	height: auto;
	align-items: flex-start;
}

/*
 * Chaque lien est centré dans une boîte de la largeur prévue par la maquette,
 * les boîtes étant séparées de 27 px : 94 px pour « Legal Squad », 79 pour
 * « Honoraires », 58 pour « Contact ».
 *
 * « Expertises » remplace « Compétences » (103 px dans la maquette) à la
 * demande du cabinet, le 13/10/2026 : faute de modèle, ce lien prend la
 * largeur de son texte, ce qui garde l'écart de 27 px de part et d'autre.
 * Depuis le retrait d'« Actualités » (26/09/2026), « Contact » est le
 * quatrième lien : il reprend sa propre boîte de 58 px au lieu de celle
 * d'« Actualités », qui le décalait de 7 px vers la droite.
 */
#qodef-page-header #qodef-page-header-inner .qodef-header-navigation > ul > li {
	height: auto;
	margin: 0 1.6875rem 0 0;
}

#qodef-page-header #qodef-page-header-inner .qodef-header-navigation > ul > li:last-child {
	margin-right: 0;
}

#qodef-page-header .qodef-header-navigation > ul > li:nth-child(1) {
	min-width: 5.875rem;
}

#qodef-page-header .qodef-header-navigation > ul > li:nth-child(3) {
	min-width: 4.9375rem;
}

#qodef-page-header .qodef-header-navigation > ul > li:nth-child(4) {
	min-width: 3.625rem;
}

#qodef-page-header #qodef-page-header-inner .qodef-header-navigation > ul > li > a {
	height: auto;
	justify-content: center;
	padding: 1.25rem 0 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.0625rem;
	letter-spacing: 0;
	transition: color 0.25s var(--ls-ease);
}

#qodef-page-header .qodef-header-navigation > ul > li > a::before {
	display: none;
}

#qodef-page-header #qodef-page-header-inner .qodef-header-navigation > ul > li > a .qodef-menu-item-text {
	line-height: 1.0625rem;
	transform: none;
}

/*
 * Pas d'effet de survol sur les liens du menu, comme sur la maquette (choix
 * d'Ivan du 05/11/2026). Une règle prévoyait le taupe au survol et au focus,
 * mais elle était moins précise que les règles de base et ne s'appliquait
 * nulle part : retirée en 1.4.69, sans rien changer à l'écran.
 */

/*
 * Repère de focus des liens du menu : autour du texte, et non de la zone
 * cliquable qui touche le haut de la fenêtre.
 */
#qodef-page-header .qodef-header-navigation > ul > li > a:focus-visible {
	outline: none;
}

#qodef-page-header .qodef-header-navigation > ul > li > a:focus-visible .qodef-menu-item-text {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 4px;
}

/* Sur la photo du hero, un liseré blanc garde le repère visible sur les zones sombres. */
.home #qodef-page-header .qodef-header-logo-link:focus-visible,
.home #qodef-page-header .qodef-side-area-opener:focus-visible {
	outline-color: var(--ls-color-ink);
	box-shadow: 0 0 0 3px #fff;
}

.home #qodef-page-header .qodef-header-navigation > ul > li > a:focus-visible .qodef-menu-item-text {
	box-shadow: 0 0 0 4px #fff;
}

/* Icône de menu de 22 x 15 px : traits à 21, 28 et 35 px du haut. */
#qodef-page-header #qodef-page-header-inner .qodef-widget-holder {
	height: auto;
	margin-top: 1.3125rem;
	margin-left: auto;
}

#qodef-page-header .qodef-widget-holder .widget {
	margin: 0;
}

#qodef-page-header .qodef-widget-holder .qodef-side-area-opener {
	display: block;
	width: 1.375rem;
	height: 0.9375rem;
	color: var(--ls-color-ink);
}

#qodef-page-header .qodef-side-area-opener .qodef-m-icon,
#qodef-page-header .qodef-side-area-opener svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* Zone de clic d'au moins 24 px de côté (WCAG 2.2 AA) autour des icônes du menu,
   des liens du menu mobile et des réseaux sociaux : le dessin, la taille et la
   place de ce qui est visible ne bougent pas. */
#qodef-page-header .qodef-widget-holder .qodef-side-area-opener,
#qodef-page-mobile-header .qodef-mobile-header-opener,
#qodef-page-mobile-header .qodef-mobile-header-navigation > ul > li > a,
.ls-footer-social a {
	position: relative;
}

#qodef-page-header .qodef-widget-holder .qodef-side-area-opener::after,
#qodef-page-mobile-header .qodef-mobile-header-opener::after,
#qodef-page-mobile-header .qodef-mobile-header-navigation > ul > li > a::after,
.ls-footer-social a::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: max(100%, 1.5rem);
	height: max(100%, 1.5rem);
	transform: translate(-50%, -50%);
}

#qodef-page-header .qodef-widget-holder .qodef-side-area-opener:hover {
	color: var(--ls-color-taupe);
}

/* Sur l'accueil, l'en-tête se pose sur la photo du hero. */
.home #qodef-page-header {
	position: absolute;
	top: 0;
	left: 0;
	background-color: transparent;
}

#qodef-page-mobile-header #qodef-page-mobile-header-inner {
	padding: 0 var(--ls-gutter);
	border-bottom: 1px solid var(--ls-color-black);
}

#qodef-page-mobile-header .qodef-mobile-header-logo-link svg {
	display: block;
	width: 2.5rem;
	height: auto;
}

#qodef-page-mobile-header .qodef-mobile-header-opener {
	color: var(--ls-color-ink);
}

#qodef-page-mobile-header .qodef-mobile-header-opener svg {
	width: 1.375rem;
	height: 0.9375rem;
}

/*
 * Le thème impose une barre de défilement verticale au menu mobile
 * (overflow-y: scroll). Sur un ordinateur où les barres de défilement restent
 * visibles (Windows, ou macOS réglé pour toujours les afficher), fenêtre de
 * 1 200 px ou moins, une gouttière vide de 15 px apparaissait à droite du menu
 * ouvert. La barre ne s'affiche plus que si le menu dépasse la hauteur de la
 * fenêtre ; le défilement reste possible dans ce cas.
 */
#qodef-page-mobile-header .qodef-mobile-header-navigation {
	overflow-y: auto;
}

/* Liens du menu mobile alignés sur le logo. */
#qodef-page-mobile-header .qodef-mobile-header-navigation > ul:not(.qodef-content-grid) {
	padding-right: var(--ls-gutter);
	padding-left: var(--ls-gutter);
}

#qodef-page-mobile-header .qodef-mobile-header-navigation > ul > li > a {
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 400;
}

#qodef-side-area {
	background-color: var(--ls-color-taupe);
	color: var(--ls-color-beige);
}

#qodef-side-area #qodef-side-area-close {
	color: var(--ls-color-beige);
}

/*
 * Menu de la zone latérale : 12 px entre les liens, 40 px avant le bloc Contact.
 * La classe du widget l'emporte sur la règle commune des listes (section 15).
 */
#qodef-side-area #qodef-side-area-inner .widget.widget_nav_menu ul {
	margin: 0 0 2.5rem;
	padding: 0;
	list-style: none;
}

#qodef-side-area #qodef-side-area-inner .widget.widget_nav_menu ul li {
	margin: 0 0 0.75rem;
}

#qodef-side-area .widget_nav_menu ul li a {
	color: var(--ls-color-beige);
	font-family: var(--ls-font-display);
	font-size: 2rem;
	font-weight: 400;
	line-height: 1.1;
}

#qodef-side-area .widget_nav_menu ul li a:hover,
#qodef-side-area .widget_nav_menu ul li a:focus-visible {
	color: #fff;
}

#qodef-side-area #qodef-side-area-inner .widget ul.ls-footer-list {
	margin: 0 0 1.75rem;
}

#qodef-side-area #qodef-side-area-inner .widget ul.ls-footer-list li {
	margin: 0 0 0.5rem;
}

/*
 * Adresse électronique : une seule chaîne, sans espace pour se couper. À 200 %
 * de taille de police sur un écran de 390 px, elle dépassait de treize pixels
 * et faisait défiler la page en largeur. Elle peut désormais se couper.
 */
#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget ul.ls-footer-list a,
#qodef-side-area #qodef-side-area-inner .widget ul.ls-footer-list a {
	overflow-wrap: anywhere;
}

/* Bouton de 64 x 57 px à 61 px du bord droit, flèche de 25 px. */
#qodef-back-to-top {
	right: 3.8125rem;
	width: 4rem;
	height: 3.5625rem;
}

#qodef-back-to-top .qodef-back-to-top-icon {
	background-color: #fff;
	color: var(--ls-color-ink);
}

#qodef-back-to-top .qodef-back-to-top-icon::after {
	display: none;
}

#qodef-back-to-top .qodef-back-to-top-icon svg,
#qodef-back-to-top:hover .qodef-back-to-top-icon svg {
	width: 1.5625rem;
	height: auto;
	transform: translate(0.5px, 0.9px);
}

#qodef-back-to-top:hover .qodef-back-to-top-icon,
#qodef-back-to-top:focus-visible .qodef-back-to-top-icon {
	background-color: var(--ls-color-taupe);
	color: #fff;
}

/* --------------------------------------------------------------------------
   Barre collante
   Le thème la rend à l'intérieur de « #qodef-page-header » : les couleurs, le
   survol de l'icône, les repères de focus et les largeurs des entrées du menu
   réglés plus haut s'y appliquent déjà. Restent la barre elle-même et les
   réglages posés sur « #qodef-page-header-inner », que la barre collante n'a
   pas : elle range son contenu dans « .qodef-header-wrapper ».
   -------------------------------------------------------------------------- */

/*
 * Même barre de 63 px, filet noir compris, que l'en-tête de la page.
 *
 * Tant qu'elle n'est pas affichée, le thème la glisse hors de l'écran sans la
 * masquer : ses sept liens restaient dans le parcours clavier, invisibles.
 * Elle en sort donc, et y revient sans attendre quand elle descend, au bout du
 * glissement quand elle remonte.
 */
#qodef-page-header .qodef-header-sticky {
	height: 3.9375rem;
	background-color: #fff;
	visibility: hidden;
	transition: transform 0.5s, top 0.5s, visibility 0s 0.5s;
}

.qodef-header--sticky-display #qodef-page-header .qodef-header-sticky {
	visibility: visible;
	transition: transform 0.5s, top 0.5s, visibility 0s;
}

/* Le glissement de la barre se répète à chaque changement de sens : il tombe
   sous le réglage « moins d'animations », comme le reste des mouvements. */
@media (prefers-reduced-motion: reduce) {
	#qodef-page-header .qodef-header-sticky,
	.qodef-header--sticky-display #qodef-page-header .qodef-header-sticky {
		transition: none;
	}
}

#qodef-page-header .qodef-header-sticky .qodef-header-sticky-inner {
	height: 100%;
	padding: 0 calc(max(var(--ls-gutter), (100% - var(--ls-wrap)) / 2) - 3px) 0 calc(max(var(--ls-gutter), (100% - var(--ls-wrap)) / 2) - 2px);
	border-bottom: 1px solid var(--ls-color-black);
}

#qodef-page-header .qodef-header-sticky .qodef-header-wrapper {
	height: 100%;
	align-items: flex-start;
	justify-content: flex-start;
}

#qodef-page-header .qodef-header-sticky .qodef-header-logo {
	height: auto;
}

#qodef-page-header .qodef-header-sticky .qodef-header-logo-link {
	height: auto;
	max-height: none;
	margin: 0.625rem 2.641875rem 0 0;
	color: var(--ls-color-ink);
}

#qodef-page-header .qodef-header-sticky .qodef-header-logo-link svg {
	display: block;
	width: 2.9375rem;
	height: 2.5625rem;
}

#qodef-page-header .qodef-header-sticky .qodef-header-navigation {
	height: auto;
	margin: 0;
}

#qodef-page-header .qodef-header-sticky .qodef-header-navigation > ul {
	height: auto;
	margin: 0;
	align-items: flex-start;
}

#qodef-page-header .qodef-header-sticky .qodef-header-navigation > ul > li {
	height: auto;
	margin: 0 1.6875rem 0 0;
}

#qodef-page-header .qodef-header-sticky .qodef-header-navigation > ul > li:last-child {
	margin-right: 0;
}

#qodef-page-header .qodef-header-sticky .qodef-header-navigation > ul > li > a {
	height: auto;
	justify-content: center;
	padding: 1.25rem 0 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.0625rem;
	letter-spacing: 0;
	transition: color 0.25s var(--ls-ease);
}

#qodef-page-header .qodef-header-sticky .qodef-header-navigation > ul > li > a .qodef-menu-item-text {
	line-height: 1.0625rem;
	transform: none;
}

#qodef-page-header .qodef-header-sticky .qodef-widget-holder {
	height: auto;
	margin-top: 1.3125rem;
	margin-left: auto;
}

/*
 * Ancres du menu : le navigateur amène la section demandée en haut de la
 * fenêtre. Quand le visiteur remonte, la barre collante réapparaît en même
 * temps et recouvre ces premiers pixels : les titres « Honoraires » et
 * « Parlons de votre situation », qui commençaient alors à 1 px et à 55 px du
 * haut de leur section, disparaissaient derrière elle (depuis la 1.4.69, le
 * titre « Honoraires » est précédé dans sa section de l'espace qui le sépare
 * des expertises, voir section 12). Le thème enfant marque la section visée
 * juste avant la navigation (voir site.js) et réserve la hauteur de la barre.
 *
 * Connecté, la barre d'administration occupe les 32 premiers pixels et le
 * thème descend la barre collante d'autant. WordPress réserve déjà ces 32 px
 * par « scroll-padding-top » sur l'élément html, et le navigateur ajoute la
 * réserve ci-dessous à ce décalage : la section s'arrête juste sous la barre
 * collante dans les deux cas, à 63 px pour un visiteur et à 95 px connecté.
 * Une réserve portée à 95 px pour les comptes connectés laissait un vide de
 * 32 px sous la barre (mesuré : section à 127 px).
 */
.ls-anchor-offset {
	scroll-margin-top: 3.9375rem;
}

/* ==========================================================================
   16. Pied de page
   Les règles du thème ciblent « #qodef-page-footer #zone .widget:not(...) » :
   les sélecteurs ci-dessous passent par la grille pour garder la main.
   ========================================================================== */

/* Grille de 1300 px à 1440 px (70 px de chaque côté). */
#qodef-page-footer .qodef-content-grid {
	width: min(100% - 2 * var(--ls-footer-gutter), 81.25rem);
}

#qodef-page-footer #qodef-page-footer-top-area {
	background-color: var(--ls-color-taupe);
}

/* Zone de 417 px, logo à 50 px du haut. */
#qodef-page-footer #qodef-page-footer-top-area-inner {
	position: relative;
	min-height: 26.0625rem;
	padding-top: 3.125rem;
	padding-bottom: 5rem;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget,
#qodef-side-area #qodef-side-area-inner .widget {
	margin: 0;
	color: var(--ls-color-beige);
	font-family: var(--ls-font-text);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.2;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget .qodef-widget-title,
#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget .ls-footer-title,
#qodef-side-area #qodef-side-area-inner .widget .ls-footer-title {
	margin: 0 0 1.1875rem;
	color: var(--ls-color-beige);
	font-family: var(--ls-font-text);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget ul,
#qodef-side-area #qodef-side-area-inner .widget ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Liens espacés de 31 px. */
#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget ul li {
	margin: 0 0 0.8125rem;
	padding: 0;
	line-height: 1.2;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget a,
#qodef-side-area #qodef-side-area-inner .widget .ls-side-info a {
	color: var(--ls-color-beige);
	text-decoration: none;
	transition: color 0.25s var(--ls-ease);
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget a:hover,
#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget a:focus-visible,
#qodef-side-area #qodef-side-area-inner .widget .ls-side-info a:hover,
#qodef-side-area #qodef-side-area-inner .widget .ls-side-info a:focus-visible {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Le thème décale les liens de menu au survol : la maquette ne le prévoit pas. */
#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget.widget_nav_menu li a {
	padding-left: 0;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget.widget_nav_menu li a::before {
	display: none;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget .ls-footer-logo {
	display: inline-block;
	margin-left: -2px;
	color: var(--ls-color-beige);
	text-decoration: none;
	vertical-align: top;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget .ls-footer-logo:hover {
	color: #fff;
}

.ls-footer-logo svg {
	display: block;
	width: 21.875rem;
	max-width: 100%;
	height: auto;
}

/* Adresses sur deux lignes de 18 px, 24 px entre elles. */
#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget address.ls-footer-address,
#qodef-side-area #qodef-side-area-inner .widget address.ls-footer-address {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	max-width: 11rem;
	margin: -0.1875rem 0 2.5rem;
	color: var(--ls-color-beige);
	font-style: normal;
	line-height: 1.2;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget ul.ls-footer-social,
#qodef-side-area #qodef-side-area-inner .widget ul.ls-footer-social {
	display: flex;
	align-items: center;
	gap: 1.0625rem;
}

#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget ul.ls-footer-social li,
#qodef-side-area #qodef-side-area-inner .widget ul.ls-footer-social li {
	margin: 0;
}

.ls-footer-social a,
.ls-footer-social svg {
	display: block;
}

/*
 * Colonnes du pied de page. La maquette donne 522, 195,54, 243,68 et
 * 338,78 px, avec une adresse e-mail plus courte que la vraie
 * (contact@legalsquad-avocats.com, 234 px). Celle-ci touchait presque
 * l'adresse de Paris (7 px d'écart à 1440 px) et se coupait sur deux lignes
 * entre 1201 et 1439 px. La colonne Contact prend 50 px à la colonne
 * Adresses (57 px d'écart à 1440 px) et ne descend jamais sous 17rem
 * (272 px) : l'adresse tient sur une ligne avec 39 px d'écart au moins.
 * Logo, menu et colonne Contact restent à leur place de la maquette.
 */
@media only screen and (min-width: 1201px) {
	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid > .qodef-grid-inner {
		grid-template-columns: minmax(0, 522fr) minmax(0, 195.54fr) minmax(17rem, 293.68fr) minmax(0, 288.78fr);
		column-gap: 0;
	}

	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid-item:not(:first-child) {
		padding-top: 1.125rem;
	}

	/* Les réseaux sociaux se calent en bas à droite de la zone taupe. */
	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid,
	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid > .qodef-grid-inner,
	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid-item,
	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid-item .widget {
		position: static;
	}

	#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget ul.ls-footer-social {
		position: absolute;
		right: 0.75rem;
		bottom: 2rem;
	}
}

#qodef-page-footer #qodef-footer-copyright-area {
	background-color: var(--ls-color-graphite);
}

/* Bande de 54 px : textes en 11 px sur 13 px, à 12 px du bord gauche. */
#qodef-page-footer #qodef-page-footer-copyright-area-inner {
	padding: 1.09375rem 0.925rem 1.46875rem 0.75rem;
}

#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem 2rem;
}

#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget,
#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget .ls-footer-copyright {
	margin: 0;
	color: var(--ls-color-beige);
	font-size: 0.6875rem;
	font-weight: 300;
	line-height: calc(13 / 11);
}

/* Sur deux lignes (mobile), 26 px d'une ligne de liens à l'autre : cibles tactiles assez espacées (24 px au moins). */
#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8125rem 1.828rem;
}

#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget ul li {
	margin: 0;
	line-height: calc(13 / 11);
}

#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget a {
	color: var(--ls-color-beige);
}

#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget a:hover,
#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-inner .qodef-grid-item .widget a:focus-visible {
	color: #fff;
}

/*
 * Bouton « Gestion des cookies » des liens légaux (élément de menu de classe
 * ls-cookie-settings, voir functions.php) : il rouvre le bandeau de Complianz
 * et prend l'apparence des liens voisins. Le thème habille les boutons des
 * widgets du pied de page (fond noir) avec deux identifiants : les sélecteurs
 * reprennent les mêmes.
 */
.ls-cookie-settings__button,
#qodef-page-footer .widget .ls-cookie-settings__button,
#qodef-page-footer #qodef-footer-copyright-area .widget .ls-cookie-settings__button {
	display: inline;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	text-align: inherit;
	text-transform: none;
	cursor: pointer;
}

#qodef-page-footer .widget .ls-cookie-settings__button,
#qodef-page-footer #qodef-footer-copyright-area .widget .ls-cookie-settings__button {
	color: var(--ls-color-beige);
	transition: color 0.25s var(--ls-ease);
}

#qodef-page-footer .widget .ls-cookie-settings__button:hover,
#qodef-page-footer .widget .ls-cookie-settings__button:focus-visible,
#qodef-page-footer #qodef-footer-copyright-area .widget .ls-cookie-settings__button:hover,
#qodef-page-footer #qodef-footer-copyright-area .widget .ls-cookie-settings__button:focus-visible {
	border: 0;
	background: none;
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

#qodef-page-footer .widget .ls-cookie-settings__button:focus-visible,
#qodef-page-footer #qodef-footer-copyright-area .widget .ls-cookie-settings__button:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* ==========================================================================
   17. Tablette (1024 px et moins)
   ========================================================================== */

@media only screen and (max-width: 1024px) {
	.ls-section .ls-team__grid.e-con {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 3.5rem;
		column-gap: 0;
	}

	.ls-section .ls-team__intro.e-con {
		max-width: 40rem;
	}

	.ls-section .ls-team__text.elementor-widget.elementor-widget {
		width: 100%;
		margin-left: 0;
	}

	.ls-section .ls-team__members.e-con {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 3rem;
		padding-top: 0;
	}

	/* Associés et collaborateur : titres sous le texte, plus d'alignement à tenir. */
	.ls-section .ls-team__people.e-con {
		padding-top: 0;
	}

	/*
	 * Photo de L'équipe : les cartes passent sous le texte, il n'y a plus de
	 * blanc à combler. Masquée, elle n'est pas téléchargée (chargement à la
	 * demande).
	 */
	.ls-section .ls-team__media.elementor-widget.elementor-widget {
		display: none;
	}

	.ls-section .ls-team__members + .ls-team__group.elementor-widget.elementor-widget {
		margin-top: 4.5rem;
	}

	/*
	 * Photo de 120 px au lieu de 143 sur tablette : à 768 px (iPad en
	 * portrait), le nom disposait de 134 px et « Jean-Baptiste » (138 px)
	 * se coupait au trait d'union, sur trois lignes. Il dispose désormais de
	 * 157 px. Hauteur de l'en-tête et décalage du nom suivent la photo : le
	 * nom reste centré sur elle, comme à 1440 px. Le mobile (767 px et
	 * moins) garde ses propres valeurs, plus bas.
	 */
	.ls-section .ls-member__photo.elementor-widget.elementor-widget {
		width: 7.5rem;
		height: 7.5rem;
	}

	.ls-section .ls-member__head.e-con {
		min-height: 8.75rem;
	}

	.ls-section .ls-member__identity.e-con {
		margin-top: 3.1875rem;
	}

	.ls-section .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-member:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget {
		padding-right: 3.5rem;
		padding-bottom: 0.75rem;
	}

	.ls-section .ls-member.is-open .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-member.is-open:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget {
		padding-top: 1.5rem;
		padding-right: 3.5rem;
		padding-bottom: 4.25rem;
	}

	.ls-section .ls-figures__list.e-con {
		padding-left: 0;
	}

	.ls-section .ls-figure.e-con,
	.ls-section .ls-figure.e-con:nth-child(1),
	.ls-section .ls-figure.e-con:nth-child(3) {
		/* Plafonné à la largeur disponible : sans cela, une taille de police agrandie
		   fait déborder la colonne hors de l'écran. */
		min-width: min(13.5rem, 100%);
	}

	.ls-section .ls-expertises__grid.e-con {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 2.5rem;
		padding-left: 0;
	}

	.ls-section .ls-expertises__media.elementor-widget.elementor-widget {
		aspect-ratio: 16 / 9;
	}

	/* Au format 16:9, les deux associés cadrés des visages à la taille. */
	.ls-section .ls-expertises__media.elementor-widget.elementor-widget img {
		object-position: 50% 38%;
	}

	.ls-section .ls-expertises__media.elementor-widget.elementor-widget,
	.ls-section .ls-expertises__list.e-con {
		grid-column: 1;
		grid-row: auto;
	}

	.ls-section .ls-expertise.e-con {
		padding: 2rem 5.5rem 2rem 0;
	}

	.ls-section .ls-expertise > .ls-plus {
		top: 1.25rem;
	}

	.ls-section .ls-expertise__text.elementor-widget.elementor-widget {
		width: 100%;
		margin-left: 0;
	}

	.ls-section .ls-fees__grid.e-con {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 3.5rem;
		column-gap: 0;
		width: 100%;
	}

	.ls-section .ls-fees__intro.e-con {
		max-width: 38rem;
		padding-top: 0;
	}

	.ls-section .ls-fees__list.e-con {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 2rem;
	}

	.ls-section .ls-contact__grid.e-con {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
		column-gap: 2.5rem;
	}

	.ls-section .ls-contact__body.e-con {
		margin-right: 0;
		padding-top: 0;
	}

	.ls-form .ls-form__row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 2rem;
	}

	.ls-form .ls-field--wide {
		width: 100%;
	}

	.ls-section .ls-offices__grid.e-con {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 2.5rem;
		column-gap: 0;
	}

	.ls-section .ls-offices__title.elementor-widget.elementor-widget {
		width: min(100%, 30rem);
	}

	.ls-section .ls-offices__list.e-con {
		column-gap: 4rem;
		padding-top: 0;
	}
}

/* ==========================================================================
   18. Mobile (767 px et moins)
   ========================================================================== */

@media only screen and (max-width: 767px) {
	.ls-section .ls-team__members.e-con {
		grid-template-columns: minmax(0, 1fr);
		gap: 3rem;
	}

	.ls-section .ls-member.e-con {
		min-height: 0;
	}

	.ls-section .ls-member__photo.elementor-widget.elementor-widget {
		width: 6.5rem;
		height: 6.5rem;
		margin: 0 1rem 0 0;
	}

	.ls-section .ls-member__head.e-con {
		align-items: center;
		min-height: 0;
	}

	.ls-section .ls-member__identity.e-con {
		margin-top: 0;
	}

	.ls-section .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-member:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-member.is-open .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-member.is-open:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget {
		margin-top: 1.5rem;
		padding-top: 0;
		padding-right: 3.5rem;
		padding-bottom: 1rem;
	}

	.ls-section .ls-member.is-open .ls-member__bio.elementor-widget.elementor-widget,
	.ls-section .ls-member.is-open:nth-child(2) .ls-member__bio.elementor-widget.elementor-widget {
		padding-bottom: 4.25rem;
	}

	.ls-section .ls-figures__list.e-con {
		flex-direction: column;
		align-items: center;
	}

	.ls-section .ls-expertise.e-con {
		padding: 1.5rem 3.75rem 1.5rem 0;
	}

	.ls-section .ls-expertise > .ls-plus {
		top: 0.6875rem;
		width: 3rem;
		height: 3rem;
		--ls-plus-icon-width: 0.8125rem;
		--ls-plus-icon-height: 0.8125rem;
		--ls-plus-shift-x: 0px;
		--ls-plus-shift-y: 0px;
	}

	.ls-section .ls-fees__list.e-con {
		grid-template-columns: minmax(0, 1fr);
	}

	.ls-section .ls-fee--forfait.e-con,
	.ls-section .ls-fee--resultat.e-con,
	.ls-section .ls-fee--abonnement.e-con {
		grid-column: 1;
		grid-row: auto;
	}

	.ls-section .ls-fee.e-con {
		min-height: 0;
	}

	.ls-section .ls-fee__title.elementor-widget::before,
	.ls-section .ls-fee--forfait .ls-fee__title.elementor-widget::before,
	.ls-section .ls-fee--resultat .ls-fee__title.elementor-widget::before,
	.ls-section .ls-fee--abonnement .ls-fee__title.elementor-widget::before {
		width: 4rem;
		height: 4rem;
		margin: 0 0 1rem;
	}

	.ls-section .ls-contact__grid.e-con {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 2.5rem;
	}

	.ls-section .ls-contact__media.elementor-widget.elementor-widget {
		aspect-ratio: 4 / 3;
	}

	/*
	 * Au format 4:3, la photo de réunion (séance d'octobre 2026) est cadrée sur
	 * les mains qui écrivent, l'ordinateur et son logo, et les lunettes.
	 */
	.ls-section .ls-contact__media.elementor-widget.elementor-widget img {
		object-position: 50% 16%;
	}

	.ls-section .ls-contact__media.elementor-widget.elementor-widget,
	.ls-section .ls-contact__body.e-con {
		grid-column: 1;
		grid-row: auto;
	}

	.ls-section .ls-contact__form.elementor-widget.elementor-widget {
		margin-top: 2.5rem;
	}

	.ls-form .ls-form__row {
		grid-template-columns: minmax(0, 1fr);
	}

	.ls-form .ls-field {
		margin-bottom: 2.5rem;
	}

	.ls-form .ls-field__label {
		font-size: 1.0625rem;
	}

	.ls-section .ls-offices__list.e-con {
		grid-template-columns: minmax(0, 1fr);
		gap: 2.5rem;
	}

	#qodef-page-footer #qodef-page-footer-top-area-inner {
		min-height: 0;
		padding-top: 3rem;
		padding-bottom: 3rem;
	}

	#qodef-page-footer #qodef-page-footer-top-area .qodef-grid > .qodef-grid-inner {
		row-gap: 2.25rem;
	}

	.ls-footer-logo svg {
		width: 16rem;
	}

	#qodef-back-to-top {
		right: 1rem;
		bottom: 1rem;
		width: 3rem;
		height: 3rem;
	}

	#qodef-back-to-top .qodef-back-to-top-icon svg,
	#qodef-back-to-top:hover .qodef-back-to-top-icon svg {
		width: 1.25rem;
		transform: none;
	}

	/* En bas de page, le bouton de retour en haut (48 px à 16 px du bord) ne recouvre plus les liens. */
	#qodef-page-footer #qodef-page-footer-copyright-area-inner {
		padding: 1.25rem 0 4.75rem;
	}

	#qodef-page-footer #qodef-footer-copyright-area .qodef-grid-item {
		flex-direction: column;
		align-items: flex-start;
	}

	#qodef-page-footer .qodef-grid-inner .qodef-grid-item .widget address.ls-footer-address {
		max-width: none;
	}
}

/* ==========================================================================
   19. Pages intérieures (actualités, page 404)
   Les grilles et les boutons du thème reprennent ceux de l'accueil.
   ========================================================================== */

/*
 * Même colonne que l'accueil : 1236 px à 1440 px, marges fluides en dessous.
 * Le pied de page garde sa propre largeur (section 15).
 */
body[class] .qodef-content-grid {
	width: min(100% - 2 * var(--ls-gutter), var(--ls-wrap));
}

/* Bouton plein du thème (page 404 notamment) : bouton taupe de l'accueil. */
body[class] .qodef-button.qodef-layout--filled.qodef-html--link {
	justify-content: flex-start;
	box-sizing: border-box;
	min-width: 10.375rem;
	height: 3.125rem;
	padding: 0 1.9375rem;
	border: 0;
	background-color: var(--ls-color-taupe);
	color: #fff;
	font-family: var(--ls-font-text);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background-color 0.25s var(--ls-ease), color 0.25s var(--ls-ease);
}

body[class] .qodef-button.qodef-layout--filled.qodef-html--link:hover,
body[class] .qodef-button.qodef-layout--filled.qodef-html--link:focus-visible {
	background-color: var(--ls-color-ink);
	color: var(--ls-color-button-hover-text);
}

body[class] .qodef-button.qodef-layout--filled.qodef-html--link:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 3px;
}

body[class] .qodef-button.qodef-layout--filled.qodef-html--link .qodef-m-circle {
	display: none;
}

body[class] .qodef-button.qodef-layout--filled.qodef-html--link .qodef-m-text,
body[class] .qodef-button.qodef-layout--filled.qodef-html--link:hover .qodef-m-text {
	transform: none;
}

/* ==========================================================================
   20. Bandeau de cookies (Complianz)
   Complianz génère sa feuille (uploads/complianz/css/banner-1-optin.css) à
   partir des réglages de la bannière. Les règles passent par le conteneur
   #cmplz-cookiebanner-container pour garder la main quel que soit l'ordre de
   chargement ; quelques !important répondent à ceux de Complianz (petits
   écrans). « Tout accepter » et « Tout refuser » ont exactement la même
   apparence, comme le demande la CNIL.
   ========================================================================== */

#cmplz-cookiebanner-container,
#cmplz-manage-consent-container {
	--cmplz_banner_width: 32.875rem;
	--cmplz_banner_background_color: #fff;
	--cmplz_banner_border_color: #fff;
	--cmplz_text_color: var(--ls-color-ink);
	--cmplz_hyperlink_color: var(--ls-color-ink);
	--cmplz_button_accept_background_color: var(--ls-color-ink);
	--cmplz_button_accept_border_color: var(--ls-color-ink);
	--cmplz_button_accept_text_color: #fff;
	--cmplz_button_deny_background_color: var(--ls-color-ink);
	--cmplz_button_deny_border_color: var(--ls-color-ink);
	--cmplz_button_deny_text_color: #fff;
	--cmplz_button_settings_background_color: #fff;
	--cmplz_button_settings_border_color: var(--ls-color-ink);
	--cmplz_button_settings_text_color: var(--ls-color-ink);
	--cmplz_category_header_always_active_color: var(--ls-color-graphite);
	--cmplz_slider_active_color: var(--ls-color-ink);
	--cmplz_slider_inactive_color: #fff;
	--cmplz_slider_bullet_color: var(--ls-color-ink);
}

/*
 * Fenêtre de 526 px en bas à droite, quel que soit le réglage de position de
 * Complianz : sur l'accueil, elle couvre la photo du hero plutôt que son titre
 * et son bouton.
 */
#cmplz-cookiebanner-container .cmplz-cookiebanner {
	top: auto;
	right: 1.25rem;
	bottom: 1.25rem;
	left: auto;
	box-sizing: border-box;
	width: var(--cmplz_banner_width);
	min-width: 0;
	max-width: calc(100vw - 2.5rem);
	max-height: calc(100vh - 2.5rem);
	max-height: calc(100dvh - 2.5rem);
	padding: 1.625rem 1.875rem 1.5rem;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.125rem;
	border: 0;
	border-radius: 0;
	background-color: #fff;
	box-shadow: 0 0.75rem 3rem rgba(30, 30, 30, 0.18);
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	transform: none;
}

/*
 * La grille est déclarée sur l'état affiché, jamais sur la fenêtre elle-même,
 * et les deux états masqués sont exclus du sélecteur : même si Complianz
 * laissait un jour deux états en place, le masquage garderait la main.
 * Complianz pose « cmplz-hidden » dans le code de la page, puis échange
 * « cmplz-show » et « cmplz-dismissed » selon le choix du visiteur, et masque
 * ces deux états par « display: none ». Une déclaration passant par
 * l'identifiant du conteneur l'emportait sur ce masquage : la fenêtre restait
 * affichée au chargement et après « Tout accepter » ou « Tout refuser », alors
 * que le choix, lui, était bien enregistré.
 */
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show:not(.cmplz-dismissed):not(.cmplz-hidden) {
	display: grid;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show,
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show:hover {
	box-shadow: 0 0.75rem 3rem rgba(30, 30, 30, 0.18);
}

#cmplz-cookiebanner-container .cmplz-cookiebanner > * {
	grid-column: 1 / -1;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-divider,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-logo {
	display: none;
}

/* Titre à gauche, croix à droite. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	column-gap: 1rem;
	margin: 0;
	max-height: none;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-title {
	display: block;
	grid-column: 1;
	justify-self: start;
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: 1.625rem;
	font-synthesis: none;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: 0;
}

/* Croix de 14 px dans une zone de 40 px, alignée sur le bord du texte. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-close {
	display: flex;
	grid-column: 2;
	align-items: center;
	justify-content: center;
	justify-self: end;
	width: 2.5rem;
	height: 2.5rem;
	margin: -0.625rem -0.8125rem -0.625rem 0;
	color: var(--ls-color-ink);
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.25s var(--ls-ease);
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-close:hover {
	background-color: var(--ls-color-taupe-light);
	font-size: 1rem;
	line-height: 1;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-close:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: -2px;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-close svg {
	display: block;
	width: 0.875rem;
	height: 0.875rem;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body {
	min-width: 0;
	margin: 0;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body::-webkit-scrollbar-thumb {
	border-radius: 0;
	background-color: var(--ls-color-field-line);
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-categories {
	width: auto;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message {
	margin: 0;
	color: var(--ls-color-ink);
	font-size: 0.875rem;
	font-weight: 300;
	line-height: calc(22 / 14);
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message p {
	margin: 0;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Boutons : noirs pour accepter et refuser, filaire pour personnaliser. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.5rem;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
	flex: 1 1 0;
	box-sizing: border-box;
	min-width: 0;
	height: 3.125rem;
	min-height: 0;
	margin: 0;
	padding: 0 0.75rem;
	border: 1px solid var(--ls-color-ink);
	border-radius: 0;
	background-color: var(--ls-color-ink);
	box-shadow: none;
	color: #fff;
	font-family: var(--ls-font-text);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.25s var(--ls-ease), border-color 0.25s var(--ls-ease), color 0.25s var(--ls-ease);
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:hover {
	border-color: var(--ls-color-graphite);
	background-color: var(--ls-color-graphite);
	color: #fff;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
	border-color: var(--ls-color-ink);
	background-color: #fff;
	color: var(--ls-color-ink);
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences:hover,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences:hover {
	border-color: var(--ls-color-ink);
	background-color: var(--ls-color-ink);
	color: #fff;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 3px;
}

/* Choix par catégorie affichés : « Enregistrer mes choix » passe sur sa propre ligne. */
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-categories-visible .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
	flex-basis: 100%;
}

/* Lien vers la politique de cookies, les documents non publiés sont masqués. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links.cmplz-documents,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links.cmplz-documents ul {
	justify-content: flex-start;
	gap: 0.5rem 1.25rem;
	margin: 0;
	padding: 0;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links li {
	margin: 0;
	padding: 0;
	line-height: 1.2;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links li:has(> .cmplz-hidden) {
	display: none;
}

/*
 * Zone de clic portée à 24 px de haut (critère WCAG 2.5.8) : la marge
 * négative compense le retrait intérieur, le texte ne bouge pas.
 */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links .cmplz-link {
	display: inline-block;
	margin-block: -0.3125rem;
	padding-block: 0.3125rem;
	color: var(--ls-color-ink);
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.2;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links .cmplz-link:hover {
	color: var(--ls-color-graphite);
	text-decoration-thickness: 2px;
}

/* Catégories : dans le bandeau (« Personnaliser ») et dans la politique de cookies. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-categories.cmplz-fade-in:not(.cmplz-hidden),
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories:not(.cmplz-hidden) {
	display: grid;
	gap: 0.5rem;
	margin: 1rem 0 0;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category {
	margin: 0;
	background-color: var(--ls-color-taupe-light);
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto 1.5rem;
	align-items: center;
	gap: 1rem;
	padding: 0.875rem 1rem;
	background: none;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-title {
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.3;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active {
	color: var(--ls-color-graphite);
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.2;
	white-space: nowrap;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-toggle {
	display: flex;
	grid-column: 3;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	height: 1.5rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--ls-color-ink);
	cursor: pointer;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-toggle:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 2px;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon.cmplz-open {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	height: 1.5rem;
	transition: transform 0.3s var(--ls-ease);
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon svg {
	display: block;
	width: 0.8125rem;
	height: 0.8125rem;
	fill: currentColor;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-description {
	margin: 0;
	padding: 0 1rem 1rem;
	color: var(--ls-color-ink);
	font-size: 0.8125rem;
	font-weight: 300;
	line-height: 1.5;
}

/* Interrupteur carré : fond blanc et carré noir, plein noir et carré blanc une fois activé. */
:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
}

/* Catégorie toujours active : le texte suffit, l'interrupteur reste masqué comme chez Complianz. */
:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-always-active .cmplz-banner-checkbox {
	display: none;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label {
	position: relative;
	display: block;
	width: 2.25rem;
	height: 1.25rem;
	margin: 0;
	padding: 0;
	cursor: pointer;
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::before,
:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 1px solid var(--ls-color-ink);
	border-radius: 0;
	background-color: #fff;
	box-shadow: none;
	transition: background-color 0.2s var(--ls-ease);
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::after,
:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label::after {
	content: "";
	position: absolute;
	top: 0.25rem;
	left: 0.25rem;
	display: block;
	width: 0.75rem;
	height: 0.75rem;
	border-radius: 0;
	background: var(--ls-color-ink);
	transition: transform 0.2s var(--ls-ease), background-color 0.2s var(--ls-ease);
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label::before {
	background-color: var(--ls-color-ink);
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label::after {
	background: #fff;
	transform: translateX(1rem);
}

:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus-visible + .cmplz-label::before {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-categories.cmplz-fade-in {
		animation: none;
	}

	:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon.cmplz-open,
	:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::before,
	:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::after {
		transition: none;
	}
}

/* Tablette étroite et mobile (seuil de Complianz) : bandeau pleine largeur en bas de l'écran. */
@media only screen and (max-width: 768px) {
	#cmplz-cookiebanner-container .cmplz-cookiebanner {
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		max-width: none;
		max-height: 100vh;
		max-height: 100dvh;
		padding: 1.375rem var(--ls-gutter) 1.25rem;
		gap: 1rem;
		box-shadow: 0 -0.5rem 2rem rgba(30, 30, 30, 0.14);
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show,
	#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show:hover {
		box-shadow: 0 -0.5rem 2rem rgba(30, 30, 30, 0.14);
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-title {
		font-size: 1.375rem;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message {
		margin: 0;
	}

	/* Accepter et refuser côte à côte, personnaliser dessous. */
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
		width: 100%;
		height: 3rem;
		padding: 0 0.5rem;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences,
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
		grid-column: 1 / -1;
	}

	:is(#cmplz-cookiebanner-container .cmplz-cookiebanner, #cmplz-manage-consent-container) .cmplz-categories .cmplz-category .cmplz-category-header {
		grid-template-columns: minmax(0, 1fr) auto 1.5rem !important;
		gap: 0.75rem;
	}
}

/* Écran très bas (téléphone à l'horizontale) : Complianz réduit tout par zoom, le bandeau garde ici ses proportions. */
@media (max-height: 400px) {
	/* Comme plus haut : la grille ne vaut que pour l'état affiché, sinon elle
	   l'emporterait sur le masquage de Complianz. */
	#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show:not(.cmplz-dismissed):not(.cmplz-hidden) {
		display: grid;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner {
		height: auto;
		max-height: 100vh;
		max-height: 100dvh;
		padding: 0.875rem var(--ls-gutter) 0.75rem !important;
		gap: 0.625rem;
		overflow-y: auto;
		zoom: 1;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header {
		max-height: none !important;
		margin-bottom: 0 !important;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-title {
		font-size: 1.125rem;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close,
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-documents,
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-information {
		zoom: 1 !important;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body {
		max-height: 35vh;
		margin-top: 0 !important;
		overflow-y: auto;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message {
		font-size: 0.8125rem;
		line-height: 1.45;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons {
		display: flex;
		flex-direction: row;
		gap: 0.5rem !important;
	}

	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
		height: 2.75rem !important;
		min-height: 0 !important;
		padding: 0 0.5rem !important;
		font-size: 0.75rem !important;
		line-height: 1 !important;
		white-space: nowrap !important;
		zoom: 1 !important;
	}
}

/* ==========================================================================
   21. Politique de cookies (Complianz)
   Document généré dans #cmplz-document. La feuille de Complianz
   (document.min.css) fixe des tailles en pixels : le texte reprend ici
   l'échelle du site. Les tableaux des cookies sont ajoutés par functions.php.
   ========================================================================== */

body[class] #cmplz-document {
	max-width: 50rem;
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.625;
}

body[class] #cmplz-document p,
body[class] #cmplz-document li {
	margin: 0 0 1rem;
	color: inherit;
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.625;
}

/* Date de mise à jour. */
body[class] #cmplz-document > p:first-child {
	margin-bottom: 0;
	color: var(--ls-color-graphite);
	font-size: 0.9375rem;
}

body[class] #cmplz-document > p:first-child br {
	display: none;
}

body[class] #cmplz-document h2 {
	margin: 3.5rem 0 1.25rem;
	padding: 0;
	border: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(1.625rem, 1.3929rem + 0.9524vw, 2.25rem);
	font-synthesis: none;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: 0;
	text-transform: none;
}

body[class] #cmplz-document h3 {
	margin: 2.25rem 0 0.75rem;
	padding: 0;
	border: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: 0;
	text-transform: none;
}

body[class] #cmplz-document h2 + h3 {
	margin-top: 0;
}

body[class] #cmplz-document ul {
	margin: 0 0 1.5rem;
	padding: 0 0 0 1.25rem;
	list-style: disc;
}

body[class] #cmplz-document ul li {
	margin: 0 0 0.5rem;
	padding-left: 0.25rem;
}

body[class] #cmplz-document ul li::marker {
	color: var(--ls-color-taupe);
}

body[class] #cmplz-document a {
	color: var(--ls-color-ink);
	overflow-wrap: anywhere;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color 0.25s var(--ls-ease);
}

body[class] #cmplz-document a:hover {
	color: var(--ls-color-graphite);
	text-decoration-thickness: 2px;
}

/* Complianz encadre les liens au focus en décalant le texte : repère de focus du site à la place. */
body[class] #cmplz-document a:focus {
	padding: 0;
	border: 0;
}

body[class] #cmplz-document a:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

body[class] #cmplz-document #cmplz-manage-consent-container {
	margin: 0 0 1rem;
}

/* Réglages atteints par le bouton « Gestion des cookies » du pied de page. */
body[class] #cmplz-document #cmplz-manage-consent-container:focus {
	outline: none;
}

body[class] #cmplz-document #cmplz-manage-consent-container:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 0.5rem;
}

/* Tableaux des cookies. */
body[class] #cmplz-document .ls-cookie-table {
	margin: 1.75rem 0 2.25rem;
}

body[class] #cmplz-document .ls-cookie-table table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	border-spacing: 0;
	table-layout: fixed;
}

/* Mêmes colonnes pour tous les tableaux. */
body[class] #cmplz-document .ls-cookie-table thead th:nth-child(1) {
	width: 25%;
}

body[class] #cmplz-document .ls-cookie-table thead th:nth-child(2) {
	width: 24%;
}

body[class] #cmplz-document .ls-cookie-table thead th:nth-child(4) {
	width: 10%;
}

body[class] #cmplz-document .ls-cookie-table caption {
	margin: 0;
	padding: 0 0 0.875rem;
	color: var(--ls-color-ink);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.35;
	text-align: left;
	caption-side: top;
}

/* Le thème encadre les lignes et sépare les cellules : filets horizontaux seulement. */
body[class] #cmplz-document .ls-cookie-table tr {
	border: 0;
}

body[class] #cmplz-document .ls-cookie-table th,
body[class] #cmplz-document .ls-cookie-table td {
	padding: 0.875rem 1.25rem 0.875rem 0;
	border: 0;
	border-bottom: 1px solid var(--ls-color-line);
	background: none;
	color: var(--ls-color-ink);
	font-size: 0.875rem;
	font-weight: 300;
	line-height: 1.5;
	text-align: left;
	vertical-align: top;
}

body[class] #cmplz-document .ls-cookie-table th:last-child,
body[class] #cmplz-document .ls-cookie-table td:last-child {
	padding-right: 0;
}

body[class] #cmplz-document .ls-cookie-table thead th {
	padding-top: 0;
	padding-bottom: 0.625rem;
	border-bottom-color: var(--ls-color-ink);
	font-size: 0.75rem;
	font-weight: 500;
	text-transform: uppercase;
	white-space: nowrap;
}

/*
 * Nom du cookie : sur une ligne tant que la colonne le permet. Entre 681 et
 * 900 px environ, la colonne est plus étroite que « cmplz_consented_services » :
 * le nom passe alors à la ligne après un trait de soulignement (points de
 * coupure posés dans functions.php), au lieu de déborder sur la colonne
 * Service. Dernier recours, une coupure n'importe où plutôt qu'un débordement.
 */
body[class] #cmplz-document .ls-cookie-table tbody th {
	font-weight: 500;
	white-space: normal;
	overflow-wrap: anywhere;
}

body[class] #cmplz-document .ls-cookie-table tbody td:last-child {
	white-space: nowrap;
}

/* Mobile : une fiche par cookie, intitulé de chaque donnée à gauche. */
@media only screen and (max-width: 680px) {
	body[class] #cmplz-document .ls-cookie-table table,
	body[class] #cmplz-document .ls-cookie-table caption,
	body[class] #cmplz-document .ls-cookie-table tbody,
	body[class] #cmplz-document .ls-cookie-table tr,
	body[class] #cmplz-document .ls-cookie-table th,
	body[class] #cmplz-document .ls-cookie-table td {
		display: block;
	}

	body[class] #cmplz-document .ls-cookie-table caption {
		padding-bottom: 0.625rem;
		border-bottom: 1px solid var(--ls-color-ink);
	}

	body[class] #cmplz-document .ls-cookie-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
		border: 0;
	}

	body[class] #cmplz-document .ls-cookie-table tbody tr {
		padding: 0.875rem 0;
		border: 0;
		border-bottom: 1px solid var(--ls-color-line);
	}

	body[class] #cmplz-document .ls-cookie-table tbody th,
	body[class] #cmplz-document .ls-cookie-table tbody td {
		padding: 0;
		border: 0;
	}

	body[class] #cmplz-document .ls-cookie-table tbody th {
		margin-bottom: 0.5rem;
		font-size: 0.9375rem;
	}

	body[class] #cmplz-document .ls-cookie-table tbody td {
		display: grid;
		grid-template-columns: 5rem minmax(0, 1fr);
		column-gap: 0.75rem;
		white-space: normal;
	}

	body[class] #cmplz-document .ls-cookie-table tbody td:last-child {
		white-space: normal;
	}

	body[class] #cmplz-document .ls-cookie-table tbody td + td {
		margin-top: 0.25rem;
	}

	body[class] #cmplz-document .ls-cookie-table tbody td::before {
		content: attr(data-label);
		content: attr(data-label) / "";
		color: var(--ls-color-graphite);
		font-weight: 400;
	}
}

/* ==========================================================================
   22. Visibilité par appareil d'Elementor
   Elementor masque un élément avec « .elementor .elementor-hidden-mobile » et
   ses variantes, soit deux classes. Plusieurs règles de mise en page du thème
   enfant visent les mêmes conteneurs avec trois classes ou plus : elles
   l'emportaient sur ce masquage, et un bloc caché sur un appareil depuis
   l'éditeur restait affiché. Les règles ci-dessous rendent la main à
   Elementor, sur les trois points de rupture actifs du site (mobile jusqu'à
   767 px, tablette de 768 à 1024 px, bureau à partir de 1025 px). Un point de
   rupture supplémentaire activé dans Elementor demanderait une ligne de plus.

   L'éditeur est laissé de côté : Elementor y montre les blocs cachés pour
   qu'ils restent sélectionnables.
   ========================================================================== */

body:not(.elementor-editor-active)[class][class] .elementor .elementor-hidden {
	display: none;
}

@media only screen and (max-width: 767px) {
	body:not(.elementor-editor-active)[class][class] .elementor .elementor-hidden-mobile,
	body:not(.elementor-editor-active)[class][class] .elementor .elementor-hidden-phone {
		display: none;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
	body:not(.elementor-editor-active)[class][class] .elementor .elementor-hidden-tablet {
		display: none;
	}
}

@media only screen and (min-width: 1025px) {
	body:not(.elementor-editor-active)[class][class] .elementor .elementor-hidden-desktop {
		display: none;
	}
}

/* ==========================================================================
   23. Page « introuvable »
   Le thème centre un titre, une phrase et un bouton sur toute la largeur.
   La page reprend ici la grille de l'accueil : titre d'affichage, phrase et
   bouton dans la colonne de gauche, pages du site à droite, présentées comme
   la liste des expertises (filet fin, capitales, survol à l'encre).
   ========================================================================== */

body.error404 #qodef-404-page {
	display: grid;
	grid-template-columns: minmax(0, 38.625rem) minmax(0, 1fr);
	column-gap: 3.75rem;
	align-items: start;
	box-sizing: border-box;
	width: min(100% - 2 * var(--ls-gutter), var(--ls-wrap));
	margin: 0 auto;
	padding: 7.5rem 0 8.75rem;
	text-align: left;
}

body.error404 #qodef-404-page .qodef-404-title {
	grid-column: 1;
	margin: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(2.75rem, 1.5395rem + 4.9658vw, 6rem);
	font-weight: 400;
	font-synthesis: none;
	line-height: 1;
	letter-spacing: -0.03em;
}

body.error404 #qodef-404-page .qodef-404-text {
	grid-column: 1;
	max-width: 30.1875rem;
	margin: 1.875rem 0 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1.125rem;
	font-weight: 400;
	line-height: 1.5;
}

body.error404 #qodef-404-page .qodef-404-button {
	grid-column: 1;
	margin-top: 2.5rem;
}

/* Colonne de droite : alignée sur la première ligne du titre. */
body.error404 #qodef-404-page .ls-404__nav {
	grid-column: 2;
	grid-row: 1 / span 3;
	margin-top: 0.9375rem;
}

/* Même étiquette que « AVOCAT » au-dessus des noms de l'accueil. */
body.error404 #qodef-404-page .ls-404__label {
	margin: 0 0 1.375rem;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: 0.625rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
}

body.error404 #qodef-404-page .ls-404__menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.error404 #qodef-404-page .ls-404__menu > li {
	margin: 0;
	padding: 0;
	border-bottom: 1.5px solid var(--ls-color-line);
	transition: border-color 0.3s var(--ls-ease);
}

body.error404 #qodef-404-page .ls-404__menu > li > a {
	display: block;
	padding: 1.0625rem 0 1.0625rem;
	color: var(--ls-color-black);
	font-family: var(--ls-font-text);
	font-size: clamp(1.125rem, 0.9375rem + 0.7813vw, 1.625rem);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.04em;
	text-decoration: none;
	text-transform: uppercase;
}

/*
 * Survol : seul le filet change, comme sur la liste des expertises. Le taupe
 * sur blanc n'atteint que 2,75 pour 1, en dessous du minimum d'un grand texte.
 */
@media (hover: hover) {
	body.error404 #qodef-404-page .ls-404__menu > li:hover {
		border-bottom-color: var(--ls-color-ink);
	}
}

body.error404 #qodef-404-page .ls-404__menu > li > a:focus-visible {
	outline: 2px solid var(--ls-color-ink);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	body.error404 #qodef-404-page .ls-404__menu > li {
		transition: none;
	}
}

/* Une seule colonne dès que la grille de l'accueil passe elle aussi en pile. */
@media only screen and (max-width: 1024px) {
	body.error404 #qodef-404-page {
		grid-template-columns: minmax(0, 1fr);
		padding: 4.375rem 0 5.625rem;
	}

	body.error404 #qodef-404-page .ls-404__nav {
		grid-column: 1;
		grid-row: auto;
		margin-top: 3.75rem;
	}
}

@media only screen and (max-width: 767px) {
	body.error404 #qodef-404-page {
		padding: 3.125rem 0 4.375rem;
	}

	body.error404 #qodef-404-page .qodef-404-text {
		margin-top: 1.25rem;
	}

	body.error404 #qodef-404-page .qodef-404-button {
		margin-top: 1.875rem;
	}

	body.error404 #qodef-404-page .ls-404__nav {
		margin-top: 2.8125rem;
	}
}

/* ==========================================================================
   24. Pages légales saisies dans WordPress
   Le texte des mentions légales est saisi directement dans la page, sans
   mise en page Elementor. Sans réglage, il occupe toute la grille : la
   ligne fait 1236 px à 1440 px, contre 800 px pour la politique de cookies
   juste à côté, et le texte est plus gros. Ces règles reprennent la colonne
   de lecture et l'échelle de la section 21 pour que les deux pages légales
   se ressemblent. Le sélecteur enfant direct laisse intact le document
   généré par Complianz, qui garde ses propres règles.
   ========================================================================== */

body[class].ls-legal #qodef-page-content .qodef-page-content-section {
	max-width: 50rem;
}

body[class].ls-legal #qodef-page-content .qodef-page-content-section > p,
body[class].ls-legal #qodef-page-content .qodef-page-content-section > ul > li {
	margin: 0 0 1rem;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-text);
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.625;
}

body[class].ls-legal #qodef-page-content .qodef-page-content-section > h2 {
	margin: 3.5rem 0 1.25rem;
	padding: 0;
	border: 0;
	color: var(--ls-color-ink);
	font-family: var(--ls-font-display);
	font-size: clamp(1.625rem, 1.3929rem + 0.9524vw, 2.25rem);
	font-synthesis: none;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: 0;
	text-transform: none;
}

body[class].ls-legal #qodef-page-content .qodef-page-content-section > h2:first-child {
	margin-top: 0;
}

body[class].ls-legal #qodef-page-content .qodef-page-content-section > ul {
	margin: 0 0 1.5rem;
	padding: 0 0 0 1.25rem;
	list-style: disc;
}

body[class].ls-legal #qodef-page-content .qodef-page-content-section > ul > li {
	margin: 0 0 0.5rem;
	padding-left: 0.25rem;
}

body[class].ls-legal #qodef-page-content .qodef-page-content-section > ul > li::marker {
	color: var(--ls-color-taupe);
}