/* ============================================================
   BASE
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  /* Réserve la place de la scrollbar même sur les pages courtes
     pour que la viewport ait la même largeur sur toutes les pages
     (sinon le header fixed apparaît décalé entre pages courtes/longues) */
  scrollbar-gutter: stable;
}

body { overflow-x: hidden; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .section-texte-defilant__track { animation: none !important; }
}

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--c-black);
  background: var(--c-cream);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--section-px);
}

@media (max-width: 768px) {
  .container { padding-inline: 0; }
}

.u-heading { font-family: var(--font-heading); line-height: 1.2; }

/* ============================================================
   COMPOSANTS — BOUTON
   ============================================================ */

.btn {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
  border: none;
  background: none;
}

.btn__label {
  display: flex;
  align-items: center;
  height: 51px;
  padding: 0 2.5rem;
  margin-right: 2em;
  background: var(--c-orange);
  border-radius: var(--r-md);
  color: var(--c-cream);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background 0.35s ease, color 0.35s ease;
}

.btn__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 49px;
  height: 49px;
  margin-left: -16px;
  margin-top: 1px;
  background: var(--c-navy);
  color: var(--c-cream);
  border-radius: var(--r-md);
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: background 0.35s ease, color 0.35s ease;
}

/* Effet slide sur la flèche : la flèche sort à droite, une nouvelle arrive de gauche */
.btn__icon-arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -9px 0 0 -9px;
  transition: transform 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}

.btn__icon-arrow--ghost {
  transform: translateX(-49px);
}

.btn:hover .btn__icon-arrow {
  transform: translateX(49px);
}

.btn:hover .btn__icon-arrow--ghost {
  transform: translateX(0);
}

/* Inversion des couleurs au survol : orange ↔ navy */
.btn:hover .btn__label {
  background: var(--c-navy);
}

.btn:hover .btn__icon {
  background: var(--c-orange);
}

/* Variante light */
.btn--light .btn__label { background: var(--c-cream); color: var(--c-navy); }
.btn--light .btn__icon  { background: var(--c-orange); }

.btn--light:hover .btn__label {
  background: var(--c-orange);
  color: var(--c-cream);
}

.btn--light:hover .btn__icon {
  background: var(--c-cream);
  color: var(--c-navy);
}

@media (max-width: 640px) {
  .btn { max-width: 100%; }
  .btn__label {
    height: 46px;
    padding: 0 1.5rem;
    margin-right: 1.5em;
    font-size: 0.85rem;
    letter-spacing: 2px;
    white-space: normal;
    line-height: 1.2;
    text-align: left;
  }
  .btn__icon { width: 44px; height: 44px; margin-left: -14px; }
  .btn__icon-arrow--ghost { transform: translateX(-44px); }
  .btn:hover .btn__icon-arrow { transform: translateX(44px); }
}

/* ============================================================
   COMPOSANTS — LISTES (WYSIWYG content)
   ============================================================ */

.section-domaine__desc ul,
.section-domaine__desc ol,
.section-avocate__desc ul,
.section-avocate__desc ol,
.faq__answer-inner ul,
.faq__answer-inner ol,
.processus-item__description ul,
.processus-item__description ol,
.section-hero-archive__intro-texte ul,
.section-hero-archive__intro-texte ol,
.section-hero-home__intro-text ul,
.section-hero-home__intro-text ol,
.service-item__body-left ul,
.service-item__body-left ol,
.entry-content ul,
.entry-content ol {
  margin: 1rem 0;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.section-domaine__desc li,
.section-avocate__desc li,
.faq__answer-inner li,
.processus-item__description li,
.section-hero-archive__intro-texte li,
.section-hero-home__intro-text li,
.service-item__body-left li,
.entry-content li {
  position: relative;
  padding-left: 1.75rem;
  line-height: 1.7;
}

/* Puces ul : petit point orange aligné sur la première ligne */
.section-domaine__desc ul > li::before,
.section-avocate__desc ul > li::before,
.faq__answer-inner ul > li::before,
.processus-item__description ul > li::before,
.section-hero-archive__intro-texte ul > li::before,
.section-hero-home__intro-text ul > li::before,
.service-item__body-left ul > li::before,
.entry-content ul > li::before {
  content: '';
  position: absolute;
  left: 0.4rem;
  top: 0.65em;
  width: 7px;
  height: 7px;
  background: var(--c-orange);
  border-radius: 50%;
}

/* Numérotation ol : "01." en orange */
.section-domaine__desc ol,
.section-avocate__desc ol,
.faq__answer-inner ol,
.processus-item__description ol,
.section-hero-archive__intro-texte ol,
.section-hero-home__intro-text ol,
.service-item__body-left ol,
.entry-content ol {
  counter-reset: avd-list;
}

.section-domaine__desc ol > li,
.section-avocate__desc ol > li,
.faq__answer-inner ol > li,
.processus-item__description ol > li,
.section-hero-archive__intro-texte ol > li,
.section-hero-home__intro-text ol > li,
.service-item__body-left ol > li,
.entry-content ol > li {
  counter-increment: avd-list;
  padding-left: 2.5rem;
}

.section-domaine__desc ol > li::before,
.section-avocate__desc ol > li::before,
.faq__answer-inner ol > li::before,
.processus-item__description ol > li::before,
.section-hero-archive__intro-texte ol > li::before,
.section-hero-home__intro-text ol > li::before,
.service-item__body-left ol > li::before,
.entry-content ol > li::before {
  content: counter(avd-list, decimal-leading-zero) '.';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--c-orange);
  font-weight: 700;
  font-size: 0.95em;
  letter-spacing: 1px;
}

/* Listes imbriquées : pas de double margin */
.section-domaine__desc li ul,
.section-domaine__desc li ol,
.section-avocate__desc li ul,
.section-avocate__desc li ol,
.faq__answer-inner li ul,
.faq__answer-inner li ol,
.processus-item__description li ul,
.processus-item__description li ol,
.section-hero-archive__intro-texte li ul,
.section-hero-archive__intro-texte li ol,
.section-hero-home__intro-text li ul,
.section-hero-home__intro-text li ol,
.service-item__body-left li ul,
.service-item__body-left li ol,
.entry-content li ul,
.entry-content li ol {
  margin: 0.5rem 0 0;
}

/* ============================================================
   COMPOSANTS — SURTITRE
   ============================================================ */

.surtitre {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 1.5rem 0.5rem 1.5rem;
  background: var(--c-cream);
  border: 1px solid var(--c-border);
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 300;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--c-navy);
  width: fit-content;
}

.surtitre__logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.surtitre__logo svg { height: 20px; width: auto; }

.surtitre--dark {
  background: rgba(14, 45, 86, 0.08);
  border-color: rgba(14, 45, 86, 0.15);
}

/* ============================================================
   GLOBAL — HEADER / NAV
   ============================================================ */

.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  /* min horizontal padding pour ne pas que les contrôles touchent le bord
     sur très petits mobiles (où --section-px peut descendre à 0.5rem) */
  padding: 1rem max(var(--section-px), 1rem);
  transition: padding 0.3s ease;
}

.site-header--home {
  /* min 1.5rem pour rester aligné avec la card du hero qui a 1.25rem de marge */
  padding: 4.5rem max(var(--section-px), 1.5rem);
}

/* Au scroll : remonte le header pour qu'il colle au haut */
.site-header.is-scrolled { padding: 0.75rem max(var(--section-px), 1rem); }
.site-header--home.is-scrolled { padding: 0.75rem max(var(--section-px), 1.5rem); }

/* Petit écran : la barre est resserrée à 85% en haut (look flottant), puis
   reprend toute la largeur dès qu'on défile. */
@media (max-width: 768px) {
  .site-header .nav { width: 85%; }
  .site-header.is-scrolled .nav { width: 100%; }
}

/* Pill blanche sous le logo quand scrolled (pas sur tout le header) */
.site-header.is-scrolled .nav__logo {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 20px;
  padding: 6px 1.25rem;
  transition: background 0.3s ease, padding 0.3s ease;
}

.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  width: 100%;
  height: 60px;
  max-width: var(--container-max);
  margin-inline: auto;
  transition: width 0.3s ease;
}

.nav__logo {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  transition: background 0.3s ease, padding 0.3s ease;
  height: 100%;

}
.nav__logo-img { height: 40px; width: auto; object-fit: contain;}
.nav__logo-text { font-family: var(--font-heading); font-size: var(--text-xl); color: var(--c-navy); }

/* Sur la home : logo blanc visible par défaut, logo WP caché */
.site-header--home .nav__logo-img--default { display: none; }

/* Quand scrolled sur la home : on bascule sur le logo WP */
.site-header--home.is-scrolled .nav__logo-img--white { display: none; }
.site-header--home.is-scrolled .nav__logo-img--default { display: block; }

