/* MTC section navigation and original MTC slideshow, adapted to React layouts. */
.mtc-section-tabs { display:flex; align-items:stretch; gap:.25rem; margin-inline:1.5rem; align-self:stretch; }
.mtc-section-tabs a { display:flex; align-items:center; padding:.65rem 1.1rem; border-bottom:3px solid transparent; text-transform:uppercase; letter-spacing:.12rem; font-size:.8rem; font-weight:700; color:var(--muted-foreground); white-space:nowrap; }
html[data-design="mtc"] .mtc-section-tabs a[aria-current="page"] { color:var(--foreground); border-bottom-color:var(--primary); background:transparent; box-shadow:none; }
.mtc-section-tabs a:hover { color:var(--foreground); background:var(--secondary); }
.mtc-section-tabs a:focus-visible { outline:2px solid var(--ring); outline-offset:-4px; }
.mtc-vehicle-hero { position:relative; isolation:isolate; display:grid; place-items:center; min-height:clamp(460px,72vh,850px); background:#000; color:#fff; overflow:hidden; }
.mtc-slides { position:absolute; inset:0; z-index:-2; }
.mtc-slides img { position:absolute; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 3s ease; }
.mtc-slides img.is-active { opacity:1; }
.mtc-vehicle-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(0,0,0,.65),rgba(0,0,0,.12) 40%,rgba(0,0,0,.15)); }
.mtc-vehicle-intro { width:100%; text-align:center; background:#0006; border-block:1px solid #ffffff33; padding:2.5rem 1.5rem; margin-block:4rem 6rem; backdrop-filter:blur(4px); }
.mtc-hero-eyebrow { font-size:.75rem; letter-spacing:.35rem; font-weight:700; margin-bottom:.5rem; }
html[data-design="mtc"] .mtc-vehicle-intro h1 { color:#fff; font-size:clamp(2.3rem,6vw,6rem); line-height:1.2; margin-bottom:1.2rem; text-shadow:2px 2px 4px #000b; }
.mtc-vehicle-intro > p:not(.mtc-hero-eyebrow) { max-width:36rem; margin:0 auto 1.75rem; font-weight:300; font-size:1rem; line-height:1.8; }
.mtc-hero-link { display:inline-flex; align-items:center; justify-content:center; gap:1.5rem; border:1px solid #fff; padding:.9rem 1.5rem; color:#fff; font-weight:700; text-transform:uppercase; letter-spacing:.12rem; font-size:.75rem; }
.mtc-hero-link:hover { background:#ffffff26; }
.mtc-slideshow-controls { position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:.4rem; background:#0009; padding:.4rem .65rem; border:1px solid #ffffff40; }
.mtc-slideshow-controls button { color:#fff; display:grid; place-items:center; min-width:44px; height:44px; cursor:pointer; }
.mtc-slideshow-controls button:hover { background:#ffffff26; }
.mtc-slide-dots { display:flex; }
.mtc-slide-dots button { min-width:32px; }
.mtc-slide-dots span { display:block; width:7px; height:7px; border:1px solid #fff; border-radius:50%; }
.mtc-slide-dots [aria-pressed="true"] span { background:#fff; }
.mtc-vehicle-hero :is(button,a):focus-visible { outline:2px solid #fff; outline-offset:3px; }
#vehicle-catalog { scroll-margin-top:5rem; }
@media(max-width:736px) {
 .mtc-section-tabs { margin-inline:.25rem; gap:0; }
 .mtc-section-tabs a { padding:.6rem .65rem; font-size:.7rem; letter-spacing:.05rem; }
 header:has(.mtc-section-tabs) > nav > div:first-child { flex-wrap:wrap; height:auto; min-height:4rem; row-gap:0; padding-top:.65rem; }
 header:has(.mtc-section-tabs) > nav > div:first-child > .mtc-section-tabs { order:3; width:100%; justify-content:center; }
 header:has(.mtc-section-tabs) > nav > div:first-child > .mtc-section-tabs a { min-height:44px; padding-inline:1.5rem; }
 .mtc-vehicle-intro { padding:2rem 1rem; }
 .mtc-vehicle-hero { min-height:560px; }
 .mtc-slideshow-controls { gap:0; padding:.2rem; }
 .mtc-slide-dots button { min-width:30px; }
}
@media(prefers-reduced-motion:reduce) { .mtc-slides img { transition:none; } }

/* Frosted overlay header: the actual page content continues behind the menu. */
html[data-design="mtc"] header:has(.mtc-section-tabs) {
  background:rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  backdrop-filter:blur(18px) saturate(130%);
  border:0;
  border-bottom:1px solid rgba(99,116,133,.25);
  box-shadow:none;
  margin-bottom:calc(-1 * var(--mtc-nav-height,64px));
  isolation:isolate;
}
html[data-design="mtc"].dark header:has(.mtc-section-tabs) {
  background:rgba(0,0,0,.12); border-bottom-color:rgba(255,255,255,.25);
}
html[data-design="mtc"] header:has(.mtc-section-tabs) .mtc-section-tabs a {
  border:0; background:transparent; box-shadow:none;
}
html[data-design="mtc"] header:has(.mtc-section-tabs) .mtc-section-tabs a[aria-current="page"] {
  border:0; box-shadow:none; text-decoration:underline; text-underline-offset:.45rem; text-decoration-thickness:1px;
}
/* Keep menu text readable over the full-colour vehicle slides in either theme. */
html[data-design="mtc"] header:has(.mtc-section-tabs):has(+ main .mtc-vehicle-hero) {
  background:rgba(0,0,0,.22); border-bottom-color:rgba(255,255,255,.25);
  color:#fff; --foreground:#fff; --muted-foreground:#eee;
  --primary:#fff; --primary-foreground:#171717; --secondary:#ffffff1a;
}
header:has(.mtc-section-tabs) + main .mtc-vehicle-hero {
  padding-top:var(--mtc-nav-height,64px);
}
/* The map itself reaches the top; only its foreground controls get an inset. */
header:has(.mtc-section-tabs) + main > section:has(.world-map-svg) {
  min-height:100vh; padding-top:var(--mtc-nav-height,64px);
}
header:has(.mtc-section-tabs) + main:not(:has(.mtc-vehicle-hero)):not(:has(.world-map-svg)) {
  padding-top:var(--mtc-nav-height,64px);
}

/* Shared home / maps / vehicles header, with a single account circle on the right. */
.mtc-top-nav { max-width:1280px; width:100%; margin:auto; padding-inline:2rem; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); min-height:64px; align-items:center; gap:1rem; }
.mtc-home-logo { min-width:0; justify-self:start; }
.mtc-home-logo svg { max-width:100%; height:32px; }
.mtc-logo-small { display:none; }
.mtc-top-nav > .mtc-section-tabs { margin:0; min-height:64px; }
.mtc-account { position:relative; justify-self:end; }
.mtc-account-circle { width:40px; height:40px; display:flex; align-items:center; justify-content:center; border:1px solid currentColor; border-radius:50%; color:var(--foreground); font-size:1.15rem; font-weight:600; cursor:pointer; text-decoration:none; }
.mtc-account-circle > :is(div,img) { width:100%; height:100%; border-radius:50%; }
.mtc-account-circle:focus-visible { outline:2px solid var(--ring); outline-offset:4px; }
.mtc-account-tooltip { display:none; position:absolute; top:calc(100% + 12px); right:0; white-space:nowrap; padding:.6rem .85rem; font-size:.8rem; color:var(--foreground); background:var(--popover); border:1px solid var(--border); border-radius:4px; box-shadow:0 4px 16px #0002; }
.mtc-account:has(.mtc-account-circle:hover) .mtc-account-tooltip,
.mtc-account:has(.mtc-account-circle:focus-visible) .mtc-account-tooltip { display:block; }
.mtc-account-panel { position:absolute; right:0; top:calc(100% + 12px); width:220px; padding:.5rem; background:var(--popover); color:var(--popover-foreground); border:1px solid var(--border); border-radius:4px; box-shadow:0 8px 24px #0003; }
html[data-design="mtc"] header .mtc-account-panel { --foreground:var(--popover-foreground); }
html[data-design="mtc"] header .mtc-account-panel :is(a,button) { display:block; padding:.6rem .75rem; width:100%; text-align:left; text-transform:none; font-size:.85rem; letter-spacing:normal; font-weight:400; color:var(--popover-foreground); }
.mtc-account-panel :is(a,button):hover { background:var(--muted); }
.mtc-account-name { padding:.5rem .75rem; font-weight:700; border-bottom:1px solid var(--border); margin-bottom:.25rem; }
/* Tooltip always uses its own solid surface, including over vehicle slides. */
html[data-design="mtc"] header .mtc-account-tooltip { color:var(--popover-foreground); }
@media(max-width:736px) {
 .mtc-top-nav { padding-inline:1rem; grid-template-columns:40px minmax(0,1fr) 40px; gap:.5rem; }
 .mtc-logo-wide { display:none; }
 .mtc-logo-small { display:block; }
 .mtc-top-nav > .mtc-section-tabs { justify-content:center; }
 .mtc-top-nav > .mtc-section-tabs a { padding-inline:.65rem; }
}

/* Restore the original language and light/dark controls alongside the account. */
.mtc-account { display:flex; align-items:center; gap:.65rem; }
.mtc-theme-toggle { width:36px; height:40px; display:grid; place-items:center; border-radius:4px; cursor:pointer; color:var(--foreground); }
.mtc-theme-toggle:hover { background:var(--secondary); }
.mtc-theme-toggle:focus-visible { outline:2px solid var(--ring); outline-offset:2px; }
@media(max-width:736px) {
 .mtc-top-nav { grid-template-columns:40px minmax(0,1fr); padding-block:.5rem 0; }
 .mtc-top-nav > .mtc-account { grid-column:2; grid-row:1; }
 .mtc-top-nav > .mtc-section-tabs { grid-column:1 / -1; grid-row:2; min-height:44px; }
 .mtc-top-nav > .mtc-section-tabs a { min-height:44px; }
 .mtc-account { gap:.4rem; }
}

/* Map background must reach the header, without the original opaque edge vignette. */
html[data-design="mtc"] header.mtc-top-header:has(+ main .world-map-svg) {
  background:transparent;
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  backdrop-filter:blur(18px) saturate(130%);
  border-bottom:1px solid rgba(99,116,133,.25);
}
html[data-design="mtc"].dark header.mtc-top-header:has(+ main .world-map-svg) {
  background:transparent; border-bottom-color:rgba(255,255,255,.25);
}
html[data-design="mtc"] .mtc-top-header + main:has(.world-map-svg) { padding-top:0; }
html[data-design="mtc"] .mtc-top-header + main > section:has(.world-map-svg) {
  min-height:100svh; padding-top:var(--mtc-nav-height,64px);
}
/* The old radial overlay painted a solid strip over the northern edge of the map. */
html[data-design="mtc"] .mtc-top-header + main .world-map-svg + div {
  background:none;
}
