/* Menu mobile — vivre-orleans.fr (≤ 1000 px), voir menu-mobile.js. Le bureau n'est pas touché. */
.vomm-burger, .vomm { display: none; }

@media (max-width: 1000px) {
  /* en-tête : la barre rouge de 110 px (et son burger centré) devient un liseré ; bouton rond en haut à droite */
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) { position: relative; padding: 0 !important; }
  /* ligne du titre : de l'air au-dessus, place pour le bouton à droite */
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) > .et_pb_row:nth-child(1) { margin: 0 auto !important; padding: 24px 0 8px !important; min-height: 0 !important; }
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) > .et_pb_row:nth-child(1) .et_pb_module,
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) > .et_pb_row:nth-child(1) > .et_pb_column { margin-bottom: 0 !important; }
  /* la silhouette n'est plus remontée sous le titre (Divi : -43 px) : entière, pleine largeur, à ses proportions */
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) > .et_pb_row:nth-child(2) { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) > .et_pb_row:nth-child(2) .et_pb_image { margin: 0 !important; width: 100% !important; max-width: none !important; }
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(1) > .et_pb_row:nth-child(2) .et_pb_image img { display: block; width: 100% !important; height: auto !important;
    /* sans les ballons (ils gênaient le bouton) : zone découpée au-dessus des toits, mesurée sur l'image (81-92 % de large) */
    clip-path: polygon(0 0, 81.2% 0, 81.2% 33.8%, 83.8% 33.8%, 83.8% 37.6%, 92.3% 37.6%, 92.3% 0, 100% 0, 100% 100%, 0 100%); }
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(2) { padding: 0 !important; min-height: 0 !important; height: 10px; overflow: hidden; }
  .et-l--header .et_builder_inner_content > .et_pb_section:nth-child(2) > * { display: none !important; }

  /* accueil : la une ne colle plus au liseré rouge (les articles ont déjà leur marge) */
  .jn { margin-top: 26px !important; }

  .vomm-burger { display: grid; place-content: center; gap: 5px; position: absolute; z-index: 20; top: 16px; right: 12px; width: 50px; height: 50px; padding: 0; border: 0; border-radius: 50%;
    background: #bf0a37; box-shadow: 0 6px 18px rgba(191, 10, 55, .4); cursor: pointer; transition: transform .2s; }
  .vomm-burger:active { transform: scale(.94); }
  .vomm-burger span { display: block; width: 22px; height: 3px; border-radius: 2px; background: #fff; }
  .vomm-burger span:nth-child(2) { width: 15px; margin-left: 7px; }
  .vomm-burger:focus-visible { outline: 3px solid #222; outline-offset: 3px; }

  /* menu plein écran : ouverture en cercle depuis le bouton */
  .vomm { position: fixed; inset: 0; z-index: 100000; color: #fff; font-family: "Open Sans", sans-serif;
    clip-path: circle(0 at var(--x, 90%) var(--y, 60px)); transition: clip-path .5s cubic-bezier(.7, 0, .2, 1); }
  .vomm.est-visible { display: block; }
  .vomm.est-ouvert { clip-path: circle(150vmax at var(--x, 90%) var(--y, 60px)); }
  html.vomm-bloque, html.vomm-bloque body { overflow: hidden !important; }
  .vomm-fond { position: absolute; inset: 0; background: radial-gradient(120% 80% at 100% 0%, #f0285a 0%, #e71447 35%, #bf0a37 75%, #8f0628 100%); }
  .vomm-fond::after { content: ""; position: absolute; left: -5%; right: -5%; bottom: -2px; height: 150px; opacity: .14;
    background: url("/wp-content/uploads/2020/02/Fond-vivre-a%CC%80-orleans-1.png") center bottom / auto 100% repeat-x; filter: brightness(0) invert(1); }
  .vomm-int { position: relative; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 20px 150px; }

  .vomm-tete { display: flex; align-items: center; justify-content: space-between; height: 48px; margin-bottom: 14px; }
  .vomm-logo { font: 500 24px/1 Oswald, sans-serif !important; letter-spacing: .04em; text-transform: uppercase; color: #fff !important; text-decoration: none !important; }
  .vomm-fermer { position: relative; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .16); cursor: pointer; }
  .vomm-fermer span { position: absolute; left: 14px; top: 23px; width: 20px; height: 2.5px; border-radius: 2px; background: #fff; transform: rotate(45deg); }
  .vomm-fermer span + span { transform: rotate(-45deg); }
  .vomm-fermer:focus-visible, .vomm a:focus-visible, .vomm-ouvrir:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

  /* apparition décalée des blocs */
  .vomm-meteo, .vomm-eti, .vomm-outils, .vomm-r { opacity: 0; transform: translateY(14px); transition: opacity .35s ease, transform .35s ease; transition-delay: 0s; }
  .vomm.est-ouvert .vomm-meteo, .vomm.est-ouvert .vomm-eti, .vomm.est-ouvert .vomm-outils, .vomm.est-ouvert .vomm-r { opacity: 1; transform: none; transition-delay: calc(.18s + var(--i, 0) * .05s); }

  .vomm-meteo { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, .95); color: #222 !important; text-decoration: none !important; box-shadow: 0 10px 30px rgba(80, 0, 20, .25); font-size: 15px; }
  .vomm-meteo .vom-ico { width: 34px; height: 34px; }
  .vomm-meteo .vo-meteo-menu-t { flex: 1; }
  .vomm-meteo b { font: 500 26px/1 Oswald, sans-serif; margin-right: 4px; vertical-align: -3px; }
  .vomm-meteo .vo-meteo-menu-fl { color: #bf0a37; font-weight: 700; font-size: 13.5px; white-space: nowrap; }

  .vomm-eti { margin: 22px 0 10px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
  .vomm-outils { display: flex; gap: 10px; overflow-x: auto; margin: 0 -20px; padding: 0 20px 6px; scroll-snap-type: x mandatory; scroll-padding-inline: 20px; scrollbar-width: none; }
  .vomm-outils::-webkit-scrollbar { display: none; }
  .vomm-outils a { flex: none; width: 140px; scroll-snap-align: start; border-radius: 12px; overflow: hidden; background: rgba(255, 255, 255, .12); color: #fff !important; text-decoration: none !important; box-shadow: 0 6px 18px rgba(80, 0, 20, .22); }
  .vomm-outils img { display: block; width: 140px; height: 96px; object-fit: cover; }
  .vomm-outils span { display: block; padding: 8px 10px 9px; font-size: 13.5px; font-weight: 700; }

  .vomm-nav { margin-top: 18px; }
  .vomm-nav ul { list-style: none; margin: 0; padding: 0; }
  .vomm-r { border-bottom: 1px solid rgba(255, 255, 255, .2); }
  .vomm-lien, .vomm-ouvrir { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 15px 0; border: 0; background: none; color: #fff !important; text-align: left; text-decoration: none !important; cursor: pointer;
    font: 500 28px/1.15 Oswald, sans-serif !important; letter-spacing: .01em; }
  .vomm-ouvrir i { flex: none; width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .16); position: relative; transition: transform .25s, background .25s; }
  .vomm-ouvrir i::before { content: ""; position: absolute; left: 10px; top: 9px; width: 8px; height: 8px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
  .vomm-ouvrir[aria-expanded="true"] i { transform: rotate(180deg); background: rgba(255, 255, 255, .3); }
  .vomm-sous { list-style: none; margin: -4px 0 12px; padding: 0 0 0 2px; }
  .vomm-sous[hidden] { display: none; }
  .vomm-sous a { display: block; padding: 8px 0 8px 14px; border-left: 2px solid rgba(255, 255, 255, .35); color: rgba(255, 255, 255, .92) !important; font-size: 16.5px; font-weight: 600; text-decoration: none !important; }
  .vomm-sous a:active { background: rgba(255, 255, 255, .1); }
}
@media (prefers-reduced-motion: reduce) {
  .vomm, .vomm-meteo, .vomm-eti, .vomm-outils, .vomm-r { transition: none !important; }
}