/* Pill container */
.nav__links {
  display: flex;
  align-items: center;
  gap: 2rem;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 20px;
  padding: 6px 6px 6px 2rem;
  height: 100%;
}

/* Menu <ul> */
.nav__menu {
  display: flex;
  align-items: center;
  gap: 1rem;
  list-style: none;
}

/* Top-level items */
.nav__menu > li {
  position: relative;
  list-style: none;
}

.nav__menu > li > a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--c-navy);
  white-space: nowrap;
}

/* Chevron pour les items parents */
.nav__menu > .menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 10px;
  height: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%230E2D56' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  transition: transform 0.25s ease;
  flex-shrink: 0;
}

@media (min-width: 1401px) {
  .nav__menu > .menu-item-has-children:hover > a::after {
    transform: rotate(180deg);
  }
}

/* Bridge transparent entre l'item et le sous-menu — doit couvrir toute la
   distance jusqu'au sous-menu pour ne pas casser le hover */
.nav__menu > .menu-item-has-children::before {
  content: '';
  position: absolute;
  top: 100%;
  left: -0.5rem;
  right: -0.5rem;
  height: 1.5rem;
}

/* Sous-menu dropdown */
.nav__menu .sub-menu {
  display: none;
  position: absolute;
  top: calc(100% + 1.5rem);
  left: 50%;
  transform: translateX(-50%);
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: var(--r-md);
  padding: 0.5rem 0;
  min-width: 220px;
  list-style: none;
  box-shadow: 0 8px 32px rgba(14, 45, 86, 0.12);
  z-index: 200;
}

@media (min-width: 1401px) {
  .nav__menu > .menu-item-has-children:hover > .sub-menu {
    display: block;
  }
}

.nav__menu .sub-menu li { list-style: none; }

.nav__menu .sub-menu a {
  display: block;
  padding: 0.6rem 1.25rem;
  font-size: 1rem;
  font-weight: 500;
  color: var(--c-navy);
  letter-spacing: 0.5px;
  white-space: nowrap;
  transition: color 0.2s;
}

.nav__menu .sub-menu a:hover { color: var(--c-orange); }

/* CTA */
.nav__cta,
.nav__cta:link,
.nav__cta:visited {
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 1.75rem;
  background: var(--c-orange);
  border-radius: 15px;
  color: var(--c-white);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;
  transition: background 0.3s ease, color 0.3s ease;
}

.nav__cta:hover,
.nav__cta:focus,
.nav__cta:focus-visible,
.nav__cta:active {
  background: var(--c-navy);
  color: var(--c-white);
  outline: none;
  text-decoration: none;
}

/* Burger — base */
.nav__burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 48px;
  height: 48px;
  padding: 0;
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(14, 45, 86, 0.12);
  border-radius: 12px;
  outline: none;
  box-shadow: none;
  cursor: pointer;
  z-index: 101;
  position: relative;
  color: var(--c-blue);
}

/* Neutralise les états Elementor (rouge) — sans toucher au display ni aux dimensions */
.nav__burger:hover,
.nav__burger:focus,
.nav__burger:active,
.nav__burger:focus-visible {
  background: rgba(255, 255, 255, 0.55);
  border-color: rgba(14, 45, 86, 0.12);
  outline: none;
  box-shadow: none;
  color: var(--c-blue);
}

.nav__burger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--c-blue);
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.2s ease, background 0.3s ease;
  transform-origin: center;
}

.nav__burger:hover span,
.nav__burger:focus span,
.nav__burger:active span { background: var(--c-blue); }

.site-header--home .nav__burger span { background: var(--c-blue); }

/* État ouvert : transforme le burger en croix et l'ancre au top du viewport
   pour s'aligner avec le logo du mobile-header (sinon, sur la home le burger
   reste à 4.5rem du haut à cause du padding du header) */
.nav__burger[aria-expanded="true"] {
  position: fixed;
  top: 1.5rem;
  right: max(var(--section-px), 1rem);
  z-index: 101;
}
.nav__burger[aria-expanded="true"] span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.nav__burger[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav__burger[aria-expanded="true"] span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Mobile header (visible uniquement quand le menu est ouvert) */
.nav__mobile-header { display: none; }

.nav__mobile-logo { display: flex; align-items: center; height: 100%; }
.nav__mobile-logo img { height: 36px; width: auto; }

@media (max-width: 1150px) {
  .nav__burger { display: flex; }
  .nav__links {
    display: none;
    position: fixed;
    inset: 0;
    /* Override explicite du height: 100% hérité du desktop (qui se référait
       au .nav 60px et casse la hauteur fixed sur mobile) */
    width: 100vw;
    height: 100vh;
    height: 100svh;
    background: rgba(253, 248, 244, 0.96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 0;
    padding: 1rem var(--section-px) 2rem;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 1.5rem;
    z-index: 99;
    overflow-y: auto;
  }
  .nav__links.is-open {
    display: flex;
    animation: navOverlayIn 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  /* Apparition en cascade des éléments à l'ouverture */
  .nav__links.is-open .nav__mobile-header,
  .nav__links.is-open .nav__menu > li,
  .nav__links.is-open .nav__cta {
    animation: navItemIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .nav__links.is-open .nav__mobile-header { animation-delay: 0.08s; }
  .nav__links.is-open .nav__menu > li:nth-child(1) { animation-delay: 0.16s; }
  .nav__links.is-open .nav__menu > li:nth-child(2) { animation-delay: 0.22s; }
  .nav__links.is-open .nav__menu > li:nth-child(3) { animation-delay: 0.28s; }
  .nav__links.is-open .nav__menu > li:nth-child(4) { animation-delay: 0.34s; }
  .nav__links.is-open .nav__menu > li:nth-child(5) { animation-delay: 0.40s; }
  .nav__links.is-open .nav__menu > li:nth-child(n+6) { animation-delay: 0.46s; }
  .nav__links.is-open .nav__cta { animation-delay: 0.52s; }

  /* Fermeture : fondu de sortie (l'overlay reste affiché le temps de l'anim) */
  .nav__links.is-closing,
  .nav__links.is-closing.is-open {
    animation: navOverlayOut 0.32s cubic-bezier(0.4, 0, 1, 1) both;
  }
  .nav__links.is-closing .nav__mobile-header,
  .nav__links.is-closing .nav__menu > li,
  .nav__links.is-closing .nav__cta {
    animation: none;
  }

  .nav__mobile-header {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-height: 80px; /* aligne verticalement le logo avec le burger (48x48) */
    padding-right: 64px; /* laisse la place au burger fixe en haut-droite */
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(14, 45, 86, 0.1);
  }

  .nav__menu { flex-direction: column; align-items: center; gap: 1.25rem; width: 100%; margin-top: 1rem; }
  .nav__menu > li { width: 100%; text-align: center; }
  .nav__menu > li > a { font-size: .8rem; letter-spacing: 2px; justify-content: center; }
  .nav__menu > .menu-item-has-children::before { display: none; }

  /* CTA dans le menu mobile : aligné, pas étiré */
  .nav__cta {
    align-self: center;
    margin-top: 0.5rem;
    padding: 0 1.5rem;
    height: 46px;
    font-size: 0.8rem;
    letter-spacing: 2px;
  }
  /* Sous-menu mobile : on ne se base plus sur :hover (tactile) */
  .nav__menu .sub-menu {
    position: static;
    transform: none;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: none;
    padding: 0.5rem 0 0;
    margin-top: 0.75rem;
    min-width: 0;
    width: 100%;
  }
  .nav__menu > .menu-item-has-children.is-open > .sub-menu { display: block; }
  .nav__menu > .menu-item-has-children > a::after {
    transition: transform 0.25s ease;
  }
  .nav__menu > .menu-item-has-children.is-open > a::after { transform: rotate(180deg); }
  .nav__menu .sub-menu a { font-size: 0.9rem; padding: 0.5rem 1rem; }
  body.nav-open { overflow: hidden; }
}

/* Animations d'ouverture du menu mobile */
@keyframes navOverlayIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes navItemIn {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes navOverlayOut {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-12px); }
}

@media (prefers-reduced-motion: reduce) {
  .nav__links.is-open,
  .nav__links.is-open .nav__mobile-header,
  .nav__links.is-open .nav__menu > li,
  .nav__links.is-open .nav__cta {
    animation: none;
  }
}

/* ============================================================
   GLOBAL — FOOTER
   ============================================================ */

.site-footer {
  padding: 0 var(--section-px) 1.5rem;
}

.site-footer__card {
  position: relative;
  border: 1px solid var(--c-orange);
  border-radius: var(--r-xl);
  overflow: hidden;
  padding: 4rem 5rem 3rem;
  margin-bottom: 1.5rem;
}

.site-footer__card-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.site-footer__card-bg img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.site-footer__card-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(14, 45, 86, 0.14);
}

.site-footer__card-content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
  margin-bottom: 4rem;
}

.site-footer__left { display: flex; flex-direction: column; gap: 2rem; }

.site-footer__titre {
  font-size: clamp(2rem, 3.5vw, 3.4375rem);
  font-weight: 500;
  color: var(--c-white);
  letter-spacing: 1.65px;
  line-height: 1.2;
}

.site-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.site-footer__col-title {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 2.56px;
  text-transform: uppercase;
  color: var(--c-white);
  margin-bottom: 1rem;
}

.site-footer__col-links { display: flex; flex-direction: column; gap: 0.5rem; }
.site-footer__col-links a,
.site-footer__col-links li { font-size: 1rem; color: var(--c-white); line-height: 1.7; }

.site-footer__logo {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding-bottom: 1rem;
}

.site-footer__logo img {
  width: 50%;
}

.site-footer__logo-icon svg {
  height: 80px;
  width: auto;
  filter: brightness(0) invert(1);
}

.site-footer__logo-text {
  font-family: var(--font-body);
  font-size: clamp(2.5rem, 5vw, 5rem);
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--c-white);
  text-transform: uppercase;
}

