/* =====================================================================
   ParkWeb — Design System « Liquid Glass »
   CSS écrit à la main (zéro build, zéro CDN). Dark mode par défaut.
   ===================================================================== */

/* ------------------------- Police Inter (auto-hébergée) ------------------------- */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/inter/inter-latin-400-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/inter/inter-latin-500-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;
  src:url("../fonts/inter/inter-latin-600-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/inter/inter-latin-700-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Inter";font-style:normal;font-weight:800;font-display:swap;
  src:url("../fonts/inter/inter-latin-800-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* latin-ext (œ, caractères étendus) */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/inter/inter-latin-ext-400-normal.woff2") format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/inter/inter-latin-ext-500-normal.woff2") format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/inter/inter-latin-ext-600-normal.woff2") format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/inter/inter-latin-ext-700-normal.woff2") format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Inter";font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/inter/inter-latin-ext-800-normal.woff2") format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* ------------------------- Tokens : Dark (défaut) ------------------------- */
:root,[data-theme="dark"]{
  --bg-deep:#060606; --bg-elevated:#0F0F12;
  --bg-glass:rgba(255,255,255,.04); --bg-glass-hover:rgba(255,255,255,.07);
  --border-glass:rgba(255,255,255,.08); --border-glass-strong:rgba(255,255,255,.14);
  --warm-glow:#FFA94D; --warm-deep:#FF6B1A; --warm-soft:rgba(255,169,77,.12);
  --cool-ice:#4DABFF; --cool-deep:#1E3A8A;
  --success:#10B981; --warning:#F59E0B; --danger:#EF4444;
  --text-primary:#FAFAFA; --text-secondary:#A0A0A8; --text-muted:#6B6B72; --text-warm:#FFA94D;
  --shadow-card:0 8px 32px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.06);
  color-scheme:dark;
}

/* ------------------------- Tokens : Light ------------------------- */
[data-theme="light"]{
  --bg-deep:#FAFAFA; --bg-elevated:#FFFFFF;
  --bg-glass:rgba(15,15,18,.04); --bg-glass-hover:rgba(15,15,18,.07);
  --border-glass:rgba(15,15,18,.10); --border-glass-strong:rgba(15,15,18,.18);
  --warm-glow:#FF8C2A; --warm-deep:#FF6B1A; --warm-soft:rgba(255,140,42,.10);
  --cool-ice:#2D8FE6; --cool-deep:#1E3A8A;
  --success:#059669; --warning:#D97706; --danger:#DC2626;
  --text-primary:#0F172A; --text-secondary:#475569; --text-muted:#94A3B8; --text-warm:#FF6B1A;
  --shadow-card:0 8px 32px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.5);
  color-scheme:light;
}

/* ------------------------- Constantes globales ------------------------- */
:root{
  --font-sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --radius-card:24px; --radius-pill:999px; --radius-sm:12px;
  --container:1400px;
  --ease-glass:cubic-bezier(.16,1,.3,1);
  --safe-bottom:env(safe-area-inset-bottom,0px);
}

/* ------------------------- Reset & base ------------------------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth; overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  min-height:100dvh; background:var(--bg-deep); color:var(--text-primary);
  font-family:var(--font-sans); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  transition:background .3s var(--ease-glass), color .3s var(--ease-glass);
  overflow-x:hidden;
}
img,svg,video{max-width:100%; height:auto; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit; cursor:pointer; background:none; border:none}
ul{list-style:none}
::selection{background:var(--warm-soft); color:var(--text-primary)}
:focus-visible{outline:2px solid var(--warm-glow); outline-offset:3px; border-radius:4px}

/* ------------------------- Typographie ------------------------- */
.display-xxl{font-size:clamp(2.3rem,5.5vw,4.4rem); font-weight:800; line-height:1.06; letter-spacing:-.03em;
  background:linear-gradient(155deg, var(--text-primary) 38%, var(--warm-glow));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
h1,.h1{font-size:clamp(2rem,5vw,3.5rem); font-weight:700; line-height:1.08; letter-spacing:-.02em}
h2,.h2{font-size:clamp(1.6rem,4vw,2.5rem); font-weight:700; line-height:1.15; letter-spacing:-.015em}
h3,.h3{font-size:clamp(1.25rem,3vw,1.6rem); font-weight:600; line-height:1.25}
.lead{font-size:clamp(1.05rem,2vw,1.3rem); color:var(--text-secondary); line-height:1.55}
.text-warm{color:var(--text-warm)}
.text-secondary{color:var(--text-secondary)}
.text-muted{color:var(--text-muted)}
.tabular{font-variant-numeric:tabular-nums}

/* ------------------------- Layout ------------------------- */
.container{width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(20px,5vw,48px)}
.section{padding-block:clamp(56px,9vw,120px); position:relative}
.stack>*+*{margin-top:1rem}

/* ------------------------- Halos lumineux ------------------------- */
.halo{position:absolute; width:560px; height:560px; border-radius:50%; pointer-events:none; z-index:0;
  will-change:transform; transform:translateZ(0);
  background:radial-gradient(circle, rgba(255,150,55,.20) 0%, rgba(255,120,30,.07) 38%, transparent 70%);
  animation:halo-float 14s ease-in-out infinite;}
[data-theme="light"] .halo{background:radial-gradient(circle, rgba(255,140,42,.18) 0%, rgba(255,120,30,.06) 42%, transparent 72%)}
.halo--cool{background:radial-gradient(circle, rgba(77,171,255,.18) 0%, rgba(45,143,230,.05) 42%, transparent 72%)}
@keyframes halo-float{
  0%,100%{transform:translate(0,0)} 33%{transform:translate(50px,-30px)} 66%{transform:translate(-30px,40px)}}

/* ------------------------- Glass card ------------------------- */
.glass-card{
  position:relative; background:var(--bg-glass);
  backdrop-filter:blur(24px) saturate(180%); -webkit-backdrop-filter:blur(24px) saturate(180%);
  border:1px solid var(--border-glass); border-radius:var(--radius-card);
  box-shadow:var(--shadow-card);
  transition:background .3s var(--ease-glass), transform .3s var(--ease-glass), border-color .3s var(--ease-glass);
}
.glass-card--pad{padding:clamp(20px,3vw,32px)}
.glass-card--hover:hover{background:var(--bg-glass-hover); transform:translateY(-2px); border-color:var(--border-glass-strong)}

/* ------------------------- Boutons ------------------------- */
.btn{display:inline-flex; align-items:center; gap:.5em; padding:14px 28px; border-radius:var(--radius-pill);
  font-weight:600; line-height:1; min-height:48px; transition:all .25s var(--ease-glass)}
.btn-cta{background:var(--warm-glow); color:var(--bg-deep)}
.btn-cta:hover{box-shadow:0 0 0 8px var(--warm-soft); transform:scale(1.02)}
.btn-ghost{border:1px solid var(--border-glass-strong); color:var(--text-primary)}
.btn-ghost:hover{background:var(--bg-glass-hover)}

/* ------------------------- Champs ------------------------- */
.glass-input{width:100%; padding:14px 16px; min-height:48px; color:var(--text-primary);
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-sm);
  transition:border-color .2s var(--ease-glass), background .2s var(--ease-glass)}
