:root {
  --ink: #1d1d1f;
  --muted: #5f6b7a;
  --line: #d8dee8;
  --paper: #f7f8fb;
  --white: #ffffff;
  --teal: #246beb;
  --teal-dark: #063a74;
  --blue-dark: #063a74;
  --coral: #e85d3f;
  --yellow: #f7c948;
  --blue: #246beb;
  --green: #008a70;
  --line-strong: #c7d1df;
  --surface-blue: #eef5ff;
  --surface-green: #eef8f5;
  --surface-warn: #fff7e6;
  --danger: #d9272f;
  --shadow: 0 12px 28px rgba(29, 29, 31, 0.08);
  --shadow-md: 0 16px 34px rgba(29, 29, 31, 0.12);
  --control-shadow: 0 6px 14px rgba(29, 29, 31, 0.08);
  --focus: 0 0 0 4px rgba(36, 107, 235, 0.22);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  transform: translateY(-140%);
  border-radius: 6px;
  padding: 10px 14px;
  color: var(--white);
  background: var(--teal-dark);
  font-weight: 800;
  transition: transform 160ms ease;
}

.skip-link:focus {
  transform: translateY(0);
  outline: none;
  box-shadow: var(--focus);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  clip-path: inset(50%);
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 10px clamp(18px, 4vw, 56px);
  border-bottom: 1px solid rgba(216, 222, 232, 0.95);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(10px);
}

.brand {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  font-weight: 800;
  white-space: nowrap;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
}

.brand-mark svg {
  display: block;
}

.brand-name em {
  font-style: normal;
  color: var(--coral);
}

.top-nav,
.footer-links,
.hero-actions,
.filter-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.top-nav {
  justify-content: flex-start;
  min-width: 0;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.top-nav::-webkit-scrollbar {
  display: none;
}

.top-nav a {
  flex: 0 0 auto;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 8px 12px;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.1;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.language-menu {
  position: relative;
  justify-self: end;
}

.language-menu summary {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(13, 127, 117, 0.18);
  border-radius: 6px;
  padding: 8px 12px;
  background: var(--surface-blue);
  color: var(--teal-dark);
  font-size: 0.85rem;
  font-weight: 750;
  line-height: 1.1;
  cursor: pointer;
  list-style: none;
}

.language-menu summary::-webkit-details-marker {
  display: none;
}

.language-menu summary::after {
  content: "v";
  color: var(--muted);
  font-size: 0.8rem;
}

.language-menu[open] summary {
  border-color: rgba(36, 107, 235, 0.35);
  box-shadow: var(--focus);
}

.language-menu-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 30;
  display: grid;
  gap: 4px;
  min-width: 172px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--white);
  box-shadow: var(--shadow-md);
}

.language-menu-panel a {
  min-height: 34px;
  display: flex;
  align-items: center;
  border-radius: 6px;
  padding: 8px 10px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 700;
}

.top-nav a:hover,
.language-menu-panel a:hover,
.language-menu-panel a[aria-current="true"] {
  border-color: rgba(13, 127, 117, 0.18);
  background: var(--surface-blue);
  color: var(--teal-dark);
}

.top-nav a:focus-visible,
.language-menu summary:focus-visible,
.language-menu-panel a:focus-visible,
.button:focus-visible,
.filter-bar button:focus-visible,
.clear-filters:focus-visible,
.save-event:focus-visible,
.category-pill:focus-visible,
.city-pill:focus-visible,
.saved-open:focus-visible,
.saved-clear:focus-visible,
.planner-card-actions a:focus-visible,
.planner-card-actions button:focus-visible {
  outline: none;
  box-shadow: var(--focus);
}

