/* ══════════════════════════════════════════════════════════════════
   MIUUM site chrome: skip link, floating nav island (five dropdown groups:
   Services, Fleet, Coverage, For business, Help), theme + language tools,
   the rebrand notice, mobile menu with accordions, footer, and the cookie
   consent banner and preferences dialog (consent.js).
   Source of truth: _chrome/chrome.css (copied to /chrome.css, linked as
   /chrome.css?v=N by every page). Every selector is scoped under
   .mm-skip / .mm-nav / .mm-menu / .mm-foot / .mm-consent so it drops into
   any page next to that page's own styles. The island, the menu and the
   footer are dark in both site themes, so nothing there reads the theme
   tokens except the theme button icon (html[data-theme]); the consent UI
   follows html[data-theme] with its own tokens.
   Contrast (WCAG AA): text 4.5:1, large text and controls 3:1. Text on the
   gold buttons is #0B0A08; gold text on a light surface is #735A1C.
   Bump ?v=N on every page when you change this file (see CLAUDE.md).
   ══════════════════════════════════════════════════════════════════ */
@keyframes mmShimmer {
  0%   { transform: translateX(-100%) skewX(-15deg); }
  100% { transform: translateX(250%) skewX(-15deg); }
}

.mm-nav, .mm-menu, .mm-foot, .mm-topbar {
  --mm-cream: #F5F0E8;
  --mm-dark: #1C1917;
  --mm-dark-deep: #0D0C0B;
  --mm-gold: #9A7B2E;
  --mm-gold-light: #C4A45A;
  --mm-white: #ffffff;
  --mm-easing: cubic-bezier(0.32, 0.72, 0, 1);
  --mm-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --mm-icon-moon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z'/%3E%3C/svg%3E");
  --mm-icon-sun: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E");
  --mm-icon-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
  --mm-icon-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E");
  font-family: 'Outfit', 'Montserrat', system-ui, -apple-system, sans-serif;
  box-sizing: border-box;
}
.mm-nav *, .mm-menu *, .mm-foot *, .mm-topbar * { box-sizing: border-box; }

/* ── Skip link (first element of the chrome, visible only on focus) ── */
a.mm-skip {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 1000;
  box-sizing: border-box;
  display: inline-flex; align-items: center;
  min-height: 44px;
  padding: 10px 20px;
  border-radius: 50px;
  background: #C4A45A;
  color: #0B0A08;
  font-family: 'Outfit', 'Montserrat', system-ui, -apple-system, sans-serif;
  font-size: 14px; font-weight: 600; letter-spacing: 0.02em; line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
  transform: translateY(-160%);
  transition: transform 0.2s ease;
}
a.mm-skip:focus, a.mm-skip:focus-visible {
  transform: none;
  outline: 2px solid #F4EFE6;
  outline-offset: 2px;
}
a.mm-skip:not(:focus) {
  clip-path: inset(50%);
}
/* The skip target (main#main tabindex="-1", or the fallback chrome.js focuses)
   takes focus programmatically; no ring around the whole page. */
#main[tabindex="-1"]:focus, [data-mm-skip-target]:focus { outline: none; }

/* ── Floating pill header ─────────────────────────────────────────── */
header.mm-nav {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 900;
  width: calc(100% - 48px);
  max-width: 1180px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  transition: top 0.4s var(--mm-easing);
}
header.mm-nav.scrolled { top: 10px; }
/* One flex row: brand, the link row, then the right group pushed to the end.
   Nothing is absolutely positioned, so the three parts can never overlap; when
   the row would not fit (below 1200px) the links fold into the burger menu. */
.mm-nav .mm-island {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 8px 0 0;
  height: 60px;
  background: rgba(10,10,10,0.92);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border-radius: 50px;
  border: 1px solid rgba(196,164,90,0.22);
  box-shadow: 0 8px 32px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.06);
  transition: height 0.4s var(--mm-easing), box-shadow 0.4s var(--mm-easing);
}
header.mm-nav.scrolled .mm-island {
  height: 52px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.06);
}

/* Brand: the gold wordmark, first in the row. Its width and margins animate so
   the home page can fold it away (see .mm-brand-off) without the links jumping. */
.mm-nav .mm-brand {
  flex: none;
  display: block;
  width: 122px;
  margin: 0 22px 0 22px;
  line-height: 0;
  overflow: hidden;
  text-decoration: none;
  transition: opacity 0.3s var(--mm-easing), width 0.45s var(--mm-easing), margin 0.45s var(--mm-easing), visibility 0s linear 0s;
}
.mm-nav .mm-brand:hover { opacity: 0.82; }
.mm-nav .mm-brand img {
  display: block;
  height: 18px;
  width: 122px;
  max-width: none;
}
/* Home page only (chrome.js adds .mm-brand-auto there and toggles .mm-brand-off
   while the hero's big wordmark is on screen): the brand folds to zero width and
   the links slide to the left edge; it fades back in once the hero wordmark has
   scrolled past. The open mobile menu always shows it (it is the menu's header). */
.mm-nav.mm-brand-off:not(.menu-open) .mm-brand {
  width: 0;
  margin-left: 0;
  margin-right: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s var(--mm-easing), width 0.45s var(--mm-easing), margin 0.45s var(--mm-easing), visibility 0s linear 0.45s;
}

/* Primary links: five dropdown groups, left of the tools. */
.mm-nav nav.mm-links {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  gap: 22px;
  align-items: center;
  margin: 0;
  padding: 0 12px 0 16px;
}
.mm-nav.mm-brand-off:not(.menu-open) nav.mm-links { padding-left: 24px; }
.mm-nav nav.mm-links > a,
.mm-nav .mm-dd-btn {
  font-family: inherit;
  font-size: 10.5px; font-weight: 500; letter-spacing: 0.13em;
  text-transform: uppercase; text-decoration: none;
  color: rgba(255,255,255,0.62);
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  line-height: 1.4;
  position: relative;
  transition: color 0.3s var(--mm-easing);
  white-space: nowrap;
}
.mm-nav nav.mm-links > a::after,
.mm-nav .mm-dd-btn::after {
  content: '';
  position: absolute; bottom: -3px; left: 0; right: 0;
  height: 1px; background: var(--mm-gold-light);
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.3s var(--mm-easing);
}
.mm-nav nav.mm-links > a:hover::after,
.mm-nav nav.mm-links > a.active::after,
.mm-nav .mm-dd.open .mm-dd-btn::after,
.mm-nav .mm-dd:hover .mm-dd-btn::after,
.mm-nav .mm-dd-btn.active::after { transform: scaleX(1); }
.mm-nav nav.mm-links > a:hover,
.mm-nav nav.mm-links > a.active,
.mm-nav .mm-dd-btn:hover,
.mm-nav .mm-dd.open .mm-dd-btn,
.mm-nav .mm-dd:hover .mm-dd-btn,
.mm-nav .mm-dd-btn.active { color: var(--mm-gold-light); }

