.mm-skip {
  position: absolute; left: 50%; top: 0; transform: translate(-50%, -120%);
  z-index: 2000;
  padding: .7rem 1.25rem; border-radius: 0 0 var(--r-control) var(--r-control);
  font: 600 var(--fs-small)/1 var(--font);
  color: var(--cta-ink); background: var(--cta-bg);
  box-shadow: none;
  transition: transform var(--t-fast) var(--ease);
}
.mm-skip:focus,
.mm-skip:focus-visible {
  transform: translate(-50%, 0);
  outline: 2px solid var(--ink); outline-offset: 2px;
  box-shadow: var(--shadow-glow);
  text-decoration: none;
}

.mm-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  --mm-head-pad: 18px; --mm-mega-gap: 12px;
  padding: var(--mm-head-pad) 0; border-bottom: 1px solid transparent;
  transition: background var(--t-base) var(--ease),
              backdrop-filter var(--t-base) var(--ease),
              box-shadow var(--t-base) var(--ease),
              border-color var(--t-base) var(--ease),
              padding var(--t-base) var(--ease);
}
.mm-header.scrolled {
  --mm-head-pad: 10px;
  background: var(--bg-2);
  border-bottom: 1px solid var(--line);
  box-shadow: var(--shadow-elev);
  padding: var(--mm-head-pad) 0;
}
.mm-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  pointer-events: none; opacity: 0;
  background: linear-gradient(90deg, transparent 8%,
    color-mix(in srgb, var(--glow) 55%, transparent) 50%, transparent 92%);
  transition: opacity var(--t-base) var(--ease);
}
.mm-header.scrolled::after { opacity: 1; }
:root { --mm-nav-maxw: 1320px; }
.mm-header .mm-nav { max-width: var(--mm-nav-maxw); }
.mm-nav { display: flex; align-items: center; gap: 24px; }
.mm-logo { display: inline-flex; align-items: center; flex: none; }
.mm-logo img {
  height: 34px; width: auto;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .4));
  transition: height var(--t-base) var(--ease);
}
.mm-header.scrolled .mm-logo img { height: 30px; }

.mm-links {
  display: flex; align-items: center; gap: 4px;
  margin-left: auto;
  list-style: none; margin-block: 0; padding: 0;
}
.mm-links > li { position: relative; }
.mm-links > li.mm-has-mega { position: static; }

.mm-navlink,
.mm-trigger {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 10px 14px; border-radius: var(--r-control);
  font: 600 .92rem/1 var(--font);
  color: var(--ink-2); background: transparent; border: 1px solid transparent;
  cursor: pointer; white-space: nowrap;
  transition: color var(--t-fast) var(--ease), background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.mm-navlink:hover,
.mm-trigger:hover,
.mm-navlink:focus-visible,
.mm-trigger:focus-visible {
  color: var(--ink); text-decoration: none;
  background: var(--surface-2);
}

.mm-navlink[aria-current="page"] { color: var(--ink); }
.mm-trigger.is-current { position: relative; color: var(--ink); }
.mm-trigger.is-current::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px;
  height: 2px; border-radius: 2px; background: var(--accent);
}
.mm-navlink[aria-current="page"]::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px;
  height: 2px; border-radius: 2px; background: var(--accent);
}

.mm-caret {
  width: 14px; height: 14px; flex: none;
  transition: transform var(--t-base) var(--ease);
  color: var(--accent-2);
}
.mm-trigger[aria-expanded="true"] { color: var(--ink); background: var(--surface-2); border-color: var(--line); }
.mm-trigger[aria-expanded="true"] .mm-caret { transform: rotate(180deg); }

.mm-has-panel:not(.is-dismissed):hover > .mm-trigger { color: var(--ink); background: var(--surface-2); border-color: var(--line); }
.mm-has-panel:not(.is-dismissed):hover > .mm-trigger .mm-caret { transform: rotate(180deg); }

.mm-cta-desktop { margin-left: 10px; flex: none; }

.mm-panel {
  position: absolute; top: calc(100% + 4px); z-index: 1050;
  background: color-mix(in srgb, var(--bg-2) 94%, transparent);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  border: 1px solid var(--line);
  border-radius: var(--r-surface);
  box-shadow: var(--shadow-elev), var(--inset-hi);
  padding: 12px;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease), visibility var(--t-base) var(--ease);
  pointer-events: none;
}