.service-hero {
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(180deg, #ffffff 0%, #f3f7ff 100%);
}

.service-hero-inner {
  width: min(1220px, calc(100% - 32px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(420px, 0.92fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  padding: clamp(42px, 7vw, 76px) 0 clamp(34px, 6vw, 56px);
}

.service-copy {
  display: grid;
  gap: 18px;
  max-width: 780px;
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.service-hero h1,
.page-hero h1,
.article-page h1 {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(2.45rem, 6vw, 5.8rem);
  line-height: 1.02;
}

.service-copy p:not(.eyebrow) {
  max-width: 680px;
  margin: 0;
  color: #344054;
  font-size: clamp(1.02rem, 1.7vw, 1.25rem);
}

.service-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.service-visual {
  display: grid;
  gap: 12px;
}

.spotlight-carousel {
  display: grid;
  gap: 10px;
}

.spotlight-track {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  background: #0b1b34;
  box-shadow: 0 18px 42px rgba(29, 29, 31, 0.16);
}

.spotlight-card {
  position: absolute;
  inset: 0;
  display: block;
  min-height: 360px;
  overflow: hidden;
  color: var(--white);
  opacity: 0;
  pointer-events: none;
  transform: translateX(26px) scale(0.985);
  transition: opacity 360ms ease, transform 360ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.spotlight-carousel.is-moving-back .spotlight-card {
  transform: translateX(-26px) scale(0.985);
}

.spotlight-card.is-active {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}

.spotlight-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(9, 23, 42, 0.08), rgba(9, 23, 42, 0.78)),
    linear-gradient(90deg, rgba(9, 23, 42, 0.5), rgba(9, 23, 42, 0.08) 52%);
  pointer-events: none;
}

.spotlight-card img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  transition: transform 420ms ease;
}

.spotlight-card:hover img {
  transform: scale(1.025);
}

.spotlight-controls {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.spotlight-controls button {
  min-height: 44px;
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  color: var(--teal-dark);
  background: var(--white);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.spotlight-arrow {
  width: 44px;
  font-size: 1rem;
}

.spotlight-controls button:hover {
  border-color: var(--teal);
  background: var(--surface-blue);
  transform: translateY(-1px);
}

.spotlight-nav-panel {
  display: flex;
  min-width: 0;
  min-height: 44px;
  align-items: center;
  gap: 10px;
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.92);
}

.spotlight-tabs {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
  align-items: center;
}

.spotlight-controls .spotlight-tab {
  display: grid;
  width: 34px;
  min-height: 34px;
  place-items: center;
  border-radius: 999px;
  padding: 0;
  background: #f8fbff;
}

.spotlight-tab span {
  color: #6a778a;
  font-size: 0.74rem;
  font-weight: 900;
}

.spotlight-current-label {
  min-width: 0;
  overflow: hidden;
  color: var(--blue-dark);
  font-size: 0.88rem;
  font-weight: 850;
  line-height: 1.2;
  overflow-wrap: anywhere;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spotlight-tab[aria-current="true"] {
  border-color: var(--teal);
  color: var(--white);
  background: var(--teal);
  box-shadow: var(--control-shadow);
}

.spotlight-tab[aria-current="true"] span {
  color: rgba(255, 255, 255, 0.72);
}

.spotlight-count {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 820;
  white-space: nowrap;
}

.spotlight-badge {
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 16px;
  max-width: calc(100% - 32px);
  overflow: hidden;
  border-radius: 999px;
  padding: 7px 11px;
  color: var(--white);
  background: rgba(6, 58, 116, 0.86);
  font-size: 0.76rem;
  font-weight: 850;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spotlight-content {
  position: absolute;
  z-index: 2;
  left: 18px;
  right: 18px;
  bottom: 18px;
  display: grid;
  gap: 6px;
  color: var(--white);
}

.spotlight-content > span {
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.spotlight-content strong {
  display: -webkit-box;
  overflow: hidden;
  max-width: 18ch;
  font-size: clamp(1.55rem, 3.1vw, 2.55rem);
  line-height: 1.05;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.spotlight-content em {
  display: -webkit-box;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.88);
  font-style: normal;
  font-weight: 720;
  line-height: 1.22;
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.service-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.service-summary div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  min-height: 58px;
  align-content: center;
  align-items: center;
  padding: 12px;
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 8px 18px rgba(29, 29, 31, 0.06);
}

.service-summary dt {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.15;
}

.service-summary dd {
  margin: 0;
  color: var(--teal-dark);
  font-size: 1.55rem;
  font-weight: 850;
  line-height: 1;
}

.planning-layer {
  width: min(1220px, calc(100% - 32px));
  margin: 28px auto 10px;
}

.planning-layer-inner {
  display: grid;
  grid-template-columns: minmax(260px, 0.68fr) minmax(0, 1.32fr);
  gap: clamp(16px, 2.5vw, 28px);
  align-items: start;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  background:
    linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
  box-shadow: 0 14px 34px rgba(29, 29, 31, 0.07);
}

.planning-layer-lede {
  display: grid;
  gap: 12px;
}

.planning-layer h2 {
  margin: 0;
  max-width: 13ch;
  color: var(--ink);
  font-size: clamp(1.6rem, 2.6vw, 2.6rem);
  line-height: 1.06;
}

.planning-layer-lede p:not(.eyebrow) {
  margin: 0;
  color: #344054;
  font-size: 0.98rem;
  line-height: 1.5;
}

.planning-layer-body {
  display: grid;
  gap: 12px;
}

.planning-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid #bfd0e6;
  border-radius: 8px;
  background: #f5f8ff;
}

.planning-flow-step {
  display: grid;
  gap: 7px;
  min-height: 104px;
  align-content: center;
  padding: 14px;
  border-right: 1px solid #d9e3f2;
}

.planning-flow-step:last-child {
  border-right: 0;
}

.planning-flow-step span {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: var(--white);
  background: var(--blue);
  font-size: 0.74rem;
  font-weight: 900;
}

.planning-flow-step strong {
  color: var(--blue-dark);
  font-size: 1rem;
  line-height: 1.18;
}

.planning-flow-step p {
  margin: 0;
  color: #475467;
  font-size: 0.84rem;
  line-height: 1.32;
}

.planning-layer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.planning-card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  min-height: 72px;
  align-content: center;
  padding: 13px 14px 13px 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.planning-card::before {
  content: "";
  position: absolute;
  inset: 14px auto 14px 0;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: var(--blue);
}

.planning-card span {
  color: var(--blue-dark);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
}

.planning-card strong {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.2;
}

.planning-card p {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.28;
}

.service-difference {
  margin: 24px 0 8px;
  padding: 28px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.service-difference-inner {
  display: grid;
  gap: 14px;
  width: min(1220px, calc(100% - 32px));
  margin: 0 auto;
}

.service-difference-head {
  display: grid;
  gap: 8px;
  max-width: 860px;
}

.service-difference-head h2 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.65rem, 2.35vw, 2.35rem);
  line-height: 1.08;
}

.service-difference-head p:not(.eyebrow) {
  margin: 0;
  color: #344054;
  font-size: 0.98rem;
  line-height: 1.45;
}

.difference-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.difference-card {
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 152px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcff;
}

.difference-card.is-kspot {
  border-color: rgba(13, 127, 117, 0.38);
  background: linear-gradient(180deg, #f3fbf8, #ffffff);
}

.difference-card span {
  color: var(--teal-dark);
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.difference-card h3 {
  margin: 0;
  color: var(--ink);
  font-size: 1.16rem;
  line-height: 1.18;
}

.difference-card ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding-left: 18px;
  color: #344054;
  line-height: 1.35;
}

.difference-proof-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  background: #f8fbff;
}

.difference-proof-grid div {
  display: grid;
  gap: 4px;
  padding: 13px 14px;
  border-right: 1px solid #d9e3f2;
}

.difference-proof-grid div:last-child {
  border-right: 0;
}

.difference-proof-grid strong {
  color: var(--blue-dark);
  font-size: 1rem;
}

.difference-proof-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.28;
}

.button,
.filter-bar button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 10px 16px;
  font: inherit;
  font-weight: 760;
  line-height: 1.12;
  text-align: center;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.button[href]::after,
.text-link::after,
.saved-open::after,
.planner-card-actions a::after {
  content: ">";
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  color: inherit;
  background: rgba(255, 255, 255, 0.18);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
}

.button.primary {
  color: var(--white);
  border-color: var(--teal);
  background: var(--teal);
  box-shadow: var(--control-shadow);
}

.button.secondary {
  color: var(--teal-dark);
  border-color: #a9c3ef;
  background: var(--surface-blue);
}

.button.light {
  color: var(--teal-dark);
  border-color: var(--line);
  background: var(--white);
}

.button.primary:hover,
.button.secondary:hover,
.button.light:hover {
  transform: translateY(-1px);
}

.button.primary:hover {
  border-color: var(--teal-dark);
  background: var(--teal-dark);
  box-shadow: 0 10px 20px rgba(36, 107, 235, 0.2);
}

.button.secondary:hover {
  border-color: var(--teal);
  background: #dceaff;
}

.button.light:hover {
  border-color: #a9c3ef;
  background: #f7fbff;
}

.button.secondary[href]::after,
.button.light[href]::after,
.saved-open::after,
.planner-card-actions a::after {
  color: var(--white);
  background: var(--teal);
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  min-height: 38px;
  border: 1px solid rgba(13, 127, 117, 0.22);
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--teal-dark);
  background: #f7fcfa;
  font-weight: 800;
  line-height: 1.1;
}

.text-link::after {
  color: var(--white);
  background: var(--teal);
}

.text-link:hover {
  border-color: rgba(13, 127, 117, 0.5);
  background: #edf7f3;
}

.ad-band {
  display: grid;
  align-items: center;
  width: min(1080px, calc(100% - 36px));
  min-height: 118px;
  margin: 28px auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
}

.ad-band span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 760;
  text-align: center;
  text-transform: uppercase;
}

.ad-band.detail {
  width: 100%;
  margin: 0;
}

.ad-band.article {
  width: 100%;
  margin: 18px 0 6px;
}

.content-shell,
.page {
  width: min(1220px, calc(100% - 32px));
  margin: 0 auto;
}

.content-shell {
  padding: 54px 0 72px;
}

.section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  margin-bottom: 24px;
}

.section-head h2,
.split-band h2,
.detail-section h2,
.month-block h2 {
  margin: 0;
  font-size: clamp(1.45rem, 2.1vw, 2.25rem);
  line-height: 1.18;
}

.detail-section h2 {
  font-size: clamp(1.35rem, 1.8vw, 1.9rem);
}

.filter-bar {
  justify-content: flex-end;
  gap: 7px;
}

.gallery-tools {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(150px, 0.34fr) auto auto;
  gap: 10px;
  align-items: end;
  margin: 0 0 22px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.gallery-tools.has-city-filter {
  grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(150px, 0.34fr)) auto auto;
}

.gallery-tools .filter-bar {
  grid-column: 1 / -1;
  justify-content: flex-start;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.search-field,
.select-field {
  display: grid;
  gap: 5px;
}

.search-field span,
.select-field span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.search-field input,
.select-field select {
  min-height: 44px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px 14px;
  color: var(--ink);
  background: var(--white);
  font: inherit;
  font-weight: 650;
  box-shadow: none;
}

.search-field input:focus,
.select-field select:focus {
  outline: none;
  box-shadow: var(--focus);
  border-color: var(--teal);
}

.filter-bar button {
  color: var(--ink);
  background: var(--white);
  border-color: var(--line-strong);
  min-height: 38px;
  padding: 8px 15px;
  border-radius: 999px;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.filter-bar button:hover {
  color: var(--teal-dark);
  background: var(--surface-blue);
  border-color: var(--teal);
  transform: translateY(-1px);
  box-shadow: var(--control-shadow);
}

.filter-bar button[aria-pressed="true"] {
  color: var(--white);
  background: linear-gradient(135deg, var(--teal), #1d5ed1);
  border-color: var(--teal);
  box-shadow: 0 6px 16px rgba(36, 107, 235, 0.32);
  transform: none;
}

.filter-bar button[aria-pressed="true"]::before {
  content: "✓";
  font-size: 0.82em;
  line-height: 1;
}

.clear-filters {
  min-height: 44px;
  width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  justify-self: start;
  border: 1px dashed var(--line-strong);
  border-radius: 999px;
  padding: 10px 18px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-weight: 820;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.clear-filters::before {
  content: "↺";
  font-size: 1.05em;
  line-height: 1;
}

.clear-filters:hover {
  border-color: var(--coral);
  border-style: solid;
  color: var(--coral);
  background: #fff4f0;
}

.result-count {
  min-height: 44px;
  display: inline-grid;
  align-items: center;
  justify-content: end;
  color: var(--muted);
  font-weight: 780;
}

.gallery-empty {
  margin-top: 18px;
}

.browse-directory {
  display: grid;
  gap: 28px;
  margin: 18px 0 34px;
  padding: 26px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.browse-group {
  display: grid;
  gap: 14px;
}

.browse-group + .browse-group {
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.browse-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  align-items: start;
}

.browse-head h3 {
  margin: 0;
  font-size: clamp(1.12rem, 1.45vw, 1.42rem);
  line-height: 1.15;
}

.browse-head > p {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 650;
  line-height: 1.5;
}

.category-strip,
.city-strip {
  gap: 10px;
  margin: 0 0 24px;
}

.category-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  align-items: stretch;
  gap: 10px;
}

.home-category-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.city-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.home-city-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.category-strip.page-strip {
  margin: 0 0 26px;
}

.city-strip.page-strip {
  margin: 0 0 26px;
}

.category-pill,
.city-pill {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: none;
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, opacity 160ms ease, filter 160ms ease;
}

.category-pill.is-muted,
.city-pill.is-muted {
  opacity: 0.35;
  filter: saturate(0.25);
}

.category-pill.is-selected {
  border-color: var(--pill-accent, var(--teal));
  box-shadow: 0 0 0 3px rgba(36, 107, 235, 0.2), var(--shadow-md);
  transform: translateY(-2px);
}

.category-pill {
  --pill-accent: var(--teal);
  --pill-accent-2: var(--blue);
  min-height: 96px;
  padding: 18px 46px 18px 18px;
  overflow: hidden;
  border-left: 4px solid var(--pill-accent);
}

.home-category-strip .category-pill {
  min-height: 88px;
  padding: 14px 42px 14px 14px;
  border-radius: 8px;
}

.category-pill::before {
  display: none;
}

.category-festival {
  --pill-accent: #bf3f4a;
  --pill-accent-2: #f0b84a;
}

.category-kpop {
  --pill-accent: #274c9f;
  --pill-accent-2: #d84875;
}

.category-beauty {
  --pill-accent: #2f8b57;
  --pill-accent-2: #f06f5c;
}

.category-duty-free {
  --pill-accent: #193b62;
  --pill-accent-2: #d8a73b;
}

.category-department-store {
  --pill-accent: #5d4a98;
  --pill-accent-2: #c78b38;
}

.category-shopping {
  --pill-accent: #146c94;
  --pill-accent-2: #49a078;
}

.category-travel-benefits {
  --pill-accent: #0d7f75;
  --pill-accent-2: #f1c75b;
}

.city-pill {
  min-height: 64px;
  padding: 8px 40px 8px 10px;
  border-radius: 8px;
}

.home-city-strip .city-pill {
  min-height: 62px;
  padding: 12px 40px 12px 12px;
  border-radius: 8px;
  background: var(--white);
}

.category-pill.has-media {
  grid-template-columns: 112px minmax(0, 1fr);
  min-height: 112px;
  padding: 12px 42px 12px 12px;
}

.home-category-strip .category-pill.has-media {
  min-height: 104px;
  padding: 12px 40px 12px 12px;
}

.city-pill.has-media {
  grid-template-columns: 78px minmax(0, 1fr);
  min-height: 82px;
  padding: 10px 38px 10px 10px;
}

.home-city-strip .city-pill.has-media {
  min-height: 82px;
}

.pill-media {
  position: relative;
  display: block;
  width: 100%;
  height: 88px;
  overflow: hidden;
  border-radius: 6px;
  background: #e9eef5;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}

.home-category-strip .pill-media {
  height: 80px;
}

.city-pill .pill-media {
  height: 58px;
}

.pill-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pill-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.54));
}

.pill-media > span {
  position: absolute;
  left: 7px;
  right: 7px;
  bottom: 7px;
  z-index: 1;
  overflow: hidden;
  color: var(--white);
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1.15;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.category-pill::after,
.city-pill::after {
  content: ">";
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  color: var(--pill-accent, var(--teal-dark));
  background: color-mix(in srgb, var(--pill-accent, var(--teal)) 10%, white);
  font-size: 0.78rem;
  font-weight: 900;
}

.city-pill::after {
  color: var(--teal-dark);
  background: var(--surface-blue);
}

.pill-marker {
  display: grid;
  place-items: center;
  position: relative;
  z-index: 1;
  width: 50px;
  height: 50px;
  border-radius: 999px;
  color: var(--white);
  background: var(--pill-accent, var(--teal));
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
}

.home-category-strip .pill-marker {
  width: 42px;
  height: 42px;
  font-size: 0.9rem;
}

.city-pill .pill-marker {
  width: 28px;
  height: 28px;
  background: var(--teal-dark);
  font-size: 0.78rem;
}

.home-city-strip .city-pill .pill-marker {
  width: 34px;
  height: 34px;
  font-size: 0.82rem;
}

.pill-copy {
  display: grid;
  gap: 2px;
  position: relative;
  z-index: 1;
  min-width: 0;
  padding-right: 22px;
}

.category-pill strong,
.city-pill strong {
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.category-pill strong {
  font-size: 1.14rem;
}

.home-category-strip .category-pill strong {
  font-size: 1rem;
}

.city-pill strong {
  font-size: 0.95rem;
  white-space: normal;
}

.pill-copy span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 760;
}

.pill-copy em {
  display: -webkit-box;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 680;
  line-height: 1.28;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.category-pill:hover,
.city-pill:hover {
  border-color: #a9c3ef;
  background: #f7fbff;
  box-shadow: var(--control-shadow);
  transform: translateY(-1px);
}

.city-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 18px;
}

.city-stat {
  display: grid;
  gap: 4px;
  min-height: 92px;
  align-content: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.city-stat strong {
  font-size: 1.9rem;
  line-height: 1;
}

.city-stat span {
  color: var(--muted);
  font-weight: 760;
}

.route-mini-list {
  display: grid;
  gap: 10px;
}

.route-mini-list a {
  display: grid;
  gap: 3px;
  padding: 12px;
  border: 1px solid #e7ece9;
  border-radius: 8px;
  background: #fbfcfa;
}

.route-mini-list span {
  color: var(--muted);
  font-size: 0.88rem;
}

.city-gallery {
  margin-top: 18px;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.event-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(18, 32, 38, 0.06);
}

.event-card.is-hidden {
  display: none;
}

.calendar-item.is-hidden,
.month-block.is-hidden {
  display: none;
}

.event-thumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #e8ece9;
}

.event-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18, 32, 38, 0.08), rgba(18, 32, 38, 0.74)),
    linear-gradient(90deg, rgba(18, 32, 38, 0.42), rgba(18, 32, 38, 0));
  pointer-events: none;
}

.event-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 180ms ease;
}

