/* ==========================================================================
   IMS Victoire — styles communs à toutes les pages
   Jetons de design, base, navigation, barre de progression, boutons,
   apparitions, pavement de logos partenaires et pied de page contact.
   Chargé en premier par chaque page, avant sa feuille propre
   (accueil.css, equipe.css, praticien.css).
   ========================================================================== */

/* ── Jetons ── */
:root{
  --ink:#050508;
  --ivory:#f3f2f3;
  --bone:#f3f2f3;
  --gold:#B8A98A;
  --gold-light:#cfc0a5;
  --night:#080915;
  --mid:#2A2A3A;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter',system-ui,sans-serif;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --pad:clamp(24px,6vw,90px);   /* marge latérale des sections */
  --nav-h:72px;
}

/* ── Base ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{font-family:var(--sans);background:var(--ink);color:var(--ivory);overflow-x:hidden;}
a{color:inherit;text-decoration:none}
button{background:none;border:none;color:inherit;font:inherit;cursor:pointer}
:focus-visible{outline:1px solid var(--gold);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* ── Navigation ── */
#navbar{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:500;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,60px);gap:1.5rem;transition:background .6s var(--ease-out),backdrop-filter .6s;}
#navbar.scrolled{background:rgba(5,5,8,.85);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);}
.nav-brand{display:flex;align-items:center;height:100%;opacity:.9;transition:opacity .3s;}
.nav-brand:hover{opacity:1}
.nav-logo-img{height:38px;width:auto;filter:brightness(0) invert(1);}
.nav-links{display:flex;gap:clamp(24px,3vw,48px);list-style:none;}
.nav-links a{font-size:.78rem;font-weight:300;letter-spacing:.12em;color:rgba(240,237,230,.65);transition:color .3s;text-transform:lowercase;}
.nav-links a:hover{color:var(--ivory)}
.nav-links a[aria-current]{color:var(--gold)}
.nav-rdv{font-size:.75rem;font-weight:400;letter-spacing:.1em;padding:.5rem 1.3rem;border:1px solid rgba(184,169,138,.5);border-radius:2px;color:var(--gold);transition:background .3s,border-color .3s,color .3s;}
.nav-rdv:hover{background:var(--gold);border-color:var(--gold);color:var(--ink);}
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:6px;width:32px;height:32px;flex-shrink:0;z-index:600;padding:0;}
.nav-burger span{display:block;height:1px;background:var(--ivory);border-radius:1px;transition:transform .4s var(--ease-out),opacity .3s;transform-origin:center;}
.nav-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-burger.is-open span:nth-child(2){opacity:0;transform:scaleX(0);}
.nav-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Menu mobile plein écran */
.nav-mobile{position:fixed;inset:0;z-index:490;background:rgba(5,5,8,.97);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,4vh,36px);opacity:0;pointer-events:none;transition:opacity .4s var(--ease-out);}
.nav-mobile.is-open{opacity:1;pointer-events:auto;}
.nav-mobile a{font-family:var(--serif);font-size:clamp(1.8rem,8vw,2.8rem);font-weight:300;color:var(--ivory);letter-spacing:.04em;opacity:0;transform:translateY(16px);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out),color .3s;}
.nav-mobile.is-open a{opacity:1;transform:none;}
.nav-mobile a:hover,.nav-mobile a[aria-current]{color:var(--gold);}
.nav-mobile a:nth-child(1){transition-delay:.05s}
.nav-mobile a:nth-child(2){transition-delay:.1s}
.nav-mobile a:nth-child(3){transition-delay:.15s}
.nav-mobile a:nth-child(4){transition-delay:.2s}
.nav-mobile a:nth-child(5){transition-delay:.25s}
.nav-mobile a:nth-child(6){transition-delay:.3s}
.nav-mobile a:nth-child(7){transition-delay:.35s}
.nav-mobile a.nav-mobile-rdv{margin-top:clamp(12px,2vh,20px);padding:.75rem 2rem;border:1px solid rgba(184,169,138,.4);border-radius:2px;font-family:var(--sans);font-size:.85rem;font-weight:400;letter-spacing:.1em;color:var(--gold);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out),background .3s,border-color .3s,color .3s;}
.nav-mobile a.nav-mobile-rdv:hover{background:var(--gold);border-color:var(--gold);color:var(--ink);}