.mm-panel::after {
  content: ""; position: absolute; left: -10px; right: -10px; top: -12px; height: 14px;
  pointer-events: auto;
}

.mm-panel__bloom {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 46%; z-index: 0;
  border-radius: var(--r-surface) var(--r-surface) 0 0; pointer-events: none;
  background: radial-gradient(120% 80% at 30% 0, color-mix(in srgb, var(--glow) 11%, transparent), transparent 60%);
}
.mm-panel > *:not(.mm-panel__bloom) { position: relative; z-index: 1; }

.mm-has-panel:hover > .mm-panel,
.mm-has-panel.is-open > .mm-panel,
html:not(.js) .mm-has-panel:focus-within > .mm-panel {
  opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto;
  transition: opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease), visibility 0s;
}
.mm-has-panel.is-dismissed > .mm-panel { opacity: 0; visibility: hidden; pointer-events: none; }
@media (hover: none) {
  html.js .mm-has-panel:not(.is-open) > .mm-panel { opacity: 0; visibility: hidden; pointer-events: none; }
  /* A tap leaves :hover on the trigger; the closed trigger keeps its resting look. */
  html.js .mm-has-panel:not(.is-open) > .mm-trigger:not(:focus-visible) { color: var(--ink-2); background: transparent; border-color: transparent; }
  html.js .mm-has-panel:not(.is-open) > .mm-trigger.is-current:not(:focus-visible) { color: var(--ink); }
  html.js .mm-has-panel:not(.is-open) > .mm-trigger .mm-caret { transform: none; }
}

.mm-dropdown { left: 0; min-width: 268px; }
.mm-dropdown ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.mm-dropdown a {
  display: flex; flex-direction: column; gap: 2px;
  padding: 11px 14px; border-radius: var(--r-control);
  color: var(--ink); position: relative;
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), padding-left var(--t-fast) var(--ease);
}
.mm-dropdown a .t { font: 600 .95rem/1.2 var(--font); }
.mm-dropdown a .d { font: 400 .8rem/1.35 var(--body); color: var(--ink-2); }
.mm-dropdown a:hover,
.mm-dropdown a:focus-visible {
  background: var(--surface-2); text-decoration: none; padding-left: 18px;
}
.mm-dropdown a:hover .t,
.mm-dropdown a:focus-visible .t { color: var(--accent-2); }

/* The mega panel hangs from the nav row, so it clears the header's bottom padding and border and
   then leaves --mm-mega-gap (set on the header) of space below the bar, whether the header is at rest or scrolled.
   The panel clips its own overflow, so the hover bridge across that space belongs to the menu's
   list item: it starts at the nav row's bottom (where the trigger ends) and reaches 2px into the
   panel, and it exists only while the menu is hovered or open, so it never opens the menu. */
.mm-mega {
  top: calc(100% + var(--mm-head-pad) + 1px + var(--mm-mega-gap));
  left: 50%; transform: translateX(-50%) translateY(8px);

  width: min(1240px, calc(100vw - 48px));

  padding: 0; overflow: hidden;

  max-height: min(76vh, 560px, calc(100vh - 100px));
}
.mm-has-mega:not(.is-dismissed):hover::after,
.mm-has-mega.is-open::after {
  content: ""; position: absolute; left: 0; right: 0; top: 100%;
  height: calc(var(--mm-head-pad) + 1px + var(--mm-mega-gap) + 2px);
  pointer-events: auto;
}
.mm-has-panel:hover > .mm-mega,
.mm-has-panel.is-open > .mm-mega,
html:not(.js) .mm-has-panel:focus-within > .mm-mega { transform: translateX(-50%) translateY(0); }

.mm-mega > .mm-panel__bloom { display: none; }

.mm-mega__layout {
  display: grid; grid-template-columns: 40% 60%; gap: 0; align-items: stretch;
  max-height: inherit;
}

.mm-mega__feature {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end;

  min-height: 440px; padding: 36px 32px;
  isolation: isolate;
}
.mm-mega__feature img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: -3;

  filter: saturate(.6) contrast(1.04) brightness(.92);
  transform: scale(1.04);
  transform-origin: 60% 40%;
  transition: transform var(--t-slow) var(--ease);
}
.mm-has-panel:hover .mm-mega__feature img,
.mm-has-panel.is-open .mm-mega__feature img { transform: scale(1.09); }