.event-card:hover .event-thumb img {
  transform: scale(1.03);
}

.thumb-overlay {
  position: absolute;
  z-index: 2;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display: grid;
  gap: 5px;
  color: var(--white);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.34);
}

.thumb-overlay strong {
  display: -webkit-box;
  overflow: hidden;
  font-size: clamp(0.98rem, 1.8vw, 1.18rem);
  line-height: 1.08;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.thumb-overlay span:last-child {
  display: -webkit-box;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.88);
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.18;
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.thumb-brand {
  justify-self: start;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.44);
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(18, 32, 38, 0.66);
  color: var(--white);
  font-size: 0.72rem;
  overflow-wrap: anywhere;
  font-weight: 900;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.badge {
  position: absolute;
  z-index: 3;
  top: 12px;
  left: 12px;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--white);
  background: var(--teal);
  font-size: 0.76rem;
  font-weight: 840;
}

.badge.upcoming {
  background: var(--blue);
}

.badge.ended {
  background: #6e7476;
}

.event-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 16px;
}

.event-meta {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 760;
}

.event-source-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 740;
  line-height: 1.25;
}

.event-source-row > span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.source-role-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  max-width: min(100%, 178px);
  overflow: hidden;
  border: 1px solid #c7d7ed;
  border-radius: 999px;
  padding: 5px 9px;
  color: var(--blue-dark);
  background: var(--surface-blue);
  font-size: 0.76rem;
  font-weight: 860;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.source-role-chip.listing,
