/* ============================================================
   EFFETS PRO — nav verre liquide, scroll enrichi, objet 3D hero
   Encapsulé, réversible, respecte prefers-reduced-motion.
   ============================================================ */

/* ---- 1. NAVIGATION VERRE LIQUIDE (pilule flottante au scroll) ---- */
#nav{transition:padding .5s cubic-bezier(.2,.7,.2,1);}
#nav.scrolled{background:transparent!important;box-shadow:none!important;padding:14px 0 0;}
#nav.scrolled .wrap{
  max-width:1120px;
  padding:11px 16px 11px 20px;
  border-radius:999px;
  background:rgba(22,56,44,.5);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  border:1px solid rgba(242,184,75,.30);
  box-shadow:0 12px 38px rgba(0,0,0,.30),
             inset 0 1px 0 rgba(255,255,255,.25),
             inset 0 -1px 0 rgba(0,0,0,.14);
  position:relative;
  transition:background .5s,border-color .5s,box-shadow .5s,max-width .5s,padding .5s;
}
#nav.scrolled .wrap::after{ /* reflet lumineux — épouse la pilule, sans rognage du parent */
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(100deg,transparent 42%,rgba(255,255,255,.18) 50%,transparent 58%);
  background-size:260% 100%;background-position:150% 0;
  opacity:0;pointer-events:none;
}
#nav.scrolled .wrap:hover::after{animation:fxSheen 1.1s ease;}
@keyframes fxSheen{0%{background-position:150% 0;opacity:0}18%{opacity:1}100%{background-position:-60% 0;opacity:0}}
body.dark #nav.scrolled .wrap{background:rgba(10,26,19,.5);}
#nav.clair.scrolled .wrap{
  background:rgba(246,247,245,.55);
  border-color:rgba(169,133,47,.32);
  box-shadow:0 12px 34px rgba(80,98,90,.18),
             inset 0 1px 0 rgba(255,255,255,.7);
}

/* ---- 2. ANIMATIONS AU SCROLL ENRICHIES ---- */
.fx-rise{opacity:0;transform:translateY(28px);
  transition:opacity .8s ease, transform .9s cubic-bezier(.2,.7,.2,1);
  will-change:opacity,transform;}
.fx-rise.fx-in{opacity:1;transform:none;}
.fx-zoom{opacity:0;transform:scale(1.08);
  transition:opacity 1s ease, transform 1.2s cubic-bezier(.2,.7,.2,1);
  will-change:opacity,transform;}
.fx-zoom.fx-in{opacity:1;transform:none;}

/* ---- 3. OBJET 3D DANS LE HERO ---- */
#fx3d{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.hero .wrap{position:relative;z-index:4;}

@media(prefers-reduced-motion:reduce){
  .fx-rise,.fx-zoom{opacity:1!important;transform:none!important;}
  #fx3d{display:none!important;}
  #nav.scrolled .wrap::after{display:none;}
}

/* ---- 4. FINITION PREMIUM : transition de page + curseur ---- */
#fxpt{position:fixed;inset:0;z-index:99999;background:var(--sombre);display:flex;align-items:center;justify-content:center;
  transform:translateY(-101%);pointer-events:none;will-change:transform;transition:transform .62s cubic-bezier(.76,0,.24,1)}
