/* =====================================================================
   CENTRE TECHNIQUE DE LA LITERIE — thème moderne
   Couleurs du magasin (reprises des anciennes feuilles de style) :
     bleu #295881 · bleu nuit #15436b · caramel #ba8054 / #ca8d5e · crème #faf6d4
   Titres : Fraunces (serif) — Texte : Inter
   Toutes les classes du thème commencent par « m- ».
   ===================================================================== */

/* Polices hébergées sur le site (pas d'appel à Google : plus rapide, conforme RGPD) — licence SIL OFL */
@font-face { font-family: 'Fraunces'; font-style: normal; font-display: swap; font-weight: 100 900; src: url('../fonts/theme/fraunces.woff2') format('woff2-variations'), url('../fonts/theme/fraunces.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-display: swap; font-weight: 100 900; src: url('../fonts/theme/inter.woff2') format('woff2-variations'), url('../fonts/theme/inter.woff2') format('woff2'); }

:root {
    --bleu: #295881;
    --nuit: #15436b;
    --nuit-profond: #0d2c47;
    --caramel: #ba8054;
    --caramel-clair: #ca8d5e;
    --caramel-fonce: #9a6541;
    --creme: #faf6d4;
    --creme-doux: #fbf9ef;
    --sable: #f3eee2;
    --encre: #16222e;
    --texte: #3d4a57;
    --gris: #6b7682;
    --ligne: #e6e1d4;
    --blanc: #ffffff;
    --rouge: #c62828;

    --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
    --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

    --largeur: 1240px;
    --gouttiere: clamp(16px, 4vw, 40px);
    --rayon: 16px;
    --rayon-petit: 10px;
    --ombre: 0 1px 2px rgba(13, 44, 71, .06), 0 8px 24px rgba(13, 44, 71, .08);
    --ombre-forte: 0 2px 4px rgba(13, 44, 71, .08), 0 20px 48px rgba(13, 44, 71, .16);
    --entete: 84px;
}

/* ── Base ─────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--entete) + 16px); -webkit-text-size-adjust: 100%; }
body.m {
    margin: 0;
    background: var(--blanc);
    color: var(--texte);
    font: 400 16px/1.65 var(--sans);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.m img { max-width: 100%; height: auto; }
.m a { color: var(--bleu); text-underline-offset: 3px; }
.m h1, .m h2, .m h3, .m h4 { color: var(--encre); margin: 0; line-height: 1.15; }
.m p { margin: 0 0 1em; }
.m :focus-visible { outline: 3px solid var(--caramel); outline-offset: 3px; border-radius: 4px; }
.m-conteneur { width: 100%; max-width: calc(var(--largeur) + 2 * var(--gouttiere)); margin: 0 auto; padding: 0 var(--gouttiere); }
.m-cache { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.m-evitement { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--nuit); color: #fff !important; border-radius: 8px; }
.m-evitement:focus { top: 12px; }
.m-icone { width: 1.05em; height: 1.05em; fill: currentColor; flex: none; vertical-align: -.15em; }
.m-ancre { display: block; position: relative; top: -8px; }

.m-surtitre {
    display: inline-flex; align-items: center; gap: 10px;
    margin: 0 0 14px !important;
    color: var(--caramel-fonce);
    font: 600 12.5px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase;
}
.m-surtitre::before { content: ''; width: 28px; height: 2px; background: currentColor; border-radius: 2px; }
.m-surtitre--clair { color: var(--caramel-clair); }
.m-titre-section { font: 500 clamp(28px, 3.4vw, 42px)/1.12 var(--serif); letter-spacing: -.01em; }
.m-titre-bloc { font: 500 clamp(26px, 2.6vw, 34px)/1.15 var(--serif); letter-spacing: -.01em; margin-bottom: 18px !important; }

/* ── Boutons ─────────────────────────────────────────────────────────── */
.m .m-bouton, .m button.m-bouton {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    height: auto; min-height: 46px; margin: 0; padding: 12px 22px;
    border: 1.5px solid transparent; border-radius: 999px;
    font: 600 15px/1.2 var(--sans); letter-spacing: .01em; text-decoration: none; text-transform: none;
    cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s;
    box-shadow: none;
}
.m .m-bouton:hover { transform: translateY(-1px); }
.m .m-bouton--grand { min-height: 54px; padding: 15px 28px; font-size: 16px; }
.m .m-bouton--caramel { background: var(--caramel); color: #fff; }
.m .m-bouton--caramel:hover { background: var(--caramel-fonce); color: #fff; box-shadow: 0 8px 20px rgba(154, 101, 65, .3); }
.m .m-bouton--bleu { background: var(--bleu); color: #fff; }
.m .m-bouton--bleu:hover { background: var(--nuit); color: #fff; }
.m .m-bouton--contour { border-color: var(--bleu); color: var(--bleu); background: transparent; }
.m .m-bouton--contour:hover { background: var(--bleu); color: #fff; }
.m .m-bouton--verre { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .55); color: #fff; backdrop-filter: blur(6px); }
.m .m-bouton--verre:hover { background: #fff; color: var(--nuit); }
.m .m-bouton .m-icone { width: 18px; height: 18px; }

/* ── Bandeau d'information + en-tête ─────────────────────────────────── */
.m-bandeau { background: var(--nuit-profond); color: rgba(255, 255, 255, .82); font-size: 13px; }
.m-bandeau__int { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 38px; }
.m-bandeau p { margin: 0 !important; }
.m-bandeau strong { color: var(--caramel-clair); font-weight: 600; }
.m-bandeau__liens { display: flex; gap: 22px; margin: 0; padding: 0; list-style: none; }
.m .m-bandeau a { display: inline-flex; align-items: center; gap: 7px; color: rgba(255, 255, 255, .9); text-decoration: none; }
.m .m-bandeau a:hover { color: #fff; }

.m-entete {
    position: sticky; top: 0; z-index: 50;
    background: rgba(255, 255, 255, .96); backdrop-filter: saturate(1.4) blur(10px);
    border-bottom: 1px solid transparent; transition: box-shadow .25s, border-color .25s;
}
.m-entete.est-defile { border-color: var(--ligne); box-shadow: 0 6px 24px rgba(13, 44, 71, .08); }
.m-entete__int { display: flex; align-items: center; gap: 28px; height: var(--entete); }
.m .m-logo { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; flex: none; }
.m-logo img { width: 52px; height: 52px; border-radius: 50%; box-shadow: 0 0 0 1px var(--ligne); }
.m-logo__texte { display: flex; flex-direction: column; line-height: 1.05; }
.m-logo__nom { font: 600 19px/1.1 var(--serif); color: var(--nuit); letter-spacing: -.01em; }
.m-logo__sous { font: 500 12px/1.3 var(--sans); color: var(--caramel-fonce); letter-spacing: .16em; text-transform: uppercase; }
.m-logo--clair .m-logo__nom { color: #fff; }
.m-logo--clair .m-logo__sous { color: var(--caramel-clair); }

.m-nav { margin-left: auto; }
.m-nav__liste { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.m-nav__item { position: relative; }
.m .m-nav__lien {
    display: inline-flex; align-items: center; gap: 6px;
    height: auto; margin: 0; padding: 10px 14px; border: 0; border-radius: 999px;
    background: none; color: var(--encre); font: 500 15px/1.2 var(--sans);
    text-decoration: none; cursor: pointer; white-space: nowrap; box-shadow: none;
}
.m .m-nav__lien:hover, .m-nav__item.est-ouvert > .m-nav__lien { background: var(--sable); color: var(--nuit); }
.m-nav__item.est-actif > .m-nav__lien { color: var(--bleu); }
.m-nav__item.est-actif > .m-nav__lien::after { content: ''; position: absolute; left: 14px; right: 14px; bottom: 2px; height: 2px; border-radius: 2px; background: var(--caramel); }
.m-chevron { width: 7px; height: 7px; border-right: 1.8px solid currentColor; border-bottom: 1.8px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s; }
.m-nav__item.est-ouvert .m-chevron { transform: translateY(1px) rotate(-135deg); }
.m-badge { display: inline-block; margin-left: 2px; padding: 2px 7px; border-radius: 999px; background: var(--rouge); color: #fff; font: 700 10px/1.4 var(--sans); letter-spacing: .06em; vertical-align: 1px; }

.m-deroulant, .m-mega {
    position: absolute; top: calc(100% + 10px); z-index: 60;
    background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); box-shadow: var(--ombre-forte);
    opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s, transform .18s, visibility .18s;
}
.m-nav__item.est-ouvert > .m-deroulant, .m-nav__item.est-ouvert > .m-mega { opacity: 1; visibility: visible; transform: none; }
.m-deroulant { left: 0; min-width: 250px; margin: 0; padding: 8px; list-style: none; }
.m .m-deroulant a { display: block; padding: 10px 14px; border-radius: var(--rayon-petit); color: var(--encre); text-decoration: none; font-weight: 500; }
.m .m-deroulant a:hover, .m .m-deroulant a[aria-current] { background: var(--sable); color: var(--bleu); }
.m-mega { left: 50%; width: min(980px, 92vw); margin-left: calc(min(980px, 92vw) / -2); padding: 24px; }
.m-nav__item--mega { position: static; }
.m-nav__item--mega .m-mega { left: 50%; }
.m-mega__grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 26px; }
.m-mega__cat { display: grid; grid-template-columns: 96px 1fr; grid-template-rows: auto 1fr; column-gap: 14px; }
.m-mega__visuel { grid-row: 1 / 3; display: block; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--sable); }
.m-mega__visuel img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.m-mega__cat:hover .m-mega__visuel img { transform: scale(1.06); }
.m-mega__titre { margin: 2px 0 4px !important; font: 600 15px/1.3 var(--serif); color: var(--nuit); }
.m-mega__cat ul { margin: 0; padding: 0; list-style: none; }
.m .m-mega__cat a { display: inline-block; padding: 2px 0; color: var(--texte); font-size: 14px; text-decoration: none; }
.m .m-mega__cat a:hover, .m .m-mega__cat a[aria-current] { color: var(--caramel-fonce); text-decoration: underline; }

.m-entete__cta { flex: none; }
.m .m-burger { display: none; position: relative; width: 46px; height: 46px; margin: 0 0 0 auto; padding: 0; border: 1px solid var(--ligne); border-radius: 12px; background: #fff; cursor: pointer; box-shadow: none; }
.m-burger span:first-child, .m-burger span:first-child::before, .m-burger span:first-child::after {
    position: absolute; left: 50%; width: 20px; height: 2px; margin-left: -10px; border-radius: 2px; background: var(--nuit); content: ''; transition: transform .25s, opacity .2s;
}
.m-burger span:first-child { top: 50%; }
.m-burger span:first-child::before { top: -6px; }
.m-burger span:first-child::after { top: 6px; }
.m-burger[aria-expanded="true"] span:first-child { background: transparent; }
.m-burger[aria-expanded="true"] span:first-child::before { transform: translateY(6px) rotate(45deg); }
.m-burger[aria-expanded="true"] span:first-child::after { transform: translateY(-6px) rotate(-45deg); }

.m-tiroir { position: fixed; inset: 0; top: var(--entete-mobile, 72px); z-index: 45; background: rgba(13, 44, 71, .35); }
.m-tiroir[hidden] { display: none; }
.m-tiroir__panneau { height: 100%; overflow-y: auto; background: #fff; padding: 12px var(--gouttiere) 32px; animation: m-tiroir .25s ease-out; }
@keyframes m-tiroir { from { transform: translateY(-12px); opacity: 0; } }
.m-tiroir__liste { margin: 0; padding: 0; list-style: none; }
.m-tiroir__liste > li { border-bottom: 1px solid var(--ligne); }
.m .m-tiroir__lien, .m-tiroir summary { display: flex; align-items: center; justify-content: space-between; padding: 16px 4px; color: var(--encre); font: 500 18px/1.3 var(--serif); text-decoration: none; cursor: pointer; list-style: none; }
.m-tiroir summary::-webkit-details-marker { display: none; }
.m-tiroir summary::after { content: '+'; font: 400 24px/1 var(--sans); color: var(--caramel); }
.m-tiroir details[open] summary::after { content: '–'; }
.m-tiroir details ul { margin: 0 0 12px; padding: 0 0 0 4px; list-style: none; }
.m .m-tiroir details a { display: block; padding: 9px 0; color: var(--texte); text-decoration: none; }
.m-tiroir__groupe { margin: 10px 0 2px !important; color: var(--caramel-fonce); font: 600 12px/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.m-tiroir__pied { display: grid; gap: 10px; margin-top: 24px; }

/* ── Hero d'accueil ──────────────────────────────────────────────────── */
.m-hero { position: relative; min-height: min(760px, calc(100svh - var(--entete) - 38px)); display: flex; align-items: flex-end; overflow: hidden; background: var(--nuit-profond); isolation: isolate; }
.m-hero__photos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 100% 50%; opacity: 0; transform: scale(1.04); transition: opacity 1.2s ease, transform 7s ease-out; z-index: -2; }
.m-hero__photos img.est-active { opacity: 1; transform: scale(1); }
.m-hero__voile { position: absolute; inset: 0; z-index: -1; background:
    linear-gradient(90deg, rgba(10, 34, 56, .88) 0%, rgba(10, 34, 56, .62) 38%, rgba(10, 34, 56, .08) 72%),
    linear-gradient(0deg, rgba(10, 34, 56, .55) 0%, rgba(10, 34, 56, 0) 45%); }
.m-hero__int { padding-top: 96px; padding-bottom: 88px; }
.m-hero__titre { max-width: 14ch; color: #fff !important; font: 500 clamp(38px, 5.6vw, 72px)/1.04 var(--serif) !important; letter-spacing: -.02em; }
.m-hero__texte { max-width: 540px; margin: 22px 0 32px !important; color: rgba(255, 255, 255, .88); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; }
.m-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.m-hero__atouts { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 40px 0 0; padding: 0; list-style: none; color: rgba(255, 255, 255, .9); font-size: 14px; font-weight: 500; }
.m-hero__atouts li { display: inline-flex; align-items: center; gap: 9px; }
.m-hero__atouts li::before { content: ''; width: 18px; height: 18px; border-radius: 50%; background: var(--caramel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.5 16.2 5.3 12l-1.4 1.4 5.6 5.6 12-12-1.4-1.4z'/%3E%3C/svg%3E") center / 13px no-repeat; }
.m-hero__puces { position: absolute; right: var(--gouttiere); bottom: 36px; display: flex; gap: 8px; }
.m .m-hero__puces button { width: 28px; height: 4px; margin: 0; padding: 0; border: 0; border-radius: 4px; background: rgba(255, 255, 255, .4); cursor: pointer; transition: background .2s, width .2s; box-shadow: none; }
.m .m-hero__puces button.est-active { width: 44px; background: #fff; }

/* ── En-tête de page de rayon ────────────────────────────────────────── */
.m-entete-page { background: linear-gradient(180deg, var(--creme-doux), #fff); border-bottom: 1px solid var(--ligne); }
.m-entete-page__int { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 5vw, 72px); align-items: center; padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(40px, 5vw, 64px); }
.m-ariane { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; color: var(--gris); font-size: 13.5px; }
.m .m-ariane a { color: var(--gris); text-decoration: none; }
.m .m-ariane a:hover { color: var(--bleu); text-decoration: underline; }
.m-ariane [aria-current] { color: var(--encre); font-weight: 500; }
.m-entete-page h1 { font: 500 clamp(40px, 5vw, 64px)/1.04 var(--serif); letter-spacing: -.02em; }
.m-entete-page__lead { max-width: 560px; margin: 20px 0 28px !important; font-size: 17.5px; line-height: 1.65; }
.m-entete-page__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.m-entete-page__visuel { position: relative; }
.m-entete-page__visuel img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; box-shadow: var(--ombre-forte); }
.m-entete-page__visuel::before { content: ''; position: absolute; inset: 18px -18px -18px 18px; z-index: -1; border-radius: 22px; background: var(--creme); }
.m-atouts { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 0; padding: 0; list-style: none; }
.m-atouts li { padding: 8px 14px; border: 1px solid var(--ligne); border-radius: 999px; background: #fff; color: var(--encre); font-size: 13.5px; font-weight: 500; }

/* ── Sections ────────────────────────────────────────────────────────── */
.m-section { padding: clamp(56px, 7vw, 96px) 0; }
.m-intro-sections { padding-top: clamp(56px, 7vw, 96px); text-align: center; }
.m-intro-sections .m-surtitre::after { content: ''; width: 28px; height: 2px; background: currentColor; border-radius: 2px; }
.m-intro-sections + .m-duo { padding-top: clamp(32px, 4vw, 48px); }
.m-duo + .m-duo { padding-top: 0; }
.m-duo__int { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.m-duo--inverse .m-duo__media { order: 2; }
.m-duo__texte { max-width: 520px; }
.m-duo__texte .m-titre-bloc::before { content: ''; display: block; width: 40px; height: 3px; margin-bottom: 20px; border-radius: 3px; background: var(--caramel); }
.m-prose p { margin: 0 0 .9em; }
.m-prose strong { color: var(--encre); font-weight: 600; }
.m-prose p.m-pastille { display: inline-flex; margin: 4px 6px 4px 0; padding: 7px 14px; border-radius: 999px; background: var(--sable); font-size: 14px; }
.m-duo__compte { margin-top: 22px !important; padding-top: 18px; border-top: 1px solid var(--ligne); color: var(--gris); font-size: 14px; }

/* Galeries dans le thème */
.m .galerie--m, .m .galerie--m-large { width: 100%; margin: 0; border-radius: 20px; background: var(--sable); box-shadow: var(--ombre); }
.m .galerie--m .galerie-cadre, .m .galerie--m-large .galerie-cadre { border-radius: 20px; }
.m .galerie--m .galerie-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; }
.m .galerie--m-large .galerie-item img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; border-radius: 0; }
.m .galerie .galerie-nav {
    width: 46px; height: 46px; border-radius: 50%;
    background: rgba(255, 255, 255, .92); color: var(--nuit);
    font: 400 30px/42px var(--sans); box-shadow: 0 4px 14px rgba(13, 44, 71, .18);
    opacity: .9;
}
.m .galerie .galerie-nav:hover, .m .galerie .galerie-nav:focus-visible { background: var(--nuit); color: #fff; opacity: 1; }
.m .galerie .galerie-prec { left: 16px; }
.m .galerie .galerie-suiv { right: 16px; }
.m .galerie .galerie-puces { bottom: 16px; }
.m .galerie .galerie-puces li { margin: 0 3px; }
.m .galerie .galerie-puce { width: 8px; height: 8px; overflow: hidden; border-radius: 50%; background: rgba(255, 255, 255, .6); color: transparent; font-size: 0; transition: width .2s, background .2s; }
.m .galerie .galerie-puce.est-active { width: 24px; border-radius: 8px; background: #fff; }
.m .galerie .galerie-compteur { right: 16px; bottom: 16px; padding: 5px 12px; background: rgba(13, 44, 71, .72); font: 600 13px/1.4 var(--sans); backdrop-filter: blur(4px); }

/* Bloc libre (HTML géré depuis l'administration) */
.m-libre { display: block; }

/* ── Cartes promo ────────────────────────────────────────────────────── */
.m-promos { background: var(--creme-doux); }
.m-promos + .m-promos, .m-ancre + .m-promos { border-top: 1px solid var(--ligne); }
.m-promos--uniques { background: #fff; }
.m-promos__entete { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 40px; margin-bottom: 36px; }
.m-promos__note { max-width: 340px; margin: 0 !important; color: var(--gris); font-size: 14px; }
.m-cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)); gap: 24px; }
.m-carte {
    position: relative; display: flex; flex-direction: column;
    background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); overflow: hidden;
    transition: transform .25s, box-shadow .25s, border-color .25s;
}
.m-carte:hover { transform: translateY(-4px); box-shadow: var(--ombre-forte); border-color: transparent; }
.m-carte__visuel { position: relative; aspect-ratio: 4 / 3; background: var(--sable); overflow: hidden; }
.m-carte__visuel img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.m-carte:hover .m-carte__visuel > img, .m-carte:hover .image-container img { transform: scale(1.04); }
.m-carte__visuel .image-container { height: 100%; }
.m-carte__vignettes { position: absolute; left: 10px; bottom: 10px; display: flex; gap: 6px; }
.m-carte__vignettes img { width: 44px !important; height: 44px !important; border: 2px solid #fff; border-radius: 8px; cursor: pointer; }
.m-carte__etiquette { position: absolute; left: 12px; top: 12px; padding: 6px 11px; border-radius: 999px; background: rgba(255, 255, 255, .94); color: var(--nuit); font: 600 12px/1.2 var(--sans); box-shadow: 0 2px 8px rgba(0, 0, 0, .08); }
.m-carte__vide { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--caramel-fonce); font: 500 18px/1.3 var(--serif); background: repeating-linear-gradient(135deg, var(--sable) 0 14px, #f7f3e9 14px 28px); }
.m-carte__corps { display: flex; flex: 1; flex-direction: column; padding: 20px 20px 22px; }
.m-carte__prix { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 12px; }
.m-carte__prix p { margin: 0 !important; }
.m-carte .price { color: var(--gris); font-size: 14px; text-decoration: line-through; text-decoration-color: rgba(107, 118, 130, .6); }
.m-carte .price strong { font-weight: 500; }
.m-carte .promo { color: var(--rouge); font: 600 22px/1.2 var(--sans); letter-spacing: -.01em; }
.m-carte .promo strong { font-weight: 700; }
.m-carte__eco { width: 100%; color: var(--gris); font-size: 12px; }
.m-carte__desc { flex: 1; color: var(--texte); font-size: 14.5px; line-height: 1.55; }
.m-carte__desc p { margin: 0 0 4px !important; }
.m-carte__desc p:first-child { color: var(--encre); font: 500 17px/1.35 var(--serif); margin-bottom: 8px !important; }
.m-carte__desc p:last-child:has(strong) { margin-top: 10px !important; color: var(--bleu); font-size: 13.5px; }
.m-carte__titre { font: 500 22px/1.2 var(--serif); margin-bottom: 8px !important; }
.m-carte__attente { color: var(--gris); font-size: 14.5px; }
.m .m-carte__bouton { align-self: flex-start; margin-top: 18px; min-height: 42px; padding: 10px 18px; font-size: 14px; }
.m-carte form[data-tailles] { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 14px; }
.m-carte form[data-tailles] label { color: var(--gris); }
.m-carte form[data-tailles] select { padding: 8px 32px 8px 12px; border: 1px solid var(--ligne); border-radius: 10px; background: #fff; color: var(--encre); font: 500 14px var(--sans); }
.m-carte--bientot .m-carte__visuel { aspect-ratio: 4 / 3; }

/* ── Marques partenaires ─────────────────────────────────────────────── */
.m-marques { padding: 48px 0; border-top: 1px solid var(--ligne); border-bottom: 1px solid var(--ligne); }
.m-marques__titre { margin: 0 0 24px !important; text-align: center; color: var(--gris); font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.m-marques ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px clamp(28px, 5vw, 64px); margin: 0; padding: 0; list-style: none; }
.m-marques img { display: block; height: 58px; width: auto; filter: grayscale(1); opacity: .7; mix-blend-mode: multiply; transition: filter .25s, opacity .25s; }
.m-marques li:hover img { filter: none; opacity: 1; }

/* ── Appel à l'action ────────────────────────────────────────────────── */
.m-appel-action { padding: clamp(56px, 7vw, 88px) 0; background: var(--nuit) radial-gradient(circle at 85% 20%, rgba(202, 141, 94, .22), transparent 45%); color: rgba(255, 255, 255, .86); }
.m-appel-action__int { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px 48px; }
.m-appel-action h2 { max-width: 20ch; color: #fff !important; font: 500 clamp(28px, 3.4vw, 42px)/1.12 var(--serif); }
.m-appel-action p:not(.m-surtitre) { max-width: 560px; margin: 14px 0 0 !important; }
.m-appel-action__boutons { display: flex; flex-wrap: wrap; gap: 12px; }

/* ── Pied de page ────────────────────────────────────────────────────── */
.m-pied { background: var(--nuit-profond); color: rgba(255, 255, 255, .72); font-size: 15px; }
.m-pied__haut { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.1fr; gap: 40px; padding: 72px 0 48px; }
.m-pied__marque p { max-width: 340px; margin: 20px 0 !important; }
.m-pied__titre { margin: 6px 0 16px !important; color: #fff; font: 600 13px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.m-pied ul { margin: 0; padding: 0; list-style: none; }
.m-pied li + li { margin-top: 10px; }
.m .m-pied a { color: rgba(255, 255, 255, .8); text-decoration: none; }
.m .m-pied a:hover { color: var(--caramel-clair); }
.m-pied address { margin: 0 0 16px; font-style: normal; line-height: 1.55; }
.m-pied address strong { color: #fff; font-weight: 600; }
.m .m-pied__tel { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 600; font-size: 17px; }
.m .m-pied__social { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; font-size: 14px; }
.m-pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding: 22px 0 28px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13.5px; }
.m-pied__bas p { margin: 0 !important; }
.m .m-appel { display: none; }

/* ── Accueil : blocs éditables (HTML des sections « libre ») ─────────── */
.m-univers__grille { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; margin-top: 40px; }
.m .m-tuile { position: relative; grid-column: span 4; display: flex; align-items: flex-end; min-height: 300px; padding: 26px; overflow: hidden; border-radius: 20px; color: #fff; text-decoration: none; isolation: isolate; background: var(--nuit); }
.m .m-tuile--large { grid-column: span 8; }
.m-tuile img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.m-tuile::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(10, 34, 56, .82) 0%, rgba(10, 34, 56, .1) 58%); }
.m-tuile:hover img { transform: scale(1.05); }
.m-tuile__nom { display: block; font: 500 clamp(22px, 2.2vw, 28px)/1.15 var(--serif); }
.m-tuile__detail { display: block; margin-top: 6px; color: rgba(255, 255, 255, .82); font-size: 14px; }
.m-tuile__fleche { position: absolute; right: 22px; bottom: 24px; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, .16); backdrop-filter: blur(6px); transition: background .25s, transform .25s; }
.m-tuile:hover .m-tuile__fleche { background: var(--caramel); transform: translateX(3px); }
.m-tuile__fleche::before { content: ''; width: 9px; height: 9px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: translateX(-2px) rotate(45deg); }

.m-entete-section { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 40px; }
.m-entete-section p:not(.m-surtitre) { max-width: 460px; margin: 0 !important; color: var(--gris); }

.m-piliers { background: var(--creme-doux); }
.m-piliers__grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 44px; }
.m-pilier { padding: 32px 30px; border: 1px solid var(--ligne); border-radius: 20px; background: #fff; }
.m-pilier__num { display: block; margin-bottom: 26px; color: var(--caramel); font: 500 15px/1 var(--serif); letter-spacing: .06em; }
.m-pilier img { display: block; width: 58px; height: 58px; margin-bottom: 20px; padding: 10px; border-radius: 14px; background: var(--creme); object-fit: contain; }
.m-pilier h3 { margin-bottom: 10px !important; font: 500 22px/1.25 var(--serif); }
.m-pilier p { margin: 0 !important; color: var(--texte); font-size: 15px; }

.m-atelier__int { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 88px); align-items: center; }
.m-atelier__photos { display: grid; grid-template-columns: 1.3fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; height: clamp(360px, 42vw, 540px); }
.m-atelier__photos img { width: 100%; height: 100%; object-fit: cover; border-radius: 18px; }
.m-atelier__photos img:first-child { grid-row: span 2; }
.m-chiffres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 30px 0 32px; padding: 22px 0; border-top: 1px solid var(--ligne); border-bottom: 1px solid var(--ligne); }
.m-chiffre strong { display: block; color: var(--nuit); font: 500 34px/1 var(--serif); letter-spacing: -.02em; }
.m-chiffre span { display: block; margin-top: 8px; color: var(--gris); font-size: 13.5px; line-height: 1.35; }

.m-bandeau-creme { background: var(--creme); }
.m-bandeau-creme__int { display: grid; grid-template-columns: auto 1fr auto; gap: 28px 44px; align-items: center; padding-top: 48px; padding-bottom: 48px; }
.m-bandeau-creme img { width: 104px; height: 104px; }
.m-bandeau-creme h2 { font: 500 clamp(24px, 2.6vw, 32px)/1.2 var(--serif); margin-bottom: 8px !important; }
.m-bandeau-creme p { margin: 0 !important; color: var(--texte); }

.m-magasins__grille { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 40px; }
.m-magasin { display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid var(--ligne); border-radius: 20px; background: #fff; }
.m-magasin__visuel { aspect-ratio: 16 / 7; background: var(--sable); }
.m-magasin__visuel img, .m-magasin__visuel iframe { display: block; width: 100%; height: 100%; border: 0; object-fit: cover; }
.m-magasin__corps { display: flex; flex-direction: column; gap: 6px; padding: 26px 28px 28px; }
.m-magasin h3 { font: 500 26px/1.2 var(--serif); }
.m-magasin__role { color: var(--caramel-fonce); font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.m-magasin address { margin: 6px 0 16px; font-style: normal; color: var(--texte); }
.m-magasin__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; }

/* ── Apparition au défilement ────────────────────────────────────────── */
.m-js [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.m-js [data-reveal].est-visible { opacity: 1; transform: none; }

/* ── Administration dans le thème ────────────────────────────────────── */
.m .ga-outils { max-width: calc(var(--largeur) + 2 * var(--gouttiere)); margin-left: auto; margin-right: auto; }
.m .m-hero > .ga-ouvrir { position: absolute; right: var(--gouttiere); top: 20px; z-index: 5; }
.m .m-carte[data-masquee] { opacity: .5; }
.m .ga-masquee .m-section, .m .ga-masquee .m-libre { opacity: .45; }

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 1180px) {
    .m .m-nav, .m .m-entete__cta { display: none; }
    .m .m-burger { display: block; flex: none; }
    :root { --entete: 72px; }
    .m-pied__haut { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .m-bandeau p { display: none; }
    .m-bandeau__int { justify-content: center; }
    .m-entete-page__int, .m-duo__int, .m-atelier__int { grid-template-columns: 1fr; }
    .m-duo--inverse .m-duo__media { order: 0; }
    .m-duo__texte { max-width: none; }
    .m-entete-page__visuel { order: 0; }
    .m-entete-page__visuel::before { display: none; }
    .m-univers__grille { grid-template-columns: 1fr 1fr; }
    .m .m-tuile, .m .m-tuile--large { grid-column: span 1; min-height: 220px; }
    .m-piliers__grille, .m-magasins__grille { grid-template-columns: 1fr; }
    .m-bandeau-creme__int { grid-template-columns: 1fr; text-align: left; }
    .m-hero__voile { background: linear-gradient(0deg, rgba(10, 34, 56, .92) 0%, rgba(10, 34, 56, .55) 55%, rgba(10, 34, 56, .2) 100%); }
}
@media (max-width: 600px) {
    body.m { font-size: 15.5px; }
    .m-logo__nom { font-size: 17px; }
    .m-logo img { width: 44px; height: 44px; }
    .m-hero { min-height: 600px; }
    .m-hero__int { padding-top: 64px; padding-bottom: 72px; }
    .m-hero__actions .m-bouton { width: 100%; }
    .m-hero__puces { left: var(--gouttiere); right: auto; bottom: 26px; }
    .m-univers__grille { grid-template-columns: 1fr; gap: 14px; }
    .m-chiffres { grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
    .m-chiffre strong { font-size: 26px; }
    .m-atelier__photos { height: 320px; }
    .m-pied__haut { grid-template-columns: 1fr; padding-top: 56px; }
    .m .galerie .galerie-nav { width: 38px; height: 38px; font-size: 24px; line-height: 34px; }
    .m .m-appel { display: inline-flex; position: fixed; right: 16px; bottom: 16px; z-index: 40; align-items: center; gap: 8px; padding: 13px 18px; border-radius: 999px; background: var(--caramel); color: #fff; font-weight: 600; text-decoration: none; box-shadow: 0 10px 24px rgba(154, 101, 65, .4); }
    body.m:has(.ga-barre) .m-appel { bottom: 80px; }
    .m-appel-action__boutons .m-bouton { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .m *, .m *::before, .m *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
    .m-js [data-reveal] { opacity: 1; transform: none; }
}

/* Tuiles « Nos univers » : largeur sur 12 colonnes */
.m .m-tuile--s8 { grid-column: span 8; }
.m .m-tuile--s6 { grid-column: span 6; }
@media (max-width: 900px) { .m .m-tuile--s8, .m .m-tuile--s6 { grid-column: span 1; } .m .m-tuile--s8:first-child { grid-column: 1 / -1; } }
@media (max-width: 600px) { .m .m-tuile--s8:first-child { grid-column: auto; } }
/* Tuile pleine largeur (dernière ligne quand le nombre de tuiles est impair) */
.m .m-tuile--s12 { grid-column: 1 / -1; }
@media (max-width: 900px) { .m-univers__grille:has(.m-tuile--s12) .m-tuile--s8:first-child { grid-column: span 1; } }
@media (max-width: 600px) { .m-univers__grille:has(.m-tuile--s12) .m-tuile--s8:first-child { grid-column: auto; } }

/* Tuiles qui regroupent plusieurs rayons (div.m-tuile--rayons, un lien a.m-tuile__rayon par rayon).
   Tactile / par défaut : pastilles toujours visibles sous le titre.
   Souris : la tuile se scinde en panneaux verticaux au survol ou au focus clavier. */
.m-tuile--rayons .m-tuile__fleche { display: none; }
.m-tuile__rayons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.m .m-tuile__rayon { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px; background: rgba(13, 44, 71, .55); backdrop-filter: blur(6px); color: #fff; font-size: 14.5px; font-weight: 600; text-decoration: none; transition: background .25s, border-color .25s; }
.m .m-tuile__rayon:hover, .m .m-tuile__rayon:active { background: var(--caramel); border-color: var(--caramel); }
.m-tuile__rayon-fleche { width: 7px; height: 7px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); }

@media (hover: hover) and (pointer: fine) {
    .m-tuile__texte { transition: opacity .25s ease, transform .25s ease; }
    .m-tuile__rayons { position: absolute; inset: 0; z-index: 1; display: flex; flex-wrap: nowrap; gap: 0; margin: 0; }
    .m .m-tuile__rayon { position: relative; flex: 1 1 0; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 10px; min-height: 0; padding: 26px 22px; border: 0; border-left: 1px solid rgba(255, 255, 255, 0); border-radius: 0; background: rgba(10, 34, 56, 0); backdrop-filter: none; opacity: 0; font-weight: 500; transition: opacity .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease; }
    .m .m-tuile__rayon:first-child { border-left: 0; }
    .m-tuile__rayon-nom { font: 500 clamp(19px, 1.7vw, 24px)/1.15 var(--serif); transform: translateY(8px); transition: transform .25s ease; }
    .m-tuile--3:not(.m-tuile--s8):not(.m-tuile--s6) .m-tuile__rayon { padding-inline: 14px; }
    .m-tuile--3:not(.m-tuile--s8):not(.m-tuile--s6) .m-tuile__rayon-nom { font-size: clamp(16px, 1.35vw, 20px); }
    .m-tuile__rayon-fleche { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .16); transform: translateY(8px); transition: background .25s, transform .25s ease; }
    .m-tuile__rayon-fleche::before { content: ''; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: translateX(-2px) rotate(45deg); }

    /* Scission : le titre s'efface, les panneaux apparaissent */
    .m-tuile--rayons:hover .m-tuile__texte > .m-tuile__nom, .m-tuile--rayons:focus-within .m-tuile__texte > .m-tuile__nom,
    .m-tuile--rayons:hover .m-tuile__texte > .m-tuile__detail, .m-tuile--rayons:focus-within .m-tuile__texte > .m-tuile__detail { opacity: 0; transform: translateY(-6px); transition: opacity .2s ease, transform .25s ease; }
    .m-tuile--rayons:hover::before, .m-tuile--rayons:focus-within::before { background: linear-gradient(0deg, rgba(10, 34, 56, .88) 0%, rgba(21, 67, 107, .45) 55%, rgba(21, 67, 107, .3) 100%); }
    .m-tuile--rayons:hover .m-tuile__rayon, .m-tuile--rayons:focus-within .m-tuile__rayon { opacity: 1; border-left-color: rgba(255, 255, 255, .28); }
    .m-tuile--rayons:hover .m-tuile__rayon:first-child, .m-tuile--rayons:focus-within .m-tuile__rayon:first-child { border-left-color: transparent; }
    .m-tuile--rayons:hover .m-tuile__rayon-nom, .m-tuile--rayons:focus-within .m-tuile__rayon-nom,
    .m-tuile--rayons:hover .m-tuile__rayon-fleche, .m-tuile--rayons:focus-within .m-tuile__rayon-fleche { transform: none; }

    /* Panneau visé : éclairci, liseré caramel, nom légèrement agrandi */
    .m .m-tuile--rayons .m-tuile__rayon:hover, .m .m-tuile--rayons .m-tuile__rayon:focus-visible { background: rgba(255, 255, 255, .12); box-shadow: inset 0 -4px 0 var(--caramel), inset 0 0 0 1px rgba(202, 141, 94, .55); outline: none; }
    .m-tuile__rayon:hover .m-tuile__rayon-nom, .m-tuile__rayon:focus-visible .m-tuile__rayon-nom { transform: scale(1.06); transform-origin: left bottom; }
    .m-tuile__rayon:hover .m-tuile__rayon-fleche, .m-tuile__rayon:focus-visible .m-tuile__rayon-fleche { background: var(--caramel); transform: translateX(3px); }
}
.m-entete-page__visuel .galerie { border-radius: 22px; box-shadow: var(--ombre-forte); }
.m-entete-page__visuel .galerie .galerie-item img { aspect-ratio: 4 / 3; }
.m-note-admin { margin: 6px auto !important; color: var(--gris); font-size: 13px; font-style: italic; }

/* Cartes : photos produit détourées sur fond blanc → affichées entières */
.m-carte__visuel { background: #fff; border-bottom: 1px solid var(--ligne); }
.m-carte__visuel img, .m-carte__visuel .image-container img { object-fit: contain; padding: 14px; }
.m-carte__vignettes img { padding: 0 !important; object-fit: cover !important; }
.m-carte form[data-tailles] { flex-wrap: nowrap; }
.m-carte form[data-tailles] label { flex: none; white-space: nowrap; margin: 0; }
.m-carte form[data-tailles] select { flex: 1; min-width: 0; }
@media (max-width: 900px) { .m-hero__photos img { object-position: 22% 50%; } }
@media (max-width: 600px) { .m-entete-page__actions .m-bouton { flex: 1 1 100%; } }

/* =====================================================================
   COMPOSANTS DES PAGES DE RAYON (blocs libres modernisés)
   ===================================================================== */

/* Introduction : titre à gauche, texte à droite */
.m-intro__int { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.m-intro__accroche { margin-top: 18px !important; color: var(--caramel-fonce); font: 500 19px/1.45 var(--serif); }
.m-intro__texte { font-size: 16.5px; }
.m-intro__texte ul { margin: 0 0 1em; padding-left: 1.1em; }
.m-intro__texte li { margin: 4px 0; }
.m-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 24px; margin-top: 44px; }
.m-figure { margin: 0; border: 1px solid var(--ligne); border-radius: 18px; overflow: hidden; background: #fff; }
.m-figure img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; padding: 12px; background: #fff; }
.m-figure figcaption { padding: 16px 20px 18px; border-top: 1px solid var(--ligne); color: var(--texte); font-size: 14.5px; }
.m-figure figcaption strong { display: block; margin-bottom: 4px; color: var(--encre); font: 500 17px/1.3 var(--serif); }
.m-figure--petite { max-width: 180px; border: 0; }
.m-figure--petite img { aspect-ratio: auto; padding: 0; }

/* Étapes / points clés illustrés */
.m-etapes { background: var(--creme-doux); }
.m-etapes__grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 24px; margin-top: 40px; }
.m-etapes--sans-titre .m-etapes__grille { margin-top: 0; }
.m-etapes + .m-etapes { padding-top: 0; }
.m-etape { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--ligne); border-radius: 18px; background: #fff; }
.m-etape__visuel { aspect-ratio: 4 / 3; background: var(--sable); }
.m-etape__visuel img { display: block; width: 100%; height: 100%; object-fit: cover; }
.m-etape__corps { padding: 22px 24px 26px; }
.m-etape__num { display: inline-block; margin-bottom: 10px; padding: 4px 11px; border-radius: 999px; background: var(--creme); color: var(--caramel-fonce); font: 600 12px/1.4 var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.m-etape h3 { margin-bottom: 10px !important; font: 500 21px/1.25 var(--serif); }
.m-etape p { margin: 0 0 .7em !important; font-size: 15px; }
.m-etape p:last-child { margin-bottom: 0 !important; }
.m-etape strong { color: var(--encre); font-weight: 600; }

/* Raisons numérotées */
.m-raisons__grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 18px; margin-top: 40px; counter-reset: raison; }
.m-raison { position: relative; padding: 26px 24px 24px; border: 1px solid var(--ligne); border-radius: 18px; background: #fff; }
.m-raison__num { display: block; margin-bottom: 16px; color: var(--caramel); font: 500 30px/1 var(--serif); }
.m-raison h3 { margin-bottom: 8px !important; font: 500 19px/1.3 var(--serif); }
.m-raison p { margin: 0 !important; font-size: 14.5px; }

/* Bloc court (titre + texte centré) */
.m-bloc-court { padding: clamp(48px, 6vw, 72px) 0 8px; text-align: center; }
.m-bloc-court .m-titre-section { margin: 0 auto; max-width: 24ch; }
.m-bloc-court p:not(.m-surtitre) { max-width: 640px; margin: 16px auto 0 !important; color: var(--texte); font-size: 17px; }
.m-bloc-court + .m-section { padding-top: 40px; }

/* Raccourcis vers les promotions (page Promotions) */
.m-raccourcis__grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 20px; margin-top: 40px; }
.m-raccourci { display: flex; flex-direction: column; gap: 14px; padding: 26px; border: 1px solid var(--ligne); border-radius: 18px; background: #fff; }
.m-raccourci--vedette { background: var(--nuit); border-color: var(--nuit); color: rgba(255, 255, 255, .85); }
.m-raccourci h3 { font: 500 22px/1.2 var(--serif); }
.m-raccourci--vedette h3 { color: #fff; }
.m-raccourci ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.m .m-raccourci li a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-radius: 12px; background: var(--sable); color: var(--encre); font-weight: 500; text-decoration: none; transition: background .2s, color .2s; }
.m .m-raccourci li a::after { content: '→'; color: var(--caramel-fonce); }
.m .m-raccourci li a:hover { background: var(--caramel); color: #fff; }
.m .m-raccourci li a:hover::after { color: #fff; }
.m .m-raccourci--vedette li a { background: rgba(255, 255, 255, .1); color: #fff; }

/* Encadré de texte (ex. finitions) */
.m-encadre { padding: 28px 30px; border-radius: 18px; background: var(--creme-doux); border: 1px solid var(--ligne); }
.m-liste-points { margin: 0; padding: 0; list-style: none; }
.m-liste-points li { position: relative; padding: 10px 0 10px 26px; border-bottom: 1px solid var(--ligne); }
.m-liste-points li:last-child { border-bottom: 0; }
.m-liste-points li::before { content: ''; position: absolute; left: 2px; top: 19px; width: 10px; height: 10px; border-radius: 50%; background: var(--caramel); }
.m-liste-points strong { color: var(--encre); }

/* Positions (fauteuils électriques) */
.m-positions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 18px; }
.m-positions img { width: 100%; aspect-ratio: 1; object-fit: contain; padding: 10px; border: 1px solid var(--ligne); border-radius: 14px; background: #fff; }

/* ── Contact ──────────────────────────────────────────────────────────── */
.m-contact__int { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.m-contact__infos { display: grid; gap: 16px; }
.m-contact__carte { padding: 24px 26px; border: 1px solid var(--ligne); border-radius: 18px; background: #fff; }
.m-contact__carte h3 { margin-bottom: 8px !important; font: 500 22px/1.2 var(--serif); }
.m-contact__carte address { margin: 0 0 12px; font-style: normal; }
.m-contact__carte--nuit { background: var(--nuit); border-color: var(--nuit); color: rgba(255, 255, 255, .85); }
.m-contact__carte--nuit h3 { color: #fff; }
.m .m-contact__carte--nuit a { color: #fff; font-weight: 600; font-size: 20px; text-decoration: none; }
.m-formulaire { padding: clamp(24px, 4vw, 40px); border: 1px solid var(--ligne); border-radius: 22px; background: #fff; box-shadow: var(--ombre); }
.m-formulaire h2 { margin-bottom: 6px !important; font: 500 28px/1.2 var(--serif); }
.m-formulaire__intro { margin-bottom: 24px !important; color: var(--gris); }
.m-formulaire__grille { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.m-champ { display: flex; flex-direction: column; gap: 6px; }
.m-champ--large { grid-column: 1 / -1; }
.m-champ label { color: var(--encre); font-size: 14px; font-weight: 600; }
.m-champ label small { color: var(--gris); font-weight: 400; }
.m .m-champ input, .m .m-champ textarea {
    width: 100%; height: auto; margin: 0; padding: 13px 15px;
    border: 1.5px solid var(--ligne); border-radius: 12px; background: var(--creme-doux);
    color: var(--encre); font: 400 15.5px/1.4 var(--sans); box-shadow: none; transition: border-color .2s, background .2s;
}
.m .m-champ textarea { min-height: 150px; resize: vertical; }
.m .m-champ input:focus, .m .m-champ textarea:focus { outline: 0; border-color: var(--bleu); background: #fff; box-shadow: 0 0 0 4px rgba(41, 88, 129, .12); }
.m-formulaire__bas { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; }
.m-formulaire__rgpd { max-width: 360px; margin: 0 !important; color: var(--gris); font-size: 12.5px; }

/* ── Aubaines : filtre + zoom ─────────────────────────────────────────── */
.m-filtres { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 32px; }
.m .m-filtre { height: auto; margin: 0; padding: 10px 18px; border: 1.5px solid var(--ligne); border-radius: 999px; background: #fff; color: var(--encre); font: 500 14.5px/1.2 var(--sans); cursor: pointer; box-shadow: none; transition: all .2s; }
.m .m-filtre:hover { border-color: var(--bleu); }
.m .m-filtre[aria-pressed="true"] { border-color: var(--nuit); background: var(--nuit); color: #fff; }
.m-carte[hidden] { display: none; }
.m-carte .current-image { cursor: zoom-in; }

/* ── Horaires ────────────────────────────────────────────────────────── */
.m-horaires__grille { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.m-horaires__carte { padding: 28px 30px; border: 1px solid var(--ligne); border-radius: 20px; background: #fff; }
.m-horaires__carte h3 { margin-bottom: 4px !important; font: 500 26px/1.2 var(--serif); }
.m-horaires__carte address { margin: 0 0 18px; color: var(--gris); font-style: normal; }
.m-horaires table { width: 100%; border-collapse: collapse; font-size: 15.5px; }
.m-horaires th, .m-horaires td { padding: 11px 0; border-bottom: 1px solid var(--ligne); text-align: left; vertical-align: top; }
.m-horaires th { width: 38%; color: var(--encre); font-weight: 600; }
.m-horaires td { color: var(--texte); }
.m-horaires tr:last-child th, .m-horaires tr:last-child td { border-bottom: 0; }
.m-horaires .m-ferme { color: var(--gris); font-style: italic; }
.m-horaires__note { margin-top: 16px !important; color: var(--gris); font-size: 13.5px; }

@media (max-width: 900px) {
    .m-intro__int, .m-contact__int, .m-horaires__grille { grid-template-columns: 1fr; }
    .m-formulaire__grille { grid-template-columns: 1fr; }
    .m-positions { grid-template-columns: repeat(2, 1fr); }
}
.m-entete-page--seul .m-entete-page__int { grid-template-columns: minmax(0, 760px); }
.m-entete-page__visuel { --cadrage: 50% 50%; }
.m-entete-page__visuel .m-entete-page__image, .m-entete-page__visuel .galerie-item img { object-position: var(--cadrage); }
.m-entete-page__image { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; box-shadow: var(--ombre-forte); }
.m-formulaire__succes { margin-bottom: 22px; padding: 14px 18px; border-radius: 12px; background: #e6f4ea; color: #1e5b33; }
.m-formulaire__captcha { margin-top: 18px; }
.m-intro__galerie { margin-top: 44px; }
.m-intro__galerie .galerie--m .galerie-item img { aspect-ratio: 16 / 9; }
.m .galerie--m-large .galerie-item img { aspect-ratio: 16 / 9; max-height: 640px; }
.m-photo { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 20px; box-shadow: var(--ombre); }
.m-atelier__photos--deux { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; }
.m-atelier__photos--deux img:first-child { grid-row: auto; }
.m-etapes--blanc { background: #fff; }
.m-duo--etape .m-duo__texte p strong { color: var(--nuit); font-weight: 600; }

/* ── Visionneuse : agrandissement des photos ─────────────────────────── */
.m .galerie-item img, .m .m-carte__visuel img:not(.thumbnail), .m .m-carte--html img { cursor: zoom-in; }
.m .galerie--m .galerie-cadre, .m .galerie--m-large .galerie-cadre, .m .m-carte__visuel { position: relative; }
.m [data-galerie] .galerie-cadre::after, .m .m-carte__visuel:has(> img:not(.thumbnail), .image-container)::after {
    content: ''; position: absolute; top: 14px; right: 14px; z-index: 2; width: 38px; height: 38px; border-radius: 50%;
    background: rgba(255, 255, 255, .92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315436b' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L20 20M10.5 7.5v6M7.5 10.5h6'/%3E%3C/svg%3E") center / 18px no-repeat;
    box-shadow: 0 4px 14px rgba(21, 67, 107, .18); opacity: 0; transform: scale(.85); transition: opacity .2s, transform .2s; pointer-events: none;
}
.m [data-galerie]:hover .galerie-cadre::after, .m .m-carte:hover .m-carte__visuel::after { opacity: 1; transform: none; }
@media (hover: none) { .m [data-galerie] .galerie-cadre::after, .m .m-carte__visuel::after { opacity: .9; transform: none; width: 32px; height: 32px; background-size: 16px; } }
.m .m-carte__visuel img:not(.thumbnail):focus-visible, .m [data-galerie]:focus-visible { outline: 3px solid var(--caramel); outline-offset: 3px; }

html.m-sans-defilement { overflow: hidden; }
.m-visionneuse {
    position: fixed; inset: 0; z-index: 300; display: grid; grid-template-rows: auto minmax(0, 1fr) auto;
    background: rgba(9, 27, 45, .96); color: #fff; opacity: 0; transition: opacity .2s ease;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); font-family: var(--sans);
}
.m-visionneuse[hidden] { display: none; }
.m-visionneuse.est-ouverte { opacity: 1; }
.m-visionneuse__haut { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px clamp(16px, 3vw, 32px); }
.m-visionneuse__compteur { font-size: 14px; font-weight: 600; letter-spacing: .08em; color: rgba(255, 255, 255, .78); font-variant-numeric: tabular-nums; }
.m-visionneuse button { margin: 0; padding: 0; border: 0; font: inherit; cursor: pointer; }
.m-visionneuse__fermer, .m-visionneuse__nav {
    display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
    background: rgba(255, 255, 255, .1); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
    transition: background .18s, color .18s, transform .18s;
}
.m-visionneuse__fermer:hover, .m-visionneuse__nav:hover { background: var(--caramel, #ba8054); box-shadow: none; }
.m-visionneuse__fermer:focus-visible, .m-visionneuse__nav:focus-visible, .m-visionneuse__vignettes button:focus-visible { outline: 3px solid var(--caramel, #ba8054); outline-offset: 3px; }
.m-visionneuse__nav:active { transform: scale(.94); }
.m-visionneuse__scene { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(8px, 2vw, 24px); min-height: 0; padding: 0 clamp(12px, 3vw, 32px); }
.m-visionneuse__figure { position: relative; display: flex; align-items: center; justify-content: center; height: 100%; min-height: 0; min-width: 0; margin: 0; }
.m-visionneuse__img { max-height: calc(100vh - 230px) !important; max-height: calc(100dvh - 230px) !important; }
.m-visionneuse.est-unique .m-visionneuse__img { max-height: calc(100vh - 170px) !important; max-height: calc(100dvh - 170px) !important; }
.m-visionneuse__img {
    display: block; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 14px; background: #fff;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .45); transform: scale(.97); transition: transform .25s ease, opacity .2s ease; cursor: default;
}
.m-visionneuse.est-ouverte .m-visionneuse__img { transform: none; }
.m-visionneuse__figure.est-chargement .m-visionneuse__img { opacity: .25; }
.m-visionneuse__chargement { position: absolute; width: 38px; height: 38px; border-radius: 50%; border: 3px solid rgba(255, 255, 255, .25); border-top-color: #fff; opacity: 0; animation: m-tourne .8s linear infinite; pointer-events: none; }
.m-visionneuse__figure.est-chargement .m-visionneuse__chargement { opacity: 1; }
@keyframes m-tourne { to { transform: rotate(360deg); } }
.m-visionneuse.est-unique .m-visionneuse__nav { visibility: hidden; }
.m-visionneuse__bas { display: grid; justify-items: center; gap: 12px; padding: 14px clamp(16px, 3vw, 32px) 20px; }
.m-visionneuse__legende { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 6px 14px; max-width: 900px; margin: 0; text-align: center; font-size: 15px; color: rgba(255, 255, 255, .88); }
.m-visionneuse__legende [data-legende] { font-family: var(--serif); font-size: 18px; color: #fff; }
.m-visionneuse__legende [data-prix] { padding: 3px 12px; border-radius: 999px; background: var(--rouge); color: #fff; font-size: 14px; font-weight: 700; }
.m-visionneuse__legende [data-prix]:empty, .m-visionneuse__legende [data-legende]:empty { display: none; }
.m-visionneuse__vignettes { display: flex; gap: 8px; max-width: 100%; overflow-x: auto; padding: 4px; scrollbar-width: thin; }
.m-visionneuse__vignettes[hidden] { display: none; }
.m-visionneuse__vignettes button { flex: none; width: 64px; height: 48px; border-radius: 8px; overflow: hidden; background: #fff; opacity: .5; box-shadow: 0 0 0 2px transparent; transition: opacity .18s, box-shadow .18s; }
.m-visionneuse__vignettes button img { width: 100%; height: 100%; object-fit: cover; display: block; }
.m-visionneuse__vignettes button:hover { opacity: .85; }
.m-visionneuse__vignettes button[aria-selected="true"] { opacity: 1; box-shadow: 0 0 0 2px var(--caramel, #ba8054); }
@media (max-width: 700px) {
    .m-visionneuse__scene { grid-template-columns: minmax(0, 1fr); padding: 0 10px; }
    .m-visionneuse__nav { position: absolute; top: 50%; z-index: 2; width: 42px; height: 42px; margin-top: -21px; background: rgba(9, 27, 45, .55); }
    .m-visionneuse__nav--prec { left: 14px; }
    .m-visionneuse__nav--suiv { right: 14px; }
    .m-visionneuse__img { border-radius: 10px; }
    .m-visionneuse__vignettes button { width: 52px; height: 40px; }
    .m-visionneuse__legende [data-legende] { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) { .m-visionneuse, .m-visionneuse__img { transition: none; } }
.m .m-carte__visuel::after { top: auto !important; bottom: 12px; right: 12px; }
