/* =====================================================================
   Finesty — accueil : transitions entre sections + apparitions (home-fx.css, avec home-fx.js)
   Inspiration ReactBits (BlurText, SplitText, AnimatedList, Floating) — GSAP 3 côté JS.
   1. Mode sections plein écran (toutes largeurs) et transition « rideau » (voir § 1), synchronisée sur fullpage.js.
   2. Faisceau or qui traverse l'écran (désactivé dans home-fx.js, règles conservées).
   3. Halo or « qui respire » derrière les illustrations (sections 2 à 4).
   4. Pagination fullpage : point actif étiré en pastille or.
   Mouvement réduit : tout est neutralisé.
   ===================================================================== */
/* ---------------------------------------------------------------------
   1. Mode sections plein écran (fullpage.js actif : html.fp-enabled, body sans .fp-responsive), toutes largeurs —
   ordinateur, tablette et téléphone en portrait (home-fx.js décide du mode).
   a) Chaque section fait la hauteur de l'écran ; son .fp-tableCell devient une zone défilante : contenu centré s'il
      est plus court que l'écran, défilement interne s'il est plus long (gestes et molette : home-fx.js). Fond opaque
      par section ; fond sombre derrière la pile, visible quand une section recule.
   b) Transition « rideau » portée par la section entière : le déplacement du cadre est compensé par une translation
      inverse (même durée, même courbe), si bien que rien ne glisse ; la section qui arrive recouvre celle qui part par
      un bord net qui balaie l'écran (vers le haut en descendant, vers le bas en remontant) ; celle qui part
      reste immobile dessous (ni zoom, ni voile, ni ombre). --fy-vh = hauteur de fenêtre (home-fx.js). Le pied de page garde le comportement natif.
   --------------------------------------------------------------------- */
