/* =====================================================================
   fw-updates/mobile.css
   Surcharges de la version téléphone (dossier phone/, généré par Muse).
   Aucun fichier Muse n'est modifié : ces règles s'appliquent par-dessus.
   Chargé par une seule ligne <link> dans le <head> de chaque page phone/.
   Voir fw-updates/README.md
   ===================================================================== */

:root{
  --fw-ink:#222;        /* texte principal            */
  --fw-muted:#777;      /* texte secondaire           */
  --fw-line:#e5e5e5;    /* filets                     */
  --fw-bg:#fff;         /* fond en-tête / menu        */
  --fw-bar:#7f7f7f;     /* barre de titre (= desktop) */
  --fw-h:56px;          /* hauteur de l'en-tête       */
}

body{padding-top:var(--fw-h)!important}


/* ---------------------------------------------------------------------
   1. En-tête fixe (créé par mobile.js)
   --------------------------------------------------------------------- */
.fw-header{
  position:fixed;top:0;left:0;right:0;z-index:10000;
  height:var(--fw-h);padding:0 16px;box-sizing:border-box;
  display:flex;align-items:center;justify-content:space-between;
  background:var(--fw-bg);border-bottom:1px solid var(--fw-line);
  font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
}
.fw-brand{font-size:18px;letter-spacing:.04em;color:var(--fw-ink)!important;text-decoration:none}

.fw-burger{
  display:flex;align-items:center;gap:10px;
  margin:0;padding:10px 0 10px 10px;border:0;background:none;cursor:pointer;
  font:inherit;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--fw-ink);
}
.fw-burger i{position:relative;display:block;width:22px;height:2px;background:currentColor;transition:background .2s}
.fw-burger i:before,
.fw-burger i:after{content:"";position:absolute;left:0;width:22px;height:2px;background:currentColor;transition:transform .2s}
.fw-burger i:before{top:-7px}
.fw-burger i:after{top:7px}
/* état ouvert : le burger devient une croix */
.fw-open .fw-burger i{background:transparent}
.fw-open .fw-burger i:before{transform:translateY(7px) rotate(45deg)}
.fw-open .fw-burger i:after{transform:translateY(-7px) rotate(-45deg)}


/* ---------------------------------------------------------------------
   2. Menu Muse existant transformé en panneau déroulant
      (Muse : opacité 40 %, gris clair, positionnement absolu → neutralisés)
   --------------------------------------------------------------------- */
nav.MenuBar{
  position:fixed!important;top:var(--fw-h)!important;left:0!important;right:0!important;z-index:9999!important;
  width:auto!important;height:auto!important;margin:0!important;padding:8px 0 16px!important;
  max-height:calc(100vh - var(--fw-h));overflow-y:auto;
  background:var(--fw-bg)!important;border-bottom:1px solid var(--fw-line);
  box-shadow:0 12px 24px rgba(0,0,0,.08);
  /* fermé par défaut */
  opacity:0;visibility:hidden;transform:translateY(-8px)!important;
  transition:opacity .2s,transform .2s,visibility .2s;
}
.fw-open nav.MenuBar{opacity:1;visibility:visible;transform:none!important}

/* remise à plat de la structure Muse (boîtes flottantes, largeurs fixes…) */
nav.MenuBar .MenuItemContainer,
nav.MenuBar ul,
nav.MenuBar li{
  display:block!important;float:none!important;position:static!important;
  width:auto!important;height:auto!important;min-height:0!important;
  margin:0!important;padding:0!important;border:0!important;
}
nav.MenuBar a.MenuItem{
  display:block!important;float:none!important;position:static!important;
  width:auto!important;height:auto!important;min-height:0!important;
  margin:0!important;padding:0!important;border:0!important;
  opacity:1!important;filter:none!important;background:transparent!important;
}
nav.MenuBar .MenuItemLabel{
  display:block!important;float:none!important;position:static!important;box-sizing:border-box;
  width:auto!important;min-height:0!important;margin:0!important;padding:13px 24px!important;
  text-align:left!important;font-size:17px!important;line-height:22px!important;color:var(--fw-ink)!important;
}
nav.MenuBar .MenuItemLabel p{color:inherit!important;margin:0!important;padding:0!important}

/* page en cours */
nav.MenuBar a.MuseMenuActive .MenuItemLabel{
  font-weight:bold;border-left:3px solid var(--fw-ink)!important;padding-left:21px!important;
}

/* 1er item « François Weil » : redondant avec la marque de l'en-tête */
nav.MenuBar > .MenuItemContainer:first-child{display:none!important}

/* sous-menus (ex. Sculptures2) : toujours dépliés, en retrait */
nav.MenuBar .SubMenu{
  display:block!important;visibility:visible!important;position:static!important;
  width:auto!important;margin:0!important;border:0!important;background:none!important;
}
nav.MenuBar .SubMenu .MenuItemLabel{padding-left:40px!important;font-size:15px!important;color:var(--fw-muted)!important}


/* ---------------------------------------------------------------------
   3. Bandeau de page : image + barre de titre (créé par mobile.js,
      contenu défini page par page dans mobile.js)
   --------------------------------------------------------------------- */
.fw-hero{display:block;width:100%;margin:0 0 16px}
.fw-hero img{display:block;width:100%;height:auto}
.fw-hero h1{
  margin:0;padding:9px 16px;background:var(--fw-bar);color:#fff;text-align:center;
  font:bold 15px/20px Arial,Helvetica Neue,Helvetica,sans-serif;letter-spacing:.02em;
}


/* ---------------------------------------------------------------------
   4. Nettoyage de la mise en page Muse
   --------------------------------------------------------------------- */
/* barres d'onglets grises vides (Gravures, Tableaux) : classe posée par mobile.js */
.fw-hidden{display:none!important}
