/*
Theme Name:  Nexxis Child — ESNOT
Theme URI:   https://www.combettes-notaires.fr
Description: Thème enfant de Nexxis. Contient la surcouche design ESNOT (classes esnot-*) qui reproduit les effets de maquette que le markup Gutenberg ne peut pas porter.
Author:      Nexxis
Template:    nexxis
Version:     1.28.0
*/

.feellike_h2 {
  -family: var(--font-eb-garamond);
  text-transform: uppercase;
  font-size: 1em;
  font-weight: 400;
}

/* Historique de versions :
   1.1 base · 1.2 fixes functions.php · 1.3 token fond clair · 1.4 cards ·
   1.5 zoneline pages géographiques · 1.6 réconciliation avec la version en ligne
   (typo html 18px, quote, nexxis-hero, fixes radius/faq/cf7, cards, token bg-light,
   override promo-box par variables, zoneline) · 1.7 animations/hovers (sections
   12-15) + js/esnot-reveal.js + functions v1.3. */

/* =============================================================================
   Nexxis — Surcouche design ESNOT  (nexxis-esnot-custom.css)  ·  v1.1
   -----------------------------------------------------------------------------
   Couche de PRÉSENTATION additive : tout ce que le markup Gutenberg ne peut pas
   porter (chevauchements, rythme des sections, encadrés spéciaux…).

   ⚙️  Où la charger — 3 options, du plus propre au plus rapide :
       1. Thème enfant : enqueue ce fichier après « nexxis-style ».
       2. Apparence → Personnaliser → CSS additionnel (copier-coller le contenu).
       3. Plugin type « Simple CSS ».
       ❌ Ne PAS éditer le style.css du thème parent (perdu à chaque mise à jour).

   🎯  Principe : chaque règle cible une CLASSE que l'on pose sur le bloc, via
       Éditeur → sélectionner le bloc → Réglages → Avancé → « Classe(s) CSS
       additionnelle(s) ». Le nom de la classe à saisir est indiqué au-dessus
       de chaque règle. Ces classes sont aussi injectées dans le markup généré.

   Les variables (--text-link, --alter-dark, …) sont déjà définies sur :root
   par le thème — on ne fait que les réutiliser.
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   1) BOX « EN BREF » qui chevauche le hero
   Classe à poser sur le bloc  core/group  → « esnot-intro »
   -----------------------------------------------------------------------------
   ⚠️ Le chevauchement remonte le bloc PAR-DESSUS le banner via une marge
      négative. Deux conditions pour que ça marche :
      • le banner (.nexxis-banner) doit être JUSTE au-dessus de ce bloc ;
      • le conteneur .main-wrapper a « overflow:hidden » dans le thème, qui peut
        ROGNER la partie qui déborde vers le haut. Si la box est coupée, retirer
        le rognage uniquement pour la page concernée (voir règle 1-bis).
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-intro {
  position: relative;
  z-index: 2;
  max-width: 1000px;
  margin: -70px auto 0;
  /* ← remonte par-dessus le banner */
  padding: 30px 34px;
  background: var(--text-white);
  border-left: 3px solid var(--text-link);
  box-shadow: 0 24px 50px -30px rgba(36, 35, 4, 0.4);
}

.esnot-intro > .wp-block-group__inner-container > p {
  margin: 0;
}

/* Le libellé « EN BREF » — classe « esnot-intro__label » sur un core/paragraph,
   ou géré via le premier <strong>. */
.esnot-intro .esnot-intro__label {
  display: block;
  margin-bottom: 12px;
  font-family: var(--font-lato);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--text-link);
}

/* 1-bis) Si la box est rognée par overflow:hidden — à mettre sur le body de la
   page (classe de page) OU cibler la page par son id. */
.page-intro-overlap .main-wrapper {
  overflow: visible;
}

/* ─────────────────────────────────────────────────────────────────────────────
   2) RYTHME DES SECTIONS + fond alternatif
   Classe sur le  core/group.alignfull  d'une section  → « esnot-section »
   Ajouter « esnot-section--alt » pour le fond crème alterné.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-section {
  padding-top: 84px;
  padding-bottom: 84px;
}

.esnot-section--alt {
  background: var(--wp--preset--color--bg-light, #f1f5ed);
  /* token bg-light */
}

/* #F2F2E3 */
.esnot-section--dark {
  background: var(--alter-dark);
  color: var(--footer-color);
}

/* ─────────────────────────────────────────────────────────────────────────────
   3) ENCADRÉ SOMBRE  (ex. « L'acte authentique »)
   Classe sur le  core/group  → « esnot-callout »
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-callout {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  padding: 38px 40px;
  background: var(--alter-dark);
  color: #cabfa8;
}

.esnot-callout .esnot-callout__icon {
  flex: 0 0 auto;
  font-size: clamp(33px, 24px + 1.25vw, 44px);
  color: var(--text-link);
  line-height: 1;
}

.esnot-callout :where(h2, h3, h4) {
  color: var(--text-white);
  margin: 0 0 12px;
}

.esnot-callout strong {
  color: var(--text-white);
}

/* ─────────────────────────────────────────────────────────────────────────────
   4) HIGHLIGHT « SLA / chiffre clé »
   Classe sur le  core/group  → « esnot-sla »
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-sla {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
  padding: 32px 36px;
  background: var(--text-white);
  border: 1px solid var(--text-input);
}

.esnot-sla .esnot-sla__num {
  font-family: var(--font-eb-garamond);
  font-size: clamp(42px, 30px + 1.6vw, 56px);
  line-height: 1;
  color: var(--text-link);
  text-transform: uppercase;
}

.esnot-sla .esnot-sla__label {
  margin-top: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text);
}

/* ─────────────────────────────────────────────────────────────────────────────
   5) LISTE DE VÉRIFICATIONS  (terme en gras + explication)
   Classe sur le  core/list  → « esnot-checklist »
   Rend chaque <li> comme une ligne encadrée avec une puce olive.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid var(--text-input);
}

.esnot-checklist li {
  position: relative;
  padding: 18px 24px 18px 52px;
  border-top: 1px solid var(--text-input);
  line-height: 1.7;
}

.esnot-checklist li:first-child {
  border-top: none;
}

.esnot-checklist li::before {
  content: "\e8ab";
  /* icon-check réel — \e989 n'existe pas (code deviné, corrigé v1.13) */
  /* icône « check » de la police fontello du thème */
  font-family: "fontello";
  position: absolute;
  left: 22px;
  top: 19px;
  font-size: 15px;
  color: var(--text-link);
}

.esnot-checklist li strong {
  color: var(--text-dark);
}