html.fp-enabled body.home:not(.fp-responsive) { --fy-ease: cubic-bezier(.32, .18, .22, 1); --fy-dur: .85s; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper { background: #0E2127; }
/* geste vertical autorisé : fullpage pose touch-action: none sur son conteneur, que Safari applique aussi aux zones
   défilantes des sections trop hautes (on restait coincé dans la section Contact) ; fullpage bloque lui-même les
   gestes qu'il gère (preventDefault) */
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper.fullpage-wrapper { touch-action: pan-y !important; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section > .fp-tableCell { touch-action: pan-y; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section { display: block !important; position: relative; background: #FFFFFF; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:first-child { background: #1B3740; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:nth-child(3),
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:nth-child(5) { background: #F8F6F1; }   /* rythme : blanc cassé une section sur deux */
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:has(.elementor-element-f914d6e) { background: #132B33; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.fy-footer-section { background: #24454F; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section > .fp-tableCell {
  display: flex !important; flex-direction: column; box-sizing: border-box; width: 100%;
  overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; scrollbar-color: rgba(47, 87, 101, .35) transparent;
}
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section > .fp-tableCell > * { flex: 0 0 auto; width: 100%; margin-top: auto !important; margin-bottom: auto !important; }
/* pied de page : hauteur naturelle, plafonnée à l'écran (il défile alors à l'intérieur, sur téléphone) */
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.fy-footer-section > .fp-tableCell { display: block !important; max-height: var(--fy-vh, 100vh); }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.fy-footer-section > .fp-tableCell > * { margin: 0 !important; }

/* tablette et téléphone : le contenu démarre sous l'en-tête fixe (--fy-hdr, mesuré) ; le bandeau fait l'écran exact */
@media (max-width: 1024px) {
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:not(:first-child):not(.fy-footer-section) .elementor > .e-con.e-parent:not(.elementor-element-f914d6e) {
    padding-top: calc(var(--fy-hdr, 80px) + 20px) !important; padding-bottom: 36px !important;
  }
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:first-child .elementor > .e-con.e-parent { min-height: var(--fy-vh, 100vh) !important; }
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section .elementor > .e-con.e-parent.elementor-element-f914d6e { padding-top: calc(var(--fy-hdr, 80px) + 24px) !important; }
  /* pied de page plus haut que l'écran : il démarre sous l'en-tête fixe */
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.fy-footer-section.fy-fp-over > .fp-tableCell { padding-top: var(--fy-hdr, 80px); }
}

@media (prefers-reduced-motion: no-preference) {
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:not(.fy-footer-section) {
    transform-origin: 50% 50%;
    -webkit-clip-path: inset(0 0 0 0 round 0); clip-path: inset(0 0 0 0 round 0);
    transition: transform var(--fy-dur) var(--fy-ease), clip-path var(--fy-dur) var(--fy-ease), -webkit-clip-path var(--fy-dur) var(--fy-ease);
  }
  /* passée (au-dessus de l'active) : compensée vers le bas, immobile ; masquée d'un coup une fois recouverte */
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section:not(.fy-footer-section):has(~ .section.active:not(.fy-footer-section)) {
    transform: translateY(var(--fy-vh));
    -webkit-clip-path: inset(0 0 100% 0 round 0); clip-path: inset(0 0 100% 0 round 0);
    transition: transform var(--fy-dur) var(--fy-ease), clip-path 0s linear var(--fy-dur), -webkit-clip-path 0s linear var(--fy-dur);
  }
  /* à venir (au-dessous) : compensée vers le haut, rideau baissé (bord net) */
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.active ~ .section:not(.fy-footer-section) {
    transform: translateY(calc(-1 * var(--fy-vh)));
    -webkit-clip-path: inset(var(--fy-vh) 0 0 0 round 0); clip-path: inset(var(--fy-vh) 0 0 0 round 0);
  }
  html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.active { transform: none; -webkit-clip-path: inset(0 0 0 0 round 0); clip-path: inset(0 0 0 0 round 0); }
}
/* téléphone : pagination plus discrète, collée au bord */
@media (max-width: 767.98px) {
  html.fp-enabled body.home:not(.fp-responsive) #fp-nav.fp-right { right: 3px; }
  html.fp-enabled body.home:not(.fp-responsive) #fp-nav ul li { width: 10px; height: 22px; margin: 2px 0; }
  html.fp-enabled body.home:not(.fp-responsive) #fp-nav ul li a span { width: 4px; height: 4px; margin: -2px 0 0 -2px; }
  html.fp-enabled body.home:not(.fp-responsive) #fp-nav ul li a.active span { width: 4px; height: 18px; margin: -9px 0 0 -2px; }
}

/* faisceau or (JS : position/opacité) */
.fy-fx-beam {
  position: fixed; left: 0; right: 0; top: 0; height: 24vh; z-index: 60; pointer-events: none; opacity: 0;
  background: linear-gradient(180deg, rgba(218, 174, 81, 0) 0%, rgba(218, 174, 81, .10) 42%, rgba(244, 192, 26, .22) 50%, rgba(218, 174, 81, .10) 58%, rgba(218, 174, 81, 0) 100%);
  will-change: transform, opacity;
}
.fy-fx-beam::after {
  content: ""; position: absolute; left: 12vw; right: 12vw; top: 50%; height: 2px; margin-top: -1px;
  background: linear-gradient(90deg, rgba(244, 192, 26, 0) 0%, rgba(244, 192, 26, .9) 30%, rgba(244, 192, 26, .9) 70%, rgba(244, 192, 26, 0) 100%);
}

/* halo derrière les illustrations */
body.home .tp-page-scroll-wrapper .section .elementor-widget-image .elementor-widget-container { position: relative; }
.fy-fx-orb {
  position: absolute; left: 50%; top: 50%; width: 320px; height: 320px; margin: -160px 0 0 -160px; z-index: 0; pointer-events: none; border-radius: 50%;   /* taille/position recalées sur l'image par home-fx.js */
  background: radial-gradient(closest-side, rgba(218, 174, 81, .22) 0%, rgba(218, 174, 81, .12) 45%, rgba(218, 174, 81, 0) 100%);
  opacity: 0; will-change: transform, opacity;
}
.fy-fx-orb::before {
  content: ""; position: absolute; inset: 9%; border-radius: 50%; border: 1.5px solid rgba(218, 174, 81, .35);
  -webkit-mask: conic-gradient(from 210deg, #000 0 62%, transparent 62% 100%); mask: conic-gradient(from 210deg, #000 0 62%, transparent 62% 100%);
  animation: fyOrbSpin 22s linear infinite;
}
@keyframes fyOrbSpin { to { transform: rotate(360deg); } }
body.home .tp-page-scroll-wrapper .section .elementor-widget-image img { position: relative; z-index: 1; mix-blend-mode: multiply; }   /* le fond blanc de l'illustration laisse voir le halo */

/* titres découpés en mots (home-fx.js) */
body.home .tp-page-scroll-wrapper .fy-fx-w { display: inline-block; white-space: pre; will-change: transform, opacity, filter; }

/* cartes d'articles : perspective pour la bascule 3D */
body.home .fy-home-posts { perspective: 1100px; }
body.home .fy-home-posts .fy-post-card { transform-style: preserve-3d; backface-visibility: hidden; }

/* pagination fullpage : pastille or étirée pour la section active */
body.home #fp-nav ul li { width: 14px; height: 30px; margin: 4px 0; }
body.home #fp-nav ul li a span { width: 6px; height: 6px; margin: -3px 0 0 -3px; border-radius: 999px; background: rgba(218, 174, 81, .55) !important; transition: height .45s cubic-bezier(.32, .18, .22, 1), width .3s, background-color .3s, margin .45s cubic-bezier(.32, .18, .22, 1); }
body.home #fp-nav ul li a.active span, body.home #fp-nav ul li:hover a.active span { width: 6px; height: 26px; margin: -13px 0 0 -3px; background: #DAAE51 !important; }
body.home #fp-nav ul li:hover a span { width: 8px; height: 8px; margin: -4px 0 0 -4px; }

@media (prefers-reduced-motion: reduce) {
  .fy-fx-beam { display: none !important; }
  .fy-fx-orb { opacity: .8; }
  .fy-fx-orb::before { animation: none; }
  body.home .tp-page-scroll-wrapper .fy-fx-w { opacity: 1 !important; transform: none !important; filter: none !important; }
}

/* Dernière section : Contact + pied de page dans une seule zone à défilement libre (le pied de page est placé dans la
   section Contact, index.html) — le rideau ne joue qu'en arrivant sur Contact */
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.fy-last-section > .fp-tableCell > .fy-footer { margin: 0 !important; flex: 0 0 auto; }
html.fp-enabled body.home:not(.fp-responsive) .tp-page-scroll-wrapper > .section.fy-last-section > .fp-tableCell > .elementor { margin-top: 0 !important; margin-bottom: 0 !important; }