.mm-mega__feature::before {
  content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bg-3) 22%, transparent) 0%, transparent 28%, color-mix(in srgb, var(--bg-3) 88%, transparent) 100%),
    linear-gradient(115deg, color-mix(in srgb, var(--bg) 70%, transparent), color-mix(in srgb, var(--accent) 22%, transparent) 120%);
}

.mm-mega__feature::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 50% at 18% 14%, color-mix(in srgb, var(--glow) 22%, transparent), transparent 62%);
  box-shadow: inset 0 0 90px 12px color-mix(in srgb, var(--bg-3) 52%, transparent);
}

.mm-mega__feature .eyebrow {
  display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
  padding: 6px 13px; border-radius: var(--r-pill);
  font: 700 var(--fs-eyebrow)/1 var(--body);
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink);
  background: color-mix(in srgb, var(--bg-3) 42%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
  backdrop-filter: blur(6px);
  margin-bottom: 16px;
}
.mm-mega__feature .eyebrow::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; flex: none;
  background: var(--glow); box-shadow: 0 0 10px 1px var(--glow);
}

.mm-mega__feature .ttl {
  display: block; font: 800 clamp(1.7rem, 1.9vw, 2.2rem)/1.05 var(--font);
  letter-spacing: -.015em; color: var(--ink); margin: 0 0 12px; max-width: 16ch;
  text-wrap: balance;
}
.mm-mega__feature .ttl .accent {
  background: var(--grad-text); -webkit-background-clip: text; background-clip: text;
  color: transparent;
}
.mm-mega__feature .sub {
  font: 400 .95rem/1.5 var(--body); color: var(--ink-2);
  max-width: 36ch; margin: 0 0 20px;
}
.mm-mega__feature .lnk {
  display: inline-flex; align-items: center; gap: 9px;
  align-self: flex-start;
  padding: 12px 20px; border-radius: var(--r-pill);
  font: 700 .9rem/1 var(--body); color: var(--cta-ink);
  background: var(--cta-bg); background-image: var(--grad-accent);
  border: 1px solid color-mix(in srgb, var(--glow) 60%, transparent);
  box-shadow: var(--shadow-glow);
  transition: transform var(--t-fast) var(--ease), box-shadow var(--t-base) var(--ease), filter var(--t-fast) var(--ease);
}
.mm-mega__feature .lnk::after { content: "\2192"; transition: transform var(--t-fast) var(--ease); }
.mm-mega__feature .lnk:hover {
  text-decoration: none; transform: translateY(-2px);
  box-shadow: var(--shadow-glow); filter: brightness(1.05);
}
.mm-mega__feature .lnk:hover::after { transform: translateX(4px); }

.mm-mega__cards {
  display: flex; flex-direction: column; min-width: 0;

  padding: 32px 32px 26px; overflow: auto;
}
.mm-mega__head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
  padding: 0 6px 16px; margin-bottom: 6px;
}
.mm-mega__head .lbl {
  font: 700 var(--fs-eyebrow)/1 var(--body);
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3);
}

.mm-mega__grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; flex: 1;
}

.mm-mega__card {
  display: flex; align-items: center; gap: 14px;

  padding: 14px 14px; border-radius: var(--r-control);
  border: 1px solid transparent; position: relative; overflow: hidden;
  transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease), transform var(--t-fast) var(--ease);
}
.mm-mega__card::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(120% 90% at 100% 0, color-mix(in srgb, var(--accent) 12%, transparent), transparent 58%);
  opacity: 0; transition: opacity var(--t-base) var(--ease);
}
.mm-mega__card[aria-current="page"],
.mm-mega__card:hover,
.mm-mega__card:focus-visible {
  background: var(--surface-2); border-color: var(--line);
  transform: translateX(2px); text-decoration: none;
}
.mm-mega__card:hover::after,
.mm-mega__card:focus-visible::after { opacity: 1; }

.mm-mega__ico {
  width: 46px; height: 46px; flex: none;
  display: grid; place-items: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 11%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 24%, transparent);
  box-shadow: var(--inset-hi);
  transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
}
.mm-mega__card:hover .mm-mega__ico,
.mm-mega__card:focus-visible .mm-mega__ico {
  background: color-mix(in srgb, var(--accent) 20%, transparent);
  border-color: color-mix(in srgb, var(--glow) 50%, transparent);
  box-shadow: var(--inset-hi), 0 0 18px -4px color-mix(in srgb, var(--glow) 70%, transparent);
}

