/*
 * Eorians : feuille de style du thème.
 * Port de design/Eorians-black.html (maquette de référence).
 * Les sélecteurs et noms de classes de la maquette sont conservés à l'identique ;
 * les valeurs (couleurs, polices, gouttière, rayon) viennent de theme.json.
 */

/* ==========================================================================
   1. Variables (alias des presets theme.json)
   ========================================================================== */

:root{
  --nav-sub-delay:.35s; /* délai d'ouverture du sous-menu = durée du soulignement des liens de la nav */
  --black:var(--wp--preset--color--contrast);
  --white:var(--wp--preset--color--base);
  --lift:var(--wp--preset--color--surface);
  --lift-light:var(--wp--preset--color--surface-light);
  --on-black-2:var(--wp--preset--color--muted-on-dark);
  --on-white-2:var(--wp--preset--color--muted-on-light);
  --r:var(--wp--custom--radius);
  --rh:clamp(380px,40vw,520px);
  --half:calc(var(--rh) / 2);
  --f-ui:var(--wp--preset--font-family--body);
  --f-read:var(--wp--preset--font-family--read);
  --gutter:var(--wp--custom--gutter);
  --hd-h:var(--wp--custom--header-height);
  /* Exception : bruit SVG en data-URI (couleur du grain intégrée). */
  --grain:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.96 0 0 0 0 0.96 0 0 0 0 0.95 0 0 0 .13 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  /* Flèche des boutons, utilisée en masque (la couleur vient de currentColor). */
  --arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M1 6h13M9 1l5 5-5 5' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E");
}

/* Polarités. Le body hérite des jetons sombres (fond noir par défaut). */
:where(body),.dk{--bg:var(--black);--fg:var(--white);--mut:var(--on-black-2);--rule:rgba(245,245,243,.2);--rule-2:rgba(245,245,243,.34);--hover:var(--lift)}
.lt{--bg:var(--white);--fg:var(--black);--mut:var(--on-white-2);--rule:rgba(10,10,10,.18);--rule-2:rgba(10,10,10,.34);--hover:var(--lift-light)}

/* ==========================================================================
   2. Base
   ========================================================================== */

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--black);color:var(--white);
  font-family:var(--f-ui);line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:4px}