.source-role-chip.ticketing {
  border-color: #d6c7eb;
  color: #433067;
  background: #f6f1ff;
}

.source-role-chip.offer {
  border-color: #c8dfd4;
  color: var(--teal-dark);
  background: #f2fbf7;
}

.save-event {
  min-height: 44px;
  width: 100%;
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(13, 127, 117, 0.3);
  border-radius: 999px;
  padding: 10px 14px;
  color: var(--teal-dark);
  background: #f5fbf8;
  font: inherit;
  font-weight: 820;
  cursor: pointer;
  line-height: 1.1;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.save-event::before {
  content: "+";
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  color: var(--white);
  background: var(--teal);
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1;
}

.save-event-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.save-event:hover,
.save-event[aria-pressed="true"] {
  color: var(--white);
  border-color: var(--teal-dark);
  background: var(--teal-dark);
  box-shadow: 0 10px 20px rgba(7, 83, 77, 0.16);
  transform: translateY(-1px);
}

.save-event:hover::before,
.save-event[aria-pressed="true"]::before {
  color: var(--teal-dark);
  background: var(--white);
}

.detail-actions .save-event {
  width: auto;
  min-width: 142px;
  margin-top: 0;
  padding-inline: 16px;
  background: var(--white);
}

.detail-actions > .button,
.detail-actions > .save-event {
  flex: 1 1 188px;
  max-width: 270px;
}

.detail-actions .save-event[aria-pressed="true"] {
  color: var(--white);
  border-color: var(--teal-dark);
  background: var(--teal-dark);
}

.detail-actions .save-event[aria-pressed="true"]::before {
  color: var(--teal-dark);
  background: var(--white);
}

.event-body h3 {
  margin: 8px 0;
  font-size: 1.18rem;
  line-height: 1.18;
}

.event-body p,
.guide-card p,
.source-table p,
.split-band p,
.detail-section p,
.article-page p {
  color: var(--muted);
}

.compact-facts {
  display: grid;
  gap: 8px;
  margin: auto 0 0;
  padding-top: 14px;
}

.compact-facts div {
  display: grid;
  gap: 2px;
}

.compact-facts dt {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 820;
  text-transform: uppercase;
}

.compact-facts dd {
  margin: 0;
  font-weight: 760;
}

.event-plan-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.event-plan-tools span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  max-width: 100%;
  border: 1px solid #dce7e4;
  border-radius: 999px;
  padding: 5px 9px;
  color: #315271;
  background: #f8fbfc;
  font-size: 0.75rem;
  font-weight: 820;
  line-height: 1.15;
  white-space: nowrap;
}

.freshness-chip {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  min-height: 26px;
  padding: 5px 8px;
  border: 1px solid #b7ded5;
  border-radius: 999px;
  color: #0b625b;
  background: #eaf7f2;
  font-size: 0.76rem;
  font-weight: 840;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.freshness-chip.current {
  color: #315271;
  border-color: #c1d6eb;
  background: #eef6ff;
}

.freshness-chip.soon {
  color: #73511d;
  border-color: #f2d38f;
  background: #fff7df;
}

.freshness-chip.stale,
.freshness-chip.archive {
  color: #7c2c2c;
  border-color: #efb4b4;
  background: #fff0f0;
}

.split-band {
  width: min(1220px, calc(100% - 32px));
  margin: 0 auto 72px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  background: transparent;
  border: 0;
}

.split-band > div {
  padding: clamp(24px, 4vw, 38px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.split-band > div:nth-child(2) {
  background: var(--white);
}

.page {
  padding: 38px 0 76px;
}

.page-hero {
  padding: clamp(26px, 5vw, 52px) 0 28px;
}

.page-hero.compact h1 {
  max-width: 18ch;
  font-size: clamp(2rem, 4.4vw, 4.2rem);
  line-height: 1.05;
}

.page-hero p {
  max-width: 760px;
  color: var(--muted);
  font-size: 1.08rem;
}

.calendar-list,
.source-table {
  display: grid;
  gap: 18px;
}

.calendar-filterable .gallery-tools {
  margin-bottom: 0;
}

.now-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.now-dashboard {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 18px;
}

.now-dashboard div {
  display: grid;
  gap: 4px;
  min-height: 120px;
  align-content: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.now-dashboard strong {
  font-size: 2rem;
  line-height: 1;
}

.now-dashboard span {
  font-weight: 820;
  line-height: 1.18;
}

.now-dashboard em {
  color: var(--muted);
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 720;
  line-height: 1.25;
}

.now-feed-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px;
}

.now-feed-links a {
  min-height: 40px;
  display: inline-grid;
  align-items: center;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--teal-dark);
  background: #fbfcfa;
  font-weight: 800;
}

.now-feed-links a:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #edf7f3;
}

.recheck-panel {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fffdf8;
}

.recheck-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.recheck-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 14px;
  border: 1px solid #e9dcc6;
  border-radius: 8px;
  background: var(--white);
}

.recheck-card > span {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: #fff5df;
  color: #705021;
  font-size: 0.76rem;
  font-weight: 850;
  text-transform: uppercase;
}

.recheck-card strong,
.recheck-card a {
  overflow-wrap: anywhere;
}

.recheck-card em,
.recheck-card small {
  color: var(--muted);
  font-style: normal;
  font-weight: 720;
  line-height: 1.35;
}

.recheck-card > a {
  color: var(--teal-dark);
  font-weight: 820;
}

.now-panel {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.now-panel h2 {
  margin: 0 0 4px;
  font-size: 1.24rem;
}

.now-item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 92px;
  padding: 10px;
  border: 1px solid #e8edea;
  border-radius: 8px;
  background: #fbfcfa;
}

.now-item:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #f3faf7;
}

.now-item img {
  width: 96px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 6px;
}

.now-item > span {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.now-item strong {
  line-height: 1.18;
}

.now-item em,
.now-item small {
  color: var(--muted);
  font-style: normal;
  font-weight: 680;
}

.now-item small {
  font-size: 0.8rem;
}

.empty-state {
  margin: 0;
  padding: 14px;
  border-radius: 8px;
  color: var(--muted);
  background: #f7f4ed;
  font-weight: 720;
}

.latest-checked-section {
  padding: 34px 0 0;
}

.latest-checked-section .section-head {
  align-items: start;
}

.latest-checked-section .section-head p:not(.eyebrow) {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--muted);
}

.month-block {
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.calendar-month-heading {
  display: grid;
  gap: 2px;
  align-items: start;
  margin: 0;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--line);
  font-size: clamp(1.5rem, 2.5vw, 2.1rem);
  line-height: 1.1;
}

.calendar-month-heading span {
  display: block;
  line-height: 1.05;
  white-space: nowrap;
}

.calendar-month-heading span:last-child {
  color: var(--muted);
  font-size: 0.72em;
  font-weight: 850;
}

.month-events {
  display: grid;
  gap: 10px;
}

.calendar-item {
  display: grid;
  grid-template-columns: 170px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid #e8edea;
  border-radius: 8px;
  background: #fbfcfa;
}

.date-pill {
  display: grid;
  gap: 2px;
  color: var(--teal-dark);
  font-weight: 850;
}

.date-pill small,
.calendar-item em,
.calendar-weather {
  color: var(--muted);
  font-style: normal;
  font-weight: 650;
}

.calendar-weather {
  display: block;
  margin: 3px 0;
  font-size: 0.78rem;
  line-height: 1.35;
}

.calendar-item b {
  padding: 6px 9px;
  border-radius: 8px;
  color: var(--white);
  background: var(--teal);
  font-size: 0.78rem;
}

.calendar-item b.upcoming {
  background: var(--blue);
}

.calendar-item b.ended {
  background: #6e7476;
}

.detail-layout {
  display: grid;
  gap: 24px;
}

.detail-hero {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  gap: 28px;
  align-items: center;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.detail-hero img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 8px;
}