/* Dropdown groups (hover opens on pointer devices, click and keyboard via chrome.js). */
.mm-nav .mm-dd { position: relative; display: flex; align-items: center; height: 60px; }
.mm-nav .mm-dd-btn { display: inline-flex; align-items: center; gap: 6px; }
.mm-nav .mm-dd-btn svg {
  width: 9px; height: 9px;
  transition: transform 0.3s var(--mm-easing);
}
.mm-nav .mm-dd.open .mm-dd-btn svg,
.mm-nav .mm-dd:hover .mm-dd-btn svg { transform: rotate(180deg); }
.mm-nav .mm-dd-menu {
  position: absolute;
  top: calc(100% - 4px);
  left: 50%;
  transform: translate(-50%, -6px);
  min-width: 232px;
  padding: 8px;
  background: rgba(14,13,12,0.97);
  border: 1px solid rgba(196,164,90,0.22);
  border-radius: 18px;
  box-shadow: 0 18px 44px rgba(0,0,0,0.45);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s var(--mm-easing), transform 0.25s var(--mm-easing), visibility 0s linear 0.25s;
}
/* Invisible bridge so the pointer can travel from the label to the panel. */
.mm-nav .mm-dd-menu::before {
  content: '';
  position: absolute; left: 0; right: 0; top: -12px; height: 12px;
}
.mm-nav .mm-dd.open .mm-dd-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
  transition-delay: 0s;
}
@media (hover: hover) and (pointer: fine) {
  .mm-nav .mm-dd:hover .mm-dd-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0);
    transition-delay: 0s;
  }
}
.mm-nav .mm-dd-menu a {
  display: block;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 12.5px; font-weight: 400; letter-spacing: 0.02em;
  text-transform: none; text-decoration: none;
  color: rgba(255,255,255,0.72);
  white-space: nowrap;
  transition: background 0.2s var(--mm-easing), color 0.2s var(--mm-easing);
}
.mm-nav .mm-dd-menu a:hover,
.mm-nav .mm-dd-menu a:focus-visible,
.mm-nav .mm-dd-menu a.active { background: rgba(196,164,90,0.12); color: var(--mm-gold-light); }
/* The "See the full fleet" row closes the Fleet panel: a hairline above, gold. */
.mm-nav .mm-dd-menu a.mm-dd-all {
  margin-top: 6px;
  padding-top: 12px;
  border-top: 1px solid rgba(196,164,90,0.16);
  border-radius: 0 0 10px 10px;
  color: var(--mm-gold-light);
  font-weight: 500;
}

/* Right group: tools slot (theme, language, and on the home page sign-in), CTA, burger. */
.mm-nav .mm-right {
  flex: none;
  margin-left: auto;
  display: flex; align-items: center; gap: 10px;
}
.mm-nav .nav-tools { display: flex; align-items: center; gap: 6px; }
.mm-nav .nav-tools:empty { display: none; }
.mm-nav .mm-tools-chrome { display: contents; }
/* Links a page mounts in the slot (a portal login, for example) read like nav links. */
.mm-nav .nav-tools > a {
  font-family: inherit;
  font-size: 10.5px; font-weight: 500; letter-spacing: 0.13em;
  text-transform: uppercase; text-decoration: none; white-space: nowrap;
  color: rgba(255,255,255,0.62);
  transition: color 0.3s var(--mm-easing);
}
.mm-nav .nav-tools > a:hover { color: var(--mm-gold-light); }

/* Theme button: a round ghost button whose icon follows html[data-theme]. The home
   page's engine button (#themeBtn, text set to an emoji by account.js) gets the same
   look; its text is hidden and the icon is drawn here. */
.mm-nav .mm-theme, .mm-nav #themeBtn,
.mm-menu .mm-theme, .mm-menu #themeBtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; padding: 0; margin: 0;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.72);
  font-size: 0; line-height: 0;
  cursor: pointer;
  transition: border-color 0.25s var(--mm-easing), color 0.25s var(--mm-easing), background 0.25s;
}
.mm-nav .mm-theme::before, .mm-nav #themeBtn::before,
.mm-menu .mm-theme::before, .mm-menu #themeBtn::before {
  content: '';
  width: 15px; height: 15px;
  background: currentColor;
  -webkit-mask: var(--mm-icon-sun) center / contain no-repeat;
  mask: var(--mm-icon-sun) center / contain no-repeat;
}
html[data-theme="dark"] .mm-nav .mm-theme::before, html[data-theme="dark"] .mm-nav #themeBtn::before,
html[data-theme="dark"] .mm-menu .mm-theme::before, html[data-theme="dark"] .mm-menu #themeBtn::before {
  -webkit-mask-image: var(--mm-icon-moon);
  mask-image: var(--mm-icon-moon);
}
.mm-nav .mm-theme:hover, .mm-nav #themeBtn:hover,
.mm-menu .mm-theme:hover, .mm-menu #themeBtn:hover {
  border-color: rgba(196,164,90,0.6); color: var(--mm-gold-light); background: rgba(196,164,90,0.08);
}

/* Language dropdown: globe + current language, panel of four. The engine's
   #langDD / #langTrig / #langCur (home page) share the look; account.js renders
   its own .pl-dd-panel under #langDD. */