h1,h2,h3{text-wrap:balance}
.wrap{width:100%;max-width:calc(var(--wp--style--global--wide-size) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.cap{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
section,.sec{scroll-margin-top:70px}

/* ==========================================================================
   3. Neutralisation des marges et espacements par défaut des blocs
   (le blockGap global reste actif pour le contenu des articles et des pages)
   ========================================================================== */

.wp-site-blocks>*{margin-block:0}
.hd :where(*),.ft :where(*){margin-block:0}
/* Spécificité 0,1,0 (:where + .is-layout-flow) : bat la marge de flux de WordPress (0,1,0, imprimée avant)
   et reste battue par les marges des composants déclarées plus bas (.diff-head, .cta-line, .hero h1…). */
:where(.wrap,.split,.split>*,.side,.rows,.row,.diff-head,.svc-head,.team-head,.partners,.cells,.cell,.philo,.philo>div,.post-body,.meta,.coords,.coords>div,.coords-cta,.cta-line,.ft-grid,.ft-brand,.cover).is-layout-flow>*{margin-block:0}
/* Sections de la page d'accueil : pas d'espace entre elles (blockGap du contenu de page). */
:is(.sec,.hero).alignfull{margin-block:0}

/* ==========================================================================
   4. Sections
   ========================================================================== */

.sec{position:relative;background:var(--bg);color:var(--fg);padding-block:var(--wp--custom--section--padding)}
.sec.dk{background:var(--grain),var(--bg)}
.sec::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--fg) 50%,transparent);opacity:.55;transform-origin:center;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
html.js .sec:not(.in)::before{transform:scaleX(0)}
/* Pages internes : dégage le header fixe. */
.sec.page-top{padding-top:calc(var(--hd-h) + clamp(48px,6vw,96px))}
.sec.page-top::before{content:none}
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,6vw,110px)}
.split.wide{grid-template-columns:minmax(0,3.4fr) minmax(0,8.6fr)}
.side{align-self:start;position:sticky;top:120px;display:grid;gap:22px}
.side p{color:var(--mut);max-width:30ch;font-size:1rem}
.rule{height:1px;background:var(--rule-2);transform-origin:left;transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
html.js .rule:not(.in){transform:scaleX(0)}
/* core/separator utilisé comme .rule : neutralise la bordure et la largeur par défaut. */
.wp-block-separator.rule{border:0;margin:0;width:auto;max-width:none;opacity:1}
/* Variante .rule-cta : filet au-dessus d'un CTA de section d'accueil, tracé 20 % plus lent (1.3s × 1.2). */
.wp-block-separator.rule.rule-cta{margin-top:clamp(36px,5vw,64px);transition-duration:1.56s}
html.js .lift{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
html.js .lift:not(.in){transform:translateY(16px)}

/* ==========================================================================
   5. Header (barre noire translucide)
   Le template part <header> porte la classe .hd. Il n'est fixe que sur le
   front (.wp-site-blocks) : dans l'éditeur il reste dans le flux.
   Fond et flou sont portés par .hd::before, le filet par .hd::after : un
   backdrop-filter sur .hd lui-même en ferait le bloc conteneur de l'overlay
   fixe du menu mobile. Ne rien mettre de tel sur .hd.
   Les rgba précèdent color-mix() comme repli (mêmes valeurs que les presets).
   Par défaut (toutes les pages, sans JS) : barre translucide. Sur l'accueil,
   html.hd-top (inline wp_head + header.js) rend le header transparent en haut de page.
   ========================================================================== */

.hd{position:relative;z-index:60;color:var(--white)}
.hd::before,.hd::after{content:"";position:absolute;z-index:-1;pointer-events:none}
.hd::before{inset:0;
  background:rgba(10,10,10,.72);background:color-mix(in srgb,var(--black) 72%,transparent);
  -webkit-backdrop-filter:blur(14px) saturate(120%);backdrop-filter:blur(14px) saturate(120%);
  transition:background-color .6s cubic-bezier(.4,0,.2,1),-webkit-backdrop-filter .6s cubic-bezier(.4,0,.2,1),backdrop-filter .6s cubic-bezier(.4,0,.2,1)}
.hd::after{left:0;right:0;bottom:0;width:100%;height:1px;
  background:rgba(245,245,243,.14);background:color-mix(in srgb,var(--white) 14%,transparent);
  transform-origin:center;transition:transform .9s cubic-bezier(.65,0,.35,1)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .hd::before{background:rgba(10,10,10,.94);background:color-mix(in srgb,var(--black) 94%,transparent)}
}
/* État transparent : surcharges seules. */
html.hd-top body.home .hd::before{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
html.hd-top body.home .hd::after{transform:scaleX(0)}
.wp-site-blocks .hd{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0}
.admin-bar .wp-site-blocks .hd{top:32px}
@media (max-width:782px){.admin-bar .wp-site-blocks .hd{top:46px}}
.hd .wrap{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:28px;min-height:var(--hd-h)}
.logo{font-family:var(--f-ui);font-weight:300;font-stretch:125%;font-size:1.35rem;line-height:1.2;letter-spacing:.42em;text-transform:uppercase;text-decoration:none;white-space:nowrap;padding-left:.1em}
.logo a{text-decoration:none}
/* Logo image foncé sur fond noir : inversé en clair. */
.logo img{display:block;width:clamp(140px,12vw,180px);height:auto;filter:invert(1)}
/* Le logo reste visible au-dessus de l'overlay du menu mobile (z-index 100000 côté WordPress). */
.hd .logo{position:relative;z-index:100001}
.hd-end{display:flex;align-items:center;gap:22px}

/* Navigation : .nav pour du balisage brut ; core/navigation est stylé via .hd .wp-block-navigation
   (pas de classe .nav sur le bloc : .nav{display:none} masquerait aussi le bouton du menu mobile). */
.nav{display:flex;gap:clamp(18px,2.6vw,40px);list-style:none;margin:0;padding:0}
.hd .wp-block-navigation{font-size:.8rem;letter-spacing:.06em}
.hd .wp-block-navigation .wp-block-navigation__container{gap:clamp(18px,2.6vw,40px)}
.nav a,.hd .wp-block-navigation-item__content{font-size:.8rem;letter-spacing:.06em;text-decoration:none;padding:8px 0;position:relative}
.nav a::after,.hd .wp-block-navigation-item__content::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.nav a:hover::after,.hd .wp-block-navigation-item__content:hover::after{transform:scaleX(1)}

/* Bouton d'ouverture du menu mobile natif (équivalent de .menu-btn) */
.menu-btn,.hd .wp-block-navigation__responsive-container-open,.hd .wp-block-navigation__responsive-container-close{background:none;border:0;color:inherit;font:500 .74rem/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;padding:12px 0;cursor:pointer}
.menu-btn{display:none}

/* Overlay du menu mobile natif, stylé comme le .drawer de la maquette.
   Sélecteurs renforcés : le style par défaut du bloc (fond blanc, liens centrés) est en 0,4,0. */
.drawer{position:fixed;inset:0;z-index:55;background:var(--black);color:var(--white);padding:110px var(--gutter) 40px;display:grid;align-content:start;overflow:auto}
.drawer[hidden]{display:none}
.hd .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{position:fixed;inset:0;background:var(--black);color:var(--white);padding:110px var(--gutter) 40px;display:block;overflow:auto}
/* Connecté : l'overlay commence sous la barre d'admin (sinon elle masque « Fermer »), comme le header. */
.admin-bar .hd .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{top:32px}
@media (max-width:782px){.admin-bar .hd .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{top:46px}}
.hd .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-close,.hd .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-dialog{position:static;max-width:none;width:100%;margin:0}
.hd .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-close{position:absolute;top:0;right:var(--gutter);min-height:var(--hd-h);display:flex;align-items:center}
.hd .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{padding:0;display:block}
.hd .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{display:flex;flex-direction:column;align-items:stretch;gap:0;width:100%}
.hd .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item{width:100%;display:block}
.drawer a,.hd .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{display:block;font-size:clamp(2.1rem,9vw,3rem);font-weight:300;line-height:1.2;letter-spacing:-.03em;text-decoration:none;padding:14px 0;border-bottom:1px solid rgba(245,245,243,.2)}
.hd .wp-block-navigation .is-menu-open .wp-block-navigation-item__content::after{content:none}

/* Sous-menu « Notre cabinet » (desktop) : panneau noir opaque, filet fin, rayon de la charte, sans ombre.
   Ouverture au survol (core) et au clavier (focus visible dans le sous-menu) ; le panneau est dans le
   contexte d'empilement du header (z-index 60), donc au-dessus de toutes les sections. */
.hd .wp-block-navigation .has-child .wp-block-navigation__submenu-container{background:var(--black);color:var(--white);border:1px solid var(--rule-2);border-radius:var(--r);padding:6px 0;min-width:220px;left:-16px;top:100%}
.hd .wp-block-navigation .has-child:has(:focus-visible)>.wp-block-navigation__submenu-container{height:auto;min-width:220px;opacity:1;overflow:visible;visibility:visible;width:auto}
/* Délai d'ouverture au survol seulement (le soulignement du lien finit d'abord) ; la fermeture et le clavier restent immédiats. */
@media (hover:hover) and (min-width:782px){.hd .wp-block-navigation .has-child:not(.open-on-click):hover>.wp-block-navigation__submenu-container{transition:opacity .1s linear var(--nav-sub-delay),visibility 0s linear var(--nav-sub-delay)}}
.hd .wp-block-navigation .has-child:not(.open-on-click):is(:focus-within,:has(:focus-visible))>.wp-block-navigation__submenu-container{transition-delay:0s}
.hd .wp-block-navigation .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content{padding:10px 18px;white-space:nowrap}
.hd .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after{content:none}
.hd .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,.hd .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible{background:var(--lift)}
/* Overlay mobile : les entrées du sous-menu sont dépliées à la suite, sans flèche ni panneau. */
.hd .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container{position:static;height:auto;width:auto;min-width:0;overflow:visible;visibility:visible;opacity:1;background:none;border:0;border-radius:0;padding:0}
/* L'entrée parente « Notre cabinet » fait doublon avec ses sous-liens, affichés à la suite : masquée dans l'overlay (le libellé n'est pas un lien). */
.hd .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .has-child>.wp-block-navigation-item__content{display:none}
.hd .wp-block-navigation .is-menu-open .wp-block-navigation__submenu-icon{display:none}
.hd .wp-block-navigation .is-menu-open .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content{padding:14px 0;white-space:normal}
.hd .wp-block-navigation .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,.hd .wp-block-navigation .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible{background:none}

/* ==========================================================================
   6. Boutons
   .btn* pour les liens bruts ; sur core/button les classes se posent sur le
   bloc (div.wp-block-button) et stylent le lien .wp-block-button__link.
   ========================================================================== */

.btn,.wp-block-button .wp-block-button__link,.wp-block-file .wp-block-file__button{display:inline-flex;align-items:center;justify-content:center;gap:12px;font-family:var(--f-ui);font-weight:500;font-size:.76rem;line-height:1;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:18px 30px;border:1px solid transparent;border-radius:var(--r);transition:background .3s,color .3s,border-color .3s;cursor:pointer;white-space:nowrap}
.btn svg,.has-arrow .wp-block-button__link::after,a.has-arrow::after,.more a::after{transition:transform .3s}
.btn:hover svg,.has-arrow .wp-block-button__link:hover::after,a.has-arrow:hover::after,.more a:hover::after{transform:translateX(4px)}
/* Flèche : remplace le <svg><use href="#arrow"> de la maquette */
.has-arrow .wp-block-button__link::after,a.has-arrow::after,.more a::after{content:"";flex:none;width:16px;height:12px;background:currentColor;-webkit-mask:var(--arrow) center/contain no-repeat;mask:var(--arrow) center/contain no-repeat}
/* Plein (style par défaut de core/button) */
.btn.btn-solid,.wp-block-button .wp-block-button__link{background:var(--fg);color:var(--bg)}
.btn.btn-solid:hover,.wp-block-button .wp-block-button__link:hover{background:transparent;color:var(--fg);border-color:var(--fg)}
/* Bloc Fichier : libellé + bouton côte à côte */
.wp-block-file{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.wp-block-file:not(.wp-element-button){font-size:inherit}
.wp-block-file *+.wp-block-file__button{margin-left:0}
/* Filaire (.btn-line ou style "Contour" natif) */
.btn.btn-line,.btn-line .wp-block-button__link,.wp-block-button.is-style-outline .wp-block-button__link,.wp-block-file .wp-block-file__button{background:transparent;border-color:var(--rule-2);color:var(--fg)}
.btn.btn-line:hover,.btn-line .wp-block-button__link:hover,.wp-block-button.is-style-outline .wp-block-button__link:hover,.wp-block-file .wp-block-file__button:hover{border-color:var(--fg);background:var(--fg);color:var(--bg)}
.btn.btn-sm,.btn-sm .wp-block-button__link{padding:12px 20px;font-size:.7rem}
.hd .btn.btn-sm,.hd .btn-sm .wp-block-button__link{border-color:currentColor;color:inherit;background:transparent}
.hd .btn.btn-sm:hover,.hd .btn-sm .wp-block-button__link:hover{background:var(--white);border-color:var(--white);color:var(--black)}

/* ==========================================================================
   7. Hero et ruban
   ========================================================================== */

.hero{position:relative;padding:clamp(120px,12vw,160px) 0 calc(var(--half) + 24px);background:var(--grain),var(--black);color:var(--white)}
.hero h1{max-width:16ch;margin-bottom:clamp(20px,2.4vw,30px)}
.hero .sub{font-weight:300;font-size:clamp(1.25rem,2.3vw,1.8rem);line-height:1.3;letter-spacing:-.015em;color:var(--on-black-2);max-width:28ch;margin-bottom:clamp(28px,3.4vw,44px)}
.cta{display:flex;flex-wrap:wrap;gap:14px}

/* Le ruban (créé par ribbon.js) chevauche le bas de la section #accueil.
   Retourné horizontalement : la partie haute de la vague est à droite. */
.ribbon{position:absolute;left:0;right:0;bottom:calc(var(--half) * -1);height:var(--rh);z-index:5;pointer-events:none;mix-blend-mode:difference;isolation:isolate}
.ribbon canvas{position:absolute;inset:0;width:100%;height:100%;transform:scaleX(-1)}
#bloom{filter:blur(14px);opacity:.5}

/* Pages internes : bandeau noir sous le header fixe, plus compact que le hero de l'accueil. */
.hero.page-hero{padding:calc(var(--hd-h) + clamp(48px,7vw,104px)) 0 clamp(48px,6vw,88px)}
.page-hero>.wp-block-post-title{max-width:calc(var(--wp--style--global--wide-size) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter);margin-bottom:0;font-size:clamp(2.25rem,6vw,4.5rem)}
.page-hero>.wp-block-post-title{box-sizing:border-box}

/* Longs textes (mentions légales, etc.). */
.prose{max-width:68ch;line-height:1.7}
.prose>*+*{margin-top:1em}
.prose h2{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15}
.prose>h2:not(:first-child){margin-top:clamp(36px,4vw,56px)}
/* h3 sous un h2 (pages juridiques) : un cran sous les h2. */
.prose h2~h3{font-size:clamp(1.1rem,1.6vw,1.3rem);font-weight:500;line-height:1.3;letter-spacing:-.01em;margin-top:1.8em}

/* Article : bandeau compact (même langage que .page-hero), corps lisible, navigation précédent/suivant. */
.art-meta{gap:.4em 1.2em;margin-bottom:clamp(16px,2vw,24px);color:var(--mut)}
.art-meta a{text-decoration:none}
.art-meta :where(p,div){margin:0}
.hero .art-title{max-width:26ch;margin:0;font-size:clamp(2rem,4.2vw,3.6rem);line-height:1.08}
.art-title+*{margin-top:0}
.art-author{margin:clamp(16px,2vw,24px) 0 0;color:var(--mut)}
.art-author::before{content:"Par "}
.prose :is(ul,ol){padding-left:1.3em}
.prose li+li{margin-top:.4em}
.prose h3{font-size:clamp(1.1rem,1.6vw,1.3rem);font-weight:500;line-height:1.3;letter-spacing:-.01em;margin-top:1.8em}
.prose blockquote{margin-inline:0;padding-left:1.2em;border-left:1px solid var(--rule-2);font-family:var(--f-read);color:var(--mut)}
.prose figure{margin-inline:0}
.prose img{max-width:100%;height:auto;border-radius:var(--r)}
.prose table{width:100%;border-collapse:collapse;font-size:.95rem}
.prose :is(th,td){padding:.7em .8em;border-bottom:1px solid var(--rule);text-align:left}
.prose th{font-weight:500;border-bottom-color:var(--rule-2)}
.wp-block-separator.rule.art-rule{margin-top:clamp(40px,5vw,72px)}
.art-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,24px);margin-top:clamp(24px,3vw,40px)}
.art-nav>.wp-block-post-navigation-link{position:relative;display:grid;gap:8px;align-content:start;margin:0;padding:clamp(18px,2vw,28px);border:1px solid var(--rule);border-radius:var(--r);transition:background .3s,border-color .3s}
.art-nav>:empty{display:none}
.art-nav>.art-nav-prev{grid-column:1}
.art-nav>.art-nav-next{grid-column:2;text-align:right}
.art-nav>.wp-block-post-navigation-link:hover{background:var(--hover);border-color:var(--rule-2)}
.art-nav>.wp-block-post-navigation-link:focus-within{outline:2px solid currentColor;outline-offset:4px}
.art-nav .post-navigation-link__label{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--mut)}
.art-nav a{text-decoration:none;font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.3}
.art-nav a::after{content:"";position:absolute;inset:0}
.art-nav a:focus-visible{outline:0}
@media (max-width:620px){.art-nav{grid-template-columns:1fr}.art-nav>.art-nav-prev,.art-nav>.art-nav-next{grid-column:auto}}

/* ==========================================================================
   8. Différences (blanc)
   ========================================================================== */

.diff{padding-top:calc(var(--half) + clamp(36px,5vw,70px))}
.diff-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,4vw,72px);align-items:end;margin-bottom:clamp(40px,6vw,84px)}
.diff-head h2{max-width:14ch}
.diff-head .intro{color:var(--mut);max-width:44ch}
.rows{list-style:none;margin:0;padding:0}
.row{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(16px,4vw,72px);padding:clamp(26px,3vw,40px) 0;align-items:baseline}
.row>*{min-width:0}
.row::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-2);transform-origin:left;transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
html.js .row:not(.in)::before{transform:scaleX(0)}
.row h3{font-size:clamp(1.65rem,3vw,2.7rem);font-weight:300;letter-spacing:-.03em;line-height:1.08}
.row p{color:var(--mut);font-size:1rem;line-height:1.55;max-width:40ch}
/* Ligne à texte long (page Nous découvrir) : colonne de texte plus large, listes à puces. */
.row.long{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.row.long p,.row.long li{max-width:68ch}
.row.long>div>*+*{margin-top:1em}
.row.long ul{margin-bottom:0;padding-left:1.25em;color:var(--mut);font-size:1rem;line-height:1.55}
.row.long li+li{margin-top:.6em}
.wrap>.lift+.rows,.wrap>.lift+.prose{margin-top:clamp(32px,4vw,56px)}
/* Pas de bordure haute : le filet .rule qui précède sépare déjà les partenaires des lignes.
   Grille 1fr auto 1fr : les noms restent centrés sur le conteneur, le libellé occupe la colonne de gauche.
   Espaces haut/bas identiques entre les deux filets (le filet .rule-cta qui suit n'ajoute pas de marge). */
.partners{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;column-gap:clamp(20px,4vw,56px);padding-block:clamp(24px,3vw,34px)}
.partners .cap{color:var(--mut)}
.partners ul{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0;min-width:0}
.partners li{font-size:.86rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;white-space:nowrap;padding:6px clamp(12px,1.5vw,22px);border-left:1px solid var(--rule-2)}
.partners li:first-child{border-left:0}
.partners+.wp-block-separator.rule.rule-cta{margin-top:0}

/* ==========================================================================
   9. Services (noir)
   ========================================================================== */

.cells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:var(--r);overflow:hidden}
.cell{background:var(--bg);padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;gap:16px;min-width:0;min-height:300px;transition:background .3s}
.cell:hover{background:var(--hover)}
.cell h3{font-weight:300;font-size:clamp(1.7rem,2.5vw,2.3rem)}
.cell p{color:var(--mut);font-size:1rem;line-height:1.55}
.cell .for{margin-top:auto;padding-top:14px;color:var(--fg)}
/* Lien « En savoir plus » : toute la carte est cliquable (lien étiré), focus visible sur la carte. */
.cell{position:relative}
.cell .for a{color:inherit;text-decoration:none}
.cell .for a::after{content:"";position:absolute;inset:0;z-index:1}
.cell .for a:focus-visible{outline:none}
.cell .for a:focus-visible::after{outline:2px solid currentColor;outline-offset:-6px}
/* Légende en paragraphe : .cell p (0,1,1) ne doit pas l'agrandir. */
.cell p.cap{font-size:.72rem;line-height:1.6}
.svc-head{display:flex;justify-content:space-between;align-items:end;gap:28px;flex-wrap:wrap;margin-bottom:clamp(36px,5vw,64px)}
.svc-head h2{max-width:10ch}
.svc-head p{color:var(--mut);max-width:34ch}
.cta-line{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;margin-top:clamp(36px,5vw,64px)}
.cta-line p{font-weight:300;font-size:clamp(1.5rem,2.6vw,2.3rem);letter-spacing:-.025em;line-height:1.12;max-width:24ch}
/* Filet qui suit une ligne CTA (section Différences de l'accueil) : espace avant le filet. */
.cta-line+.rule{margin-top:clamp(36px,5vw,64px)}
.cells+.rule{margin-top:clamp(36px,5vw,64px)}

