/* ─────────────────────────────────────────────────────────────────
   UzbekTrip — Main Stylesheet
   Palette & tokens first, then components top-to-bottom.
────────────────────────────────────────────────────────────────── */

:root {
  --gold:       #C9A84C;
  --gold-light: #E8C96D;
  --gold-deep:  #8A6D1F;  /* WCAG AA-passing gold for text on white/cream -- --gold itself is ~2.2:1, fails contrast as foreground text on light backgrounds */
  --lapis:      #1A3A6B;
  --lapis-mid:  #2B5499;
  --turquoise:  #2AABB8;
  --terracotta: #C4612A;
  --cream:      #FAF6EE;
  --ink:        #1A1510;
  --muted:      #6B6258;
  --border:     #E8DFD0;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; overflow-x: hidden; }

body {
  font-family: 'DM Sans', sans-serif;
  background: var(--cream);
  color: var(--ink);
  line-height: 1.6;
}

/* ── RICH TEXT DEFAULTS ─────────────────────────────────────────── */
.rich-text h2, .rich-text h3 {
  font-family: 'Cormorant Garamond', serif;
  margin: 2rem 0 0.75rem;
  color: var(--ink);
}
.rich-text h2 { font-size: 1.8rem; }
.rich-text h3 { font-size: 1.4rem; }
.rich-text p { margin-bottom: 1.25rem; line-height: 1.8; }
.rich-text a { color: var(--lapis-mid); text-decoration: underline; }
.rich-text ul, .rich-text ol { margin: 0 0 1.25rem 1.5rem; }
.rich-text li { margin-bottom: 0.4rem; }
.rich-text blockquote {
  border-left: 3px solid var(--gold);
  padding: 0.75rem 1.25rem;
  margin: 1.5rem 0;
  color: var(--muted);
  font-style: italic;
}
.rich-text img { max-width: 100%; border-radius: 4px; }

/* ── NAVIGATION ─────────────────────────────────────────────────── */
.main-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(26, 21, 16, 0.96);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(201, 168, 76, 0.2);
}

.nav-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 2rem; height: 64px;
}

.logo {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.6rem; font-weight: 700;
  color: var(--gold-light);
  text-decoration: none;
  letter-spacing: 0.02em;
}
.logo span { color: white; }
.logo-img { height: 46px; width: auto; display: block; }
.footer-brand .logo-img { height: 48px; }

.nav-links {
  display: flex; gap: 2rem; list-style: none;
}
.nav-links a {
  color: rgba(255,255,255,0.8);
  text-decoration: none; font-size: 0.875rem;
  font-weight: 500; letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: color 0.2s;
}
.nav-links a:hover { color: var(--gold-light); }

.nav-right { display: flex; align-items: center; gap: 1rem; }

.nav-burger {
  display: none;
  flex-direction: column; justify-content: center; gap: 5px;
  background: none; border: none; cursor: pointer;
  padding: 0.5rem; margin: -0.5rem;
}
.nav-burger span {
  display: block; width: 22px; height: 2px;
  background: white; transition: transform 0.2s, opacity 0.2s;
}
.main-nav.nav-open .nav-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.main-nav.nav-open .nav-burger span:nth-child(2) { opacity: 0; }
.main-nav.nav-open .nav-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.lang-switcher { display: flex; gap: 0.5rem; }

.lang-btn {
  background: none; border: 1px solid rgba(201,168,76,0.4);
  color: rgba(255,255,255,0.7); padding: 0.2rem 0.5rem;
  border-radius: 3px; font-size: 0.75rem; cursor: pointer;
  font-family: 'DM Sans', sans-serif;
  text-decoration: none;
  transition: all 0.2s;
}
.lang-btn.active, .lang-btn:hover {
  background: var(--gold); color: var(--ink); border-color: var(--gold);
}

/* ── AD SLOTS ───────────────────────────────────────────────────── */
.ad-leaderboard {
  margin-top: 64px;
  background: #1a1a2e;
  border-bottom: 1px solid rgba(201,168,76,0.15);
  display: flex; align-items: center; justify-content: center;
  height: 90px;
}

.ad-placeholder {
  border: 1px dashed rgba(201,168,76,0.3);
  border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  gap: 0.75rem;
  color: rgba(255,255,255,0.4); font-size: 0.8rem;
  letter-spacing: 0.08em; text-transform: uppercase;
}

.ad-leaderboard .ad-placeholder { width: 970px; max-width: 90vw; height: 70px; }

.ad-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold); opacity: 0.5;
}

.ad-midpage {
  background: var(--lapis);
  padding: 2rem;
  display: flex; align-items: center; justify-content: center;
}
.ad-midpage .ad-placeholder {
  width: 100%; max-width: 728px; height: 90px;
  border-color: rgba(201,168,76,0.3);
  color: rgba(255,255,255,0.35);
}

