/* Menu mobile : bouton flottant dans la zone du pouce + panneau bas (popover natif) */
.menu-fab,.menu-sheet{display:none}

@media (max-width:900px){
  .nav-desktop{display:none!important}
  .header-cta{padding:10px 16px!important;font-size:14px!important}

  .menu-fab{
    display:inline-flex;align-items:center;gap:10px;
    position:fixed;z-index:50;left:50%;transform:translateX(-50%);
    bottom:calc(18px + env(safe-area-inset-bottom));
    padding:14px 22px 14px 18px;border:1px solid rgba(255,255,255,.14);border-radius:999px;
    background:rgba(20,33,58,.88);color:#fff;
    -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
    box-shadow:0 12px 32px rgba(20,22,31,.28);
    font:700 15px/1 'Plus Jakarta Sans',sans-serif;letter-spacing:.01em;cursor:pointer;
    transition:transform .2s ease,background .2s ease;
  }
  .menu-fab:hover{background:#14213a}
  .menu-fab:active{transform:translateX(-50%) scale(.96)}
  .menu-fab:focus-visible{outline:3px solid #ffc107;outline-offset:3px}
  .burger{display:grid;gap:4px;width:18px}
  .burger i{display:block;height:2px;border-radius:2px;background:#ffc107}
  .burger i:nth-child(2){width:70%}

  .menu-sheet{
    display:block;position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:none;box-sizing:border-box;
    max-height:88dvh;overflow:auto;overscroll-behavior:contain;
    padding:10px 24px calc(28px + env(safe-area-inset-bottom));
    border:0;border-radius:28px 28px 0 0;background:#14213a;color:#fff;
    font-family:'Plus Jakarta Sans',sans-serif;line-height:1.5;
    box-shadow:0 -20px 60px rgba(0,0,0,.35);
    transform:translateY(100%);
    transition:transform .38s cubic-bezier(.2,.9,.25,1),overlay .38s allow-discrete,display .38s allow-discrete;
  }
  .menu-sheet:not(:popover-open){display:none}
  .menu-sheet:popover-open{transform:translateY(0)}
  @starting-style{.menu-sheet:popover-open{transform:translateY(100%)}}
  .menu-sheet::backdrop{background:rgba(10,14,25,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition:all .38s allow-discrete}
  .menu-sheet:popover-open::backdrop{background:rgba(10,14,25,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
  @starting-style{.menu-sheet:popover-open::backdrop{background:rgba(10,14,25,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}

  .menu-sheet *{box-sizing:border-box}
  .sheet-handle{width:44px;height:5px;border-radius:5px;background:rgba(255,255,255,.25);margin:4px auto 14px}
  .sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
  .sheet-head img{height:36px;width:auto}
  .sheet-close{width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;font-size:20px;cursor:pointer}
  .sheet-close:focus-visible{outline:3px solid #ffc107;outline-offset:2px}
  .sheet-nav{display:flex;flex-direction:column}
  .sheet-nav a{display:flex;align-items:baseline;gap:14px;padding:14px 4px;border-bottom:1px solid rgba(255,255,255,.08);
    color:#fff;font-size:26px;font-weight:800;line-height:1.2;letter-spacing:-.02em;text-decoration:none}
  .sheet-nav a span{font-size:13px;font-weight:700;color:#ffc107;letter-spacing:.04em;min-width:22px}
  .sheet-nav a:hover,.sheet-nav a[aria-current="page"]{color:#ffc107}
  .sheet-cta{display:block;text-align:center;margin:22px 0 16px;padding:17px;border-radius:16px;background:#ffc107;color:#14161f!important;font-weight:800;font-size:16px;text-decoration:none}
  .sheet-legal{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px}
  .sheet-legal a{color:#c9cdd8;text-decoration:none;border:0}

  /* Le bouton flottant ne doit pas masquer la fin de page */
  body>footer,.site-footer,#dc-root footer{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
}

@media (prefers-reduced-motion:reduce){
  .menu-sheet,.menu-sheet::backdrop,.menu-fab{transition:none!important}
}

/* Accueil : ajustements mobiles du hero */
@media (max-width:900px){
  .hero-text{padding:56px 0 8px!important}
  .hero-visual{height:420px!important}
}
@media (max-width:480px){
  .hero-visual{height:360px!important}
  .hero-visual>div:nth-child(3),.hero-visual>div:nth-child(4){max-width:170px!important;padding:12px 14px!important}
}