/* ==========================================================================
   10. À propos (blanc)
   ========================================================================== */

.philo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-self:start}
.philo>div{min-width:0;padding:0 clamp(18px,2.4vw,36px);border-left:1px solid var(--rule-2);display:grid;gap:14px;align-content:start}
.philo>div:first-child{padding-left:0;border-left:0}
/* Accueil (#a-propos) uniquement : .side et .philo partagent le même axe vertical. */
#a-propos .split>.side,#a-propos .split>.philo{align-self:center}
.philo h3{font-size:clamp(1.25rem,1.55vw,1.45rem);overflow-wrap:break-word;hyphens:auto}
.philo p{color:var(--mut);font-size:1rem;line-height:1.6}
.team-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-top:clamp(70px,9vw,120px);margin-bottom:clamp(24px,3vw,40px)}
.team-head .rule{flex:1;margin-bottom:.9em}
.team-head h2{font-size:clamp(1.9rem,3.2vw,2.8rem)}
/* Portrait : assets/images/portrait-placeholder.svg en attendant les photos. */
.ph{aspect-ratio:4/5;max-width:100%;border-radius:var(--r);overflow:hidden;background:var(--lift) url(../images/portrait-placeholder.svg) center/cover no-repeat;position:relative}
.ph svg,.ph img{display:block;width:100%;height:100%;object-fit:cover}