.site-footer__bottom {
  display: flex;
  justify-content: space-between;
  font-size: var(--text-sm);
  color: var(--c-navy);
}

@media (max-width: 1024px) {
  .site-footer__card { padding: 3rem 2rem; }
  .site-footer__card-content { gap: 2.5rem; margin-bottom: 2.5rem; }
}

@media (max-width: 768px) {
  .site-footer__card { padding: 1.75rem 1rem; }
  .site-footer__card-content { grid-template-columns: 1fr; gap: 2rem; }
  .site-footer__nav { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .site-footer__logo img { width: 60%; max-width: 200px; }
  .site-footer__bottom { flex-direction: column; gap: 0.5rem; text-align: center; }
}

@media (max-width: 480px) {
  .site-footer__nav { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* ============================================================
   SECTION — HERO HOME
   ============================================================ */

.section-hero-home {
  position: relative;
  color: var(--c-white);
}

.section-hero-home__pin {
  position: relative;
  height: 100vh;       /* fallback navigateurs sans unités viewport dynamiques */
  /* lvh = viewport « large » (barre d'URL repliée). Le pin GSAP fige la hauteur
     mesurée au chargement : avec dvh (barre visible) la card plein écran
     s'arrêtait à la position de la barre avant son repli, laissant une bande
     vide en bas. On vise donc d'emblée la hauteur barre-repliée. */
  height: 100lvh;
  overflow: hidden;
}

/* La card visuelle — passe de "card avec marges" à "fullscreen" via GSAP */
.section-hero-home__card {
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
  right: 1.25rem;
  bottom: 1.25rem;
  border-radius: var(--r-xl);
  border: 1px solid var(--c-orange);
  overflow: hidden;
  will-change: top, left, right, bottom, border-radius;
}


.section-hero-home__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.section-hero-home__bg video,
.section-hero-home__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-hero-home__bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(14, 45, 86, 0.15) 0%, rgba(14, 45, 86, 0.45) 100%);
}

/* Hero content (visible au début, fade au scroll) */
.section-hero-home__hero-content {
  position: absolute;
  top: clamp(150px, 22vh, 320px);
  left: var(--section-px);
  right: var(--section-px);
  z-index: 80;
  max-width: 800px;
  will-change: opacity, transform;
}

.section-hero-home__titre {
  font-family: var(--font-heading);
  font-size: var(--text-hero);
  margin-bottom: 1.5rem;
  letter-spacing: 0.03em;
}

.section-hero-home__texte {
  font-size: var(--text-base);
  line-height: 1.7;
  margin-bottom: 2rem;
  max-width: 520px;
}

/* Compteur (apparaît une fois en plein écran) */
.section-hero-home__counter {
  position: absolute;
  bottom: 4rem;
  right: 2rem;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 999px;
  color: var(--c-white);
  font-size: 0.875rem;
  letter-spacing: 4px;
  font-weight: 500;
  opacity: 0;
  will-change: opacity;
}

.section-hero-home__counter-sep { opacity: 0.5; }

/* Barre de progression intro */
.section-hero-home__progress {
  position: absolute;
  bottom: 2rem;
  left: 2rem;
  right: 2rem;
  height: 2px;
  z-index: 3;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  overflow: hidden;
  opacity: 0;
  will-change: opacity;
}

.section-hero-home__progress-bar {
  height: 100%;
  width: 100%;
  background: var(--c-white);
  transform: scaleX(0);
  transform-origin: left center;
  will-change: transform;
}

@media (max-width: 768px) {
  .section-hero-home__counter { bottom: 3rem; right: 1rem; }
  .section-hero-home__progress { bottom: 1.5rem; left: 1rem; right: 1rem; }
}

/* Slides intro (cyclent au scroll après la transition) */
.section-hero-home__intro-slides {
  position: absolute;
  inset: 0;
  z-index: 2;
}

.section-hero-home__intro-slide {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  padding: 0 var(--section-px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.section-hero-home__intro-slide.is-active {
  opacity: 1;
  pointer-events: auto;
}

.section-hero-home__intro-text {
  max-width: 1100px;
  margin-left: auto;
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.2vw, 3rem);
  line-height: 1.25;
  font-weight: 400;
  color: var(--c-white);
}

.section-hero-home__intro-text p { margin: 0 0 1rem; }
.section-hero-home__intro-text p:last-child { margin: 0; }

.section-hero-home__intro-text .word {
  opacity: 0.2;
  transition: opacity 0.4s ease;
}

.section-hero-home__intro-text .word.is-revealed {
  opacity: 1;
}

/* Mise en page statique (reduced-motion / éco d'énergie iOS) :
   plus de pin/scrub, tout est empilé dans le flux normal pour éviter
   que le hero-content et les slides se superposent. */
.section-hero-home.is-static .section-hero-home__pin {
  height: auto;
  overflow: visible;
}

.section-hero-home.is-static .section-hero-home__card {
  position: relative;
  inset: auto;
  border: 0;
  border-radius: 0;
  will-change: auto;
}

.section-hero-home.is-static .section-hero-home__hero-content {
  position: relative;
  inset: auto;
  max-width: none;
  padding: clamp(130px, 20vh, 260px) var(--section-px) clamp(2.5rem, 8vh, 5rem);
  will-change: auto;
}

.section-hero-home.is-static .section-hero-home__intro-slides {
  position: relative;
  inset: auto;
}

.section-hero-home.is-static .section-hero-home__intro-slide {
  position: relative;
  inset: auto;
  opacity: 1;
  pointer-events: auto;
  padding: clamp(2.5rem, 8vh, 5rem) var(--section-px);
}

.section-hero-home.is-static .section-hero-home__counter,
.section-hero-home.is-static .section-hero-home__progress {
  display: none;
}

/* Fondu d'apparition (pur opacité, sans translation) pour le fallback
   animé léger en reduced-motion. La classe .avd-fade n'est posée que par le
   JS : sans JS, le contenu reste visible. L'état caché (:not(.is-shown))
   coupe la transition pour s'appliquer instantanément, puis le passage à
   .is-shown anime le retour à l'opacité pleine. */
.section-hero-home.is-static .avd-fade {
  opacity: 1;
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity;
}

.section-hero-home.is-static .avd-fade:not(.is-shown) {
  opacity: 0;
  transition: none;
}

@media (max-width: 768px) {
  .section-hero-home__counter { top: auto; bottom: 3.5rem; right: 1rem; padding: 0.4rem 1rem; font-size: 0.75rem; }
  .section-hero-home__intro-text { font-size: 1.25rem; }
}

/* ============================================================
   SECTION — DOMAINE
   ============================================================ */

.section-domaine {
  position: relative;
  padding: var(--section-py) var(--section-px);
  overflow: hidden;
}

.section-domaine__letter {
  position: absolute;
  top: 50%;
  right: -3rem;
  transform: translateY(-50%);
  width: clamp(220px, 45vw, 600px);
  pointer-events: none;
  z-index: 0;
  opacity: 0.08;
  line-height: 0;
}

.section-domaine__letter img {
  width: 100%;
  height: auto;
  display: block;
}

.section-domaine:has(.section-domaine__inner--reverse) .section-domaine__letter {
  right: auto;
  left: -3rem;
}

.section-domaine__inner,
.section-domaine .surtitre {
  position: relative;
  z-index: 1;
}

.section-domaine__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: 4rem;
  align-items: center;
  margin-top: 5em;
}

.section-domaine__inner--reverse { direction: rtl; }
.section-domaine__inner--reverse > * { direction: ltr; }

.section-domaine__image { border-radius: var(--r-xl); overflow: hidden; }
.section-domaine__image img {
  width: 100%;
  aspect-ratio: 4/4;
  object-fit: cover;
  border: 1px solid var(--c-orange);
  border-radius: var(--r-xl);
}

.section-domaine__content { display: flex; flex-direction: column; gap: 1.5rem; }

.section-domaine__titre {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  color: var(--c-navy);
}

.section-domaine__desc {
  column-count: 2;
  column-gap: 1.5rem;
  font-size: var(--text-sm);
  color: var(--c-grey);
  line-height: 1.8;
}

@media (max-width: 1024px) {
  .section-domaine__inner { grid-template-columns: 1fr; gap: 2rem; margin-top: 2.5rem; }
  .section-domaine__inner--reverse { direction: ltr; }
  .section-domaine__desc { column-count: 1; }
}

@media (max-width: 1024px) {
  .section-domaine__letter,
  .service-item__letter { display: none; }
}

/* ============================================================
   SECTION — TEXTE DÉFILANT
   ============================================================ */

.section-texte-defilant {
  overflow: hidden;
  padding-block: 0.75rem;
  white-space: nowrap;
  user-select: none;
}

.section-texte-defilant__track {
  display: inline-flex;
  align-items: center;
  animation: marquee 22s linear infinite;
}

.section-texte-defilant__item {
  font-family: var(--font-heading);
  font-size: clamp(56px, 6vw, 95px);
  color: var(--c-navy);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  flex-shrink: 0;
  line-height: 1;
}

.section-texte-defilant__sep {
  font-family: var(--font-heading);
  font-size: clamp(56px, 6vw, 95px);
  color: var(--c-orange);
  padding-inline: 1.5rem;
  line-height: 1;
  flex-shrink: 0;
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ============================================================
   SECTION — DOMAINES SECONDAIRES (Swiper)
   ============================================================ */

.section-domaines-sec {
  padding: var(--section-py) var(--section-px);
}

.section-domaines-sec__card {
  max-width: var(--container-max);
  margin-inline: auto;
  background: #fff9f5;
  border: 1px solid var(--c-orange);
  border-radius: var(--r-lg);
  padding: 3rem 3.5rem 3.5rem;
}

.section-domaines-sec__header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
  margin-bottom: 2.5rem;
}

.section-domaines-sec__left { display: flex; flex-direction: column; gap: 1.5rem; }

.section-domaines-sec__titre {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  color: var(--c-navy);
  letter-spacing: 0.03em;
}

.section-domaines-sec__texte {
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.7;
}

.section-domaines-sec__nav {
  display: flex;
  gap: 0.75rem;
}

.domaines-sec-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 49px;
  height: 50px;
  background: var(--c-blue);
  border: none;
  border-radius: var(--r-md);
  cursor: pointer;
  color: var(--c-white);
  flex-shrink: 0;
}

