/* =========================================================================
   MB Marrakech — Feuille de style principale
   Tokens de design « fine dining » + base accessible (WCAG AA).
   Les polices seront auto-hébergées en Phase 4 (perf). Pour l'instant :
   piles système élégantes en repli.
   ========================================================================= */

:root {
	/* Palette « luxe » : nuit profonde, crème, or patiné. */
	--mb-ink:        #14110d;   /* texte/fond sombre */
	--mb-ink-soft:   #2a241c;
	--mb-cream:      #ffffff;   /* fond clair (blanc) */
	--mb-cream-soft: #f4f4f4;
	--mb-gold:       #aca643;   /* COULEUR PRINCIPALE (accent) — boutons, bordures, sur fond sombre */
	--mb-gold-deep:  #67631f;   /* variante « texte » : ≥4.5:1 sur crème/crème-soft (WCAG AA) */
	--mb-line:       rgba(172,166,67,.38);
	--mb-overlay:    rgba(20,17,13,.55); /* overlay anti-illisibilité sur photos */

	/* Typographie : sérif éditorial pour les titres, sans-serif lisible pour le corps. */
	--mb-serif: "Minion Display", "Source Serif 4", Georgia, "Times New Roman", serif;
	--mb-sans:  "Poppins", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--mb-script: "Sacramento", "Brush Script MT", cursive; /* accent manuscrit doré */

	/* Échelle & rythme. */
	--mb-maxw: 1240px;
	--mb-gap:  clamp(1rem, 2vw, 2rem);
	--mb-section-y: clamp(3.5rem, 8vw, 7rem);

	--mb-radius: 2px;
	--mb-transition: .3s ease;
}

/* --- Reset léger --------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	font-family: var(--mb-sans);
	color: var(--mb-ink);
	background: var(--mb-cream);
	line-height: 1.65;
	font-size: clamp(1rem, .95rem + .25vw, 1.075rem);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;   /* anti-débordement horizontal (n'altère pas le sticky) */
}
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }

/* --- Titres -------------------------------------------------------------- */
h1, h2, h3, h4 { font-family: var(--mb-serif); font-weight: 400; line-height: 1.12; letter-spacing: .005em; }
/* Titres : Source Serif 4 (Regular), EN MAJUSCULES, jusqu'à 76px sur grand écran. */
h1 { font-size: clamp(2.6rem, 1.4rem + 5vw, 4.75rem); text-transform: uppercase; letter-spacing: .015em; }   /* ~76px max */
h2 { font-size: clamp(1.85rem, 1.2rem + 2.6vw, 3rem); text-transform: uppercase; letter-spacing: .015em; } /* ~48px max */
h3 { font-size: clamp(1.4rem, 1.1rem + 1.1vw, 1.9rem); }
.mb-overline {
	font-family: var(--mb-sans);
	text-transform: uppercase;
	letter-spacing: .28em;
	font-size: .72rem;
	font-weight: 600;
	color: var(--mb-gold-deep);
}

/* --- Layout -------------------------------------------------------------- */
.mb-container { width: min(100% - 2.5rem, var(--mb-maxw)); margin-inline: auto; }
.mb-section { padding-block: var(--mb-section-y); }

/* Apparition douce au défilement (désactivée si prefers-reduced-motion). */
@media (prefers-reduced-motion: no-preference) {
	.mb-reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s cubic-bezier(.16,.7,.3,1); will-change: opacity, transform; }
	.mb-reveal.is-visible { opacity: 1; transform: none; }
}

/* --- Boutons ------------------------------------------------------------- */
.mb-btn {
	display: inline-flex; align-items: center; gap: .5rem;
	font-family: var(--mb-sans);
	text-transform: uppercase; letter-spacing: .16em; font-size: .8rem;
	padding: .9rem 1.8rem;
	border: 1px solid var(--mb-gold);
	background: var(--mb-gold); color: var(--mb-ink);
	text-decoration: none; border-radius: var(--mb-radius);
	transition: background var(--mb-transition), color var(--mb-transition), border-color var(--mb-transition);
}
.mb-btn:hover, .mb-btn:focus-visible { background: transparent; color: var(--mb-gold-deep); }
.mb-btn--ghost { background: transparent; color: var(--mb-cream); border-color: var(--mb-cream); }
.mb-btn--ghost:hover, .mb-btn--ghost:focus-visible { background: var(--mb-cream); color: var(--mb-ink); }

/* Anti-débordement horizontal (bande blanche / scroll latéral sur mobile).
   « clip » ne casse pas position:sticky, contrairement à overflow:hidden. */
html, body { overflow-x: clip; max-width: 100%; }