.ad-article {
  display: flex; justify-content: center; padding: 1.5rem 0;
}
.ad-article .ad-placeholder {
  width: 728px; max-width: 100%; height: 90px;
  border-color: rgba(0,0,0,0.12); color: var(--muted);
}

.ad-sidebar {
  margin-top: 1.5rem;
  display: flex; justify-content: center;
}

/* ── HERO ───────────────────────────────────────────────────────── */
.hero {
  position: relative;
  min-height: 90vh;                    /* grows if content needs more room */
  display: flex; flex-direction: column; align-items: stretch;
  padding-top: calc(64px + 2rem);      /* clear fixed nav */
  padding-bottom: 3rem;                /* space below stats */
}

.hero-bg {
  position: absolute; inset: 0;
  overflow: hidden;                    /* clips the zoom scale so it never leaks */
  background:
    linear-gradient(to bottom, rgba(26,21,16,0.3) 0%, rgba(26,21,16,0.6) 100%),
    url('https://images.unsplash.com/photo-1602615576820-ea14cf3e1e8e?w=1600&q=80') center/cover;
  transform-origin: center;
  animation: heroZoom 20s ease-in-out infinite alternate;
}

@keyframes heroZoom {
  from { transform: scale(1); }
  to   { transform: scale(1.06); }
}

.hero-ornament {
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23C9A84C' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.hero-content {
  position: relative; text-align: center;
  padding: 2rem;
  max-width: 800px; width: 100%; margin: 0 auto;
  flex: 1;                         /* fills all space above stats */
  display: flex; flex-direction: column;
  justify-content: center; align-items: center;
}

.hero-eyebrow {
  display: inline-block;
  font-size: 0.75rem; letter-spacing: 0.25em;
  text-transform: uppercase; color: var(--gold-light);
  background: rgba(13, 11, 8, 0.45);
  border: 1px solid rgba(201,168,76,0.4);
  padding: 0.4rem 1.2rem; border-radius: 2px;
  margin-bottom: 1.5rem;
  text-shadow: 0 1px 8px rgba(0,0,0,0.6);
  animation: fadeUp 0.8s ease both;
}

.hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(3rem, 8vw, 6rem);
  font-weight: 700; line-height: 1.05;
  color: white;
  text-shadow: 0 2px 40px rgba(0,0,0,0.4);
  animation: fadeUp 0.8s 0.15s ease both;
}

.hero h1 em {
  font-style: italic; color: var(--gold-light);
}

.hero-sub {
  font-size: 1.1rem; color: rgba(255,255,255,0.85);
  max-width: 520px; margin: 1.5rem auto 2.5rem;
  font-weight: 300; line-height: 1.7;
  animation: fadeUp 0.8s 0.3s ease both;
}

.hero-actions {
  display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;
  animation: fadeUp 0.8s 0.45s ease both;
}

.hero-stats {
  position: relative; z-index: 2;  /* .hero-bg is position:absolute -- without this,
                                       positioned elements paint above static ones
                                       regardless of source order, so the photo
                                       covered this box no matter what background
                                       or text-shadow it had. */
  display: flex; justify-content: center; gap: 4rem;
  margin-top: 3rem;   /* equal to hero padding-bottom = equal gaps both sides */
  flex-shrink: 0;
  padding: 1.25rem 2.5rem;
  background: rgba(13, 11, 8, 0.55);
  border-radius: 12px;
  max-width: fit-content;
  margin-left: auto; margin-right: auto;
}

.stat { text-align: center; color: white; }

.stat-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.2rem; font-weight: 700;
  color: var(--gold-light); display: block;
  line-height: 1;
  text-shadow: 0 2px 12px rgba(0,0,0,0.55);
}