/* ==========================================================================
   11. Analyses (noir)
   .post = carte d'article ; dans une boucle de requête, chaque
   .posts > .wp-block-post reçoit les mêmes styles.
   ========================================================================== */

.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,44px);list-style:none;margin:0;padding:0}
.post,.posts>.wp-block-post{position:relative;display:grid;gap:20px;text-decoration:none;color:inherit;align-content:start}
/* Lien étendu : tout la carte est cliquable via le lien du titre. */
.post :is(.post-title,.wp-block-post-title) a{text-decoration:none}
.post :is(.post-title,.wp-block-post-title) a::after{content:"";position:absolute;inset:0;z-index:1}
/* Visuel : courbes de la maquette en fond, recouvertes par l'image mise en avant si elle existe. */
.cover{position:relative;aspect-ratio:3/2;max-width:100%;border-radius:var(--r);overflow:hidden;background:var(--black);border:1px solid var(--rule)}
.cover::before{content:"";position:absolute;inset:0;background:url(../images/cover-curves.svg) center/cover no-repeat;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.cover svg,.cover img,.cover .wp-block-post-featured-image{position:relative;display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.post:hover .cover :is(svg,img),.post:hover .cover::before{transform:scale(1.05)}
/* Cartes d'articles : N&B par défaut, couleur au survol/focus de la carte (le zoom ci-dessus est conservé). */
.posts .cover img{filter:grayscale(1);transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .4s ease}
.posts>.wp-block-post:is(:hover,:focus-within) .cover img{filter:grayscale(0)}
@media (hover:none){.posts .cover img{filter:none}}
.post .meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--mut)}
.post .meta>:first-child{color:var(--fg)}
/* La catégorie reste cliquable au-dessus du lien étendu du titre. */
.post .meta a{position:relative;z-index:2;text-decoration:none}
.post :is(h2,h3){margin:10px 0 12px;font-weight:300;line-height:1.12;letter-spacing:-.022em;font-size:clamp(1.5rem,2vw,1.85rem)}
.post:hover :is(h2,h3){text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.post p{font-family:var(--f-read);color:var(--mut);font-size:1.05rem;line-height:1.55}
.more{display:inline-flex;gap:12px;align-items:center;margin-top:clamp(36px,5vw,60px);text-decoration:none;border-bottom:1px solid var(--fg);padding-bottom:6px}
.more a{display:inline-flex;gap:12px;align-items:center;text-decoration:none}

/* ==========================================================================
   12. Contact (blanc)
   ========================================================================== */

.contact h2{max-width:12ch}
.coords{margin:0;display:grid}
.coords>div{display:grid;grid-template-columns:minmax(0,.3fr) minmax(0,1fr);gap:20px;padding:26px 0;border-top:1px solid var(--rule-2);align-items:baseline}
.coords>div:last-child{border-bottom:1px solid var(--rule-2)}
.coords :is(dt,.dt){color:var(--mut)}
.coords :is(dd,.dd){margin:0;overflow-wrap:anywhere}
.coords .big{font-weight:300;font-size:clamp(1.6rem,3.6vw,3.2rem);letter-spacing:-.035em;line-height:1.05}
.coords .big a{text-decoration:none;border-bottom:1px solid var(--rule-2)}
.coords .big a:hover{border-color:var(--fg)}
.coords-cta{margin-top:clamp(28px,3.6vw,44px)}

/* ==========================================================================
   13. Footer (noir) : le template part <footer> porte la classe .ft
   ========================================================================== */

.ft{position:relative;background:var(--grain),var(--black);color:var(--white);padding-block:clamp(56px,6vw,88px)}
.ft-grid{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(28px,4vw,64px)}
.ft p.cap{margin:0 0 18px;color:var(--on-black-2);font-family:var(--f-ui);font-weight:500;line-height:1.6}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:1rem}
.ft a{text-decoration:none}
.ft a:hover{text-decoration:underline;text-underline-offset:5px}
.ft-brand{text-align:center}
/* Logo foncé sur fond noir : inversé en clair. */
.ft-logo{margin:0 auto}
.ft-logo img{display:block;width:clamp(160px,15vw,280px);height:auto;margin-inline:auto;filter:invert(1)}
.ft-end{display:grid;gap:28px;justify-self:end;text-align:right}

