/* garde anti-debordement horizontal (mobile) */
html{overflow-x:hidden;}
/* ══════════════════════════════════════════════════════════
   ELYADE ENERGY - EXTRA STYLES
   Nouveaux composants (page Claude) + moteur d'animations.
   S'ajoute a style.css sans le modifier. Palette et tokens
   herites de style.css (--gold, --bg, --card, --border...).
   ══════════════════════════════════════════════════════════ */

/* ── Reveals directionnels (moteur elyade-motion.js) ───────── */
[data-reveal]{opacity:0;transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform;}
[data-reveal="up"]{transform:translateY(30px);}
[data-reveal="down"]{transform:translateY(-30px);}
[data-reveal="left"]{transform:translateX(-40px);}
[data-reveal="right"]{transform:translateX(40px);}
[data-reveal="scale"]{transform:scale(.94);}
[data-reveal="fade"]{transform:none;}
[data-reveal].is-in{opacity:1;transform:none;}

/* ── Barre de progression de lecture ───────────────────────── */
.read-progress{
  position:fixed;top:0;left:0;height:2px;width:100%;
  background:linear-gradient(90deg,var(--gold),var(--gold-light));
  transform:scaleX(0);transform-origin:left;
  z-index:200;pointer-events:none;
  box-shadow:0 0 12px rgba(212,160,60,.5);
}

/* ── Header compact au defilement ──────────────────────────── */
header.scrolled{padding:9px 0;background:rgba(8,8,18,0.94);}
header.scrolled .logo{font-size:1.35rem;}

/* ── CTA magnetique / relief ───────────────────────────────── */
.magnetic{transition:transform .25s cubic-bezier(.22,.61,.36,1),background .3s,box-shadow .3s,color .3s;}

/* ── Mots qui tournent (hero) ──────────────────────────────── */
.rotate-word{display:inline-block;color:var(--gold);transition:opacity .35s,transform .35s;}
.rotate-word--out{opacity:0;transform:translateY(-12px);}

/* ── Marquee / bandeau d'outils en boucle ──────────────────── */
.marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);}
.marquee-track{display:flex;width:max-content;gap:0;white-space:nowrap;will-change:transform;animation:elyMarquee 34s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes elyMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.tool-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 18px;border:1px solid var(--border);
  border-radius:50px;background:var(--card);
  color:var(--muted);font-size:.86rem;font-weight:500;white-space:nowrap;
}
.tool-chip b{color:var(--gold);font-weight:600;}
.tool-chip{margin-right:14px;}

/* ── Teaser méthode (accueil, section Développement IA) ────── */
.method-quote{
  font-family:'Avenir','Avenir Next',Montserrat,system-ui,sans-serif;
  font-style:italic;color:var(--gold);font-size:1.08rem;
  max-width:640px;margin:6px auto 18px;line-height:1.6;
}
.method-row{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
  max-width:760px;margin:0 auto 24px;
}
.method-row .tool-chip{margin-right:0;white-space:normal;text-align:center;}

/* ── KPI / compteurs ───────────────────────────────────────── */
.kpi-row{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:900px;margin:0 auto;
}
.kpi{
  text-align:center;padding:26px 16px;border:1px solid var(--border);
  border-radius:14px;background:var(--card);backdrop-filter:blur(10px);
  transition:border-color .35s,transform .35s;
}
.kpi:hover{border-color:var(--border-hover);transform:translateY(-4px);}
.kpi .kpi-num{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:2.6rem;font-weight:700;color:var(--gold);line-height:1;
}
.kpi .kpi-label{font-size:.8rem;color:var(--muted);margin-top:10px;line-height:1.5;}