/* --- Accessibilité ------------------------------------------------------- */
.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 1000;
	background: var(--mb-ink); color: var(--mb-cream);
	padding: .8rem 1.2rem; border-radius: 0 0 var(--mb-radius) 0;
}
.skip-link:focus { left: 0; }
:focus-visible { outline: 2px solid var(--mb-gold); outline-offset: 3px; }
.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px,1px,1px,1px); white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	* { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* --- En-tête / navigation ------------------------------------------------ */
.mb-header {
	display: flex; align-items: center; justify-content: space-between;
	gap: var(--mb-gap);
	padding: .8rem clamp(1.25rem, 4vw, 3rem);
}
.mb-logo a { font-family: var(--mb-serif); font-size: 1.4rem; letter-spacing: .04em; text-decoration: none; display: inline-flex; }
.mb-logo img, .mb-logo .custom-logo { height: clamp(34px, 5vw, 46px); width: auto; }
.mb-nav ul { list-style: none; display: flex; gap: clamp(1rem, 2vw, 2rem); padding: 0; align-items: center; }
.mb-nav a {
	text-transform: uppercase; letter-spacing: .14em; font-size: .8rem;
	text-decoration: none; padding: .4rem 0; position: relative;
}
.mb-nav a:hover, .mb-nav .current-menu-item > a { color: var(--mb-gold-deep); }
.mb-header__actions { display: flex; align-items: center; gap: 1rem; }

/* Bouton burger (mobile). */
.mb-burger {
	display: none; background: none; border: 0; cursor: pointer;
	width: 44px; height: 44px; padding: 10px;
}
.mb-burger span { display: block; height: 2px; background: var(--mb-ink); margin: 5px 0; transition: var(--mb-transition); }

@media (max-width: 860px) {
	.mb-burger { display: block; }
	.mb-nav {
		position: fixed; inset: 0 0 0 30%; transform: translateX(100%);
		background: var(--mb-cream); padding: 5rem 2rem; transition: transform var(--mb-transition);
		box-shadow: -10px 0 40px rgba(0,0,0,.15);
	}
	.mb-nav[data-open="true"] { transform: translateX(0); }
	.mb-nav ul { flex-direction: column; align-items: flex-start; gap: 1.4rem; }
}

/* --- Pied de page -------------------------------------------------------- */
.mb-footer { background: var(--mb-ink); color: #fff; padding-block: var(--mb-section-y); }
.mb-footer a { color: #fff; text-decoration: none; }
.mb-footer a:hover { color: var(--mb-gold); }
.mb-footer ul { list-style: none; }
.mb-footer__links { list-style: none; padding: 0; margin: 0; }
.mb-footer__links li { padding: .32rem 0; }
.mb-footer__links a { opacity: .9; }
.mb-footer__links a:hover { opacity: 1; }
.mb-footer__grid { display: grid; gap: clamp(2rem,4vw,3.5rem); grid-template-columns: 1.4fr 1fr 1.1fr 1.2fr; align-items: start; }
.mb-footer__logo { display: inline-block; color: var(--mb-cream); font-family: var(--mb-serif); font-size: 1.7rem; margin: 0 0 1.2rem; }
.mb-footer__logo-img { display: block; width: auto; max-width: 240px; height: auto; filter: brightness(0) invert(1); }
.mb-footer__brand p { opacity: .92; max-width: 34ch; line-height: 1.6; }
.mb-footer__head { color: #fff; text-transform: uppercase; letter-spacing: .18em; font-size: .82rem; font-family: var(--mb-sans); font-weight: 600; margin-bottom: 1.4rem; }

.mb-footer__social { display: flex; gap: 1.1rem; list-style: none; padding: 0; margin: 1.5rem 0 0; }
.mb-footer__social a { display: inline-flex; opacity: .85; transition: opacity .2s, color .2s; }
.mb-footer__social a:hover { opacity: 1; color: var(--mb-gold); }
.mb-footer__social svg { width: 20px; height: 20px; }

.mb-footer__hours, .mb-footer__contact { list-style: none; padding: 0; margin: 0; }
.mb-footer__hours li { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; opacity: .85; font-size: .92rem; }
.mb-footer__contact li { padding: .35rem 0; opacity: .95; }
.mb-footer__ico { color: var(--mb-gold); flex: 0 0 auto; line-height: 1.5; }

.mb-newsletter__row { display: flex; align-items: center; border-bottom: 1px solid rgba(246,241,231,.4); }
.mb-newsletter__row input { flex: 1 1 auto; background: transparent; border: 0; color: var(--mb-cream); padding: .6rem 0; font: inherit; }
.mb-newsletter__row input::placeholder { color: rgba(246,241,231,.55); }
.mb-newsletter__row input:focus { outline: none; }
.mb-newsletter__row button { flex: 0 0 auto; background: transparent; border: 0; color: var(--mb-cream); font-size: 1.3rem; cursor: pointer; padding: 0 .25rem; transition: color .2s; }
.mb-newsletter__row button:hover { color: var(--mb-gold); }
.mb-newsletter__consent { display: flex; gap: .5rem; align-items: flex-start; margin-top: 1rem; font-size: .82rem; opacity: .8; cursor: pointer; }
.mb-newsletter__consent input { margin-top: .2rem; }
.mb-newsletter__msg { font-size: .85rem; color: var(--mb-gold); margin-top: .8rem; min-height: 1em; }
.mb-newsletter p { opacity: .92; margin-bottom: 1rem; }

.mb-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(246,241,231,.15); font-size: .8rem; opacity: .95; }
.mb-footer__bottom p { margin: 0; }
.mb-footer__legal { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; list-style: none; padding: 0; margin: 0; text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; }
@media (max-width: 900px){ .mb-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){
	.mb-footer__grid { grid-template-columns: 1fr; }
	.mb-footer__bottom { flex-direction: column; align-items: flex-start; }
	.mb-footer__legal { gap: .5rem 1.1rem; letter-spacing: .08em; }
}

/* =========================================================================
   Sections (Phase 2) — hero, blocs alternés, cartes, carte/menu, contact…
   ========================================================================= */

.mb-link { font-weight:600; letter-spacing:.04em; text-decoration:none; color:var(--mb-gold-deep); }
.mb-link:hover { text-decoration:underline; }

/* --- Hero accueil -------------------------------------------------------- */
.mb-hero { position:relative; min-height:min(90vh,760px); display:grid; align-items:end; overflow:hidden; color:var(--mb-cream); }
.mb-hero__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mb-hero__overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(20,17,13,.78), rgba(20,17,13,.25) 55%, rgba(20,17,13,.4)); }
.mb-hero__inner { position:relative; padding-block:clamp(2.5rem,7vw,5.5rem); max-width:760px; }
.mb-hero__inner .mb-overline { color:var(--mb-gold); }
.mb-hero h1 { color:var(--mb-cream); margin:.4rem 0; }
.mb-hero__sub { font-size:1.15rem; max-width:48ch; opacity:.95; }
.mb-hero__actions { display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.8rem; }

/* --- Blocs alternés (concept / chef) ------------------------------------- */
.mb-split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.mb-split--reverse .mb-split__media { order:2; }
.mb-split__media img { width:100%; border-radius:var(--mb-radius); }
.mb-split__text .mb-overline { margin-bottom:.6rem; }
.mb-split__text h2 { margin-bottom:1rem; }
.mb-prose p { margin-bottom:1rem; }
.mb-prose h2 { font-size:clamp(1.35rem,1rem + 1.1vw,1.85rem); text-transform:none; letter-spacing:0; margin:2rem 0 .8rem; }
.mb-prose h3 { margin:1.6rem 0 .5rem; }
.mb-prose ul, .mb-prose ol { margin:0 0 1.2rem; padding-left:1.25rem; }
.mb-prose li { margin-bottom:.45rem; }
.mb-prose a:not(.mb-btn) { color:var(--mb-gold-deep); text-decoration:underline; text-underline-offset:.15em; }
.mb-prose .mb-btn { display:inline-block; margin-top:1rem; text-decoration:none; }
.mb-prose--page { max-width:72ch; }
.mb-prose--page h2:first-child, .mb-prose--page > p:first-child { margin-top:0; }
@media (max-width:780px){ .mb-split{ grid-template-columns:1fr; } .mb-split--reverse .mb-split__media{ order:0; } }

/* --- En-têtes de section ------------------------------------------------- */
.mb-section__head { text-align:center; max-width:60ch; margin-inline:auto; margin-bottom:2.5rem; }
.mb-section__intro { margin-top:.5rem; }
.mb-section__cta { text-align:center; margin-top:2.5rem; }

/* --- Cartes (plats / événements) ----------------------------------------- */
.mb-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--mb-gap); }
.mb-cards--2 { grid-template-columns:repeat(2,1fr); }
@media (max-width:820px){ .mb-cards, .mb-cards--2 { grid-template-columns:1fr; } }
.mb-card { background:#fff; border:1px solid var(--mb-line); border-radius:var(--mb-radius); overflow:hidden; }
.mb-card__media { position:relative; aspect-ratio:4/5; overflow:hidden; }
.mb-card__img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.mb-card:hover .mb-card__img { transform:scale(1.04); }
.mb-card__badge { position:absolute; top:1rem; left:1rem; background:var(--mb-gold); color:var(--mb-ink); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; padding:.35rem .7rem; }
.mb-card__body { padding:1.4rem 1.5rem 1.7rem; }
.mb-card__title { margin-bottom:.4rem; font-size:clamp(1.15rem,1rem + .5vw,1.45rem); line-height:1.22; text-transform:none; letter-spacing:0; }
.mb-card__desc { font-size:.95rem; opacity:.85; }
.mb-card__price { font-family:var(--mb-serif); font-size:1.25rem; color:var(--mb-gold-deep); margin-top:.6rem; }
.mb-card__price span { font-size:.75rem; opacity:.7; }
.mb-card--event .mb-card__link { text-decoration:none; color:inherit; display:block; }
.mb-card--post .mb-card__link { text-decoration:none; color:inherit; display:block; }
.mb-card--post .mb-card__media { aspect-ratio:3/2; }

/* --- Carrousel d'articles (Le Journal) ----------------------------------- */
.mb-carousel { position:relative; display:flex; align-items:center; gap:.5rem; }
.mb-carousel__viewport {
	flex:1 1 auto; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
	-ms-overflow-style:none; scrollbar-width:none;
}
.mb-carousel__viewport::-webkit-scrollbar { display:none; }
.mb-carousel__track { display:flex; gap:var(--mb-gap); }
.mb-carousel__item {
	flex:0 0 calc((100% - 2 * var(--mb-gap)) / 3); scroll-snap-align:start; min-width:0;
}
.mb-carousel.is-static .mb-carousel__track { justify-content:center; flex-wrap:wrap; }
.mb-carousel.is-static .mb-carousel__arrow { display:none; }
.mb-carousel__arrow {
	flex:0 0 auto; width:48px; height:48px; border:1px solid var(--mb-line); background:#fff;
	color:var(--mb-ink); font-size:1.6rem; line-height:1; cursor:pointer; border-radius:50%;
	transition:background .25s, border-color .25s, color .25s, opacity .25s;
}
.mb-carousel__arrow:hover:not(:disabled) { background:var(--mb-gold); border-color:var(--mb-gold); color:var(--mb-ink); }
.mb-carousel__arrow:disabled { opacity:.35; cursor:default; }
@media (max-width:820px){
	.mb-carousel__item { flex-basis:calc((100% - var(--mb-gap)) / 2); }
}
@media (max-width:560px){
	.mb-carousel__item { flex-basis:85%; }
	.mb-carousel__arrow { display:none; }
}

/* --- Bloc carte : split pleine largeur (texte + image débordante) -------- */
.mb-menu-feature { width:100%; }
.mb-menu-feature__grid { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:clamp(440px, 56vw, 680px); }
.mb-menu-feature__text {
	background:#f4f4f4; display:flex; align-items:center;
	padding:clamp(2.5rem,6vw,6rem) clamp(1.25rem,4vw,4rem);
}
.mb-menu-feature__card {
	background:#fff; max-width:540px; margin-left:auto;
	padding:clamp(2rem,4vw,3.5rem);
	box-shadow:0 40px 80px -50px rgba(20,17,13,.5);
}
.mb-menu-feature__title { margin:.4rem 0 1.1rem; }
.mb-menu-feature__intro { opacity:.85; margin-bottom:1.6rem; }
.mb-menu-feature__media { position:relative; min-height:340px; overflow:hidden; }
.mb-imgslider__track { position:absolute; inset:0; }
.mb-imgslider__slide { position:absolute; inset:0; margin:0; opacity:0; visibility:hidden; transition:opacity 1s ease; }
.mb-imgslider__slide.is-active { opacity:1; visibility:visible; }
.mb-imgslider:not(.has-multiple) .mb-imgslider__slide { opacity:1; visibility:visible; }
.mb-menu-feature__img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mb-imgslider__dots { position:absolute; bottom:1.25rem; left:0; right:0; z-index:3; display:flex; gap:.55rem; justify-content:center; }
.mb-imgslider__dot { width:10px; height:10px; border-radius:50%; border:1px solid rgba(255,255,255,.9); background:transparent; cursor:pointer; padding:0; transition:background .25s, transform .25s; }
.mb-imgslider__dot.is-active { background:#fff; transform:scale(1.15); }
@media (max-width:820px){
	.mb-menu-feature__grid { grid-template-columns:1fr; min-height:0; }
	.mb-menu-feature__media { min-height:300px; }
	.mb-menu-feature__card { max-width:none; margin:0; }
}

/* --- Galerie d'images alignée + lightbox — événements -------------------- */
.mb-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.mb-gallery__item {
	margin:0; padding:0; border:0; aspect-ratio:1/1; overflow:hidden;
	background:var(--mb-cream-soft); cursor:zoom-in; display:block;
}
.mb-gallery__img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.mb-gallery__item:hover .mb-gallery__img { transform:scale(1.05); }
@media (max-width:820px){ .mb-gallery { grid-template-columns:repeat(3,1fr); } }
@media (max-width:520px){ .mb-gallery { grid-template-columns:repeat(2,1fr); } }

/* Carrousel pleine largeur (section événements) */
.mb-events__head { margin-bottom:2.5rem; }
.mb-events__head-cols { display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,4vw,4rem); align-items:start; margin-top:.6rem; }
.mb-events__title { margin:0; }
.mb-events__head-right p { margin:0 0 1rem; opacity:.85; }
@media (max-width:820px){ .mb-events__head-cols { grid-template-columns:1fr; gap:1rem; } }

.mb-carousel--full { display:block; position:relative; }
.mb-carousel--full .mb-carousel__viewport { width:100%; }
.mb-carousel--full .mb-carousel__track { gap:8px; }
.mb-carousel--full .mb-carousel__item { flex-basis:calc((100% - 16px) / 3); height:400px; position:relative; cursor:zoom-in; }
.mb-carousel--full .mb-gallery__img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
@media (max-width:820px){ .mb-carousel--full .mb-carousel__item { flex-basis:calc((100% - 8px) / 2); } }
@media (max-width:520px){ .mb-carousel--full .mb-carousel__item { flex-basis:86%; } }

/* --- Contact (cartes + carte Google) ------------------------------------- */
.mb-home-contact__grid { display:grid; grid-template-columns:1fr 1.3fr; gap:clamp(1.5rem,4vw,3rem); align-items:stretch; }
.mb-home-contact__card { padding:clamp(2rem,4vw,3.5rem); display:flex; flex-direction:column; justify-content:center; }
.mb-home-contact__card--ask { background:#fff; box-shadow:0 40px 80px -55px rgba(20,17,13,.45); }
.mb-home-contact__card--book { background:#f4f4f4; color:var(--mb-ink); }
.mb-home-contact__card--book .mb-arrow-link--light { color:var(--mb-ink); border-bottom-color:var(--mb-gold); }
.mb-home-contact__card--book .mb-arrow-link--light:hover, .mb-home-contact__card--book .mb-arrow-link--light:focus-visible { color:var(--mb-gold-deep); border-bottom-color:var(--mb-gold-deep); }
.mb-home-contact__title { margin:0 0 1.4rem; line-height:1.15; }
.mb-home-contact__title .mb-script { display:block; font-style:italic; margin-left:0; }
.mb-home-contact__phone { display:inline-block; color:var(--mb-gold-deep); font-weight:700; font-size:1.2rem; letter-spacing:.02em; text-decoration:none; margin-bottom:1.1rem; }
.mb-home-contact__hours { list-style:none; padding:0; margin:0; }
.mb-home-contact__hours li { display:flex; justify-content:space-between; align-items:baseline; gap:1.25rem; padding:.5rem 0; font-size:.92rem; font-weight:300; border-bottom:1px solid rgba(20,17,13,.08); }
.mb-home-contact__hours li:last-child { border-bottom:0; }
.mb-hours__day { flex:0 0 auto; font-weight:500; }
.mb-hours__time { text-align:right; opacity:.75; white-space:nowrap; }
.mb-home-contact__email { display:inline-block; margin-top:1.1rem; color:var(--mb-gold-deep); text-decoration:none; }
.mb-home-contact__email:hover { text-decoration:underline; }
.mb-home-contact__card--book .mb-home-contact__addr { opacity:.95; margin-bottom:1.8rem; max-width:36ch; }
.mb-arrow-link--light { color:#fff; border-bottom-color:rgba(255,255,255,.8); }
.mb-arrow-link--light:hover, .mb-arrow-link--light:focus-visible { color:#fff; border-bottom-color:#fff; }
.mb-home-contact__map { margin-top:1.8rem; }
.mb-home-contact__map iframe { display:block; width:100%; }
@media (max-width:820px){ .mb-home-contact__grid { grid-template-columns:1fr; } }

/* Lightbox plein écran */
.mb-lightbox {
	position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center;
	background:rgba(15,12,9,.92); opacity:0; visibility:hidden; transition:opacity .3s ease;
	padding:clamp(1rem,4vw,3rem);
}
.mb-lightbox.is-open { opacity:1; visibility:visible; }
.mb-lightbox__img {
	max-width:100%; max-height:100%; object-fit:contain; box-shadow:0 30px 80px -20px rgba(0,0,0,.6);
	transform:scale(.96); transition:transform .3s ease;
}
.mb-lightbox.is-open .mb-lightbox__img { transform:scale(1); }
.mb-lightbox__btn {
	position:absolute; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.4);
	color:#fff; cursor:pointer; border-radius:50%; width:52px; height:52px; font-size:1.8rem; line-height:1;
	display:flex; align-items:center; justify-content:center; transition:background .25s, border-color .25s;
}
.mb-lightbox__btn:hover { background:var(--mb-gold); border-color:var(--mb-gold); color:var(--mb-ink); }
.mb-lightbox__close { top:clamp(1rem,3vw,2rem); right:clamp(1rem,3vw,2rem); font-size:1.4rem; }
.mb-lightbox__prev { left:clamp(.75rem,2vw,2rem); top:50%; transform:translateY(-50%); }
.mb-lightbox__next { right:clamp(.75rem,2vw,2rem); top:50%; transform:translateY(-50%); }
.mb-lightbox__count { position:absolute; bottom:clamp(1rem,3vw,2rem); left:0; right:0; text-align:center; color:rgba(255,255,255,.8); letter-spacing:.1em; font-size:.85rem; }
@media (max-width:560px){ .mb-lightbox__prev { left:.5rem; } .mb-lightbox__next { right:.5rem; } .mb-lightbox__btn { width:44px; height:44px; } }

/* --- FAQ (accordéon + schéma FAQPage) ------------------------------------ */
.mb-faq__list { max-width:780px; margin-inline:auto; }
.mb-faq__item { border-bottom:1px solid var(--mb-line); }
.mb-faq__item:first-child { border-top:1px solid var(--mb-line); }
.mb-faq__q {
	cursor:pointer; padding:1.1rem .25rem; list-style:none;
	font-family:var(--mb-serif); font-size:1.15rem; line-height:1.3;
	display:flex; justify-content:space-between; align-items:center; gap:1.5rem;
}
.mb-faq__q::-webkit-details-marker { display:none; }
.mb-faq__q::after { content:"+"; flex:0 0 auto; color:var(--mb-gold-deep); font-size:1.5rem; line-height:1; transition:transform .25s; }
.mb-faq__item[open] .mb-faq__q::after { content:"\2212"; }
.mb-faq__item[open] .mb-faq__q { color:var(--mb-gold-deep); }
.mb-faq__a { padding:0 .25rem 1.3rem; opacity:.85; max-width:64ch; }

/* --- Page carte (liste) -------------------------------------------------- */
.mb-menu-cat { margin-bottom:clamp(3rem,6vw,5rem); }
.mb-menu-cat__title { text-align:center; position:relative; margin-bottom:2.4rem; text-transform:uppercase; letter-spacing:.2em; font-size:clamp(1.3rem,1rem + 1.2vw,1.8rem); }
.mb-menu-cat__title::after { content:""; display:block; width:48px; height:1px; background:var(--mb-gold); margin:1.1rem auto 0; }
.mb-menu-cat__desc { text-align:center; max-width:48ch; margin:-1.4rem auto 2.4rem; opacity:.7; font-style:italic; }
.mb-menu-list { list-style:none; padding:0; max-width:720px; margin-inline:auto; display:grid; gap:1.9rem; }
.mb-menu-item__head { display:flex; align-items:baseline; gap:.7rem; }
.mb-menu-item__name { order:1; flex:0 1 auto; font-family:var(--mb-serif); font-size:1.05rem; font-weight:500; text-transform:uppercase; letter-spacing:.06em; margin:0; }
.mb-menu-item__head::after { content:""; order:2; flex:1 1 auto; border-bottom:1px dotted var(--mb-line); transform:translateY(-.25em); }
.mb-menu-item__star { color:var(--mb-gold); font-size:.8em; }
.mb-menu-item__price { order:3; flex:0 0 auto; font-family:var(--mb-serif); font-size:1.1rem; color:var(--mb-gold-deep); white-space:nowrap; }
.mb-menu-item__desc { font-size:.92rem; opacity:.7; margin-top:.45rem; max-width:56ch; line-height:1.55; }

/* Bloc SEO en bas de la carte (présentation soignée). */
.mb-menu-seo { background:#f4f4f4; }
.mb-menu-seo__inner { max-width:760px; margin-inline:auto; text-align:center; }
.mb-menu-seo__inner h2 { font-size:clamp(1.4rem,1rem + 1.4vw,2rem); text-transform:none; letter-spacing:0; margin:0 0 1.1rem; }
.mb-menu-seo__inner p { opacity:.85; line-height:1.7; }
.mb-menu-seo__inner p + p { margin-top:1rem; }
.mb-menu-seo__inner a { color:var(--mb-gold-deep); }

/* Formules : Menu Semano (déjeuner) & Découverte (dîner). */
.mb-formules__grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,3vw,2.5rem); align-items:stretch; max-width:980px; margin-inline:auto; }
.mb-formule { padding:clamp(2rem,3.5vw,3rem); border:1px solid var(--mb-line); display:flex; flex-direction:column; text-align:center; }
.mb-formule--dark { background:var(--mb-ink); color:var(--mb-cream); border-color:var(--mb-ink); }
.mb-formule__title { text-transform:uppercase; letter-spacing:.14em; font-size:clamp(1.2rem,1rem + .8vw,1.55rem); }
.mb-formule--dark .mb-formule__title { color:#fff; }
.mb-formule__cond { font-style:italic; opacity:.75; margin:.6rem 0 1.8rem; font-size:.9rem; }
.mb-formule__list { list-style:none; padding:0; margin:0 0 1.2rem; display:grid; gap:.9rem; }
.mb-formule__list li { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; border-bottom:1px dotted var(--mb-line); padding-bottom:.6rem; }
.mb-formule__price { font-family:var(--mb-serif); color:var(--mb-gold-deep); white-space:nowrap; }
.mb-formule__note { font-size:.85rem; opacity:.7; margin:0 0 1.6rem; }
.mb-formule__courses--semano { margin-top:.5rem; }
.mb-formule__courses { list-style:none; padding:0; margin:0; display:grid; gap:1.3rem; }
.mb-formule__courses li { display:flex; flex-direction:column; gap:.2rem; }
.mb-formule__step { text-transform:uppercase; letter-spacing:.16em; font-size:.7rem; color:var(--mb-gold); }
.mb-formule__dish { font-family:var(--mb-serif); font-size:1.05rem; }
.mb-formule__cdesc { font-size:.88rem; opacity:.75; }
@media (max-width:780px){ .mb-formules__grid { grid-template-columns:1fr; } }

/* Carrousel de photos de plats. */
.mb-menu-gallery { margin-block:clamp(1.5rem,4vw,3rem); }
.mb-menu-gallery__caption { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.4rem 1.1rem .9rem; color:#fff; font-family:var(--mb-serif); font-size:1.02rem; line-height:1.2; text-align:left; background:linear-gradient(transparent, rgba(20,17,13,.8)); }

/* --- Article seul (single) ----------------------------------------------- */
.mb-article-hero .mb-page-hero__inner { text-align:left; align-items:flex-start; }
.mb-article-hero h1 { font-size:clamp(1.7rem,1.2rem + 1.8vw,2.7rem); max-width:none; margin-inline:0; line-height:1.15; }
.mb-article-hero__date { margin-top:1rem; text-transform:uppercase; letter-spacing:.18em; font-size:.78rem; opacity:.85; }
.mb-article__body { max-width:760px; margin-inline:auto; font-size:1.05rem; line-height:1.8; }
.mb-article__body h2 { font-size:clamp(1.4rem,1rem + 1.4vw,2rem); text-transform:none; letter-spacing:0; margin:2.2rem 0 .9rem; }
.mb-article__body h3 { margin:1.8rem 0 .6rem; }
.mb-article__body p { margin-bottom:1.1rem; }
.mb-article__back { max-width:760px; margin:2.8rem auto 0; }
.mb-arrow-link--back::after { content:""; }
.mb-arrow-link--back::before { content:"← "; }
.mb-article-related { border-top:1px solid var(--mb-line); padding-top:clamp(2.5rem,5vw,4rem); }

/* --- Journal (page blog) : article en vedette + cartes alignées ---------- */
.mb-journal-feature { display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; margin-bottom:clamp(2.5rem,5vw,4rem); text-decoration:none; color:inherit; }
.mb-journal-feature__media { margin:0; aspect-ratio:4/3; overflow:hidden; }
.mb-journal-feature__img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.mb-journal-feature:hover .mb-journal-feature__img { transform:scale(1.04); }
.mb-journal-feature__title { font-size:clamp(1.6rem,1.2rem + 1.5vw,2.4rem); text-transform:none; letter-spacing:0; margin:.4rem 0 .9rem; }
.mb-journal-feature__body p { opacity:.8; margin-bottom:1rem; max-width:52ch; }
@media (max-width:820px){ .mb-journal-feature { grid-template-columns:1fr; } }

/* Cartes : corps en colonne, lien « Lire l'article » aligné en bas (même ligne). */
.mb-card--post .mb-card__link { display:flex; flex-direction:column; height:100%; }
.mb-card--post .mb-card__media { flex:0 0 auto; }
.mb-card--post .mb-card__body { display:flex; flex-direction:column; flex:1 1 auto; }
.mb-card--post .mb-card__body .mb-link { margin-top:auto; padding-top:.9rem; }

/* --- Pagination ---------------------------------------------------------- */
.pagination { margin-top:3rem; }
.pagination .nav-links { display:flex; gap:.5rem; justify-content:center; flex-wrap:wrap; }
.pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 .6rem; border:1px solid var(--mb-line); text-decoration:none; color:var(--mb-ink); }
.pagination .page-numbers.current, .pagination .page-numbers:hover { background:var(--mb-gold); border-color:var(--mb-gold); color:var(--mb-ink); }

/* --- Formulaire (contact) ------------------------------------------------ */
.mb-form { max-width:680px; margin-inline:auto; display:grid; gap:1.1rem; }
.mb-form label { display:flex; flex-direction:column; gap:.4rem; font-size:.82rem; text-transform:uppercase; letter-spacing:.1em; color:var(--mb-ink); }
.mb-form__row { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.mb-form input, .mb-form textarea { font:inherit; text-transform:none; letter-spacing:0; padding:.8rem 1rem; border:1px solid var(--mb-line); background:#fff; border-radius:0; color:var(--mb-ink); }
.mb-form input:focus, .mb-form textarea:focus { outline:none; border-color:var(--mb-gold); }
.mb-form textarea { resize:vertical; }
.mb-form .mb-btn { justify-self:start; margin-top:.4rem; cursor:pointer; border:0; }
.mb-form__hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.mb-form__notice { max-width:680px; margin:0 auto 1.5rem; padding:.9rem 1.2rem; border-left:3px solid var(--mb-gold); background:var(--mb-cream-soft); }
.mb-form__notice--err { border-left-color:#b3261e; }
@media (max-width:560px){ .mb-form__row { grid-template-columns:1fr; } }

/* --- Liste des événements (présentation éditoriale) ---------------------- */
.mb-events-list { display:grid; gap:clamp(3.5rem,7vw,6rem); max-width:1040px; margin:clamp(2.5rem,5vw,4rem) auto 0; }
.mb-event-row { display:grid; grid-template-columns:0.82fr 1fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; }
.mb-event-row:nth-child(even) .mb-event-row__media { order:2; }
.mb-event-row__media { position:relative; margin:0; height:clamp(240px,28vw,360px); }
.mb-event-row__media::before { content:""; position:absolute; top:18px; left:18px; right:-18px; bottom:-18px; border:1px solid var(--mb-gold); z-index:0; }
.mb-event-row:nth-child(even) .mb-event-row__media::before { left:-18px; right:18px; }
.mb-event-row__img { position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; }
.mb-event-row__title { margin:.1rem 0 1rem; }
.mb-event-row__body .mb-overline { margin-bottom:.6rem; }
.mb-event-row__body .mb-prose p { line-height:1.7; }
@media (max-width:780px){
	.mb-event-row { grid-template-columns:1fr; }
	.mb-event-row:nth-child(even) .mb-event-row__media { order:0; }
}

/* --- Page Chef ----------------------------------------------------------- */
.mb-chefpage__split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,6vw,6rem); align-items:center; max-width:1080px; margin-inline:auto; }
.mb-chefpage__split--reverse .mb-chefpage__portrait { order:2; }
.mb-chefpage__split--reverse .mb-chefpage__text { order:1; }
.mb-chefpage__portrait { position:relative; margin:0; aspect-ratio:4/5; }
.mb-chefpage__portrait::before { content:""; position:absolute; top:20px; left:20px; right:-20px; bottom:-20px; border:1px solid var(--mb-gold); z-index:0; }
.mb-chefpage__split--reverse .mb-chefpage__portrait::before { left:-20px; right:20px; }
.mb-chefpage__img { position:relative; z-index:1; width:100%; height:100%; object-fit:cover; }
.mb-chefpage__text { max-width:34rem; }
.mb-chefpage__name { margin:.3rem 0 1.4rem; }
.mb-chefpage__text .mb-prose p { line-height:1.75; }
.mb-chefpage__quote { background:var(--mb-cream-soft); text-align:center; padding-block:clamp(3rem,7vw,5rem); }
.mb-chefpage__quote blockquote { font-family:var(--mb-serif); font-style:italic; font-size:clamp(1.4rem,1rem + 2vw,2.4rem); line-height:1.4; max-width:26ch; margin:0 auto; }
.mb-chefpage__quote-sign { margin-top:1.5rem; text-transform:uppercase; letter-spacing:.2em; font-size:.8rem; color:var(--mb-gold-deep); }
@media (max-width:820px){
	.mb-chefpage__split { grid-template-columns:1fr; }
	.mb-chefpage__split--reverse .mb-chefpage__portrait,
	.mb-chefpage__split--reverse .mb-chefpage__text { order:0; }
}

/* --- Bandeau réservation ------------------------------------------------- */
.mb-cta-band { background:var(--mb-ink); color:var(--mb-cream); text-align:center; padding-block:clamp(3rem,7vw,5rem); }
.mb-cta-band h2 { color:var(--mb-cream); margin-bottom:1rem; }
.mb-cta-band p { max-width:52ch; margin:0 auto 1.8rem; opacity:.9; }
.mb-cta-band--img { position:relative; overflow:hidden; }
.mb-cta-band__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.mb-cta-band__overlay { position:absolute; inset:0; z-index:1; background:linear-gradient(rgba(20,17,13,.74), rgba(20,17,13,.8)); }
.mb-cta-band--img .mb-container { position:relative; z-index:2; }

/* --- En-tête de page ----------------------------------------------------- */
.mb-page-hero { padding-top:clamp(6rem,12vw,9.5rem); padding-bottom:clamp(3.5rem,8vw,6rem); text-align:center; background:var(--mb-cream-soft); }
.mb-page-hero--img { position:relative; color:var(--mb-cream); background:var(--mb-ink); }
.mb-page-hero--img .mb-page-hero__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mb-page-hero--img .mb-page-hero__inner { position:relative; }
.mb-page-hero--img h1 { color:var(--mb-cream); }
.mb-page-hero__inner { max-width:820px; margin-inline:auto; }

/* --- Contact ------------------------------------------------------------- */
.mb-contact { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.mb-contact__links { list-style:none; padding:0; display:grid; gap:.5rem; margin-bottom:1.5rem; }
.mb-contact__map iframe { border-radius:var(--mb-radius); }
@media (max-width:820px){ .mb-contact{ grid-template-columns:1fr; } }

/* --- 404 ----------------------------------------------------------------- */
.mb-404__inner { text-align:center; max-width:60ch; margin-inline:auto; }
.mb-404__actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:1.8rem; }

/* --- Réserver ------------------------------------------------------------ */
.mb-reserve { text-align:center; }
.mb-reserve__widget { margin-top:2rem; }

/* =========================================================================
   En-tête overlay (style fine dining) + barre d'infos + diaporama hero.
   ========================================================================= */

/* --- Conteneur d'en-tête : solide par défaut, transparent en overlay ----- */
.mb-site-header {
	position: absolute; top: 0; left: 0; right: 0; z-index: 100;
	background: var(--mb-cream); color: var(--mb-ink);
	box-shadow: 0 1px 0 var(--mb-line);
	transition: background .35s ease, color .35s ease, box-shadow .35s ease;
}
.mb-solid-header .mb-site-header { position: sticky; }
.mb-overlay-header .mb-site-header.is-stuck { position: fixed; }

/* État transparent (overlay sur le hero, avant défilement). */
.mb-overlay-header .mb-site-header:not(.is-stuck) {
	background: transparent; color: #fff; box-shadow: none;
}
/* Logo blanc en overlay (le PNG est noir → on l'inverse). */
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-logo img,
.mb-overlay-header .mb-site-header:not(.is-stuck) .custom-logo { filter: brightness(0) invert(1); }
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-logo a { color: #fff; }
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-nav > ul > li > a { color: #fff; }
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-burger span { background: #fff; }

/* --- Barre d'infos ------------------------------------------------------- */
.mb-topbar { font-size: .8rem; border-bottom: 1px solid var(--mb-line); }
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-topbar { border-color: rgba(255,255,255,.22); }
.mb-site-header.is-stuck .mb-topbar { display: none; } /* compact au défilement */
.mb-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: .55rem; flex-wrap: wrap; }
.mb-topbar__info { list-style: none; display: flex; gap: clamp(1rem,2.5vw,2.4rem); padding: 0; margin: 0; flex-wrap: wrap; }
.mb-topbar__info li { display: inline-flex; align-items: center; gap: .45rem; }
.mb-topbar__info a { text-decoration: none; color: inherit; }
.mb-topbar__info a:hover { color: var(--mb-gold-deep); }
.mb-ic { opacity: .8; }
.mb-topbar__social { list-style: none; display: flex; gap: .7rem; padding: 0; margin: 0; }
.mb-topbar__social a { display: inline-flex; opacity: .85; transition: opacity .2s, color .2s; color: inherit; }
.mb-topbar__social a:hover { opacity: 1; color: var(--mb-gold); }

/* --- Boutons supplémentaires --------------------------------------------- */
.mb-btn--outline { background: transparent; border-color: currentColor; color: inherit; }
.mb-btn--outline:hover, .mb-btn--outline:focus-visible { background: var(--mb-gold); border-color: var(--mb-gold); color: var(--mb-ink); }
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-btn--outline { color: #fff; }
.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-btn--outline:hover { background: #fff; color: var(--mb-ink); }

/* Décale le contenu des pages sans hero (en-tête sticky en flux). */
.mb-solid-header #mb-content { /* sticky est dans le flux : pas de décalage nécessaire */ }

/* =========================================================================
   Diaporama hero (slider) plein écran
   ========================================================================= */
.mb-hero.mb-slider { min-height: 100svh; min-height: 100vh; display: block; }
.mb-slider__track { position: absolute; inset: 0; }
.mb-slide {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	text-align: center; opacity: 0; visibility: hidden; transition: opacity 1.1s ease;
}
.mb-slide.is-active { opacity: 1; visibility: visible; }
.mb-slide__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mb-slide__overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(20,17,13,.6), rgba(20,17,13,.5) 45%, rgba(20,17,13,.78)); }
.mb-slide__inner { position: relative; color: var(--mb-cream); max-width: 1000px; padding: 9rem 1.5rem 4rem; }
.mb-slide__overline { color: var(--mb-gold); margin-bottom: 1rem; }
.mb-slide__title {
	color: #fff; font-weight: 500;
	font-size: clamp(2rem, 1.3rem + 3.4vw, 4rem); line-height: 1.1; letter-spacing: .015em;
	text-shadow: 0 2px 30px rgba(0,0,0,.25);
}
.mb-slide__sub {
	display: flex; align-items: center; justify-content: center;
	text-transform: uppercase; letter-spacing: .32em; font-size: clamp(.72rem,.9vw,.85rem);
	margin-top: 1.6rem; color: var(--mb-cream);
}
.mb-slide__sub::before, .mb-slide__sub::after { content: ""; width: 42px; height: 1px; background: currentColor; opacity: .7; margin: 0 1rem; }

/* Flèches + points. */
.mb-slider__arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
	width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.4); background: rgba(20,17,13,.18);
	color: #fff; font-size: 1.8rem; line-height: 1; cursor: pointer; border-radius: 50%;
	transition: background .25s, border-color .25s;
}
.mb-slider__arrow:hover, .mb-slider__arrow:focus-visible { background: var(--mb-gold); border-color: var(--mb-gold); color: var(--mb-ink); }
.mb-slider__arrow--prev { left: clamp(.75rem, 2vw, 2rem); }
.mb-slider__arrow--next { right: clamp(.75rem, 2vw, 2rem); }
.mb-slider__dots { position: absolute; bottom: 5.5rem; left: 0; right: 0; z-index: 5; display: flex; gap: .6rem; justify-content: center; }
.mb-slider__dot { width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgba(255,255,255,.8); background: transparent; cursor: pointer; padding: 0; transition: background .25s, transform .25s; }
.mb-slider__dot.is-active { background: var(--mb-gold); border-color: var(--mb-gold); transform: scale(1.15); }

@media (max-width: 860px) {
	.mb-slider__arrow { display: none; }
	.mb-topbar__info { font-size: .72rem; gap: .8rem; }
	.mb-topbar { display: none; } /* on garde l'écran respirant sur mobile */
	.mb-slide__inner { padding-top: 7rem; }
}
@media (prefers-reduced-motion: reduce) {
	.mb-slide { transition: none; }
}

/* --- Fil d'Ariane -------------------------------------------------------- */
.mb-breadcrumbs { background: var(--mb-cream-soft); border-bottom: 1px solid var(--mb-line); font-size: .82rem; }
.mb-breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: .8rem 0; margin: 0; }
.mb-breadcrumbs li { display: inline-flex; align-items: center; gap: .5rem; opacity: .9; }
.mb-breadcrumbs li:not(:last-child)::after { content: "›"; opacity: .5; }
.mb-breadcrumbs a { text-decoration: none; color: var(--mb-gold-deep); }
.mb-breadcrumbs a:hover { text-decoration: underline; }
.mb-breadcrumbs [aria-current="page"] { opacity: .65; }

/* =========================================================================
   Correctifs accessibilité (Phase 5)
   ========================================================================= */

/* Points du diaporama : cible tactile ≥ 24px (WCAG 2.2 — 2.5.8) sans changer le visuel. */
.mb-slider__dot { width: 24px; height: 24px; border: none; background: none; position: relative; display: inline-flex; }
.mb-slider__dot::before { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgba(255,255,255,.85); transition: background .25s, transform .25s; }
.mb-slider__dot.is-active::before { background: var(--mb-gold); border-color: var(--mb-gold); transform: translate(-50%,-50%) scale(1.15); }

/* Menu mobile : en mode overlay, les liens passaient en blanc → invisibles sur le tiroir crème. */
@media (max-width: 860px) {
	.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-nav > ul > li > a { color: var(--mb-ink); }
	/* Cibles tactiles confortables dans le tiroir. */
	.mb-nav a { padding-block: .6rem; font-size: .95rem; }
	/* Bouton burger/croix foncé quand le menu est ouvert (sinon blanc invisible sur le tiroir blanc). */
	.mb-burger[aria-expanded="true"] span,
	.mb-overlay-header .mb-site-header:not(.is-stuck) .mb-burger[aria-expanded="true"] span { background: var(--mb-ink); }
	/* Hero parfaitement centré sur mobile. */
	.mb-slide__inner { text-align: center; margin-inline: auto; }
	.mb-slide__overline, .mb-slide__title, .mb-slide__sub { margin-inline: auto; }
	.mb-slide__title { font-size: clamp(1.8rem, 6.5vw, 2.6rem); }
}

/* Burger animé en croix à l'ouverture (état piloté par aria-expanded). */
.mb-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mb-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.mb-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
/* Le <main> ciblé par le skip-link ne doit pas afficher de contour disgracieux. */
#mb-content:focus { outline: none; }

/* =========================================================================
   Section Concept « Venez nous rencontrer » (texte + double image décalée)
   ========================================================================= */
.mb-concept__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.mb-concept__text { max-width: 32rem; }
.mb-concept__title { font-size: clamp(2rem, 1.3rem + 3.2vw, 3.4rem); line-height: 1.1; margin: .6rem 0 1.2rem; } /* ~54px max */
/* Mot d'accent : même typographie sérif que le titre (plus de cursive). */
.mb-script {
	font-family: inherit; color: inherit; font-weight: inherit;
	font-size: 1em; display: inline; margin-left: .12em;
}
.mb-arrow-link {
	display: inline-block; margin-top: 1.8rem;
	text-transform: uppercase; letter-spacing: .18em; font-size: .78rem; font-weight: 500;
	text-decoration: none; color: var(--mb-ink);
	border-bottom: 2px solid var(--mb-gold); padding-bottom: .45rem;
	transition: color .2s ease, border-color .2s ease;
}
.mb-arrow-link::after { content: " →"; }
.mb-arrow-link:hover, .mb-arrow-link:focus-visible { color: var(--mb-gold-deep); border-color: var(--mb-gold-deep); }

/* Visuel : panneau décoratif + 2 photos qui se chevauchent. */
/* Diptyque : grande photo à gauche, petite centrée verticalement sur la droite (non alignées). */
.mb-concept__media { position: relative; }
.mb-concept__img { margin: 0; border-radius: var(--mb-radius); overflow: hidden; }
.mb-concept__img img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 3/4; }
.mb-concept__img--1 { position: relative; z-index: 1; width: 66%; margin-top: 0; }  /* GRANDE photo, à gauche */
.mb-concept__img--2 {                                                                /* petite photo, centrée verticalement à droite */
	position: absolute; z-index: 2; right: 0; top: 50%; transform: translateY(-50%); width: 46%;
	box-shadow: 0 24px 55px rgba(20,17,13,.18);
}

/* Image unique (déjà composée) : pleine largeur, ratio paysage 4/3 (= l'image), sans étirement. */
.mb-concept__media--single .mb-concept__img--1 { position: relative; width: 100%; margin-top: 0; aspect-ratio: 4 / 3; }
.mb-concept__media--single .mb-concept__img--1 picture { display: block; width: 100%; height: 100%; }
.mb-concept__media--single .mb-concept__img--1 img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }

@media (max-width: 820px) {
	.mb-concept__grid { grid-template-columns: 1fr; gap: 2.5rem; }
	.mb-concept__text { max-width: none; }
	.mb-concept__img--1 { width: 76%; margin-top: 0; }
	.mb-concept__img--2 { width: 48%; }
}

/* =========================================================================
   Barre d'infos en bas du hero (adresse · réseaux · téléphone/e-mail)
   ========================================================================= */
.mb-infobar {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 6;
	color: var(--mb-cream); font-size: .82rem;
	border-top: 1px solid rgba(246,241,231,.28);
	background: linear-gradient(to top, rgba(20,17,13,.45), transparent);
	padding-block: .9rem;
}
/* Grille 3 colonnes : réseaux parfaitement centrés sur la page. */
.mb-infobar__inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.2rem; }
.mb-infobar__addr { justify-self: start; }
.mb-infobar__social { justify-self: center; }
.mb-infobar__contact { justify-self: end; }
.mb-infobar p { margin: 0; }
.mb-infobar__addr, .mb-infobar__contact { display: inline-flex; align-items: center; gap: .5rem; }
.mb-infobar__contact a { display: inline-flex; align-items: center; gap: .45rem; }
.mb-infobar a { color: var(--mb-cream); text-decoration: none; transition: color .2s ease; }
.mb-infobar a:hover, .mb-infobar a:focus-visible { color: var(--mb-gold); }
.mb-infobar .mb-ic { opacity: .85; }
.mb-infobar__sep { opacity: .5; margin: 0 .5rem; }
.mb-infobar__social { list-style: none; display: flex; gap: .9rem; padding: 0; margin: 0; }
.mb-infobar__social a { display: inline-flex; opacity: .9; }
.mb-infobar__social a:hover { opacity: 1; }

@media (max-width: 860px) {
	.mb-infobar { font-size: .76rem; padding-block: .7rem; }
	.mb-infobar__inner { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.2rem; text-align: center; }
	.mb-infobar__addr, .mb-infobar__social, .mb-infobar__contact { justify-self: auto; }
}

/* =========================================================================
   Mosaïque « points forts » — pleine largeur (grande image + damier img/texte)
   ========================================================================= */
.mb-mosaic-section { width: 100%; }
.mb-mosaic {
	display: grid;
	grid-template-columns: 1.25fr 1fr 1fr;
	grid-template-rows: repeat(3, 1fr);
	height: 900px; max-height: 900px;   /* hauteur de toute la section */
	gap: 0;
}
.mb-mosaic__cell { position: relative; overflow: hidden; margin: 0; min-width: 0; min-height: 0; }
.mb-mosaic__big { grid-column: 1; grid-row: 1 / 4; }       /* grande image, pleine hauteur */
.mb-mosaic__cell picture { display: block; width: 100%; height: 100%; }
.mb-mosaic__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.mb-mosaic__imgcell:hover .mb-mosaic__img { transform: scale(1.04); }

.mb-mosaic__textcell { background: #f4f4f4; display: flex; align-items: center; }
.mb-mosaic__text { padding: clamp(1.6rem, 3vw, 3.2rem); max-width: 40ch; }
.mb-mosaic__title {
	text-transform: uppercase; letter-spacing: .03em;
	font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); margin-bottom: 1rem;
}
.mb-mosaic__text p { color: #5a5650; font-size: .95rem; line-height: 1.7; margin-bottom: 1.5rem; }
.mb-mosaic__link {
	display: inline-block; text-transform: uppercase; letter-spacing: .16em;
	font-size: .72rem; font-weight: 600; text-decoration: none; color: var(--mb-ink);
	padding-bottom: .5rem; border-bottom: 2px solid var(--mb-gold);
	transition: color .2s ease, border-color .2s ease;
}
.mb-mosaic__link:hover, .mb-mosaic__link:focus-visible { color: var(--mb-gold-deep); border-color: var(--mb-gold-deep); }

/* Tablette : la grande image passe en haut, le reste en 2 colonnes. */
@media (max-width: 980px) {
	.mb-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: minmax(220px, auto); height: auto; max-height: none; }
	.mb-mosaic__big { grid-column: 1 / 3; grid-row: auto; aspect-ratio: 16 / 9; }
}
/* Mobile : tout en une colonne. */
@media (max-width: 600px) {
	.mb-mosaic { grid-template-columns: 1fr; }
	.mb-mosaic__big { grid-column: auto; aspect-ratio: 4 / 3; }
	.mb-mosaic__imgcell { aspect-ratio: 4 / 3; }
}

/* =========================================================================
   Section « En cuisine / Chef » — grande image gauche + texte & paire à droite
   ========================================================================= */
.mb-chef { padding: var(--mb-section-y) clamp(1.25rem, 4vw, 3rem); }
.mb-chef__grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: clamp(.8rem, 1.5vw, 1.4rem); align-items: stretch; }
.mb-chef__big { position: relative; margin: 0; overflow: hidden; min-width: 0; min-height: 0; }
/* La grande image remplit la cellule en absolu → bas toujours aligné avec la paire. */
.mb-chef__big picture { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.mb-chef__cell picture { display: block; width: 100%; height: 100%; }
.mb-chef__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mb-chef__right { display: flex; flex-direction: column; gap: clamp(.8rem, 1.5vw, 1.4rem); min-width: 0; }
.mb-chef__text { padding: clamp(.5rem, 1vw, 1rem) clamp(.5rem, 2vw, 2.5rem); }
.mb-chef__title { margin: .5rem 0 1.3rem; }
.mb-chef__text .mb-prose p { margin-bottom: 1rem; }
.mb-chef__text .mb-arrow-link { margin-top: 1.4rem; }
.mb-chef__pair { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(.8rem, 1.5vw, 1.4rem); }
.mb-chef__cell { margin: 0; overflow: hidden; min-width: 0; aspect-ratio: 16 / 10; }
.mb-chef__cell .mb-chef__img { transition: transform .6s ease; }
.mb-chef__cell:hover .mb-chef__img { transform: scale(1.04); }

@media (max-width: 880px) {
	.mb-chef__grid { grid-template-columns: 1fr; }
	.mb-chef__big { aspect-ratio: 4 / 3; }
}

/* Titre de la section « Le Menu » sur 2 lignes équilibrées. */
.mb-menu-teaser .mb-section__head { max-width: none; }
.mb-menu-teaser .mb-section__head h2 { max-width: 14em; margin-inline: auto; text-wrap: balance; }