.glass-input::placeholder{color:var(--text-muted)}
.glass-input:focus{outline:none; border-color:var(--warm-glow); background:var(--bg-glass-hover)}

/* ------------------------- Theme toggle ------------------------- */
.theme-toggle{display:inline-grid; place-items:center; width:44px; height:44px; border-radius:50%;
  border:1px solid var(--border-glass); background:var(--bg-glass); color:var(--text-primary);
  transition:background .25s var(--ease-glass), transform .25s var(--ease-glass)}
.theme-toggle:hover{background:var(--bg-glass-hover); transform:rotate(15deg)}

/* ------------------------- Transition de page ------------------------- */
.page-transition{position:fixed; inset:0; z-index:9999; display:grid; place-items:center;
  background:var(--bg-elevated); transform:translateY(-100%); pointer-events:none;
  transition:transform .6s var(--ease-glass)}
.page-transition.is-active{transform:translateY(0); pointer-events:auto}
.page-transition.is-leaving{transform:translateY(100%)}
.page-transition__logo{width:64px; height:64px; animation:pt-spin 1.5s linear infinite}
@keyframes pt-spin{to{transform:rotate(360deg)}}

/* ------------------------- Accessibilité mouvement ------------------------- */
@media (prefers-reduced-motion:reduce){
  .halo{animation:none}
  .page-transition,.page-transition__logo{transition:none; animation:none}
  *{scroll-behavior:auto !important}
}

/* ------------------------- Utilitaires ------------------------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.flex{display:flex} .items-center{align-items:center} .justify-between{justify-content:space-between}
.gap-sm{gap:.5rem} .gap{gap:1rem} .gap-lg{gap:2rem}
.grid{display:grid} .relative{position:relative}
[hidden]{display:none !important}
[x-cloak]{display:none !important}

/* ------------------------- Logos selon thème ------------------------- */
[data-theme="dark"] .only-light{display:none !important}
[data-theme="light"] .only-dark{display:none !important}

/* ------------------------- Header ------------------------- */
/* Le wrapper Alpine ne doit pas former de boîte, sinon il confine le position:sticky du header. */
.header-shell{display:contents}
.site-header{position:sticky; top:0; z-index:1000;
  background:transparent; border-bottom:1px solid transparent;
  transition:background .3s var(--ease-glass), border-color .3s var(--ease-glass);}
.site-header.is-scrolled{
  background:color-mix(in srgb, var(--bg-deep) 72%, transparent);
  backdrop-filter:blur(16px) saturate(180%); -webkit-backdrop-filter:blur(16px) saturate(180%);
  border-bottom-color:var(--border-glass);}
.site-header__bar{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; height:72px}
.brand{display:inline-flex; align-items:center}
.brand img{height:20px; width:auto}
.site-nav{display:flex; gap:1.75rem; font-size:.95rem; font-weight:500}
.site-nav a{color:var(--text-secondary); transition:color .2s var(--ease-glass)}
.site-nav a:hover,.site-nav a.is-active{color:var(--text-primary)}
.site-header__actions{display:flex; align-items:center; gap:.75rem}
.hamburger{display:none; width:44px; height:44px; place-items:center; color:var(--text-primary)}