/* ─────────────────────────────────────────────────────────────────────────────
   6) GRILLE DE STATS (si panel-nexxis/counter ne suffit pas)
   Classe sur le  core/columns  → « esnot-stats »
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-stats .wp-block-column {
  padding: 30px 24px;
  text-align: center;
  background: var(--text-input);
}

.esnot-stats .esnot-stats__num {
  font-family: var(--font-eb-garamond);
  font-size: clamp(30px, 22px + 1.1vw, 40px);
  line-height: 1;
  color: var(--text-link);
}

.esnot-stats .esnot-stats__label {
  margin-top: 10px;
  font-size: 13.5px;
  color: var(--text);
}

/* ─────────────────────────────────────────────────────────────────────────────
   7) LIENS « Pour aller plus loin » (grille 2 colonnes cliquables)
   Classe sur le  core/list  → « esnot-linkgrid »
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-linkgrid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--text-input);
  border: 1px solid var(--text-input);
}

.esnot-linkgrid li {
  margin: 0;
}

.esnot-linkgrid li a {
  display: block;
  padding: 22px 26px;
  background: var(--text-white);
  font-family: var(--font-eb-garamond);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-dark);
}

.esnot-linkgrid li a:hover {
  background: var(--text-input);
  color: var(--text-link);
}

@media (max-width: 768px) {
  .esnot-linkgrid {
    grid-template-columns: 1fr;
  }

  .esnot-callout {
    flex-direction: column;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   8) RYTHME VERTICAL  (v1.1)
   Donne de l'air entre titres, paragraphes et blocs stylés à l'intérieur des
   sections « esnot-section ». Aucune classe à poser : s'applique automatiquement.
   ───────────────────────────────────────────────────────────────────────────── */

/* Le premier élément d'une section ne pousse pas vers le bas */
.esnot-section > *:first-child,
.esnot-section > .wp-block-group__inner-container > *:first-child {
  margin-top: 0;
}

/* Titres de sous-section (core/heading) : de l'air au-dessus */
.esnot-section .wp-block-heading {
  margin-top: 1.7em;
  margin-bottom: 0.5em;
}

/* Le titre DANS l'encadré sombre ne prend pas la marge de section */
.esnot-callout .wp-block-heading {
  margin-top: 0;
}

/* Respiration autour des blocs stylés */
.esnot-checklist,
.esnot-callout,
.esnot-sla,
.esnot-stats {
  margin-top: 1.7em;
  margin-bottom: 1.7em;
}

/* Espace après le bloc-titre nexxis avant le corps */
.nexxis-block-title {
  margin-bottom: 1.1em;
}

/* ==========================================================
==========================================================
========================================================== */

.nxp-promo-box,
.wp-block-column {
  border-radius: 0 !important;
}

.nexxis-submit-cf7 input[type="submit"],
.btn-primary,
.wp-block-button.is-style-btn-primary .wp-block-button__link {
  border-radius: 0;
}

.nxp-faq {
  border: 0;
}

.nxp-faq__item.is-open {
  border-bottom: 1px solid #1d1d0b;
}

.nxp-faq__question {
  color: #1d1d0b;
  font-family: var(--font-eb-garamond);
  font-size: clamp(22px, 16px + 0.75vw, 28px);
  line-height: 1.2em;
  font-weight: 400;
}

html {
  font-size: clamp(14px, 11px + 0.45vw, 18px);
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

p {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.62em;
  letter-spacing: 0.1px;
  text-transform: none;
  margin-top: 0em;
  margin-bottom: 1.57em;
}

h1 {
  font-size: clamp(3em, 1.5em + 2.5vw, 3.167em);
  font-weight: 400;
  font-style: normal;
  line-height: 1em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  margin-top: 1em;
  margin-bottom: 0.51em;
}

h2 {
  font-size: clamp(2em, 1.5em + 1.1vw, 2.611em);
  font-weight: 400;
  font-style: normal;
  line-height: 1.021em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0px;
  margin-top: 0.6em;
  margin-bottom: 0.67em;
}

h3 {
  font-size: clamp(1.5em, 1.2em + 0.7vw, 1.944em);
  font-weight: 400;
  font-style: normal;
  line-height: 1.086em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0px;
  margin-top: 0.88em;
  margin-bottom: 0.76em;
}

h4 {
  font-size: clamp(1.2em, 1em + 0.55vw, 1.556em);
  font-weight: 400;
  font-style: normal;
  line-height: 1.214em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0px;
  margin-top: 1.09em;
  margin-bottom: 0.9em;
}

h5 {
  font-size: clamp(1.05em, 0.85em + 0.5vw, 1.333em);
  font-weight: 400;
  font-style: normal;
  line-height: 1.417em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0px;
  margin-top: 1.27em;
  margin-bottom: 0.94em;
}

h6 {
  font-size: clamp(0.85em, 0.7em + 0.35vw, 1.056em);
  font-weight: 400;
  font-style: normal;
  line-height: 1.474em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0px;
  margin-top: 1.75em;
  margin-bottom: 1.1em;
}

blockquote {
  position: relative;
  overflow: hidden;
  border: none;
  padding: 0.9em 0.8em 0.7em;
  background-color: #ffffff;
  color: #1d1d0b;
  font-family: "EB Garamond", serif;
  border-left: 6px solid var(--text-link);
}

blockquote p {
  font-family: "EB Garamond", serif;
  font-size: clamp(15px, 12px + 0.45vw, 19px);
  font-weight: 500;
  line-height: 1.5;
  margin: 0;
}

blockquote > cite,
blockquote > p > cite,
blockquote > .wp-block-pullquote__citation,
.wp-block-quote .wp-block-quote__citation {
  display: block;
  font-size: clamp(15px, 12px + 0.45vw, 19px);
  line-height: 28px;
  font-weight: 500;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  margin-top: 1.55em;
  margin-bottom: 3px;
}

.nexxis-hero {
  .description {
    width: 100%;

    span {
      width: 100%;
      display: block;
      white-space: normal;
      overflow-wrap: break-word;
      word-wrap: break-word;
    }
  }
}

/* =============================================================================
   Ajouts 2026-07-07 — Cards 2×2 (esnot-cardgrid / esnot-card) + override
   promo-box coins saillants.
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   9) GRILLE DE CARDS 2×2
   Classe sur le  core/columns  → « esnot-cardgrid »
   Classe sur chaque core/group DANS une colonne → « esnot-card »
   Usage : blocs de services/arguments en grille régulière (2 colonnes,
   cartes d'égale hauteur). Passe en 1 colonne sous 768px.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-cardgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.esnot-cardgrid .wp-block-column {
  display: flex;
  /* la card remplit la colonne → hauteurs égales */
  margin: 0;
  flex-basis: auto !important;
}

.esnot-cardgrid .wp-block-column > .esnot-card {
  flex: 1 1 auto;
}

.esnot-card {
  padding: 30px 32px;
  background: var(--text-white);
  border: 1px solid var(--text-input);
  border-top: 3px solid var(--text-link);
}

.esnot-card :where(h3, h4) {
  margin: 0 0 12px;
  font-size: clamp(1.05em, 0.85em + 0.5vw, 1.333em);
  /* preset "large" — reste en EB Garamond uppercase */
}

.esnot-card > .wp-block-group__inner-container > p:last-child,
.esnot-card > p:last-child {
  margin-bottom: 0;
}

/* Sections à fond alterné : la card blanche ressort déjà ; sur fond blanc,
   le filet --text-input suffit à la délimiter. Rien à ajuster. */