.domaines-sec-btn svg { width: 18px; height: 18px; }
.domaines-sec-btn.swiper-button-disabled { opacity: 0.4; cursor: default; }
/* Navigation masquée quand tous les slides tiennent à l'écran (watchOverflow) */
.domaines-sec-btn--lock { display: none; }

.domaines-sec-btn:hover, .domaines-sec-btn:focus {
  background-color: var(--c-orange);
}

.domaine-card {
  display: block;
  border-radius: var(--r-xl);
  overflow: hidden;
  position: relative;
  aspect-ratio: 1 / 1;
  border: 1px solid var(--c-orange);
  text-decoration: none;
  color: inherit;
}

a.domaine-card { cursor: pointer; }

.domaine-card__image { position: absolute; inset: 0; overflow: hidden; }
.domaine-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  transform: scale(1);
  will-change: transform;
}

/* Parallax mouse-tracking + zoom au survol */
.domaine-card:hover .domaine-card__image img {
  transform: translate(calc(var(--mx, 0) * -12px), calc(var(--my, 0) * -12px)) scale(1.12);
  transition: transform 0.25s ease-out;
}

.domaine-card__label {
  position: absolute;
  bottom: 7%;
  left: 3%;
  right: 3%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.25rem 1.5rem;
  background: rgba(14, 45, 86, 0.68);
  border: 1px solid var(--c-orange);
  border-radius: var(--r-xl);
  color: var(--c-white);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  align-items: center;
}

.domaine-card__texte {
  display: block;
  font-size: var(--text-sm);
  font-weight: 400;
  color: var(--c-white);
  line-height: 1.6;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transform: translateY(8px);
  transition:
    opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    max-height 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}

.domaine-card:hover .domaine-card__texte {
  opacity: 1;
  max-height: 6rem;
  transform: translateY(0);
}

.swiper-domaines-sec {
  -webkit-mask-image: linear-gradient(to right, black 88%, transparent 100%);
  mask-image: linear-gradient(to right, black 88%, transparent 100%);
}

.swiper-domaines-sec .swiper-wrapper { align-items: stretch; }

@media (max-width: 1024px) {
  .section-domaines-sec__card { padding: 2rem 1.5rem; }
}

@media (max-width: 768px) {
  .section-domaines-sec__header { grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 1.5rem; }
  .section-domaines-sec__card { padding: 1.25rem 0.875rem; }
  .domaine-card { aspect-ratio: 3 / 4; }
  .domaine-card__label { font-size: 1rem; padding: 0.875rem 1rem; bottom: 4%; left: 4%; right: 4%; }
  /* Une seule slide par vue, plein largeur, pas de fade à droite */
  .swiper-domaines-sec { -webkit-mask-image: none; mask-image: none; }
  /* Sort le nav du flux interne de __left pour le placer juste avant le carrousel */
  .section-domaines-sec__left { display: contents; }
  .section-domaines-sec__titre { order: 1; }
  .section-domaines-sec__texte { order: 2; }
  .section-domaines-sec__nav { order: 3; justify-content: flex-start; }
}

/* ============================================================
   SECTION — CITATION
   ============================================================ */

.section-citation {
  position: relative;
  min-height: clamp(500px, 56vw, 1079px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-align: center;
  padding: var(--section-py) var(--section-px);
}

.section-citation__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  background: linear-gradient(
    135deg,
    rgba(245, 244, 241, 1) 0%,
    rgba(255, 255, 255, 0.74) 50%,
    rgba(245, 244, 241, 1) 100%
  );
}
.section-citation__bg video,
.section-citation__bg img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: -1; }

.section-citation__bg-opacity {
  background: linear-gradient(     
    180deg,      
    rgba(253, 248, 244, 1) 0%,      
    rgba(255, 255, 255, 0.74) 50%,      
    rgba(253, 248, 244, 1) 100%
    );
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}

.section-citation__texte {
  position: relative;
  z-index: 1;
  font-family: var(--font-heading);
  font-size: clamp(2rem, 4.5vw, 70px);
  font-weight: 700;
  font-style: normal;
  color: var(--c-navy);
  max-width: min(1262px, 90%);
  margin-inline: auto;
  line-height: 1.2;
  letter-spacing: 0.03em;
}

.section-citation__source {
  position: relative;
  z-index: 1;
  display: block;
  max-width: min(1262px, 90%);
  margin: 1.5rem auto 0;
  font-family: var(--font-body, inherit);
  font-size: clamp(1rem, 1.4vw, 1.125rem);
  font-style: normal;
  font-weight: 500;
  color: var(--c-navy);
  opacity: 0.7;
}

.section-citation__source::before {
  content: "— ";
}

/* ============================================================
   SECTION — FAQ
   ============================================================ */

.section-faq {
  padding: var(--section-py) var(--section-px);
}

.section-faq__inner {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 5rem;
  align-items: start;
}

.section-faq__sidebar { position: sticky; top: 120px; }

.section-faq__titre {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  color: var(--c-navy);
  margin-block: 1rem;
}

.section-faq__texte { font-size: var(--text-base); color: var(--c-navy); line-height: 1.7; }

/* ============================================================
   SECTION — PAGE LÉGALE (prose)
   ============================================================ */

.section-legale {
  padding: var(--section-py) var(--section-px);
}

.section-legale__inner {
  max-width: var(--container-max);
  margin-inline: auto;
}

.section-legale__content {
  max-width: 820px;
  margin-inline: auto;
  color: var(--c-navy);
  font-size: var(--text-base);
  line-height: 1.8;
}

.section-legale__content > :first-child { margin-top: 0; }
.section-legale__content > :last-child { margin-bottom: 0; }

.section-legale__content h2,
.section-legale__content h3 {
  font-family: var(--font-heading);
  color: var(--c-navy);
  line-height: 1.3;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}
.section-legale__content h2 { font-size: var(--text-2xl); }
.section-legale__content h3 { font-size: var(--text-xl); }

.section-legale__content p { margin-bottom: 1.25rem; }

.section-legale__content ul,
.section-legale__content ol {
  margin: 0 0 1.25rem 1.25rem;
  padding-left: 1rem;
}
.section-legale__content li { margin-bottom: 0.5rem; }

