/* ═══ Motion — GSAP + Lenis (/lead-animatii, 2026-09-27), HOME PAGE ONLY: linked from index.html alone.
   Everything sits behind .a-anim, which poarta.js puts on <html> only on the page that asks for it
   (data-miscare="gsap"), only without reduced motion, and takes back if animatii.js has not started within 3 s: the
   reduced-motion visitor, the no-JS visitor and a failed load all get the page as it was.
   Past the 0.8 s house limit on purpose: the layer's own limits are agency-btp config/motion.json → strat_gsap.
   Colours from the palette in styles.css; no :root here (the vocabulary rule). ═══ */

/* Loading screen with the client's logo, « masca » variant (the logo exists only as a PNG): the picture is uncovered
   left to right on the hero's navy, keeping its own colours (it does not take the negative). Markup right after
   <body>. Once per visit (Iulian, 2026-09-27: a live site, not a demo): on a later load of the same visit poarta.js
   puts .a-ecran-sarit on <html> and the screen is never drawn; animatii.js then skips it. Hard cap: a-ecran-plasa hides
   it 3.5 s after it appeared whatever happens, and poarta.js gives the scroll back at the same moment. */
.a-ecran{display:none;--a-ecran-fond:var(--cc-navy);--a-ecran-l:340px}
@media (max-width:599px){.a-ecran{--a-ecran-l:240px}}
.a-anim .a-ecran{position:fixed;inset:0;z-index:2147483600;display:flex;align-items:center;justify-content:center;
  background:var(--a-ecran-fond);animation:a-ecran-plasa 1ms linear 3.5s forwards}
.a-anim.a-ecran-sarit .a-ecran{display:none}
.a-ecran-gata .a-ecran{pointer-events:none}
/* a set width, not 100 %: centred in a flex box the picture otherwise falls back to its intrinsic size */
.a-ecran__img{display:block;width:var(--a-ecran-l);height:auto;
  animation:a-ecran-dezvaluie 1.3s cubic-bezier(.65,0,.35,1) .2s both,a-ecran-apropie 1.9s cubic-bezier(.2,.7,.2,1) both}
@keyframes a-ecran-apropie{from{scale:.94}to{scale:1}}
@keyframes a-ecran-dezvaluie{from{clip-path:inset(-2% 100% -2% -2%)}to{clip-path:inset(-2% -2% -2% -2%)}}
@keyframes a-ecran-plasa{to{visibility:hidden;opacity:0}}

/* Lenis (smooth wheel; touch scrolling stays native): its own required rules, and the page's CSS smooth scrolling
   (styles.css, html) must step aside for it */
html.lenis,html.lenis body{height:auto}
html.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:clip}

/* the hero waits hidden for its entrance (released by .a-pret, the moment animatii.js has set its first frame) —
   exactly what CFG.hero animates */
.a-anim:not(.a-pret) .hero :is(.hero__title,.hero__rule,[data-slogan],.hero__lead,.hero__sub,.hero__actions,.hero__strip > span),
.a-anim:not(.a-pret) #site-header{visibility:hidden}
/* The photo is the page's largest element (LCP): on the first visit it is drawn from the first paint, under the
   loading screen, where nobody sees it before the trowel's mask is set — waiting for the GSAP layer kept the lab LCP
   at 3.5 s on a simulated phone (2026-10-27). Without the screen (a later visit) it still waits, or it would blink. */
.a-anim.a-ecran-sarit:not(.a-pret) .hero .hero__media{visibility:hidden}

/* the page's own entrance (.reveal) steps aside: under .a-anim script.js marks every .reveal as in at once, and with no
   transition GSAP reads the final state and no CSS transition drags behind its per-frame writes. The métier cards keep
   their colour answer to the mouse, without the transform GSAP deals them with */
.a-anim .reveal.is-in{transition:none}
.a-anim #services [data-metiers] > li{transition:border-color .25s var(--ease)}
.a-anim .faq__row.reveal.is-in{transition:background-color .2s var(--ease)}

/* the hero's photo in one block, carrying the trowel's mask (wrapper written in the HTML by pagini.mjs inside
   .hero__media, so the photo keeps its place and the frame its own clip). Outside .a-anim too: the block is in the
   markup for every visitor, and the photo's height:100% needs it to fill the frame */
.a-erou-poza{position:absolute;inset:0;pointer-events:none}

/* SplitText's line masks: a clip-path reaching a little past the line (accents, descenders) replaces its inline
   overflow:clip — no padding, which would grow the title (adjacent block margins collapse) */
.a-anim .a-ligne-mask{overflow:visible !important;clip-path:inset(-.25em -.1em -.28em -.1em)}

/* printing mid-page: every element shows in its place, whatever the scroll had reached */
@media print{
  .a-ecran{display:none !important}
  .a-anim [style*="opacity"]{opacity:1 !important}
  .a-anim [style*="visibility"]{visibility:visible !important}
  .a-anim main [style*="transform"],.a-anim #site-header[style*="transform"]{transform:none !important}
  .a-anim main [style*="clip-path"]{clip-path:none !important}
}