.mobile-menu{position:fixed; inset:0; z-index:1200; overflow:hidden auto;
  padding:24px clamp(24px,6vw,40px) 48px;
  background:var(--bg-deep);
  opacity:0; visibility:hidden; transform:translateY(-14px); pointer-events:none;
  transition:opacity .32s var(--ease-glass), transform .32s var(--ease-glass), visibility .32s}
.mobile-menu.is-open{opacity:1; visibility:visible; transform:none; pointer-events:auto}
.mobile-menu__top{display:flex; align-items:center; justify-content:space-between; height:48px}
.mobile-menu__top img{height:22px; width:auto}
.mobile-menu__halo{position:absolute; top:-120px; right:-120px; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle, var(--warm-soft) 0%, transparent 70%); filter:blur(70px); pointer-events:none}
.mobile-menu__nav{display:flex; flex-direction:column; gap:1.1rem; font-size:1.7rem; font-weight:700; margin-top:2.5rem; position:relative; z-index:1}
.mobile-menu__nav a{color:var(--text-primary); opacity:0; transform:translateY(12px); transition:opacity .45s var(--ease-glass), transform .45s var(--ease-glass)}
.mobile-menu.is-open .mobile-menu__nav a{opacity:1; transform:none}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(1){transition-delay:.06s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(2){transition-delay:.10s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(3){transition-delay:.14s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(4){transition-delay:.18s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(5){transition-delay:.22s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(6){transition-delay:.26s}
.mobile-menu.is-open .mobile-menu__nav a:nth-child(7){transition-delay:.30s}
.mobile-menu__nav .btn{font-size:1.05rem; align-self:flex-start; margin-top:1rem}

@media (max-width:880px){
  .site-nav{display:none}
  .site-header__cta{display:none}
  .hamburger{display:grid}
}

/* ------------------------- Footer ------------------------- */
.site-footer{margin-top:clamp(60px,10vw,120px); border-top:1px solid var(--border-glass);
  padding-block:clamp(40px,6vw,72px); position:relative; z-index:1}
.site-footer__grid{display:grid; grid-template-columns:1.5fr 1fr 1.2fr; gap:2.5rem}
.site-footer img{height:22px; width:auto; margin-bottom:1rem}
.site-footer__nav,.site-footer__contact{display:flex; flex-direction:column; gap:.6rem}
.site-footer__nav h3,.site-footer__contact h3{margin-bottom:.4rem}
.site-footer a{color:var(--text-secondary); transition:color .2s}
.site-footer a:hover{color:var(--text-primary)}
.site-footer__contact a,.site-footer__contact p{display:inline-flex; align-items:center; gap:.5rem}
.site-footer__bottom{margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid var(--border-glass);
  color:var(--text-muted); font-size:.875rem}
.site-footer__legal{display:flex; gap:1.25rem}
@media (max-width:760px){
  .site-footer__grid{grid-template-columns:1fr; gap:2rem}
  .site-footer__bottom{flex-direction:column; align-items:flex-start; gap:.75rem}
}

/* ------------------------- CTA flottant mobile ------------------------- */
.mobile-cta-wrap{display:none}
.mobile-cta{width:100%; justify-content:center}
@media (max-width:880px){
  .mobile-cta-wrap{display:block; position:fixed; left:0; right:0; bottom:0; z-index:900;
    padding:12px clamp(16px,5vw,24px); padding-bottom:calc(12px + var(--safe-bottom));
    background:linear-gradient(to top, var(--bg-deep) 60%, transparent)}
  .site-main{padding-bottom:88px}
}

/* ------------------------- Hero / aperçu accueil ------------------------- */
.hero{padding-block:clamp(44px,7vw,84px); position:relative}
.hero__inner{position:relative; z-index:1; max-width:880px}
.hero__eyebrow{font-weight:600; letter-spacing:.05em; text-transform:uppercase; font-size:.8rem; margin-bottom:1rem}
.hero__lead{max-width:620px; margin-top:1.5rem}
.hero__cta{margin-top:2.25rem; flex-wrap:wrap}
.preview-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:1.5rem}
@media (min-width:1100px){ .preview-grid{grid-template-columns:repeat(auto-fill, minmax(300px,1fr))} }

/* ------------------------- Auth (login) ------------------------- */
.auth-body{min-height:100dvh; display:grid; place-items:center; padding:24px; overflow:hidden; position:relative}
.auth-wrap{width:100%; max-width:420px; position:relative; z-index:1}
.auth-card{text-align:left}
.auth-logo img{height:24px; width:auto}
.auth-form{display:flex; flex-direction:column; gap:1rem}
.auth-field{display:flex; flex-direction:column; gap:.4rem; font-size:.9rem; color:var(--text-secondary)}
.auth-error{background:rgba(239,68,68,.12); border:1px solid var(--danger); color:var(--danger);
  padding:10px 14px; border-radius:var(--radius-sm); margin-bottom:1rem; font-size:.9rem}

/* ------------------------- Admin ------------------------- */
.admin-topbar{position:sticky; top:0; z-index:1000;
  background:color-mix(in srgb, var(--bg-deep) 70%, transparent);
  backdrop-filter:blur(16px) saturate(180%); -webkit-backdrop-filter:blur(16px) saturate(180%);
  border-bottom:1px solid var(--border-glass)}
.admin-topbar .brand img{height:20px; width:auto}
code{font-family:ui-monospace,"SFMono-Regular",Menlo,monospace; font-size:.9em; padding:.1em .35em;
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:6px}

/* ------------------------- Admin shell (sidebar + topbar) ------------------------- */
.btn-sm{padding:8px 16px; min-height:38px; font-size:.875rem}
.admin-body{background:var(--bg-deep)}
.admin-shell{min-height:100dvh}
.admin-sidebar{position:fixed; top:0; left:0; bottom:0; width:248px; z-index:1100; overflow-y:auto;
  background:var(--bg-elevated); border-right:1px solid var(--border-glass); padding:20px 14px;
  transition:transform .3s var(--ease-glass)}
.admin-brand{display:block; padding:6px 8px 18px}
.admin-brand img{height:21px; width:auto}
.admin-nav{display:flex; flex-direction:column; gap:2px}
.admin-nav__group{font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted);
  margin:16px 8px 6px; font-weight:600}
.admin-nav a{padding:9px 12px; border-radius:10px; color:var(--text-secondary); font-size:.92rem; font-weight:500;
  transition:background .2s, color .2s}
.admin-nav a:hover{background:var(--bg-glass); color:var(--text-primary)}
.admin-nav a.is-active{background:var(--warm-soft); color:var(--text-warm)}
.admin-overlay{position:fixed; inset:0; z-index:1050; background:rgba(0,0,0,.5); backdrop-filter:blur(2px)}
.admin-main{margin-left:248px; min-height:100dvh; display:flex; flex-direction:column}
.admin-topbar2{position:sticky; top:0; z-index:1000; display:flex; align-items:center; gap:1rem; height:64px;
  padding:0 clamp(16px,3vw,32px);
  background:color-mix(in srgb, var(--bg-deep) 72%, transparent);
  backdrop-filter:blur(16px) saturate(180%); -webkit-backdrop-filter:blur(16px) saturate(180%);
  border-bottom:1px solid var(--border-glass)}
.admin-topbar2__title{font-size:1.1rem; font-weight:700; flex:1}
.admin-topbar2__actions{display:flex; align-items:center; gap:.75rem}
.admin-user{font-size:.85rem; color:var(--text-secondary)}
/* Burger admin : autonome (indépendant de .hamburger public), visible et évident */
.admin-burger{display:none; width:42px; height:42px; place-items:center; cursor:pointer;
  color:var(--text-primary); background:var(--bg-glass); border:1px solid var(--border-glass-strong); border-radius:10px}
.admin-burger:hover{background:var(--bg-glass-hover)}
.admin-content{padding:clamp(20px,3vw,36px); flex:1; max-width:1400px; width:100%; min-width:0}

@media (max-width:1024px){
  .admin-sidebar{transform:translateX(-100%)}
  .admin-sidebar.is-open{transform:translateX(0); box-shadow:0 0 60px rgba(0,0,0,.5)}
  .admin-main{margin-left:0}
  .admin-burger{display:inline-grid}
}
@media (min-width:1025px){ .admin-overlay{display:none !important} }

/* Pied de sidebar (Voir le site + Déconnexion) — visible quand le burger est actif */
.admin-sidebar{display:flex; flex-direction:column}
.admin-sidebar .admin-nav{flex:1}
.admin-sidebar__foot{display:none; margin-top:16px; padding-top:14px; border-top:1px solid var(--border-glass); gap:2px; flex-direction:column}
.admin-sidebar__user{font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); margin:0 8px 6px; font-weight:600}
.admin-sidebar__foot form{margin:0}
.admin-sidebar__action{display:flex; align-items:center; gap:.5rem; width:100%; text-align:left;
  padding:9px 12px; border-radius:10px; color:var(--text-secondary); font-size:.92rem; font-weight:500;
  background:none; border:0; cursor:pointer; transition:background .2s, color .2s}
.admin-sidebar__action:hover{background:var(--bg-glass); color:var(--text-primary)}
.admin-sidebar__action--danger{color:var(--danger)}
.admin-sidebar__action--danger:hover{background:rgba(239,68,68,.12); color:var(--danger)}
@media (max-width:1024px){
  .admin-sidebar__foot{display:flex}
  .admin-topbar2__desk{display:none !important}
}

/* Badge de synchronisation hors-ligne (outbox) */
.pw-sync{display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:6px 11px; border-radius:999px; font-size:.82rem; font-weight:600;
  color:var(--text-warm); background:var(--warm-soft); border:1px solid var(--border-glass-strong)}
.pw-sync:hover{filter:brightness(1.08)}
.pw-sync__dot{width:8px; height:8px; border-radius:50%; background:var(--text-warm);
  box-shadow:0 0 0 0 var(--text-warm); animation:pwPulse 1.8s infinite}
@keyframes pwPulse{0%{box-shadow:0 0 0 0 rgba(245,158,11,.5)}70%{box-shadow:0 0 0 7px rgba(245,158,11,0)}100%{box-shadow:0 0 0 0 rgba(245,158,11,0)}}
@media (prefers-reduced-motion:reduce){ .pw-sync__dot{animation:none} }

/* Toasts (notifications hors-ligne / synchro) */
.pw-toast{position:fixed; left:50%; bottom:24px; transform:translate(-50%, 16px); z-index:4000;
  max-width:min(92vw, 440px); padding:13px 18px; border-radius:14px; font-size:.9rem; font-weight:500;
  color:var(--text-primary); background:var(--bg-elevated); border:1px solid var(--border-glass-strong);
  box-shadow:0 16px 50px rgba(0,0,0,.4); opacity:0; transition:opacity .3s, transform .3s}
.pw-toast.is-on{opacity:1; transform:translate(-50%, 0)}
.pw-toast--success{border-color:var(--success); color:var(--success)}
.pw-toast--error{border-color:var(--danger); color:var(--danger)}
.pw-toast--info{border-color:var(--text-warm); color:var(--text-warm)}

/* Mode hors-ligne admin : bannière + neutralisation des actions serveur */
.pw-offline-banner{display:none; align-items:center; gap:10px; padding:11px clamp(16px,3vw,32px);
  font-size:.88rem; color:var(--text-warm); background:var(--warm-soft);
  border-bottom:1px solid var(--border-glass-strong)}
.pw-offline-banner svg{flex:0 0 auto}
body.pw-offline .pw-offline-banner{display:flex}
/* Boutons d'action serveur masqués hors-ligne (disabled posé par le JS) */
body.pw-offline button[data-pw-off]{display:none !important}
/* Liens vers ressources serveur (PDF, envoi, téléchargement…) masqués */
body.pw-offline a.pw-locked{display:none !important}
/* Menu latéral : hors-ligne, ne garder que les sections disponibles hors-ligne */
body.pw-offline .admin-nav a:not([data-offline-nav]){display:none !important}
body.pw-offline .admin-nav__group{display:none !important}

/* Tables & cartes admin (réutilisées par les modules CRM) */
.admin-table{width:100%; border-collapse:collapse; font-size:.92rem}
.admin-table th{text-align:left; color:var(--text-muted); font-weight:600; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.04em; padding:10px 14px; border-bottom:1px solid var(--border-glass)}
.admin-table td{padding:12px 14px; border-bottom:1px solid var(--border-glass)}
.admin-table tr:hover td{background:var(--bg-glass)}
.badge{display:inline-flex; align-items:center; gap:.3em; padding:3px 10px; border-radius:999px;
  font-size:.78rem; font-weight:600; background:var(--bg-glass); border:1px solid var(--border-glass)}
.badge--warm{background:var(--warm-soft); color:var(--text-warm); border-color:transparent}
.badge--success{background:rgba(16,185,129,.12); color:var(--success); border-color:transparent}
.badge--danger{background:rgba(239,68,68,.12); color:var(--danger); border-color:transparent}
.page-head{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.5rem}

/* ------------------------- Médiathèque ------------------------- */
.media-toolbar{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1rem}
.media-filters{display:flex; gap:.5rem; flex-wrap:wrap; align-items:center}
.media-filters .glass-input{min-height:40px; padding:8px 12px; width:auto}
.media-upload-btn{cursor:pointer}
.media-drop{border:2px dashed var(--border-glass-strong); border-radius:var(--radius-card); padding:28px;
  text-align:center; color:var(--text-muted); transition:.2s var(--ease-glass); margin-bottom:1.5rem}
.media-drop.is-over{border-color:var(--warm-glow); color:var(--text-warm); background:var(--warm-soft)}
.media-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:1rem}
.media-item{overflow:hidden; padding:0}
.media-item img{width:100%; aspect-ratio:1; object-fit:cover; display:block; background:var(--bg-glass)}
.media-item figcaption{padding:10px 12px; display:flex; flex-direction:column; gap:3px; font-size:.78rem}
.media-name{font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.media-meta{color:var(--text-muted)}
.media-del button{padding:5px 9px; min-height:0}

/* Sélecteur de média (modale) */
.media-modal{position:fixed; inset:0; z-index:2000; display:grid; place-items:center; padding:20px}
.media-modal__backdrop{position:absolute; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(4px)}
.media-modal__panel{position:relative; z-index:1; width:min(900px,95vw); max-height:85vh; display:flex; flex-direction:column; padding:20px;
  background:var(--bg-elevated); border:1px solid var(--border-glass-strong); box-shadow:0 30px 90px -25px rgba(0,0,0,.7); backdrop-filter:none; -webkit-backdrop-filter:none}
.media-modal__panel header{display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem}
.media-modal__upload{display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-bottom:1rem; padding:12px 14px;
  border:2px dashed var(--border-glass-strong); border-radius:var(--radius-sm); transition:border-color .2s, background .2s}
.media-modal__upload.is-drag{border-color:var(--warm-glow); background:var(--warm-soft)}
.media-modal__progress{height:6px; border-radius:var(--radius-pill); background:var(--bg-glass); overflow:hidden}
.media-modal__progress > span{display:block; height:100%; border-radius:inherit; transition:width .15s ease;
  background:linear-gradient(90deg, var(--warm-deep), var(--warm-glow))}
.media-modal__grid{overflow-y:auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:.6rem}
.media-modal__item{border-radius:12px; overflow:hidden; border:2px solid transparent; aspect-ratio:1; background:var(--bg-glass); cursor:pointer}
.media-modal__item:hover{border-color:var(--warm-glow)}
.media-modal__item img{width:100%; height:100%; object-fit:cover; display:block}
.media-picker{display:flex; flex-direction:column; gap:.6rem}
.media-picker__preview img{border-radius:10px; width:80px; height:80px; object-fit:cover; border:1px solid var(--border-glass)}

/* ------------------------- Corrections lisibilité (BETA) ------------------------- */
/* Selects : fond opaque + options lisibles dans les deux thèmes */
select.glass-input{ background-color:var(--bg-elevated); color:var(--text-primary); }
select.glass-input option,
.glass-input option{ background:var(--bg-elevated); color:var(--text-primary); }
/* Champs compacts dans les tableaux (qté / PU non coupés) */
.admin-table .glass-input{ padding:8px 10px; min-height:36px; width:100%; }
.admin-table input[type="number"].glass-input{ text-align:right; }
/* Inputs date/heure : icônes natives au bon thème */
input[type="date"], input[type="time"], input[type="month"]{ color-scheme:dark; }
[data-theme="light"] input[type="date"],
[data-theme="light"] input[type="time"],
[data-theme="light"] input[type="month"]{ color-scheme:light; }

/* Actions de ligne (alignées au centre, cellule de tableau préservée) */
.admin-table td{ vertical-align:middle; }
.row-actions{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.row-actions form{ margin:0; display:inline-flex; }
.row-actions .btn{ white-space:nowrap; }

/* Popup de confirmation maison */
.confirm-modal{ position:fixed; inset:0; z-index:3000; display:grid; place-items:center; padding:20px; }
.confirm-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.6); backdrop-filter:blur(4px); }
.confirm-modal__panel{ position:relative; z-index:1; width:min(420px,95vw);
  background:var(--bg-elevated); border:1px solid var(--border-glass-strong);
  box-shadow:0 30px 90px -25px rgba(0,0,0,.7); backdrop-filter:none; -webkit-backdrop-filter:none; }
[data-theme="light"] .confirm-modal__backdrop,
[data-theme="light"] .media-modal__backdrop{ background:rgba(15,23,42,.45); }

/* ------------------------- Animations de vie ------------------------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease-glass), transform .7s var(--ease-glass)}
.reveal.is-visible{opacity:1; transform:none}
.reveal-d1{transition-delay:.08s} .reveal-d2{transition-delay:.16s} .reveal-d3{transition-delay:.24s} .reveal-d4{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1 !important; transform:none !important; transition:none} }

.page-transition.pt-instant{transition:none}

/* CTA plus vivant */
.btn-cta{background:linear-gradient(135deg, var(--warm-glow), var(--warm-deep)); box-shadow:0 4px 18px var(--warm-soft)}
.btn-cta:hover{box-shadow:0 0 0 6px var(--warm-soft), 0 10px 30px var(--warm-soft); transform:translateY(-1px) scale(1.02)}

/* Cartes : lift + lueur au survol */
.glass-card--hover{transition:background .3s var(--ease-glass), transform .3s var(--ease-glass), border-color .3s var(--ease-glass), box-shadow .3s var(--ease-glass)}
.glass-card--hover:hover{box-shadow:0 14px 44px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.08)}