.stat-label {
  font-size: 0.7rem; letter-spacing: 0.15em;
  text-transform: uppercase; opacity: 0.7;
  margin-top: 0.3rem; display: block;
  text-shadow: 0 1px 8px rgba(0,0,0,0.55);
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── BUTTONS ────────────────────────────────────────────────────── */
.btn-primary {
  background: var(--gold); color: var(--ink);
  padding: 0.85rem 2rem; border-radius: 3px;
  font-weight: 600; font-size: 0.9rem;
  text-decoration: none; letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: background 0.2s, transform 0.15s;
  display: inline-block;
}
.btn-primary:hover { background: var(--gold-light); transform: translateY(-1px); }

.btn-outline {
  border: 1px solid rgba(255,255,255,0.5); color: white;
  padding: 0.85rem 2rem; border-radius: 3px;
  font-weight: 500; font-size: 0.9rem;
  text-decoration: none; letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: border-color 0.2s, background 0.2s;
  display: inline-block;
}
.btn-outline:hover { border-color: white; background: rgba(255,255,255,0.1); }

/* For use on light/cream backgrounds -- .btn-outline's white-on-transparent
   style only works on dark hero-style backgrounds. */
.btn-outline--on-light { border-color: var(--lapis); color: var(--lapis); }
.btn-outline--on-light:hover { background: var(--lapis); color: white; }

/* ── QUICK NAV ──────────────────────────────────────────────────── */
.quick-nav {
  background: white;
  border-bottom: 1px solid var(--border);
  position: sticky; top: 64px; z-index: 80;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.quick-nav-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
  padding: 0 2rem; gap: 0; overflow-x: auto;
  scrollbar-width: none;
}
.quick-nav-inner::-webkit-scrollbar { display: none; }

.qnav-item {
  display: flex; flex-direction: column; align-items: center;
  padding: 0.75rem 1.25rem; gap: 0.3rem;
  text-decoration: none; color: var(--muted);
  font-size: 0.75rem; font-weight: 500;
  letter-spacing: 0.04em; text-transform: uppercase;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: all 0.2s;
}
.qnav-item:hover, .qnav-item.active {
  color: var(--lapis); border-bottom-color: var(--gold);
}
.qnav-icon { font-size: 1.3rem; }

/* ── SECTION LAYOUT ─────────────────────────────────────────────── */
.section { padding: 5rem 2rem; }

.section-inner { max-width: 1280px; margin: 0 auto; }

.section-header {
  display: flex; align-items: baseline;
  justify-content: space-between; margin-bottom: 2.5rem;
}

.section-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.4rem; font-weight: 700; line-height: 1.15;
  color: var(--ink);
}
.section-title span { color: var(--gold-deep); }

.see-all {
  color: var(--lapis-mid); font-size: 0.85rem;
  font-weight: 600; text-decoration: none;
  letter-spacing: 0.05em; display: flex; align-items: center; gap: 0.4rem;
  transition: gap 0.2s; flex-shrink: 0; white-space: nowrap;
}
.see-all:hover { gap: 0.7rem; }

/* ── CITIES GRID ────────────────────────────────────────────────── */
.cities-section { background: white; }

.cities-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5px;
}
.city-card:nth-child(1) { grid-row: span 2; aspect-ratio: auto; }

.city-card {
  position: relative; overflow: hidden;
  aspect-ratio: 4/3; cursor: pointer;
  text-decoration: none; display: block;
}

.city-card-img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.6s ease;
}
.city-card:hover .city-card-img { transform: scale(1.05); }

.city-card-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(26,21,16,0.8) 0%, transparent 60%);
}

.city-card-body {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1.5rem 1.5rem 1.25rem;
}

.city-tag {
  display: inline-block;
  background: var(--gold); color: var(--ink);
  font-size: 0.65rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 0.2rem 0.6rem; border-radius: 2px;
  margin-bottom: 0.5rem;
}

.city-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.8rem; font-weight: 700; color: white;
  line-height: 1.1;
}
.city-card:nth-child(1) .city-name { font-size: 2.8rem; }

.city-desc {
  color: rgba(255,255,255,0.75); font-size: 0.825rem;
  margin-top: 0.4rem; display: none;
}
.city-card:nth-child(1) .city-desc { display: block; }

/* ── ARTICLE CARDS ──────────────────────────────────────────────── */
.articles-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.article-card {
  text-decoration: none; color: inherit;
  border-radius: 4px; overflow: hidden;
  background: white;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
  transition: box-shadow 0.2s, transform 0.2s;
}
.article-card:hover {
  box-shadow: 0 8px 30px rgba(0,0,0,0.1);
  transform: translateY(-2px);
}

.article-img {
  width: 100%; aspect-ratio: 16/9;
  object-fit: cover; display: block;
}

.article-body { padding: 1.1rem 1.25rem 1.25rem; }

.article-cat {
  font-size: 0.7rem; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--gold-deep);
  font-weight: 700; margin-bottom: 0.4rem;
}

.article-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.2rem; font-weight: 600;
  line-height: 1.35; color: var(--ink);
}

.article-meta {
  font-size: 0.75rem; color: var(--muted);
  margin-top: 0.6rem;
}

/* ── PRACTICAL STRIP ────────────────────────────────────────────── */
.practical-section { background: var(--lapis); }

.practical-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  background: rgba(255,255,255,0.1);
}

.practical-item {
  background: var(--lapis);
  padding: 2rem 1.5rem; text-align: center;
  text-decoration: none;
  transition: background 0.2s;
}
.practical-item:hover { background: var(--lapis-mid); }

.practical-icon { font-size: 2rem; display: block; margin-bottom: 0.75rem; }

.practical-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem; font-weight: 600; color: white;
  margin-bottom: 0.4rem;
}

.practical-desc { font-size: 0.775rem; color: rgba(255,255,255,0.6); line-height: 1.5; }

/* ── ROUTES GRID ────────────────────────────────────────────────── */
.routes-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}

.route-card {
  position: relative; border-radius: 4px;
  overflow: hidden; aspect-ratio: 3/4;
  text-decoration: none;
}

.route-card-bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transition: transform 0.6s;
}
.route-card:hover .route-card-bg { transform: scale(1.05); }