/* Respiration (aligné sur la règle 8 — rythme vertical) */
.esnot-cardgrid {
  margin-top: 1.7em;
  margin-bottom: 1.7em;
}

@media (max-width: 768px) {
  .esnot-cardgrid {
    grid-template-columns: 1fr;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   10) OVERRIDE PROMO-BOX — coins saillants
   Aucune classe à poser : cible le wrapper WordPress du bloc
   panel-nexxis/promo-box. Aligne le CTA encart sur le langage formel du site
   (design sans arrondis).
   ⚠️ Sélecteur basé sur la classe wrapper auto-générée WP
   (.wp-block-panel-nexxis-promo-box) — le CSS du plugin n'étant pas dans le
   dépôt de synchro, vérifier au premier rendu live que le bouton interne est
   bien couvert ; sinon me remonter le sélecteur réel du bouton.
   ───────────────────────────────────────────────────────────────────────────── */
/* Version pipeline : variables exposées par le plugin (sources : panel-nexxis-blocks/
   promo-box/style.css) — remplace le sélecteur wrapper + !important. */
.nxp-promo-box {
  --nxp-pb-radius: 0;
  --nxp-pb-btn-radius: 0;
}

/* ─────────────────────────────────────────────────────────────────────────────
   11) MENTION DE ZONE — pages géographiques (v1.5)
   Classe sur un  core/paragraph  → « esnot-zoneline »
   Ligne small-caps olive avec filet supérieur ("Zone d'intervention confirmée —
   déplacements possibles"). Prévue pour le hero ; sinon premier élément du contenu.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-zoneline {
  display: inline-block;
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid var(--text-link);
  font-family: var(--font-lato);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-link);
}

p.esnot-zoneline.has-text-align-center {
  display: block;
  text-align: center;
}

/* =============================================================================
   Ajouts 2026-07-07 — animations & hovers (v1.7)
   Le reveal-on-scroll du contenu est câblé par js/esnot-reveal.js (thème enfant).
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   12) HOVER esnot-card — lift + liseré olive qui s'élargit
   Étend le langage thème (cartes services translateY(-10px), transitions .3s).
   Fonctionne sur core/group.esnot-card ET sur nexxis/block-service.esnot-card.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-card {
  position: relative;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.esnot-card::before {
  content: "";
  position: absolute;
  top: -3px;
  /* recouvre le border-top 3px olive */
  left: 0;
  height: 3px;
  width: 100%;
  background: var(--text-hover);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}

.esnot-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 34px -22px rgba(36, 35, 4, 0.35);
}

.esnot-card:hover::before {
  transform: scaleX(1);
}

/* Icône dans la card (fontello du bloc service, ou esnot-card__icon) */
.esnot-card i[class^="icon-"],
.esnot-card .esnot-card__icon {
  display: inline-block;
  color: var(--text-link);
  transition:
    transform 0.3s ease,
    color 0.3s ease;
}

.esnot-card:hover i[class^="icon-"],
.esnot-card:hover .esnot-card__icon {
  transform: scale(1.08);
  color: var(--text-hover);
}

/* ─────────────────────────────────────────────────────────────────────────────
   13) GRILLE 5 CARDS — la carte impaire finale prend toute la largeur
   (complète la règle esnot-cardgrid livrée le 2026-07-07 : évite le trou
   quand le nombre de cartes est impair — cas des grilles de 5 éléments)
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-cardgrid .wp-block-column:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

/* ─────────────────────────────────────────────────────────────────────────────
   14) HOVER esnot-linkgrid — glissement
   Complète la règle 7 (le hover fond/couleur existe déjà).
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-linkgrid li a {
  transition:
    background 0.3s ease,
    color 0.3s ease,
    padding-left 0.3s ease;
}

.esnot-linkgrid li a:hover {
  padding-left: 34px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   15) ACCESSIBILITÉ — prefers-reduced-motion (🔒 exigence transverse)
   Neutralise les micro-interactions ci-dessus ET les reveals du moteur thème
   (garde-fou si le script ne le gère pas déjà).
   ───────────────────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .esnot-card,
  .esnot-card::before,
  .esnot-card i[class^="icon-"],
  .esnot-card .esnot-card__icon,
  .esnot-linkgrid li a {
    transition: none;
  }

  .esnot-card:hover {
    transform: none;
  }

  .esnot-card:hover i[class^="icon-"],
  .esnot-card:hover .esnot-card__icon {
    transform: none;
  }

  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ── Ajout 2026-07-07 (v1.8) ──
   Linkgrid à nombre impair de liens : le dernier prend toute la largeur
   (évite la cellule vide — cas des 5 liens internes des pages géographiques). */
.esnot-linkgrid li:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

/* =============================================================================
   Ajouts 2026-07-07 — v1.9
   Sections 16-19 : hauteurs alternées · compteurs hairlines · label callout ·
   linkgrid sur fond sombre.
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   16) HAUTEURS DE SECTION — 3 niveaux alternés (craft 04 §3)
   esnot-section = standard 84px (existant) ; modificateurs :
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-section--tall {
  padding-top: 112px;
  padding-bottom: 112px;
}

/* respirante */
.esnot-section--compact {
  padding-top: 48px;
  padding-bottom: 48px;
}

/* bande */
@media (max-width: 768px) {
  .esnot-section--tall {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   17) COMPTEURS SUR HAIRLINES (remplace le motif "cartes blanches identiques")
   Classe sur le core/columns → « esnot-counters » ; enfants esnot-counter__num
   (heading) et esnot-counter__label (paragraph). Statique — pas d'odometer.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-counters {
  border-top: 1px solid rgba(36, 35, 4, 0.14);
  border-bottom: 1px solid rgba(36, 35, 4, 0.14);
  gap: 0 !important;
  margin: 1.7em 0;
}

.esnot-counters .wp-block-column {
  padding: 36px 32px;
  border-left: 1px solid rgba(36, 35, 4, 0.14);
  margin: 0;
}

.esnot-counters .wp-block-column:first-child {
  border-left: none;
}

.esnot-counter__num {
  font-family: var(--font-eb-garamond);
  font-size: clamp(48px, 34px + 1.85vw, 64px);
  line-height: 1;
  color: var(--text-dark);
  font-variant-numeric: tabular-nums;
  margin: 0;
}

.esnot-counter__label {
  margin-top: 12px;
  font-family: monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text);
}

@media (max-width: 768px) {
  .esnot-counters .wp-block-column {
    border-left: none;
    border-top: 1px solid rgba(36, 35, 4, 0.14);
  }

  .esnot-counters .wp-block-column:first-child {
    border-top: none;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   18) MICRO-LABEL DE CALLOUT (anti-faux contenus, 04 §5)
   Classe sur un core/paragraph en tête du esnot-callout → « esnot-callout__label »
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-callout .esnot-callout__label {
  flex: 0 0 auto;
  font-family: monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-link);
  opacity: 0.75;
  margin: 0;
}