.mm-nav .mm-lang, .mm-nav #langDD,
.mm-menu .mm-lang, .mm-menu #langDD { position: relative; display: inline-flex; }
.mm-nav .mm-lang-btn, .mm-nav #langTrig,
.mm-menu .mm-lang-btn, .mm-menu #langTrig {
  display: inline-flex; align-items: center; gap: 7px;
  width: auto; height: 34px; padding: 0 11px 0 10px; margin: 0;
  border-radius: 50px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.72);
  font-family: inherit; font-size: 0; line-height: 1;
  cursor: pointer; white-space: nowrap;
  transition: border-color 0.25s var(--mm-easing), color 0.25s var(--mm-easing), background 0.25s;
}
.mm-nav .mm-lang-btn::before, .mm-nav #langTrig::before,
.mm-menu .mm-lang-btn::before, .mm-menu #langTrig::before {
  content: '';
  flex: none;
  width: 14px; height: 14px;
  background: currentColor;
  -webkit-mask: var(--mm-icon-globe) center / contain no-repeat;
  mask: var(--mm-icon-globe) center / contain no-repeat;
}
.mm-nav .mm-lang-btn::after, .mm-nav #langTrig::after,
.mm-menu .mm-lang-btn::after, .mm-menu #langTrig::after {
  content: '';
  flex: none;
  width: 8px; height: 6px;
  background: currentColor;
  -webkit-mask: var(--mm-icon-chev) center / contain no-repeat;
  mask: var(--mm-icon-chev) center / contain no-repeat;
  transition: transform 0.3s var(--mm-easing);
}
.mm-nav .mm-lang.open .mm-lang-btn::after, .mm-menu .mm-lang.open .mm-lang-btn::after { transform: rotate(180deg); }
.mm-nav .mm-lang-cur, .mm-nav #langCur,
.mm-menu .mm-lang-cur, .mm-menu #langCur {
  font-size: 10.5px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase;
  display: inline !important;
}
/* In the island the control is the globe plus the two-letter code (EN / ES / PT /
   FR) at every width, so the visitor sees which language is on; the caret is
   left to the mobile menu where there is room. */
.mm-nav .mm-lang-btn, .mm-nav #langTrig { padding: 0 11px 0 9px; gap: 6px; }
.mm-nav .mm-lang-btn::after, .mm-nav #langTrig::after { display: none; }
.mm-nav .mm-lang-btn::before, .mm-nav #langTrig::before { width: 15px; height: 15px; }
/* The button shows the two-letter code (EN / ES / PT / FR); the panel spells the
   names out. chrome.js writes the code into .mm-lang-cur; the engine writes the
   full name into #langCur, so that one is drawn from html[lang] instead. */
.mm-nav #langCur, .mm-menu #langCur { font-size: 0 !important; }
.mm-nav #langCur::after, .mm-menu #langCur::after { content: 'EN'; font-size: 10.5px; }
html[lang="es"] .mm-nav #langCur::after, html[lang="es"] .mm-menu #langCur::after { content: 'ES'; }
html[lang="pt"] .mm-nav #langCur::after, html[lang="pt"] .mm-menu #langCur::after { content: 'PT'; }
html[lang="fr"] .mm-nav #langCur::after, html[lang="fr"] .mm-menu #langCur::after { content: 'FR'; }
/* The engine trigger carries a globe emoji and a caret span; the icons above replace them. */
.mm-nav #langTrig > span:not(#langCur), .mm-menu #langTrig > span:not(#langCur) { display: none !important; }
.mm-nav .mm-lang-btn:hover, .mm-nav #langTrig:hover, .mm-nav .mm-lang.open .mm-lang-btn,
.mm-menu .mm-lang-btn:hover, .mm-menu #langTrig:hover, .mm-menu .mm-lang.open .mm-lang-btn {
  border-color: rgba(196,164,90,0.6); color: var(--mm-gold-light); background: rgba(196,164,90,0.08);
}
.mm-nav .mm-lang-menu, .mm-menu .mm-lang-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 168px;
  padding: 6px;
  background: rgba(14,13,12,0.97);
  border: 1px solid rgba(196,164,90,0.22);
  border-radius: 18px;
  box-shadow: 0 18px 44px rgba(0,0,0,0.45);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 0.22s var(--mm-easing), transform 0.22s var(--mm-easing), visibility 0s linear 0.22s;
  z-index: 5;
}
.mm-nav .mm-lang.open .mm-lang-menu, .mm-menu .mm-lang.open .mm-lang-menu {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); transition-delay: 0s;
}
.mm-nav .mm-lang-menu button, .mm-menu .mm-lang-menu button {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left;
  padding: 9px 12px;
  border: 0; border-radius: 12px;
  background: none;
  font-family: inherit; font-size: 12.5px; font-weight: 400; letter-spacing: 0.02em;
  color: rgba(255,255,255,0.72);
  cursor: pointer;
  transition: background 0.2s var(--mm-easing), color 0.2s var(--mm-easing);
}
.mm-nav .mm-lang-menu button::before, .mm-menu .mm-lang-menu button::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%; flex: none;
  background: transparent; border: 1px solid rgba(255,255,255,0.25);
}
.mm-nav .mm-lang-menu button.on::before, .mm-menu .mm-lang-menu button.on::before { background: var(--mm-gold-light); border-color: var(--mm-gold-light); }
.mm-nav .mm-lang-menu button:hover, .mm-nav .mm-lang-menu button:focus-visible, .mm-nav .mm-lang-menu button.on,
.mm-menu .mm-lang-menu button:hover, .mm-menu .mm-lang-menu button:focus-visible, .mm-menu .mm-lang-menu button.on {
  background: rgba(196,164,90,0.12); color: var(--mm-gold-light);
}

/* Home page sign-in pill and the signed-in account chip (rendered by account.js). */
.mm-nav .nav-tools .mm-tools { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.mm-nav .nav-tools .mm-tools > * { flex: none; }
.mm-nav .nav-tools .mm-tools .btn-signin {
  display: inline-flex; align-items: center;
  height: 34px; padding: 0 12px; margin: 0;
  border-radius: 50px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.78);
  font-family: inherit; font-size: 10.5px; font-weight: 500; letter-spacing: 0.13em; text-transform: uppercase;
  white-space: nowrap; cursor: pointer;
  transition: border-color 0.25s var(--mm-easing), color 0.25s var(--mm-easing), background 0.25s;
}
.mm-nav .nav-tools .mm-tools .btn-signin:hover { border-color: rgba(196,164,90,0.6); color: var(--mm-gold-light); background: rgba(196,164,90,0.08); }
.mm-nav .nav-tools .mm-tools .head-acct { height: 34px; padding: 0 10px 0 3px; font-size: 12px; border-color: rgba(255,255,255,0.16); }
.mm-nav .nav-tools .mm-tools .head-acct .ha-av { width: 26px; height: 26px; font-size: 12px; }
/* Below 1400px the signed-in chip is the avatar alone (no first name, no caret). */
@media (max-width: 1399px) {
  .mm-nav .nav-tools .mm-tools .head-acct { padding: 0 3px; gap: 0; }
  .mm-nav .nav-tools .mm-tools .head-acct .ha-name,
  .mm-nav .nav-tools .mm-tools .head-acct .ha-cv { display: none !important; }
}