#fxpt.cover{transform:translateY(0)}
#fxpt .m{display:flex;flex-direction:column;align-items:center;gap:14px;opacity:0;transition:opacity .3s}
#fxpt.cover .m{opacity:1}
#fxpt .m img{height:44px;width:auto}
#fxpt .m i{display:block;width:40px;height:3px;background:var(--ambre);border-radius:2px;transform:scaleX(.2);transition:transform .5s .08s}
#fxpt.cover .m i{transform:scaleX(1)}
@media(hover:hover) and (pointer:fine){
  html.fxcur,html.fxcur *{cursor:none !important}
  #fxdot,#fxring{position:fixed;top:0;left:0;z-index:100000;pointer-events:none;border-radius:50%;opacity:0}
  #fxdot{width:7px;height:7px;background:var(--ambre);box-shadow:0 0 10px rgba(242,184,75,.7)}
  #fxring{width:34px;height:34px;border:1.5px solid rgba(242,184,75,.55);
    transition:width .25s,height .25s,border-color .25s,background .25s,opacity .3s}
  #fxring.hot{width:54px;height:54px;border-color:var(--ambre);background:rgba(242,184,75,.10)}
}
/* Lettres de la nav : se soulèvent au passage du curseur (effet aimant) */
#nav ul a .ltr{display:inline-block;will-change:transform;transition:transform .16s cubic-bezier(.2,.7,.2,1)}
@media(prefers-reduced-motion:reduce){#nav ul a .ltr{transition:none;transform:none !important}}
@media(prefers-reduced-motion:reduce){#fxpt{display:none}}

/* ---- 5. PANNEAU ACCESSIBILITÉ (maison, sans service tiers) ---- */
#a11y-btn{position:fixed;left:22px;bottom:22px;z-index:9998;width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(242,184,75,.5);background:var(--vert);color:var(--ambre);cursor:pointer;
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px rgba(0,0,0,.32);transition:.25s}
#a11y-btn:hover{background:var(--ambre);color:var(--ambre-f);transform:translateY(-2px)}
#a11y-btn svg{width:26px;height:26px}
#a11y-panel{position:fixed;left:22px;bottom:86px;z-index:9999;width:302px;max-width:calc(100vw - 44px);
  background:rgba(22,56,44,.97);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border:1px solid rgba(242,184,75,.28);border-radius:16px;padding:18px;color:var(--blanc);
  box-shadow:0 24px 60px rgba(0,0,0,.42);opacity:0;visibility:hidden;transform:translateY(10px);transition:.28s}
#a11y-panel.open{opacity:1;visibility:visible;transform:none}
#a11y-panel h4{font-family:'JetBrains Mono',monospace;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ambre);margin:0 0 4px}
#a11y-panel .sub{color:var(--menthe);font-size:.78rem;margin-bottom:10px;line-height:1.45}
.a11y-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid rgba(255,255,255,.08)}
.a11y-row span{font-size:.9rem;color:var(--blanc)}
.a11y-seg{display:flex;gap:6px}
.a11y-seg button{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.72rem;border:1px solid rgba(242,184,75,.4);background:transparent;color:var(--menthe);border-radius:8px;padding:5px 9px;cursor:pointer}
.a11y-seg button.on{background:var(--ambre);color:var(--ambre-f);border-color:var(--ambre)}
.a11y-tg{position:relative;width:44px;height:24px;border-radius:999px;background:rgba(255,255,255,.18);border:none;cursor:pointer;transition:.25s;flex:none}
.a11y-tg::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.25s}
.a11y-tg.on{background:var(--ambre)}
.a11y-tg.on::after{left:23px}
#a11y-reset{margin-top:12px;width:100%;background:transparent;border:1px solid rgba(255,255,255,.2);color:var(--menthe);font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;padding:9px;border-radius:9px;cursor:pointer}
#a11y-reset:hover{border-color:var(--ambre);color:var(--ambre)}
/* états appliqués */
html.acc-fs1{font-size:112.5%}
html.acc-fs2{font-size:125%}
html.acc-underline a{text-decoration:underline !important}
html.acc-dys body,html.acc-dys h1,html.acc-dys h2,html.acc-dys h3,html.acc-dys p,html.acc-dys a,html.acc-dys span,html.acc-dys b,html.acc-dys li{font-family:Verdana,'Segoe UI',Tahoma,sans-serif !important}
html.acc-dys body,html.acc-dys p,html.acc-dys li{line-height:1.9 !important;letter-spacing:.02em;word-spacing:.06em}
html.acc-contrast{--txt:#1b241f;--menthe:#d6e7db}
html.acc-contrast body{color:#1b241f}
html.acc-contrast a:not(.btn):not(.cta){text-decoration:underline}
html.acc-contrast :focus-visible{outline:3px solid var(--ambre);outline-offset:2px}
html.acc-reduce #fx3d,html.acc-reduce #fxdot,html.acc-reduce #fxring,html.acc-reduce .pt,html.acc-reduce #grain{display:none !important}
html.acc-reduce.fxcur,html.acc-reduce.fxcur *{cursor:auto !important}
html.acc-reduce *,html.acc-reduce *::before,html.acc-reduce *::after{animation:none !important;transition:none !important}
html.acc-reduce .fx-rise,html.acc-reduce .fx-zoom,html.acc-reduce .reveal,html.acc-reduce .blup,html.acc-reduce .stagger{opacity:1 !important;transform:none !important;filter:none !important}
html.acc-reduce #fxpt{display:none !important}