/* ── Barre de progression de lecture ── */
#progress-bar{position:fixed;top:0;left:0;right:0;height:3px;z-index:999;background:linear-gradient(to right,var(--gold),rgba(184,169,138,.3));transform-origin:left;transform:scaleX(0);transition:transform .05s linear;}

/* ── Boutons ── */
.btn-gold,.contact-rdv-btn{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:400;letter-spacing:.08em;padding:.75rem 1.8rem;background:var(--gold);color:var(--ink);border-radius:2px;transition:background .3s;}
.btn-gold:hover,.contact-rdv-btn:hover{background:var(--gold-light);}

/* ── Apparitions au défilement (activées seulement si JS est présent) ── */
html.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);}
html.js .reveal.in-view{opacity:1;transform:none}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}

/* ── Pavement de logos partenaires (accueil + pages praticiens) ── */
.partners-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(130px,13vw,180px),1fr));gap:clamp(8px,1vw,14px);}
.partner-tile{--d:0ms;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;padding:clamp(4px,.5vw,8px);border:1px solid rgba(5,5,8,.08);border-radius:3px;background-color:#fff;opacity:0;transform:translateY(18px) scale(.96);transition:opacity .8s var(--ease-out) var(--d),transform .8s var(--ease-out) var(--d),border-color .3s;}
.partner-tile.in-view{opacity:1;transform:none;}
.partner-tile:hover{border-color:var(--gold);}
.partner-logo{width:100%;height:100%;object-fit:contain;display:block;margin:auto;filter:brightness(0);transition:transform .3s var(--ease-out);}
.partner-tile:hover .partner-logo{transform:scale(1.04);}

/* ── Contact / pied de page ── */
#contact{background:var(--ink);padding:clamp(80px,12vh,140px) var(--pad) clamp(40px,6vh,72px);border-top:1px solid rgba(240,237,230,.05);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:clamp(40px,6vw,80px);margin-bottom:clamp(60px,8vh,100px);}
.contact-block h3{font-family:var(--serif);font-size:clamp(1.1rem,1.8vw,1.4rem);font-weight:300;color:var(--ivory);margin-bottom:1.2rem;line-height:1.2;}
.contact-block p{font-size:.82rem;font-weight:300;color:rgba(240,237,230,.45);line-height:1.8;}
.contact-block a:not(.btn-gold):not(.contact-rdv-btn){font-size:.82rem;font-weight:300;color:rgba(240,237,230,.65);line-height:1.8;display:block;transition:color .3s;}
.contact-block a:not(.btn-gold):not(.contact-rdv-btn):hover{color:var(--gold);}
.contact-block .btn-gold,.contact-block .contact-rdv-btn{margin-top:1.5rem;}
/* Encadré « rendez-vous rapides » du pied de page */
.contact-block p.contact-urgent{display:flex;gap:12px;align-items:flex-start;margin:1rem 0;padding:.9rem 1.1rem;border:1px solid rgba(184,169,138,.35);border-radius:3px;color:rgba(240,237,230,.72);line-height:1.6;max-width:44ch;}
.contact-urgent svg{flex:none;width:17px;height:17px;margin-top:3px;color:var(--gold);}
.contact-block .contact-urgent a:not(.btn-gold):not(.contact-rdv-btn){display:inline;color:var(--gold);border-bottom:1px solid rgba(184,169,138,.4);white-space:nowrap;}
.contact-block .contact-urgent a:not(.btn-gold):not(.contact-rdv-btn):hover{border-color:var(--gold);}
.contact-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:clamp(24px,3vh,36px);border-top:1px solid rgba(240,237,230,.06);flex-wrap:wrap;gap:1rem;}
.contact-bottom a{color:inherit;border-bottom:1px solid rgba(240,237,230,.2);transition:color .3s,border-color .3s;}
.contact-bottom a:hover{color:var(--gold);border-color:var(--gold);}
.contact-bottom p{font-size:.72rem;font-weight:300;color:rgba(240,237,230,.25);letter-spacing:.05em;}

/* ── Responsive commun ── */
@media(max-width:900px){
  .nav-links,.nav-rdv{display:none}
  .nav-burger{display:flex}
  .contact-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  html.js .reveal{opacity:1;transform:none}
  .partner-tile{opacity:1;transform:none}
}