.mm-nav .mm-cta {
  position: relative;
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--mm-gold-light); color: #0B0A08 !important;
  font-family: inherit;
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  text-decoration: none;
  padding: 10px 18px 10px 22px;
  border-radius: 50px;
  overflow: hidden;
  white-space: nowrap;
  transition: background 0.3s var(--mm-easing), transform 0.2s var(--mm-easing);
}
.mm-nav .mm-cta::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 40%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent);
  animation: mmShimmer 3.5s ease-in-out infinite;
  pointer-events: none;
}
.mm-nav .mm-cta:hover { background: #B8963A; transform: scale(1.03); }
.mm-nav .mm-cta .mm-arrow {
  width: 26px; height: 26px; border-radius: 50%;
  background: rgba(255,255,255,0.18);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px;
  transition: transform 0.3s var(--mm-spring);
}
.mm-nav .mm-cta:hover .mm-arrow { transform: translate(3px,-1px); }

/* Rebrand notice (chrome.js appends it inside the header, under the island, for
   visitors arriving from premiumlane.net): one slim dark pill, text + Dismiss.
   It rides with the fixed header, so it follows the scrolled state, and hides
   behind the open mobile menu. */
@keyframes mmBannerIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.mm-nav .mm-rebrand {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  width: fit-content; max-width: 100%;
  margin: 8px auto 0;
  padding: 7px 8px 7px 18px;
  background: rgba(10,10,10,0.92);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid rgba(196,164,90,0.28);
  border-radius: 50px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35);
  color: rgba(255,255,255,0.8);
  font-size: 12.5px; font-weight: 300; letter-spacing: 0.02em; line-height: 1.4;
  animation: mmBannerIn 0.4s var(--mm-easing) both;
  transition: opacity 0.25s var(--mm-easing), transform 0.25s var(--mm-easing);
}
.mm-nav .mm-rebrand.out { opacity: 0; transform: translateY(-6px); pointer-events: none; }
.mm-nav .mm-rebrand p { margin: 0; }
.mm-nav .mm-rebrand-x {
  flex: none;
  display: inline-flex; align-items: center;
  height: 28px; padding: 0 12px; margin: 0;
  border-radius: 50px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.72);
  font-family: inherit; font-size: 10px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.25s var(--mm-easing), color 0.25s var(--mm-easing), background 0.25s;
}
.mm-nav .mm-rebrand-x:hover { border-color: rgba(196,164,90,0.6); color: var(--mm-gold-light); background: rgba(196,164,90,0.08); }
.mm-nav.menu-open .mm-rebrand { display: none; }
@media (max-width: 599px) {
  .mm-nav .mm-rebrand { border-radius: 18px; padding: 10px 10px 10px 16px; font-size: 12px; gap: 10px; text-align: left; }
}

.mm-nav .mm-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 8px;
  margin: 0;
  z-index: 901;
  flex-shrink: 0;
  width: 40px; height: 40px;
}
.mm-nav .mm-burger span {
  display: block;
  width: 20px;
  height: 1.5px;
  background: rgba(255,255,255,0.85);
  border-radius: 2px;
  transition: transform 0.3s var(--mm-spring), opacity 0.2s ease;
}
.mm-nav .mm-burger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.mm-nav .mm-burger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.mm-nav .mm-burger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── Mobile menu overlay ──────────────────────────────────────────── */
.mm-menu {
  position: fixed;
  inset: 0;
  background: rgba(10,10,10,0.97);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  z-index: 890;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 92px 24px 48px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.35s ease, visibility 0s linear 0.35s;
}
/* Closed, the menu is also inert (chrome.js), so none of its links are Tab stops. */
.mm-menu.open { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity 0.35s ease, visibility 0s linear 0s; }
/* The link row shows from 1200px up; the menu is never used there. */
@media (min-width: 1200px) {
  .mm-menu { display: none !important; }
}
.mm-menu nav {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 100%;
  max-width: 340px;
  margin: auto;
}
.mm-menu nav > a,
.mm-menu .mm-menu-acc {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  font-family: inherit;
  text-transform: none;
  font-size: 21px;
  color: rgba(255,255,255,0.72);
  text-decoration: none;
  font-weight: 300;
  letter-spacing: 0.03em;
  padding: 15px 0;
  width: 100%;
  text-align: center;
  background: none; border: 0; margin: 0; cursor: pointer;
  border-bottom: 1px solid rgba(196,164,90,0.1);
  transition: color 0.2s ease;
}
.mm-menu nav > a:hover, .mm-menu nav > a.active, .mm-menu .mm-menu-acc:hover { color: var(--mm-gold-light); }
.mm-menu .mm-menu-acc svg { width: 10px; height: 10px; transition: transform 0.3s var(--mm-easing); opacity: 0.7; }
.mm-menu .mm-menu-group { width: 100%; }
.mm-menu .mm-menu-group.open .mm-menu-acc { color: var(--mm-gold-light); border-bottom-color: transparent; }
.mm-menu .mm-menu-group.open .mm-menu-acc svg { transform: rotate(180deg); }
.mm-menu .mm-menu-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.35s var(--mm-easing);
  border-bottom: 1px solid rgba(196,164,90,0.1);
}
.mm-menu .mm-menu-group.open .mm-menu-panel { grid-template-rows: 1fr; }
.mm-menu .mm-menu-panel > div { overflow: hidden; min-height: 0; visibility: hidden; transition: visibility 0s linear 0.35s; }
.mm-menu .mm-menu-group.open .mm-menu-panel > div { padding-bottom: 10px; visibility: visible; transition-delay: 0s; }
/* Pages style bare "nav a" (uppercase, underline pseudo-element); the menu links opt out. */
.mm-menu nav a::after, .mm-menu nav a::before { display: none !important; }
.mm-menu .mm-menu-panel a {
  display: block;
  font-family: inherit;
  font-size: 15.5px; font-weight: 300; letter-spacing: 0.02em; text-transform: none;
  color: rgba(255,255,255,0.58);
  text-decoration: none;
  text-align: center;
  padding: 8px 0;
  transition: color 0.2s ease;
}
.mm-menu .mm-menu-panel a:hover, .mm-menu .mm-menu-panel a.active { color: var(--mm-gold-light); }
.mm-menu .mm-menu-panel a.mm-dd-all { color: var(--mm-gold-light); font-weight: 400; }
/* Legacy group markup (label + links) from an older paste of nav.html still renders. */
.mm-menu .mm-menu-label {
  display: block;
  font-size: 9.5px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--mm-gold-light); font-weight: 600;
  padding: 12px 0 4px;
}
.mm-menu .mm-menu-group > a { display: block; font-size: 16px; padding: 8px 0; text-align: center; color: rgba(255,255,255,0.58); text-decoration: none; }