/* Soulignement animé des liens de nav */
.site-nav a{position:relative}
.site-nav a::after{content:""; position:absolute; left:0; right:100%; bottom:-5px; height:2px; border-radius:2px; background:var(--warm-glow); transition:right .3s var(--ease-glass)}
.site-nav a:hover::after,.site-nav a.is-active::after{right:0}

/* Halos : variante plus lente */
.halo--slow{animation-duration:17s}

/* ------------------------- Fond animé global (blobs) ------------------------- */
.bg-fx{position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none}
.bg-blob{position:absolute; width:52vw; height:52vw; max-width:720px; max-height:720px;
  will-change:transform; transform:translate3d(0, var(--py, 0px), 0)}
.bg-blob__inner{position:absolute; inset:0; border-radius:50%; will-change:transform}
.bg-blob--1{top:-16%; left:-12%}
.bg-blob--2{top:26%; right:-16%}
.bg-blob--3{bottom:-22%; left:18%}
.bg-blob--1 .bg-blob__inner{background:radial-gradient(circle, rgba(255,140,42,.26) 0%, rgba(255,120,30,.10) 32%, transparent 65%); animation:blob1 26s ease-in-out infinite}
.bg-blob--2 .bg-blob__inner{background:radial-gradient(circle, rgba(77,171,255,.22) 0%, rgba(77,171,255,.08) 32%, transparent 65%); animation:blob2 30s ease-in-out infinite}
.bg-blob--3 .bg-blob__inner{background:radial-gradient(circle, rgba(255,107,26,.20) 0%, rgba(255,107,26,.07) 32%, transparent 65%); animation:blob3 34s ease-in-out infinite}
[data-theme="light"] .bg-blob{opacity:.55}
@keyframes blob1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(70px,50px) scale(1.12)}}
@keyframes blob2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-60px,40px) scale(1.08)}}
@keyframes blob3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(50px,-50px) scale(1.1)}}
@media (prefers-reduced-motion:reduce){ .bg-blob__inner{animation:none} }
/* Contenu au-dessus du fond animé (le header garde son position:sticky) */
.site-main,.site-footer,.mobile-cta-wrap{position:relative; z-index:1}