.route-card-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(26,58,107,0.95) 30%, rgba(0,0,0,0.2) 100%);
}

.route-card-body { position: absolute; bottom: 0; padding: 1.5rem 1.25rem; }

.route-duration {
  font-size: 0.7rem; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--gold);
  font-weight: 700; margin-bottom: 0.5rem;
}

.route-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem; font-weight: 700; color: white;
  line-height: 1.2; margin-bottom: 0.5rem;
}

.route-cities { font-size: 0.775rem; color: rgba(255,255,255,0.65); }

/* ── NEWS + SIDEBAR ─────────────────────────────────────────────── */
.news-section { background: var(--cream); }

.news-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 3rem;
  align-items: start;
}

.news-main-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.news-sidebar-sticky { position: sticky; top: 140px; }

.sidebar-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem; font-weight: 700;
  border-bottom: 2px solid var(--gold);
  padding-bottom: 0.5rem; margin-bottom: 1rem;
}

.sidebar-news-item {
  display: flex; gap: 0.75rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border);
  text-decoration: none; color: inherit;
  transition: opacity 0.2s;
}
.sidebar-news-item:hover { opacity: 0.7; }

.sidebar-thumb {
  width: 64px; height: 64px;
  object-fit: cover; border-radius: 3px;
  flex-shrink: 0;
}

.sidebar-news-title {
  font-size: 0.85rem; font-weight: 500;
  line-height: 1.4; color: var(--ink);
}

.sidebar-news-date { font-size: 0.7rem; color: var(--muted); margin-top: 0.3rem; }

/* ── VISA BANNER ────────────────────────────────────────────────── */
.visa-banner {
  background: var(--ink);
  padding: 4rem 2rem;
  text-align: center;
  position: relative; overflow: hidden;
}

.visa-banner::before {
  content: '';
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3z' fill='%23C9A84C' fill-opacity='0.04'/%3E%3C/svg%3E");
}

.visa-banner-inner { position: relative; max-width: 640px; margin: 0 auto; }

.visa-banner h1, .visa-banner h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.6rem; color: white; margin-bottom: 1rem;
}

.visa-banner p { color: #fff; font-size: 1rem; margin-bottom: 2rem; }

.visa-banner a { color: #fff; text-decoration: underline; }
.visa-banner a:hover { color: var(--gold-light); }

.visa-flags {
  display: flex; gap: 0.5rem; justify-content: center;
  flex-wrap: wrap; margin-bottom: 2rem;
}

.visa-flag {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  padding: 0.3rem 0.6rem; border-radius: 3px;
  font-size: 0.8rem; color: rgba(255,255,255,0.7);
}

/* ── FOOTER ─────────────────────────────────────────────────────── */
footer {
  background: #0D0B08; border-top: 1px solid rgba(201,168,76,0.15);
  padding: 4rem 2rem 2rem;
}

.footer-inner { max-width: 1280px; margin: 0 auto; }

.footer-top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: 3rem; margin-bottom: 3rem;
}

.footer-brand .logo { font-size: 2rem; }

.footer-tagline {
  color: rgba(255,255,255,0.5); font-size: 0.875rem;
  margin-top: 0.75rem; line-height: 1.6;
}

.footer-col-title {
  color: var(--gold); font-size: 0.7rem;
  letter-spacing: 0.15em; text-transform: uppercase;
  font-weight: 700; margin-bottom: 1rem;
}

.footer-links { list-style: none; }
.footer-links li { margin-bottom: 0.5rem; }
.footer-links a {
  color: rgba(255,255,255,0.55); font-size: 0.85rem;
  text-decoration: none; transition: color 0.2s;
}
.footer-links a:hover { color: var(--gold-light); }

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: 1.5rem;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 1rem;
}

.footer-copy { color: rgba(255,255,255,0.3); font-size: 0.8rem; }

.footer-socials { display: flex; gap: 0.75rem; }

.social-btn {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.15);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.5); font-size: 0.85rem;
  text-decoration: none; transition: all 0.2s;
}
.social-btn:hover { border-color: var(--gold); color: var(--gold); }