/* Tools row (#navToolsMobile, first child of the mobile nav, shown just above Book
   now): chrome.js and account.js move the children of #navTools here below 1024px. */
.mm-menu .mm-menu-tools {
  width: 100%; order: 5;
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px;
  padding: 22px 0 0;
}
.mm-menu .mm-menu-tools:empty { display: none; }
.mm-menu .mm-tools-chrome { display: contents; }
.mm-menu .mm-menu-tools .mm-tools { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; }
.mm-menu .mm-theme, .mm-menu #themeBtn { width: 40px; height: 40px; }
.mm-menu .mm-lang-btn, .mm-menu #langTrig { height: 40px; padding: 0 14px 0 12px; }
.mm-menu .mm-lang-cur { font-size: 11.5px; }
.mm-menu #langCur::after { font-size: 11.5px; }
.mm-menu .mm-tools .btn-signin {
  display: inline-flex; align-items: center; height: 40px; padding: 0 18px; margin: 0;
  border-radius: 50px; border: 1px solid rgba(255,255,255,0.16); background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.82); font-family: inherit; font-size: 11.5px; font-weight: 500; letter-spacing: 0.13em; text-transform: uppercase;
  cursor: pointer;
}
.mm-menu .mm-tools .head-acct { height: 40px; }
.mm-menu .mm-menu-tools > a {
  font-family: inherit; font-size: 11.5px; font-weight: 500; letter-spacing: 0.13em; text-transform: uppercase;
  text-decoration: none; color: rgba(255,255,255,0.82);
  display: inline-flex; align-items: center; height: 40px; padding: 0 18px;
  border-radius: 50px; border: 1px solid rgba(255,255,255,0.16);
}
.mm-menu .mm-lang-menu { left: 50%; right: auto; transform: translate(-50%, -6px); }
.mm-menu .mm-lang.open .mm-lang-menu { transform: translate(-50%, 0); }

.mm-menu nav a.mm-menu-book {
  order: 6;
  margin-top: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--mm-gold-light);
  color: #0B0A08;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 14px 28px;
  border-radius: 50px;
  border-bottom: none;
  width: auto;
  min-height: 44px;
}
.mm-menu nav a.mm-menu-book:hover { background: #B8963A; color: #0B0A08; }

/* A leftover close button from an older paste of nav.html stays hidden; the burger X closes the menu. */
.mm-menu .mm-menu-close { display: none; }

/* ── Footer ───────────────────────────────────────────────────────── */
footer.mm-foot {
  background: var(--mm-dark-deep);
  color: rgba(255,255,255,0.38);
  padding: 72px 80px 40px;
  border-top: 1px solid rgba(196,164,90,0.12);
  margin: 0;
  position: relative;
  text-align: left;
  font-size: 13px;
  line-height: 1.6;
}
footer.mm-foot::before {
  content: '';
  position: absolute; top: 0; left: 80px; right: 80px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(196,164,90,0.3), transparent);
}
.mm-foot .mm-foot-inner { max-width: 1180px; margin: 0 auto; }
.mm-foot .mm-fgrid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.05fr 1.25fr;
  gap: 40px;
  margin-bottom: 56px;
  align-items: start;
}
.mm-foot .mm-fbrand { display: flex; flex-direction: column; align-items: flex-start; padding-right: 24px; }
.mm-foot .mm-fbrand a { display: block; line-height: 0; margin-bottom: 22px; transition: opacity 0.3s var(--mm-easing), transform 0.4s var(--mm-easing); }
.mm-foot .mm-fbrand a:hover { opacity: 0.85; transform: translateY(-3px); }
.mm-foot .mm-fbrand img { display: block; height: 26px; width: auto; }
.mm-foot .mm-fbrand p {
  font-size: 13px; line-height: 1.85; color: rgba(255,255,255,0.6);
  font-weight: 300; max-width: 300px; margin: 0;
}
/* Column titles are h2 and the Portals sub-heading is h3 (the page keeps its own
   h1 / h2 outline); the look comes from the class, so any page rule on bare
   h2 / h3 is reset here. h4 / h5 stay for pages stamped before chrome v6. */