/* --- Formulaire de contact intelligent (wizard) --- */
.wizard{position:relative}
.wizard__head{margin-bottom:1.5rem}
.wizard__bar{margin-top:.5rem; height:6px; border-radius:var(--radius-pill); background:var(--bg-glass); overflow:hidden}
.wizard__bar > span{display:block; height:100%; border-radius:inherit;
  background:linear-gradient(90deg, var(--warm-deep), var(--warm-glow)); transition:width .45s var(--ease-glass)}
.wizard__step{min-height:200px; animation:wizard-in .4s var(--ease-glass)}
@keyframes wizard-in{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
.wizard__nav{display:flex; align-items:center; gap:.75rem; margin-top:1.75rem; flex-wrap:wrap}
.opt-grid{display:grid; gap:.75rem; grid-template-columns:1fr 1fr}
.opt-grid--2{grid-template-columns:1fr 1fr}
.opt-grid--3{grid-template-columns:repeat(3, 1fr)}
@media (max-width:640px){ .opt-grid, .opt-grid--2, .opt-grid--3{grid-template-columns:1fr 1fr} }
.opt{display:flex; flex-direction:column; gap:.25rem; padding:16px 18px; cursor:pointer;
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-sm);
  transition:border-color .2s, background .2s, transform .2s}