/* ── Etapes numerotees (parcours 01-05) ────────────────────── */
.steps{max-width:820px;margin:0 auto;position:relative;}
.step{
  display:grid;grid-template-columns:88px 1fr;gap:24px;align-items:start;
  padding:26px 0;border-top:1px solid var(--border);
}
.step:first-child{border-top:none;}
.step .step-num{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:3rem;font-weight:700;line-height:1;
  color:transparent;-webkit-text-stroke:1.4px var(--gold);text-stroke:1.4px var(--gold);
  opacity:.55;transition:opacity .4s,color .4s;
}
.step.is-in .step-num,.step:hover .step-num{opacity:1;color:rgba(212,160,60,.14);}
.step h3{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:1.18rem;color:var(--gold);margin-bottom:8px;font-weight:600;
}
.step p{color:var(--muted);font-size:.92rem;line-height:1.7;}
.step .step-deliver{
  display:inline-block;margin-top:10px;font-size:.76rem;color:var(--muted);
  padding:4px 12px;border:1px solid var(--border);border-radius:6px;
  background:rgba(212,160,60,.05);
}

/* ── Cartes prestation (avec livrables) ────────────────────── */
.presta{
  background:var(--card);border:1px solid var(--border);
  border-radius:16px;padding:32px;transition:all .35s ease;
}
.presta:hover{border-color:var(--border-hover);transform:translateY(-4px);box-shadow:0 14px 44px rgba(212,160,60,.07);background:var(--card-hover);}
.presta .presta-icon{font-size:2rem;margin-bottom:14px;}
.presta h3{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:1.25rem;color:var(--gold);margin-bottom:10px;font-weight:600;
}
.presta > p{color:var(--muted);font-size:.9rem;line-height:1.7;margin-bottom:16px;}
.presta .deliver-title{font-size:.74rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);opacity:.8;margin-bottom:10px;}
.presta ul{list-style:none;}
.presta li{
  position:relative;padding-left:22px;margin-bottom:8px;
  font-size:.88rem;color:var(--text);line-height:1.6;
}
.presta li::before{content:'\2713';position:absolute;left:0;color:var(--gold);font-weight:700;}

/* ── Grille facettes metier ────────────────────────────────── */
.metier{
  background:var(--card);border:1px solid var(--border);
  border-radius:14px;padding:24px;transition:all .35s ease;
}
.metier:hover{border-color:var(--border-hover);transform:translateY(-4px);background:var(--card-hover);}
.metier .m-top{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.metier .m-icon{font-size:1.6rem;}
.metier h3{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:1.02rem;color:var(--gold);font-weight:600;line-height:1.3;
}
.metier p{color:var(--muted);font-size:.86rem;line-height:1.65;margin-bottom:12px;}
.metier .m-tool{
  display:block;font-size:.76rem;color:var(--text);
  padding-top:12px;border-top:1px solid var(--border);
}
.metier .m-tool b{color:var(--gold);font-weight:600;}

/* ── Tableau avant / apres ─────────────────────────────────── */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:940px;margin:0 auto;}
.compare-col{border-radius:16px;padding:30px;border:1px solid var(--border);}
.compare-col.before{background:rgba(255,255,255,0.02);}
.compare-col.after{background:rgba(212,160,60,0.05);border-color:var(--border-hover);}
.compare-col h3{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:1.1rem;margin-bottom:18px;font-weight:600;
}
.compare-col.before h3{color:var(--muted);}
.compare-col.after h3{color:var(--gold);}
.compare-col ul{list-style:none;}
.compare-col li{position:relative;padding-left:26px;margin-bottom:13px;font-size:.9rem;line-height:1.6;color:var(--muted);}
.compare-col.before li::before{content:'\2717';position:absolute;left:0;color:rgba(255,255,255,.3);font-weight:700;}
.compare-col.after li{color:var(--text);}
.compare-col.after li::before{content:'\2713';position:absolute;left:0;color:var(--gold);font-weight:700;}

