/*  
Theme Name: Xavier Lachenaud
Theme URI: https://xavierlachenaud.fr/
Description: Thème Wordpress pour Xavier Lachenaud
Author: Alternetwork
Author URI: https://alternetwork.fr/
*/


@charset "UTF-8";

/*** Vars ***/
:root {
  color-scheme: dark;
  --section-padding-inline: clamp(1.25rem, 4vw, 5rem);
  --col-orange: #F75320;
  --col-dune: #EEDCC8;
  --col-noir: #131313;
  --col-blanc: #FFFFFF;
  --col-gris: #6F6F6F;
  --col-gris-clair: #E4E4E4;
  --rgb-orange: 247, 83, 32;
  --rgb-dune: 238, 220, 200;
  --rgb-noir: 19, 19, 19;
  --rgb-blanc: 255, 255, 255;
  --rgb-gris: 111, 111, 111;
  --rgb-gris-clair: 228, 228, 228;

  --size-h1: 128px;
  --size-h1-b: 96px;
  --size-h2: 62px;
  --size-h3: 30px;
  --size-h4: 24px;
  --size-titre-anime:90px;
  --size-surtitre:  16px;
  --size-titre-intro:  36px;
  --size-big-txt:  22px;
  --size-txt:  20px;

  --navbar-height: 90px;
  --sticky-height: 90px;

  --width-header-logo: 250px;
  --width-footer-logo:  200px;

  --break-point-1500: 1420px;

  --width-container: min(1420px, calc(100dvw - 30px));
  --marge-left: max(15px, calc((100dvw - var(--width-container)) / 2));
  --marge-right: max(15px, calc((100dvw - var(--width-container)) / 2));

  --width-hr: 20dvw;
  --height-top:10dvh;

  --banner-height:600px;
  --cadre-photo-height-min: 310px;
  --cadre-photo-height-med: 450px;
  --cadre-photo-height-max: 560px;
  --cadre-photo-height-portrait: 300px;
  --cadre-photo-width-portrait: 210px;
  --banniere-photo-height:  740px;
  --bulle-photo-height:200px;
  --slider-photo-height: 500px;
  --button-cross-height:24px;

  --width-button-arrow:90px;
  --height-button-arrow:100px;
  --height-bloc-jour:550px;
  --height-bloc-intervenant:500px;
  --height-header-event:140px;

  --radius-min: 20px;
  --radius-med: 40px;
  --radius-max: 100px;

  --main-padding:  60px;
  --main-padding-min: 60px;
  --main-padding-left:  50px;
  --main-padding-right: 50px;

  --transition-duration : 0.45s;

  --arrow-right: polygon(0 40%,91% 40%,80% 0%, 88% 0%,100% 50%,88% 100%,80% 100%,91% 60%,0 60%);
}

/*** Animations ***/

/*** Règles ***/


/* Support du défilement Lenis ; le défilement natif reste le repli. */
html.lenis, html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}
.lenis.lenis-smooth iframe {
  pointer-events: none;
}

/* Typographie et hero de la page d'accueil. */
body { margin: 0; font-family: 'Barlow', sans-serif; color: var(--col-noir); }
.xl-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: 100vh;
  min-height: 100svh;
  width: 100%;
  padding: 10rem clamp(1.25rem, 4vw, 5rem);
  overflow: hidden;
  background: var(--col-noir);
}
.xl-hero__photo, .xl-hero__video, .xl-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.xl-hero__photo { z-index: -3; }
.xl-hero__video[hidden] { display: none; }
.xl-hero__photo, .xl-hero__video { object-fit: cover; object-position: center; }
.xl-hero__shade { z-index: -1; background: linear-gradient(90deg, rgba(var(--rgb-noir),.36), rgba(var(--rgb-noir),.08)); pointer-events: none; }
.xl-hero__content { width: 100%; }
.xl-hero__title { margin: 0; color: var(--col-blanc); font-family: 'Balboa', sans-serif; font-weight: 700; line-height: 1.02; letter-spacing: -.015em; font-size: clamp(2.5rem, 7.7vw, 8rem); overflow-wrap: break-word; }
.xl-hero__title-line { display: block; }
.xl-hero__title-line--secondary { color: var(--col-orange); margin-top: .65em; font-size: .38em; line-height: 1.2; letter-spacing: 0; }
.xl-hero__title em, .xl-hero__title i { font-style: normal; }
.xl-hero__title strong, .xl-hero__title b { font-weight: inherit; }
.xl-hero__video-toggle { position: absolute; bottom: 1.5rem; right: clamp(1.25rem, 4vw, 5rem); padding: .65rem 1rem; min-height: 44px; border: 1px solid rgba(var(--rgb-blanc),.5); background: rgba(var(--rgb-noir),.65); color: var(--col-blanc); font: 300 1rem 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: .07em; cursor: pointer; }
.xl-hero__video-toggle[hidden] { display: none; }
@media (max-width: 767px) {
  .xl-hero { padding-top: 9rem; padding-bottom: 9rem; }
  .xl-hero__title { font-size: clamp(2.3rem, 9vw, 4.3rem); }
  .xl-hero__title-line--secondary { font-size: clamp(1.25rem, 4.8vw, 1.8rem); max-width: 26ch; }
}

