/*
 * Travelclip field-journal theme
 * One shared shell aligns navigation, mastheads, directories and long-form pages.
 */
:root {
  --travel-shell: 1280px;
  --travel-gutter: clamp(20px, 3.2vw, 44px);
  --travel-section-space: clamp(64px, 8vw, 108px);
  --travel-reading: 68ch;
  --paper: oklch(0.982 0.014 87);
  --panel: oklch(0.995 0.006 88);
  --wash: oklch(0.946 0.032 132);
  --ink: oklch(0.22 0.032 158);
  --text: oklch(0.3 0.027 158);
  --muted: oklch(0.43 0.022 158);
  --line: oklch(0.84 0.026 105);
  --forest: oklch(0.43 0.09 154);
  --forest-dark: oklch(0.275 0.075 154);
  --coral: oklch(0.65 0.145 35);
  --shadow: 0 18px 50px oklch(0.22 0.03 158 / .07);
}

html { scroll-padding-top: 104px; }
.travelclip-site {
  min-width: 320px;
  background: var(--paper);
  color: var(--ink);
  font-feature-settings: "kern" 1;
  letter-spacing: -.006em;
}
.travelclip-site p,
.travelclip-site li { text-wrap: pretty; }
.travelclip-site main { overflow: clip; }
.travelclip-site :focus-visible { outline: 3px solid color-mix(in oklch, var(--coral) 72%, white); outline-offset: 3px; }

/* Shared page edge */
.travelclip-site .hero,
.travelclip-site .section-hero,
.travelclip-site .section-wrap,
.travelclip-site .launch-note,
.travelclip-site .article-detail,
.travelclip-site .article-hero,
.travelclip-site .article-body,
.travelclip-site .ad-slot,
.travelclip-site .brand-story-hero,
.travelclip-site .brand-story-origin,
.travelclip-site .brand-story-mascot {
  width: min(calc(100% - (var(--travel-gutter) * 2)), var(--travel-shell));
  max-width: none;
  margin-right: auto;
  margin-left: auto;
}

/* Navigation */
.travelclip-site .site-header {
  min-height: 78px;
  padding: 0;
  border-bottom: 1px solid color-mix(in oklch, var(--line) 82%, transparent);
  background: color-mix(in oklch, var(--paper) 92%, transparent);
  box-shadow: 0 5px 22px oklch(0.2 0.025 158 / .035);
  backdrop-filter: blur(18px) saturate(1.1);
}
.site-header-inner {
  display: grid;
  grid-template-columns: minmax(190px, auto) minmax(0, 1fr) auto;
  gap: clamp(20px, 3vw, 46px);
  align-items: center;
  width: min(calc(100% - (var(--travel-gutter) * 2)), var(--travel-shell));
  min-height: 78px;
  margin: 0 auto;
}
.travelclip-site .brand { gap: 11px; }
.travelclip-site .brand-mark { width: 38px; height: 38px; border-radius: 50% 50% 46% 54%; }
.travelclip-site .brand span { display: grid; gap: 2px; }
.travelclip-site .brand strong { color: var(--forest-dark); font-size: 1rem; letter-spacing: -.025em; }
.travelclip-site .brand small { color: var(--muted); font-size: .63rem; font-weight: 720; letter-spacing: .06em; }
.travelclip-site .top-nav { justify-content: center; gap: clamp(4px, .7vw, 10px); }
.travelclip-site .top-nav > a,
.travelclip-site .country-nav summary {
  position: relative;
  border-radius: 0;
  padding: 10px 9px;
  background: transparent;
  color: var(--text);
  font-size: .84rem;
  font-weight: 760;
}
.travelclip-site .top-nav > a::after,
.travelclip-site .country-nav summary::before {
  position: absolute;
  right: 9px;
  bottom: 4px;
  left: 9px;
  height: 2px;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--coral);
  content: "";
  transition: transform 180ms ease;
}
.travelclip-site .top-nav > a:hover,
.travelclip-site .country-nav summary:hover,
.travelclip-site .country-nav[open] summary { background: transparent; color: var(--forest-dark); }
.travelclip-site .top-nav > a:hover::after,
.travelclip-site .country-nav summary:hover::before,
.travelclip-site .country-nav[open] summary::before { transform: scaleX(1); }
.travelclip-site .country-menu {
  top: calc(100% + 15px);
  left: 0;
  right: auto;
  border-radius: 2px;
  padding: 22px;
  box-shadow: var(--shadow);
}
.travelclip-site .country-menu a { border-radius: 2px; }
.travelclip-site .country-menu .country-menu-all { background: var(--forest-dark); }
.travelclip-site .language-switcher { margin-left: 0; }
.travelclip-site .language-switcher summary { border-radius: 999px; background: transparent; }