/* ── FAQ ───────────────────────────────────────────────────── */
.faq{max-width:820px;margin:0 auto;}
.faq-item{border:1px solid var(--border);border-radius:12px;margin-bottom:10px;overflow:hidden;background:var(--card);transition:border-color .3s;}
.faq-item:hover{border-color:var(--border-hover);}
.faq-q{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:18px 22px;cursor:pointer;
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:1rem;color:var(--text);font-weight:500;
  background:none;border:none;width:100%;text-align:left;
}
.faq-q::after{content:'+';color:var(--gold);font-size:1.4rem;line-height:1;transition:transform .3s;flex-shrink:0;}
.faq-item.open .faq-q::after{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease;}
.faq-item.open .faq-a{max-height:340px;}
.faq-a p{padding:0 22px 20px;color:var(--muted);font-size:.9rem;line-height:1.75;}

/* ── Bandeau CTA (fond parallax) ───────────────────────────── */
.cta-band{text-align:center;border-radius:20px;padding:56px 32px;border:1px solid var(--border);background:rgba(212,160,60,0.04);position:relative;overflow:hidden;}
.cta-band .quote{margin-top:26px;font-style:italic;color:var(--muted);font-size:.92rem;}

/* ── Lien de renvoi discret entre les deux pages IA ────────── */
.page-crosslink{max-width:720px;margin:22px auto 0;text-align:center;font-size:.86rem;color:var(--muted);}
.page-crosslink a{color:var(--gold);}

/* ── Bandeau consentement cookies (RGPD) ───────────────────── */
.cookie-consent{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:300;
  max-width:960px;margin:0 auto;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:rgba(12,14,20,0.97);backdrop-filter:blur(16px);
  border:1px solid var(--border-hover);border-radius:14px;
  padding:16px 20px;box-shadow:0 12px 40px rgba(0,0,0,0.45);
  transform:translateY(140%);opacity:0;
  transition:transform .45s cubic-bezier(.22,.61,.36,1),opacity .45s;
}
.cookie-consent.show{transform:translateY(0);opacity:1;}
.cookie-consent .cc-text{flex:1 1 300px;color:var(--muted);font-size:0.86rem;line-height:1.6;margin:0;}
.cookie-consent .cc-btns{display:flex;gap:10px;flex-shrink:0;}
.cookie-consent button{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:0.86rem;font-weight:600;cursor:pointer;border-radius:8px;padding:10px 22px;transition:all .3s;
}
.cookie-consent .cc-accept{background:var(--gold);color:var(--bg);border:none;}
.cookie-consent .cc-accept:hover{background:var(--gold-light);}
.cookie-consent .cc-refuse{background:transparent;color:var(--muted);border:1px solid var(--border-hover);}
.cookie-consent .cc-refuse:hover{color:var(--gold);border-color:var(--gold);}
@media (max-width:600px){
  .cookie-consent{flex-direction:column;align-items:stretch;}
  .cookie-consent .cc-btns{justify-content:flex-end;}
}
.cookie-consent .cc-more{color:var(--gold);text-decoration:underline;}

/* ── Page legale (confidentialite) ─────────────────────────── */
.legal{max-width:820px;margin:0 auto;}
.legal h2{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  font-size:1.2rem;color:var(--gold);font-weight:600;
  margin:30px 0 12px;padding-top:22px;border-top:1px solid var(--border);
}
.legal h2:first-child{border-top:none;padding-top:0;margin-top:0;}
.legal p{color:var(--muted);font-size:0.92rem;line-height:1.8;margin-bottom:12px;}
.legal ul{list-style:none;margin:0 0 14px;}
.legal li{position:relative;padding-left:20px;margin-bottom:8px;color:var(--muted);font-size:0.92rem;line-height:1.7;}
.legal li::before{content:'\25AA';position:absolute;left:0;color:var(--gold);}
.legal a{color:var(--gold);}
.legal strong{color:var(--text);font-weight:600;}