/* ==========================================================================
   14. Responsive
   ========================================================================== */

/* Le bouton « Nous contacter » double le lien Contact en desktop ; le lien reste dans l'overlay mobile. */
@media (min-width:1021px){
  .hd .wp-block-navigation .nav-contact{display:none}
  /* Sous-menu fermé : invisible et non cliquable, mais pas en visibility:hidden. Au clavier, le focus quitte le bouton avant d'arriver au premier
     lien ; si le panneau était hidden à cet instant, ses liens ne seraient pas focalisables et le focus tomberait sur <body>. Le focus dans
     le sous-menu l'ouvre (:focus-within, règle ci-dessus). */
  .hd .wp-block-navigation .has-child:not(.open-on-click)>.wp-block-navigation__submenu-container{visibility:visible;pointer-events:none}
  .hd .wp-block-navigation .has-child:not(.open-on-click):is(:hover,:focus-within,:has(:focus-visible),:has([aria-expanded=true]))>.wp-block-navigation__submenu-container{pointer-events:auto}
}
@media (max-width:1020px){
  .nav{display:none}
  .menu-btn{display:block}
  /* Menu natif : bascule en bouton à 1020px (WordPress bascule à 600px par défaut). */
  .hd .wp-block-navigation{order:3}
  .hd .hd-end{margin-left:auto}
  .hd .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex}
  .hd .wp-block-navigation .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none}
  .cells{grid-template-columns:repeat(2,minmax(0,1fr))}
  .posts{grid-template-columns:1fr 1fr}
  .ft-grid{grid-template-columns:1fr;justify-items:center;text-align:center}
  .ft-brand{order:-1}
  .ft-end{justify-self:center;text-align:center}
}
@media (max-width:860px){
  .split,.split.wide,.diff-head{grid-template-columns:1fr}
  .side{position:static}
  .philo{grid-template-columns:1fr;gap:34px}
  .philo>div,.philo>div:first-child{padding:26px 0 0;border-left:0;border-top:1px solid var(--rule-2)}
  .row,.row.long{grid-template-columns:1fr;gap:10px}
  .posts{grid-template-columns:1fr}
}
@media (max-width:620px){
  .hd .wrap{min-height:70px}
  .hd .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-close{min-height:70px}
  .hd .btn-sm{display:none}
  .logo{font-size:1.1rem;letter-spacing:.34em}
  .cells{grid-template-columns:1fr}
  .cell{min-height:0}
  .coords>div{grid-template-columns:1fr;gap:6px}
  .btn,.wp-block-button .wp-block-button__link,.wp-block-file .wp-block-file__button{padding:16px 22px}
  .hd .btn-sm .wp-block-button__link{padding:12px 20px}
  .cta .btn,.cta .wp-block-button{flex:1 1 auto;justify-content:center}
  .cta .wp-block-button .wp-block-button__link{width:100%}
}
/* Partenaires : sous 1280px, les cinq noms ne tiennent plus sur une ligne.
   Libellé au-dessus, liste verticale séparée par des filets (comme les .row). */