.mm-foot .mm-fhead, .mm-foot h4 {
  display: block;
  font-family: inherit;
  font-size: 9.5px; line-height: 1.6; letter-spacing: 0.22em; text-transform: uppercase; text-align: left;
  color: var(--mm-gold-light); margin: 0 0 22px; padding: 0; font-weight: 600;
  text-wrap: wrap; background: none; border: 0;
}
.mm-foot .mm-fsub {
  display: block;
  font-family: inherit;
  font-size: 9px; line-height: 1.6; letter-spacing: 0.2em; text-transform: uppercase; text-align: left;
  color: rgba(255,255,255,0.58); margin: 22px 0 12px; padding: 0; font-weight: 600;
  text-wrap: wrap; background: none; border: 0;
}
.mm-foot .mm-fhead::before, .mm-foot .mm-fhead::after,
.mm-foot .mm-fsub::before, .mm-foot .mm-fsub::after { content: none; }
.mm-foot .mm-fcol a {
  display: block; font-size: 13px; color: rgba(255,255,255,0.64);
  text-decoration: none; margin: 0 0 12px; font-weight: 300;
  transition: color 0.3s var(--mm-easing), transform 0.3s var(--mm-easing);
}
.mm-foot .mm-fcol a:hover { color: var(--mm-gold-light); transform: translateX(4px); }
.mm-foot .mm-fcol p { margin: 0 0 12px; font-size: 13px; font-weight: 300; color: rgba(255,255,255,0.64); }
.mm-foot .mm-ftel { color: rgba(255,255,255,0.82) !important; font-weight: 400 !important; }
.mm-foot .mm-fcities { color: rgba(255,255,255,0.58); letter-spacing: 0.02em; }
.mm-foot .mm-fsocial { display: flex; gap: 10px; margin: 4px 0 22px; }
.mm-foot .mm-ficon {
  width: 30px; height: 30px; border-radius: 50%;
  border: 1px solid rgba(196,164,90,0.22);
  display: grid !important; place-items: center;
  color: rgba(255,255,255,0.64); text-decoration: none;
  line-height: 0; margin: 0 !important;
  transition: border-color 0.3s var(--mm-easing), color 0.3s var(--mm-easing), transform 0.3s var(--mm-spring), background 0.3s;
}
.mm-foot .mm-ficon svg { display: block; width: 15px; height: 15px; }
.mm-foot .mm-ficon:hover { border-color: var(--mm-gold-light); color: var(--mm-gold-light); transform: translateY(-3px) !important; background: rgba(196,164,90,0.08); }
.mm-foot .mm-fapps-label {
  display: block;
  font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.58); margin: 0 0 10px; font-weight: 600;
}
.mm-foot .mm-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.mm-foot .mm-badge {
  display: inline-flex; align-items: center; gap: 7px;
  height: 34px; padding: 0 12px;
  border: 1px solid rgba(255,255,255,0.14); border-radius: 8px;
  color: rgba(255,255,255,0.64);
  font-size: 11.5px; font-weight: 500; letter-spacing: 0.02em;
  white-space: nowrap;
}
.mm-foot .mm-badge svg { width: 14px; height: 14px; }
.mm-foot .mm-fapps-soon {
  display: inline-block; margin-top: 10px;
  font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--mm-gold-light); font-weight: 600;
}
.mm-foot .mm-fbottom {
  border-top: 1px solid rgba(255,255,255,0.05);
  padding-top: 28px;
  display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
}
.mm-foot .mm-fbottom p { font-size: 11px; color: rgba(255,255,255,0.58); letter-spacing: 0.06em; margin: 0; }
.mm-foot .mm-flegal { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; }
/* The legal row looks the same on every page (most pages already drew it in
   uppercase through their own bare "nav a" rule; the chrome now says so itself). */
.mm-foot .mm-flegal a,
.mm-foot .mm-flegal .mm-fcookie {
  font-family: inherit;
  font-size: 11px; font-weight: 500; line-height: 1.6; letter-spacing: 0.06em; text-transform: uppercase;
  color: rgba(255,255,255,0.62);
  text-decoration: none; transition: color 0.3s var(--mm-easing);
}
/* "Cookie settings" is a button (it opens the consent dialog) dressed as a legal link. */
.mm-foot .mm-flegal .mm-fcookie {
  display: inline; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; cursor: pointer;
  text-align: left;
}
.mm-foot .mm-flegal a:hover, .mm-foot .mm-flegal .mm-fcookie:hover { color: var(--mm-gold-light); }
.mm-foot .mm-flegal a:focus-visible, .mm-foot .mm-flegal .mm-fcookie:focus-visible {
  color: var(--mm-gold-light); outline: 2px solid var(--mm-gold-light); outline-offset: 3px; border-radius: 2px;
}

/* ── Cookie consent: banner + preferences dialog (consent.js) ──────────
   Light by default, dark under html[data-theme="dark"]. Accept all and Reject
   all carry the same weight. Measured: light text #1C1917 on #FFFFFF 17.5:1,
   muted #5C5650 7.2:1, gold link #735A1C 6.6:1; dark text #F4EFE6 on #15140F
   16.1:1, muted #B3AA99 8.0:1, gold #C9A961 8.2:1; #0B0A08 on the gold
   button 8.3:1; switch tracks 4.7:1 (light off) and 4.8:1 (dark off). */