.opt:hover{background:var(--bg-glass-hover); transform:translateY(-2px)}
.opt--sm{padding:12px 14px}
.opt--on{border-color:var(--warm-glow); background:var(--warm-soft); box-shadow:0 0 0 1px var(--warm-glow) inset}
.opt__t{font-weight:600; color:var(--text-primary)}
.opt__d{font-size:.85rem; color:var(--text-secondary)}
.suggest-card{padding:22px; border-radius:var(--radius-card); border:1px solid var(--warm-glow);
  background:radial-gradient(120% 140% at 0% 0%, var(--warm-soft), transparent 60%), var(--bg-glass)}
.display-sm{font-size:clamp(1.6rem,3vw,2.2rem); font-weight:800; letter-spacing:-.02em; line-height:1.1}
.field-grid{display:grid; gap:1rem; grid-template-columns:1fr 1fr}
.field{display:flex; flex-direction:column; gap:.35rem}
.field--full{grid-column:1 / -1}
@media (max-width:640px){ .field-grid{grid-template-columns:1fr} }
.field > span{font-size:.88rem; color:var(--text-secondary); font-weight:500}
.field input, .field textarea{width:100%; padding:12px 14px; font:inherit; color:var(--text-primary);
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-sm); transition:border-color .2s}
.field input:focus, .field textarea:focus{outline:none; border-color:var(--warm-glow)}
.field textarea{resize:vertical; min-height:90px}
.form-error{padding:10px 14px; border-radius:var(--radius-sm); font-size:.9rem;
  background:rgba(255,90,90,.12); border:1px solid rgba(255,90,90,.35); color:#ff8585}
.preview-grid--3{grid-template-columns:repeat(3, 1fr)}
@media (max-width:640px){ .preview-grid--3{grid-template-columns:1fr} }

/* --- Onglets Contact (formulaire / rendez-vous) avec curseur glissant --- */
.contact-tabs{position:relative; display:grid; grid-template-columns:1fr 1fr; margin-bottom:1.25rem;
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-pill); padding:.35rem}
.contact-tabs__slider{position:absolute; top:.35rem; bottom:.35rem; left:.35rem; width:calc(50% - .35rem); z-index:0;
  border-radius:var(--radius-pill); background:linear-gradient(135deg, var(--warm-glow), var(--warm-deep));
  box-shadow:0 6px 18px -8px var(--warm-deep); transition:transform .38s var(--ease-glass)}