@media (max-width:1279px){
  .partners{grid-template-columns:minmax(0,1fr);row-gap:18px;justify-items:center;text-align:center}
  .partners ul{flex-direction:column;flex-wrap:nowrap;align-items:center;width:100%}
  .partners li,.partners li:first-child{border-left:0;padding:12px 0;border-top:1px solid var(--rule);width:100%;text-align:center}
  .partners li:first-child{border-top:0;padding-top:0}
  .partners li:last-child{padding-bottom:0}
}
@media (prefers-reduced-motion:reduce){
  :root{--nav-sub-delay:0s}
  html{scroll-behavior:auto}
  *{transition:none !important}
  html.js .rule:not(.in),html.js .row:not(.in)::before,html.js .sec:not(.in)::before{transform:none}
  html.js .lift:not(.in){transform:none}
  .hd::before,.hd::after{transition:none}
}


/* Accueil, équipe : portrait solo (portrait à gauche, texte centré verticalement à droite). */
.split.solo{align-items:center}
.split.solo .nm{font-weight:400;font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.015em;line-height:1.15;display:block}
.split.solo .rl{display:block;color:var(--mut);margin-top:8px;font-size:.68rem;line-height:1.5}
.split.solo .bio{color:var(--mut);font-size:1rem;line-height:1.6;max-width:56ch;margin-top:18px}
@media (max-width:900px){.split.solo .ph{max-width:320px}}