.section-legale__content a {
  color: var(--c-orange);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.section-legale__content a:hover { color: var(--c-blue); }

.faq__item { 
  border-bottom: 1px solid var(--c-border); 
  padding-right: 1em;
  padding-left: 1em;
}
.faq__item:first-child { border-top: 1px solid var(--c-border); }

.faq__btn {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  padding: 1.5rem 0;
  cursor: pointer;
  font-family: var(--font-heading);
  font-size: clamp(1rem, 1.5vw, 1.5rem);
  font-weight: 400;
  color: var(--c-navy);
  gap: 1.5rem;
}

.faq__btn > span:first-child {
  flex: 1;
  min-width: 0;
}

.faq__icon {
  flex-shrink: 0;
  width: 46px;
  height: 46px;
  border-radius: var(--r-md);
  background: #f5d0b9;
  position: relative;
}

.faq__icon::before,
.faq__icon::after {
  content: '';
  position: absolute;
  background: var(--c-orange);
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.25s;
}

.faq__icon::before { width: 14px; height: 2px; }
.faq__icon::after  { width: 2px; height: 14px; }

.faq__btn[aria-expanded="true"] .faq__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.faq__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}

.faq__answer-inner {
  padding-bottom: 1.5rem;
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.8;
}

@media (max-width: 768px) {
  .section-faq__inner { grid-template-columns: 1fr; gap: 2rem; }
  .section-faq__sidebar { position: static; }
  .faq__item { padding-inline: 0; }
  .faq__btn { padding: 1.25rem 0; gap: 1rem; }
  .faq__icon { width: 38px; height: 38px; }
  .faq__icon::before { width: 12px; }
  .faq__icon::after  { height: 12px; }
}

/* ============================================================
   SECTION — HERO ARCHIVE
   ============================================================ */

.section-hero-archive {
  padding: calc(var(--section-py) + 80px) var(--section-px) var(--section-py);
}

/* Cas Page Contact */

.page-template-template-contact .section-hero-archive { 
padding: calc(var(--section-py) + 80px) var(--section-px) 0px;
}

.section-hero-archive__inner {
  max-width: var(--container-max);
  margin-inline: auto;
}

.section-hero-archive__top {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 70%;
  margin-bottom: 3rem;
}

.section-hero-archive__titre {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 5vw, 4.375rem);
  color: var(--c-navy);
  letter-spacing: 2.1px;
}

.section-hero-archive__meta {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: flex-start;
}

.section-hero-archive__description {
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.7;
}

.section-hero-archive__sep {
  border: none;
  border-top: 1px solid var(--c-border);
  margin-bottom: 3rem;
}

.section-hero-archive__intro {
  position: relative;
  min-height: 450px;
  border: 1px solid var(--c-orange);
  border-radius: var(--r-xl);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.section-hero-archive__intro-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.section-hero-archive__intro-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-hero-archive__intro-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(14, 45, 86, 0.3);
  pointer-events: none;
}

.section-hero-archive__intro-content {
  width: 65%;
  padding: 4rem 4rem 4rem 3rem;
  position: relative;
  z-index: 1;
}

.section-hero-archive__intro-titre {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  color: var(--c-white);
  margin-bottom: 1.5rem;
}

.section-hero-archive__intro-texte {
  font-size: var(--text-base);
  color: var(--c-white);
  line-height: 1.7;
}

@media (max-width: 1024px) {
  .section-hero-archive__top { max-width: 100%; }
  .section-hero-archive__intro { min-height: auto; }
  .section-hero-archive__intro-content { width: 100%; padding: 2.5rem 2rem; }
}

@media (max-width: 768px) {
  .section-hero-archive { padding: calc(var(--section-py) + 60px) var(--section-px) var(--section-py); }
  .section-hero-archive__top { margin-bottom: 2rem; gap: 1rem; }
  .section-hero-archive__sep { margin-bottom: 2rem; }
  .section-hero-archive__intro-content { padding: 1.75rem 1rem; }
}

/* ============================================================
   SECTION — LISTE SERVICE
   ============================================================ */

.section-liste-service {
  padding: 0 var(--section-px) var(--section-py) var(--section-px);
}

.section-liste-service__inner { max-width: var(--container-max); margin-inline: auto; }

.section-liste-service__header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
  margin-bottom: 2rem;
}

.section-liste-service__header-left { display: flex; align-items: flex-start; flex-direction: column; gap: 1rem; }

.section-liste-service__titre {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  color: var(--c-navy);
  letter-spacing: -0.4px;
}

.section-liste-service__intro {
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.7;
  padding-top: 4.5rem;
}

/* Service item */

.service-item {
  border-top: 1px solid var(--c-border);
}

.service-item__titre { min-width: 0; }

.service-item:last-child { border-bottom: 1px solid var(--c-border); }

.service-item__top {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 2rem;
  align-items: center;
  padding: 4em 2em;
  cursor: pointer;
}

.service-item.is-open .service-item__top {
  background: #f0eeed;
}

.service-item__numero {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: clamp(3rem, 4.5vw, 3.5rem);
  color: var(--c-orange);
  letter-spacing: -0.7px;
  line-height: 1;
  min-width: 3.5rem;
}

.service-item__titre {
  font-size: clamp(1.5rem, 2.5vw, 1.8rem);
  color: var(--c-navy);
  letter-spacing: -0.4px;
  font-weight: 400;
}

.service-item__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 54px;
  height: 54px;
  background: #b0cdf3;
  border: none;
  border-radius: 10px;
  cursor: pointer;
}

.service-item__toggle-icon {
  display: block;
  width: 16px;
  height: 2px;
  background: var(--c-navy);
  position: relative;
  transition: transform 0.3s;
}

.service-item__toggle-icon::after {
  content: '';
  position: absolute;
  top: -7px;
  left: 7px;
  width: 2px;
  height: 16px;
  background: var(--c-navy);
  transition: transform 0.3s;
}

.service-item.is-open .service-item__toggle-icon::after {
  transform: rotate(90deg);
}

.service-item__toggle:focus, .service-item__toggle:hover {
  background-color: var(--c-orange);
}

/* Expanded body */

.service-item__body {
  display: none;
  position: relative;
  /* overflow: hidden; */
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  padding: 2rem 2rem 3rem;
  background: #f0eeed;
}

.service-item__body-left,
.service-item__body-right { position: relative; z-index: 1; }

.service-item.is-open .service-item__body { display: grid; }

.service-item__body-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.5rem;
}

.service-item__sous-titre {
  font-size: clamp(1.25rem, 2vw, 2.1875rem);
  color: var(--c-navy);
  font-weight: 400;
  letter-spacing: -0.35px;
}

.service-item__description {
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.7;
  font-weight: 300;
}

.service-item__body-right {
  position: relative;
  align-self: stretch;
  min-height: 600px;
  padding-left: 100px;
}

.service-item__image {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-radius: var(--r-xl);
  border: 1px solid var(--c-orange);
  width: 100%;
  height: 100%;
}

.service-item__body-right > .service-item__arguments {
  z-index: 3;
}

.service-item__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Lettre A — positionnée sur le panneau .service-item__body, sous l'image
   (z-index 0) et clippée par overflow:hidden du parent pour ne pas sortir
   du panneau. Sa taille déborde de l'image, peek visible côté gauche
   (dans la zone texte) et un peu au-dessus/en dessous. */
.service-item__letter {
  position: absolute;
  right: 0;
  bottom: 0;
  /* transform: translateY(-50%); */
  width: 40%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.18;
  line-height: 0;
}

.service-item__letter img {
  width: 100%;
  height: auto;
  display: block;
}


.service-item__arguments {
    position: absolute;
    inset-inline: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    padding-inline: 1.5rem;
    height: 100%;
    justify-content: space-evenly;
}

.service-item__arguments li {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  background: rgba(14, 45, 86, 0.71);
  border-radius: var(--r-lg);
  color: var(--c-white);
  font-size: var(--text-base);
  line-height: 1.4;
}

.service-item__arguments li::before {
  content: '';
  display: block;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 20px no-repeat;
}

@media (max-width: 1024px) {
  .service-item__body-right { padding-left: 0; min-height: 480px; }
}

@media (max-width: 768px) {
  .section-liste-service__header { grid-template-columns: 1fr; gap: 1.5rem; }
  /* Numéro sur sa propre ligne au-dessus, titre + toggle alignés en dessous */
  .service-item__top {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "num num"
      "titre toggle";
    gap: 0.5rem 1rem;
    padding: 1rem;
  }
  .service-item__numero { grid-area: num; min-width: auto; }
  .service-item__titre  { grid-area: titre; align-self: center; }
  .service-item__toggle { grid-area: toggle; align-self: center; }
  .service-item.is-open .service-item__body { grid-template-columns: 1fr; padding: 1.25rem 0 1.75rem; gap: 1.5rem; }
  .section-liste-service__intro { padding-top: 0; }
  .service-item__body-right { padding-left: 0; min-height: 360px; }
  .service-item__arguments { padding-inline: 0.5rem; }
  .service-item__arguments li { padding: 0.625rem 0.875rem; font-size: 0.875rem; gap: 0.625rem; }
  .service-item__arguments li::before { width: 32px; height: 32px; background-size: 16px; }
  .service-item__letter { width: 110%; }
}