/* ── Accessibilite : couper les animations si demande ──────── */
@media (prefers-reduced-motion: reduce){
  [data-reveal],.magnetic,.rotate-word,.marquee-track{transition:none!important;animation:none!important;transform:none!important;opacity:1!important;}
  .read-progress{display:none;}
  html{scroll-behavior:auto;}
}

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width:1024px){
  .kpi-row{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:768px){
  .compare{grid-template-columns:1fr;}
  .step{grid-template-columns:60px 1fr;gap:16px;}
  .step .step-num{font-size:2.2rem;}
  .kpi .kpi-num{font-size:2.1rem;}
}
@media (max-width:480px){
  .kpi-row{grid-template-columns:1fr;}
  .grid3{grid-template-columns:1fr;}
}

/* ── Glossaire ─────────────────────────────────────────────── */
.gloss{max-width:860px;margin:0 auto;}
.gloss-search{
  width:100%;padding:13px 18px;margin-bottom:28px;
  background:rgba(255,255,255,0.04);border:1px solid var(--border);
  border-radius:10px;color:#fff;font-size:0.95rem;outline:none;
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  transition:border-color .3s;
}
.gloss-search:focus{border-color:var(--gold);}
.gloss-letter{
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
  color:var(--gold);font-size:1.3rem;font-weight:700;
  margin:26px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--border);
}
.gloss-item{
  display:grid;grid-template-columns:170px 1fr;gap:16px;
  padding:9px 0;border-bottom:1px solid rgba(255,255,255,0.04);
}
.gloss-term{color:var(--gold);font-weight:600;font-size:0.92rem;}
.gloss-def{color:var(--muted);font-size:0.9rem;line-height:1.65;}
.gloss-none{color:var(--muted);text-align:center;padding:20px 0;}
@media (max-width:600px){.gloss-item{grid-template-columns:1fr;gap:2px;}}

/* ── Widget rendez-vous (Cadran) ───────────────────────────── */
#rdvWidget{text-align:left;}
.rdv-sub{color:var(--muted);font-size:.9rem;margin-bottom:18px;line-height:1.7;}
.rdv-label{font-size:.74rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin:16px 0 10px;}
.rdv-days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin;}
.rdv-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.rdv-chip{
  padding:9px 12px;border:1px solid var(--border);border-radius:8px;
  background:rgba(255,255,255,0.04);color:var(--text);font-size:.84rem;
  cursor:pointer;white-space:nowrap;transition:all .25s;
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;
}
.rdv-chip:hover{border-color:var(--gold);}
.rdv-chip.active{background:var(--gold);color:var(--bg);border-color:var(--gold);font-weight:600;}
.rdv-form{margin-top:18px;display:flex;flex-direction:column;gap:10px;}
.rdv-form input,.rdv-form textarea{
  width:100%;padding:11px 14px;background:rgba(255,255,255,0.04);
  border:1px solid var(--border);border-radius:8px;color:#fff;box-sizing:border-box;
  font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;font-size:.9rem;outline:none;transition:border-color .3s;
}
.rdv-form input:focus,.rdv-form textarea:focus{border-color:var(--gold);}
.rdv-err{color:#e08585;font-size:.86rem;margin:0;}
.rdv-note{color:var(--muted);font-size:.88rem;line-height:1.7;}
.rdv-ok{text-align:center;padding:22px 6px;}
.rdv-ok h4{color:var(--gold);font-size:1.15rem;margin-bottom:10px;font-family:'Avenir','Avenir Next LT Pro','Avenir Next',Montserrat,system-ui,sans-serif;}
.rdv-ok p{color:var(--text);font-size:.92rem;margin-bottom:8px;}
@media (max-width:480px){.rdv-slots{grid-template-columns:repeat(3,minmax(0,1fr));}}

/* Widget RDV : contention colonne (empeche l'etirement sur mobile) */
.contact-grid{min-width:0;}
.contact-grid > *{min-width:0;}
#rdvWidget{min-width:0;max-width:100%;}
.rdv-days{min-width:0;}
.rdv-form input,.rdv-form textarea{max-width:100%;}
