@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;600;700;800&display=swap');

/* Production Meridian foundation. The design documents remain read-only; this
   layer supplies their tokens to the live PHP application and scopes the new
   component work to pages that have been migrated. */
:root {
  --color-bg: #f3f2f2;
  --color-surface: #eae9e9;
  --color-text: #201e1d;
  --color-accent: #ec3013;
  --color-accent-2: #e15b47;
  --color-divider: color-mix(in srgb, #201e1d 40%, transparent);
  --color-neutral-100: #f8f4f4;
  --color-neutral-200: #eae7e7;
  --color-neutral-300: #d7d3d3;
  --color-neutral-400: #bab6b6;
  --color-neutral-500: #9b9797;
  --color-neutral-600: #7d7979;
  --color-neutral-700: #605d5d;
  --color-neutral-800: #444141;
  --color-neutral-900: #2d2b2b;
  --color-accent-100: #fff2ef;
  --color-accent-200: #ffe0d9;
  --color-accent-300: #ffc4b8;
  --color-accent-400: #ff9783;
  --color-accent-500: #ff563c;
  --color-accent-600: #dd2b0f;
  --color-accent-700: #ae1800;
  --color-accent-800: #7c1405;
  --color-accent-900: #4d170e;
  --color-accent-2-100: #fff2ef;
  --color-accent-2-200: #ffe0da;
  --color-accent-2-300: #ffc4b9;
  --color-accent-2-400: #ff9784;
  --color-accent-2-500: #ef6853;
  --color-accent-2-600: #c94b39;
  --color-accent-2-700: #9e3526;
  --color-accent-2-800: #71261b;
  --color-accent-2-900: #471d16;
  --font-heading: "Archivo", system-ui, sans-serif;
  --font-heading-weight: 800;
  --font-body: "Archivo", system-ui, sans-serif;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
  --shadow-sm: 0 1px 2px color-mix(in srgb, #2d2b2b 14%, transparent);
  --shadow-md: 0 3px 10px color-mix(in srgb, #2d2b2b 16%, transparent);
  --shadow-lg: 0 12px 32px color-mix(in srgb, #2d2b2b 22%, transparent);
}

body.meridian-page {
  margin: 0;
  color: var(--color-text);
  /* The reference deliberately uses neutral-300 as the outer ground.
     --color-bg becomes pale ink in Night Glass and must only be used where
     the design calls for a light inversion, never as the dark page canvas. */
  background-color: var(--color-neutral-300);
  background-image: var(--page-art);
  background-attachment: fixed;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
}

/* Legacy homepage blocks stay available in source until the Meridian slice is
   accepted, but only the production Meridian composition is exposed. */
.meridian-page main > .hero,
.meridian-page main > .home-section,
.meridian-page main > .cta-banner,
.meridian-page > .home-footer { display: none; }

.meridian-page *,
.meridian-page *::before,
.meridian-page *::after { box-sizing: border-box; }
.meridian-page img { display: block; max-width: 100%; }
.meridian-page a { color: inherit; text-underline-offset: 3px; }
.meridian-page :focus-visible { outline: 2px solid var(--color-accent); outline-offset: 3px; border-radius: 0; }

.meridian-page .trips-shared-nav {
  position: sticky;
  top: 0;
  z-index: 80;
  color: var(--color-text);
  background: var(--sheet);
  backdrop-filter: var(--sheet-blur);
  border-bottom: var(--rule) solid var(--rule-color);
  font-family: var(--font-body);
}
.meridian-page .trips-shared-nav__inner {
  width: min(1440px, 100%);
  min-height: 68px;
  padding-inline: 48px;
  gap: 44px;
}
.meridian-page .trips-shared-nav__brand {
  gap: 10px;
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: var(--heading-case);
}
.meridian-page .trips-shared-nav__brand svg { display: none; }
.meridian-page .trips-shared-nav__brand::before { display: none; }
.meridian-page .trips-shared-nav__brand img { width: 138px; max-height: 48px; }
.meridian-page .trips-shared-nav__menu { gap: 22px; }
.meridian-page .trips-shared-nav__links { gap: 28px; margin: 0 auto 0 0; }
.meridian-page .trips-shared-nav__links a,
.meridian-page .trips-account-menu__panel a {
  color: var(--color-text);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.meridian-page .trips-shared-nav__links a { padding: 6px 0; border-radius: 0; }
.meridian-page .trips-shared-nav__links a:hover,
.meridian-page .trips-shared-nav__links a.is-active { color: var(--color-accent-700); background: transparent; }
.meridian-page .trips-shared-nav__tools { gap: 10px; }
.meridian-page .trips-shared-nav__theme { display: none; }
.meridian-page .trips-shared-nav__signin,
.meridian-page .trips-shared-nav__start {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: var(--rule) solid var(--rule-color);
  border-radius: var(--radius-ctl);
  color: var(--color-text);
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}
.meridian-page .trips-shared-nav__start { border-color: var(--color-accent); color: var(--color-bg); background: var(--color-accent); }
.meridian-page .trips-shared-nav__start:hover { background: var(--color-accent-600); }

/* The active-trip strip is shared by registered and temporary returning
   travellers, so it cannot live only inside the signed-in dashboard skin. */
.meridian-page .m-active-trip {
  width: min(1440px, 100%);
  min-height: 42px;
  margin-inline: auto;
  padding: 8px 48px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(min(180px, 100%), 300px) auto;
  align-items: center;
  gap: 22px;
  border-bottom: var(--rule) solid var(--invert-rule);
  color: var(--invert-ink);
  background: var(--invert-bg);
  backdrop-filter: var(--sheet-blur);
}
.meridian-page .m-active-trip__identity { min-width: 0; display: flex; align-items: baseline; gap: 12px; }
.meridian-page .m-active-trip__identity > span,
.meridian-page .m-active-trip__progress > span { color: var(--invert-muted); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.meridian-page .m-active-trip__identity strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.meridian-page .m-active-trip__identity small { color: var(--invert-muted); font-size: 11px; white-space: nowrap; }
.meridian-page .m-active-trip__progress { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 9px; }
.meridian-page .m-active-trip__progress i { height: 3px; overflow: hidden; background: var(--invert-rule); }
.meridian-page .m-active-trip__progress b { height: 100%; display: block; background: var(--color-accent); }
.meridian-page .m-active-trip__actions { display: flex; align-items: center; gap: 17px; }
.meridian-page .m-active-trip__actions a { color: var(--invert-ink); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.meridian-page .m-active-trip__actions a:first-child { color: var(--color-accent-400); }

/* The homepage sits directly on the page art. It used to carry a translucent
   sheet of its own, which showed as a pale strip in the gutter around the hero
   and around every card below it — two surfaces where the design wants one.
   Apple and BBC put their own sheet back in themes.css, because on a light
   ground the sheet IS the page. */
.m-home { width: min(1440px, 100%); margin-inline: auto; }
/* One container, one edge, one shadow. The gutter matches the sections below
   (24px) so the hero no longer steps in from a different margin, and the stats
   are the hero's own last row rather than a card floating inside it. */
.m-home__hero {
  --hero-gold: #e6cb9b;
  position: relative;
  min-height: 618px;
  margin: 14px 24px 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(150, 168, 220, .24);
  border-radius: 18px;
  color: #f5f2f8;
  background: #050d1c;
  box-shadow: 0 30px 80px rgba(1, 6, 17, .5), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.m-home__hero-copy {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  width: 100%;
  max-width: 724px;
  padding: 40px 52px 38px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  background: radial-gradient(circle at 14% 10%, rgba(115, 91, 229, .16), transparent 38%);
}
.m-eyebrow { margin: 0; color: var(--color-accent-700); font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }

/* ---------------------------------------------------------------
   Shared page-hero contract
   ---------------------------------------------------------------
   Every public page authored its own hero with its own heading ramp,
   its own tracking and its own vertical rhythm, so no two page tops
   agreed with each other. The backgrounds legitimately differ — some
   heroes carry a photograph, some are a plain column, some split into
   two — but the type and spacing should not.

   These declarations are the shared part. Tracking comes from
   --heading-track so a theme that is not tightly tracked, such as the
   Apple and BBC appearances, is not forced into Modernist's -.045em.
   Page stylesheets keep their own background, layout and any deliberate
   size override for a genuinely different page. */
.guides-hero h1,
.m-routes-hero h1,
.guide-hero__copy h1,
.search-before h1,
.search-reading h1,
.account-entry__intro h1,
.meridian-page .country-hero h1,
.countries-hero__head h1,
.create-hero h1 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(42px, 6vw, 88px);
  line-height: .9;
  letter-spacing: var(--heading-track);
  text-transform: var(--heading-case);
}
/* The lede that follows the heading */
.guides-hero > p:not(.m-eyebrow),
.m-routes-hero > div > p:not(.m-eyebrow),
.guide-hero__copy > p:not(.m-eyebrow),
.countries-hero__head > div > p:not(.m-eyebrow),
.create-hero > p:not(.m-eyebrow) {
  max-width: 64ch;
  margin: 14px 0 0;
  color: var(--color-neutral-800);
  font-size: 18px;
  line-height: 1.55;
}
.m-home__hero h1,
.m-home__section h2,
.m-home__journey h2,
.m-home__final h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: var(--heading-track);
  text-transform: var(--heading-case);
}
.m-home__hero .m-eyebrow { color: #b6a3ff; font-size: 11px; font-weight: 700; letter-spacing: .2em; }
.m-home__hero h1 { max-width: 540px; font-family: "Playfair Display", Georgia, serif; font-size: clamp(44px, 4.1vw, 60px); line-height: .94; letter-spacing: -.032em; text-transform: none; text-wrap: balance; }
.m-home__hero h1 em { color: #cabdff; font-weight: 700; }
.m-home__lead { max-width: 462px; margin: 0; color: rgba(238, 240, 250, .8); font-family: var(--font-display); font-size: 15.5px; line-height: 1.5; }
.m-plan-form { display: grid; grid-template-columns: 1.45fr .88fr .7fr; border-block: var(--rule) solid var(--rule-color); }
.m-home__hero .m-plan-form.m-plan-form--destination { width: 100%; max-width: 452px; display: block; border: 0; }
.m-plan-field { min-width: 0; display: flex; flex-direction: column; gap: 3px; padding: 14px 18px; border: 0; color: var(--color-text); background: transparent; font: inherit; text-align: left; }
.m-plan-field:first-child { padding-left: 0; }
.m-plan-field + .m-plan-field { border-left: var(--rule) solid var(--rule-color); }
.m-plan-field span { color: var(--color-neutral-700); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.m-plan-field input,
.m-plan-field select { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; color: var(--color-text); background: transparent; font: inherit; font-size: 18px; appearance: none; }
.m-plan-field input::placeholder { color: var(--color-neutral-700); opacity: 1; }
.m-home__hero .m-plan-field { position: relative; display: grid; grid-template-columns: 46px 1fr; gap: 0; padding: 0; color: #f5f2f8; }
.m-home__hero .m-plan-field > span { grid-column: 1 / -1; margin-bottom: 7px; color: var(--hero-gold); font-size: 9.5px; font-weight: 700; letter-spacing: .2em; }
.m-home__hero .m-plan-field > b { min-height: 46px; display: grid; place-items: center; border: 1px solid rgba(150, 168, 220, .4); border-right: 0; border-radius: 10px 0 0 10px; color: #9aa4c2; background: rgba(13, 24, 46, .78); }
.m-home__hero .m-plan-field > b svg { width: 16px; height: 16px; }
.m-home__hero .m-plan-field input { min-height: 46px; padding: 0 16px 0 2px; border: 1px solid rgba(150, 168, 220, .4); border-left: 0; border-radius: 0 10px 10px 0; color: #fff; background: rgba(13, 24, 46, .78); font-size: 14.5px; }
.m-home__hero .m-plan-field input::placeholder { color: rgba(225, 228, 241, .5); }
.m-home__hero .m-plan-field:focus-within > b,
.m-home__hero .m-plan-field:focus-within input { border-color: rgba(167, 148, 255, .72); background: rgba(16, 28, 54, .88); }
.m-home__hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.m-btn { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 22px; border: var(--rule) solid transparent; border-radius: var(--radius-ctl); font: 700 14px/1 var(--font-body); cursor: pointer; text-decoration: none; }
.m-btn--primary { border-color: var(--color-accent); color: var(--color-bg); background: var(--color-accent); box-shadow: var(--btn-glow); }
.m-btn--primary:hover { background: var(--color-accent-600); }
.m-btn--secondary { border-color: var(--rule-color); color: var(--color-text); background: transparent; }
.m-btn--secondary:hover { background: var(--tint); }
.m-btn--text { min-height: 44px; padding-inline: 8px; color: var(--color-accent-700); background: transparent; }
.m-btn svg { width: 18px; height: 18px; }
.m-home__hero .m-btn { min-height: 44px; padding-inline: 18px; border-radius: 9px; color: #f5f2f8; font-size: 12.5px; transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease; }
.m-home__hero .m-btn--primary { border-color: rgba(167, 136, 255, .9); background: linear-gradient(135deg, #a788ff, #6d3df2); box-shadow: 0 10px 30px rgba(103, 58, 232, .42); }
.m-home__hero .m-btn--primary:hover { background: linear-gradient(135deg, #b79cff, #7a4ef5); box-shadow: 0 14px 34px rgba(103, 58, 232, .52); }
.m-home__hero .m-btn--text { padding-inline: 6px; color: rgba(245, 242, 248, .84); font-size: 11.5px; }
.m-home__hero .m-btn--text:hover { color: #fff; }
.m-home__hero .m-btn--secondary { border-color: rgba(150, 168, 220, .42); background: rgba(11, 22, 44, .55); }
.m-home__hero .m-btn--secondary:hover { border-color: rgba(230, 203, 155, .55); background: rgba(16, 29, 56, .72); }
.m-home__hero .m-btn svg { width: 15px; height: 15px; }
/* The two quiet links belong together on their own line, so the hero reads as
   one primary action, one alternative, then the ways to browse instead. */
.m-home__hero-actions .m-btn--text:first-of-type { margin-left: 2px; }
.m-home__promise { width: 100%; max-width: 470px; margin: 4px 0 0; display: flex; align-items: center; gap: 11px; color: rgba(225, 228, 241, .6); font-size: 11px; line-height: 1.45; }
.m-home__promise svg { width: 28px; height: 28px; flex: 0 0 28px; padding: 6px; border: 1px solid rgba(230, 203, 155, .4); border-radius: 50%; color: var(--hero-gold); }
.m-home__hero-media { position: absolute; z-index: 0; inset: 0; overflow: hidden; background: #10203a; }
.m-home__hero-media > img { width: 100%; height: 100%; object-fit: cover; object-position: center 44%; filter: saturate(.9) contrast(1.04) brightness(.98); }
.m-home__hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 11, 26, .97) 0%, rgba(5, 13, 30, .9) 30%, rgba(6, 15, 33, .5) 50%, rgba(6, 15, 32, .12) 72%),
    linear-gradient(0deg, rgba(3, 9, 21, .78) 0%, transparent 42%, rgba(3, 9, 21, .22) 100%);
  pointer-events: none;
}
.m-home__hero-caption { position: absolute; z-index: 2; left: 16px; bottom: 142px; max-width: calc(100% - 40px); padding: 9px 14px; border: 1px solid rgba(148, 166, 213, .5); border-radius: 7px; color: #dfe5f2; background: rgba(6, 18, 34, .66); backdrop-filter: blur(12px); font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
.m-home__hero-caption::before { content: "\2299"; margin-right: 8px; color: #f2cb57; }
.m-home__hero-caption small { display: block; margin-top: 3px; color: var(--color-neutral-700); font-size: 9px; letter-spacing: .05em; text-transform: none; }
.m-home__hero-empty { height: 100%; display: grid; place-items: center; padding: 40px; color: var(--color-neutral-700); text-align: center; }

/* The catalogue band is the hero's own footer row, not a card floating inside
   it: docking it flush removes the nested box and the strip of hero background
   that used to show underneath it. */
.m-home__stats { position: relative; z-index: 4; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 0; border-top: 1px solid rgba(150, 168, 220, .22); border-radius: 0; color: #f7f3fb; background: linear-gradient(100deg, rgba(11, 20, 41, .96), rgba(7, 18, 36, .94)); box-shadow: none; backdrop-filter: blur(18px) saturate(1.2); }
/* One champagne hairline above the band — the only gold rule on the page. */
.m-home__stats::before { content: ""; position: absolute; top: -1px; right: 0; left: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(230, 203, 155, .38) 22%, rgba(230, 203, 155, .38) 78%, transparent); pointer-events: none; }
/* min-width on the track is not enough: the flex children inside each stat
   also refuse to shrink below their own content, which is what still put
   three pixels of scroll on the tablet homepage after the track was fixed. */
.m-stat { min-width: 0; min-height: 104px; padding: 18px 26px; display: flex; align-items: center; gap: 16px; }
.m-stat > * { min-width: 0; }
.m-stat strong, .m-stat span { overflow-wrap: break-word; }
.m-stat + .m-stat { border-left: 1px solid rgba(150, 168, 220, .14); }
.m-stat i { width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; border: 1px solid rgba(153, 104, 255, .5); border-radius: 50%; color: #a98cff; background: rgba(20, 32, 62, .7); }
.m-stat i svg { width: 21px; height: 21px; }
.m-stat:first-child i { border-color: rgba(230, 203, 155, .45); color: #e6cb9b; }
.m-stat strong { display: block; overflow: hidden; font-family: Inter, Arial, sans-serif; font-size: clamp(30px, 2.9vw, 42px); font-weight: 800; font-variant-numeric: lining-nums tabular-nums; letter-spacing: -.035em; line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
.m-stat:last-child strong { font-size: clamp(23px, 2.3vw, 34px); }
.m-stat span { display: block; margin-top: 7px; color: rgba(230, 203, 155, .82); font-size: 9px; font-weight: 700; letter-spacing: .14em; line-height: 1.25; text-transform: uppercase; }

.m-home__section { padding: 44px 48px; border-bottom: var(--rule) solid var(--rule-color); }
/* A section head is a heading beside its actions. Neither side may refuse to
   shrink, and on a tablet the pair has to be allowed to stack rather than
   push the document sideways. */
.m-section-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 24px; }
.m-section-head > * { min-width: 0; }
.m-routes-head-actions { flex-wrap: wrap; min-width: 0; }
.m-home__section h2 { font-size: 38px; line-height: 1; }
.m-section-head p { max-width: 620px; margin: 8px 0 0; color: var(--color-neutral-800); font-size: 16px; }
.m-section-head a { flex: none; color: var(--color-accent-700); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }

.m-home__how-section {
  margin: 14px 24px 20px;
  padding: 26px 32px 32px;
  overflow: hidden;
  border: 1px solid rgba(137, 157, 214, .25);
  border-radius: 14px;
  color: #f4f2f8;
  background:
    radial-gradient(circle at 82% 15%, rgba(108, 82, 226, .12), transparent 32%),
    linear-gradient(135deg, #111a35, #071327 70%);
  box-shadow: 0 24px 60px rgba(2, 8, 20, .22);
}
.m-home__how-section .m-section-head { margin-bottom: 16px; }
.m-home__how-section .m-section-head > div { width: 100%; }
.m-home__how-section .m-eyebrow { display: flex; align-items: center; gap: 10px; color: #a78eff; font-size: 10px; letter-spacing: .17em; }
.m-home__how-section .m-eyebrow span { color: #efc45d; font-size: 13px; }
.m-home__how-section h2 { margin-top: 8px; font-family: "Playfair Display", Georgia, serif; font-size: clamp(42px, 4vw, 48px); font-weight: 700; line-height: .98; letter-spacing: -.025em; text-transform: none; }
.m-home__how-section .m-section-head p:last-child { max-width: none; margin-top: 6px; color: rgba(229, 231, 241, .66); font-family: var(--font-body); font-size: 14px; font-weight: 400; line-height: 1.35; white-space: nowrap; }
.m-how { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.m-how article {
  position: relative;
  min-height: 226px;
  padding: 13px 14px 15px;
  display: flex;
  align-items: center;
  flex-direction: column;
  border: 1px solid rgba(161, 170, 205, .34);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.m-how article:has(.m-how__action):hover,
.m-how article:has(.m-how__action):focus-within { transform: translateY(-4px); border-color: rgba(157,123,255,.75); background: linear-gradient(145deg, rgba(129,88,244,.1), rgba(255,255,255,.025)); box-shadow: 0 14px 32px rgba(3,7,20,.28), 0 0 22px rgba(126,88,239,.12); }
.m-how b { width: 100%; color: #9d7bff; font-family: "Playfair Display", Georgia, serif; font-size: 15px; }
.m-how i { width: 54px; height: 54px; margin-top: 3px; display: grid; place-items: center; border: 1px solid rgba(151, 111, 255, .58); border-radius: 50%; color: #c4b5ff; background: radial-gradient(circle, rgba(121,86,232,.19), rgba(17,27,54,.4)); box-shadow: inset 0 0 22px rgba(123,91,238,.1); }
.m-how i svg { width: 24px; height: 24px; }
.m-how article > span { width: 60px; margin: 10px 0 6px; display: flex; align-items: center; justify-content: center; gap: 6px; color: #efc45d; font-size: 9px; }
.m-how article > span::before,
.m-how article > span::after { content: ""; width: 25px; height: 1px; background: linear-gradient(90deg, transparent, rgba(239,196,93,.4)); }
.m-how article > span::after { transform: scaleX(-1); }
.m-how h3 { margin: 0; font-family: "Playfair Display", Georgia, serif; font-size: 22px; line-height: 1.05; text-transform: none; }
.m-how p { max-width: 160px; margin: 6px 0 0; color: rgba(226,228,238,.68); font-size: 11px; line-height: 1.3; text-align: center; }
.m-how__action,
.m-how__status { margin-top: auto; padding-top: 8px; font-size: 8.5px; font-weight: 700; letter-spacing: .1em; line-height: 1.2; text-align: center; text-transform: uppercase; }
.m-how__action { display: inline-flex; align-items: center; gap: 7px; color: #c7b9ff; text-decoration: none; }
.m-how__action span { color: #efc45d; font-size: 14px; transition: transform .18s ease; }
.m-how__action:hover span,
.m-how__action:focus-visible span { transform: translateX(4px); }
.m-how__status { color: rgba(226,228,238,.4); }

.m-country-showcase { position: relative; overflow: hidden; }
.m-country-showcase .m-section-head { align-items: center; margin-bottom: 34px; }
.m-country-showcase .m-section-head h2 { display: flex; align-items: center; gap: 14px; font-size: clamp(42px, 4vw, 58px); text-transform: none; }
.m-country-showcase .m-section-head h2::before { content: "✦"; color: var(--color-accent); font: 500 20px/1 var(--font-body); }
.m-country-showcase .m-section-head p { color: var(--color-neutral-700); font-family: var(--font-display); font-size: 18px; }
.m-country-toggle { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding: 0 24px; border: var(--rule) solid var(--color-accent); border-radius: var(--radius-ctl); color: var(--color-text); background: transparent; font: 700 13px/1 var(--font-body); cursor: pointer; }
.m-country-toggle:hover { color: var(--select-ink); background: var(--select-bg); }
.m-country-toggle [data-country-toggle-arrow] { font-size: 18px; transition: transform 180ms ease; }
.m-country-toggle[aria-expanded="true"] [data-country-toggle-arrow] { transform: translateY(-2px); }
.m-country-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.m-country-card { min-width: 0; overflow: hidden; border: var(--rule) solid var(--rule-color); border-radius: var(--radius-card); color: var(--color-text); background: var(--tint); text-decoration: none; box-shadow: var(--shadow-sm); transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease; }
.m-country-card:hover { transform: translateY(-4px); border-color: var(--color-accent); box-shadow: var(--shadow-md); }
.m-country-card__image { height: 245px; overflow: hidden; background: var(--color-neutral-300); }
.m-country-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 420ms ease, filter 320ms ease; }
.m-country-card:hover .m-country-card__image img { transform: scale(1.045); filter: saturate(1.08); }
.m-country-card__empty { height: 100%; display: grid; place-items: center; color: var(--color-neutral-700); font-size: 12px; text-transform: uppercase; }
.m-country-card__copy { min-height: 112px; margin: 0; padding: 20px 18px; border-top: var(--rule) solid var(--rule-color); }
.m-country-card h3 { display: flex; align-items: flex-start; gap: 9px; margin: 0; font-family: var(--font-display); font-size: 24px; line-height: 1.02; text-transform: none; }
.m-country-card h3 svg { width: 18px; height: 18px; flex: none; margin-top: 3px; color: var(--color-accent); }
.m-country-card p { margin: 10px 0 0 27px; color: var(--color-neutral-700); font-size: 13px; }
.m-country-index { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 38px; padding-top: 20px; border-top: var(--rule) solid var(--rule-soft); }
.m-country-index[hidden] { display: none; }
.m-country-index__head { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; margin-bottom: 2px; color: var(--color-accent); }
.m-country-index__head svg { width: 22px; height: 22px; }
.m-country-index__head strong { color: var(--color-text); font: 700 22px/1 var(--font-display); }
.m-country-index > a { min-width: 0; min-height: 56px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 14px; border: var(--rule) solid var(--rule-color); border-radius: var(--radius-ctl); color: var(--color-text); background: var(--tint); text-decoration: none; transition: border-color 180ms ease, background 180ms ease; }
.m-country-index > a:hover { border-color: var(--color-accent); background: color-mix(in srgb, var(--color-accent) 10%, var(--tint)); }
.m-country-index__mark { width: 32px; height: 32px; display: grid; place-items: center; border: var(--rule) solid var(--rule-soft); border-radius: 50%; color: var(--color-accent); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.m-country-index > a strong { overflow: hidden; font: 600 15px/1.15 var(--font-display); text-overflow: ellipsis; white-space: nowrap; }
.m-country-index > a > span:last-child { color: var(--color-neutral-700); font-size: 13px; }
[data-theme='nightglass'] .m-country-showcase { background: radial-gradient(700px 380px at 42% 48%, rgba(47, 99, 173, .13), transparent 70%), #071426; }
[data-theme='nightglass'] .m-country-toggle { border-color: var(--color-accent-2-500); color: var(--color-accent-2-800); }
[data-theme='nightglass'] .m-country-toggle:hover { color: #071426; background: var(--color-accent-2-500); }
[data-theme='nightglass'] .m-country-showcase .m-section-head h2::before,
[data-theme='nightglass'] .m-country-card h3 svg,
[data-theme='nightglass'] .m-country-index__head,
[data-theme='nightglass'] .m-country-index__mark { color: var(--color-accent-2-400); }
[data-theme='nightglass'] .m-country-card { background: #0d1a2e; }
[data-theme='nightglass'] .m-country-card__copy { background: linear-gradient(180deg, #10213a, #0b1729); }
.m-empty-state { padding: 36px; border-block: var(--rule) solid var(--rule-color); color: var(--color-neutral-700); text-align: center; }

.m-home__routes-section {
  padding: 30px 48px 38px;
  color: #f7f3fb;
  background:
    radial-gradient(circle at 88% 18%, rgba(47, 70, 130, .18), transparent 30%),
    linear-gradient(135deg, #07142a, #031022 74%);
  border-bottom: 0;
}
.m-home__routes-section .m-section-head { align-items: center; margin-bottom: 18px; }
.m-home__routes-section .m-section-head h2 { display: flex; align-items: center; gap: 14px; font-family: "Playfair Display", Georgia, serif; font-size: clamp(34px, 3.4vw, 44px); letter-spacing: -.025em; text-transform: none; }
.m-home__routes-section .m-section-head h2::before { content: "\2726"; color: #efc45d; font: 500 17px/1 var(--font-body); }
.m-home__routes-section .m-section-head p { margin-left: 31px; color: rgba(229, 231, 241, .65); font-size: 14px; }
.m-routes-head-actions { display: flex; align-items: center; gap: 9px; }
.m-home__routes-section .m-routes-next,
.m-home__routes-section .m-routes-browse { min-height: 42px; padding: 0 20px; display: inline-flex; align-items: center; gap: 16px; border: 1px solid rgba(228, 164, 73, .72); border-radius: 7px; color: #efc47a; font-size: 12px; font-weight: 600; letter-spacing: 0; text-decoration: none; text-transform: none; transition: color .18s ease, background .18s ease, transform .18s ease; }
.m-home__routes-section .m-routes-next { border-color: rgba(151, 111, 255, .72); color: #c7b9ff; background: rgba(114, 75, 220, .08); font-family: var(--font-body); cursor: pointer; }
.m-home__routes-section .m-routes-next:hover { transform: translateY(-2px); color: #fff; background: #7044d8; }
.m-home__routes-section .m-routes-browse:hover { transform: translateY(-2px); color: #07142a; background: #efc47a; }
.m-home__routes-section .m-routes-next span,
.m-home__routes-section .m-routes-browse span { font-size: 18px; }

.m-route-card { display: grid; grid-template-columns: .88fr 1.32fr .94fr; min-height: 390px; gap: 12px; }
.m-route-card__photo,
.m-route-card__map-panel,
.m-route-card__body { min-width: 0; overflow: hidden; border: 1px solid rgba(153, 160, 190, .42); border-radius: 11px; background: rgba(8, 21, 43, .72); }
.m-route-card__photo { position: relative; min-height: 390px; }
.m-route-card__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3,10,23,.08), transparent 58%, rgba(3,10,23,.28)); pointer-events: none; }
.m-route-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.m-route-card__photo > span { position: absolute; z-index: 2; top: 12px; left: 12px; min-height: 30px; padding: 0 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; color: #eef0f8; background: rgba(10,24,46,.82); backdrop-filter: blur(10px); font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.m-route-card__photo > span svg { width: 14px; height: 14px; color: #efc45d; }
.m-route-card__map-panel { min-height: 390px; display: flex; flex-direction: column; }
.m-route-card__map-head { min-height: 44px; padding: 0 10px 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(153, 160, 190, .3); }
.m-route-card__map-head strong { min-width: 0; display: flex; align-items: center; gap: 9px; overflow: hidden; font-family: "Playfair Display", Georgia, serif; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.m-route-card__map-head strong svg { width: 20px; height: 20px; flex: none; color: #efc45d; }
.m-route-card__map-head > div { display: flex; flex: none; }
.m-route-card__map-head button { width: 30px; height: 27px; display: grid; place-items: center; border: 1px solid rgba(153, 160, 190, .28); border-right: 0; color: #dfe3ef; background: rgba(3,12,28,.72); font: 600 14px/1 var(--font-body); cursor: pointer; }
.m-route-card__map-head button:first-child { border-radius: 5px 0 0 5px; }
.m-route-card__map-head button:last-child { border-right: 1px solid rgba(153, 160, 190, .28); border-radius: 0 5px 5px 0; }
.m-route-card__map-head button:hover { color: #07142a; background: #efc45d; }
.m-route-card__map { position: relative; min-height: 0; flex: 1; overflow: hidden; background: #07162b; }
.m-route-card__map small { position: absolute; right: 8px; bottom: 6px; padding: 2px 5px; color: rgba(229,231,241,.6); background: rgba(3,12,28,.82); font-size: 8px; }
.m-route-card__map--interactive { isolation: isolate; cursor: grab; }
.m-route-card__map--interactive:active { cursor: grabbing; }
.m-route-card__map--interactive .leaflet-tile-pane { filter: invert(.94) hue-rotate(185deg) grayscale(.55) brightness(.66) contrast(1.08) saturate(.75); }
.m-route-card__map--interactive .leaflet-control-zoom { display: none; }
.m-route-card__map--interactive .leaflet-control-attribution { color: rgba(229,231,241,.62); background: rgba(3,12,28,.8); font-size: 8px; }
.m-route-card__map--interactive .leaflet-control-attribution a { color: #c7b9ff; }
.m-route-number-icon { border: 0; background: transparent; }
.m-route-number-icon span { width: 27px; height: 27px; display: grid; place-items: center; border: 2px solid #f7f3fb; border-radius: 50%; color: #fff; background: var(--route-pin, #7953e7); box-shadow: 0 3px 12px rgba(1,7,18,.62); font: 800 10px/1 var(--font-body); }
.m-route-popup { width: 220px; color: #172039; font-family: var(--font-body); }
.m-route-popup img { width: 100%; height: 100px; margin-bottom: 9px; border-radius: 5px; object-fit: cover; }
.m-route-popup strong { display: block; color: #10182c; font-family: "Playfair Display", Georgia, serif; font-size: 16px; line-height: 1.1; }
.m-route-popup small { display: block; margin-top: 3px; color: #7151c9; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.m-route-popup p { margin: 7px 0 0; color: #4c5363; font-size: 10px; line-height: 1.4; }
.m-route-popup a { display: inline-block; margin-top: 8px; color: #6542c3; font-size: 10px; font-weight: 800; }
.m-route-card__map-panel.is-expanded { position: fixed; z-index: 120; inset: 18px; min-height: 0; height: auto; border-color: rgba(151,111,255,.8); box-shadow: 0 28px 90px rgba(0,0,0,.72); }
.m-route-card__map-panel.is-expanded .m-route-card__map-head { min-height: 54px; background: #07142a; }
body.route-map-expanded { overflow: hidden; }
.m-route-card__body { min-height: 390px; padding: 18px 20px 12px; display: flex; flex-direction: column; gap: 10px; }
.m-route-card__body .m-eyebrow { color: #e8aa76; font-size: 9px; letter-spacing: .17em; }
.m-route-card__body h3 { margin: 0; font-family: "Playfair Display", Georgia, serif; font-size: clamp(24px, 2.3vw, 30px); line-height: 1.03; letter-spacing: -.015em; text-transform: none; }
.m-route-card__meta { margin: 0; color: rgba(238,239,246,.82); font-size: 11px; }
.m-route-card__description { margin: 0; color: rgba(226,228,238,.72); font-size: 11px; line-height: 1.45; }
.m-route-card__bases { margin: 0; padding-top: 10px; border-top: 1px solid rgba(153, 160, 190, .22); color: rgba(238,239,246,.78); font-size: 10px; }
.m-route-card__actions { display: grid; gap: 7px; margin-top: auto; }
.m-route-card__actions .m-btn { width: 100%; min-height: 38px; font-size: 11px; }
.m-route-card__actions .m-btn--primary { border-color: #8a60f1; color: #fff; background: linear-gradient(90deg, #8657ec, #6e40d8); }
.m-route-card__actions .m-btn--secondary { gap: 8px; border-color: rgba(228, 164, 73, .58); color: #efc47a; background: transparent; }
.m-route-card__actions .m-btn--secondary svg { width: 15px; height: 15px; }
.m-route-card__actions .m-btn--text { min-height: 22px; justify-content: center; padding: 0; color: #a88bff; }
.m-route-card__actions .m-btn--text span { font-size: 15px; }
.m-route-carousel__status { display: block; margin-top: 1px; color: rgba(226,228,238,.46); font-size: 8px; letter-spacing: .08em; text-align: center; text-transform: uppercase; }

.m-route-more { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 14px; padding-top: 13px; border-top: 1px solid rgba(228, 164, 73, .34); }
.m-route-more::before { content: "\2726"; position: absolute; top: -8px; left: 0; padding-right: 8px; color: #efc45d; background: #07142a; font-size: 12px; }
.m-route-mini { min-width: 0; overflow: hidden; border: 1px solid rgba(153, 160, 190, .38); border-radius: 9px; background: rgba(8, 21, 43, .72); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.m-route-mini:hover { transform: translateY(-3px); border-color: rgba(228, 164, 73, .58); box-shadow: 0 14px 30px rgba(1,7,18,.28); }
.m-route-mini__map { position: relative; width: 100%; height: 126px; display: block; padding: 0; overflow: hidden; border: 0; border-bottom: 1px solid rgba(153, 160, 190, .28); color: inherit; background: #07162b; cursor: pointer; }
.m-route-mini__map img { width: 100%; height: 100%; object-fit: cover; filter: invert(.94) hue-rotate(185deg) grayscale(.55) brightness(.72) contrast(1.06) saturate(.8); transition: transform 240ms ease; }
.m-route-mini__map:hover img { transform: scale(1.035); }
.m-route-mini__heart { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: #e5e8f2; background: rgba(5,16,34,.78); backdrop-filter: blur(8px); }
.m-route-mini__heart svg { width: 15px; height: 15px; }
.m-route-mini__body { position: relative; min-height: 72px; padding: 11px 42px 11px 14px; }
.m-route-mini__body h3 { margin: 0 0 7px; font: 700 17px/1.1 "Playfair Display", Georgia, serif; letter-spacing: 0; text-transform: none; }
.m-route-mini__body h3 a { color: #f4f2f8; text-decoration: none; }
.m-route-mini__body > p { margin: 0; display: flex; align-items: center; gap: 6px; color: rgba(226,228,238,.62); font-size: 9px; }
.m-route-mini__body > p svg { width: 13px; height: 13px; color: #efc45d; }
.m-route-mini__body > p span { color: rgba(228, 164, 73, .5); }
.m-route-mini__arrow { position: absolute; right: 14px; bottom: 17px; color: #efc45d; font-size: 21px; line-height: 1; text-decoration: none; transition: transform .18s ease; }
.m-route-mini__arrow:hover { transform: translateX(4px); }

.m-collab { display: grid; grid-template-columns: .9fr 1.1fr; }
.m-collab__copy { padding: 46px 48px; }
.m-collab__copy h2 { max-width: 520px; margin: 12px 0 18px; font-family: var(--font-display); font-size: 48px; line-height: .95; letter-spacing: var(--heading-track); text-transform: var(--heading-case); }
.m-collab__copy > p:not(.m-eyebrow) { max-width: 540px; margin: 0 0 20px; font-size: 17px; }
.m-collab__board { padding: 34px 48px 34px 10px; display: grid; align-content: center; }
.m-vote-row { display: grid; grid-template-columns: 70px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 0; border-bottom: var(--rule) solid var(--rule-soft); }
.m-vote-row:first-child { border-top: var(--rule) solid var(--rule-color); }
.m-vote-row img { width: 70px; height: 54px; object-fit: cover; }
.m-vote-row strong { display: block; font-size: 15px; }
.m-vote-row small { color: var(--color-neutral-700); }
.m-vote-status { min-width: 116px; padding: 8px 10px; border: var(--rule) solid var(--rule-color); font-size: 11px; font-weight: 700; text-align: center; text-transform: uppercase; }
.m-vote-status--agreed { border-color: var(--role-ok); color: var(--role-ok); }
.m-vote-options { display: inline-flex; border: var(--rule) solid var(--rule-color); }
.m-vote-options button { min-height: 36px; padding: 0 10px; border: 0; border-right: var(--rule) solid var(--rule-color); color: var(--color-text); background: transparent; font: 700 10px/1 var(--font-body); cursor: pointer; text-transform: uppercase; }
.m-vote-options button:last-child { border-right: 0; }
.m-vote-options button:hover { background: var(--tint); }
.m-vote-options button.is-selected { color: var(--select-ink); background: var(--select-bg); }

.m-home__journey { display: grid; grid-template-columns: minmax(0, 1fr) 52%; color: var(--invert-ink); background: var(--invert-bg); }
.m-home__journey-copy { padding: 48px; }
.m-home__journey .m-eyebrow { color: var(--color-accent-400); }
.m-home__journey h2 { max-width: 560px; margin: 12px 0 18px; font-size: 52px; line-height: .94; }
.m-home__journey p:not(.m-eyebrow) { max-width: 510px; margin: 0; color: var(--invert-muted); font-size: 17px; }
.m-journey-next { margin-top: 30px; padding-top: 16px; border-top: var(--rule) solid var(--invert-rule); display: flex; justify-content: space-between; gap: 20px; }
.m-journey-next span { color: var(--invert-muted); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.m-journey-next strong { display: block; margin-top: 5px; color: var(--invert-ink); font-size: 20px; letter-spacing: 0; text-transform: none; }
.m-home__journey-map { min-height: 390px; padding: 24px; }
.m-home__journey-map img { width: 100%; height: 100%; object-fit: cover; border: var(--rule) solid var(--invert-rule); filter: grayscale(1) invert(1) contrast(.92) brightness(.92); }

/* Shared voting and journey preview: the map is drawn from the published route
   data, so its stops stay aligned with the ready-made-trip card above. */
/* Doubled class on purpose. These two are meant to be hidden at every width,
   but at a single class they lose to `.m-collab { display: block }` and
   `.m-home__journey { display: flex }` in the <=720px block below, which come
   later at equal specificity — so both reappeared on mobile as a duplicate
   "Decide together" and "Journey mode" section. */
.m-collab.m-collab--legacy, .m-home__journey.m-home__journey--legacy { display: none; }
.legacy-home { display: none !important; }
.m-collab--journey { margin: 0 24px 24px; padding: 32px 44px 28px; display: grid; grid-template-columns: minmax(min(280px, 100%), .82fr) minmax(min(500px, 100%), 1.18fr); gap: 36px; border: 1px solid rgba(133, 151, 211, .25); border-radius: 15px; color: #f5f3fa; background: radial-gradient(circle at 77% 5%, rgba(73,77,159,.18), transparent 34%), linear-gradient(135deg, #101a38, #071225 72%); box-shadow: 0 20px 52px rgba(1, 7, 21, .22); }
.m-collab--journey .m-collab__copy { padding: 10px 0; }
.m-collab--journey .m-eyebrow { color: #ae8cff; }
.m-collab--journey h2 { max-width: 460px; margin: 10px 0 15px; color: #f7f5fa; font: 700 43px/.99 "Playfair Display", Georgia, serif; letter-spacing: -.035em; text-transform: none; }
.m-collab--journey h2 em { color: #c4adff; font-weight: 600; }
.m-collab--journey .m-collab__copy > div > p:not(.m-eyebrow) { max-width: 390px; margin: 0; color: rgba(224, 226, 239, .72); font-size: 15px; line-height: 1.55; }
.m-collab--journey .m-btn { width: auto; min-height: 43px; margin-top: 16px; padding-inline: 17px; border-color: rgba(174,140,255,.7); color: #d5c7ff; background: rgba(9, 18, 43, .35); }
.m-collab--journey .m-btn:hover { border-color: #c7aefe; color: #fff; background: rgba(102, 74, 187, .28); }
.m-collab--journey .m-btn svg { width: 17px; height: 17px; }
.m-journey-copy { margin-top: 22px; padding-top: 28px; border-top: 1px solid rgba(182, 195, 234, .14); }
.m-journey-copy h2 { max-width: 420px; font-size: 40px; }
.m-journey-next { margin-top: 16px; padding: 16px 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; border: 1px solid rgba(138, 152, 206, .26); border-radius: 9px; background: rgba(12, 22, 47, .6); }
.m-journey-next span { position: relative; min-height: 46px; padding-left: 49px; color: #d6d4e5; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.m-journey-next span + span { border-left: 1px solid rgba(162, 174, 216, .15); padding-left: 58px; }
.m-journey-next svg { position: absolute; left: 0; top: 4px; width: 35px; height: 35px; padding: 8px; border: 1px solid rgba(169, 133, 255, .56); border-radius: 50%; color: #b99cff; }
.m-journey-next span + span svg { left: 14px; }
.m-journey-next i { display: block; color: #ab91fa; font-style: normal; }
.m-journey-next strong { display: block; margin-top: 5px; color: #f7f4fb; font-size: 14px; letter-spacing: 0; text-transform: none; }
.m-collab--journey .m-collab__content { min-width: 0; display: grid; gap: 21px; }
.m-collab--journey .m-collab__board { padding: 0; display: block; overflow: hidden; border: 1px solid rgba(139, 153, 205, .28); border-radius: 11px; background: rgba(12, 22, 48, .71); }
.m-collab--journey .m-vote-row { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 22px; min-height: 86px; padding: 10px 18px; border: 0; border-bottom: 1px solid rgba(158, 171, 212, .13); }
.m-collab--journey .m-vote-row:first-child { border-top: 0; }
.m-collab--journey .m-vote-row:last-child { border-bottom: 0; }
.m-collab--journey .m-vote-row img { width: 96px; height: 64px; border: 1px solid rgba(255,255,255,.12); border-radius: 7px; object-fit: cover; }
.m-collab--journey .m-vote-row strong { color: #f3f1f8; font: 600 17px/1.2 "Playfair Display", Georgia, serif; }
.m-collab--journey .m-vote-row small { display: block; margin-top: 6px; color: rgba(218, 220, 235, .61); font-size: 12px; }
.m-collab--journey .m-vote-options { overflow: hidden; border-color: rgba(154, 167, 212, .38); border-radius: 6px; }
.m-collab--journey .m-vote-options button { min-width: 55px; min-height: 36px; color: #e0dfeb; border-color: rgba(154, 167, 212, .3); font-size: 10px; }
.m-collab--journey .m-vote-options button:hover { background: rgba(129, 90, 229, .2); }
.m-collab--journey .m-vote-options button.is-selected { color: #fff; background: linear-gradient(135deg, rgba(119, 83, 217, .77), rgba(69, 45, 146, .84)); box-shadow: inset 0 0 0 1px rgba(205, 185, 255, .24); }
.m-journey-map-panel { min-width: 0; overflow: hidden; border: 1px solid rgba(139, 153, 205, .28); border-radius: 11px; background: rgba(10, 21, 46, .76); }
.m-journey-map-panel__head { min-height: 60px; padding: 11px 19px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.m-journey-map-panel__head h3 { margin: 0; color: #f3f1f8; font: 600 18px/1.15 "Playfair Display", Georgia, serif; }
.m-journey-map-panel__head p { margin: 5px 0 0; color: rgba(218, 220, 235, .6); font-size: 11px; }
.m-journey-map-panel__head > span { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid rgba(182, 192, 227, .28); border-radius: 50%; color: #d1c4ff; }
.m-journey-map-panel__head svg { width: 15px; height: 15px; }
.m-journey-map { height: 278px; border-top: 1px solid rgba(158, 171, 212, .12); background: #0a172d; }
.m-journey-map .leaflet-tile-pane { filter: invert(.94) hue-rotate(185deg) grayscale(.55) brightness(.60) contrast(1.12) saturate(.72); }
.m-journey-map-panel__legend { min-height: 40px; padding: 0 20px; display: flex; align-items: center; gap: 26px; border-top: 1px solid rgba(158, 171, 212, .12); color: rgba(222, 224, 237, .68); font-size: 10px; }
.m-journey-map-panel__legend span { display: inline-flex; align-items: center; gap: 7px; }
.m-journey-map-panel__legend i { width: 24px; height: 2px; background: #a781ff; }
.m-journey-map-panel__legend b { width: 12px; height: 12px; border: 2px solid #b795ff; border-radius: 50%; }

.m-home__final { padding: 54px 48px; display: flex; align-items: center; justify-content: space-between; gap: 30px; color: var(--color-bg); background: var(--color-accent); }
.m-home__final h2 { max-width: 790px; font-size: 56px; line-height: .92; }
.m-home__final .m-btn { flex: none; color: var(--color-text); background: var(--color-bg); border-color: var(--color-bg); }
.m-home__final small { display: block; margin-top: 12px; font-size: 12px; }


/* Closing conversion area and footer use one continuous dark surface. */
.m-home__final--legacy { display: none; }
.m-home__closing-cta { position: relative; isolation: isolate; min-height: 242px; margin: 0 24px; padding: 38px 60px; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 36px; border: 1px solid rgba(141, 112, 255, .72); border-bottom: 0; border-radius: 25px 25px 0 0; color: #f9f7ff; background-color: #101a50; background-image: linear-gradient(90deg, rgba(5, 15, 55, .96) 0%, rgba(16, 22, 92, .74) 43%, rgba(89, 46, 182, .35) 100%), linear-gradient(0deg, rgba(5, 12, 46, .62), transparent 74%), var(--closing-image, none); background-position: center; background-size: cover; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.m-home__closing-cta::after { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle at 76% 25%, rgba(179, 133, 255, .5), transparent 23%), radial-gradient(circle at 58% 78%, rgba(111, 66, 235, .3), transparent 38%); pointer-events: none; }
.m-home__final-copy { max-width: 620px; }
.m-home__closing-cta h2 { max-width: 620px; margin: 0; color: #fff; font: 600 clamp(41px, 4.6vw, 64px)/.94 "Playfair Display", Georgia, serif; letter-spacing: -.035em; text-transform: none; }
.m-home__closing-cta p { max-width: 580px; margin: 14px 0 0; color: rgba(244, 240, 255, .82); font-size: 17px; line-height: 1.38; }
.m-home__final-actions { width: min(292px, 100%); display: grid; gap: 12px; flex: none; }
.m-home__closing-cta .m-btn { min-height: 57px; width: 100%; justify-content: space-between; padding-inline: 28px; border-radius: 8px; font-size: 15px; }
.m-home__closing-cta .m-btn--primary { color: #15185b; border-color: #f7f5ff; background: #f7f5ff; box-shadow: 0 9px 24px rgba(9, 8, 44, .25); }
.m-home__closing-cta .m-btn--primary:hover { color: #fff; border-color: #8d63f7; background: #7652df; }
.m-home__closing-cta .m-btn--secondary { color: #f7f5ff; border-color: rgba(235, 225, 255, .68); background: rgba(20, 17, 72, .24); }
.m-home__closing-cta .m-btn--secondary:hover { border-color: #fff; color: #fff; background: rgba(117, 79, 220, .35); }
.m-home__closing-pin { position: absolute; z-index: -1; color: rgba(151, 109, 255, .86); filter: drop-shadow(0 5px 8px rgba(16, 7, 59, .5)); }
.m-home__closing-pin svg { width: 28px; height: 28px; }
.m-home__closing-pin--one { left: 51%; top: 28%; }.m-home__closing-pin--two { left: 61%; top: 17%; }.m-home__closing-pin--three { left: 43%; bottom: 25%; }
/* The copy beside each footer icon has to be allowed to shrink; without this
   it set the width of the whole document on a tablet. */

.m-mobile-nav { display: none; }
.m-map-dialog { width: min(980px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; padding: 20px; color: var(--color-text); background: var(--sheet); }
.m-map-dialog h2 { margin: 0 48px 16px 0; font-family: var(--font-display); font-size: 30px; text-transform: var(--heading-case); }
.m-map-dialog img { width: 100%; max-height: 70vh; object-fit: contain; background: var(--tint); filter: var(--map-filter); }
.m-map-dialog p { margin: 12px 0 0; color: var(--color-neutral-700); font-size: 12px; }
.meridian-page .home-modal:has(.m-map-dialog) { width: min(980px, calc(100vw - 32px)); border: var(--rule) solid var(--rule-color); border-radius: var(--radius-card); color: var(--color-text); background: var(--sheet); box-shadow: var(--shadow-lg); }
.meridian-page .home-modal:has(.m-map-dialog) > .m-map-dialog { width: 100%; }
.meridian-page .home-modal:has(.m-map-dialog) .home-modal__close { border: var(--rule) solid var(--rule-color); border-radius: var(--radius-ctl); color: var(--color-text); background: var(--sheet); }

@media (max-width: 1100px) {
  .meridian-page .m-active-trip { grid-template-columns: minmax(0, 1fr) auto; padding-inline: 24px; }
  .meridian-page .m-active-trip__progress { display: none; }
  .meridian-page .trips-shared-nav__inner { min-height: 60px; padding-inline: 24px; }
  .meridian-page .trips-shared-nav__toggle { margin-left: auto; border: var(--rule) solid var(--rule-color); border-radius: var(--radius-ctl); color: var(--color-text); }
  /* The open mobile menu floats OVER the page, so it cannot use --sheet: that
     token is a translucent surface designed to sit on the page background and
     let it show through, which in Night Glass is 5.5% white — the menu was
     effectively see-through and the links were unreadable against whatever
     happened to be underneath. --color-neutral-300 is the opaque page ground in
     both skins. The blur and the shadow are belt and braces for the edges, and
     the z-index stops any later-painted section rising through it. */
  .meridian-page .trips-shared-nav__menu {
    z-index: 60;
    background: var(--color-neutral-300);
    -webkit-backdrop-filter: var(--sheet-blur, none);
    backdrop-filter: var(--sheet-blur, none);
    border-top: var(--rule) solid var(--rule-soft);
    box-shadow: var(--shadow-md, 0 18px 32px rgba(0, 0, 0, .25));
  }
  .meridian-page .trips-shared-nav__links { gap: 0; }
  .meridian-page .trips-shared-nav__tools { border-top-color: var(--rule-soft); }
  .m-home__hero { min-height: 560px; margin-inline: 16px; }
  .m-home__hero-copy { width: 66%; max-width: none; min-width: 0; padding: 36px 30px 34px; }
  .m-home__hero h1 { font-size: clamp(46px, 6.2vw, 62px); }
  .m-plan-form { grid-template-columns: 1fr 1fr; }
  /* Drops the third field of the multi-field planning form. The hero's
     destination form has exactly one field, which is also its last, so the
     unscoped rule took the hero's search away between 721px and 1080px. */
  .m-plan-form:not(.m-plan-form--destination) .m-plan-field:last-child { display: none; }
  .m-home__how-section { margin-inline: 16px; padding-inline: 28px; }
  .m-how { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .m-country-grid { grid-template-columns: repeat(3, 1fr); }
  .m-country-index { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .m-home__routes-section { padding-inline: 28px; }
  .m-route-card { grid-template-columns: .86fr 1.14fr; }
  .m-route-card__body { grid-column: 1 / -1; min-height: 280px; }
  .m-collab__copy { padding-inline: 32px; }
  .m-collab__board { padding-right: 32px; }
}

@media (max-width: 960px) {
  .m-collab--journey { margin-inline: 16px; padding: 28px; grid-template-columns: minmax(min(230px, 100%), .78fr) minmax(min(410px, 100%), 1.22fr); gap: 25px; }
  .m-collab--journey h2 { font-size: 37px; }
  .m-journey-copy h2 { font-size: 35px; }
  .m-collab--journey .m-vote-row { grid-template-columns: 72px minmax(0, 1fr); gap: 13px; }
  .m-collab--journey .m-vote-row img { width: 72px; height: 54px; }
  .m-collab--journey .m-vote-options { grid-column: 2; width: fit-content; margin-top: -6px; }
}

/* Four catalogue figures stop fitting on one line well before the phone
   breakpoint: at 768px "3,771" and "One place" were both clipped to an
   ellipsis. They pair up here instead of being truncated. */
@media (max-width: 900px) {
  .m-home__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .m-stat { border-bottom: 1px solid rgba(150, 168, 220, .14); }
  .m-stat:nth-child(3) { border-left: 0; }
  .m-stat:nth-child(n+3) { border-bottom: 0; }
}

@media (max-width: 720px) {
  body.trips-home.meridian-page { padding-bottom: 60px; }
  .meridian-page .trips-shared-nav__inner { min-height: 52px; padding-inline: 16px; }
  .meridian-page .trips-shared-nav__brand { position: absolute; left: 50%; transform: translateX(-50%); font-size: 18px; }
  .meridian-page .trips-shared-nav__brand img { width: 112px; max-height: 38px; }
  .meridian-page .trips-shared-nav__toggle { order: -1; width: 44px; height: 44px; min-width: 44px; margin-left: 0; margin-right: auto; }
  .meridian-page .trips-shared-nav__menu { padding: 12px 16px 18px; }
  .meridian-page .trips-shared-nav__start { width: 100%; }
  .meridian-page .m-active-trip { display: flex; align-items: flex-start; flex-direction: column; gap: 7px; padding: 10px 16px; }
  .meridian-page .m-active-trip__identity { width: 100%; display: grid; grid-template-columns: auto 1fr; gap: 3px 9px; }
  .meridian-page .m-active-trip__identity small { grid-column: 2; white-space: normal; }
  .m-home__hero { min-height: 0; margin: 10px 12px 0; display: flex; flex-direction: column; border-radius: 14px; }
  .m-home__hero-media { position: absolute; inset: 0; min-height: 100%; height: 100%; }
  .m-home__hero-media > img { object-position: 64% center; }
  .m-home__hero-media::after { background: linear-gradient(90deg, rgba(4,11,26,.95), rgba(4,11,26,.74)), linear-gradient(0deg, rgba(3,9,21,.9), transparent 55%); }
  .m-home__hero-caption { bottom: 12px; padding: 7px 10px; font-size: 9px; }
  .m-home__hero-caption small { display: none; }
  .m-home__hero-copy { width: 100%; max-width: none; min-width: 0; padding: 28px 18px 24px; gap: 15px; }
  .m-home__hero h1 { font-size: 38px; line-height: .96; }
  .m-home__lead { font-size: 16px; }
  .m-plan-form { display: block; }
  .m-plan-field { display: none; }
  /* The hero's destination search must survive the mobile collapse. It was
     matched as :first-child, which the form's hidden source input already
     occupies, so the field disappeared below 720px and the hero lost its
     search. Matched by the form it belongs to instead. */
  .m-home__hero .m-plan-form--destination .m-plan-field { display: grid; padding: 0; border: 0; }
  .m-home__hero .m-plan-field > b,
  .m-home__hero .m-plan-field input { min-height: 48px; }
  .m-plan-field input { font-size: 17px; }
  /* Two full-width actions, then the two quiet links sharing one line rather
     than taking a full-width row each — which kept the phone hero a screen
     taller than it needed to be. */
  .m-home__hero-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .m-home__hero-actions > .m-btn--primary,
  .m-home__hero-actions > .m-btn--secondary,
  .m-home__hero-actions > .m-home__promise { grid-column: 1 / -1; }
  .m-btn { min-height: 50px; width: 100%; }
  .m-home__hero .m-btn { min-height: 50px; }
  .m-btn--text { justify-content: flex-start; padding: 0; }
  .m-home__hero-actions .m-btn--text { min-height: 44px; width: auto; margin-left: 0; }
  .m-home__promise { margin-top: 2px; }
  .m-home__stats { grid-template-columns: 1fr 1fr; }
  .m-stat { min-height: 82px; padding: 14px 14px; gap: 11px; border-bottom: 1px solid rgba(150, 168, 220, .14); }
  .m-stat + .m-stat { border-left: 1px solid rgba(150, 168, 220, .14); }
  .m-stat:nth-child(3) { border-left: 0; }
  .m-stat:nth-child(n+3) { border-bottom: 0; }
  .m-stat i { width: 38px; height: 38px; flex-basis: 38px; }
  .m-stat i svg { width: 18px; height: 18px; }
  /* "One place" is a phrase, not a figure: at this width it has to be allowed
     to wrap rather than be clipped to "One pl…". */
  .m-stat strong { overflow: visible; font-size: 25px; white-space: normal; }
  .m-stat:last-child strong { font-size: 20px; line-height: 1.1; }
  .m-stat span { font-size: 9px; }
  .m-home__section { padding: 22px 16px; }
  .m-section-head { align-items: end; margin-bottom: 14px; }
  .m-home__section h2 { font-size: 26px; }
  .m-section-head p { font-size: 14px; }
  .m-section-head a { font-size: 10px; }
  .m-home__how-section { display: block; margin: 10px 8px 16px; padding: 22px 14px 24px; }
  .m-home__how-section .m-section-head { margin-bottom: 14px; }
  .m-home__how-section h2 { font-size: 36px; }
  .m-home__how-section .m-section-head p:last-child { font-size: 13px; white-space: normal; }
  .m-how { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .m-how article { min-height: 210px; }
  .m-country-showcase .m-section-head { display: grid; align-items: start; gap: 18px; margin-bottom: 22px; }
  .m-country-showcase .m-section-head h2 { gap: 9px; font-size: 34px; }
  .m-country-showcase .m-section-head h2::before { font-size: 15px; }
  .m-country-showcase .m-section-head p { font-size: 15px; }
  .m-country-toggle { width: 100%; min-height: 48px; justify-content: space-between; }
  .m-country-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .m-country-card__image { height: 160px; }
  .m-country-card__copy { min-height: 90px; margin: 0; padding: 14px 12px; }
  .m-country-card h3 { gap: 6px; font-size: 18px; }
  .m-country-card h3 svg { width: 15px; height: 15px; margin-top: 2px; }
  .m-country-card p { margin: 8px 0 0 21px; font-size: 11px; }
  .m-country-index { grid-template-columns: 1fr; gap: 9px; margin-top: 26px; }
  .m-country-index > a { min-height: 52px; }
  .m-home__routes-section { padding: 24px 16px 30px; }
  .m-home__routes-section .m-section-head { display: grid; align-items: start; gap: 16px; }
  .m-home__routes-section .m-section-head h2 { gap: 9px; font-size: 32px; }
  .m-home__routes-section .m-section-head p { margin-left: 24px; font-size: 13px; }
  .m-routes-head-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
  .m-home__routes-section .m-routes-next,
  .m-home__routes-section .m-routes-browse { width: 100%; min-height: 44px; justify-content: space-between; }
  .m-route-card { display: flex; flex-direction: column; min-height: 0; }
  .m-route-card__photo { min-height: 220px; height: 220px; }
  .m-route-card__map-panel { min-height: 280px; height: 280px; }
  .m-route-card__map { min-height: 0; height: auto; border: 0; }
  .m-route-card__body { min-height: 310px; padding: 18px; gap: 9px; }
  .m-route-card__body h3 { font-size: 23px; }
  .m-route-card__actions { grid-template-columns: 1fr 1fr; margin-top: 5px; }
  .m-route-card__actions .m-btn { min-width: 0; min-height: 44px; padding-inline: 6px; font-size: 11px; }
  .m-route-card__actions .m-btn--text { grid-column: 1 / -1; justify-content: center; min-height: 44px; }
  .m-route-card__map-head button { width: 44px; height: 44px; }
  .m-route-more { grid-template-columns: 1fr; gap: 12px; }
  .m-route-mini__map { height: 180px; }
  .m-route-mini__body h3 { min-height: 0; }
  .m-collab { display: block; }
  .m-collab__copy { padding: 24px 16px 10px; }
  .m-collab__copy h2 { font-size: 31px; }
  .m-collab__copy > p:not(.m-eyebrow) { font-size: 15px; }
  .m-collab__board { padding: 6px 16px 24px; }
  .m-vote-row { grid-template-columns: 52px 1fr; gap: 12px; }
  .m-vote-row img { width: 52px; height: 40px; }
  .m-vote-status { grid-column: 2; width: fit-content; min-width: 0; margin-top: -6px; padding: 3px 7px; }
  .m-vote-options { grid-column: 2; width: fit-content; }
  .m-vote-options button,
  .m-collab--journey .m-vote-options button { min-width: 44px; min-height: 44px; }
  .m-home__journey { display: flex; flex-direction: column; }
  .m-home__journey-copy { padding: 24px 16px 14px; }
  .m-home__journey h2 { font-size: 31px; }
  .m-home__journey p:not(.m-eyebrow) { font-size: 15px; }
  .m-journey-next { margin-top: 18px; }
  .m-home__journey-map { height: 190px; min-height: 0; padding: 0 16px 22px; }
  .m-collab--journey { margin: 10px 8px 16px; padding: 22px 14px; display: block; border-radius: 13px; }
  .m-collab--journey .m-collab__copy { padding: 0; }
  .m-collab--journey h2, .m-journey-copy h2 { font-size: 33px; }
  .m-collab--journey .m-collab__copy > div > p:not(.m-eyebrow) { font-size: 14px; }
  .m-collab--journey .m-btn { width: 100%; min-height: 44px; justify-content: center; }
  .m-journey-copy { margin-top: 23px; padding-top: 23px; }
  .m-journey-next { padding: 13px 11px; gap: 8px; }
  .m-journey-next span { min-height: 41px; padding-left: 40px; font-size: 9px; }
  .m-journey-next span + span { padding-left: 47px; }
  .m-journey-next svg { width: 31px; height: 31px; padding: 7px; }
  .m-journey-next span + span svg { left: 8px; }
  .m-journey-next strong { font-size: 12px; }
  .m-collab--journey .m-collab__content { margin-top: 22px; }
  .m-collab--journey .m-collab__board { padding: 0; }
  .m-collab--journey .m-vote-row { grid-template-columns: 60px minmax(0, 1fr); min-height: 0; gap: 11px; padding: 11px; }
  .m-collab--journey .m-vote-row img { width: 60px; height: 47px; }
  .m-collab--journey .m-vote-row strong { font-size: 15px; }
  .m-collab--journey .m-vote-row small { margin-top: 3px; font-size: 10px; }
  .m-collab--journey .m-vote-options { grid-column: 1 / -1; width: 100%; margin-top: 0; }
  .m-collab--journey .m-vote-options button { flex: 1; min-width: 0; }
  .m-journey-map { height: 252px; }
  .m-journey-map-panel__head { padding-inline: 14px; }
  .m-journey-map-panel__head h3 { font-size: 16px; }
  .m-journey-map-panel__legend { padding-inline: 14px; gap: 16px; }
  .m-home__final { display: block; padding: 30px 16px; }
  .m-home__final h2 { font-size: 39px; }
  .m-home__final .m-btn { margin-top: 20px; }
  .m-home__final--legacy { display: none; }
  .m-home__closing-cta { min-height: 0; margin: 0 8px; padding: 30px 17px 21px; display: block; border-radius: 17px 17px 0 0; background-position: 62% center; }
  .m-home__closing-cta h2 { font-size: 39px; }
  .m-home__closing-cta p { margin-top: 12px; font-size: 14px; }
  .m-home__final-actions { width: 100%; margin-top: 21px; }
  .m-home__closing-cta .m-btn { min-height: 50px; padding-inline: 18px; }
  .m-home__closing-pin--one { left: 72%; top: 15%; }.m-home__closing-pin--two { left: 82%; top: 34%; }.m-home__closing-pin--three { left: 61%; bottom: 40%; }
  .m-mobile-nav { position: fixed; z-index: 75; inset: auto 0 0; min-height: 60px; display: grid; grid-template-columns: repeat(5, 1fr); border-top: var(--rule) solid var(--rule-color); color: var(--color-neutral-700); background: var(--sheet); backdrop-filter: var(--sheet-blur); }
  .m-mobile-nav a { display: grid; place-items: center; color: inherit; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
  .m-mobile-nav a[aria-current="page"] { color: var(--color-text); }
}

@media (prefers-reduced-motion: reduce) {
  .m-country-card__image img,
  .m-home__routes-section .m-routes-next,
  .m-home__routes-section .m-routes-browse { transition: none; }
  .m-home__routes-section :is(.m-routes-next, .m-routes-browse):hover { transform: none; }
}
html[data-text-size="larger"] { font-size: 112.5%; }
html[data-text-size="largest"] { font-size: 125%; }
html[data-contrast="higher"] { --rule: 2px; --rule-soft: var(--rule-color); --sheet: var(--color-bg); }

/* --------------------------------------------------------------------------
   Modernist homepage
   Night Glass owns the layered navy, violet glow and rounded glass surfaces.
   Modernist is deliberately a separate editorial system: paper, ink, red and
   sharp construction lines. These rules stop a component added for one theme
   from quietly becoming the default of the other. */
[data-theme='modernist'] body.meridian-page { background: #d7d3d3; }
[data-theme='modernist'] .m-home { background: #f3f2f2; }
[data-theme='modernist'] .m-home__hero { min-height: 650px; margin: 0; border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #f3f2f2; box-shadow: none; }
[data-theme='modernist'] .m-home__hero-copy { width: 51%; min-width: 0; padding: 52px 52px 150px; background: none; }
[data-theme='modernist'] .m-home__hero h1,
[data-theme='modernist'] .m-home__how-section h2,
[data-theme='modernist'] .m-home__routes-section h2,
[data-theme='modernist'] .m-collab--journey h2,
[data-theme='modernist'] .m-home__closing-cta h2 { font-family: var(--font-display); letter-spacing: -.045em; text-transform: uppercase; }
[data-theme='modernist'] .m-home__hero .m-eyebrow,
[data-theme='modernist'] .m-home__how-section .m-eyebrow,
[data-theme='modernist'] .m-collab--journey .m-eyebrow { color: #ae1800; }
[data-theme='modernist'] .m-home__hero h1 { max-width: 590px; font-size: clamp(54px, 5.8vw, 84px); line-height: .88; }
[data-theme='modernist'] .m-home__hero h1 em { color: #ec3013; font-style: normal; }
[data-theme='modernist'] .m-home__lead { color: #444141; font-family: var(--font-body); font-size: 16px; }
[data-theme='modernist'] .m-home__hero-media > img { filter: saturate(.82) contrast(1.08); }
[data-theme='modernist'] .m-home__hero-media::after { background: linear-gradient(90deg, #f3f2f2 0%, rgba(243,242,242,.97) 39%, rgba(243,242,242,.68) 53%, rgba(32,30,29,.08) 76%), linear-gradient(0deg, rgba(243,242,242,.18), transparent 55%); }
[data-theme='modernist'] .m-home__hero .m-plan-field > span { color: #201e1d; }
[data-theme='modernist'] .m-home__hero .m-plan-field > b,
[data-theme='modernist'] .m-home__hero .m-plan-field input { border-color: #201e1d; border-radius: 0; color: #201e1d; background: #fff; }
[data-theme='modernist'] .m-home__hero .m-plan-field > b { color: #ec3013; }
[data-theme='modernist'] .m-home__hero .m-plan-field input::placeholder { color: #7d7979; }
[data-theme='modernist'] .m-home__hero .m-btn { border-radius: 0; color: #201e1d; }
[data-theme='modernist'] .m-home__hero .m-btn--primary { border-color: #ec3013; color: #fff; background: #ec3013; box-shadow: none; }
[data-theme='modernist'] .m-home__hero .m-btn--primary:hover { background: #ae1800; }
[data-theme='modernist'] .m-home__hero .m-btn--secondary { border-color: #201e1d; background: #fff; }
[data-theme='modernist'] .m-home__hero .m-btn--text { color: #201e1d; }
[data-theme='modernist'] .m-home__promise { color: #605d5d; }
[data-theme='modernist'] .m-home__promise svg { border-color: #201e1d; border-radius: 0; color: #ec3013; }
[data-theme='modernist'] .m-home__hero-caption { border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #f3f2f2; backdrop-filter: none; }
[data-theme='modernist'] .m-home__hero-caption::before { color: #ec3013; }
[data-theme='modernist'] .m-home__hero-caption small { color: #605d5d; }
[data-theme='modernist'] .m-home__stats { right: 0; bottom: 0; left: 0; border: 0; border-top: 2px solid #201e1d; border-radius: 0; color: #f3f2f2; background: #201e1d; box-shadow: none; backdrop-filter: none; }
[data-theme='modernist'] .m-stat + .m-stat { border-color: #605d5d; }
[data-theme='modernist'] .m-stat i { border-color: #f3f2f2; border-radius: 0; color: #f3f2f2; background: transparent; }
[data-theme='modernist'] .m-stat:first-child i,
[data-theme='modernist'] .m-stat span { color: #ff9783; }

[data-theme='modernist'] .m-home__how-section { margin: 0; padding: 38px 48px; border: 0; border-bottom: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #eae9e9; box-shadow: none; }
[data-theme='modernist'] .m-home__how-section .m-eyebrow span { color: #ec3013; }
[data-theme='modernist'] .m-home__how-section .m-section-head p:last-child { color: #605d5d; }
[data-theme='modernist'] .m-how { gap: 0; border: 2px solid #201e1d; }
[data-theme='modernist'] .m-how article { min-height: 214px; border: 0; border-right: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #f8f4f4; box-shadow: none; }
[data-theme='modernist'] .m-how article:last-child { border-right: 0; }
[data-theme='modernist'] .m-how article:has(.m-how__action):hover,
[data-theme='modernist'] .m-how article:has(.m-how__action):focus-within { transform: none; border-color: #201e1d; background: #fff2ef; box-shadow: inset 0 -6px 0 #ec3013; }
[data-theme='modernist'] .m-how b { color: #ec3013; font-family: var(--font-display); }
[data-theme='modernist'] .m-how i { border-color: #201e1d; border-radius: 0; color: #ec3013; background: #fff; box-shadow: none; }
[data-theme='modernist'] .m-how article > span { color: #ec3013; }
[data-theme='modernist'] .m-how article > span::before,
[data-theme='modernist'] .m-how article > span::after { background: #ec3013; }
[data-theme='modernist'] .m-how h3 { font-family: var(--font-display); text-transform: uppercase; }
[data-theme='modernist'] .m-how p { color: #605d5d; }
[data-theme='modernist'] .m-how__action { color: #ae1800; }
[data-theme='modernist'] .m-how__action span { color: #ec3013; }
[data-theme='modernist'] .m-how__status { color: #7d7979; }

[data-theme='modernist'] .m-home__routes-section { padding: 38px 48px; color: #201e1d; background: #f3f2f2; border-bottom: 2px solid #201e1d; }
[data-theme='modernist'] .m-home__routes-section .m-section-head h2 { font-family: var(--font-display); text-transform: uppercase; }
[data-theme='modernist'] .m-home__routes-section .m-section-head h2::before { color: #ec3013; }
[data-theme='modernist'] .m-home__routes-section .m-section-head p { color: #605d5d; }
[data-theme='modernist'] .m-home__routes-section .m-routes-next,
[data-theme='modernist'] .m-home__routes-section .m-routes-browse { border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #fff; }
[data-theme='modernist'] .m-home__routes-section .m-routes-next:hover { color: #fff; border-color: #ec3013; background: #ec3013; }
[data-theme='modernist'] .m-home__routes-section .m-routes-browse:hover { color: #fff; border-color: #201e1d; background: #201e1d; }
[data-theme='modernist'] .m-route-card__photo,
[data-theme='modernist'] .m-route-card__map-panel,
[data-theme='modernist'] .m-route-card__body,
[data-theme='modernist'] .m-route-mini { border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #fff; }
[data-theme='modernist'] .m-route-card__photo > span { border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #f3f2f2; backdrop-filter: none; }
[data-theme='modernist'] .m-route-card__photo > span svg,
[data-theme='modernist'] .m-route-card__map-head strong svg { color: #ec3013; }
[data-theme='modernist'] .m-route-card__map-head { border-bottom-color: #201e1d; }
[data-theme='modernist'] .m-route-card__map-head button { border-color: #201e1d; color: #201e1d; background: #fff; }
[data-theme='modernist'] .m-route-card__map-head button:first-child,
[data-theme='modernist'] .m-route-card__map-head button:last-child { border-radius: 0; }
[data-theme='modernist'] .m-route-card__map-head button:hover { color: #fff; background: #ec3013; }
[data-theme='modernist'] .m-route-card__map { background: #eae7e7; }
[data-theme='modernist'] .m-route-card__map--interactive .leaflet-tile-pane,
[data-theme='modernist'] .m-route-mini__map img { filter: grayscale(1) contrast(1.08); }
[data-theme='modernist'] .m-route-card__map--interactive .leaflet-control-attribution { color: #201e1d; background: rgba(243,242,242,.88); }
[data-theme='modernist'] .m-route-card__map--interactive .leaflet-control-attribution a { color: #ae1800; }
[data-theme='modernist'] .m-route-number-icon span { border-color: #201e1d; border-radius: 0; background: #ec3013 !important; box-shadow: none; }
[data-theme='modernist'] .m-route-card__body .m-eyebrow { color: #ae1800; }
[data-theme='modernist'] .m-route-card__body h3,
[data-theme='modernist'] .m-route-mini__body h3 { font-family: var(--font-display); text-transform: uppercase; }
[data-theme='modernist'] .m-route-card__meta,
[data-theme='modernist'] .m-route-card__description,
[data-theme='modernist'] .m-route-card__bases,
[data-theme='modernist'] .m-route-mini__body > p { color: #605d5d; }
[data-theme='modernist'] .m-route-card__bases { border-top-color: #201e1d; }
[data-theme='modernist'] .m-route-card__actions .m-btn--primary { border-color: #ec3013; background: #ec3013; }
[data-theme='modernist'] .m-route-card__actions .m-btn--secondary { border-color: #201e1d; color: #201e1d; }
[data-theme='modernist'] .m-route-card__actions .m-btn--text { color: #ae1800; }
[data-theme='modernist'] .m-route-carousel__status { color: #7d7979; }
[data-theme='modernist'] .m-route-more { border-top-color: #201e1d; }
[data-theme='modernist'] .m-route-more::before { color: #ec3013; background: #f3f2f2; }
[data-theme='modernist'] .m-route-mini:hover { border-color: #ec3013; box-shadow: 0 6px 0 #ec3013; }
[data-theme='modernist'] .m-route-mini__map { border-bottom-color: #201e1d; background: #eae7e7; }
[data-theme='modernist'] .m-route-mini__heart { border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #f3f2f2; backdrop-filter: none; }
[data-theme='modernist'] .m-route-mini__body h3 a { color: #201e1d; }
[data-theme='modernist'] .m-route-mini__body > p svg,
[data-theme='modernist'] .m-route-mini__arrow { color: #ec3013; }

[data-theme='modernist'] .m-collab--journey { margin: 0; padding: 38px 48px; border: 0; border-bottom: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #eae9e9; box-shadow: none; }
[data-theme='modernist'] .m-collab--journey h2 { color: #201e1d; }
[data-theme='modernist'] .m-collab--journey h2 em { color: #ec3013; font-style: normal; }
[data-theme='modernist'] .m-collab--journey .m-collab__copy > div > p:not(.m-eyebrow) { color: #605d5d; }
[data-theme='modernist'] .m-collab--journey .m-btn { border: 2px solid #201e1d; border-radius: 0; color: #201e1d; background: #fff; }
[data-theme='modernist'] .m-collab--journey .m-btn:hover { border-color: #ec3013; color: #fff; background: #ec3013; }
[data-theme='modernist'] .m-journey-copy { border-top-color: #201e1d; }
[data-theme='modernist'] .m-journey-next { border: 2px solid #201e1d; border-radius: 0; background: #fff; }
[data-theme='modernist'] .m-journey-next span { color: #605d5d; }
[data-theme='modernist'] .m-journey-next span + span { border-left-color: #201e1d; }
[data-theme='modernist'] .m-journey-next svg { border-color: #201e1d; border-radius: 0; color: #ec3013; }
[data-theme='modernist'] .m-journey-next i { color: #ae1800; }
[data-theme='modernist'] .m-journey-next strong { color: #201e1d; }
[data-theme='modernist'] .m-collab--journey .m-collab__board,
[data-theme='modernist'] .m-journey-map-panel { border: 2px solid #201e1d; border-radius: 0; background: #fff; }
[data-theme='modernist'] .m-collab--journey .m-vote-row { border-bottom-color: #201e1d; }
[data-theme='modernist'] .m-collab--journey .m-vote-row img { border-color: #201e1d; border-radius: 0; }
[data-theme='modernist'] .m-collab--journey .m-vote-row strong { color: #201e1d; font-family: var(--font-display); text-transform: uppercase; }
[data-theme='modernist'] .m-collab--journey .m-vote-row small { color: #605d5d; }
[data-theme='modernist'] .m-collab--journey .m-vote-options { border-color: #201e1d; border-radius: 0; }
[data-theme='modernist'] .m-collab--journey .m-vote-options button { color: #201e1d; border-color: #201e1d; }
[data-theme='modernist'] .m-collab--journey .m-vote-options button:hover,
[data-theme='modernist'] .m-collab--journey .m-vote-options button.is-selected { color: #fff; background: #ec3013; box-shadow: none; }
[data-theme='modernist'] .m-journey-map-panel__head { border-bottom: 0; }
[data-theme='modernist'] .m-journey-map-panel__head h3 { color: #201e1d; font-family: var(--font-display); text-transform: uppercase; }
[data-theme='modernist'] .m-journey-map-panel__head p { color: #605d5d; }
[data-theme='modernist'] .m-journey-map-panel__head > span { border-color: #201e1d; border-radius: 0; color: #ec3013; }
[data-theme='modernist'] .m-journey-map { border-top-color: #201e1d; background: #eae7e7; }
[data-theme='modernist'] .m-journey-map .leaflet-tile-pane { filter: grayscale(1) contrast(1.08); }
[data-theme='modernist'] .m-journey-map-panel__legend { border-top-color: #201e1d; color: #605d5d; }
[data-theme='modernist'] .m-journey-map-panel__legend i { background: #ec3013; }
[data-theme='modernist'] .m-journey-map-panel__legend b { border-color: #ec3013; border-radius: 0; }

[data-theme='modernist'] .m-home__closing-cta { margin: 0; border: 0; border-top: 2px solid #201e1d; border-radius: 0; color: #fff; background-color: #ec3013; background-image: linear-gradient(90deg, rgba(32,30,29,.95) 0%, rgba(32,30,29,.72) 48%, rgba(236,48,19,.58) 100%), var(--closing-image, none); box-shadow: none; }
[data-theme='modernist'] .m-home__closing-cta::after { background: linear-gradient(135deg, rgba(236,48,19,.45), transparent 58%); }
[data-theme='modernist'] .m-home__closing-cta h2 { color: #fff; }
[data-theme='modernist'] .m-home__closing-cta p { color: rgba(255,255,255,.86); }
[data-theme='modernist'] .m-home__closing-cta .m-btn { border: 2px solid #fff; border-radius: 0; }
[data-theme='modernist'] .m-home__closing-cta .m-btn--primary { color: #201e1d; background: #fff; box-shadow: none; }
[data-theme='modernist'] .m-home__closing-cta .m-btn--primary:hover { color: #fff; border-color: #201e1d; background: #201e1d; }
[data-theme='modernist'] .m-home__closing-cta .m-btn--secondary { color: #fff; background: transparent; }
[data-theme='modernist'] .m-home__closing-cta .m-btn--secondary:hover { color: #201e1d; border-color: #fff; background: #fff; }
[data-theme='modernist'] .m-home__closing-pin { color: #ff9783; }

@media (max-width: 720px) {
  [data-theme='modernist'] .m-home__hero { margin: 0; border-width: 0 0 2px; border-radius: 0; }
  [data-theme='modernist'] .m-home__hero-copy { width: 100%; padding: 28px 16px 20px; }
  [data-theme='modernist'] .m-home__hero-media::after { background: linear-gradient(90deg, rgba(243,242,242,.93), rgba(243,242,242,.58)), linear-gradient(0deg, rgba(243,242,242,.62), transparent 65%); }
  [data-theme='modernist'] .m-home__stats { border-top-width: 2px; }
  [data-theme='modernist'] .m-home__how-section,
  [data-theme='modernist'] .m-home__routes-section,
  [data-theme='modernist'] .m-collab--journey { margin: 0; padding: 28px 16px; border-radius: 0; }
  [data-theme='modernist'] .m-how { gap: 0; }
  [data-theme='modernist'] .m-how article { border-right: 0; border-bottom: 2px solid #201e1d; }
  [data-theme='modernist'] .m-how article:last-child { border-bottom: 0; }
  [data-theme='modernist'] .m-route-card__photo,
  [data-theme='modernist'] .m-route-card__map-panel,
  [data-theme='modernist'] .m-route-card__body { border-width: 2px; }
  [data-theme='modernist'] .m-home__closing-cta { margin: 0; border-radius: 0; }
}