@media (max-width: 480px) {
  .service-item__top { padding: 1rem; gap: 0.5rem 0.75rem; }
  .service-item__toggle { width: 44px; height: 44px; padding: 0px!important; }
  .service-item.is-open .service-item__body { padding: 1rem;}
}

/* ============================================================
   SECTION — GRID ITEMS
   ============================================================ */

.section-grid-items {
  padding: var(--section-py) var(--section-px);
  background: #f5d0b9;
}

.section-grid-items__inner { max-width: var(--container-max); margin-inline: auto; }

.section-grid-items__header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
  margin-bottom: 3rem;
}

.section-grid-items__header-left { display: flex; flex-direction: column; gap: 1rem; }

.section-grid-items__titre {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  color: var(--c-navy);
  letter-spacing: -0.4px;
}

.section-grid-items__texte {
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.7;
  padding-top: 4.5rem;
}

.section-grid-items__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

/* Grid card (text-only bordered card) */

.grid-card {
  border: 1px solid var(--c-blue);
  border-radius: var(--r-xl);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 200px;
}

.grid-card__image { border-radius: var(--r-lg); overflow: hidden; margin-bottom: 0.5rem; }
.grid-card__image img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }

.grid-card__description {
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.6;
}

.grid-card__titre {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--c-navy);
}

@media (max-width: 1024px) { .section-grid-items__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
  .section-grid-items__header { grid-template-columns: 1fr; }
  .section-grid-items__grid { grid-template-columns: 1fr; }
  .section-grid-items__texte { padding-top: 0; }
}

/* ============================================================
   SECTION — PROCESSUS
   ============================================================ */

.section-processus {
  padding: var(--section-py) var(--section-px);
  background: var(--c-navy);
  color: var(--c-white);
  position: relative;
}

.section-processus__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  gap: 5rem;
  align-items: start;
}

.section-processus__sidebar {
  position: sticky;
  top: 120px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.section-processus__titre {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  color: var(--c-white);
}

.section-processus__description {
  font-size: var(--text-base);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.8;
}

/* Right column : line + list */

.section-processus__right {
  position: relative;
  padding-left: 3rem;
}

.processus__line {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
}

.processus__line-track {
  position: absolute;
  inset: 0;
  /* background: rgba(255, 255, 255, 0.15); */
}

.processus__line-progress {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  background: var(--c-orange);
  transform: scaleY(0);
  transform-origin: top;
}

.processus__line-dot {
  position: absolute;
  left: 50%;
  top: 0%;
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  background: var(--c-orange);
  border-radius: 2px;
  z-index: 1;
}

.section-processus__list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.processus-item {
  padding: 2.5rem;
  border: 1px solid var(--c-orange);
  border-radius: var(--r-xl);
  opacity: 0;
  transform: translateY(30px);
}

.processus-item__content { display: flex; flex-direction: column; gap: 0.75rem; }

.processus-item__titre {
  font-size: clamp(1.5rem, 2.5vw, 2.5rem);
  color: var(--c-white);
  font-weight: 400;
}

.processus-item__description {
  font-size: var(--text-base);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.8;
}

@media (max-width: 768px) {
  .section-processus__inner { grid-template-columns: 1fr; gap: 2rem; }
  .section-processus__sidebar { padding-bottom: 2rem; position: static; border-bottom: 1px solid rgba(255,255,255,0.15); }
  .section-processus__right { padding-left: 1.75rem; }
  .processus-item { opacity: 1; transform: none; padding: 1.5rem 1.25rem; }
}

/* ============================================================
   SECTION — AVOCATE
   ============================================================ */

.section-avocate {
  padding: var(--section-py) var(--section-px);
}

/* Page À propos : rapproche le hero de la section avocate */
.page-template-template-a-propos .section-hero-archive { padding-bottom: calc(var(--section-py) / 3); }
.page-template-template-a-propos .section-avocate { padding-top: calc(var(--section-py) / 3); }

.section-avocate__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 5rem;
  align-items: start;
}

.section-avocate__photo {
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--c-orange);
  position: sticky;
  top: 2rem;
}

.section-avocate__photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/4;
  object-fit: cover;
  display: block;
}

.section-avocate__content {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.section-avocate__titre {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  color: var(--c-navy);
  letter-spacing: -0.4px;
}

.section-avocate__desc {
  columns: 2;
  column-gap: 2rem;
  font-size: var(--text-base);
  color: var(--c-navy);
  line-height: 1.8;
}

.section-avocate__arguments {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.avocate-arg {
  padding: 2rem 1.5rem;
  background: var(--c-white);
  border: 1px solid var(--c-navy);
  border-radius: var(--r-xl);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.avocate-arg__chiffre {
  font-family: var(--font-heading);
  font-size: 2.5rem;
  color: var(--c-orange);
  line-height: 1;
}

.avocate-arg__label {
  font-size: 1.5rem;
  color: var(--c-navy);
  font-weight: 400;
}

@media (max-width: 1024px) {
  .section-avocate__inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .section-avocate__photo { max-width: 420px; position: static; }
  .section-avocate__desc { columns: 1; }
}

@media (max-width: 640px) {
  .section-avocate__arguments { grid-template-columns: 1fr; }
  .avocate-arg { padding: 1.5rem 1rem; }
  .avocate-arg__chiffre { font-size: 2rem; }
  .avocate-arg__label { font-size: 1.15rem; }
}

/* ============================================================
   SECTION — LISTE ARTICLES
   ============================================================ */

.section-liste-articles {
  padding: var(--section-py) var(--section-px);
}

/* Page blog : rapproche le hero de la liste d'articles */
.blog .section-hero-archive { padding-bottom: calc(var(--section-py) / 3); }
.blog .section-liste-articles { padding-top: calc(var(--section-py) / 3); }

.section-liste-articles__header { margin-bottom: 3rem; }

.section-liste-articles__titre {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  color: var(--c-navy);
  margin-top: 1rem;
  letter-spacing: -0.4px;
}

.section-liste-articles__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.card-article {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
  padding: 2rem;
  border: 1px solid var(--c-orange);
  border-radius: var(--r-xl);
  background: transparent;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.card-article:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(14, 45, 86, 0.08);
}

.card-article__titre {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--c-navy);
  line-height: 1.35;
}

.card-article__titre a {
  color: inherit;
  text-decoration: none;
}

.card-article__lien {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  margin-top: auto;
  padding: 0.875rem 1.5rem;
  background: var(--c-orange);
  border-radius: 999px;
  color: var(--c-cream);
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.35s ease, transform 0.35s ease;
}

.card-article__lien:hover {
  background: var(--c-navy);
  transform: translateX(2px);
  color: var(--c-cream);
}

.card-article__lien svg {
  flex-shrink: 0;
}

.section-liste-articles__inner { max-width: var(--container-max); margin-inline: auto; }

@media (max-width: 1024px) { .section-liste-articles__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .section-liste-articles__grid { grid-template-columns: 1fr; } }

/* ============================================================
   ARTICLE — LAYOUT
   ============================================================ */

.section-hero-article {
  padding-top: calc(var(--section-py) + 80px);
}

.avd-breadcrumb {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--c-navy);
  opacity: 0.7;
  letter-spacing: 0.5px;
}

.avd-breadcrumb a {
  color: inherit;
  text-decoration: none;
  transition: color 0.25s ease;
}

.avd-breadcrumb a:hover {
  color: var(--c-orange);
  opacity: 1;
}

.avd-breadcrumb .breadcrumb_last,
.avd-breadcrumb .breadcrumb-current {
  color: var(--c-orange);
  font-weight: 600;
}

.section-hero-article__inner {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding-inline: var(--section-px);
}

.section-hero-article__titre {
  font-family: var(--font-heading);
  font-size: var(--text-hero);
  font-weight: 500;
  color: var(--c-navy);
  line-height: 1.15;
  letter-spacing: -0.5px;
  max-width: 900px;
}

.section-hero-article__author {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
}

.section-hero-article__author-mark {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: var(--c-blue);
  border-radius: 3px;
  flex-shrink: 0;
}

.section-hero-article__author-photo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.section-hero-article__author-name {
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--c-navy);
}

.section-hero-article__sep {
  border: none;
  border-top: 1px solid var(--c-border);
  margin: 1rem 0 0;
}

.article-layout {
  display: grid;
  grid-template-columns: 1fr 500px;
  gap: 4rem;
  padding-block: var(--section-py);
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--section-px);
}