.contact-tabs.is-rdv .contact-tabs__slider{transform:translateX(100%)}
.contact-tab{position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  padding:11px 16px; border:none; background:none; cursor:pointer; font:inherit; font-weight:600;
  color:var(--text-secondary); border-radius:var(--radius-pill); transition:color .28s}
.contact-tab:hover{color:var(--text-primary)}
.contact-tab.is-on{color:#0a0a0a}
[data-theme="light"] .contact-tab.is-on{color:#fff}
@media (max-width:480px){ .contact-tab{padding:10px 6px; font-size:.86rem} }

/* Glissement entre les panneaux + apparition des étapes */
.tab-panel--form{--from:-26px}
.tab-panel--rdv{--from:26px}
.tab-panel{animation:panel-in .42s var(--ease-glass)}
@keyframes panel-in{from{opacity:0; transform:translateX(var(--from,20px))}to{opacity:1; transform:none}}
.rdv-step{animation:rdv-step-in .42s var(--ease-glass)}
@keyframes rdv-step-in{from{opacity:0; transform:translateY(18px)}to{opacity:1; transform:none}}

/* --- Calendrier mensuel de réservation --- */
.cal{background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-card); padding:14px}
.cal__head{display:flex; align-items:center; justify-content:space-between; margin-bottom:.85rem}
.cal__month{font-weight:700; text-transform:capitalize; font-size:1.05rem}
.cal__nav{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; cursor:pointer;
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:50%; color:var(--text-primary);
  transition:background .2s, border-color .2s}
.cal__nav:hover{background:var(--bg-glass-hover); border-color:var(--border-glass-strong)}
.cal__nav[disabled]{opacity:.3; cursor:not-allowed}
.cal__nav--prev svg{transform:rotate(180deg)}
.cal__dow{display:grid; grid-template-columns:repeat(7,1fr); gap:5px; margin-bottom:5px}
.cal__dow span{text-align:center; font-size:.72rem; color:var(--text-muted); font-weight:600; text-transform:uppercase; letter-spacing:.03em}
.cal__grid{display:grid; grid-template-columns:repeat(7,1fr); gap:5px}
.cal__cell{aspect-ratio:1; display:flex; align-items:center; justify-content:center; font:inherit; font-weight:600;
  border:1px solid transparent; border-radius:10px; background:transparent; color:var(--text-muted); cursor:default;
  transition:background .15s, border-color .15s, transform .15s}
.cal__cell.is-empty{visibility:hidden}
.cal__cell.is-bookable{color:var(--text-primary); background:var(--bg-glass); border-color:var(--border-glass); cursor:pointer}
.cal__cell.is-bookable:hover{background:var(--warm-soft); border-color:var(--warm-glow); transform:translateY(-2px)}
.cal__cell.is-on{background:linear-gradient(135deg,var(--warm-glow),var(--warm-deep)); color:#0a0a0a; border-color:transparent}
.cal__cell[disabled]{opacity:.4}
.cal__cell.is-bookable[disabled]{opacity:1}
.cal__beyond{margin-top:1rem; padding:12px 14px; border-radius:var(--radius-sm);
  background:var(--warm-soft); border:1px solid var(--border-glass); font-size:.9rem; color:var(--text-secondary)}
.cal-slots{display:grid; grid-template-columns:repeat(auto-fill, minmax(76px,1fr)); gap:.5rem}
.cal-slot{padding:10px 6px; cursor:pointer; font:inherit; font-weight:600; font-variant-numeric:tabular-nums;
  background:var(--bg-glass); border:1px solid var(--border-glass); border-radius:var(--radius-sm);
  color:var(--text-primary); transition:border-color .2s, background .2s, transform .2s}
.cal-slot:hover{background:var(--bg-glass-hover); transform:translateY(-2px)}
.cal-slot.is-on{border-color:var(--warm-glow); background:linear-gradient(135deg, var(--warm-glow), var(--warm-deep)); color:#0a0a0a}
.avail-slot{display:inline-flex; align-items:center; justify-content:center; width:100%; padding:9px 6px;
  font:inherit; font-weight:600; font-variant-numeric:tabular-nums; border-radius:var(--radius-sm);
  border:1px solid var(--border-glass); background:var(--bg-glass); color:var(--text-primary); cursor:pointer;
  transition:transform .15s, border-color .15s, background .15s}
.avail-slot.is-free:hover{border-color:var(--warm-glow); transform:translateY(-2px)}
.avail-slot.is-blocked{background:rgba(239,68,68,.12); border-color:rgba(239,68,68,.35); color:#ff8585; text-decoration:line-through}
.avail-slot.is-booked{background:var(--warm-soft); border-color:var(--warm-glow); color:var(--text-warm); cursor:not-allowed}
/* Calendrier admin des disponibilités */
a.cal__cell{text-decoration:none}
.cal__cell.no-slots{color:var(--text-muted); opacity:.38; cursor:default}
.cal__cell.no-slots-link{color:var(--text-muted); opacity:.5; text-decoration:none; cursor:pointer}
.cal__cell.no-slots-link:hover{opacity:1; background:var(--bg-glass); border-color:var(--border-glass)}
.cal__cell.is-bookable.no-free{opacity:.6}
.cal__cell.has-free{position:relative}
.cal__cell.has-free::after{content:''; position:absolute; bottom:5px; left:50%; transform:translateX(-50%);
  width:5px; height:5px; border-radius:50%; background:#10b981}
.cal__cell.is-on.has-free::after{background:#0a0a0a}
.btn[disabled]{opacity:.45; cursor:not-allowed; filter:saturate(.6)}

/* --- Popup / modale (candidature freelance, etc.) --- */
.modal-overlay{position:fixed; inset:0; z-index:2000; display:grid; place-items:center; padding:5vw;
  background:rgba(0,0,0,.6); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:modal-fade .25s ease}
.modal-panel{width:100%; max-width:560px; max-height:90vh; overflow-y:auto;
  background:var(--bg-elevated); border:1px solid var(--border-glass-strong); border-radius:var(--radius-card);
  box-shadow:0 30px 90px -25px rgba(0,0,0,.7); backdrop-filter:none; -webkit-backdrop-filter:none;
  animation:modal-pop .3s var(--ease-glass)}
[data-theme="light"] .modal-overlay{background:rgba(15,23,42,.45)}
@keyframes modal-fade{from{opacity:0}to{opacity:1}}
@keyframes modal-pop{from{opacity:0; transform:translateY(22px) scale(.98)}to{opacity:1; transform:none}}