/* Teasers de la home : lien-bouton sous un bloc. */
.teaser-link{margin-top:clamp(28px,3.6vw,44px)}

/* Bloc encadré (page Contact). */
.box{border:1px solid var(--rule-2);border-radius:var(--r);padding:clamp(28px,4vw,56px)}

/* Listes d'analyses : bandeau titre, filtres de catégories, pagination, recherche. */
.page-hero .wrap>:is(.wp-block-heading,.wp-block-query-title){max-width:20ch;margin:0;font-size:clamp(2.25rem,6vw,4.5rem)}
.page-hero .art-meta a:hover{text-decoration:underline;text-underline-offset:4px}
.sec>.wrap>:is(.filters,.art-search){margin-bottom:clamp(28px,3.5vw,48px)}
.sec>.wrap>.wp-block-buttons{margin-top:clamp(20px,2.4vw,32px)}
.filters{gap:8px 28px;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.filters :is(p,ul,li){margin:0;padding:0;list-style:none}
.filters .wp-block-categories{display:flex;flex-wrap:wrap;gap:8px 28px}
.filters a{color:var(--mut);text-decoration:none;transition:color .3s}
.filters a:hover,.filters .current-cat>a{color:var(--fg)}
.art-pager{margin-top:clamp(36px,5vw,60px);color:var(--mut);gap:12px 24px}
.art-pager a{text-decoration:none}
.art-pager a:hover,.art-pager .current{color:var(--fg)}
.art-pager .page-numbers{margin-inline:.6em}
.art-search{max-width:44ch}
.art-search .wp-block-search__inside-wrapper{border:1px solid var(--rule-2);border-radius:var(--r);gap:0}
.art-search .wp-block-search__input{flex:1;min-width:0;border:0;background:transparent;color:var(--fg);font:inherit;padding:.8em 1em}
.art-search .wp-block-search__button{margin:0;border:0;background:transparent;color:var(--fg);font:inherit;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;padding:0 1.2em;cursor:pointer}
.art-search .wp-block-search__button:hover{background:var(--hover)}

/* Formulaire de contact (Contact Form 7). */
.wpcf7-form{display:grid;gap:22px}
.wpcf7-form p{margin:0}
.wpcf7-form label{display:grid;gap:8px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--mut)}
.wpcf7-form :is(input[type=text],input[type=email],select,textarea){width:100%;border:1px solid var(--rule-2);border-radius:var(--r);background:transparent;color:var(--fg);font:inherit;font-size:1rem;letter-spacing:normal;text-transform:none;padding:.85em 1em}
.wpcf7-form textarea{min-height:10em;resize:vertical}
.wpcf7-form :is(input,select,textarea):focus-visible{outline:2px solid currentColor;outline-offset:2px;border-color:var(--fg)}
.wpcf7-form :is(.wpcf7-acceptance,.wpcf7-checkbox) label{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;letter-spacing:normal;text-transform:none;font-weight:400;color:var(--fg)}
.wpcf7-form :is(.wpcf7-acceptance,.wpcf7-checkbox) input{margin-top:.3em;flex:none}
.wpcf7-form .wpcf7-submit{justify-self:start;cursor:pointer}
.wpcf7-form .wpcf7-spinner{display:none}
.wpcf7-not-valid-tip{font-size:.9rem;letter-spacing:normal;text-transform:none;font-weight:400;color:var(--fg);margin-top:4px}
.wpcf7-response-output{margin:0!important;padding:.9em 1em!important;border:1px solid var(--rule-2)!important;border-radius:var(--r);font-size:.95rem}
.wpcf7-form .eo-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.wpcf7-form .wpcf7-list-item{margin:0}
.wpcf7-form .eo-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.wpcf7-form .eo-row-lang{grid-template-columns:minmax(0,3fr) minmax(0,1fr)}
@media (max-width:560px){.wpcf7-form .eo-row,.wpcf7-form .eo-row-lang{grid-template-columns:1fr}}