/* ── RESPONSIVE ─────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .cities-grid { grid-template-columns: repeat(2, 1fr); }
  .city-card:nth-child(1) { grid-column: span 2; grid-row: span 1; }
  .practical-grid { grid-template-columns: repeat(3, 1fr); }
  .routes-grid { grid-template-columns: repeat(2, 1fr); }
  .news-layout { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .nav-burger { display: flex; }
  .nav-links {
    display: none;
    position: absolute; top: 64px; left: 0; right: 0;
    flex-direction: column; gap: 0;
    background: rgba(26, 21, 16, 0.98);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(201,168,76,0.2);
    max-height: calc(100vh - 64px); overflow-y: auto;
  }
  .main-nav.nav-open .nav-links { display: flex; }
  .nav-links li { width: 100%; }
  .nav-links a {
    display: block; padding: 1rem 2rem;
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .articles-grid { grid-template-columns: 1fr; }
  .news-main-grid { grid-template-columns: 1fr; }
  .hero-stats { gap: 2rem; }
  .stat-num { font-size: 1.6rem; }
  .cities-grid { grid-template-columns: 1fr; }
  .city-card:nth-child(1) { grid-column: span 1; }
  .routes-grid { grid-template-columns: 1fr; }
  .practical-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-top { grid-template-columns: 1fr; }
  .hero-stats { display: none; }
  .section { padding: 3rem 1.25rem; }
  /* justify-content:center clips the edges of an overflowing scroll
     row on mobile -- centered content that's wider than the viewport
     leaves unreachable overflow on the left. Start flush-left instead. */
  .quick-nav-inner { justify-content: flex-start; }
}

@media (max-width: 480px) {
  .hero h1 { font-size: 2.5rem; }
  .practical-grid { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════
   STREAMFIELD BLOCKS
═══════════════════════════════════════════════════════════════════ */

/* Shared block spacing */
.block-richtext,
.block-image,
.block-gallery,
.block-quote,
.block-alert,
.block-cta,
.block-cards,
.block-accordion,
.block-stats,
.block-timeline,
.block-video,
.block-document,
.block-two-cols { margin: 2rem 0; }

/* ── IMAGE BLOCK ─────────────────────────────────────────────────── */
.block-image { }
.block-image--full  img { width: 100%; border-radius: 4px; display: block; }
.block-image--center { text-align: center; }
.block-image--center img { display: inline-block; max-width: 100%; border-radius: 4px; }
.block-image--left  img { float: left; max-width: 45%; margin: 0 1.5rem 1rem 0; border-radius: 4px; }
.block-image--right img { float: right; max-width: 45%; margin: 0 0 1rem 1.5rem; border-radius: 4px; }
.block-image figcaption {
  font-size: 0.8rem; color: var(--muted); text-align: center;
  margin-top: 0.5rem; font-style: italic;
}
.block-image__attribution { margin-left: 0.4rem; opacity: 0.7; }

/* ── GALLERY BLOCK ───────────────────────────────────────────────── */
.block-gallery { }
.block-gallery--cols-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 0.75rem; }
.block-gallery--cols-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 0.75rem; }
.block-gallery--cols-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 0.75rem; }
.block-gallery__item { margin: 0; overflow: hidden; border-radius: 4px; }
.block-gallery__item img { width: 100%; height: 220px; object-fit: cover; display: block; transition: transform 0.4s; }
.block-gallery__item:hover img { transform: scale(1.04); }
.block-gallery__item figcaption { font-size: 0.75rem; color: var(--muted); padding: 0.3rem 0; }

/* ── QUOTE BLOCK ─────────────────────────────────────────────────── */
.block-quote {
  border-left: 4px solid var(--gold);
  padding: 1.25rem 1.75rem;
  background: rgba(201,168,76,0.05);
  border-radius: 0 4px 4px 0;
  margin: 2rem 0;
}
.block-quote__text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.5rem; font-style: italic;
  color: var(--lapis); line-height: 1.5;
  margin: 0 0 0.5rem;
}
.block-quote__footer {
  display: block; font-size: 0.85rem; color: var(--muted); font-style: normal;
}

/* ── ALERT BLOCK ─────────────────────────────────────────────────── */
.block-alert {
  padding: 1.1rem 1.5rem; border-radius: 4px; border-left: 4px solid;
}
.block-alert--info    { background: #EFF6FF; border-color: #3B82F6; }
.block-alert--tip     { background: #FFFBEB; border-color: var(--gold); }
.block-alert--warning { background: #FFF7ED; border-color: #F97316; }
.block-alert--success { background: #F0FDF4; border-color: #22C55E; }
.block-alert__heading { display: block; font-weight: 700; margin-bottom: 0.4rem; }
.block-alert__body p:last-child { margin-bottom: 0; }

/* ── CTA BLOCK ───────────────────────────────────────────────────── */
.block-cta { text-align: center; padding: 0.5rem 0; }

/* ── CARD BLOCK ──────────────────────────────────────────────────── */
.block-card {
  background: white; border-radius: 4px; overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.07);
  display: flex; flex-direction: column;
}
.block-card__img { width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; }
.block-card__body { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.block-card__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.3rem; font-weight: 700; color: var(--ink);
}
.block-card__text { font-size: 0.9rem; color: var(--muted); flex: 1; }
.block-card__text p:last-child { margin-bottom: 0; }

/* ── CARDS GRID ──────────────────────────────────────────────────── */
.block-cards--cols-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 1.5rem; }
.block-cards--cols-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.block-cards--cols-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.25rem; }

/* ── ACCORDION BLOCK ─────────────────────────────────────────────── */
.block-accordion { }
.block-accordion__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.6rem; font-weight: 700;
  margin-bottom: 1rem; color: var(--ink);
}
.accordion-item { border-bottom: 1px solid var(--border); }
.accordion-trigger {
  width: 100%; background: none; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 0; font-size: 1rem; font-weight: 500;
  color: var(--ink); font-family: 'DM Sans', sans-serif;
  text-align: left; gap: 1rem;
}
.accordion-trigger:hover { color: var(--lapis); }
.accordion-trigger[aria-expanded="true"] { color: var(--lapis); }
.accordion-icon {
  width: 20px; height: 20px; flex-shrink: 0; position: relative;
}
.accordion-icon::before,
.accordion-icon::after {
  content: ''; position: absolute;
  background: currentColor; border-radius: 2px;
  transition: transform 0.25s, opacity 0.25s;
}
.accordion-icon::before { width: 12px; height: 2px; top: 9px; left: 4px; }
.accordion-icon::after  { width: 2px; height: 12px; top: 4px; left: 9px; }
.accordion-trigger[aria-expanded="true"] .accordion-icon::after { transform: rotate(90deg); opacity: 0; }
.accordion-panel { overflow: hidden; }
.accordion-panel__inner {
  padding: 0 0 1.25rem;
  color: var(--muted); line-height: 1.75;
}