/* Editorial type and recurring headings */
.travelclip-site .eyebrow {
  color: var(--forest);
  font-size: .69rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.travelclip-site h1,
.travelclip-site h2,
.travelclip-site h3 { letter-spacing: -.035em; }
.travelclip-site h1 { line-height: 1.06; }
.travelclip-site .section-heading {
  display: grid;
  grid-template-columns: minmax(150px, .38fr) minmax(0, 1.62fr);
  gap: 8px clamp(28px, 5vw, 76px);
  max-width: none;
  margin-bottom: clamp(26px, 4vw, 48px);
  padding-top: 18px;
  border-top: 1px solid var(--forest);
}
.travelclip-site .section-heading .eyebrow { grid-row: 1 / span 2; padding-top: 7px; }
.travelclip-site .section-heading h2 { margin: 0; font-size: clamp(1.8rem, 3.1vw, 3rem); }
.travelclip-site .section-heading p:not(.eyebrow) { max-width: 64ch; margin-top: 4px; }

/* Home: a clipped field journal rather than a floating card dashboard */
.travelclip-site .travel-atlas {
  display: grid;
  grid-template-columns: minmax(360px, .88fr) minmax(0, 1.12fr);
  min-height: 620px;
  margin-top: 32px;
  padding: 0;
  overflow: hidden;
  border-top: 5px solid var(--forest-dark);
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.travelclip-site .travel-atlas .hero-copy {
  position: relative;
  z-index: 3;
  top: auto;
  left: auto;
  align-self: stretch;
  width: auto;
  padding: clamp(48px, 6vw, 86px);
  background: var(--panel);
  color: var(--ink);
}
.travelclip-site .travel-atlas .hero-copy::after {
  display: block;
  width: 46px;
  height: 4px;
  margin-top: 42px;
  background: var(--coral);
  content: "";
}
.travelclip-site .travel-atlas .hero-copy h1 {
  max-width: 12ch;
  color: var(--ink);
  font-size: clamp(2.85rem, 4.6vw, 4.35rem);
  line-height: 1.08;
}
.travelclip-site .travel-atlas .hero-copy .lead { color: var(--text); font-size: 1.08rem; line-height: 1.82; }
.travelclip-site .travel-atlas .hero-feature { position: relative; inset: auto; min-height: 620px; border: 0; border-radius: 0; box-shadow: none; }
.travelclip-site .travel-atlas .hero-feature .visual-frame { position: absolute; inset: 0; }
.travelclip-site .travel-atlas .hero-feature .visual-frame::after { background: linear-gradient(180deg, transparent 42%, oklch(0.17 0.04 158 / .88)); }
.travelclip-site .travel-atlas .hero-feature > span,
.travelclip-site .travel-atlas .hero-feature > h2,
.travelclip-site .travel-atlas .hero-feature > p {
  right: var(--travel-gutter);
  left: var(--travel-gutter);
  width: auto;
  padding: 0;
  background: transparent;
}
.travelclip-site .travel-atlas .hero-feature > span { bottom: 148px; }
.travelclip-site .travel-atlas .hero-feature > h2 { bottom: 82px; font-size: clamp(1.3rem, 2vw, 1.8rem); }
.travelclip-site .travel-atlas .hero-feature > p { bottom: 24px; }
.travelclip-site .section-wrap { padding: var(--travel-section-space) 0; }
.travelclip-site .section-wrap.alt { border-top: 1px solid var(--line); }
.travelclip-site .travel-country-index,
.travelclip-site .travel-notes,
.travelclip-site .travel-paths,
.travelclip-site .travel-kit { max-width: none; }
.travelclip-site .travel-country-index .section-heading,
.travelclip-site .travel-notes .section-heading,
.travelclip-site .travel-paths .section-heading,
.travelclip-site .travel-kit .section-heading { grid-template-columns: minmax(150px, .38fr) minmax(0, 1.62fr); gap: 8px clamp(28px, 5vw, 76px); }
.travelclip-site .travel-country-index .country-grid { gap: clamp(16px, 2vw, 26px); }
.travelclip-site .country-card {
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.travelclip-site .country-card .visual-frame { border-radius: 2px; }
.travelclip-site .country-card span,
.travelclip-site .country-card strong,
.travelclip-site .country-card p,
.travelclip-site .country-card small { margin-right: 0; margin-left: 0; }
.travelclip-site .country-card span { margin-top: 18px; }
.travelclip-site .country-card strong { color: var(--forest-dark); font-size: 1.35rem; }
.travelclip-site .travel-notes .article-list,
.travelclip-site .travel-paths .section-grid,
.travelclip-site .travel-kit .tool-grid { border-top: 2px solid var(--forest-dark); }
.travelclip-site .travel-notes .article-row,
.travelclip-site .travel-route-list .article-row,
.travelclip-site .travel-paths .section-card,
.travelclip-site .travel-topic-directory .section-card,
.travelclip-site .travel-kit .tool-card {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.travelclip-site .section-heading p:not(.eyebrow) { color: var(--text); font-size: 1rem; line-height: 1.72; }
.travelclip-site .section-card span,
.travelclip-site .country-card p,
.travelclip-site .article-card p,
.travelclip-site .article-row p,
.travelclip-site .tool-card p { color: var(--text); font-size: .94rem; line-height: 1.68; }
.travelclip-site .country-card small,
.travelclip-site .article-card small { color: var(--muted); font-size: .78rem; line-height: 1.55; }
.travelclip-site .article-row strong { font-size: 1.1rem; line-height: 1.45; }
.travelclip-site .launch-note { padding: 38px 0 58px; }

/* Search is server-rendered so every result remains fast, linkable and keyboard-friendly. */
.travel-search-form { display: grid; gap: 8px; max-width: 680px; }
.travel-search-form label { color: var(--text); font-size: .82rem; font-weight: 800; }
.travel-search-form > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; border-bottom: 2px solid var(--forest-dark); background: var(--panel); }
.travel-search-form input {
  min-width: 0;
  min-height: 52px;
  border: 0;
  padding: 0 16px;
  background: transparent;
  color: var(--ink);
  font: inherit;
}
.travel-search-form input::placeholder { color: var(--muted); }
.travel-search-form input:focus { outline: 0; }
.travel-search-form > div:focus-within { box-shadow: 0 0 0 3px color-mix(in oklch, var(--coral) 55%, transparent); }
.travel-search-form button {
  min-width: 82px;
  min-height: 52px;
  border: 0;
  padding: 0 18px;
  background: var(--forest-dark);
  color: var(--paper);
  font: inherit;
  font-weight: 850;
  cursor: pointer;
}
.travel-search-form-home { margin-top: 28px; }
.search-masthead {
  width: min(calc(100% - (var(--travel-gutter) * 2)), 920px);
  margin: 32px auto 0;
  padding: clamp(48px, 7vw, 86px) 0 clamp(42px, 6vw, 72px);
  border-top: 5px solid var(--forest-dark);
  border-bottom: 1px solid var(--line);
}
.search-masthead h1 { max-width: 13ch; }
.search-masthead > p:not(.eyebrow) { max-width: 60ch; margin: 18px 0 30px; color: var(--text); }
.travelclip-site .search-results { width: min(calc(100% - (var(--travel-gutter) * 2)), 920px); }
.search-result-list { border-top: 2px solid var(--forest-dark); }
.search-result-list .article-row { border-width: 0 0 1px; border-radius: 0; background: transparent; }
.search-empty { padding: clamp(38px, 7vw, 76px) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.search-empty strong { font-size: clamp(1.25rem, 2.5vw, 1.8rem); }
.search-empty p { margin: 8px 0 0; color: var(--text); }

/* Directories, countries and topic pages */
.travelclip-site .travel-directory-masthead,
.travelclip-site .travel-article-masthead {
  grid-template-columns: minmax(0, .9fr) minmax(460px, 1.1fr);
  gap: 0;
  margin-top: 32px;
  padding: 0;
  border-top: 5px solid var(--forest-dark);
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.travelclip-site .travel-directory-masthead > div,
.travelclip-site .travel-article-masthead > div { padding: clamp(48px, 6vw, 84px); }
.travelclip-site .travel-directory-masthead h1,
.travelclip-site .travel-article-masthead h1 {
  max-width: 16ch;
  font-size: clamp(2.4rem, 3.8vw, 3.8rem);
  line-height: 1.1;
}
.travelclip-site .travel-directory-masthead > div > p:last-child,
.travelclip-site .travel-article-masthead .lead { color: var(--text); font-size: 1.05rem; line-height: 1.78; }
.travelclip-site .travel-directory-masthead .visual-frame,
.travelclip-site .travel-article-masthead .article-visual { min-height: 500px; }
.travelclip-site .travel-directory-masthead .visual-frame img,
.travelclip-site .travel-article-masthead .article-visual img { min-height: 500px; }
.travelclip-site .destination-heading { padding-bottom: 15px; border-bottom: 1px solid var(--forest); }
.travelclip-site .country-region + .country-region { margin-top: 72px; }
.travelclip-site .travel-countries-page .country-grid.detailed { gap: clamp(20px, 3vw, 38px); }
.travelclip-site .topic-strip { border-radius: 0; background: transparent; }

/* Article: the same vertical rails as the masthead */
.travelclip-site .travel-article-detail { width: auto; padding: 0; }
.travelclip-site .travel-reading-layout {
  width: min(calc(100% - (var(--travel-gutter) * 2)), 1280px);
  grid-template-columns: minmax(0, 1fr) 300px;
  justify-content: initial;
  gap: clamp(38px, 5vw, 76px);
  padding: clamp(54px, 6vw, 84px) 0 clamp(84px, 9vw, 130px);
  border-top: 0;
}
.travelclip-site .travel-article-masthead .hero-facts { display: flex; flex-wrap: wrap; gap: 6px 28px; margin-top: 24px; }
.travelclip-site .travel-article-masthead .hero-facts div { display: flex; gap: 9px; align-items: baseline; padding: 0; border: 0; border-radius: 0; background: transparent; }
.travelclip-site .travel-article-masthead .hero-facts dt { color: var(--muted); font-size: .78rem; font-weight: 750; }
.travelclip-site .travel-article-masthead .hero-facts dd { margin: 0; font-size: .92rem; }
.travelclip-site .travel-reading-layout .article-main { max-width: none; gap: clamp(34px, 4.5vw, 54px); letter-spacing: 0; }
.travelclip-site .travel-reading-layout .article-main > section { scroll-margin-top: 110px; }
.travelclip-site .travel-reading-layout .article-main > section:not(.journey-spread):not(.swiss-booking-guide):not(.swiss-flex-plan):not(.swiss-pass-comparison):not(.editorial-field-guide):not(.map-embed-section) {
  max-width: var(--travel-reading);
}
.travelclip-site .travel-reading-layout .article-main p { color: var(--text); font-size: 1.075rem; line-height: 1.86; }
.travelclip-site .travel-reading-layout .article-main h2 { font-size: clamp(1.55rem, 2.3vw, 2.05rem); line-height: 1.28; }
/* Section titles marked up as `h2.eyebrow` read as headings, not tracked uppercase labels. */
.travelclip-site .travel-reading-layout .article-main h2.eyebrow {
  color: var(--forest-dark);
  font-size: clamp(1.45rem, 2.1vw, 1.85rem);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.3;
  text-transform: none;
}
.travelclip-site .travel-reading-layout .article-main h3 { font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.38; }
.travelclip-site .travel-reading-layout .article-main ul,
.travelclip-site .travel-reading-layout .article-main ol { color: var(--text); font-size: 1.04rem; line-height: 1.78; }
.travelclip-site .travel-reading-layout .article-main li + li { margin-top: .38em; }
.travelclip-site .travel-reading-layout .article-main a:not(.button) { text-decoration-thickness: 1px; text-underline-offset: .2em; }
.travelclip-site .article-toc {
  padding: 20px 0;
  border: 0;
  border-top: 2px solid var(--forest-dark);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.travelclip-site .article-toc ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 14px 0 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
  counter-reset: article-toc;
}
.travelclip-site .article-toc li {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  align-items: baseline;
  min-width: 0;
  margin: 0;
  padding: 11px 12px 11px 0;
  border-bottom: 1px solid var(--line);
  counter-increment: article-toc;
}
.travelclip-site .article-toc li::before {
  color: var(--muted);
  font-size: .76rem;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  content: counter(article-toc, decimal-leading-zero);
}
.travelclip-site .article-toc strong { font-size: 1.03rem; }
.travelclip-site .article-toc a { min-width: 0; font-size: .96rem; line-height: 1.45; text-wrap: pretty; }
.travelclip-site .article-overview,
.travelclip-site .article-final-check {
  padding: clamp(20px, 3vw, 28px) clamp(18px, 3vw, 28px) clamp(22px, 3vw, 30px);
  border: 0;
  border-top: 3px solid var(--forest-dark);
  border-radius: 0;
  background: color-mix(in oklch, var(--wash) 52%, var(--paper));
}
.travelclip-site .travel-reading-layout .info-list,
.travelclip-site .travel-reading-layout .check-grid { gap: 0 clamp(28px, 4vw, 52px); border-top: 1px solid var(--forest); }
.travelclip-site .travel-reading-layout .info-list > div,
.travelclip-site .travel-reading-layout .check-grid > div,
.travelclip-site .travel-reading-layout .checklist-item,
.travelclip-site .travel-reading-layout .schedule-list > div {
  padding: 17px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
/* app.css `.schedule-list div` leaks card chrome onto inner wrappers — neutralise it here. */
.travelclip-site .travel-reading-layout .schedule-list { gap: 0; border-top: 2px solid var(--forest-dark); }
.travelclip-site .travel-reading-layout .schedule-list div { border-radius: 0; background: transparent; box-shadow: none; }
.travelclip-site .travel-reading-layout .schedule-list > div { padding: 20px 0; }
.travelclip-site .travel-reading-layout .schedule-list > div[id] { scroll-margin-top: 110px; }
.travelclip-site .travel-reading-layout .schedule-list .day-visual-column,
.travelclip-site .travel-reading-layout .schedule-list .schedule-route { padding: 0; border: 0; }
.travelclip-site .travel-reading-layout .schedule-list .day-context { margin-top: 14px; padding: 12px 16px; border: 0; background: color-mix(in oklch, var(--wash) 46%, var(--paper)); }
.travelclip-site .travel-reading-layout .schedule-list .day-transit,
.travelclip-site .travel-reading-layout .schedule-list .day-reference-rail,
.travelclip-site .travel-reading-layout .schedule-list .schedule-stay { padding-right: 0; padding-left: 0; border-right: 0; border-left: 0; }
.travelclip-site .travel-reading-layout .article-side { top: 96px; gap: 0; border-top: 2px solid var(--forest-dark); }
@media (min-width: 801px) {
  .travelclip-site .travel-reading-layout .article-side {
    max-height: calc(100vh - 120px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
}
.travelclip-site .travel-reading-layout .side-box {
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.travelclip-site .travel-reading-layout .side-box span { letter-spacing: .06em; text-transform: uppercase; }
.travelclip-site .travel-reading-layout .side-box strong { font-size: 1rem; line-height: 1.55; }
.travelclip-site .travel-reading-layout .side-box p,
.travelclip-site .travel-reading-layout .side-link { font-size: .9rem; line-height: 1.65; }
.travelclip-site .travel-reading-layout .side-link { padding: 9px 0 3px; border-top: 1px solid color-mix(in oklch, var(--line) 62%, transparent); }
.travelclip-site .travel-reading-layout .side-link:hover { color: var(--forest); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
/* Sticky in-article contents: keeps the right rail alive on long reads. */
.travelclip-site .travel-reading-layout .side-toc ol { margin: 6px 0 0; padding: 0; list-style: none; display: grid; gap: 0; }
.travelclip-site .travel-reading-layout .side-toc li + li a { border-top: 1px solid color-mix(in oklch, var(--line) 55%, transparent); }
.travelclip-site .travel-reading-layout .side-toc a { display: block; padding: 8px 0; color: var(--text); font-size: .88rem; font-weight: 750; line-height: 1.5; }
.travelclip-site .travel-reading-layout .side-toc a:hover { color: var(--forest-dark); }
.travelclip-site .travel-reading-layout .side-toc a[aria-current="true"] { color: var(--forest-dark); font-weight: 850; }
.travelclip-site .side-day-nav { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin: 12px 0 2px; padding: 0; list-style: none; }
.travelclip-site .travel-reading-layout .side-toc .side-day-nav a { display: grid; place-items: center; min-height: 30px; padding: 0; border: 1px solid var(--line); color: var(--text); font-size: .78rem; font-weight: 750; }
.travelclip-site .travel-reading-layout .side-toc .side-day-nav a:hover { border-color: var(--forest); color: var(--forest-dark); }
.travelclip-site .travel-reading-layout .side-toc .side-day-nav a[aria-current="true"] { border-color: var(--forest-dark); background: var(--forest-dark); color: var(--paper); }
.travelclip-site .travel-reading-layout .day-illustration { overflow: hidden; border-radius: 2px; }
.travelclip-site .travel-reading-layout .journey-spread { margin-top: 0; }
.travelclip-site .travel-reading-layout .editorial-field-guide { margin-top: 36px; }
.travelclip-site .map-embed-section iframe { border-radius: 2px; }

.travelclip-site .day-flex-status b { white-space: nowrap; }

/* Inline actions ("읽기", "지도") must read as links, not bold text. */
.travelclip-site .text-link {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  padding: 8px 0;
  color: var(--forest-dark);
  font-size: .88rem;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: color-mix(in oklch, var(--forest-dark) 55%, transparent);
  text-underline-offset: .24em;
}
.travelclip-site .text-link::after { content: "→"; font-size: .92em; text-decoration: none; }
.travelclip-site .text-link[target="_blank"]::after { content: "↗"; }
.travelclip-site .text-link:hover { text-decoration-color: currentColor; }

/* Day-jump chips: mobile-only rail for very long itineraries (desktop uses the sticky side nav). */
.travelclip-site .day-jump { display: none; }

/* Return-to-contents affordance for very long reads; revealed by article-nav.js. */
.travelclip-site .back-to-top {
  position: fixed;
  right: 14px;
  bottom: 18px;
  z-index: 15;
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid color-mix(in oklch, var(--forest-dark) 30%, var(--line));
  border-radius: 999px;
  background: color-mix(in oklch, var(--paper) 94%, var(--forest));
  color: var(--forest-dark);
  font-size: .82rem;
  font-weight: 800;
  box-shadow: 0 5px 16px oklch(0.2 0.03 158 / .16);
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 200ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}
.travelclip-site .back-to-top.is-visible,
.travelclip-site .back-to-top:focus-visible { opacity: 1; pointer-events: auto; transform: none; }

/* The field-guide pull-quote loses its side stripe: tinted block instead. */
.travelclip-site .field-guide-footnotes blockquote { padding: 14px 16px 16px; border-left: 0; background: color-mix(in oklch, var(--wash) 46%, var(--paper)); }

/* Ads stay visually separate from editorial content. */
.travelclip-site .ad-slot { display: grid; gap: 8px; padding: 16px 0 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.travelclip-site .ad-slot > span { font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }

@media (max-width: 1100px) {
  .travelclip-site .article-toc ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Dense guides must remain readable without zooming. */
.travelclip-site .travel-reading-layout .journey-copy > p,
.travelclip-site .travel-reading-layout .itinerary-detail-heading > p:last-child,
.travelclip-site .travel-reading-layout .swiss-booking-guide > div > p:not(.eyebrow),
.travelclip-site .travel-reading-layout .swiss-flex-plan > div > p:not(.eyebrow),
.travelclip-site .travel-reading-layout .swiss-flex-plan-notes p,
.travelclip-site .travel-reading-layout .swiss-pass-comparison header > p:last-child { font-size: .98rem; line-height: 1.75; }
.travelclip-site .travel-reading-layout .journey-metrics dt,
.travelclip-site .travel-reading-layout .journey-bases span,
.travelclip-site .travel-reading-layout .journey-bases p,
.travelclip-site .travel-reading-layout .route-map-key,
.travelclip-site .travel-reading-layout .route-leg-links { font-size: .8rem; line-height: 1.55; }
.travelclip-site .travel-reading-layout .day-rail-note { font-size: .86rem; line-height: 1.65; }
.travelclip-site .travel-reading-layout .day-rail-note b { font-size: .74rem; }
.travelclip-site .travel-reading-layout .day-reference-rail nav strong { font-size: .75rem; }
.travelclip-site .travel-reading-layout .day-reference-rail a { font-size: .85rem; line-height: 1.5; }
.travelclip-site .travel-reading-layout .schedule-route > strong { font-size: 1.08rem; line-height: 1.45; }
.travelclip-site .travel-reading-layout .schedule-route > p { font-size: 1rem; line-height: 1.75; }
.travelclip-site .travel-reading-layout .day-flex-status { font-size: .82rem !important; line-height: 1.55 !important; }
.travelclip-site .travel-reading-layout .day-context b,
.travelclip-site .travel-reading-layout .day-transit b { font-size: .82rem; }
.travelclip-site .travel-reading-layout .day-context p,
.travelclip-site .travel-reading-layout .day-transit p { font-size: .92rem; line-height: 1.68; }
.travelclip-site .travel-reading-layout .day-spots a { font-size: .9rem; line-height: 1.5; }
.travelclip-site .travel-reading-layout .day-spots a span { font-size: .72rem; }
.travelclip-site .travel-reading-layout .day-spots small { font-size: .82rem; line-height: 1.55; }
.travelclip-site .travel-reading-layout .schedule-stay span { font-size: .82rem; }
.travelclip-site .travel-reading-layout .schedule-stay strong { font-size: 1rem; line-height: 1.5; }
.travelclip-site .travel-reading-layout .schedule-stay small,
.travelclip-site .travel-reading-layout .schedule-stay a { font-size: .88rem; line-height: 1.55; }
.travelclip-site .travel-reading-layout .swiss-booking-guide li strong,
.travelclip-site .travel-reading-layout .swiss-pass-options strong { font-size: .94rem; }
.travelclip-site .travel-reading-layout .swiss-booking-guide li p,
.travelclip-site .travel-reading-layout .swiss-pass-options p,
.travelclip-site .travel-reading-layout .swiss-pass-practical p { font-size: .89rem; line-height: 1.68; }
.travelclip-site .travel-reading-layout .editorial-field-guide > header > p:last-child { font-size: .98rem; line-height: 1.72; }
.travelclip-site .travel-reading-layout .field-note strong,
.travelclip-site .travel-reading-layout .field-place-list strong { font-size: .96rem; }
.travelclip-site .travel-reading-layout .field-note p,
.travelclip-site .travel-reading-layout .field-place-list p,
.travelclip-site .travel-reading-layout .field-guide-footnotes p { font-size: .92rem; line-height: 1.72; }
.travelclip-site .travel-reading-layout .field-place-list a,
.travelclip-site .travel-reading-layout .field-guide-footnotes a { font-size: .84rem; }

/* Brand page participates in the same shell. */
.travelclip-site .brand-story-hero { margin-top: 32px; }
.travelclip-site .brand-story-origin,
.travelclip-site .brand-story-mascot { padding: var(--travel-section-space) 0; }
.travelclip-site .brand-story-principles { padding-inline: max(var(--travel-gutter), calc((100vw - var(--travel-shell)) / 2)); }

/* Footer uses exactly the same left and right rails. */
.travelclip-site .site-footer { display: block; margin-top: 0; padding: 0; background: color-mix(in oklch, var(--wash) 42%, var(--paper)); }
.site-footer-inner {
  display: grid;
  grid-template-columns: minmax(240px, .8fr) minmax(0, 1.25fr) minmax(180px, .55fr);
  gap: clamp(28px, 5vw, 72px);
  width: min(calc(100% - (var(--travel-gutter) * 2)), var(--travel-shell));
  margin: 0 auto;
  padding: clamp(44px, 6vw, 72px) 0;
}
.footer-brand { display: flex; align-items: flex-start; gap: 14px; }
.footer-brand img { width: 42px; height: 42px; border-radius: 50%; }
.footer-brand p { max-width: 28ch; }
.travelclip-site .site-footer nav { align-content: start; gap: 4px 8px; }
.travelclip-site .site-footer nav a { padding: 6px 8px; border-radius: 2px; font-size: .78rem; }
.travelclip-site .network-nav { align-content: start; flex-direction: column; }

@media (max-width: 1020px) {
  .site-header-inner { grid-template-columns: 1fr auto; gap: 0 20px; padding: 12px 0; }
  .travelclip-site .top-nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-top: 6px; scrollbar-width: none; }
  .travelclip-site .top-nav::-webkit-scrollbar { display: none; }
  .travelclip-site .language-switcher { grid-column: 2; grid-row: 1; }
  .travelclip-site .travel-atlas { grid-template-columns: minmax(330px, .88fr) minmax(0, 1.12fr); }
  .travelclip-site .travel-atlas .hero-copy { padding: 50px 36px; }
  .travelclip-site .travel-reading-layout { grid-template-columns: minmax(0, 1fr) 240px; }
  .site-footer-inner { grid-template-columns: 1fr 1.4fr; }
  .site-footer-inner .network-nav { grid-column: 1 / -1; flex-direction: row; }
}

@media (max-width: 800px) {
  :root { --travel-gutter: clamp(16px, 4.5vw, 28px); }
  html { scroll-padding-top: 20px; }
  /* The two-row header stops shadowing the first screen: scrolls away, tighter metrics. */
  .travelclip-site .site-header { position: static; box-shadow: none; backdrop-filter: none; }
  .site-header-inner { padding: 8px 0; }
  .travelclip-site .brand-mark { width: 32px; height: 32px; }
  .travelclip-site .travel-reading-layout .article-main { gap: 30px; }
  .travelclip-site .travel-reading-layout .article-main > section { scroll-margin-top: 24px; }
  .travelclip-site .travel-reading-layout .schedule-list > div[id] { scroll-margin-top: 20px; }
  .travelclip-site .itinerary-stay-section { margin-top: 10px; }
  .travelclip-site .editorial-field-guide { margin-top: 40px; padding-top: 26px; }
  .travelclip-site .journey-spread { margin-bottom: 36px; }
  .travelclip-site .swiss-booking-guide,
  .travelclip-site .swiss-flex-plan { margin-bottom: 34px; }
  .travelclip-site .side-toc { display: none; }
  .travelclip-site .article-toc ol { grid-template-columns: 1fr; }
  .travelclip-site .article-toc li { padding: 10px 0; }
  .travelclip-site .day-jump { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; }
  .travelclip-site .day-jump a {
    display: grid;
    place-items: center;
    min-width: 44px;
    min-height: 44px;
    border: 1px solid var(--line);
    color: var(--text);
    font-size: .84rem;
    font-weight: 800;
  }
  .travelclip-site .day-jump a[aria-current="true"] { border-color: var(--forest-dark); background: var(--forest-dark); color: var(--paper); }
  .travelclip-site .section-heading,
  .travelclip-site .travel-country-index .section-heading,
  .travelclip-site .travel-notes .section-heading,
  .travelclip-site .travel-paths .section-heading,
  .travelclip-site .travel-kit .section-heading { grid-template-columns: 1fr; gap: 7px; }
  .travelclip-site .section-heading .eyebrow { grid-row: auto; padding-top: 0; }
  .travelclip-site .travel-atlas,
  .travelclip-site .travel-directory-masthead,
  .travelclip-site .travel-article-masthead,
  .travelclip-site .travel-reading-layout { grid-template-columns: 1fr; }
  .travelclip-site .travel-atlas { min-height: auto; }
  .travelclip-site .travel-atlas .hero-feature { min-height: 520px; }
  .travelclip-site .travel-directory-masthead .visual-frame,
  .travelclip-site .travel-article-masthead .article-visual,
  .travelclip-site .travel-directory-masthead .visual-frame img,
  .travelclip-site .travel-article-masthead .article-visual img { min-height: 360px; }
  .travelclip-site .travel-reading-layout .article-side { position: static; }
  /* Full-width text column: shrink to an icon-only disc and only surface on upward scroll so copy stays readable. */
  .travelclip-site .back-to-top {
    right: 12px;
    bottom: 16px;
    width: 48px;
    min-height: 48px;
    justify-content: center;
    gap: 0;
    padding: 0;
    font-size: 1.05rem;
  }
  .travelclip-site .back-to-top .back-to-top-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .site-footer-inner { grid-template-columns: 1fr; }
  .site-footer-inner .network-nav { grid-column: auto; }
}

@media (max-width: 560px) {
  .travelclip-site .site-header { align-items: stretch; padding: 0; }
  .site-header-inner { width: calc(100% - 32px); }
  .travelclip-site .brand small { display: none; }
  .search-masthead { width: calc(100% - 32px); margin-top: 18px; }
  .travel-search-form button { min-width: 68px; padding: 0 14px; }
  .travelclip-site .top-nav > a,
  .travelclip-site .country-nav summary { padding: 8px 7px; font-size: .76rem; white-space: nowrap; }
  .travelclip-site .country-menu { position: fixed; z-index: 60; top: 108px; left: 10px; right: 10px; width: auto; }
  .travelclip-site .travel-atlas,
  .travelclip-site .travel-directory-masthead,
  .travelclip-site .travel-article-masthead,
  .travelclip-site .brand-story-hero { width: calc(100% - 28px); margin-top: 14px; }
  .travelclip-site .travel-atlas .hero-copy,
  .travelclip-site .travel-directory-masthead > div,
  .travelclip-site .travel-article-masthead > div { padding: 40px 22px; }
  .travelclip-site .travel-atlas .hero-copy h1 { font-size: clamp(2.35rem, 11.5vw, 3.05rem); line-height: 1.12; }
  .travelclip-site .travel-directory-masthead h1,
  .travelclip-site .travel-article-masthead h1 { font-size: clamp(2.25rem, 10.5vw, 2.8rem); line-height: 1.14; }
  .travelclip-site .travel-atlas .hero-feature { min-height: 440px; }
  .travelclip-site .travel-atlas .hero-feature > span,
  .travelclip-site .travel-atlas .hero-feature > h2,
  .travelclip-site .travel-atlas .hero-feature > p { right: 20px; left: 20px; }
  .travelclip-site .travel-atlas .hero-feature > p { display: none; }
  .travelclip-site .travel-atlas .hero-feature > span { bottom: 90px; }
  .travelclip-site .travel-atlas .hero-feature > h2 { bottom: 28px; }
  .travelclip-site .travel-directory-masthead .visual-frame,
  .travelclip-site .travel-article-masthead .article-visual,
  .travelclip-site .travel-directory-masthead .visual-frame img,
  .travelclip-site .travel-article-masthead .article-visual img { min-height: 270px; max-height: 340px; }
  .travelclip-site .travel-reading-layout { padding-top: 42px; }
  .travelclip-site .travel-reading-layout .article-main > section { max-width: none; }
  .travelclip-site .travel-reading-layout .check-grid { grid-template-columns: 1fr; }
  .travelclip-site .brand-story-origin,
  .travelclip-site .brand-story-mascot { padding-right: 0; padding-left: 0; }
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: oklch(0.17 0.018 158);
    --panel: oklch(0.205 0.02 158);
    --wash: oklch(0.25 0.034 153);
    --ink: oklch(0.93 0.014 92);
    --text: oklch(0.87 0.015 92);
    --muted: oklch(0.74 0.018 96);
    --line: oklch(0.34 0.025 132);
    --forest: oklch(0.72 0.078 149);
    --forest-dark: oklch(0.84 0.06 145);
    --coral: oklch(0.74 0.13 38);
  }
  .travelclip-site { background: var(--paper); }
  .travelclip-site .site-header { background: color-mix(in oklch, var(--paper) 91%, transparent); }
  .travelclip-site .travel-atlas,
  .travelclip-site .travel-atlas .hero-copy,
  .travelclip-site .travel-directory-masthead,
  .travelclip-site .travel-article-masthead { background: var(--panel); }
  .travelclip-site .travel-atlas .hero-copy h1 { color: var(--ink); }
  .travelclip-site .site-footer { background: oklch(0.19 0.022 155); }
}

@media (prefers-reduced-motion: reduce) {
  .travelclip-site .top-nav > a::after,
  .travelclip-site .country-nav summary::before,
  .travelclip-site .back-to-top { transition: none; }
}
