

.page-template-page-accueil .qly-hero__content{
  opacity: 0;
  transition: opacity 400ms ease 60ms;
  will-change: opacity;
}
.page-template-page-accueil .qly-hero__content.is-visible{
  opacity: 1;
}

.page-template-page-accueil #content-wrap{max-width:100%;padding:0}
.qly-hero{position:relative;background-color:#E9F7F8;background-repeat:no-repeat;background-size:cover;background-position:55% 100%}
.qly-hero__overlay{background:rgba(255,255,255,0)}
.qly-hero__inner{max-width:1280px;margin:0 auto;padding:120px 20px 80px;display:flex;align-items:center;min-height:600px}
.qly-hero__content{max-width:520px}
.qly-hero__title{margin:0 0 24px;font-family:'Outfit','Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:600;font-size:44px;line-height:1.25;color:#004563}
.qly-hero__text{margin:0 0 32px;font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;font-size:16px;line-height:1.6;color:#004563}
@media (min-width:1024px) and (max-width:1919px){.qly-hero{background-position:58% 100%;background-size:95% auto}}
@media (min-width:1920px){.qly-hero{background-size:contain;background-position:center bottom}}
@media (max-width:768px){.qly-hero{background-size:cover;background-position:55% 100%}.qly-hero__inner{padding:80px 20px 60px;min-height:420px}.qly-hero__title{font-size:30px;line-height:1.3}.qly-hero__text{font-size:15px}}

.qly-about{position:relative;background-color:#F4F5F6;padding:80px 20px 100px;overflow:hidden}
.qly-about__inner{max-width:1280px;margin:0 auto;position:relative}
.qly-about__header{position:relative;max-width:980px;margin:0 auto 60px;text-align:center;z-index:1}
.qly-about__title-wrapper{display:inline-flex;align-items:center;gap:16px}
.qly-about__deco{display:inline-flex}
.qly-about__deco img{display:block;max-height:36px;width:auto}
.qly-about__deco--left{order:-1}
.qly-about__deco--right{margin-left:12px}
.qly-about__text{margin:24px auto 0;font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;font-size:16px;line-height:1.6;color:#004563}
.qly-about__title-wrapper,.qly-about__text{position:relative;z-index:1}
.qly-about__header::before{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
  background-image:url('/wp-content/uploads/2025/12/LOUPE_BLEUQUALYSE-scaled.png');
  background-repeat:no-repeat;
  background-size:contain;
  width:clamp(220px,28vw,610px);
  aspect-ratio:610/1200;
  height:auto;
  right:100%;
  top:clamp(70px,8vw,90px);

  /* ✅ on garde ton placement EXISTANT + on ajoute l'offset animé */
  transform: translateX(clamp(80px,-4vw,-80px)) translateX(var(--qly-deco-x, 0px));
}

@media (max-width:960px){.qly-about__header::before{content:none}}

.qly-expertises{margin-top:70px;text-align:center;position:relative;z-index:1}
.qly-expertises__header{margin-bottom:40px}
.qly-expertises__title-wrapper{display:inline-flex;align-items:center;gap:16px}
.qly-expertises__grid{display:grid;grid-template-columns:repeat(4,207px);gap:24px;justify-content:center;max-width:980px;margin:0 auto 80px}
.qly-exp-card{position:relative;width:207px;height:236px;border-radius:24px;overflow:hidden;background-color:#fff}
.qly-exp-card__inner{position:relative;width:100%;height:100%}
.qly-exp-card__front{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:30px 0 0;transition:opacity .25s ease;z-index:2}
.qly-exp-card__icon img{max-width:110px;height:auto}
.qly-exp-card__label{width:100%;min-height:66px;margin-top:auto;padding:10px 12px;border-radius:0 0 24px 24px;background-color:#004563;color:#fff;font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;font-size:19px;line-height:1.3;display:flex;align-items:center;justify-content:center}
.qly-exp-card__hover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px 16px 32px;opacity:0;transform:translateY(120px);transition:opacity .4s ease-out,transform .4s ease-out;z-index:3}
.qly-exp-card__hover img{width:80%;height:auto;opacity:.5}
.qly-exp-card:hover .qly-exp-card__front{opacity:0}
.qly-exp-card:hover .qly-exp-card__hover{opacity:1;transform:translateY(0)}
.qly-expertises__cta{text-align:center}
.qly-expertises__cta .qly-btn{margin:0 auto}
.qly-exp-card--1:hover{background-color:#2cb6bb}
.qly-exp-card--2{background-color:#A3C79B}
.qly-exp-card--3:hover{background-color:#2cb6bb}
.qly-exp-card--4{background-color:#F2920F}
.qly-exp-card--5{background-color:#F2920F}
.qly-exp-card--6:hover{background-color:#2cb6bb}
.qly-exp-card--7{background-color:#2CB6BB}
.qly-exp-card--8:hover{background-color:#2cb6bb}
.qly-about__inner::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
  background-image:url('/wp-content/uploads/2025/12/LOUPE_VERTCLAIR.png');
  background-repeat:no-repeat;
  background-size:contain;
  width:clamp(220px,26vw,499px);
  aspect-ratio:499/280;
  height:auto;
  left:100%;
  top:205px;

  /* ✅ placement EXISTANT + offset animé */
  transform: translateX(clamp(-140px,-10vw,-60px)) translateX(var(--qly-deco-x, 0px));
}

@media (max-width:960px){.qly-about__inner::after{content:none}}
@media (max-width:992px){.qly-expertises__grid{grid-template-columns:repeat(3,207px)}}
@media (max-width:768px){.qly-about{padding:60px 16px 80px}.qly-about__deco img{max-height:24px}.qly-expertises__grid{grid-template-columns:repeat(2,207px);max-width:520px}.qly-about__header::before{width:clamp(140px,46vw,220px);left:clamp(-110px,-18vw,-60px);top:clamp(40px,8vw,90px);opacity:.95}.qly-about::after{width:clamp(140px,42vw,220px);right:-60px;top:80px}}
@media (max-width:600px){.qly-expertises__grid{grid-template-columns:207px;max-width:360px}.qly-about__header{margin-bottom:40px}.qly-expertises{margin-top:50px}}

.qly-stats{background-color:#ecf1ed;padding:80px 20px 100px}
.qly-stats__inner{max-width:780px;margin:0 auto;text-align:center}
.qly-stats__header{margin-bottom:50px}
.qly-stats__title-wrapper{display:inline-flex;align-items:center;gap:14px}
.qly-stats__deco{display:inline-flex}
.qly-stats__deco img{display:block;max-height:32px;width:auto}
.qly-stats__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:80px;row-gap:50px}
.qly-stat{text-align:center}
.qly-stat__icon img{display:block;margin:0 auto 14px;max-width:90px;height:auto}
.qly-stat__value{margin-bottom:4px;font-family:'Open Sans','Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:700;font-size:26px;line-height:1.2;color:#004563}
.qly-stat__text{font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;font-size:18px;line-height:1.2;color:#004563}
@media (max-width:768px){.qly-stats{padding:60px 16px 80px}.qly-stats__grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;row-gap:40px}.qly-stat__value{font-size:24px}}
@media (max-width:480px){.qly-stats__grid{grid-template-columns:repeat(1,minmax(0,1fr));row-gap:30px}}

.qly-innovation{background-color:#fff;padding:80px 20px 100px}
.qly-innovation__inner{max-width:1280px;margin:0 auto}
.qly-innovation__card{display:grid;grid-template-columns:1fr 1fr;border-radius:32px;overflow:hidden;background-color:#024563;box-shadow:0 10px 35px rgba(0,0,0,.08)}
.qly-innovation__content{padding:60px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.qly-innovation__title{margin:0 0 24px;font-family:'Outfit','Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:600;font-size:40px;line-height:1.2;color:#fff}
.qly-innovation__text{margin:0 0 32px;font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;font-size:16px;line-height:1.6;color:#fff;max-width:520px}
.qly-innovation__btn{align-self:flex-start}
.qly-innovation__media{position:relative;background-color:#000}
.qly-innovation__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
@media (max-width:992px){.qly-innovation__card{grid-template-columns:minmax(0,1.1fr) minmax(0,1.1fr)}.qly-innovation__content{padding:40px 32px 40px 40px}.qly-innovation__title{font-size:32px}}
@media (max-width:768px){.qly-innovation{padding:60px 16px 80px}.qly-innovation__card{grid-template-columns:1fr}.qly-innovation__media{order:-1;height:220px}.qly-innovation__content{padding:32px 24px 40px}.qly-innovation__title{font-size:28px}}
@media (max-width:480px){.qly-innovation__media{height:190px}}

.qly-news{position:relative;background-color:#ecf1ed;padding:60px 20px 60px;}
.qly-news__inner{max-width:1280px;margin:0 auto;text-align:center}
.qly-news__header{margin-bottom:40px}
.qly-news__title-wrapper{display:inline-flex;align-items:center;gap:14px}
.qly-news__title-deco img{display:block;width:auto;max-height:32px}
.qly-news::after{
  content:"";
  position:absolute;
  pointer-events:none;
  background-image:var(--qly-news-deco);
  background-repeat:no-repeat;
  background-size:contain;
  opacity:.9;
  z-index:1;
  width:clamp(460px,48vw,780px);
  aspect-ratio:1/1;
  height:auto;
  right:clamp(-480px,-32vw,-260px);
  top:50%;

  /* ✅ on garde translateY(-50%) + on ajoute l'offset animé */
  transform: translateY(-50%) translateX(var(--qly-deco-x, 0px));
}

@media (max-width:1000px){.qly-news::after{content:none}}
.qly-news__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:980px;margin:0 auto 40px;z-index:5;position:relative}
.qly-news-card{background-color:#fff;border-radius:24px;overflow:hidden;box-shadow:0 8px 20px rgba(0,0,0,.06);display:flex;flex-direction:column}
.qly-news-card__media{display:block;position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#000}
.qly-news-card__image{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .25s ease,filter .25s ease,opacity .25s ease;filter:none;opacity:1}
.qly-news-card__media--placeholder{background-color:#d9e3e6}
.qly-news-card__placeholder{display:block;width:100%;height:100%}
.qly-news-card__body{flex:1;padding:16px 20px 22px;display:flex;flex-direction:column;justify-content:flex-start;background-color:#fff;transition:background-color .25s ease}
.qly-news-card__date{margin-bottom:16px;font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;font-size:20px;line-height:1.2;color:#004563;text-align:left;transition:color .25s ease}
.qly-news-card__title{margin:0;font-family:'Fira Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:600;font-size:20px;line-height:1.2;color:#004563;text-align:left;transition:color .25s ease}
.qly-news-card__title-link{color:inherit;text-decoration:none}
.qly-news-card__title-link:hover{text-decoration:underline;color:inherit}
.qly-news-card:hover .qly-news-card__body{background-color:#004563}
.qly-news-card:hover .qly-news-card__date,.qly-news-card:hover .qly-news-card__title{color:#fff}
.qly-news-card:hover .qly-news-card__image{filter:brightness(.78);transform:scale(1.03);opacity:1}
.qly-news__cta{z-index:999;position:relative;text-align:center;top:20px}
.qly-news__cta .qly-btn{margin:0 auto}
@media (max-width:992px){.qly-news__grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:800px}.qly-news::after{right:-120px;top:-20px;width:340px;height:340px}}
@media (max-width:768px){.qly-news{padding:60px 16px 80px}.qly-news__grid{grid-template-columns:repeat(1,minmax(0,1fr));max-width:420px}.qly-news__header{margin-bottom:30px}.qly-news::after{right:-160px;top:40%;width:320px;height:320px;opacity:.6}}

/* =========================
   REVEAL SYSTEM (Home)
   - fade / fade+slide
   - stagger via --qly-delay
========================= */

.page-template-page-accueil .qly-reveal{
  --qly-delay: 0ms;
  --qly-dur: 550ms;

  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity var(--qly-dur) ease var(--qly-delay),
    transform var(--qly-dur) cubic-bezier(.22,1,.36,1) var(--qly-delay);
  will-change: opacity, transform;
}

/* Fade only (no slide) */
.page-template-page-accueil .qly-reveal.qly-reveal--fade{
  transform: none;
}

.page-template-page-accueil .qly-reveal.is-visible{
  opacity: 1;
  transform: none;
}

/* =========================
   DECO SLIDE (pseudo-elements)
   - pas de fade
   - départ hors écran (loin)
   - délai + déclenchement après contenu
========================= */

.page-template-page-accueil .qly-deco-slide{
  /* Offset animé (X) + delay configurable */
  --qly-deco-x: 0px;
  --qly-deco-delay: 320ms; /* ✅ délai par défaut */
  --qly-deco-dur: 900ms;
}

/* IMPORTANT:
   Tant que .qly-deco-ready n'est pas là → PAS de transition
   => évite le "flash" au chargement.
*/
.page-template-page-accueil .qly-deco-slide::before,
.page-template-page-accueil .qly-deco-slide::after{
  transition: none;
  will-change: transform;
}

/* Quand prêt, on active la transition + delay */
.page-template-page-accueil .qly-deco-slide.qly-deco-ready::before,
.page-template-page-accueil .qly-deco-slide.qly-deco-ready::after{
  transition:
    transform var(--qly-deco-dur) cubic-bezier(.22,1,.36,1) var(--qly-deco-delay);
}

/* Départ hors écran (plus loin = jamais visible au début) */
.page-template-page-accueil .qly-about__header.qly-deco-slide{ --qly-deco-x: -520px; --qly-deco-delay: 360ms; }
.page-template-page-accueil .qly-about__inner.qly-deco-slide{  --qly-deco-x:  520px; --qly-deco-delay: 420ms; }
.page-template-page-accueil .qly-news.qly-deco-slide{          --qly-deco-x:  620px; --qly-deco-delay: 360ms; }

/* Quand visible => offset à 0 (donc position finale) */
.page-template-page-accueil .qly-about__header.qly-deco-slide.is-visible,
.page-template-page-accueil .qly-about__inner.qly-deco-slide.is-visible,
.page-template-page-accueil .qly-news.qly-deco-slide.is-visible{
  --qly-deco-x: 0px;
}