.mm-consent {
  --mmc-bg: #FFFFFF;
  --mmc-text: #1C1917;
  --mmc-muted: #5C5650;
  --mmc-gold: #735A1C;
  --mmc-line: rgba(28,25,23,0.14);
  --mmc-ghost: rgba(28,25,23,0.34);
  --mmc-ghost-hover: rgba(115,90,28,0.08);
  --mmc-fill: #C4A45A;
  --mmc-fill-hover: #B8963A;
  --mmc-fill-text: #0B0A08;
  --mmc-track: #7A736C;
  --mmc-track-on: #735A1C;
  --mmc-knob: #FFFFFF;
  --mmc-focus: #735A1C;
  --mmc-shadow: 0 18px 48px rgba(28,25,23,0.18), 0 2px 8px rgba(28,25,23,0.08);
  --mmc-backdrop: rgba(12,11,9,0.55);
  font-family: 'Outfit', 'Montserrat', system-ui, -apple-system, sans-serif;
}
html[data-theme="dark"] .mm-consent {
  --mmc-bg: #15140F;
  --mmc-text: #F4EFE6;
  --mmc-muted: #B3AA99;
  --mmc-gold: #C9A961;
  --mmc-line: rgba(244,239,230,0.14);
  --mmc-ghost: rgba(244,239,230,0.36);
  --mmc-ghost-hover: rgba(201,169,97,0.1);
  --mmc-track: #8A8174;
  --mmc-track-on: #C9A961;
  --mmc-knob: #0B0A08;
  --mmc-focus: #C9A961;
  --mmc-shadow: 0 18px 48px rgba(0,0,0,0.55), 0 0 0 1px rgba(201,169,97,0.18);
  --mmc-backdrop: rgba(0,0,0,0.7);
}
.mm-consent, .mm-consent * { box-sizing: border-box; }
.mm-consent:focus { outline: none; }
.mm-consent [hidden] { display: none !important; }
.mm-consent .mm-c-sr {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
@keyframes mmConsentIn {
  from { transform: translateY(12px); }
  to   { transform: translateY(0); }
}
.mm-consent .mm-cb {
  position: fixed;
  left: 20px;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 880;
  width: min(560px, calc(100% - 40px));
  max-height: calc(100vh - 120px);
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 16px;
  padding: 22px 22px 20px;
  background: var(--mmc-bg);
  color: var(--mmc-text);
  border: 1px solid var(--mmc-line);
  border-radius: 20px;
  box-shadow: var(--mmc-shadow);
  font-size: 14px; line-height: 1.55; text-align: left;
  animation: mmConsentIn 0.35s cubic-bezier(0.32, 0.72, 0, 1) both;
}
.mm-consent .mm-cb-body > * { margin: 0; }
.mm-consent .mm-cb-title {
  font-size: 16px; font-weight: 600; letter-spacing: 0.01em; color: var(--mmc-text);
  margin: 0 0 6px;
}
.mm-consent .mm-cb-text { color: var(--mmc-muted); font-size: 14px; font-weight: 400; }
.mm-consent .mm-cb-text a, .mm-consent .mm-cp a {
  color: var(--mmc-gold); font-weight: 500;
  text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px;
}
.mm-consent .mm-c-gpc {
  margin: 10px 0 0; padding: 10px 12px;
  border-radius: 12px; border: 1px solid var(--mmc-line);
  color: var(--mmc-text); font-size: 13px; line-height: 1.5;
}
.mm-consent .mm-cb-actions, .mm-consent .mm-cp-actions {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.mm-consent .mm-cbtn {
  flex: 1 1 0;
  min-width: max-content;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; margin: 0; padding: 10px 18px;
  border-radius: 50px;
  font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: 0.02em; line-height: 1.2;
  text-transform: none; text-decoration: none; white-space: nowrap;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.mm-consent .mm-cbtn-fill { background: var(--mmc-fill); color: var(--mmc-fill-text); border: 1px solid var(--mmc-fill); }
.mm-consent .mm-cbtn-fill:hover { background: var(--mmc-fill-hover); border-color: var(--mmc-fill-hover); color: var(--mmc-fill-text); }
.mm-consent .mm-cbtn-ghost { background: transparent; color: var(--mmc-text); border: 1px solid var(--mmc-ghost); }
.mm-consent .mm-cbtn-ghost:hover { background: var(--mmc-ghost-hover); border-color: var(--mmc-gold); color: var(--mmc-text); }
.mm-consent .mm-cbtn:focus-visible,
.mm-consent .mm-cp-x:focus-visible,
.mm-consent a:focus-visible,
.mm-consent .mm-switch:focus-visible {
  outline: 2px solid var(--mmc-focus);
  outline-offset: 3px;
}

/* Preferences dialog (native <dialog>, opened modal). */
.mm-consent .mm-cp {
  width: min(520px, calc(100% - 32px));
  max-width: none;
  max-height: calc(100% - 32px);
  margin: auto;
  padding: 0;
  overflow: auto;
  background: var(--mmc-bg);
  color: var(--mmc-text);
  border: 1px solid var(--mmc-line);
  border-radius: 22px;
  box-shadow: var(--mmc-shadow);
  font-size: 14px; line-height: 1.55; text-align: left;
}
.mm-consent .mm-cp[open] { display: block; }
/* Without native modal support (very old browsers) the dialog is positioned by hand. */
.mm-consent .mm-cp[open]:not(:modal) { position: fixed; inset: 0; z-index: 100001; }
.mm-consent .mm-cp::backdrop { background: var(--mmc-backdrop); }
.mm-consent .mm-cp-inner { padding: 22px 22px 20px; }
.mm-consent .mm-cp-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin: 0 0 8px; }
.mm-consent .mm-cp-title {
  margin: 0; padding: 0;
  font-family: inherit; font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: 0.01em;
  color: var(--mmc-text); text-transform: none; text-align: left;
}
.mm-consent .mm-cp-title::before, .mm-consent .mm-cp-title::after { content: none; }
.mm-consent .mm-cp-x {
  flex: none; position: relative;
  width: 44px; height: 44px; margin: -8px -10px 0 0; padding: 0;
  border: 0; border-radius: 50%; background: transparent; color: var(--mmc-text);
  cursor: pointer;
}
.mm-consent .mm-cp-x::before, .mm-consent .mm-cp-x::after {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 16px; height: 1.6px; border-radius: 2px; background: currentColor;
}
.mm-consent .mm-cp-x::before { transform: translate(-50%, -50%) rotate(45deg); }
.mm-consent .mm-cp-x::after { transform: translate(-50%, -50%) rotate(-45deg); }
.mm-consent .mm-cp-x:hover { background: var(--mmc-ghost-hover); }
.mm-consent .mm-cp-x:focus-visible { outline-offset: -3px; }
.mm-consent .mm-cp-intro { margin: 0 0 14px; color: var(--mmc-muted); }
.mm-consent .mm-cp-row {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 14px 0;
  border-top: 1px solid var(--mmc-line);
}
.mm-consent .mm-cp-label { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mm-consent .mm-cp-name { font-size: 15px; font-weight: 600; color: var(--mmc-text); cursor: default; }
.mm-consent label.mm-cp-name { cursor: pointer; }
.mm-consent .mm-cp-desc { font-size: 13px; color: var(--mmc-muted); line-height: 1.5; }
.mm-consent .mm-cp-always { flex: none; font-size: 13px; font-weight: 600; color: var(--mmc-gold); white-space: nowrap; }
.mm-consent .mm-cp .mm-c-gpc { margin: 0 0 14px; }
.mm-consent .mm-cp-actions { padding-top: 16px; border-top: 1px solid var(--mmc-line); }
/* Switch: a native checkbox with role="switch". */
.mm-consent .mm-switch {
  -webkit-appearance: none; appearance: none;
  flex: none; position: relative;
  width: 46px; height: 28px; margin: 0;
  border-radius: 28px;
  background: var(--mmc-track);
  cursor: pointer;
  transition: background 0.2s ease;
}
.mm-consent .mm-switch::before {
  content: ''; position: absolute; top: 3px; left: 3px;
  width: 22px; height: 22px; border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 1px 3px rgba(0,0,0,0.3);
  transition: transform 0.2s ease;
}
.mm-consent .mm-switch:checked { background: var(--mmc-track-on); }
.mm-consent .mm-switch:checked::before { transform: translateX(18px); background: var(--mmc-knob); }
html[data-theme="dark"] .mm-consent .mm-switch:not(:checked)::before { background: #F4EFE6; }
.mm-consent .mm-switch:disabled { cursor: not-allowed; opacity: 0.55; }
@media (max-width: 599px) {
  .mm-consent .mm-cb {
    left: 12px; right: 12px; width: auto;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    padding: 18px 16px 16px; gap: 14px;
    max-height: calc(100vh - 96px);
  }
  .mm-consent .mm-cbtn { flex: 1 1 calc(50% - 5px); min-width: 0; white-space: normal; text-align: center; }
  .mm-consent .mm-cb-actions .mm-cbtn-ghost { flex-basis: 100%; }
  .mm-consent .mm-cp-inner { padding: 18px 16px 16px; }
  .mm-consent .mm-cp-actions .mm-cbtn { flex-basis: calc(50% - 5px); }
  .mm-consent .mm-cp-actions .mm-cbtn-fill { flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .mm-consent .mm-cb { animation: none; }
  .mm-consent .mm-cbtn, .mm-consent .mm-switch, .mm-consent .mm-switch::before { transition: none; }
  a.mm-skip { transition: none; }
}

/* ── Portal top bar (app-like pages: wordmark + back link, no full nav) ── */
.mm-topbar-wordmark { display: block; height: 16px; width: auto; }
.mm-topbar-back {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600;
  text-decoration: none; color: inherit; opacity: 0.6; white-space: nowrap;
  transition: opacity 0.2s ease;
}
.mm-topbar-back:hover { opacity: 1; }

/* Wordmark image where an app-like page used the text wordmark. */
.mm-login-back { display: inline-block; margin-bottom: 16px; }
.mm-wm-img { display: block; height: 20px; width: auto; }
.mm-wm-img.mm-hd { height: 15px; }
.mm-wm-img.mm-side { height: 14px; }
.mm-wm-img.mm-login { height: 24px; margin-bottom: 18px; }

/* Pages whose content starts directly under the floating island. */
.mm-pad-top { padding-top: 108px !important; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1399px) {
  /* Tighter link row while the chip is avatar-only. */
  .mm-nav nav.mm-links { gap: 18px; }
  .mm-nav .mm-brand { margin: 0 18px 0 20px; }
}
@media (max-width: 1279px) {
  .mm-nav nav.mm-links { gap: 16px; padding-right: 8px; }
  .mm-nav .mm-right { gap: 8px; }
}
/* Below 1200px the link row folds into the burger menu. The tools slot stays in
   the island down to 1024px (the relocation contract chrome.js and account.js
   share) and moves into the menu's #navToolsMobile row below that. */
@media (max-width: 1199px) {
  header.mm-nav { width: calc(100% - 24px); top: 12px; }
  .mm-nav .mm-island { padding: 0 8px 0 0; justify-content: space-between; }
  .mm-nav .mm-brand { margin: 0 16px 0 20px; }
  .mm-nav nav.mm-links { display: none; }
  .mm-nav .mm-burger { display: flex; }
  .mm-nav .mm-cta .mm-arrow { display: none; }
  .mm-nav .mm-cta { padding: 10px 16px; min-height: 40px; }
  .mm-pad-top { padding-top: 96px !important; }
}
/* Home page below 1200px (Hugo, 2026-09-22): while the hero's big wordmark
   is on screen the island hugs its right group (Book now + menu) instead of
   showing an empty bar, and widens back, logo in, once the wordmark scrolls
   away. chrome.js measures the right group into --mm-pill-w so the width can
   animate; the island stays pinned to the right edge while it does. */
@media (max-width: 1199px) {
  .mm-nav.mm-brand-auto .mm-island { max-width: 100%; margin-left: auto; transition: max-width 0.45s var(--mm-easing), padding 0.45s var(--mm-easing), height 0.4s var(--mm-easing), box-shadow 0.4s var(--mm-easing); }
  .mm-nav.mm-brand-off:not(.menu-open) .mm-island { max-width: var(--mm-pill-w, 100%); padding-left: 8px; }
}
@media (max-width: 1199px) and (prefers-reduced-motion: reduce) {
  .mm-nav.mm-brand-auto .mm-island { transition: none; }
}
@media (max-width: 1080px) {
  footer.mm-foot { padding: 56px 24px 40px; }
  footer.mm-foot::before { left: 24px; right: 24px; }
  .mm-foot .mm-fgrid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .mm-foot .mm-fgrid > * { min-width: 0; }
  .mm-foot .mm-fbrand { grid-column: 1 / -1; padding-right: 0; }
}
@media (max-width: 1023px) {
  /* The tools moved into the mobile menu; nothing may linger in the island slot. */
  .mm-nav .mm-right > .nav-tools { display: none; }
}
@media (max-width: 480px) {
  .mm-nav .mm-brand img { height: 15px; width: 102px; }
  .mm-nav .mm-brand { width: 102px; margin: 0 12px 0 16px; }
  .mm-nav .mm-cta { font-size: 9.5px; padding: 10px 13px; letter-spacing: 0.1em; }
  .mm-foot .mm-fgrid { grid-template-columns: 1fr; gap: 32px; }
  .mm-foot .mm-fbottom { flex-direction: column; align-items: flex-start; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .mm-nav .mm-cta::after { animation: none; }
  .mm-nav, .mm-menu, .mm-foot, .mm-nav *, .mm-menu *, .mm-foot * { transition: none !important; }
}

/* ── Touch targets in the chrome's own lists ───────────────────────────
   The nav dropdowns, the language picker and the footer's Cookie settings
   button stay bespoke (they are menus and navigation, not value pickers),
   but on a touch screen they get the same 44px minimum the shared dropdown
   uses, so the whole site is consistent under a thumb. */
@media (pointer: coarse) {
  .mm-nav .mm-dd-menu a,
  .mm-menu .mm-dd-menu a { min-height: 44px; display: flex; align-items: center; }
  .mm-nav .mm-lang-menu button,
  .mm-menu .mm-lang-menu button { min-height: 44px; }
  .mm-foot .mm-flegal .mm-fcookie { min-height: 44px; display: inline-flex; align-items: center; }
}