.detail-hero h1 {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(2.2rem, 5vw, 5.2rem);
  line-height: 0.98;
}

.detail-hero p {
  color: var(--muted);
  font-size: 1.08rem;
}

.detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.handoff-note {
  margin: 12px 0 0;
  max-width: 720px;
  color: #344054;
  font-size: 0.94rem;
  line-height: 1.5;
}

.fact-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 10px;
  border-radius: 8px;
}

.fact {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  grid-template-areas:
    "icon label"
    "icon value";
  column-gap: 10px;
  row-gap: 3px;
  grid-column: span 3;
  min-height: 86px;
  align-content: center;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  box-shadow: 0 8px 18px rgba(6, 58, 116, 0.04);
}

.fact-calendar {
  grid-column: span 3;
}

.fact-pin {
  grid-column: span 4;
}

.fact-place {
  grid-column: span 2;
}

.fact-check {
  grid-column: span 3;
}

.fact-review,
.fact-basis {
  grid-column: span 3;
}

.fact-icon {
  grid-area: icon;
  position: relative;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid #bfd0e6;
  border-radius: 8px;
  color: var(--teal-dark);
  background: #f1f6ff;
}

.fact-icon::before {
  content: "";
  width: 12px;
  height: 12px;
  border: 3px solid currentColor;
  border-radius: 50%;
}

.fact-calendar .fact-icon::before,
.fact-check .fact-icon::before {
  width: 14px;
  height: 14px;
  border-radius: 4px;
}

.fact-calendar .fact-icon::after,
.fact-check .fact-icon::after {
  content: "";
  position: absolute;
  top: 9px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 2px;
  background: currentColor;
}

.fact-pin .fact-icon::before,
.fact-place .fact-icon::before {
  width: 13px;
  height: 13px;
  border-radius: 50% 50% 50% 2px;
  transform: rotate(-45deg);
}

.fact-shield .fact-icon::before {
  width: 13px;
  height: 15px;
  border-radius: 7px 7px 9px 9px;
}

.fact-review .fact-icon::before,
.fact-basis .fact-icon::before {
  width: 14px;
  height: 10px;
  border-radius: 3px;
}

.fact-pulse .fact-icon::before {
  width: 10px;
  height: 10px;
  border-width: 0;
  background: var(--green);
  box-shadow: 0 0 0 6px rgba(0, 138, 112, 0.13);
}

.fact-label {
  grid-area: label;
}

.fact strong {
  grid-area: value;
  overflow-wrap: anywhere;
  font-size: 0.98rem;
  line-height: 1.32;
}

