/* Module 3 — Menu Service : front-office. Réutilise le même design que le parcours de réservation
   (page "Options" : .options-content/.options-layout/.option-card/.booking-summary de
   booking-inline.css et booking-marketplace.css, déjà chargées globalement) plutôt que d'inventer de
   nouveaux composants — seuls le bandeau d'en-tête (propre à Menu Service) et le décalage sous l'en-tête
   fixe du site sont spécifiques à cette page. */

.menu-page{background:var(--ivory);padding-top:74px}

/* --- En-tête (hero) : compact, image + voile sombre, dans l'esprit de la section "Restaurant" de
   l'accueil, mais réduit pour laisser vite place au catalogue. --- */
.menu-hero{position:relative;height:clamp(220px,32vw,320px);display:flex;align-items:end;overflow:hidden;color:#fff}
.menu-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.menu-hero .shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,74,70,.92) 0%,rgba(11,74,70,.55) 55%,rgba(11,74,70,.25) 100%)}
.menu-hero-copy{position:relative;padding:0 7vw 30px;max-width:720px}
.menu-hero-copy .eyebrow{color:#ddb45f;font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px}
.menu-hero-copy h1{font:400 clamp(36px,5vw,58px)/1.05 var(--serif);margin:0 0 10px}
.menu-hero-copy h1 em{color:var(--gold);font-style:italic}
.menu-hero-copy p{margin:0;color:#dbe6e1;font-size:14px;max-width:560px;line-height:1.6}

/* --- Nav catégories : mêmes tuiles que "Choisir un univers", mais en <button> (filtre en JS, pas de
   rechargement de page) — on réplique donc les règles de .service-category-menu nav a pour nav button. --- */
.service-category-menu nav button{position:relative;flex:1 0 190px;min-height:105px;display:grid;align-content:center;gap:3px;padding:17px 19px;background:#fff;border:1px solid #d8e0dd;border-radius:9px;scroll-snap-align:start;transition:.25s;font:inherit;text-align:left;cursor:pointer}
.service-category-menu nav button:hover{transform:translateY(-3px);box-shadow:0 9px 24px #0b4a3815}
.service-category-menu nav button.active{background:var(--forest);border-color:var(--forest);color:#fff}
.service-category-menu nav button>span{font-size:9px;color:#a1844d;letter-spacing:.12em}
.service-category-menu nav button>b{font:21px var(--serif);font-weight:400}
.service-category-menu nav button>small{color:#768780;font-size:9px;line-height:1.35}
.service-category-menu nav button.active>small{color:#bad0c9}

/* --- Indicateur "déjà au panier" sur une carte article --- */
.option-in-cart{color:#4d8a86!important;font-weight:600;font-size:11px!important}

/* .option-card a son propre display:flex (booking-inline.css), qui passe outre le masquage HTML natif
   de l'attribut hidden posé par menu-service.js pour le filtre par catégorie — sans cette règle, un
   article filtré reste visible malgré hidden="true". */
.option-card[hidden]{display:none!important}

.no-rooms{grid-column:1/-1;text-align:center;padding:60px 20px;background:#fff;border-radius:12px}

/* .options-content prévoit un padding-top pensé pour le bandeau d'étapes du tunnel de réservation
   ("Étape 2 sur 3") ; la page Menu Service n'a pas cette étape, donc moins d'espace suffit ici. */
.menu-page .options-content{padding-top:34px}
@media(max-width:760px){.menu-page .options-content{padding-top:24px}}