.mm-mega__ico img {
  width: 23px; height: 23px;
  filter: brightness(0) saturate(100%) invert(82%) sepia(20%) saturate(640%) hue-rotate(140deg) brightness(101%) contrast(94%);
}
.mm-mega__txt { min-width: 0; flex: 1; }
.mm-mega__txt .t {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font: 600 1rem/1.2 var(--font); color: var(--ink);
  transition: color var(--t-fast) var(--ease);
}

.mm-mega__txt .t::after {
  content: "\2192"; color: var(--accent-2); opacity: 0;
  transform: translateX(-4px);
  transition: transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease);
}
.mm-mega__card:hover .t,
.mm-mega__card:focus-visible .t { color: var(--accent-2); }
.mm-mega__card:hover .t::after,
.mm-mega__card:focus-visible .t::after { opacity: 1; transform: translateX(0); }
.mm-mega__txt .s {
  display: block; margin-top: 3px;
  font: 400 .8rem/1.3 var(--body); color: var(--ink-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.mm-mega__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--divider);
}
.mm-mega__note { font: 400 .82rem/1.35 var(--body); color: var(--ink-2); }
.mm-mega__note b { color: var(--ink); font-weight: 600; }
.mm-mega__all {
  display: inline-flex; align-items: center; gap: 8px; flex: none;
  padding: 10px 17px; border-radius: var(--r-pill);
  font: 700 .85rem/1 var(--body); color: var(--ink);
  background: var(--surface-2); border: 1px solid var(--line);
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.mm-mega__all::after { content: "\2192"; color: var(--accent-2); transition: transform var(--t-fast) var(--ease); }
.mm-mega__all[aria-current="page"],
.mm-mega__all:hover {
  color: var(--cta-ink); background: var(--grad-accent); border-color: transparent;
  text-decoration: none;
}
.mm-mega__all[aria-current="page"]::after,
.mm-mega__all:hover::after { color: var(--cta-ink); transform: translateX(4px); }

.mm-burger {
  display: none;
  margin-left: auto;
  width: 44px; height: 44px; padding: 0;
  align-items: center; justify-content: center;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--r-control);
  backdrop-filter: blur(6px);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.mm-burger:hover { border-color: var(--accent); }
.mm-burger .bars { position: relative; width: 20px; height: 14px; display: block; }
.mm-burger .bars span {
  position: absolute; left: 0; width: 100%; height: 2px; border-radius: 2px;
  background: var(--ink);
  transition: transform var(--t-base) var(--ease), opacity var(--t-fast) var(--ease), top var(--t-base) var(--ease);
}
.mm-burger .bars span:nth-child(1) { top: 0; }
.mm-burger .bars span:nth-child(2) { top: 6px; }
.mm-burger .bars span:nth-child(3) { top: 12px; }

.mm-burger[aria-expanded="true"] .bars span:nth-child(1) { top: 6px; transform: rotate(45deg); }
.mm-burger[aria-expanded="true"] .bars span:nth-child(2) { opacity: 0; }
.mm-burger[aria-expanded="true"] .bars span:nth-child(3) { top: 6px; transform: rotate(-45deg); }

.mm-overlay {
  position: fixed; inset: 0; z-index: 1090;
  background: color-mix(in srgb, var(--bg-3) 74%, transparent);
  backdrop-filter: blur(3px);
  opacity: 0; visibility: hidden;
  transition: opacity var(--t-base) var(--ease), visibility var(--t-base) var(--ease);
}
.mm-overlay.open { opacity: 1; visibility: visible; }

.mm-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 1100;
  width: min(88vw, 384px);
  display: flex; flex-direction: column;
  padding: 20px 20px calc(20px + env(safe-area-inset-bottom));
  background: var(--bg-2);
  border-left: 1px solid var(--line);
  box-shadow: var(--shadow-elev);
  transform: translateX(100%);
  transition: transform var(--t-base) var(--ease-out);
  overflow-y: auto; overscroll-behavior: contain;
}
.mm-drawer.open { transform: translateX(0); }
.mm-drawer[hidden],
.mm-overlay[hidden] { display: none; }