.article-content {
  font-size: var(--text-base);
  line-height: 1.8;
  color: var(--c-black);
}

.article-content h2 { font-family: var(--font-heading); font-size: var(--text-3xl); color: var(--c-navy); margin-block: 2rem 1rem; }
.article-content h3 { font-family: var(--font-heading); font-size: var(--text-2xl); color: var(--c-navy); margin-block: 1.5rem 0.75rem; }
.article-content p  { margin-bottom: 1.25rem; }

/* Sommaire — dépliable */

.section-sommaire {
  padding: 1.5rem 1.75rem;
  background: var(--c-white);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  margin-bottom: 2rem;
}

.section-sommaire__toggle,
.section-sommaire__toggle:hover,
.section-sommaire__toggle:focus,
.section-sommaire__toggle:active,
.section-sommaire__toggle:focus-visible {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0;
  background: none;
  border: none;
  outline: none;
  box-shadow: none;
  cursor: pointer;
  color: var(--c-navy);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
}

.section-sommaire__toggle:hover,
.section-sommaire__toggle:focus,
.section-sommaire__toggle:active {
  color: var(--c-orange);
}

.section-sommaire__label {
  letter-spacing: 0.5px;
}

.section-sommaire__chevron {
  display: inline-flex;
  transition: transform 0.3s ease;
}

.section-sommaire__toggle[aria-expanded="false"] .section-sommaire__chevron {
  transform: rotate(-90deg);
}

.section-sommaire:has(.section-sommaire__toggle[aria-expanded="false"]) .section-sommaire__list {
  max-height: 0;
  opacity: 0;
  margin-top: 0;
}

.section-sommaire__list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  counter-reset: avd-sommaire;
  transition: max-height 0.35s ease, margin-top 0.35s ease, opacity 0.25s ease;
}

.section-sommaire__list:not([hidden]) {
  margin-top: 1.25rem;
}

.section-sommaire__item {
  counter-increment: avd-sommaire;
  padding-left: 0;
}

.section-sommaire__link {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  font-size: 0.95rem;
  color: var(--c-navy);
  text-decoration: none;
  transition: color 0.25s ease;
}

.section-sommaire__link::before {
  content: counter(avd-sommaire, decimal-leading-zero) '.';
  color: var(--c-orange);
  font-weight: 700;
  font-size: 0.9em;
  letter-spacing: 1px;
  flex-shrink: 0;
}

.section-sommaire__link:hover { color: var(--c-orange); }

.section-sommaire__link.is-active {
  color: var(--c-orange);
}

/* Sidebar contact */

.section-sidebar-contact {
  position: sticky;
  top: 120px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 2rem;
  background: var(--c-navy);
  border-radius: var(--r-xl);
  color: var(--c-cream);
}

.section-sidebar-contact__texte {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--c-cream);
  font-weight: 500;
}

@media (max-width: 1024px) {
  .article-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .section-sidebar-contact { position: static; max-width: 600px; }
}

@media (max-width: 768px) {
  .section-hero-article { padding-top: calc(var(--section-py) + 60px); }
  .article-layout { padding-block: calc(var(--section-py) - 1rem); }
  .article-content h2 { margin-block: 1.5rem 0.75rem; }
  .section-sommaire { padding: 1rem 1.25rem; }
  .section-sidebar-contact { padding: 1.5rem; }
}

/* ============================================================
   PAGE — CONTACT
   ============================================================ */

.section-contact {
  padding: 0 var(--section-px) var(--section-py);
}

.section-contact__inner {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 3rem;
  align-items: start;
  max-width: var(--container-max);
  margin-inline: auto;
}

.section-contact__form {
  background: var(--c-white);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  padding: 2.5rem;
}

.section-contact__sidebar {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 2.5rem 2rem;
  background: var(--c-navy);
  border-radius: var(--r-xl);
  color: var(--c-cream);
  position: sticky;
  top: 120px;
}

.section-contact__block { display: flex; flex-direction: column; gap: 0.35rem; }

.section-contact__label {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--c-orange);
}

.section-contact__value {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 400;
  color: var(--c-cream);
  text-decoration: none;
  line-height: 1.4;
  word-break: break-word;
  transition: color 0.25s ease;
}

a.section-contact__value:hover { color: var(--c-orange); }

.section-contact__value--address {
  font-style: normal;
  font-size: 1rem;
  font-family: var(--font-body);
  line-height: 1.6;
}

@media (max-width: 1024px) {
  .section-contact__inner { grid-template-columns: 1fr; }
  .section-contact__sidebar { position: static; }
}

@media (max-width: 768px) {
  .section-contact__form { padding: 1.5rem 1rem; }
  .section-contact__sidebar { padding: 2rem 1.25rem; gap: 1.5rem; }
}

/* ============================================================
   ANIMATION — SCROLL REVEAL & MICRO-INTERACTIONS
   ============================================================ */

/* Transition uniquement active sur le chemin de retour vers l'état révélé.
   À l'application initiale de la classe avd-reveal (par JS), `transition:
   none` dans :not(.is-revealed) empêche le navigateur d'animer le passage
   "visible → caché" — l'état caché est appliqué instantanément. Puis,
   quand is-revealed est ajouté, la règle :not disparaît, la transition
   du parent s'applique et le retour à l'état naturel s'anime. */