/* Accroche : petite phrase posée au-dessus d'un h2, à poser sur un paragraphe. */
.lead{font-family:var(--f-read);font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.5;color:var(--mut);max-width:48ch;margin:0 0 clamp(20px,2.5vw,32px)}

/* Page Nous découvrir : accroche de section, chiffres clés (variante compacte de .cells), focus fonds, mention en petit. */
.wrap>.lift+.lead{margin-top:clamp(20px,2.5vw,32px)}
.lead+.rows{margin-top:clamp(32px,4vw,56px)}
.cells.stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.cells.stats.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.cells.stats .cell{min-height:0;gap:8px}
.cells.stats .cell:hover{background:var(--bg)}
.cells.stats .cell>p:first-child{font-weight:300;font-size:clamp(1.4rem,2vw,1.9rem);line-height:1.1;letter-spacing:-.03em;color:var(--fg);overflow-wrap:anywhere}
.fine{font-size:.875rem;line-height:1.5;color:var(--mut)}
.focus .cap{color:var(--mut)}
.focus .wrap>*+*{margin-top:clamp(20px,2.5vw,32px)}
.focus .wrap>.cap+h2{margin-top:12px}
.focus .wrap>.cells,.focus .wrap>.cells+.prose{margin-top:clamp(32px,4vw,56px)}
@media (max-width:1020px){.cells.stats.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.cells.stats,.cells.stats.four{grid-template-columns:1fr}}