.mm-drawer__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding-bottom: 16px; margin-bottom: 6px;
  border-bottom: 1px solid var(--line-2);
}
.mm-drawer__head img { height: auto; width: auto; max-width: calc(100% - 56px); max-height: 28px; opacity: .95; }
.mm-drawer__close {
  width: 40px; height: 40px; flex: none; display: grid; place-items: center;
  background: var(--surface-2); border: 1px solid var(--line);
  border-radius: var(--r-control); color: var(--ink); cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.mm-drawer__close:hover { border-color: var(--accent); color: var(--accent-2); }
.mm-drawer__close svg { width: 18px; height: 18px; }

.mm-drawer__nav { display: flex; flex-direction: column; padding: 6px 0; }

.mm-drawer__link {
  display: flex; align-items: center; justify-content: space-between;
  padding: 15px 4px;
  font: 600 1.05rem/1.2 var(--font);
  color: var(--ink);
  border-bottom: 1px solid var(--line-2);
  transition: color var(--t-fast) var(--ease), padding-left var(--t-fast) var(--ease);
}
.mm-drawer__link::after {
  content: "\2192"; color: var(--accent-2);
  transition: transform var(--t-fast) var(--ease);
}
.mm-drawer__link:hover { color: var(--accent-2); padding-left: 10px; text-decoration: none; }
.mm-drawer__link:hover::after { transform: translateX(4px); }
.mm-drawer__link[aria-current="page"],
.mm-acc__inner a[aria-current="page"] { color: var(--accent-2); }
.mm-acc__inner a[aria-current="page"] { font-weight: 700; }

.mm-acc { border-bottom: 1px solid var(--line-2); }
.mm-acc__btn {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 15px 4px; background: transparent; border: 0; cursor: pointer;
  font: 600 1.05rem/1.2 var(--font); color: var(--ink); text-align: left;
  transition: color var(--t-fast) var(--ease);
}
.mm-acc__btn:hover { color: var(--accent-2); }
.mm-acc__btn .mm-caret { width: 16px; height: 16px; transition: transform var(--t-base) var(--ease); }
.mm-acc__btn[aria-expanded="true"] { color: var(--accent-2); }
.mm-acc__btn[aria-expanded="true"] .mm-caret { transform: rotate(180deg); }

.mm-acc__panel {
  overflow: hidden; max-height: 0;
  transition: max-height var(--t-base) var(--ease);
}
.mm-acc__panel.open { max-height: 640px; }
.mm-acc__inner { padding: 2px 4px 12px; display: flex; flex-direction: column; gap: 2px; }
.mm-acc__inner a {
  display: flex; align-items: center; gap: 11px;
  padding: 11px 10px; border-radius: var(--r-control);
  color: var(--ink-2);
  font: 500 .96rem/1.25 var(--body);
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), padding-left var(--t-fast) var(--ease);
}
.mm-acc__inner a:hover { background: var(--surface-2); color: var(--accent-2); text-decoration: none; padding-left: 14px; }
.mm-acc__ico {
  width: 30px; height: 30px; flex: none; display: grid; place-items: center;
  border-radius: 9px; background: color-mix(in srgb, var(--accent) 12%, transparent);
  border: 1px solid var(--line);
}
.mm-acc__ico img {
  width: 16px; height: 16px;
  filter: brightness(0) saturate(100%) invert(82%) sepia(20%) saturate(640%) hue-rotate(140deg) brightness(101%) contrast(94%);
}

.mm-drawer__cta { margin-top: auto; padding-top: 20px; }
.mm-drawer__cta .btn { width: 100%; justify-content: center; }

body.mm-no-scroll { overflow: hidden; }