.avd-reveal {
  transition:
    opacity      1s cubic-bezier(0.16, 1, 0.3, 1),
    transform    1s cubic-bezier(0.16, 1, 0.3, 1),
    filter       1s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.avd-reveal:not(.is-revealed) {
  opacity: 0;
  transform: translateY(48px);
  transition: none;
}

/* Stagger : 110ms par index pour une cascade visible */
.avd-reveal--stagger {
  transition-delay: calc( var(--reveal-i, 0) * 110ms );
}

/* ── Variantes initiales par contexte ──────────────────────────────────── */

/* Images / photos : reveal avec scale-up + flou + montée.
   On évite clip-path (capricieux selon les navigateurs et les contextes
   d'overflow:hidden imbriqués). */
.section-domaine__image.avd-reveal:not(.is-revealed),
.section-avocate__photo.avd-reveal:not(.is-revealed),
.section-hero-archive__intro.avd-reveal:not(.is-revealed) {
  transform: translateY(40px) scale(0.92);
  filter: blur(6px);
}

/* Titre hero archive : montée plus marquée */
.section-hero-archive__top.avd-reveal:not(.is-revealed) {
  transform: translateY(56px);
}

/* Citation : zoom-in + flou */
.section-citation__texte.avd-reveal:not(.is-revealed) {
  transform: translateY(28px) scale(0.94);
  filter: blur(4px);
}

/* Source : montée simple, légèrement décalée après le texte */
.section-citation__source.avd-reveal { transition-delay: 0.18s; }
.section-citation__source.avd-reveal:not(.is-revealed) {
  transform: translateY(16px);
}

/* Cartes : montée + léger scale */
.service-item.avd-reveal:not(.is-revealed),
.faq__item.avd-reveal:not(.is-revealed),
.grid-card.avd-reveal:not(.is-revealed),
.card-article.avd-reveal:not(.is-revealed),
.avocate-arg.avd-reveal:not(.is-revealed) {
  transform: translateY(56px) scale(0.96);
}

/* Sidebar contact : glisse depuis la droite */
.section-contact__sidebar.avd-reveal:not(.is-revealed) {
  transform: translateX(56px);
}

/* Form contact : glisse depuis la gauche */
.section-contact__form.avd-reveal:not(.is-revealed) {
  transform: translateX(-32px);
}

/* Reduced motion — neutralise tout */
@media (prefers-reduced-motion: reduce) {
  .avd-reveal,
  .avd-reveal:not(.is-revealed) {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    filter: none !important;
    transition: none !important;
  }
}

/* ── Micro-interactions ───────────────────────────────────────────────── */

/* ─── SERVICE ITEM ────
   Hover (fermé) : la zone se teinte, le numéro grandit et glisse à droite,
   le titre suit, le toggle prend du volume. Un trait orange apparaît à
   gauche comme indicateur d'item actif. */
.service-item__top {
  position: relative;
  transition: background 0.4s ease, padding-left 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.service-item__top::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 3px;
  height: 0;
  background: var(--c-orange);
  border-radius: 2px;
  transition: height 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
}
.service-item:not(.is-open) .service-item__top:hover {
  background: rgba(176, 205, 243, 0.2);
}
.service-item:not(.is-open) .service-item__top:hover::before {
  height: 60%;
}

.service-item__numero {
  display: inline-block;
  transition:
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    color 0.4s ease,
    letter-spacing 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.service-item__top:hover .service-item__numero {
  transform: scale(1.12) translateX(4px);
  letter-spacing: -2px;
}

.service-item__titre {
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1), color 0.3s ease;
}
.service-item__top:hover .service-item__titre {
  transform: translateX(8px);
  color: var(--c-orange);
}

.service-item__toggle {
  transition:
    transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
    background 0.3s ease,
    box-shadow 0.4s ease;
}
.service-item__top:hover .service-item__toggle {
  transform: scale(1.1) rotate(90deg);
  background: var(--c-orange);
  box-shadow: 0 8px 20px rgba(255, 145, 77, 0.35);
}
.service-item__top:hover .service-item__toggle-icon,
.service-item__top:hover .service-item__toggle-icon::after {
  background: var(--c-white);
}

/* ─── FAQ ────
   L'item entier se déplace légèrement, le titre se colore, l'icône fait
   un demi-tour avec pop d'ombre orange. */
.faq__item {
  transition: padding-left 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.faq__btn {
  transition: color 0.3s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.faq__item:hover {
  padding-left: 1.5em;
}
.faq__item:hover .faq__btn {
  color: var(--c-orange);
}
.faq__icon {
  transition:
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    background 0.3s ease,
    box-shadow 0.4s ease;
}
.faq__btn:hover .faq__icon {
  transform: rotate(90deg) scale(1.1);
  background: var(--c-orange);
  box-shadow: 0 8px 20px rgba(255, 145, 77, 0.35);
}
.faq__btn:hover .faq__icon::before,
.faq__btn:hover .faq__icon::after {
  background: var(--c-white);
}

/* ─── AVOCATE ARG ────
   Lift marqué + chiffre qui prend du volume + bordure orange. */
.avocate-arg {
  transition:
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.3s ease,
    background 0.3s ease,
    box-shadow 0.5s ease;
}
.avocate-arg:hover {
  transform: translateY(-8px);
  border-color: var(--c-orange);
  background: var(--c-cream);
  box-shadow: 0 18px 40px rgba(14, 45, 86, 0.12);
}
.avocate-arg__chiffre {
  display: inline-block;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.avocate-arg:hover .avocate-arg__chiffre {
  transform: scale(1.15);
}

/* ─── GRID CARD ────
   Lift + glow orange + petite rotation 3D au hover. */
.grid-card {
  transform-style: preserve-3d;
  transition:
    transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    border-color 0.3s ease,
    box-shadow 0.5s ease;
}
.grid-card:hover {
  transform: translateY(-8px) rotateX(2deg);
  border-color: var(--c-orange);
  box-shadow: 0 20px 44px rgba(14, 45, 86, 0.12);
}
.grid-card__titre {
  transition: color 0.3s ease;
}
.grid-card:hover .grid-card__titre {
  color: var(--c-orange);
}

/* ─── CARD ARTICLE ────
   Lift + le titre change de couleur + le bouton "Lire la suite" glisse. */
.card-article__titre {
  transition: color 0.3s ease;
}
.card-article:hover .card-article__titre {
  color: var(--c-orange);
}
.card-article__lien {
  transition:
    background 0.35s ease,
    color 0.35s ease,
    transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.4s ease;
}
.card-article:hover .card-article__lien {
  transform: translateX(6px);
  box-shadow: 0 10px 22px rgba(255, 145, 77, 0.35);
}

/* ─── SOMMAIRE ────
   Slide à droite + couleur orange (déjà en place mais on étend la durée). */
.section-sommaire__link {
  transition:
    color 0.3s ease,
    transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.section-sommaire__link:hover {
  transform: translateX(6px);
}
.section-sommaire__link::before {
  transition: color 0.3s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.section-sommaire__link:hover::before {
  transform: scale(1.15);
}

/* ─── SURTITRE ────
   Petite respiration au hover de la section parente */
.surtitre {
  transition: background 0.3s ease, border-color 0.3s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ============================================================
   ANIMATION — OUVERTURE DE CONTENEURS (stagger interne)
   ============================================================ */

/* Keyframes douces : translations réduites, fade plus progressif */
@keyframes avd-content-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}

@keyframes avd-content-in-x {
  from { opacity: 0; transform: translateX(-10px); }
  to   { opacity: 1; transform: none; }
}

@keyframes avd-content-in-scale {
  from { opacity: 0; transform: translateY(6px) scale(0.98); }
  to   { opacity: 1; transform: none; }
}

/* Ease "out-quart" — décélération très progressive, sans rebond */
/* ─── SERVICE ITEM : contenu interne en cascade ─────────────── */
.service-item.is-open .service-item__body-left > * {
  animation: avd-content-in 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.service-item.is-open .service-item__body-left > *:nth-child(1) { animation-delay: 0.18s; }
.service-item.is-open .service-item__body-left > *:nth-child(2) { animation-delay: 0.34s; }
.service-item.is-open .service-item__body-left > *:nth-child(3) { animation-delay: 0.50s; }

.service-item.is-open .service-item__body-right .service-item__image {
  animation: avd-content-in-scale 1s cubic-bezier(0.22, 1, 0.36, 1) 0.24s both;
}

.service-item.is-open .service-item__arguments li {
  animation: avd-content-in-x 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.service-item.is-open .service-item__arguments li:nth-child(1) { animation-delay: 0.38s; }
.service-item.is-open .service-item__arguments li:nth-child(2) { animation-delay: 0.52s; }
.service-item.is-open .service-item__arguments li:nth-child(3) { animation-delay: 0.66s; }
.service-item.is-open .service-item__arguments li:nth-child(4) { animation-delay: 0.80s; }
.service-item.is-open .service-item__arguments li:nth-child(5) { animation-delay: 0.94s; }
.service-item.is-open .service-item__arguments li:nth-child(n+6) { animation-delay: 1.08s; }

/* ─── FAQ : contenu de la réponse en cascade ─────────────── */
.faq__btn[aria-expanded="true"] ~ .faq__answer .faq__answer-inner > * {
  animation: avd-content-in 0.75s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.faq__btn[aria-expanded="true"] ~ .faq__answer .faq__answer-inner > *:nth-child(1) { animation-delay: 0.22s; }
.faq__btn[aria-expanded="true"] ~ .faq__answer .faq__answer-inner > *:nth-child(2) { animation-delay: 0.34s; }
.faq__btn[aria-expanded="true"] ~ .faq__answer .faq__answer-inner > *:nth-child(3) { animation-delay: 0.46s; }
.faq__btn[aria-expanded="true"] ~ .faq__answer .faq__answer-inner > *:nth-child(4) { animation-delay: 0.58s; }
.faq__btn[aria-expanded="true"] ~ .faq__answer .faq__answer-inner > *:nth-child(n+5) { animation-delay: 0.70s; }

/* ─── MENU MOBILE : éléments en cascade quand le menu s'ouvre ──────────
   Les keyframes fire à chaque passage display:none → flex (à chaque
   ouverture du menu). `fill-mode: both` garde la valeur de départ pendant
   le délai et la valeur d'arrivée après l'animation.                       */
@media (max-width: 768px) {
  .nav__links.is-open > .nav__mobile-header,
  .nav__links.is-open > .nav__menu > li,
  .nav__links.is-open > .nav__cta {
    animation: avd-content-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .nav__links.is-open > .nav__mobile-header { animation-delay: 0.05s; }
  .nav__links.is-open > .nav__menu > li:nth-child(1) { animation-delay: 0.15s; }
  .nav__links.is-open > .nav__menu > li:nth-child(2) { animation-delay: 0.23s; }
  .nav__links.is-open > .nav__menu > li:nth-child(3) { animation-delay: 0.31s; }
  .nav__links.is-open > .nav__menu > li:nth-child(4) { animation-delay: 0.39s; }
  .nav__links.is-open > .nav__menu > li:nth-child(5) { animation-delay: 0.47s; }
  .nav__links.is-open > .nav__menu > li:nth-child(n+6) { animation-delay: 0.55s; }
  .nav__links.is-open > .nav__cta { animation-delay: 0.55s; }
}

/* ─── SOUS-MENU DESKTOP : les liens cascadent au hover ─────────────── */
.nav__menu > .menu-item-has-children:hover > .sub-menu > li {
  animation: avd-content-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.nav__menu > .menu-item-has-children:hover > .sub-menu > li:nth-child(1) { animation-delay: 0.06s; }
.nav__menu > .menu-item-has-children:hover > .sub-menu > li:nth-child(2) { animation-delay: 0.14s; }
.nav__menu > .menu-item-has-children:hover > .sub-menu > li:nth-child(3) { animation-delay: 0.22s; }
.nav__menu > .menu-item-has-children:hover > .sub-menu > li:nth-child(4) { animation-delay: 0.30s; }
.nav__menu > .menu-item-has-children:hover > .sub-menu > li:nth-child(n+5) { animation-delay: 0.38s; }

@media (prefers-reduced-motion: reduce) {
  .service-item.is-open *,
  .faq__answer *,
  .nav__links.is-open *,
  .sub-menu * {
    animation: none !important;
  }
}