.fact-label {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.fact-review strong,
.fact-shield strong,
.fact-basis strong {
  color: #34445a;
  font-size: 0.95rem;
  font-weight: 800;
}

.detail-section {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.detail-section.two-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

.detail-section-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: start;
}

.detail-section-head .eyebrow {
  margin-bottom: 6px;
}

.detail-section-head h2 {
  margin: 0;
}

.detail-section-head > p {
  max-width: 36rem;
  margin: 0;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.45;
}

.detail-section ul {
  padding-left: 20px;
}

.visitor-action-section {
  padding: 0;
  overflow: hidden;
}

.visitor-action-section .detail-section-head {
  padding: 22px 22px 0;
}

.visitor-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.visitor-action-grid article {
  display: grid;
  gap: 8px;
  min-height: 172px;
  align-content: start;
  padding: 20px 22px;
  border-right: 1px solid var(--line);
  background: linear-gradient(180deg, #ffffff, #fbfdff);
}

.visitor-action-grid article:last-child {
  border-right: 0;
}

.visitor-action-grid span {
  color: var(--blue);
  font-size: 0.78rem;
  font-weight: 900;
}

.visitor-action-grid strong {
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.22;
}

.visitor-action-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.48;
}

.visitor-action-grid em {
  align-self: end;
  margin-top: 4px;
  color: var(--blue-dark);
  font-style: normal;
  font-weight: 850;
  line-height: 1.25;
  word-break: keep-all;
}

.source-transparency-section {
  display: grid;
  gap: 18px;
}

.source-transparency-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.source-transparency-grid div {
  display: grid;
  gap: 8px;
  min-height: 154px;
  align-content: start;
  padding: 18px 20px;
  border-right: 1px solid var(--line);
  background: linear-gradient(180deg, #ffffff, #fbfdff);
}

.source-transparency-grid div:last-child {
  border-right: 0;
}

.source-transparency-grid span {
  color: var(--blue);
  font-size: 0.78rem;
  font-weight: 900;
}

.source-transparency-grid strong {
  color: var(--ink);
  font-size: 1.04rem;
  line-height: 1.22;
}

.source-transparency-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.48;
}

.source-transparency-grid em {
  margin-top: 2px;
  color: var(--blue-dark);
  font-style: normal;
  font-weight: 850;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.source-boundary-callout {
  display: grid;
  gap: 6px;
  padding: 16px 20px;
  border-top: 1px solid var(--line);
  background: #f7faff;
}

.source-boundary-callout strong {
  color: var(--blue-dark);
  font-size: 0.9rem;
  line-height: 1.25;
}

.source-boundary-callout p {
  margin: 0;
  color: #344054;
  font-size: 0.94rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.localized-visitor-brief {
  padding: 0;
  overflow: hidden;
  background: #ffffff;
}

.localized-visitor-brief .detail-section-head {
  padding: 22px 22px 0;
}

.localized-brief-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.localized-brief-grid article {
  display: grid;
  gap: 8px;
  min-height: 178px;
  align-content: start;
  padding: 20px;
  border-right: 1px solid var(--line);
  background: linear-gradient(180deg, #ffffff, #fbfdff);
}

.localized-brief-grid article:last-child {
  border-right: 0;
}

.localized-brief-grid span {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  color: var(--white);
  background: var(--blue-dark);
  font-size: 0.72rem;
  font-weight: 900;
}

.localized-brief-grid strong {
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.18;
}

.localized-brief-grid p {
  margin: 0;
  color: #475467;
  font-size: 0.92rem;
  line-height: 1.52;
  overflow-wrap: anywhere;
}

.localized-original-name {
  margin: 0;
  padding: 14px 20px 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.localized-original-name strong {
  color: var(--ink);
}

.weather-detail-section {
  display: grid;
  gap: 18px;
}

.weather-detail-section h2 {
  margin: 0;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  line-height: 1.05;
}

.weather-overview {
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
  gap: 12px;
}

.weather-takeaway,
.weather-metrics {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
}

.weather-takeaway {
  display: grid;
  gap: 8px;
  align-content: center;
  padding: 20px;
  background: linear-gradient(145deg, #eef5ff, #ffffff 76%);
}

.weather-takeaway span,
.weather-metric span,
.weather-source-line strong {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 850;
  text-transform: uppercase;
}

.weather-takeaway strong {
  color: var(--teal-dark);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  line-height: 1.08;
}

.weather-takeaway p {
  margin: 0;
  color: #3e4d5f;
  font-weight: 700;
  line-height: 1.45;
}

.weather-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.weather-metric {
  display: grid;
  gap: 5px;
  min-height: 112px;
  align-content: center;
  padding: 16px;
  background: linear-gradient(145deg, #ffffff, #f8fbff);
}

.weather-metric strong {
  color: var(--ink);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.weather-metric em {
  color: #4e5e70;
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 760;
  overflow-wrap: anywhere;
}

.forecast-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: 1px;
  overflow: hidden;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--line);
}

.forecast-card {
  display: grid;
  gap: 10px;
  min-height: 158px;
  padding: 14px;
  background: #fbfcff;
}

.forecast-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(74px, auto);
  gap: 10px;
  align-items: start;
}

.forecast-card-head div,
.forecast-card-head p {
  display: grid;
  gap: 3px;
  margin: 0;
}

.forecast-card-head strong {
  font-size: 1rem;
  line-height: 1.1;
}

.forecast-card-head span,
.forecast-period span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 820;
}

.forecast-card-head p {
  justify-items: end;
  text-align: right;
}

.forecast-card-head b {
  font-size: 1.05rem;
  white-space: nowrap;
}

.forecast-card-head p > span {
  white-space: nowrap;
}

.forecast-card-head em {
  font-style: normal;
}

.forecast-card-head .low {
  color: #2767e7;
}

.forecast-card-head .high {
  color: #d9272f;
}

.forecast-condition {
  display: flex;
  gap: 10px;
  align-items: center;
  min-height: 42px;
  padding: 7px 0;
}

.forecast-condition div {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.forecast-condition strong {
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.forecast-condition span:not(.weather-symbol) {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.forecast-periods {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.forecast-period {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  min-height: 40px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 8px;
  background: #f5f8f7;
}

.forecast-period strong {
  color: #2767e7;
  font-size: 0.92rem;
  line-height: 1;
}

.forecast-period.missing strong {
  color: var(--muted);
}

.weather-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.weather-tags span {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 7px 11px;
  border: 1px solid #cfdbea;
  border-radius: 999px;
  color: var(--teal-dark);
  background: #f4f8ff;
  font-size: 0.86rem;
  font-weight: 820;
}

.weather-source-line {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #d9e2ef;
  border-radius: 8px;
  background: #f8fbff;
  color: #4e5e70;
}

.weather-source-line span {
  font-weight: 720;
  line-height: 1.45;
}

.weather-symbol {
  position: relative;
  display: inline-block;
  width: 34px;
  height: 28px;
  z-index: 0;
}

.weather-symbol.sun::before,
.weather-symbol.empty::before {
  position: absolute;
  content: "";
  width: 25px;
  height: 25px;
  top: 1px;
  left: 4px;
  border-radius: 999px;
  background: #ffc116;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.8);
}

.weather-symbol.cloud::before,
.weather-symbol.rain::before,
.weather-symbol.snow::before {
  position: absolute;
  content: "";
  width: 28px;
  height: 15px;
  left: 3px;
  bottom: 5px;
  border-radius: 999px;
  background: #e7ebf2;
  box-shadow:
    8px -8px 0 -1px #f0f3f8,
    15px -3px 0 -2px #e9edf4;
  z-index: 1;
}

.weather-symbol.cloud::after,
.weather-symbol.rain::after,
.weather-symbol.snow::after {
  position: absolute;
  content: "";
  width: 15px;
  height: 15px;
  left: 0;
  top: 1px;
  border-radius: 999px;
  background: #ffc116;
  z-index: 0;
}

.weather-symbol.rain {
  height: 32px;
}

.weather-symbol.rain::after {
  width: 24px;
  height: 10px;
  left: 7px;
  top: 22px;
  border-radius: 0;
  background:
    linear-gradient(115deg, transparent 0 28%, #2f77e8 30% 42%, transparent 44% 100%),
    linear-gradient(115deg, transparent 0 58%, #2f77e8 60% 72%, transparent 74% 100%);
  box-shadow: none;
  z-index: 0;
}

.weather-symbol.snow::after {
  width: 24px;
  height: 8px;
  left: 6px;
  top: 23px;
  border-radius: 0;
  background:
    radial-gradient(circle at 4px 4px, #84aee9 0 2px, transparent 3px),
    radial-gradient(circle at 13px 5px, #84aee9 0 2px, transparent 3px),
    radial-gradient(circle at 21px 3px, #84aee9 0 2px, transparent 3px);
  box-shadow: none;
  z-index: 0;
}

.weather-symbol.empty::before {
  width: 24px;
  height: 2px;
  top: 13px;
  background: #a8b2b5;
  box-shadow: none;
}

.visitor-info-section {
  display: grid;
  gap: 22px;
}

.visitor-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.visitor-info-item,
.venue-schedule-list article {
  display: grid;
  gap: 7px;
  padding: 15px;
  border: 1px solid #e7ece9;
  border-radius: 8px;
  background: #fbfcfa;
}

.visitor-info-item {
  min-height: 90px;
}

.visitor-info-item span,
.venue-schedule-list span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.visitor-info-item strong,
.venue-schedule-list strong {
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.visitor-info-item a {
  color: var(--teal-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.venue-schedule,
.official-highlights {
  display: grid;
  gap: 12px;
}

.venue-schedule h3,
.official-highlights h3 {
  margin: 0;
  font-size: 1rem;
}

.venue-schedule-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.venue-schedule-list p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.official-highlights ul {
  display: grid;
  gap: 8px;
  margin: 0;
}

.map-links-section {
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
  gap: 22px;
  align-items: start;
}

.map-place {
  display: grid;
  gap: 4px;
  margin: 8px 0 10px;
}

.map-place strong {
  font-size: 1.08rem;
  line-height: 1.3;
}

.map-place span {
  color: var(--muted);
  font-size: 0.94rem;
  font-weight: 720;
  line-height: 1.35;
}

.map-link-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.map-link-list.has-campaign {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.map-link-list a {
  display: grid;
  gap: 4px;
  min-height: 78px;
  align-content: center;
  padding: 14px;
  border: 1px solid #e7ece9;
  border-radius: 8px;
  background: var(--white);
}

.map-link-list a:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #f3faf7;
}

.map-link-list span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.28;
}

.route-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.route-card {
  display: grid;
  gap: 10px;
  padding: 18px;
  border: 1px solid #e7ece9;
  border-radius: 8px;
  background: #fbfcfa;
}

.route-card:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #f3faf7;
}

.route-card span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 760;
}

.route-card h3 {
  margin: 0;
  font-size: 1.08rem;
  line-height: 1.2;
}

.route-card ol,
.route-card ul {
  margin: 0;
  padding-left: 20px;
}

.wide-route-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.stop-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 22px;
}

.stop-list li {
  padding: 10px 0;
  border-bottom: 1px solid #e8edea;
}

.meta-note,
.notice,
.source-note {
  margin: 10px 0 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted) !important;
  font-size: 0.86rem;
  font-weight: 680;
  line-height: 1.45;
}

.notice {
  padding-left: 12px;
  border-left: 3px solid var(--line);
}

.guide-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.guide-grid.wide {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.guide-card {
  display: grid;
  gap: 8px;
  min-height: 190px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.guide-card span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.guide-card strong {
  font-size: 1.1rem;
  line-height: 1.2;
}

.article-page {
  width: min(840px, 100%);
  margin: 0 auto;
  padding: clamp(26px, 5vw, 58px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.article-page h1 {
  max-width: 16ch;
  font-size: clamp(2.1rem, 5vw, 4.2rem);
}

.article-page .lede {
  font-size: 1.15rem;
}

.article-page h2 {
  margin-top: 32px;
  font-size: 1.35rem;
}

.guide-detail-page {
  display: grid;
  gap: 26px;
}

.guide-detail-page .article-page {
  margin-bottom: 0;
}

.guide-decision-panel {
  display: grid;
  grid-template-columns: minmax(260px, 0.74fr) minmax(0, 1.26fr);
  gap: 18px;
  align-items: stretch;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.guide-decision-head {
  display: grid;
  align-content: start;
  gap: 8px;
}

.guide-decision-head h2,
.guide-related-section h2,
.guide-source-strip h2 {
  margin: 0;
  font-size: clamp(1.65rem, 3vw, 2.4rem);
  line-height: 1.08;
}

.guide-decision-head p:not(.eyebrow),
.guide-related-section .section-head p,
.guide-source-strip p {
  margin: 0;
  color: var(--muted);
  font-weight: 680;
  line-height: 1.5;
}

.guide-decision-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.guide-decision-grid article {
  display: grid;
  gap: 9px;
  align-content: start;
  min-height: 170px;
  padding: 17px;
  border: 1px solid #dfe7f2;
  border-radius: 8px;
  background: var(--white);
}

.guide-decision-grid span {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  color: var(--blue-dark);
  background: var(--surface-blue);
  font-size: 0.76rem;
  font-weight: 900;
}

.guide-decision-grid strong {
  font-size: 1.04rem;
  line-height: 1.22;
}

.guide-decision-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 0.93rem;
  line-height: 1.46;
}

.guide-related-section {
  display: grid;
  gap: 18px;
  padding-top: 8px;
}

.guide-related-section .section-head {
  margin-bottom: 0;
}

.guide-event-grid {
  align-items: stretch;
}

.guide-event-grid .event-card {
  height: 100%;
}

.guide-source-strip {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.15fr);
  gap: 18px;
  align-items: start;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.guide-source-strip > div:first-child {
  display: grid;
  gap: 8px;
}

.guide-source-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.guide-source-list a {
  display: grid;
  gap: 4px;
  min-height: 86px;
  align-content: center;
  padding: 14px;
  border: 1px solid #e7ece9;
  border-radius: 8px;
  background: #fbfcfa;
}

.guide-source-list a:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #f3faf7;
}

.guide-source-list strong,
.guide-source-list span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.guide-source-list span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 720;
  line-height: 1.35;
}

.source-table article {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.3fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.source-table article div {
  display: grid;
  gap: 4px;
}

.source-table span {
  color: var(--muted);
  font-size: 0.88rem;
}

.source-table a {
  color: var(--teal-dark);
  font-weight: 850;
}

.source-copy {
  align-content: center;
}

.source-copy p {
  margin: 0;
}

.source-alternates {
  color: var(--muted);
  font-size: 0.84rem;
}

.source-alternates summary {
  cursor: pointer;
  color: var(--teal-dark);
  font-weight: 820;
}

.source-alternates ul {
  display: grid;
  gap: 6px;
  margin: 8px 0 0;
  padding-left: 18px;
}

.source-alternates a {
  overflow-wrap: anywhere;
  font-weight: 700;
}

.split-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.split-links a {
  display: grid;
  gap: 6px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.split-links span {
  color: var(--muted);
}

.watch-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.watch-stats div {
  display: grid;
  gap: 4px;
  min-height: 94px;
  align-content: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.watch-stats strong {
  font-size: 2rem;
  line-height: 1;
}

.watch-stats span {
  color: var(--muted);
  font-weight: 760;
}

.source-refresh-panel {
  display: grid;
  gap: 16px;
  margin: 18px 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.source-refresh-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
}

.source-refresh-head h2 {
  margin: 4px 0 8px;
  font-size: 1.45rem;
}

.source-refresh-head p,
.source-refresh-head small {
  color: var(--muted);
}

.source-refresh-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.source-refresh-stats div {
  display: grid;
  gap: 4px;
  min-height: 88px;
  align-content: center;
  padding: 12px;
  border: 1px solid #e8edea;
  border-radius: 8px;
  background: #fbfcfa;
}

.source-refresh-stats strong {
  font-size: 1.45rem;
  line-height: 1;
}

.source-refresh-stats span,
.source-refresh-columns span {
  color: var(--muted);
  font-size: 0.84rem;
}

.source-refresh-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.source-refresh-columns article {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #e8edea;
  border-radius: 8px;
  background: #fbfcfa;
}

.source-refresh-columns h3 {
  margin: 0;
  font-size: 1rem;
}

.source-refresh-columns ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.source-refresh-columns li {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.source-refresh-columns a,
.source-refresh-columns strong {
  overflow-wrap: anywhere;
  color: var(--teal-dark);
  font-weight: 840;
}

.source-refresh-rule {
  margin: 0;
  padding: 12px;
  border-radius: 8px;
  background: #fff5df;
  color: #705021;
  font-weight: 720;
}

.watch-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.watch-card {
  display: grid;
  gap: 12px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.watch-card > span {
  color: var(--coral);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.watch-card h2,
.watch-pipeline h2 {
  margin: 0;
  font-size: 1.28rem;
  line-height: 1.18;
}

.watch-card p,
.watch-pipeline p {
  margin: 0;
  color: var(--muted);
}

.watch-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.watch-card dl div {
  display: grid;
  gap: 2px;
  padding: 10px;
  border: 1px solid #e8edea;
  border-radius: 8px;
  background: #fbfcfa;
}

.watch-card dt {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 820;
  text-transform: uppercase;
}

.watch-card dd {
  margin: 0;
  font-weight: 780;
}

.watch-card ul,
.watch-pipeline ol {
  display: grid;
  gap: 9px;
  margin: 0;
  padding-left: 18px;
}

.watch-card li small {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
}

.watch-card a,
.queue-list a strong {
  color: var(--teal-dark);
  font-weight: 850;
}

.watch-pipeline {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 14px;
  margin-top: 18px;
}

.watch-pipeline > div {
  display: grid;
  gap: 14px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.queue-list {
  display: grid;
  gap: 10px;
}

.queue-list a {
  display: grid;
  gap: 3px;
  padding: 12px;
  border: 1px solid #e8edea;
  border-radius: 8px;
  background: #fbfcfa;
}

.queue-list span,
.queue-list em {
  color: var(--muted);
  font-size: 0.84rem;
  font-style: normal;
}

.freshness-list {
  display: grid;
  gap: 12px;
}

.freshness-list article {
  display: grid;
  grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.2fr) auto;
  gap: 18px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.freshness-list article > div {
  display: grid;
  gap: 3px;
}

.freshness-list span,
.freshness-list em {
  color: var(--muted);
  font-size: 0.84rem;
  font-style: normal;
  font-weight: 720;
}

.freshness-list .freshness-chip {
  margin-top: 6px;
  color: #0b625b;
  font-size: 0.76rem;
  font-weight: 840;
}

.freshness-list .freshness-chip.current {
  color: #315271;
}

.freshness-list .freshness-chip.soon {
  color: #73511d;
}

.freshness-list .freshness-chip.stale,
.freshness-list .freshness-chip.archive {
  color: #7c2c2c;
}

.freshness-list p {
  margin: 0;
  color: var(--muted);
}

.freshness-list article > a {
  color: var(--teal-dark);
  font-weight: 850;
}

.site-footer {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  padding: 34px clamp(18px, 4vw, 56px);
  border-top: 1px solid var(--line);
  background: var(--ink);
  color: var(--white);
}

.site-footer p {
  max-width: 640px;
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.72);
}

.footer-links a {
  color: rgba(255, 255, 255, 0.82);
}

.saved-planner {
  position: fixed;
  left: 50%;
  bottom: 16px;
  z-index: 30;
  display: grid;
  grid-template-columns: minmax(190px, 0.8fr) minmax(0, 1.2fr) auto;
  gap: 10px;
  align-items: center;
  width: min(980px, calc(100% - 28px));
  padding: 12px;
  border: 1px solid rgba(13, 127, 117, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow);
  transform: translateX(-50%);
}

.saved-planner[hidden] {
  display: none;
}

.saved-planner > div:first-child {
  display: grid;
  gap: 2px;
}

.saved-planner strong {
  line-height: 1.15;
}

.saved-planner span {
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 720;
}

.saved-planner-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.saved-planner-item {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #e7ece9;
  border-radius: 8px;
  background: #fbfcfa;
}

.saved-planner-item strong,
.saved-planner-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.saved-clear {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 10px;
  color: var(--teal-dark);
  background: var(--white);
  font: inherit;
  font-weight: 820;
  cursor: pointer;
}

.saved-clear:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #edf7f3;
}

.saved-planner-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: end;
}

.saved-open,
.planner-card-actions a,
.planner-card-actions button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--teal-dark);
  background: var(--white);
  font: inherit;
  font-weight: 820;
  cursor: pointer;
}

.saved-open:hover,
.planner-card-actions a:hover,
.planner-card-actions button:hover {
  border-color: rgba(13, 127, 117, 0.44);
  background: #edf7f3;
}

.button:disabled,
.planner-card-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.page-hero.compact h1 {
  max-width: 16ch;
}

.planner-board {
  display: grid;
  gap: 18px;
}

.planner-utility {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.planner-utility article {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: var(--white);
}

.planner-utility span {
  color: var(--orange);
  font-size: 0.78rem;
  font-weight: 880;
  text-transform: uppercase;
}

.planner-utility strong {
  color: var(--ink);
  font-size: 1.02rem;
  line-height: 1.18;
}

.planner-utility p {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 680;
  line-height: 1.45;
}

.planner-empty {
  display: grid;
  gap: 4px;
  padding: 18px;
  border: 1px dashed rgba(13, 127, 117, 0.42);
  border-radius: 8px;
  background: #fbfcfa;
}

.planner-empty[hidden] {
  display: none;
}

.planner-empty span {
  color: var(--muted);
  font-weight: 720;
}

.planner-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.planner-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 10px 24px rgba(18, 32, 38, 0.06);
}

.planner-card-meta {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 820;
  text-transform: uppercase;
}

.planner-card > strong {
  line-height: 1.18;
  font-size: 1.08rem;
}

.planner-card > span {
  color: var(--muted);
  font-weight: 720;
}

.planner-card-map {
  display: grid;
  gap: 8px;
  border: 1px solid #e3ebe8;
  border-radius: 8px;
  padding: 10px;
  background: #fbfcfa;
}

.planner-card-map > span {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 780;
  overflow-wrap: anywhere;
}

.planner-card-map-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.planner-card-map-links a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d9e6e2;
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--blue-dark);
  background: var(--white);
  font-size: 0.82rem;
  font-weight: 820;
}

.planner-card-map-links a:hover {
  border-color: #b9cce4;
  background: var(--surface-blue);
}

.planner-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

@media (prefers-reduced-motion: reduce) {
  .spotlight-card,
  .spotlight-card img,
  .button,
  .filter-bar button {
    transition: none;
  }
}

@media (max-width: 980px) {
  .site-header {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
  }

  .service-hero-inner {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .service-visual {
    max-width: 720px;
  }

  .planning-layer-inner {
    grid-template-columns: 1fr;
  }

  .difference-grid,
  .difference-proof-grid {
    grid-template-columns: 1fr;
  }

  .difference-proof-grid div {
    border-right: 0;
    border-bottom: 1px solid #d9e3f2;
  }

  .difference-proof-grid div:last-child {
    border-bottom: 0;
  }

  .top-nav {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .top-nav::-webkit-scrollbar {
    display: none;
  }

  .top-nav a {
    flex: 0 0 auto;
  }

  .section-head,
  .detail-hero,
  .guide-decision-panel,
  .guide-source-strip,
  .month-block,
  .split-band,
  .split-links,
  .site-footer {
    grid-template-columns: 1fr;
  }

  .gallery-grid,
  .guide-grid,
  .guide-grid.wide,
  .fact-grid,
  .guide-source-list,
  .route-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fact,
  .fact-review,
  .fact-basis {
    grid-column: span 1;
  }

  .fact-pin {
    grid-column: span 2;
  }

  .watch-stats,
  .watch-grid,
  .watch-pipeline,
  .source-refresh-columns {
    grid-template-columns: 1fr;
  }

  .source-refresh-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .now-dashboard {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .now-grid {
    grid-template-columns: 1fr;
  }

  .recheck-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .category-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .browse-head {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: start;
  }

  .home-category-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-city-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .city-dashboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gallery-tools {
    grid-template-columns: minmax(0, 1fr) minmax(150px, 0.5fr);
  }

  .gallery-tools.has-city-filter {
    grid-template-columns: minmax(0, 1fr) minmax(150px, 0.5fr);
  }

  .clear-filters,
  .result-count {
    justify-content: start;
  }

  .gallery-tools .filter-bar {
    border-radius: 0;
  }

  .saved-planner {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .saved-planner-actions {
    justify-content: start;
  }

  .weather-overview {
    grid-template-columns: 1fr;
  }

  .planner-utility {
    grid-template-columns: 1fr;
  }

  .planner-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .site-header {
    grid-template-columns: auto minmax(0, auto);
    grid-template-areas:
      "brand language"
      "nav nav";
    gap: 8px 10px;
    padding: 8px 14px;
  }

  .brand {
    grid-area: brand;
  }

  .top-nav {
    grid-area: nav;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 6px;
  }

  .language-menu {
    grid-area: language;
    justify-self: end;
  }

  .top-nav a {
    min-height: 32px;
    padding: 6px 8px;
    font-size: 0.86rem;
  }

  .language-menu summary {
    min-height: 32px;
    padding: 6px 9px;
    font-size: 0.82rem;
  }

  .stats-band,
  .gallery-grid,
  .gallery-tools,
  .gallery-tools.has-city-filter,
  .guide-grid,
  .guide-grid.wide,
  .guide-decision-grid,
  .guide-source-list,
  .source-transparency-grid,
  .fact-grid,
  .visitor-info-grid,
  .venue-schedule-list,
  .visitor-action-grid,
  .localized-brief-grid,
  .difference-grid,
  .difference-proof-grid,
  .route-grid,
  .watch-stats,
  .source-refresh-stats,
  .watch-card dl,
  .planning-flow,
  .planning-layer-grid,
  .now-dashboard,
  .now-grid,
  .recheck-grid,
  .category-strip,
  .city-dashboard,
  .detail-section.two-col,
  .calendar-item,
  .source-table article,
  .freshness-list article,
  .map-links-section,
  .map-link-list,
  .map-link-list.has-campaign {
    grid-template-columns: 1fr;
  }

  .fact,
  .fact-pin,
  .fact-review,
  .fact-basis {
    grid-column: 1 / -1;
  }

  .fact {
    min-height: 84px;
    padding: 14px;
  }

  .service-difference {
    margin-top: 22px;
    padding: 24px 0;
  }

  .difference-card {
    min-height: 0;
    padding: 16px;
  }

  .difference-card li {
    overflow-wrap: anywhere;
  }

  .planning-flow-step,
  .visitor-action-grid article,
  .localized-brief-grid article,
  .source-transparency-grid div {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .planning-flow-step:last-child,
  .visitor-action-grid article:last-child,
  .localized-brief-grid article:last-child,
  .source-transparency-grid div:last-child {
    border-bottom: 0;
  }

  .visitor-action-section .detail-section-head {
    padding: 18px 18px 0;
  }

  .visitor-action-grid article,
  .localized-brief-grid article {
    padding: 18px;
  }

  .weather-metrics {
    grid-template-columns: 1fr;
  }

  .weather-metric {
    min-height: 88px;
    padding: 12px;
  }

  .weather-metric strong {
    font-size: 1.04rem;
  }

  .weather-metric em {
    font-size: 0.72rem;
    line-height: 1.25;
  }

  .weather-takeaway {
    padding: 14px;
  }

  .weather-takeaway strong {
    font-size: 1.28rem;
  }

  .source-refresh-head {
    display: grid;
  }

  .stats-band {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-hero-inner {
    width: min(100% - 28px, 1220px);
    padding: 34px 0 28px;
  }

  .spotlight-track,
  .spotlight-card,
  .spotlight-card img {
    min-height: 250px;
  }

  .spotlight-content strong {
    max-width: 16ch;
  }

  .spotlight-controls {
    grid-template-columns: 1fr;
  }

  .spotlight-arrow {
    display: none;
  }

  .spotlight-tabs {
    gap: 4px;
    flex-wrap: wrap;
    justify-content: center;
  }

  .spotlight-controls .spotlight-tab {
    width: 44px;
    min-height: 44px;
    justify-content: center;
  }

  .spotlight-nav-panel {
    gap: 8px;
    justify-content: center;
    padding: 5px 8px;
  }

  .spotlight-current-label {
    display: none;
  }

  .spotlight-count {
    display: none;
  }

  .service-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-summary div {
    min-height: 54px;
    padding: 10px;
  }

  .service-summary dd {
    font-size: 1.35rem;
  }

  .browse-directory {
    margin: 10px 0 28px;
    padding: 18px 0 4px;
  }

  .home-category-strip {
    grid-template-columns: 1fr;
  }

  .detail-section-head {
    display: grid;
  }

  .home-city-strip {
    grid-template-columns: 1fr;
  }

  .home-city-strip .city-pill {
    min-height: 58px;
  }

  .service-hero h1 {
    font-size: clamp(2.35rem, 13vw, 4.1rem);
  }

  .top-nav a {
    padding: 6px 8px;
  }

  .saved-planner {
    bottom: 10px;
    width: min(420px, calc(100% - 20px));
  }

  .saved-planner-list {
    grid-template-columns: 1fr;
  }

  .planner-grid {
    grid-template-columns: 1fr;
  }
}