.mm-sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 980;
  display: none;
  align-items: center; gap: 14px;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--bg-2) 88%, transparent);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-top: 1px solid var(--line);
  box-shadow: 0 -10px 30px -16px rgba(0, 0, 0, .6);
  transform: translateY(110%);
  visibility: hidden;
  transition: transform var(--t-base) var(--ease-out), visibility 0s linear var(--t-base);
}
.mm-sticky-cta.show { transform: translateY(0); visibility: visible; transition: transform var(--t-base) var(--ease-out), visibility 0s; }
.mm-sticky-cta__copy { flex: 1; min-width: 0; }
.mm-sticky-cta__copy b {
  display: block; font: 700 .95rem/1.2 var(--font); color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mm-sticky-cta__copy span {
  display: block; font: 400 .78rem/1.2 var(--body); color: var(--ink-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mm-sticky-cta .btn { flex: none; white-space: nowrap; }

.mm-footer {
  position: relative; overflow: hidden;
  background:
    radial-gradient(120% 90% at 80% -10%, color-mix(in srgb, var(--accent) 7%, transparent), transparent 55%),
    linear-gradient(180deg, var(--bg-2), var(--bg-3) 60%);
  border-top: 1px solid var(--line-2);
}

.mm-footer::before {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  left: 50%; bottom: -38%; width: 70vw; max-width: 1000px; height: 520px;
  transform: translateX(-50%);
  background: radial-gradient(50% 50% at 50% 50%, color-mix(in srgb, var(--glow) 12%, transparent), color-mix(in srgb, var(--accent) 5%, transparent) 46%, transparent 70%);
  filter: blur(26px);
  animation: mm-footer-glow 14s var(--ease) infinite alternate;
}
@keyframes mm-footer-glow {
  0%   { opacity: .55; transform: translateX(-50%) translateY(0) scale(1); }
  100% { opacity: 1;   transform: translateX(-50%) translateY(-18px) scale(1.06); }
}
.mm-footer .container { position: relative; z-index: 1; }

.mm-footer__lead {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: 1.35fr .9fr; align-items: center;
  gap: clamp(28px, 5vw, 60px);
  margin: clamp(40px, 6vw, 72px) 0 clamp(28px, 4vw, 44px);
  /* side padding and copy width are named so the photo can start where the copy column ends */
  --lead-px: clamp(28px, 4vw, 52px);
  --lead-copy-w: 22ch;
  padding: clamp(34px, 4.6vw, 56px) var(--lead-px);
  border-radius: calc(var(--r-surface) + 4px);
  border: 1px solid var(--line);
  background:
    radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 55%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 70%, transparent), color-mix(in srgb, var(--bg-3) 60%, transparent));
  box-shadow: var(--shadow-elev), var(--inset-hi);
}

.mm-footer__lead::before {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  right: -8%; bottom: -60%; width: 60%; height: 200%;
  background: radial-gradient(50% 50% at 50% 50%, color-mix(in srgb, var(--glow) 22%, transparent), color-mix(in srgb, var(--accent) 8%, transparent) 45%, transparent 70%);
  filter: blur(30px);
  transform: translateZ(0);
}

.mm-footer__lead-art {
  position: absolute; z-index: 0; pointer-events: none;
  right: 0; top: 0; bottom: 0; width: 42%;
  -webkit-mask-image: linear-gradient(90deg, transparent, black 60%);
  mask-image: linear-gradient(90deg, transparent, black 60%);
  opacity: .22;
}
.mm-footer__lead-art img {
  width: 100%; height: 100%; object-fit: cover;
  filter: grayscale(.2) saturate(1.05);
}
/* Side-by-side layout: the photo covers up to 70% of the card and starts only after the copy column.
   The first grid column is at least the 30% line and never narrower than the copy's longest word (min-content),
   and the photo is placed from the second column's start, so it follows the text whatever the font, the browser's
   text size or the heading's wording. The first --lead-art-clear of the photo stays fully clear before it fades in.
   The button and the guarantee chip keep their place at the card's right edge (justify-self: end). */
@media (min-width: 981px) {
  .mm-footer__lead {
    --lead-art-gap: clamp(16px, 2vw, 28px);
    column-gap: var(--lead-art-gap);
    grid-template-columns: minmax(calc(30% - .4 * var(--lead-px) - var(--lead-art-gap)), auto) 1fr;
  }
  .mm-footer__lead-copy { min-width: min-content; }
  .mm-footer__lead-art {
    --lead-art-clear: 40px;
    grid-column: 2 / auto;
    left: 0;
    width: auto;
    -webkit-mask-image: linear-gradient(90deg, transparent var(--lead-art-clear), var(--ink) 42%);
    mask-image: linear-gradient(90deg, transparent var(--lead-art-clear), var(--ink) 42%);
  }
}
.mm-footer__lead-copy { position: relative; z-index: 1; max-width: var(--lead-copy-w); }
.mm-footer__lead .eyebrow { margin-bottom: 14px; }
.mm-footer__lead h2 {
  font: 800 clamp(2rem, 4.2vw, 3.1rem)/1.04 var(--font); letter-spacing: -.025em;
  color: var(--ink); margin: 0; max-width: 16ch;
}
.mm-footer__lead h2 .accent { color: var(--accent-2); }
.mm-footer__lead-sub {
  margin: 14px 0 0; max-width: 32ch;
  font: 400 var(--fs-body)/1.55 var(--body); color: var(--ink-2);
}
.mm-footer__lead-actions {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: flex-start; gap: 16px;
  justify-self: end;
}
.mm-footer__lead-actions .btn { white-space: nowrap; }
/* The guarantee chip in the footer sits over the footer photo, so its tint is mixed into the section colour
   (not see-through) and its text keeps its contrast whatever the photo shows. */
.mm-footer .guarantee-chip { background: color-mix(in srgb, var(--accent) 12%, var(--bg-2)); }
.mm-footer__lead-actions .btn-lg { padding: 1.05rem 2rem; }

.mm-footer__divide { height: 1px; background: var(--divider); border: 0; margin: 0; }

.mm-footer__cols {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: clamp(28px, 4vw, 52px);
  align-items: start;
  padding: clamp(36px, 5vw, 56px) 0 clamp(32px, 5vw, 48px);
}
.mm-footer__brand { max-width: 320px; }
.mm-footer__brand img { height: auto; max-height: 30px; width: auto; max-width: 100%; opacity: .95; margin-bottom: 16px; }
.mm-footer__tagline { font: 400 .92rem/1.6 var(--body); color: var(--ink-2); margin: 0 0 16px; }
.mm-footer__contact { display: flex; flex-direction: column; gap: 7px; }
.mm-footer__contact a,
.mm-footer__contact span {
  display: inline-flex; align-items: center; gap: 8px;
  font: 500 .9rem/1.3 var(--body); color: var(--ink-2);
  transition: color var(--t-fast) var(--ease);
}
.mm-footer__contact a:hover { color: var(--accent-2); text-decoration: none; }
.mm-footer__contact svg { width: 15px; height: 15px; flex: none; color: var(--accent-2); }

.mm-footer__col h4 {
  font: 700 .76rem/1 var(--font); letter-spacing: .16em; text-transform: uppercase;
  color: var(--ink); margin: 0 0 16px;
}
.mm-footer__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.mm-footer__col a {
  font: 400 .92rem/1.3 var(--body); color: var(--ink-2);
  transition: color var(--t-fast) var(--ease), padding-left var(--t-fast) var(--ease);
}
.mm-footer__col a:hover { color: var(--accent-2); text-decoration: none; padding-left: 4px; }

.mm-footer__bar {
  display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap;
  padding: 26px 0 clamp(34px, 5vw, 48px);
  border-top: 1px solid var(--line-2);
}
.mm-footer__bar-left { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.mm-footer__bar img { height: 24px; width: auto; opacity: .9; }
.mm-footer__copy { font: 400 .82rem/1.4 var(--body); color: var(--ink-2); margin: 0; }
.mm-footer__legal { display: flex; gap: 22px; }
.mm-footer__legal a { font: 400 .82rem/1 var(--body); color: var(--ink-2); transition: color var(--t-fast) var(--ease); }
.mm-footer__legal a:hover { color: var(--accent-2); text-decoration: none; }

@media (max-width: 1280px) {

  .mm-mega { width: min(1100px, calc(100vw - 40px)); }
}

@media (max-width: 1240px) {
  .mm-nav { gap: 16px; }
  .mm-navlink, .mm-trigger { padding-inline: 10px; }
  .mm-navlink[aria-current="page"]::after, .mm-trigger.is-current::after { left: 10px; right: 10px; }
}

@media (max-width: 1180px) {

  .mm-mega { width: min(940px, calc(100vw - 40px)); }
  .mm-mega__layout { grid-template-columns: 36% 64%; }
  .mm-mega__feature { min-height: 380px; padding: 30px 26px; }
  .mm-mega__cards { padding: 26px 26px 22px; }

  .mm-footer__cols { grid-template-columns: 1.4fr 1fr 1fr; gap: 36px 32px; }
  .mm-footer__brand { grid-column: 1 / -1; max-width: none; }
}

@media (max-width: 1100px) {
  .mm-links { gap: 2px; }
  .mm-navlink, .mm-trigger { padding-inline: 9px; }
}

@media (max-width: 1040px) {

  .mm-mega { width: min(620px, calc(100vw - 32px)); max-height: min(88vh, 740px, calc(100vh - 100px)); }
  .mm-mega__layout { grid-template-columns: 1fr; }
  .mm-mega__feature { min-height: 150px; padding: 22px 24px; }
  .mm-mega__grid { grid-template-columns: 1fr 1fr; }
  .mm-mega { overflow-y: auto; }
  .mm-mega__feature::before {
    background:
      linear-gradient(90deg, color-mix(in srgb, var(--bg-3) 90%, transparent) 0%, color-mix(in srgb, var(--bg-3) 82%, transparent) 58%, transparent 88%),
      linear-gradient(180deg, color-mix(in srgb, var(--bg-3) 22%, transparent) 0%, transparent 28%, color-mix(in srgb, var(--bg-3) 88%, transparent) 100%);
  }
}

@media (min-width: 981px) {
  .mm-nav {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    column-gap: 24px;
  }
  .mm-logo { justify-self: start; min-width: 0; max-width: 100%; }
  .mm-header .mm-logo img,
  .mm-header.scrolled .mm-logo img {
    width: clamp(190px, calc(24vw - 40px), 288px); height: auto; max-width: 100%;
    transition: width var(--t-base) var(--ease);
  }
  .mm-header.scrolled .mm-logo img { width: clamp(184px, calc(22vw - 40px), 264px); }
  .mm-links { margin-left: 0; justify-self: center; }
  .mm-cta-desktop { margin-left: 0; justify-self: end; }
}
@media (min-width: 981px) and (max-width: 1240px) { .mm-nav { column-gap: 16px; } }
@media (min-width: 981px) and (max-width: 1100px) { .mm-nav { column-gap: 12px; } }

@media (max-width: 980px) {

  .mm-links { display: none; }
  .mm-cta-desktop { display: none; }
  .mm-burger { display: inline-flex; }
  .mm-sticky-cta { display: flex; }
  .mm-nav { gap: 12px; }

  .mm-logo { min-width: 0; }
  .mm-header .mm-logo img,
  .mm-header.scrolled .mm-logo img {
    height: auto;
    width: 210px;
    max-width: 54vw;
  }

  .mm-footer__lead {
    grid-template-columns: 1fr; gap: 22px;
    padding: clamp(28px, 7vw, 40px);
  }
  .mm-footer__lead-copy { max-width: none; }
  .mm-footer__lead-actions { align-items: stretch; justify-self: stretch; }
  .mm-footer__lead-actions .btn { width: 100%; justify-content: center; }
  .mm-footer__lead-art { width: 56%; opacity: .14; }
}

@media (max-width: 760px) {
  .mm-footer__cols { grid-template-columns: 1fr 1fr; gap: 32px 28px; }
}

@media (max-width: 560px) {
  .mm-footer__cols { grid-template-columns: 1fr; gap: 28px; }
  .mm-footer__bar { flex-direction: column; align-items: flex-start; gap: 14px; }
  .mm-footer__legal { flex-wrap: wrap; gap: 16px; }
  .mm-footer__lead-art { display: none; }
}

@media (max-width: 390px) {
  .mm-header { padding: 12px 0; }
  .mm-nav { gap: 10px; }
  .mm-drawer { width: min(94vw, 344px); padding: 18px 18px calc(18px + env(safe-area-inset-bottom)); }
  .mm-sticky-cta { gap: 10px; padding: 11px 13px calc(11px + env(safe-area-inset-bottom)); }
  .mm-sticky-cta__copy span { display: none; }
  .mm-sticky-cta .btn { padding: .62rem 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  .mm-header,
  .mm-logo img,
  .mm-burger .bars span,
  .mm-overlay,
  .mm-drawer,
  .mm-sticky-cta,
  .mm-panel,
  .mm-panel *,
  .mm-caret,
  .mm-acc__panel,
  .mm-acc__btn .mm-caret,
  .mm-navlink,
  .mm-trigger,
  .mm-drawer__link,
  .mm-drawer__link::after,
  .mm-mega__card,
  .mm-mega__feature img,
  .mm-mega__feature .lnk,
  .mm-mega__txt .t::after,
  .mm-mega__all::after { transition: none !important; }
  .mm-footer::before { animation: none !important; }
}