/* ── STATS BLOCK ─────────────────────────────────────────────────── */
.block-stats { background: var(--lapis); padding: 2.5rem 2rem; border-radius: 4px; text-align: center; }
.block-stats__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem; color: white; margin-bottom: 1.5rem;
}
.block-stats__row { display: flex; justify-content: center; gap: 3rem; flex-wrap: wrap; }
.block-stat { }
.block-stat__num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.4rem; font-weight: 700;
  color: var(--gold-light); display: block; line-height: 1;
}
.block-stat__label {
  font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(255,255,255,0.65); display: block; margin-top: 0.3rem;
}

/* ── TIMELINE BLOCK ──────────────────────────────────────────────── */
.block-timeline { }
.block-timeline__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.6rem; margin-bottom: 1.5rem;
}
.timeline-item {
  display: grid; grid-template-columns: 100px 1fr; gap: 1.5rem;
  padding: 1.5rem 0; border-bottom: 1px solid var(--border);
}
.timeline-item__marker {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--gold-deep); padding-top: 0.2rem;
}
.timeline-item__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.2rem; font-weight: 700; margin-bottom: 0.5rem;
}
.timeline-item__desc { color: var(--muted); font-size: 0.9rem; line-height: 1.7; }

/* ── VIDEO BLOCK ─────────────────────────────────────────────────── */
.block-video { margin: 2rem 0; }
.block-video__wrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 4px; }
.block-video__wrapper iframe,
.block-video__wrapper embed,
.block-video__wrapper object { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.block-video figcaption { font-size: 0.8rem; color: var(--muted); text-align: center; margin-top: 0.5rem; }

/* ── DOCUMENT BLOCK ──────────────────────────────────────────────── */
.block-document { }
.block-document__link {
  display: flex; align-items: center; gap: 1rem;
  padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 4px;
  background: white; text-decoration: none; color: var(--ink);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.block-document__link:hover { border-color: var(--gold); box-shadow: 0 2px 8px rgba(0,0,0,0.07); }
.block-document__icon { font-size: 1.75rem; flex-shrink: 0; }
.block-document__meta { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.block-document__title { font-weight: 600; }
.block-document__desc  { font-size: 0.85rem; color: var(--muted); }
.block-document__size  { font-size: 0.75rem; color: var(--muted); }
.block-document__download { font-size: 0.8rem; font-weight: 600; color: var(--lapis-mid); white-space: nowrap; }

/* ── TWO COLUMN BLOCK ────────────────────────────────────────────── */
.block-two-cols { display: grid; gap: 2rem; }
.block-two-cols--half        { grid-template-columns: 1fr 1fr; }
.block-two-cols--wider-left  { grid-template-columns: 3fr 2fr; }
.block-two-cols--wider-right { grid-template-columns: 2fr 3fr; }

/* ── RESPONSIVE: blocks ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .block-gallery--cols-3,
  .block-gallery--cols-4 { grid-template-columns: repeat(2,1fr); }
  .block-cards--cols-3,
  .block-cards--cols-4   { grid-template-columns: repeat(2,1fr); }
  .block-cards--cols-2   { grid-template-columns: 1fr; }
  .block-two-cols        { grid-template-columns: 1fr !important; }
  .timeline-item         { grid-template-columns: 80px 1fr; }
  .block-image--left img,
  .block-image--right img { float: none; max-width: 100%; margin: 0 0 1rem; }
}
@media (max-width: 480px) {
  .block-gallery--cols-2 { grid-template-columns: 1fr; }
  .block-cards--cols-2,
  .block-cards--cols-3,
  .block-cards--cols-4   { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════
   NEWS SECTION
═══════════════════════════════════════════════════════════════════ */

/* ── FEATURED ARTICLE ──────────────────────────────────────────── */
.news-featured {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 420px; border-radius: 6px; overflow: hidden;
  text-decoration: none; color: inherit;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  margin-bottom: 3rem;
  transition: box-shadow 0.2s;
}
.news-featured:hover { box-shadow: 0 8px 32px rgba(0,0,0,0.18); }
.news-featured__img {
  background-size: cover; background-position: center;
  min-height: 300px;
}
.news-featured__body {
  background: var(--ink); padding: 2.5rem;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 0.75rem;
}
.news-featured__meta  { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; }
.news-featured__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 700; color: white; line-height: 1.2;
}
.news-featured__excerpt { color: rgba(255,255,255,0.7); font-size: 0.9rem; line-height: 1.6; }
.news-featured__byline  { color: rgba(255,255,255,0.5); font-size: 0.78rem; letter-spacing: 0.04em; }

/* ── ARTICLE GRID ──────────────────────────────────────────────── */
.news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.news-grid--3 { grid-template-columns: repeat(3, 1fr); }
.news-grid--4 { grid-template-columns: repeat(4, 1fr); }

/* ── NEWS CARD ─────────────────────────────────────────────────── */
.news-card {
  text-decoration: none; color: inherit;
  background: white; border-radius: 4px; overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  display: flex; flex-direction: column;
  transition: box-shadow 0.2s, transform 0.2s;
}
.news-card:hover {
  box-shadow: 0 6px 24px rgba(0,0,0,0.1);
  transform: translateY(-2px);
}
.news-card__img {
  width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block;
}
.news-card__body { padding: 1rem 1.1rem 1.1rem; flex: 1; display: flex; flex-direction: column; gap: 0.4rem; }
.news-card__meta { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.news-card__city { font-size: 0.72rem; color: var(--muted); }
.news-card__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem; font-weight: 600; line-height: 1.35; color: var(--ink); flex: 1;
}
.news-card__excerpt { font-size: 0.82rem; color: var(--muted); line-height: 1.5; }
.news-card__byline  { font-size: 0.72rem; color: var(--muted); margin-top: auto; padding-top: 0.4rem; }

/* ── CATEGORY BADGE ────────────────────────────────────────────── */
.news-cat-badge {
  display: inline-block;
  font-size: 0.65rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 0.2rem 0.55rem; border-radius: 2px;
  white-space: nowrap;
}
.news-cat-badge--tourism    { background: rgba(42,171,184,0.15); color: var(--turquoise); }
.news-cat-badge--openings   { background: rgba(201,168,76,0.15); color: #9a7a1e; }
.news-cat-badge--events     { background: rgba(196,97,42,0.12);  color: var(--terracotta); }
.news-cat-badge--transport  { background: rgba(43,84,153,0.12);  color: var(--lapis-mid); }
.news-cat-badge--culture    { background: rgba(26,58,107,0.1);   color: var(--lapis); }
.news-cat-badge--practical  { background: rgba(107,98,88,0.1);   color: var(--muted); }
.news-cat-badge--visa       { background: rgba(34,197,94,0.12);  color: #15803d; }

/* ── ARTICLE HERO ──────────────────────────────────────────────── */
.news-hero {
  height: 65vh; min-height: 420px; position: relative;
  display: flex; align-items: flex-end;
  background-size: cover; background-position: center;
}
.news-hero--no-img {
  height: auto; min-height: 0;
  background: var(--ink); padding-top: 5rem;
}
.news-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(10,8,5,0.9) 0%, rgba(0,0,0,0.2) 60%);
}
.news-hero__content {
  position: relative; padding: 3rem 2rem;
  max-width: 860px; margin: 0 auto; width: 100%;
}
.news-hero__meta { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; margin-bottom: 0.75rem; }
.news-hero__title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.8rem, 5vw, 3.2rem); font-weight: 700; color: white; line-height: 1.1;
  margin-bottom: 0.75rem;
}
.news-hero__title--dark { color: var(--ink); }
.news-hero__excerpt { color: rgba(255,255,255,0.8); font-size: 1.05rem; line-height: 1.65; margin-bottom: 1rem; }
.news-hero__byline  { color: rgba(255,255,255,0.55); font-size: 0.82rem; display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.news-hero__byline--dark { color: var(--muted); }
.news-hero__city-link {
  font-size: 0.78rem; color: var(--gold-light); text-decoration: none;
  transition: color 0.2s;
}
.news-hero__city-link:hover { color: white; }
.news-hero__city-link--dark { font-size: 0.78rem; color: var(--lapis-mid); text-decoration: none; }

/* ── BREADCRUMB ────────────────────────────────────────────────── */
.news-breadcrumb {
  font-size: 0.78rem; color: rgba(255,255,255,0.5);
  margin-bottom: 1.25rem; display: flex; align-items: center; gap: 0.3rem; flex-wrap: wrap;
}
.news-breadcrumb a { color: rgba(255,255,255,0.55); text-decoration: none; transition: color 0.2s; }
.news-breadcrumb a:hover { color: var(--gold-light); }

/* ── ARTICLE BODY ──────────────────────────────────────────────── */
.news-body-wrap {
  max-width: 860px; margin: 0 auto;
  padding: 3rem 2rem;
  font-size: 1.05rem; line-height: 1.85;
}
.news-lede {
  font-size: 1.2rem; line-height: 1.7; font-weight: 400;
  color: var(--muted); margin-bottom: 2rem;
  border-left: 4px solid var(--gold); padding-left: 1.25rem;
}
.news-source {
  margin-top: 2rem; padding-top: 1rem;
  border-top: 1px solid var(--border);
  font-size: 0.82rem; color: var(--muted);
}
.news-source a { color: var(--lapis-mid); }

/* ── TAGS ──────────────────────────────────────────────────────── */
.news-tags-wrap { border-top: 1px solid var(--border); padding: 1.5rem 0; }
.news-tag {
  display: inline-block; margin: 0.25rem;
  padding: 0.3rem 0.75rem; border-radius: 20px;
  background: rgba(26,58,107,0.08); color: var(--lapis-mid);
  font-size: 0.78rem; text-decoration: none;
  transition: background 0.2s;
}
.news-tag:hover { background: var(--lapis); color: white; }

/* ── RELATED ───────────────────────────────────────────────────── */
.news-related {
  background: var(--cream); padding: 3rem 0;
  border-top: 1px solid var(--border); margin-top: 2rem;
}

/* ── RESPONSIVE ────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .news-featured { grid-template-columns: 1fr; min-height: auto; }
  .news-featured__img { height: 280px; }
  .news-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .news-grid,
  .news-grid--3 { grid-template-columns: 1fr; }
  .news-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .news-grid--4 { grid-template-columns: 1fr; }
}

/* ── NO-NAV / NO-FOOTER layout helpers ─────────────────────────────── */
body.no-nav .ad-leaderboard { margin-top: 0; }
body.no-nav .hero            { padding-top: 2rem; }
body.no-nav .quick-nav       { top: 0; }

/* ── TABLE BLOCK ────────────────────────────────────────────────────── */
.block-table { overflow-x: auto; }
.block-table table {
  width: 100%; border-collapse: collapse; font-size: 0.9rem;
}
.block-table th, .block-table td {
  padding: 0.65rem 1rem; border: 1px solid var(--border); text-align: left;
}
.block-table thead th {
  background: var(--lapis); color: white;
  font-weight: 600; letter-spacing: 0.04em;
}
.block-table tbody tr:nth-child(even) { background: rgba(201,168,76,0.05); }
.block-table tbody tr:hover           { background: rgba(201,168,76,0.1); }

/* ── NEWS EXCERPT / DESCRIPTION SECTION ────────────────────────────── */
.news-excerpt-section {
  background: white;
  border-bottom: 1px solid var(--border);
  padding: 0;
}
.news-excerpt-inner {
  max-width: 860px; margin: 0 auto;
  padding: 2rem 2rem 1.75rem;
  border-left: 5px solid var(--gold);
}
.news-excerpt-text {
  font-size: 1.2rem; line-height: 1.7; color: var(--ink);
  font-weight: 400; margin: 0 0 1rem;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
}
.news-excerpt-meta {
  display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap;
  font-size: 0.8rem; color: var(--muted);
}
.news-excerpt-city {
  color: var(--lapis-mid); text-decoration: none; font-weight: 500;
}
.news-excerpt-city:hover { color: var(--lapis); }
.news-excerpt-tag {
  color: var(--muted); text-decoration: none;
  background: rgba(0,0,0,0.04); padding: 0.15rem 0.45rem; border-radius: 2px;
  transition: background 0.2s;
}
.news-excerpt-tag:hover { background: rgba(26,58,107,0.08); color: var(--lapis-mid); }

/* Landing page body */
.landing-body { }
.landing-body--no-nav { margin-top: 0; }

/* ── LIVE AD CONTAINERS — admin-pasted code, no fixed placeholder size ──── */
.ad-leaderboard--live,
.ad-midpage--live,
.ad-article--live,
.ad-sidebar--live { overflow: hidden; max-width: 100%; }

.ad-footer-banner {
  display: flex; justify-content: center;
  padding: 1.5rem 2rem; overflow: hidden;
  border-bottom: 1px solid rgba(201,168,76,0.1);
}

/* ── PARTNER / AFFILIATE DISCLOSURE BADGE ──────────────────────────────── */
.partner-badge {
  display: inline-block;
  background: rgba(255,255,255,0.15); color: white;
  font-size: 0.65rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 0.2rem 0.55rem; border-radius: 2px;
  border: 1px solid rgba(255,255,255,0.25);
  margin-left: 0.4rem;
}