/* ================= Couche de finition du site =================
   Chargée en tête de page, avant la charte : les règles qui doivent l'emporter sur
   la charte utilisent le préfixe « body:not(#mry) » (priorité d'un identifiant). */

/* ---------- Polices : Schibsted Grotesk (texte et titres), IBM Plex Mono (chiffres, relevés) ---------- */
@font-face {
  font-family: "Schibsted Grotesk";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/schibsted-grotesk-latin.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/ibm-plex-mono-latin-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/ibm-plex-mono-latin-500.woff2") format("woff2");
}
:root {
  --f-display: "Schibsted Grotesk", ui-sans-serif, system-ui, sans-serif !important;
  --f-body: "Schibsted Grotesk", ui-sans-serif, system-ui, sans-serif !important;
  --f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
}
body:not(#mry), body:not(#mry) :is(button, input, select, textarea) { font-family: var(--f-body); }
body:not(#mry) { font-size: 17px; }

/* ---------- Titres : une seule couleur, une seule police, sans effets ---------- */
body:not(#mry) :is(h1, h2) { font-family: var(--f-display) !important; font-weight: 600; letter-spacing: -.03em; }
body:not(#mry) h3 { font-family: var(--f-display) !important; font-weight: 600; letter-spacing: -.01em; }
body:not(#mry) :is(h1 em, h2 em, h1 .l2, h1 > span:not([class]), h2 > span:not([class]), .door-title em, .em) {
  font-family: inherit !important;
  font-style: normal !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  letter-spacing: inherit !important;
  line-height: inherit !important;
  color: inherit !important;
}
p, li, dd { text-wrap: pretty; }

/* ---------- Plus de petites étiquettes en capitales au-dessus des titres ---------- */
body:not(#mry) .eyebrow:not(.keep) { display: none !important; }
body:not(#mry) .eyebrow.keep {
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--f-mono);
  font-size: 13px;
  font-weight: 500;
  gap: 0;
}
body:not(#mry) .eyebrow.keep::before { display: none !important; }

/* ---------- En-tête : plat, pleine largeur, sans verre dépoli ---------- */
body:not(#mry) .site-head {
  margin: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  background: #fff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  top: 0 !important;
}
body:not(#mry) .universes { background: none !important; padding: 0 !important; border-radius: 0 !important; gap: 18px !important; box-shadow: none !important; justify-content: flex-start !important; }
body:not(#mry) .uni { background: none !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; }
body:not(#mry) .uni svg { display: none; }
body:not(#mry) .uni[aria-current], body:not(#mry) .uni.current, body:not(#mry) .uni.is-current { text-decoration: underline; text-underline-offset: 5px; }

/* ---------- Boutons : texte normal, angles nets ---------- */
body:not(#mry) .btn {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 15px !important;
  font-weight: 600;
  border-radius: 4px !important;
  box-shadow: none !important;
}
.btn { transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }

/* ---------- Décors génériques retirés ---------- */
body:not(#mry) :is(.float-card, .seal, .c-values, .c-tagline) { display: none !important; }
body:not(#mry) .corners::before, body:not(#mry) .corners::after { display: none !important; }

/* ---------- Pastilles → simple texte ---------- */
body:not(#mry) .door-list { gap: 0 !important; }
body:not(#mry) .door-list > span {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-weight: 500;
}
body:not(#mry) .door-list > span + span::before { content: "·"; margin: 0 .55em; color: var(--muted); }
body:not(#mry) .door-list > .mry-chip-offer { color: var(--blue) !important; font-weight: 700; }

/* ---------- Chiffres et relevés en police à chasse fixe ---------- */
body:not(#mry) :is(.tarif-big, .tarif dd) { font-family: var(--f-mono) !important; letter-spacing: -.02em; }

/* ---------- Cartes : pictogrammes nus ---------- */
:is(.need, .trust-item, .c-metier:not(.feature), .pillar) .ic {
  background: none !important;
  width: auto !important;
  height: auto !important;
  justify-content: start;
  place-items: start;
}
:is(.need, .trust-item, .c-metier, .pillar) .ic svg { width: 24px; height: 24px; }

/* ---------- Photos : zoom lent au survol ---------- */
:is(.offer-photo, .work-photo, .join-photo) { overflow: hidden; }
:is(.offer-photo, .work-photo, .join-photo) img { transition: transform 1.2s var(--ease); }
:is(article, a, div):hover > :is(.offer-photo, .work-photo) img,
:is(.offer-photo, .work-photo, .join-photo):hover img { transform: scale(1.04); }

/* ---------- Apparitions : discrètes ---------- */
.js .reveal { transform: translateY(14px); transition: opacity .7s var(--ease), transform .8s var(--ease); transition-delay: var(--d, 0s); }

/* ---------- Défilement doux (Lenis) ---------- */
html.lenis, html.lenis body { height: auto; }
html.lenis { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-smooth iframe { pointer-events: none; }

/* ---------- Passage d'une page à l'autre : simple fondu ---------- */
@view-transition { navigation: auto; }
.site-head { view-transition-name: site-head; }
::view-transition-old(root) { animation: mry-vt-out .18s ease-in both; }
::view-transition-new(root) { animation: mry-vt-in .3s ease-out both; }
@keyframes mry-vt-out { to { opacity: 0; } }
@keyframes mry-vt-in { from { opacity: 0; } }

/* ---------- Barre de progression façon mètre ruban ---------- */
body #scrollProgress {
  height: 6px !important;
  transform: none !important;
  clip-path: inset(0 calc(100% - var(--mry-p, 0) * 100%) 0 0);
  /* id + !important : la charte redéfinit déjà « background » en !important selon la page */
  background-image:
    repeating-linear-gradient(90deg, rgba(255,255,255,.85) 0 1px, transparent 1px 50px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.55) 0 1px, transparent 1px 10px) !important;
  background-size: 100% 100%, 100% 45% !important;
  background-repeat: no-repeat !important;
}

/* ---------- En-tête fin : barre utilitaire de 30 px, navigation de 56 px ---------- */
body:not(#mry) .topbar-in { min-height: 30px !important; padding-top: 0 !important; padding-bottom: 0 !important; align-items: center !important; }
body:not(#mry) .topbar { font-size: 12.5px !important; border-bottom: 1px solid var(--line) !important; }
body:not(#mry) :is(.nav, .scrolled .nav) { height: 56px !important; }
body:not(#mry) .logo-svg { height: 30px !important; width: auto !important; }
body:not(#mry) .logo-word b { font-size: 17px !important; }
body:not(#mry) .nav .btn { padding: 9px 15px !important; font-size: 14px !important; }
body:not(#mry) .navlinks a { font-size: 14.5px; }

/* En défilant, la barre utilitaire disparaît (l'espace est conservé : la page ne saute pas) */
.site-head.scrolled.mry-compact .topbar { display: none; }
.site-head.scrolled.mry-compact { margin-bottom: var(--mry-tb, 0px) !important; }

/* ---------- Le plan se dessine quand il apparaît ---------- */
.c-plan.mry-draw svg [data-mry-line] {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  transition: stroke-dashoffset 1.8s cubic-bezier(.65,0,.35,1);
  transition-delay: var(--mry-d, 0s);
}
.c-plan.mry-draw svg text,
.c-plan.mry-draw svg [fill^="url(#chatch"] { opacity: 0; transition: opacity .6s ease 1.4s; }
.c-plan.mry-draw.mry-drawn svg [data-mry-line] { stroke-dashoffset: 0; }
.c-plan.mry-draw.mry-drawn svg text,
.c-plan.mry-draw.mry-drawn svg [fill^="url(#chatch"] { opacity: 1; }

/* ================= Audit gratuit (page Professionnels) ================= */
.mry-audit {
  background: var(--ink);
  color: var(--on-dark);
  padding-block: clamp(80px, 10vw, 130px);
}
.mry-audit-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(40px, 6vw, 96px);
  align-items: center;
}
body:not(#mry) .mry-audit .eyebrow.keep { color: var(--gold); }
.mry-audit h2 { margin-top: 14px; color: var(--on-dark); }
.mry-audit .lead { color: var(--on-dark-muted); margin-top: 20px; }
.mry-audit .lead strong { color: var(--on-dark); font-weight: 600; }

.mry-steps { list-style: none; margin: 32px 0 0; padding: 0; counter-reset: mry-step; border-top: 1px solid rgba(255,255,255,.14); }
.mry-steps li {
  counter-increment: mry-step;
  display: grid;
  grid-template-columns: 40px 1fr;
  column-gap: 12px;
  padding: 16px 0;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.mry-steps li::before {
  content: counter(mry-step);
  grid-row: span 2;
  font-family: var(--f-mono);
  font-size: 15px;
  color: var(--gold);
  padding-top: 2px;
}
.mry-steps b { font-weight: 600; color: var(--on-dark); }
.mry-steps span { color: var(--on-dark-muted); font-size: 15px; }

.mry-audit-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 32px; }
.mry-audit-cta .btn-gold:hover { background: var(--paper); color: var(--ink); }
.mry-audit-tel { color: var(--on-dark-muted); font-size: 15px; }
.mry-audit-tel b { color: var(--on-dark); font-weight: 600; font-family: var(--f-mono); border-bottom: 1px solid rgba(255,255,255,.3); }
.mry-audit-tel:hover b { border-color: var(--gold); }
.mry-audit-fine { margin-top: 18px; font-size: 13px; color: var(--on-dark-muted); max-width: 52ch; }

/* La fiche : un relevé papier, pas une interface */
.mry-sheet {
  margin: 0;
  position: relative;
  background: #F7F5F0;
  color: var(--ink);
  border-radius: 2px;
  padding: clamp(22px, 3vw, 32px);
  box-shadow: 0 24px 50px -24px rgba(0,0,0,.6);
  font-family: var(--f-mono);
}
.mry-sheet-head { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding-bottom: 16px; border-bottom: 1.5px solid var(--ink); }
.mry-sheet-kicker { font-size: 12px; color: var(--muted); }
.mry-sheet-head strong { grid-column: 1; font-family: var(--f-display); font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.mry-sheet-tag { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 12px; color: var(--muted); }
.mry-sheet-rows { list-style: none; margin: 0; padding: 0; }
.mry-sheet-rows li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 12px;
  padding: 12px 0;
  border-bottom: 1px dashed #CFCAC0;
}
.mry-k { font-family: var(--f-display); font-weight: 600; font-size: 15px; }
.mry-note { grid-column: 1; font-size: 12.5px; color: var(--muted); }
.mry-s { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.mry-s.ok { color: #2E6B47; }
.mry-s.warn { color: #8A6100; }
.mry-s.alert { color: #B83B3B; text-decoration: underline; text-underline-offset: 3px; }
.mry-s.plan { color: #3D5A80; }
.mry-sheet-foot { display: flex; justify-content: space-between; gap: 12px; padding-top: 14px; font-size: 12.5px; }
.mry-sheet-foot span:last-child { color: var(--muted); }
.mry-stamp {
  position: absolute;
  right: 30%;
  bottom: clamp(48px, 6vw, 58px);
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #B83B3B;
  border: 2.5px solid currentColor;
  border-radius: 4px;
  padding: 5px 12px;
  rotate: -10deg;
  opacity: .8;
  mix-blend-mode: multiply;
  pointer-events: none;
}
.js .mry-sheet .mry-stamp { opacity: 0; scale: 1.6; transition: opacity .2s ease .9s, scale .3s cubic-bezier(.3,1.4,.6,1) .9s; }
.js .mry-sheet.in .mry-stamp { opacity: .8; scale: 1; }

@media (max-width: 900px) { .mry-audit-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .mry-sheet-foot { flex-direction: column; gap: 4px; max-width: 58%; }
  .mry-stamp { right: 16px; bottom: 22px; font-size: 15px; padding: 4px 9px; border-width: 2px; }
}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  .c-plan.mry-draw svg [data-mry-line] { transition: none; stroke-dashoffset: 0; }
  .c-plan.mry-draw svg text,
  .c-plan.mry-draw svg [fill^="url(#chatch"] { opacity: 1; transition: none; }
  .js .mry-sheet .mry-stamp { transition: none; opacity: .8; scale: 1; }
}

/* ---------- Petits libellés : plus de capitales espacées ---------- */
body:not(#mry) :is(.tarif-sub, .step small, .offer-kicker, .work-meta, .door-kicker, .c-path-kicker, .dipl small, .also-label) {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-family: var(--f-mono) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
body:not(#mry) :is(.foot-col h4, .c-urg-safe strong, .c-badge) {
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* ================= Accueil : « Vous êtes… » un particulier / un commerce ================= */
@property --who-c { syntax: "<color>"; inherits: true; initial-value: #2457A7; }
.mry-who {
  --who-c: #2457A7;
  padding-block: clamp(72px, 9vw, 120px);
  background: var(--sand, #F6F4EF);
  border-block: 1px solid var(--line);
  transition: --who-c .5s;
}
.mry-who[data-who="pro"] { --who-c: #A84B2A; }
.mry-who-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 14px 22px; }
.mry-who-top h2 { margin: 0; }

/* Interrupteur : une pastille qui glisse sous l'option choisie */
.mry-switch {
  position: relative;
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: clamp(17px, 1.6vw, 21px);
}
.mry-switch button {
  position: relative;
  z-index: 1;
  border: 0;
  background: none;
  font: inherit;
  font-weight: 600;
  letter-spacing: -.01em;
  padding: 10px 22px;
  border-radius: 999px;
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
  transition: color .35s var(--ease);
}
.mry-switch button[aria-selected="true"] { color: #fff; }
.mry-switch button:focus-visible { outline: 2px solid var(--who-c); outline-offset: 2px; }
.mry-switch-thumb {
  position: absolute;
  top: 4px; bottom: 4px; left: 4px;
  width: var(--w, calc(50% - 4px));
  transform: translateX(var(--x, 0px));
  border-radius: 999px;
  background: var(--who-c);
  transition: transform .5s cubic-bezier(.6,0,.2,1), width .5s cubic-bezier(.6,0,.2,1), background-color .5s ease;
}

/* Scène : les deux contenus superposés, la hauteur ne bouge pas à la bascule */
.mry-who-stage { margin-top: clamp(32px, 4vw, 48px); }
.mry-who-panel {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: center;
}
.mry-who-panel + .mry-who-panel { margin-top: 56px; }
.js .mry-who-stage { display: grid; }
.js .mry-who-panel { grid-area: 1 / 1; margin: 0; }
.js .mry-who-panel:not(.is-on) { visibility: hidden; pointer-events: none; }

.mry-who-photo { overflow: hidden; border-radius: 4px; aspect-ratio: 4 / 3; background: #e9e6df; }
.mry-who-photo img { width: 100%; height: 100%; object-fit: cover; }
.mry-who-kicker { font-family: var(--f-mono); font-size: 13px; color: var(--who-c); }
.mry-who-body h3 { font-size: clamp(24px, 2.4vw, 32px); line-height: 1.12; margin-top: 10px; max-width: 22ch; }
.mry-who-list { list-style: none; margin: 26px 0 0; padding: 0; border-top: 1px solid var(--line); }
.mry-who-list li { display: grid; grid-template-columns: minmax(150px, 2fr) 5fr; gap: 4px 20px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.mry-who-list b { font-weight: 600; }
.mry-who-list span { color: var(--muted); font-size: 15.5px; }
.mry-who-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 28px; }
.mry-who .btn-primary { background: var(--who-c); color: #fff; transition: background-color .5s ease, transform .3s var(--ease); }
.mry-who .btn-primary:hover { background: var(--ink); }
.mry-who-link { font-weight: 600; color: var(--ink); border-bottom: 1.5px solid var(--who-c); padding-bottom: 2px; transition: border-color .5s ease; }

/* Bascule : la photo se dévoile, le texte arrive en léger décalé */
.js .mry-who-panel .mry-who-photo { clip-path: inset(0 0 0 100%); transition: clip-path .7s cubic-bezier(.65,0,.35,1); }
.js .mry-who-panel .mry-who-photo img { scale: 1.08; transition: scale 1.1s cubic-bezier(.2,.75,.2,1); }
.js .mry-who-panel :is(.mry-who-kicker, h3, .mry-who-list li, .mry-who-cta) {
  opacity: 0;
  translate: 0 14px;
  transition: opacity .45s ease, translate .6s cubic-bezier(.2,.75,.2,1);
}
.js .mry-who-panel.is-on .mry-who-photo { clip-path: inset(0 0 0 0); }
.js .mry-who-panel.is-on .mry-who-photo img { scale: 1; }
.js .mry-who-panel.is-on :is(.mry-who-kicker, h3, .mry-who-list li, .mry-who-cta) { opacity: 1; translate: 0 0; }
.js .mry-who-panel.is-on .mry-who-kicker { transition-delay: .12s; }
.js .mry-who-panel.is-on h3 { transition-delay: .18s; }
.js .mry-who-panel.is-on .mry-who-list li:nth-child(1) { transition-delay: .24s; }
.js .mry-who-panel.is-on .mry-who-list li:nth-child(2) { transition-delay: .29s; }
.js .mry-who-panel.is-on .mry-who-list li:nth-child(3) { transition-delay: .34s; }
.js .mry-who-panel.is-on .mry-who-list li:nth-child(4) { transition-delay: .39s; }
.js .mry-who-panel.is-on .mry-who-cta { transition-delay: .45s; }
/* le contenu qui part s'efface vite, sans délai */
.js .mry-who-panel:not(.is-on) :is(.mry-who-kicker, h3, .mry-who-list li, .mry-who-cta) { transition-duration: .2s; transition-delay: 0s; translate: 0 -8px; }
.js .mry-who-panel:not(.is-on) .mry-who-photo { clip-path: inset(0 100% 0 0); }
.js .mry-who-panel.was-on { visibility: visible; }

@media (max-width: 820px) {
  .mry-who-panel { grid-template-columns: 1fr; }
  .mry-who-list li { grid-template-columns: 1fr; }
  .mry-switch { width: 100%; }
  .mry-switch button { padding: 10px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .mry-switch-thumb, .js .mry-who-panel *, .js .mry-who-panel .mry-who-photo { transition: none !important; }
}

/* ================= Motion : un seul langage, sobre =================
   1. les mots des titres montent depuis une ligne masquée
   2. les photos se dévoilent comme un volet, l'image se pose
   3. les filets des listes se tracent au cordeau
   4. légère profondeur des grandes photos au défilement
   Tout est désactivé si le visiteur a demandé moins d'animations. */
@media (prefers-reduced-motion: no-preference) {

  /* 1. Titres : mot par mot. Le titre du haut est masqué jusqu'au découpage (1,2 s maximum). */
  .js:not(.m-ready) :is(.hero, .hub-hero) h1 { visibility: hidden; animation: mry-failsafe 0s 1.2s forwards; }
  @keyframes mry-failsafe { to { visibility: visible; } }
  .mw { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
  /* la charte stylise « h1 span » / « h2 span » : les morceaux de mots doivent rester neutres */
  body:not(#mry) :is(.mw, .mw-i) { display: inline-block !important; color: inherit !important; font: inherit !important; letter-spacing: inherit !important; background: none !important; }
  .mw-i { display: inline-block; transform: translateY(108%); transition: transform .95s cubic-bezier(.2,.8,.15,1); transition-delay: calc(var(--i, 0) * 45ms + var(--m-d, 0s)); }
  .m-in .mw-i { transform: none; }

  /* 2. Photos : volet qui s'ouvre de bas en haut, l'image se pose */
  .m-img { clip-path: inset(100% 0 0 0); transition: clip-path 1.15s cubic-bezier(.7,0,.2,1); transition-delay: var(--m-d, 0s); }
  .m-img img { scale: 1.14; transition: scale 1.6s cubic-bezier(.2,.75,.15,1); transition-delay: var(--m-d, 0s); }
  .m-img.m-in { clip-path: inset(0 0 0 0); }
  .m-img.m-in img { scale: 1; }

  /* 3. Filets tracés : le trait part de la gauche */
  .m-line { position: relative; }
  .m-line::after {
    content: "";
    position: absolute; left: 0; right: 0; bottom: -1px;
    height: 1px;
    background: currentColor;
    opacity: .16;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 1.1s cubic-bezier(.65,0,.35,1);
    transition-delay: calc(var(--i, 0) * 90ms + .1s);
  }
  .m-line.m-in::after { transform: scaleX(1); }
  .js :is(.mry-who-list li, .mry-steps li, .tarif dl > div).m-line { border-bottom-color: transparent !important; }

  /* 4. Profondeur au défilement (navigateurs compatibles) */
  @supports (animation-timeline: view()) {
    :is(.hero-photo, .door-photo, .join-photo) img {
      animation: mry-depth linear both;
      animation-timeline: view();
      animation-range: cover;
    }
    @keyframes mry-depth {
      from { translate: 0 -3%; }
      to { translate: 0 3%; }
    }
    :is(.hero-photo, .door-photo, .join-photo) { overflow: hidden; }
    :is(.hero-photo, .door-photo, .join-photo) img { height: 106% !important; margin-top: -3%; object-fit: cover; }
  }

  /* Interrupteur « Vous êtes… » : la pastille arrive avec un léger rebond */
  .mry-switch-thumb { transition: transform .55s cubic-bezier(.34,1.35,.5,1), width .55s cubic-bezier(.34,1.35,.5,1), background-color .5s ease !important; }
}

/* ---------- Menu mobile : panneau blanc opaque, plat comme l'en-tête ---------- */
@media (max-width: 980px) {
  body:not(#mry) .mobile-menu {
    top: 100% !important;
    border-radius: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    background: #fff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 24px 40px -24px rgba(17,17,17,.25) !important;
    max-height: calc(100dvh - var(--head-h, 90px));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  body:not(#mry) .mobile-menu .mm-sep { text-transform: none; letter-spacing: 0; font-family: var(--f-mono); font-size: 13px; font-weight: 500; }
}

/* ================= Version allégée : moins de blocs, détails repliés ================= */

/* En-tête : une seule ligne, trois liens de site, la page courante soulignée */
body:not(#mry) .navlinks { gap: 26px; }
body:not(#mry) .navlinks a[aria-current="page"] { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 6px; }
body:not(#mry) .mobile-menu a.wa-link { font-family: var(--f-body); font-size: 17px; font-weight: 500; }

/* Accueil : un hero typographique, aéré, sans cartes */
body:not(#mry) .hub-hero { padding-block: clamp(56px, 9vw, 120px) clamp(32px, 5vw, 64px); }
body:not(#mry) .hub-intro { max-width: 820px; }
body:not(#mry) .hub-intro h1 { font-size: clamp(40px, 6.2vw, 80px); line-height: 1.02; }
body:not(#mry) .hub-intro .lead { margin-top: 22px; font-size: clamp(17px, 1.5vw, 20px); max-width: 52ch; }
body:not(#mry) .c-hub-urgent { margin-top: 30px; }

/* Métiers : de simples tuiles titre + pictogramme */
body:not(#mry) .c-metiers .c-metier p { display: none; }
body:not(#mry) .c-metiers .c-metier { padding: 20px 22px; min-height: 0; }

/* Volets « en savoir plus » : le détail est là, mais replié */
.mry-more { margin-top: 22px; border-top: 1px solid var(--line); }
.mry-more > summary {
  list-style: none;
  cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 0;
  font-weight: 600;
}
.mry-more > summary::-webkit-details-marker { display: none; }
.mry-more > summary::after {
  content: "+";
  font-family: var(--f-mono);
  font-weight: 400;
  font-size: 20px;
  line-height: 1;
  transition: transform .3s var(--ease);
}
.mry-more[open] > summary::after { transform: rotate(45deg); }
.mry-more-body { padding: 4px 0 8px; }
.mry-more-body .c-urg-steps { margin: 0; }
.mry-more-body .c-urg-safe { margin-top: 16px; }
.mry-more-sm { margin-top: 14px; }
.mry-more-sm > summary { padding: 8px 0; font-size: 14px; color: var(--muted); font-weight: 500; }
.mry-more-sm .tarif-note { margin-top: 4px; }
.on-dark .mry-more, .c-urg .mry-more { border-color: rgba(127,127,127,.25); }

/* Bloc dépannage : une seule colonne */
body:not(#mry) .c-urg-grid { grid-template-columns: minmax(0, 820px) !important; }

/* Accueil : titre à gauche, une photo d'intervention à droite */
body:not(#mry) .hub-hero .wrap { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.mry-hero-photo { border-radius: 4px; overflow: hidden; aspect-ratio: 4 / 5; background: #e9e6df; }
.mry-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 860px) {
  body:not(#mry) .hub-hero .wrap { grid-template-columns: 1fr; }
  .mry-hero-photo { aspect-ratio: 16 / 10; }
}