/* CTA communs : remplissage blanc de gauche à droite. */
.xl-button {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 48px;
  padding: .75rem 1.75rem;
  border: 1px solid var(--col-blanc);
  background: transparent;
  color: var(--col-blanc);
  font: 300 1.125rem/1.2 'Barlow Condensed', sans-serif;
  letter-spacing: .07em;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  overflow: hidden;
  transition: color .3s ease;
}
.xl-button::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background: var(--col-blanc);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .35s cubic-bezier(.4,0,.2,1);
}
.xl-button:hover, .xl-button:focus-visible { color: var(--col-orange); text-decoration: none; }
.xl-button:hover::before, .xl-button:focus-visible::before { transform: scaleX(1); }
.xl-button:focus-visible { outline: 2px solid var(--col-orange); outline-offset: 5px; }
.xl-button[aria-disabled='true'] { cursor: progress; }
.xl-hero__categories {
  position: absolute;
  left: clamp(1.25rem, 4vw, 5rem);
  right: 12rem;
  bottom: 2rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 30px;
}
.xl-category { background: var(--col-noir); color: var(--col-blanc); }
.xl-category__heading { padding: clamp(3rem, 7vw, 7rem) clamp(1.25rem, 4vw, 5rem); }
.xl-category__heading h1 { margin: 0; font: 700 clamp(3rem, 7vw, 7rem)/1.05 'Balboa', sans-serif; }
.xl-post-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.xl-post-row__media { position: relative; display: block; min-height: 440px; background: var(--col-dune); overflow: hidden; }
.xl-post-row__image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.xl-post-row__content { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(2rem, 5vw, 6rem); background: var(--col-noir); color: var(--col-blanc); }
.xl-post-row--reverse .xl-post-row__media { grid-column: 2; grid-row: 1; }
.xl-post-row--reverse .xl-post-row__content { grid-column: 1; grid-row: 1; }
.xl-post-row__title { margin: 0 0 1.25rem; font: 700 clamp(2rem, 3.6vw, 4rem)/1.1 'Balboa', sans-serif; overflow-wrap: anywhere; }
.xl-post-row__title a { color: inherit; text-decoration: none; }
.xl-post-row__title a:hover { color: var(--col-orange); }
.xl-post-row__title a:focus-visible { outline: 2px solid var(--col-orange); outline-offset: 5px; }
.xl-post-row__excerpt { font: 400 1.125rem/1.65 'Barlow', sans-serif; margin-bottom: 1.75rem; max-width: 52ch; }
.xl-post-row__excerpt p:last-child { margin-bottom: 0; }
.xl-category__pagination { display: flex; justify-content: center; gap: 1.5rem; flex-wrap: wrap; padding: 3rem 1.25rem 1rem; }
.xl-category__pagination:empty { display: none; }
.xl-category__status { margin: 0; padding: 1rem 1.25rem 2rem; text-align: center; }
.xl-category__empty { margin: 0; padding: 0 clamp(1.25rem, 4vw, 5rem) 5rem; }
@media (max-width: 991px) {
  .xl-hero { padding-bottom: 15rem; }
  .xl-hero__categories { right: 1.25rem; bottom: 6rem; }
  .xl-hero__categories .xl-button { padding-left: 1.25rem; padding-right: 1.25rem; }
}
@media (max-width: 767px) {
  .xl-hero__categories .xl-button { flex: 0 1 calc((100% - 30px) / 2); }
  .xl-post-row { grid-template-columns: minmax(0, 1fr); }
  .xl-post-row__media, .xl-post-row--reverse .xl-post-row__media { grid-column: 1; grid-row: 1; min-height: 0; aspect-ratio: 4 / 3; }
  .xl-post-row__content, .xl-post-row--reverse .xl-post-row__content { grid-column: 1; grid-row: 2; padding: 2.5rem 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .xl-button, .xl-button::before { transition: none; }
}

/* Swup : seul le main change ; le header fixe reste au premier plan. */
.xl-page { position: relative; background: var(--col-blanc); min-height: 100svh; }
.xl-page:not(.xl-page--hero) > section:first-child { padding-top: var(--xl-header-height, 110px); }
.page-transition { position: fixed; inset: 0; z-index: 10000; background: var(--col-blanc); opacity: 0; visibility: hidden; overflow: hidden; pointer-events: none; }
.page-transition__snapshot { position: absolute; inset: 0; }
.page-transition__shade { position: absolute; inset: 0; background: var(--col-noir); opacity: 0; pointer-events: none; }
html { scrollbar-gutter: stable; }
html.xl-is-transitioning { overflow: hidden; }
html.xl-is-transitioning .page-transition { pointer-events: auto; }
.xl-page.xl-page--entering { z-index: 10001; will-change: transform; pointer-events: none; }
.xl-transition-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Invisible avant SplitText, y compris pendant l'arrivée d'une page Swup. */
html.xl-hero-reveal-enabled [data-hero-title]:not(.is-revealed) { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  html.xl-hero-reveal-enabled [data-hero-title] { visibility: visible; }
}

/* Réalisations : apparitions séparées des médias et du texte. */
.xl-latest__eyebrow { margin: 0 0 1rem; color: var(--col-orange); font: 300 1.25rem/1.3 'Barlow Condensed', sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.xl-latest .xl-category__heading h2 { margin: 0; color: var(--col-blanc); font: 700 clamp(2.5rem, 5vw, 5rem)/1.1 'Balboa', sans-serif; }
.xl-post-row-stage { position: relative; }
#xl-latest .xl-post-row__media { position: relative; }
#xl-latest .xl-post-row__media::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 35%; background: linear-gradient(transparent, rgba(0,0,0,.45)); z-index: 2; pointer-events: none; }
#xl-latest .etiquette-video .xl-post-row__media::after { content: "VIDÉO"; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2211%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.5%22%2F%3E%3Cpath%20d%3D%22M10%208l6%204-6%204z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); }
#xl-latest .etiquette-photo.xl-post-row__media::after { content: "PHOTOS"; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M4%208h3l1.5-2h7L17%208h3v11H4z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213.5%22%20r%3D%223.5%22%2F%3E%3C%2Fsvg%3E"); }
#xl-latest .etiquette-video .xl-post-row__media::after,
#xl-latest .etiquette-photo .xl-post-row__media::after { position: absolute; left: 18px; bottom: 16px; z-index: 3; padding-left: 30px; color: #fff; font-family: "Barlow Condensed", sans-serif; font-weight: 500; font-size: 15px; line-height: 22px; letter-spacing: .22em; text-shadow: 0 1px 8px rgba(0,0,0,.6); background-repeat: no-repeat; background-size: 22px 22px; background-position: 0 0; pointer-events: none; }

.xl-post-row__content { transition: background-color .4s ease-in-out, color .4s ease-in-out; }
.xl-post-row__image { transition: transform .65s ease-in-out; }
.xl-post-row__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: var(--col-noir); }
.xl-post-row--compact .xl-post-row__media { min-height: 320px; }
.xl-post-row--compact .xl-post-row__content { padding: clamp(1.5rem, 3.5vw, 3.5rem); }
.xl-post-row--compact .xl-post-row__title { font-size: clamp(1.75rem, 3vw, 3.2rem); }
.xl-post-row--compact .xl-post-row__excerpt { margin-bottom: 1.25rem; }
/* Le CTA est orange dans l'état actif de la ligne ; lui seul se remplit au survol. */
.xl-post-row-stage:focus-within .xl-post-row__content { background: var(--col-blanc); color: var(--col-noir); }
.xl-post-row-stage:focus-within .xl-button { color: var(--col-orange); border-color: var(--col-orange); }
.xl-post-row-stage:focus-within .xl-button::before { background: var(--col-orange); }
.xl-post-row-stage:focus-within .xl-button:hover,
.xl-post-row-stage:focus-within .xl-button:focus-visible { color: var(--col-blanc); }
@media (hover: hover) and (pointer: fine) {
  .xl-post-row-stage:hover { z-index: 1; }
  .xl-post-row-stage:hover .xl-post-row__content { background: var(--col-blanc); color: var(--col-noir); }
  .xl-post-row-stage:hover .xl-post-row__image { transform: scale(1.05); }
  .xl-post-row-stage:hover .xl-button { color: var(--col-orange); border-color: var(--col-orange); }
  .xl-post-row-stage:hover .xl-button::before { background: var(--col-orange); }
  .xl-post-row-stage:hover .xl-button:hover,
  .xl-post-row-stage:hover .xl-button:focus-visible { color: var(--col-blanc); }
}
@media (max-width: 767px) {
  .xl-post-row--compact .xl-post-row__media { min-height: 0; }
  .xl-post-row--compact .xl-post-row__content { padding: 2rem 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .xl-post-row__content, .xl-post-row__image { transition: none; }
  .xl-post-row-stage:hover .xl-post-row__image { transform: none; }
}

.no-break { white-space: nowrap; }

/* Espacement commun des sections éditoriales de l'accueil. */
.xl-presentation,
.xl-latest { padding-block: var(--main-padding); }
.xl-presentation { padding-inline: clamp(1.25rem, 4vw, 5rem); background: var(--col-noir); color: var(--col-blanc); }
.xl-presentation__eyebrow { margin: 0 0 1.5rem; color: var(--col-orange); font: 300 1.25rem/1.3 'Barlow Condensed', sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.xl-presentation__quote { width: 60%; margin: 0; text-align: left; font: 600 clamp(4rem, 6vw, 6.5rem)/1.15 'Barlow Condensed', sans-serif; }
.xl-presentation__quote p { margin: 0; font: inherit; }
.xl-latest > .xl-category__heading { padding-top: 0; padding-bottom: var(--main-padding); }
@media (max-width: 767px) {
  .xl-presentation__quote { width: 100%; }
}

/* Palette inversée, orange inchangé. Les médias conservent leurs couleurs. */
:root[data-theme="light"] {
  color-scheme: light;
  --col-noir: #FFFFFF;
  --col-blanc: #131313;
  --rgb-noir: 255, 255, 255;
  --rgb-blanc: 19, 19, 19;
}
body { background: var(--col-noir); color: var(--col-blanc); }
.xl-presentation { padding-inline: var(--section-padding-inline); }
.xl-latest > .xl-category__heading { padding-inline: var(--section-padding-inline); }
.xl-presentation__quote { overflow-wrap: anywhere; }
.xl-footer { position: relative; padding: var(--main-padding) var(--section-padding-inline); background: var(--col-noir); color: var(--col-blanc); }
.xl-footer p { margin: 0; }
.xl-footer a { color: inherit; }
html.xl-hero-reveal-enabled .xl-hero__categories:not(.is-revealed) { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  html.xl-hero-reveal-enabled .xl-hero__categories { visibility: visible; }
}

/* État initial avant GSAP, y compris pendant l'entrée Swup. */
html.xl-words-reveal-enabled .anim-reveal-by-word__word { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  html.xl-words-reveal-enabled .anim-reveal-by-word__word { opacity: 1; }
}
/* Le marqueur appartient au conteneur remplacé par Swup. */
.xl-page--404 { background: var(--col-noir); color: var(--col-blanc); }
.xl-page--404 .section-content {
  padding: calc(var(--xl-header-height, 110px) + var(--main-padding)) var(--section-padding-inline) var(--main-padding);
}
.xl-page--404 a { color: inherit; }

.xl-portfolio-filters { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2rem; }
.xl-portfolio-filters .xl-button[aria-current="true"] { background: var(--col-blanc); color: var(--col-orange); }

/* Les nouveaux blocs sont masqués dès leur insertion, avant GSAP. */
html.xl-rows-reveal-enabled .xl-post-row .anim-appearance-photo,
html.xl-rows-reveal-enabled .xl-post-row .anim-scale { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  html.xl-rows-reveal-enabled .xl-post-row .anim-appearance-photo,
  html.xl-rows-reveal-enabled .xl-post-row .anim-scale { opacity: 1; }
}

/* Pages éditoriales standard et Contact. */
.xl-standard { min-height: 100svh; }
.xl-standard__content { padding: 0 var(--section-padding-inline) var(--main-padding); font: 400 1.25rem/1.65 'Barlow', sans-serif; overflow-wrap: anywhere; }
.xl-standard__content > :first-child { margin-top: 0; }
.xl-standard__content img, .xl-standard__content video { max-width: 100%; height: auto; }
.xl-standard__content a { color: var(--col-orange); }
.xl-standard__pagination { padding: 0 var(--section-padding-inline) var(--main-padding); }
html.xl-hero-reveal-enabled [data-split-pending] { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  html.xl-hero-reveal-enabled [data-split-pending] { visibility: visible; }
}

/* Contact : informations, réseaux sociaux et formulaire CF7. */
.xl-contact { min-height: 100svh; }
.xl-contact__section { padding: var(--main-padding) var(--section-padding-inline); }
.xl-contact__infos { padding-top: 0; }
.xl-contact__eyebrow { margin: 0 0 1rem; color: var(--col-orange); font: 300 1.25rem/1.3 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: .1em; }
.xl-contact__title { margin: 0 0 2rem; font: 700 clamp(2.5rem, 5vw, 5rem)/1.1 'Balboa', sans-serif; }
.xl-contact__details { display: flex; flex-wrap: wrap; gap: 20px 40px; }
.xl-contact__details a, .xl-contact__socials a { display: inline-flex; align-items: center; gap: 12px; color: var(--col-blanc); text-decoration: none; overflow-wrap: anywhere; }
.xl-contact__details .fa, .xl-contact__socials .fa { color: var(--col-orange); }
.xl-contact__details a:hover, .xl-contact__socials a:hover { color: var(--col-orange); }
.xl-contact__availability { margin-top: 2rem; font-size: 1.125rem; line-height: 1.65; }
.xl-contact__socials { display: flex; flex-wrap: wrap; gap: 24px; padding: 0; margin: 2rem 0 0; list-style: none; }
.xl-contact-form { display: grid; gap: 24px; }
.xl-contact-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
.xl-contact-form p { margin: 0; }
.xl-contact-form label, .xl-contact-form .wpcf7-form-control-wrap { display: block; }
.xl-contact-form label { font: 300 1.25rem/1.4 'Barlow Condensed', sans-serif; }
.xl-contact-form .wpcf7-form-control-wrap { margin-top: 8px; }
.xl-contact-form input[type="text"], .xl-contact-form input[type="tel"], .xl-contact-form input[type="email"], .xl-contact-form textarea {
 box-sizing: border-box; width: 100%; padding: 14px 16px; border: 1px solid var(--col-blanc); border-radius: 0; background: transparent; color: var(--col-blanc); font: 400 1rem/1.5 'Barlow', sans-serif;
}
.xl-contact-form textarea { min-height: 180px; resize: vertical; }
.xl-contact-form input:focus-visible, .xl-contact-form textarea:focus-visible, .xl-contact-form__button:focus-visible, .xl-contact__details a:focus-visible, .xl-contact__socials a:focus-visible { outline: 2px solid var(--col-orange); outline-offset: 4px; }
.xl-contact-form__acceptance .wpcf7-list-item { margin: 0; }
.xl-contact-form__acceptance label { display: flex; align-items: flex-start; gap: 12px; font: 400 1rem/1.5 'Barlow', sans-serif; cursor: pointer; }
.xl-contact-form__acceptance input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--col-orange); }
.xl-contact-form__notice { font-size: .875rem; }
.xl-contact-form__button { padding: 14px 32px; border: 1px solid var(--col-blanc); border-radius: 0; background: transparent; color: var(--col-blanc); font: 300 1.25rem/1.2 'Barlow Condensed', sans-serif; text-transform: uppercase; cursor: pointer; transition: background-color .3s, color .3s, opacity .3s; }
.xl-contact-form__button:not(:disabled):hover { background: var(--col-blanc); color: var(--col-orange); }
.xl-contact-form__button:disabled { opacity: .35; cursor: not-allowed; }
@media (max-width: 767px) { .xl-contact-form__row { grid-template-columns: 1fr; gap: 24px; } }
@media (prefers-reduced-motion: reduce) { .xl-contact-form__button { transition: none; } }

/* Contact : état initial indépendant du reveal du hero. */
html.xl-contact-motion-enabled .xl-contact [data-split-pending],
html.xl-contact-motion-enabled .xl-contact .anim-appearance-soft-1 { visibility: hidden; }
.xl-contact__details .anim-split-text-by-lines,
.xl-contact__socials .anim-split-text-by-lines { display: block; min-width: 0; }
@media (prefers-reduced-motion: reduce) {
  html.xl-contact-motion-enabled .xl-contact [data-split-pending],
  html.xl-contact-motion-enabled .xl-contact .anim-appearance-soft-1 { visibility: visible; }
}

/* Icônes révélées dans un masque, en même temps que leur libellé. */
.xl-contact__icon { display: inline-block; flex: 0 0 auto; overflow: hidden; line-height: 1.4; }
.xl-contact__icon .fa { display: inline-block; }
html.xl-contact-motion-enabled .xl-contact .xl-contact__icon .fa { opacity: 0; visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
 html.xl-contact-motion-enabled .xl-contact .xl-contact__icon .fa { opacity: 1; visibility: visible; }
}
.wpcf7 form.invalid .wpcf7-response-output {
 background: #dc3232; border-color: #dc3232; color: #fff; padding: 10px 15px;
}
.wpcf7 form.sent .wpcf7-response-output {
 background: var(--col-orange); border-color: var(--col-orange); color: #fff; padding: 10px 15px;
}

/* Détail et galerie : cycle de sept images sur trois lignes. */
.xl-realisation { background: var(--col-noir); color: var(--col-blanc); min-height: 100svh; }
.xl-realisation__banner { position: relative; isolation: isolate; height: 50vh; display: flex; align-items: center; padding: 0 var(--section-padding-inline); overflow: hidden; box-sizing: border-box; background: #131313; }
.xl-realisation__cover, .xl-realisation__shade { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.xl-realisation__cover { object-fit: cover; }
.xl-realisation__shade { background: linear-gradient(90deg, rgba(0,0,0,.6), rgba(0,0,0,.2)); }
.xl-realisation__banner h1 { margin: 0; padding-top: var(--xl-header-height, 110px); color: #fff; font: 700 clamp(3rem, 7vw, 7rem)/1.05 'Balboa', sans-serif; overflow-wrap: anywhere; }
.xl-realisation__content { padding-top: var(--main-padding); }
.xl-realisation__section { padding: var(--main-padding) var(--section-padding-inline); }
.xl-realisation__video { display: block; width: 100%; height: auto; max-height: 85vh; background: #131313; }
.xl-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: clamp(180px, 28vw, 480px); gap: 30px; }
.xl-gallery__item { display: block; min-width: 0; overflow: hidden; }
.xl-gallery__item:nth-child(7n + 1), .xl-gallery__item:nth-child(7n + 4) { grid-column: span 2; }
.xl-gallery__item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.xl-gallery__item:hover img { transform: scale(1.05); }
.xl-lightbox { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; border: 0; padding: 60px 70px; box-sizing: border-box; background: rgba(0,0,0,.96); color: #fff; }
.xl-lightbox::backdrop { background: rgba(0,0,0,.8); }
.xl-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.xl-lightbox figure { margin: 0; max-width: 100%; text-align: center; }
.xl-lightbox img { display: block; max-width: 100%; max-height: calc(100dvh - 160px); width: auto; height: auto; object-fit: contain; margin: auto; }
.xl-lightbox figcaption { margin-top: 15px; }
.xl-lightbox button { position: absolute; border: 0; background: transparent; color: #fff; width: 48px; height: 48px; cursor: pointer; }
.xl-lightbox button:focus-visible, .xl-gallery__item:focus-visible { outline: 2px solid var(--col-orange); outline-offset: 3px; }
.xl-lightbox__prev { left: 10px; top: calc(50% - 24px); font-size: 44px; }
.xl-lightbox__next { right: 10px; top: calc(50% - 24px); font-size: 44px; }
.xl-lightbox__close { right: 15px; top: 10px; }
.xl-lightbox__close::before, .xl-lightbox__close::after { content: ''; position: absolute; left: 10px; top: 23px; width: 28px; height: 2px; background: currentColor; transform: rotate(45deg); }
.xl-lightbox__close::after { transform: rotate(-45deg); }
html.xl-gallery-open { overflow: hidden; }
@media (max-width: 767px) {
 .xl-gallery { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 20px; }
 .xl-gallery__item:nth-child(n) { grid-column: auto; }
 .xl-gallery__item img { height: auto; }
 .xl-lightbox { padding: 60px 45px; }
 .xl-lightbox__prev { left: 0; } .xl-lightbox__next { right: 0; }
}
@media (prefers-reduced-motion: reduce) { .xl-gallery__item img { transition: none; } }

/* Vignettes masquées avant l’initialisation, sans masquer le repli sans JS. */
html.xl-rows-reveal-enabled .xl-gallery__item.anim-appearance-soft-1 { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
 html.xl-rows-reveal-enabled .xl-gallery__item.anim-appearance-soft-1 { opacity: 1; }
}

/* Références : bandeau continu de marques, palette monochrome. */
.xl-trust { padding-block: var(--main-padding); background: var(--col-noir); color: var(--col-blanc); overflow: hidden; }
.xl-trust__heading { padding-inline: var(--section-padding-inline); }
.xl-trust__title { margin: 0; font: 700 clamp(2.5rem, 5vw, 5rem)/1.1 'Balboa', sans-serif; }
.xl-trust .xl-trust__text { padding: 0; margin-top: 2rem; text-align: left; }
.xl-trust__marquee { margin-top: var(--main-padding); width: 100%; max-width: 100%; overflow: hidden; }
.xl-trust__marquee.is-running { overflow: hidden; }
.xl-trust__track { display: flex; width: max-content; }
.xl-trust__logos { display: flex; flex: 0 0 auto; align-items: flex-start; gap: 48px; padding: 0 48px 0 0; margin: 0; list-style: none; }
.xl-trust__brand { flex: 0 0 240px; width: 240px; text-align: center; }
.xl-trust__logo { display: flex; justify-content: center; align-items: center; height: 160px; }
.xl-trust__logo img { display: block; max-width: 100%; max-height: 160px; width: auto; height: auto; filter: brightness(0) invert(1); }
html[data-theme="light"] .xl-trust__logo img { filter: brightness(0); }
@media (max-width: 767px) {
 .xl-trust__brand { flex-basis: 160px; width: 160px; }
 .xl-trust__logo { height: 110px; }
 .xl-trust__logo img { max-height: 110px; }
 .xl-trust__logos { gap: 30px; padding-right: 30px; }
}
@media (prefers-reduced-motion: reduce) {
 .xl-trust__logos { flex-wrap: wrap; justify-content: center; padding: 0; width: 100%; }
 .xl-trust__track { width: 100%; }
}

/* Les scales d'entrée ne doivent pas élargir le document avant le scroll. */
.xl-page { overflow-x: clip; }
.xl-trust { min-width: 0; max-width: 100%; }
/* Sans animation, toutes les marques restent accessibles sur plusieurs lignes. */
.xl-trust__marquee:not(.is-running) .xl-trust__track { width: 100%; }
.xl-trust__marquee:not(.is-running) .xl-trust__logos { width: 100%; padding: 0; flex-wrap: wrap; justify-content: center; }
@supports not (overflow: clip) {
  .xl-page { overflow-x: hidden; }
}

/* Invitation à prendre contact en fin d’accueil. */
.xl-home-project.xl-contact { min-height: 0; padding: var(--main-padding) var(--section-padding-inline); background: var(--col-noir); color: var(--col-blanc); }
.xl-home-project .xl-home-project__text { padding: 0; margin-bottom: 2rem; text-align: left; }
.xl-home-project > .xl-contact__form { margin-top: var(--main-padding); }

/* Bandeau ondulé : les pastilles suivent la vague, les logos restent droits. */
.xl-trust__marquee { padding-block: 85px; }
.xl-trust__brand { flex-basis: 210px; width: 210px; }
.xl-trust__logo { height: 210px; padding: 30px; box-sizing: border-box; background: rgba(var(--rgb-blanc), .07); border-radius: 50%; }
.xl-trust__logo img { max-width: 150px; max-height: 120px; }
@media (max-width: 767px) {
 .xl-trust__marquee { padding-block: 52px; }
 .xl-trust__brand { flex-basis: 150px; width: 150px; }
 .xl-trust__logo { height: 150px; padding: 24px; }
 .xl-trust__logo img { max-width: 102px; max-height: 90px; }
}

/* À propos : texte/photo, photo en premier sur mobile. */
.xl-apropos { min-height: 100svh; }
.xl-apropos__content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: clamp(30px, 5vw, 80px); padding: 0 var(--section-padding-inline) var(--main-padding); }
.xl-apropos .xl-apropos__text { padding: 0; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: center; }
.xl-apropos__copy > :first-child { margin-top: 0; }
.xl-apropos__copy > :last-child { margin-bottom: 0; }
.xl-apropos__photo { min-width: 0; margin: 0; }
.xl-apropos__photo img { display: block; width: 100%; height: auto; }
.xl-apropos__content--no-photo { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 767px) {
 .xl-apropos__content { grid-template-columns: minmax(0, 1fr); }
 .xl-apropos__photo { grid-row: 1; }
}

/* Préparation de la photo À propos sans flash avant GSAP. */
html.xl-contact-motion-enabled .xl-apropos__photo.anim-appearance-photo { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  html.xl-contact-motion-enabled .xl-apropos__photo.anim-appearance-photo { visibility: visible; }
}

/* Le viewBox est recadré au bas des tracés, sans espace sous le logo. */
.xl-footer { padding-bottom: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px) minmax(0, 1fr); align-items: end; gap: 24px; }
.xl-footer__brand { grid-column: 2; width: min(100%, 346.85px); margin: 0 auto; }
.xl-footer__logo { display: block; width: 100%; height: auto; max-height: 400px; color: inherit; }
html.xl-contact-motion-enabled .xl-footer__logo { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  html.xl-contact-motion-enabled .xl-footer__logo { visibility: visible; }
}

.xl-footer__copyright { grid-column: 1; grid-row: 1; }
.xl-footer__legal { grid-column: 3; grid-row: 1; text-align: right; }
.xl-footer__legal-menu { list-style: none; margin: 0; padding: 0; }
.xl-footer__legal a { text-decoration: none; transition: color .45s ease; }
.xl-footer__legal a:hover, .xl-footer__legal a:focus-visible { color: var(--col-orange); }
@media (max-width: 767px) {
  .xl-footer { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 16px; }
  .xl-footer__copyright { grid-column: 1; }
  .xl-footer__legal { grid-column: 2; }
  .xl-footer__brand { grid-column: 1 / -1; grid-row: 2; max-width: 420px; }
}

/* Espacement sous les textes uniquement : le logo reste au bord inférieur. */
.xl-footer__copyright, .xl-footer__legal { padding-bottom: 20px; }

/* Présentation accueil : contenus ACF partagés avec À propos. */
.xl-presentation--about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(30px, 5vw, 80px); }
.xl-presentation__body { min-width: 0; }
.xl-presentation--about .xl-presentation__quote { width: 100%; font-size: clamp(3rem, 4.5vw, 5rem); line-height: 1.05; }
.xl-presentation--about .xl-apropos__text { padding: 0; margin-top: 2rem; }
.xl-presentation--no-photo { grid-template-columns: minmax(0, 1fr); }
html.xl-contact-motion-enabled .xl-presentation--about .anim-appearance-photo { visibility: hidden; }
@media (max-width: 767px) {
  .xl-presentation--about { grid-template-columns: minmax(0, 1fr); }
  .xl-presentation--about .xl-apropos__photo { grid-row: 1; }
}
@media (prefers-reduced-motion: reduce) {
  html.xl-contact-motion-enabled .xl-presentation--about .anim-appearance-photo { visibility: visible; }
}


/* Références : préparation masquée, sans affichage intermédiaire en grille.
   Compatible avec initBrandMarquee utilisant uniquement .is-running. */
@media (prefers-reduced-motion: no-preference) {
  html.xl-contact-motion-enabled .xl-trust__marquee:not(.is-static) .xl-trust__track { width: max-content; }
  html.xl-contact-motion-enabled .xl-trust__marquee:not(.is-static) .xl-trust__logos { width: auto; flex-wrap: nowrap; justify-content: flex-start; padding-right: 48px; }
  html.xl-contact-motion-enabled .xl-trust__marquee:not(.is-running):not(.is-static) .xl-trust__track { opacity: 0; visibility: hidden; }
  .xl-trust__marquee.is-running .xl-trust__track { animation: xl-brand-reveal .55s ease-out both; }
}
@keyframes xl-brand-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  html.xl-contact-motion-enabled .xl-trust__marquee:not(.is-static) .xl-trust__logos { padding-right: 30px; }
}