/* ─────────────────────────────────────────────────────────────────────────────
   19) LINKGRID SUR FOND SOMBRE + flèche (S14 Eva en implémentation système)
   Rien à poser en plus : s'applique quand la linkgrid vit dans esnot-section--dark.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-section--dark .esnot-linkgrid {
  background: rgba(241, 245, 237, 0.16);
  border-color: rgba(241, 245, 237, 0.16);
}

.esnot-section--dark .esnot-linkgrid li a {
  background: var(--wp--preset--color--bg-light, #f1f5ed);
}

.esnot-section--dark .esnot-linkgrid li a:hover {
  background: var(--text-white);
}

.esnot-linkgrid li a::after {
  content: "→";
  color: var(--text-link);
  margin-left: auto;
  padding-left: 16px;
  transition: transform 0.3s ease;
}

.esnot-linkgrid li a:hover::after {
  transform: translateX(6px);
}

/* Rappel reduced-motion (couvre les ajouts ci-dessus) */
@media (prefers-reduced-motion: reduce) {
  .esnot-linkgrid li a::after {
    transition: none;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   20) CORRECTIFS PREMIER RENDU LIVE — CP.AIX (2026-07-07, boucle Playwright)
   ───────────────────────────────────────────────────────────────────────────── */

/* a. Titres de section lisibles sur fond sombre : le thème force text-dark
      quand block-title n'a pas de textColor — systémique pour toutes les
      sections --dark (constaté : "Pour aller plus loin" invisible). */
.esnot-section--dark .nexxis-block-title:not(.has-text-color) .nexxis-title {
  color: var(--text-white);
}

/* b. Robustesse du chevauchement "En bref" : garantir l'air sous le dernier
      texte de la section précédente à toutes les largeurs de viewport. */
.esnot-section:has(+ .esnot-intro) {
  padding-bottom: 180px;
}

/* c. Cartes domaines : icônes 44px au lieu de 80, rythme interne compact
      — scopé esnot-card. */
.esnot-card.nexxis-block-service .nexxis-service-media {
  font-size: clamp(33px, 24px + 1.25vw, 44px);
}

.esnot-card.nexxis-block-service .nexxis-service-media img {
  max-width: 44px;
}

.esnot-card.nexxis-block-service .nexxis-service-content {
  margin-top: 16px;
}

/* ── 20d (v1.11) : skin cartes domaines — le hook réel est .esnot-domains
      (classe posée sur la grille ; les block-service n'ont PAS esnot-card
      en v4 — le sélecteur 20c visait dans le vide). Icônes 44px, rythme compact,
      alignement gauche. */
.esnot-domains .nexxis-service-media {
  font-size: clamp(33px, 24px + 1.25vw, 44px);
}

.esnot-domains .nexxis-service-media img {
  max-width: 44px;
}

.esnot-domains .nexxis-service-content {
  margin-top: 14px;
}

.esnot-domains .nexxis-block-service {
  text-align: left;
}

.esnot-domains .nexxis-service-title {
  font-size: clamp(1.33em, 0.85em + 0.5vw, 1.333em);
}

/* ── 21 (v1.12) : légende d'image — bandeau compact (2026-07-07).
      Le panneau olive du thème (55px de padding,
      53% max) devient un bandeau discret : plus large, moins haut, texte réduit. */
figure.nexxis-block-image .nexxis-image-description {
  padding: 16px 22px;
  max-width: 72%;
}

figure.nexxis-block-image .nexxis-image-description h3 {
  font-size: clamp(0.85em, 0.7em + 0.35vw, 1.056em);
  line-height: 1.4;
}

/* ─────────────────────────────────────────────────────────────────────────────
   22 (v1.13) : FINITIONS PREMIER RENDU — lot du 2026-07-07
   ───────────────────────────────────────────────────────────────────────────── */

/* a. Promo-box pleine largeur : RETIRÉ en v1.16 — remplacé par le support natif
      align:full du bloc plugin (panel-nexxis v-next). Poser "Pleine largeur"
      dans la barre d'outils du bloc. (L'ancien override CSS perdait en
      spécificité contre le layout du thème.) */

/* b. Checklist sur fond blanc (elle vit sur sections --alt) */
.esnot-checklist {
  background: var(--text-white);
}

/* c. Linkgrid sur fond sombre : conteneur transparent (la trame claire translucide
      créait un "fond fantôme") — les 1px de gap laissent le fond sombre séparer */
.esnot-section--dark .esnot-linkgrid {
  background: transparent;
  border: none;
}

/* d. Respiration du CTA final après la linkgrid */
.esnot-section--dark .wp-block-buttons {
  margin-top: 36px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   23 (v1.14) : CALAGE FIN — ajustements du 2026-07-07 (16:08-16:09).
   Symptôme commun : le rendu était systématiquement plus gros et plus aéré
   que la cible visée.
   ───────────────────────────────────────────────────────────────────────────── */

/* a. Compteurs : chiffres 52px, unité en small discret, bloc compact */
.esnot-counters {
  padding: 8px 0;
}

.esnot-counter__num {
  font-size: clamp(38px, 28px + 1.5vw, 52px);
  line-height: 1.05;
}

.esnot-counter__num small {
  font-size: clamp(0.32em, 0.25em + 0.15vw, 0.42em);
  letter-spacing: 0;
  margin-left: 2px;
}

.esnot-counter__label {
  font-size: 10.5px;
}

.esnot-counters .wp-block-column {
  padding: 22px 24px;
}

/* b. Checklist : rangées compactes, texte resserré */
.esnot-checklist li {
  padding: 14px 20px 14px 48px;
  font-size: clamp(0.75em, 0.6em + 0.3vw, 0.938em);
  line-height: 1.6;
}

.esnot-checklist li::before {
  top: 15px;
  left: 20px;
  font-size: 13px;
}

/* c. Linkgrid : cellules fines une ligne (le texte 1em wrappait → hauteurs inégales) */
.esnot-linkgrid li a {
  font-size: clamp(0.7em, 0.55em + 0.3vw, 0.875em);
  padding: 15px 22px;
  letter-spacing: 0.05em;
}

.esnot-linkgrid li a::after {
  margin-left: 8px;
}

/* d. Registre boutons (uppercase letterspacé) : CTA sombres + bouton promo */
.esnot-section--dark .wp-block-button__link,
.nxp-promo-box .nxp-promo-box__btn {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
  font-weight: 700;
  padding: 15px 26px;
}

/* e. Promo : titre 1.944em serif, bande plus généreuse */
.nxp-promo-box .nxp-promo-box__title {
  font-size: clamp(1.5em, 1.2em + 0.7vw, 1.944em);
  line-height: 1.1;
}

.nxp-promo-box {
  padding-top: 44px;
  padding-bottom: 44px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   24 (v1.15) : HERO — ajustements ponctuels du banner thème (quick-wins CSS)
   Le design cible pose H1 à gauche + zoneline intégrée au fond sombre ; le
   banner thème centrait le titre et la zoneline retombait dans une bande
   blanche isolée.
   (Le hero complet — visuel plein cadre, titre éditorial long — reste le
   chantier "banner v2" côté thème parent, backlogué.)
   ───────────────────────────────────────────────────────────────────────────── */

/* a. Titre de banner aligné à gauche (pages intérieures) */
h1.page-title {
  text-align: left;
  width: 100%;
}

/* b. Zoneline en tête de contenu = connecteur sombre pleine largeur entre le
      banner et la première section (plus de bande blanche orpheline) */
.main-wrapper > .esnot-zoneline {
  /* v1.17 : :first-child retiré — la TOC toolkit s'insère avant */
  display: block;
  width: 100vw;
  max-width: none;
  /* v1.17.1 : le thème plafonne les enfants du wrapper à 1200px — sans ça le full-bleed est tronqué à droite */
  margin-left: calc(50% - 50vw);
  margin-top: 0;
  margin-bottom: 0;
  /* v1.17.1 : supprime le liseré blanc de ~19px avant la section sombre */
  padding: 4px max(24px, calc((100vw - 1200px) / 2)) 26px;
  background: var(--alter-dark);
  border-top: none;
}

/* ─────────────────────────────────────────────────────────────────────────────
   25 (v1.16) : TEXTE HERO DE BANNIÈRE (banner v2 — metabox thème parent)
   ───────────────────────────────────────────────────────────────────────────── */
.nexxis-banner .banner-hero-text {
  width: 100%;
  max-width: 62ch;
  margin-top: 22px;
  margin-right: auto;
  color: var(--footer-color);
  font-size: clamp(0.85em, 0.7em + 0.35vw, 1.056em);
  line-height: 1.7;
}

.nexxis-banner.has-hero-text {
  padding-bottom: 56px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   26 (v1.17) : HERO CONTINU — option B retenue (2026-07-07)
   Bannière → zoneline → section sombre → box "En bref" : les espacements se
   resserrent pour que le sombre se lise comme UNE seule masse (textes à la
   suite), la box chevauchant le bas de cette masse.
   ───────────────────────────────────────────────────────────────────────────── */
.main-wrapper > .esnot-zoneline {
  padding-top: 0;
  padding-bottom: 18px;
}

.main-wrapper > .esnot-zoneline + .esnot-section,
.main-wrapper > .esnot-zoneline + .esnot-section--tall {
  padding-top: 6px;
}

/* ─────────────────────────────────────────────────────────────────────────────
   27 (v1.18) : HERO 50/50 + GRILLE DOMAINES BORDÉE + H2 2em
   Calé par comparaison avec le design cible v4 (2026-07-07).
   ───────────────────────────────────────────────────────────────────────────── */

/* a. Hero 50/50 : texte moitié gauche, featured image révélée à droite,
      fondu vers le sombre en bas → masse continue avec zoneline + section.
      ⚠️ Le thème fixe le banner à height:500px — le contenu hero déborde
      (titre sous le menu, texte sur la zoneline) : height:auto obligatoire. */
.nexxis-banner.has-hero-text {
  position: relative;
  height: auto;
  min-height: 500px;
  padding-top: 150px;
  padding-bottom: 56px;
}

.nexxis-banner.has-hero-text::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(29, 29, 11, 0) 55%,
      rgba(29, 29, 11, 0.92) 92%,
      #1d1d0b 100%
    ),
    linear-gradient(
      90deg,
      #1d1d0b 0%,
      #1d1d0b 44%,
      rgba(29, 29, 11, 0.55) 70%,
      rgba(29, 29, 11, 0.28) 100%
    );
}

.nexxis-banner.has-hero-text > div {
  position: relative;
  z-index: 1;
}

.nexxis-banner.has-hero-text .flex {
  align-items: flex-start;
  height: auto;
}

.nexxis-banner.has-hero-text h1.page-title {
  max-width: 54%;
  margin-right: auto;
}

.nexxis-banner.has-hero-text .banner-hero-text {
  max-width: 50%;
}

@media (max-width: 900px) {
  .nexxis-banner.has-hero-text h1.page-title,
  .nexxis-banner.has-hero-text .banner-hero-text {
    max-width: 100%;
  }

  .nexxis-banner.has-hero-text::before {
    background: linear-gradient(
      180deg,
      rgba(29, 29, 11, 0.78) 0%,
      rgba(29, 29, 11, 0.88) 55%,
      #1d1d0b 100%
    );
  }
}

/* b. H2 contenus : 2em (thème : 2.61em, jugé trop grand) */
.main-wrapper h2 {
  font-size: clamp(2em, 1.2em + 0.75vw, 2em);
}

/* c. Grille domaines bordée : lattice à séparateurs fins,
      rangée du bas (2 cellules) centrée en brique, trait olive sous l'icône.
      Markup = deux wp-block-columns.esnot-domains ADJACENTS (3 cols puis 2). */
.esnot-domains {
  gap: 0 !important;
  /* !important : gap posé par la classe wp-container-* inline (charge après nous) */
  padding-top: 0;
  /* le thème met padding 30px sur .wp-block-columns → gap visuel entre rangées */
  padding-bottom: 0;
  margin-bottom: 0;
}

.esnot-domains > .wp-block-column {
  border: 1px solid rgba(203, 191, 168, 0.18);
  padding: 40px 38px 34px;
  margin: 0 !important;
}

.esnot-domains .nexxis-block-service {
  padding: 0;
}

.esnot-domains .nexxis-service-icon::after {
  content: "";
  display: block;
  width: 36px;
  height: 1px;
  background: var(--text-link);
  margin-top: 16px;
}

.esnot-domains + .esnot-domains {
  margin-top: -1px;
}

/* bordures partagées entre rangées */

/* d. Compteurs : l'air autour des chiffres venait du H3 (marge thème 1.7em
      × 52px = 88px au-dessus de chaque chiffre) + paddings rangée/cellule.
      Cible : cellule ~166px, chiffre collé au label (12px). */
.esnot-counters {
  padding-top: 0 !important;
  /* !important : padding 30px posé par le thème sur .wp-block-columns */
  padding-bottom: 0 !important;
  margin-top: 10px;
  margin-bottom: 10px;
}

.esnot-counters .wp-block-column {
  padding: 36px 32px;
}

.esnot-counters .esnot-counter__num {
  margin: 0;
  line-height: 1;
}

.esnot-counters .esnot-counter__label {
  margin: 12px 0 0;
}

@media (min-width: 782px) {
  .esnot-domains > .wp-block-column + .wp-block-column {
    border-left: none;
  }

  .esnot-domains + .esnot-domains {
    max-width: 800.5px !important;
    /* 2 cellules = 2/3 des 1200px, centrées ; !important : perd sinon contre le layout WP */
    width: auto;
  }
}

@media (max-width: 781px) {
  /* colonnes empilées : bordures fusionnées verticalement */
  .esnot-domains > .wp-block-column + .wp-block-column,
  .esnot-domains + .esnot-domains > .wp-block-column:first-child {
    border-top: none;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   28 (v1.19) : NUMÉROTATION DES CARTES-VERROUS (pages de service)
   Le design cible numérote les 5 vérifications 01→05 — nexxis/block-service ne
   porte pas de compteur natif : on le rend en CSS pur, par section (reset :has).
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-section:has(.esnot-cardgrid) {
  counter-reset: esnot-verrou;
}

.esnot-cardgrid .esnot-card {
  counter-increment: esnot-verrou;
}

.esnot-cardgrid .esnot-card .nexxis-service-title::before {
  content: "0" counter(esnot-verrou);
  display: block;
  margin-bottom: 10px;
  font-family: var(--font-lato);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--text-link);
}

/* ─────────────────────────────────────────────────────────────────────────────
   29 (v1.20) : VARIANTES DÉMO LAWOFFICE (2026-07-07)
   Réactivation de l'ADN visuel du thème d'origine (lawoffice.themerex.net) :
   chiffres fantômes + grilles tricolores. Règles d'usage → bibliothèque de styles.
   ───────────────────────────────────────────────────────────────────────────── */

/* a. Numérotation FANTÔME — variante des cartes numérotées (v1.19).
      Classe sur le columns : « esnot-cardgrid--ghost » (en plus de esnot-cardgrid).
      Grand chiffre Garamond gris clair, à la « 01. Excellent Lawyers » de la démo. */
.esnot-cardgrid--ghost .esnot-card .nexxis-service-title::before {
  content: "0" counter(esnot-verrou) ".";
  display: block;
  margin-bottom: 2px;
  font-family: var(--font-eb-garamond);
  font-size: clamp(48px, 34px + 1.85vw, 64px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: 0;
  color: rgba(29, 29, 11, 0.16);
  /* filigrane encre — lisible sur blanc ET crème (le token --text-input était invisible ici) */
}

/* b. Grille TRICOLORE — pour les grilles de 3 cartes EXACTEMENT.
      Classe sur le columns : « esnot-cardgrid--tricolor ».
      Alternance des 3 fonds du registre : blanc / crème / olive sombre.
      Le texte s'adapte par fond (leçon contraste 2026-07-07). Max 1 par page. */
.esnot-cardgrid--tricolor .wp-block-column:nth-child(1) .nexxis-block-service {
  background: var(--text-white);
}

.esnot-cardgrid--tricolor .wp-block-column:nth-child(2) .nexxis-block-service {
  background: var(--text-link);
  /* olive #88865A — couleur de palette du thème */
}

.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(2)
  .nexxis-block-service
  .nexxis-service-title {
  color: var(--text-white);
}

.esnot-cardgrid--tricolor .wp-block-column:nth-child(2) .nexxis-block-service p,
.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(2)
  .nexxis-block-service
  .nexxis-service-desc {
  color: rgba(255, 255, 255, 0.88);
}

.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(2)
  .nexxis-block-service
  .nexxis-service-title::before,
.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(2)
  .nexxis-block-service
  .nexxis-service-icon
  i {
  color: rgba(255, 255, 255, 0.3);
  /* fantôme + icône lisibles sur olive */
}

.esnot-cardgrid--tricolor .wp-block-column:nth-child(3) .nexxis-block-service {
  background: var(--alter-dark);
}

.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(3)
  .nexxis-block-service
  .nexxis-service-title,
.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(3)
  .nexxis-block-service
  .nexxis-service-title::before {
  color: var(--text-white);
}

.esnot-cardgrid--tricolor .wp-block-column:nth-child(3) .nexxis-block-service p,
.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(3)
  .nexxis-block-service
  .nexxis-service-desc {
  color: var(--footer-color);
}

.esnot-cardgrid--tricolor
  .wp-block-column:nth-child(3)
  .nexxis-block-service
  .nexxis-service-title::before {
  color: rgba(255, 255, 255, 0.22);
  /* fantôme lisible sur fond sombre */
}

/* ─────────────────────────────────────────────────────────────────────────────
   30 (v1.21) : LISTES EN QUINCONCE — élément de signature visuelle (2026-07-07).
   Les checklists se décalent de l'axe du texte : la 1re d'une
   section part à DROITE, la 2e à GAUCHE (alternance automatique, nth-of-type).
   Subtil (85% de largeur, décalage 15%) — marqueur reconnaissable des pages
   longues. Mobile : pleine largeur, pas de décalage.
   ───────────────────────────────────────────────────────────────────────────── */
@media (min-width: 1000px) {
  /* v1.21.1 : la liste GARDE sa largeur de colonne — elle GLISSE
     hors de l'axe du texte (translateX), sans reflow. Décalage subtil ~56px. */
  .esnot-section .esnot-checklist:nth-of-type(odd) {
    transform: translateX(min(4vw, 56px));
  }

  .esnot-section .esnot-checklist:nth-of-type(even) {
    transform: translateX(max(-4vw, -56px));
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   31 (v1.22) : SUPERPOSITION & BISEAU — 2 gestes de signature visuelle (2026-07-07)
   Un seul geste fort par écran.
   ───────────────────────────────────────────────────────────────────────────── */

/* a. CHEVAUCHEMENT DE FRONTIÈRE — généralisation de la signature S3 (En bref).
      Classe sur une grille (columns) : « esnot-overlap » → elle enjambe la
      section PRÉCÉDENTE (typiquement : cartes claires à cheval sur une fin de
      section sombre). Prérequis : la section suivante ne doit pas rogner
      (overflow) et la précédente doit garder ~70px de padding bas. */
.esnot-overlap {
  position: relative;
  z-index: 2;
  margin-top: -64px !important;
}

@media (max-width: 781px) {
  .esnot-overlap {
    margin-top: 0 !important;
  }

  /* mobile : empilement normal */
}

/* b. COIN BISEAUTÉ — trompe-l'œil éditorial : le 4e angle coupé.
      Classe sur le columns : « esnot-cardgrid--notch » (toutes les cartes)
      ou sur une carte seule : « esnot-card--notch ». Coupe l'angle bas-droit. */
.esnot-cardgrid--notch .nexxis-block-service,
.esnot-card--notch {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - 26px),
    calc(100% - 26px) 100%,
    0 100%
  );
}

/* ====================================================================
   32 (v1.23) : COMPTEURS SUR FOND SOMBRE — variante frise (HP « 1965 »)
   « esnot-counters esnot-counters--dark » dans une esnot-section--dark :
   hairlines, chiffres et labels passent en clair. Introduite sur la page
   d'accueil, généralisée après validation. */
.esnot-counters--dark {
  border-top-color: rgba(241, 245, 237, 0.22);
  border-bottom-color: rgba(241, 245, 237, 0.22);
}

.esnot-counters--dark .wp-block-column {
  border-left-color: rgba(241, 245, 237, 0.22);
}

.esnot-counters--dark .esnot-counter__num {
  color: #fff;
}

.esnot-counters--dark .esnot-counter__label {
  color: rgba(241, 245, 237, 0.72);
}

@media (max-width: 768px) {
  .esnot-counters--dark .wp-block-column {
    border-top-color: rgba(241, 245, 237, 0.22);
  }
}

/* ====================================================================
   33 (v1.24) : RESTYLE T7 CHECKLIST + T11 LINKGRID (2026-07-10)
   Option retenue : T7-A « registre sur hairlines » + T11-B « deux
   colonnes sur filets », avec variantes contextuelles clair/sombre.
   Posé en fin de surcouche : re-spécifie les règles 5/7/14/19/22b-c/23b-c
   (à purger lors d'un futur ménage). Quinconce (règle 30) compatible. */

/* ─────────────────────────────────────────────────────────────────────────────
   T7 — CHECKLIST « REGISTRE SUR HAIRLINES » (base : fonds clairs)
   Boîte dissoute · mesure plafonnée 780px · hairlines olive S2 ·
   coche fontello 19px · n° mono chronométré à droite (S1).
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-checklist {
  border: none;
  background: transparent;
  max-width: 780px;
  counter-reset: esnot-t7;
  border-bottom: 1px solid rgba(136, 134, 90, 0.42);
}

.esnot-checklist li {
  counter-increment: esnot-t7;
  position: relative;
  padding: 23px 76px 23px 46px;
  border-top: 1px solid rgba(136, 134, 90, 0.42);
  font-size: 1em;
  line-height: 1.65;
}

.esnot-checklist li:first-child {
  border-top: 1px solid rgba(136, 134, 90, 0.42);
}

/* le filet haut ferme le registre */
.esnot-checklist li::before {
  content: "\e8ab";
  /* icon-check fontello (code vérifié v1.13) */
  font-family: "fontello";
  position: absolute;
  left: 2px;
  top: 23px;
  font-size: clamp(15px, 12px + 0.45vw, 19px);
  line-height: 1;
  color: var(--text-link);
}

.esnot-checklist li::after {
  content: "0" counter(esnot-t7);
  position: absolute;
  right: 2px;
  top: 28px;
  font-family: monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--text-link);
  opacity: 0.65;
}

.esnot-checklist li strong {
  color: var(--text-dark);
}

@media (max-width: 768px) {
  .esnot-checklist li {
    padding: 18px 52px 18px 36px;
    font-size: clamp(0.938em, 0.6em + 0.3vw, 0.938em);
  }

  .esnot-checklist li::before {
    font-size: clamp(13px, 10px + 0.35vw, 16px);
    top: 19px;
  }

  .esnot-checklist li::after {
    top: 22px;
  }
}

/* ── T7 · contexte SOMBRE (.esnot-section--dark) ──
   Change : hairlines olive .42 → clair rgba(241,245,237,.22) (précédent
   counters--dark — l'olive s'éteint sur l'encre) · strong → blanc ·
   n° mono : opacité .65 → .85. Coche et n° restent olive --text-link. */
.esnot-section--dark .esnot-checklist {
  border-bottom-color: rgba(241, 245, 237, 0.22);
}

.esnot-section--dark .esnot-checklist li,
.esnot-section--dark .esnot-checklist li:first-child {
  border-top-color: rgba(241, 245, 237, 0.22);
}

.esnot-section--dark .esnot-checklist li::after {
  opacity: 0.85;
}

.esnot-section--dark .esnot-checklist li strong {
  color: var(--text-white);
}

/* ─────────────────────────────────────────────────────────────────────────────
   T11 — LINKGRID « DEUX COLONNES SUR FILETS » (base : fonds clairs)
   Cellules dissoutes · serif bas-de-casse 1.06em · flèche olive ancrée en fin
   de flex (plus d'orpheline en 2e ligne) · orpheline impaire = ligne continue.
   ───────────────────────────────────────────────────────────────────────────── */
.esnot-linkgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 72px;
  background: transparent;
  border: none;
  border-top: 1px solid rgba(36, 35, 4, 0.18);
}

.esnot-linkgrid li {
  border-bottom: 1px solid rgba(36, 35, 4, 0.18);
}

.esnot-linkgrid li:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.esnot-linkgrid li a {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 2px;
  background: transparent;
  font-family: var(--font-eb-garamond);
  font-size: clamp(1.06em, 0.7em + 0.35vw, 1.06em);
  line-height: 1.45;
  text-transform: none;
  letter-spacing: 0.01em;
  color: var(--text-dark);
  transition: color 0.3s ease;
}

.esnot-linkgrid li a::after {
  content: "→";
  margin-left: auto;
  padding-left: 18px;
  flex: 0 0 auto;
  color: var(--text-link);
  transition: transform 0.3s ease;
}

.esnot-linkgrid li a:hover {
  background: transparent;
  color: var(--text-hover);
  padding-left: 2px;
  /* remplace le padding-left:34px de la règle 14 */
}

.esnot-linkgrid li a:hover::after {
  transform: translateX(6px);
}

@media (max-width: 768px) {
  .esnot-linkgrid {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* ── T11 · contexte SOMBRE (.esnot-section--dark) — re-spécifie la règle 19 ──
   Change : filets encre .18 → clair rgba(241,245,237,.18) · liens encre →
   #DFE4D8, hover olive-sombre → blanc. Flèche olive inchangée. */
.esnot-section--dark .esnot-linkgrid {
  background: transparent;
  border: none;
  border-top: 1px solid rgba(241, 245, 237, 0.18);
}

.esnot-section--dark .esnot-linkgrid li {
  border-bottom-color: rgba(241, 245, 237, 0.18);
}

.esnot-section--dark .esnot-linkgrid li a {
  background: transparent;
  color: #dfe4d8;
}

.esnot-section--dark .esnot-linkgrid li a:hover {
  background: transparent;
  color: var(--text-white);
}

/* ── Reduced motion (couvre T11 ; T7 n'a pas de transition) ── */
@media (prefers-reduced-motion: reduce) {
  .esnot-linkgrid li a,
  .esnot-linkgrid li a::after {
    transition: none;
  }
}

/* -----------------------------------------------------------------------------
   NOTES D'INTÉGRATION
   · Blanc ≡ crème --alt : aucune règle séparée, les valeurs encre-alpha
     tiennent sur les deux fonds clairs.
   · Aucun contexte interdit pour les deux patterns. Réserve signalée : sur
     --dark, la coche olive 19px ≈ 2.9:1 de contraste (glyphe redondant avec le
     filet — acceptable ; ne pas éclaircir l'olive, hors palette).
   · Le reveal js/esnot-reveal.js (checklist entière à 100 ms, li de linkgrid
     en escalier 60 ms) reste câblé tel quel — sélecteurs inchangés.
   · #DFE4D8 : dérivé lisibilité de bg-light #F1F5ED sur encre (liens longs) —
     si le zéro-hex-nouveau est strict, remplacer par var(--footer-color).
   Nouvelles classes esnot-* : AUCUNE.
   ----------------------------------------------------------------------------- */

/* ====================================================================
   34 (v1.25) : LIENS INLINE — ressortir dans les DEUX schémas (2026-07-11)
   Cible : les liens DANS le texte courant (paragraphes, listes de contenu).
   Hors périmètre : boutons, linkgrid (T11), cartes — ils ont leur propre langage.
   Distinction accessible : souligné fin décalé (pas seulement la couleur — WCAG 1.4.1). */
.main-wrapper p > a:not(.wp-block-button__link):not(.wp-element-button),
.main-wrapper ul:not(.esnot-linkgrid) li > a,
.esnot-checklist li a {
  color: var(--text-link);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(136, 134, 90, 0.45);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition:
    color 0.2s ease,
    text-decoration-color 0.2s ease;
}

.main-wrapper p > a:not(.wp-block-button__link):not(.wp-element-button):hover,
.main-wrapper ul:not(.esnot-linkgrid) li > a:hover,
.esnot-checklist li a:hover {
  color: var(--text-hover);
  text-decoration-color: currentColor;
}

/* ── schéma SOMBRE : l'olive s'éteint sur l'encre → texte clair, filet olive ── */
.esnot-section--dark p > a:not(.wp-block-button__link):not(.wp-element-button),
.esnot-section--dark ul:not(.esnot-linkgrid) li > a,
.esnot-section--dark .esnot-checklist li a {
  color: #dfe4d8;
  /* dérivé lisibilité bg-light (précédent v1.24 T11) */
  text-decoration-color: rgba(136, 134, 90, 0.75);
  /* le filet olive reste la signature */
}

.esnot-section--dark
  p
  > a:not(.wp-block-button__link):not(.wp-element-button):hover,
.esnot-section--dark ul:not(.esnot-linkgrid) li > a:hover,
.esnot-section--dark .esnot-checklist li a:hover {
  color: var(--text-white);
}

/* ====================================================================
   35 (v1.26) : SINGLE PORTFOLIO — libérer la largeur (2026-07-13)
   Le gabarit single du thème enferme le contenu dans article.nexxis-single
   (max-width 1200px + padding 18px) — gabarit de LECTURE pensé pour les
   articles de blog, dont le CPT portfolio héritait : tous les alignfull /
   alignwide du modèle étaient bridés à 1164px. On libère UNIQUEMENT le
   portfolio ; les groups constrained gèrent eux-mêmes leur largeur de
   contenu (contentSize 1200). Les articles de blog gardent leur gabarit. */
.single-portfolio .nexxis-single {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* ====================================================================
   35-bis (2026-07-18) : ALIGNFULL IMBRIQUÉ — filet de sécurité général
   Sur certaines pages portfolio (ex. situation-sci-investissement-marseille),
   le contenu entier se retrouve imbriqué dans un conteneur intermédiaire
   is-layout-constrained à 1200px que les autres pages n'ont pas — la cause
   exacte (cascade constrained-layout de Gutenberg selon la façon dont le
   contenu a été enregistré) n'a pas été isolée avec certitude. Plutôt que
   cibler chaque bloc concerné un par un (constaté sur « Pour aller plus
   loin » ET sur panel-nexxis/promo-box, sur des pages différentes), filet
   général : tout élément alignfull du contenu portfolio bleed en pleine
   largeur, quel que soit son niveau d'imbrication réel. */
.single-portfolio .nexxis-single .alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* ====================================================================
   36 (v1.26) : TITRES LONGS — équilibrage typographique (2026-07-13)
   Les H2 du système portent des requêtes complètes (longue traîne, PAA) :
   la longueur est un CHOIX SEO, pas un accident. Le design compense :
   text-wrap:balance équilibre les lignes (fini la ligne orpheline d'un mot),
   et la mesure des titres est plafonnée pour des lignes plus courtes. */
.main-wrapper h1,
.main-wrapper h2,
.main-wrapper h3,
.nexxis-title,
.page-title {
  text-wrap: balance;
}

/* .main-wrapper .nexxis-title { max-width: 26ch; } */
.nexxis-block-title.text-center .nexxis-title {
  margin-left: auto;
  margin-right: auto;
}

/* ====================================================================
   37 (v1.27) : CTA + FORMULAIRE DU HERO — module toolkit page-hero v1.2.0
   (2026-07-13) Le module rend <div.nxt-hero-actions> (a.nxt-hero-cta +
   div.nxt-hero-form) sous le texte hero de la bannière — classes neutres,
   le thème décide du look. Ici : CTA en registre btn-primary du thème
   (olive plein, blanc — lisible sur la bannière encre), rythme aligné
   sur le hero. Règle : 1 seul CTA par défaut ; le formulaire dans le hero
   reste une exception décidée page par page (jamais un défaut). */
.nexxis-banner .nxt-hero-actions {
  margin-top: 28px;
}

.nexxis-banner .nxt-hero-cta {
  display: inline-block;
  font-family: var(--font-lato);
  font-size: 12px;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  letter-spacing: 0.26em;
  text-decoration: none;
  border-radius: 0;
  background-color: var(--text-link);
  color: var(--text-white);
  border: 1px solid var(--text-link);
  padding: 14px 32px;
  transition: all ease-out 0.3s;
}

.nexxis-banner .nxt-hero-cta:hover,
.nexxis-banner .nxt-hero-cta:focus-visible {
  background-color: var(--text-hover);
  border-color: var(--text-hover);
  color: var(--text-white);
}

/* Formulaire hero (cas d'exception) : contenu borné, texte lisible sur
   fond encre. Affinage au cas réel le jour où une page l'active. */
.nexxis-banner .nxt-hero-form {
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
  color: var(--text-white);
}

/* ====================================================================
   38 (v1.28) : EN BREF premier bloc + CTA hero — deux fixes liés (2026-07-13)
   a. Le thème pose .main-wrapper{overflow:hidden} : quand la carte « En bref »
      est le PREMIER bloc du contenu (cas P4), sa remontée de -70px sort du
      conteneur et se fait ROGNER (cas documenté §1-bis, opt-in jamais branché).
      Fix générique : clip horizontal conservé (anti-débordement des alignfull),
      vertical libéré. Navigateurs sans overflow:clip → déclaration ignorée,
      comportement thème inchangé (dégradation propre).
   b. La carte remontée croisait le bouton CTA du hero (module page-hero,
      13/07) : les bannières porteuses d'actions gagnent du dégagement bas —
      la carte chevauche du sombre vide, jamais le bouton (56px → 120px). */
.main-wrapper {
  overflow-x: clip;
  overflow-y: visible;
}

.nexxis-banner:has(.nxt-hero-actions) {
  padding-bottom: 120px;
}
/*
.nxt-nav-drawer__body>ul .current-menu-item>a,
.nxt-nav-drawer__body>ul .current-menu-parent>a,
.nxt-nav-drawer__body>ul .current-menu-ancestor>a,
.nxt-nav-cta-btn{
   background-color: var(--alter-dark) !important;
}
.nxt-nav-cta-btn:hover,
.nxt-nav-cta-btn:focus-visible,
.nxt-nav-cta-btn:active{
   background-color: var(--text-link) !important;
}*/
@media (max-width: 768px) {
  header.nexxis_header_composition {
    & .wp-block-button,
    & a.btn-icon,
    & .wp-block-navigation {
      display: none !important;
    }

    & .wp-block-columns {
      display: block;
      margin-bottom: 0px;
    }
  }

  .nxt-nav-trigger--floating {
    top: 22px;
  }
}

/*
#site-header.header--scrolled {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  z-index: 999;
  backdrop-filter: blur(4px);
  background: rgba(29, 29, 11, 0.8);

  & .wp-block-group > .wp-block-columns {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
  }
}*/
@media (min-width: 769px) {
  #site-header.nxt-sticky-header .wp-block-group > .wp-block-columns {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
}