/**
 * Locals Insider — Category Hubs (li-cat-hubs.css)
 *
 * Shares the .li-ci-* namespace with the existing li-country-info plugin.
 * Loaded only on the 6 supported category archives.
 *
 * The mobile bottom nav (.li-ci-mobile-bottom + .li-ci-mobile-nav*) is built
 * to match the existing pattern on /austria/ — same classes, same positioning,
 * same backdrop, same 768px breakpoint.
 */

/* ============================================================
   PAGE HEADER — H1 + lede are now rendered using the theme's
   native cs-page__header + cs-entry__title markup, so they
   inherit the theme's styling automatically (same as how
   country pages /montenegro/ and city tag pages /tag/paris/
   render their titles). No custom CSS needed here.
   ============================================================ */

/* ============================================================
   SAFETY NET — hide any theme/plugin output that duplicates
   the hub's H1 + description. The plugin already strips these
   via PHP filters and output buffering, but if a theme renders
   archive title/description through some other path, this CSS
   catches it. Scoped tightly so it only applies on the 6 hubs.

   NOTE: we deliberately do NOT hide .cs-page__header — we want
   that to render, because the plugin replaces its content with
   our own .li-ci-page-header containing the correct H1 + lede.
   ============================================================ */
body.category-where-to-go .li-cat-header,
body.category-hotels .li-cat-header,
body.category-restaurants .li-cat-header,
body.category-healthy-travel .li-cat-header,
body.category-luxury-travel .li-cat-header,
body.category-travel-insights .li-cat-header,
body.category-where-to-go .category-description,
body.category-hotels .category-description,
body.category-restaurants .category-description,
body.category-healthy-travel .category-description,
body.category-luxury-travel .category-description,
body.category-travel-insights .category-description,
body.category-where-to-go .archive-description,
body.category-hotels .archive-description,
body.category-restaurants .archive-description,
body.category-healthy-travel .archive-description,
body.category-luxury-travel .archive-description,
body.category-travel-insights .archive-description,
body.category-where-to-go .term-description,
body.category-hotels .term-description,
body.category-restaurants .term-description,
body.category-healthy-travel .term-description,
body.category-luxury-travel .term-description,
body.category-travel-insights .term-description {
  display: none !important;
}

/* ============================================================
   CONTAINER — uses .li-ci-wrap (same as li-country-info plugin)
   to span all columns of Blueprint's post grid cleanly with no
   horizontal overflow. The white-card background comes from the
   theme's .cs-posts-area__main; we sit inside it.
   ============================================================ */
.li-ci-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 32px 0;
  padding: 0;
  background: transparent;
  grid-column: 1 / -1 !important;
}

.li-ci-hub {
    --li-bg: #ffffff;
    --li-surface: #fafafa;
    --li-surface-2: #f5f3ee;
    --li-text: #1a1a1a;
    --li-text-soft: #4a4a4a;
    --li-text-muted: #7a7a7a;
    --li-line: #e4e4e2;
    --li-accent: #c5a572;
    --li-accent-soft: #f3ede0;
    --li-accent-dark: #9a7d4d;
    --li-tag: #1e3a2f;
    --li-tag-soft: #e6ede9;
    --li-error: #b94a48;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--li-text);
    background: transparent;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  .li-ci-hub * { box-sizing: border-box; }
  .li-ci-hub a { color: inherit; text-decoration: none; }
  .li-ci-hub img { max-width: 100%; display: block; }
  .li-ci-hub h1, .li-ci-hub h2, .li-ci-hub h3, .li-ci-hub h4 {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 600;
    letter-spacing: -0.01em;
    margin: 0;
  }
  .li-ci-section { margin: 48px 0; }
  .li-ci-section:first-of-type { margin-top: 24px; }
  .li-ci-section-head { margin-bottom: 24px; padding-bottom: 12px; border-bottom: 1px solid var(--li-line); }
  .li-ci-section-head h2 { font-size: 28px; line-height: 1.2; font-weight: 600; }
  .li-ci-section-head h2 em { font-style: italic; color: var(--li-accent-dark); font-weight: 500; }
  .li-ci-section-eyebrow { font-size: 11px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--li-accent-dark); display: block; margin-bottom: 10px; }
  .li-ci-section-lede { font-size: 15px; color: var(--li-text-soft); max-width: 65ch; margin: 8px 0 0; }

  /* HERO — trending strip + stats only (H1/lede are in theme cs-page__header above white card) */
  .li-ci-hero { padding: 8px 0 32px; border-bottom: 1px solid var(--li-line); margin-bottom: 24px; }

  /* TRENDING STRIP */
  .li-ci-trending { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
  @media (max-width: 900px) { .li-ci-trending { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 480px) { .li-ci-trending { grid-template-columns: 1fr; } }
  .li-ci-trending-card { background: var(--li-accent-soft); border: 1px solid var(--li-accent); border-radius: 4px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; transition: all .15s ease; min-height: 130px; }
  .li-ci-trending-card:hover { background: var(--li-accent); border-color: var(--li-accent-dark); transform: translateY(-2px); }
  .li-ci-trending-card:hover .li-ci-trending-kicker,
  .li-ci-trending-card:hover .li-ci-trending-name,
  .li-ci-trending-card:hover .li-ci-trending-context,
  .li-ci-trending-card:hover .li-ci-trending-country { color: #fff; }
  .li-ci-trending-kicker { font-size: 10px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--li-accent-dark); transition: color .15s; }
  .li-ci-trending-name { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 18px; line-height: 1.15; color: var(--li-text); margin-top: 2px; transition: color .15s; }
  .li-ci-trending-context { font-size: 12.5px; color: var(--li-text-soft); line-height: 1.4; margin-top: 4px; flex-grow: 1; transition: color .15s; }
  .li-ci-trending-country { font-family: 'Playfair Display', serif; font-style: italic; font-size: 12px; color: var(--li-accent-dark); margin-top: 8px; transition: color .15s; }

  .li-ci-hero-meta { display: flex; gap: 36px; flex-wrap: wrap; padding-top: 28px; margin-top: 8px; border-top: 1px solid var(--li-line); }
  .li-ci-hero-stat strong { display: block; font-family: 'Playfair Display', serif; font-weight: 600; font-size: 26px; color: var(--li-text); line-height: 1; font-feature-settings: "tnum"; }
  .li-ci-hero-stat span { display: block; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--li-text-muted); margin-top: 6px; }

  /* ============================================================
     SUBNAV — top sticky on desktop only (≥769px)
     Stays within the hub container; no negative-margin breakout
     (which was overflowing on the live site).
     ============================================================ */
  .li-ci-subnav-desktop {
    position: sticky; top: 0; z-index: 30;
    background: rgba(255,255,255,.95); backdrop-filter: saturate(140%) blur(8px);
    border-bottom: 1px solid var(--li-line);
    border-top: 1px solid var(--li-line);
    padding: 10px 0;
    margin: 0 0 32px;
    width: 100%;
  }
  .li-ci-subnav-inner {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    max-width: 100%;
  }
  .li-ci-subnav-inner::-webkit-scrollbar { display: none; }
  .li-ci-subnav-desktop a {
    padding: 7px 14px; border-radius: 4px;
    font-size: 13px; color: var(--li-text-soft);
    white-space: nowrap; transition: all .15s ease;
  }
  .li-ci-subnav-desktop a:hover { color: var(--li-text); background: var(--li-surface); }

  /* Hide desktop subnav on mobile, hide mobile-bottom on desktop */
  @media (max-width: 768px) {
    .li-ci-subnav-desktop { display: none; }
  }

  /* ============================================================
     MOBILE BOTTOM NAV — matches /austria/ (li-country-info plugin)
     Same classes, same icon style, same positioning
     ============================================================ */
  .li-ci-mobile-bottom {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(255,255,255,0.97);
    border-top: 1px solid var(--li-line);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 999;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.04);
    padding-bottom: max(0px, env(safe-area-inset-bottom));
  }
  .li-ci-mobile-nav {
    display: flex;
    padding: 4px 0;
  }
  .li-ci-mobile-nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 6px 2px;
    text-decoration: none;
    color: var(--li-text-soft);
    transition: color 0.15s ease;
    min-width: 0;
  }
  .li-ci-mobile-nav-item:hover,
  .li-ci-mobile-nav-item:active {
    color: var(--li-accent-dark);
  }
  .li-ci-mobile-nav-icon {
    font-size: 16px;
    line-height: 1;
  }
  .li-ci-mobile-nav-label {
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  /* Show mobile bottom nav at ≤768px, pad body so content clears it */
  @media (max-width: 768px) {
    .li-ci-mobile-bottom { display: block; }
    .li-ci-hub { padding-bottom: 80px; }
  }
  @media (max-width: 380px) {
    .li-ci-mobile-nav-label { font-size: 8.5px; letter-spacing: 0.04em; }
    .li-ci-mobile-nav-icon { font-size: 15px; }
  }

  /* Smooth scroll + offset for anchor navigation */
  html { scroll-behavior: smooth; scroll-padding-top: 60px; }
  @media (max-width: 768px) {
    html { scroll-padding-top: 20px; scroll-padding-bottom: 80px; }
  }

  /* AUTHOR VOICES */
  .li-ci-voices { background: var(--li-surface-2); padding: 48px 32px; border-radius: 4px; margin: 56px 0; }
  .li-ci-voices-head { text-align: center; margin-bottom: 32px; }
  .li-ci-voices-head h2 { font-family: 'Playfair Display', serif; font-size: 26px; font-weight: 600; }
  .li-ci-voices-head h2 em { font-style: italic; color: var(--li-accent-dark); }
  .li-ci-quote { margin: 0 auto 32px; max-width: 720px; text-align: center; padding: 0 16px; }
  .li-ci-quote:last-child { margin-bottom: 0; }
  .li-ci-quote-text { font-family: 'Playfair Display', serif; font-style: italic; font-weight: 400; font-size: 20px; line-height: 1.55; color: var(--li-text); margin: 0 0 16px; quotes: "\201C" "\201D"; }
  .li-ci-quote-text::before { content: open-quote; color: var(--li-accent-dark); margin-right: 4px; }
  .li-ci-quote-text::after { content: close-quote; color: var(--li-accent-dark); margin-left: 4px; }
  .li-ci-quote-cite { font-size: 13px; color: var(--li-text-muted); line-height: 1.5; }
  .li-ci-quote-cite a { color: var(--li-text-soft); border-bottom: 1px solid var(--li-line); transition: border-color .15s; }
  .li-ci-quote-cite a:hover { border-bottom-color: var(--li-accent-dark); color: var(--li-text); }
  .li-ci-quote-cite cite { font-style: italic; font-weight: 500; }
  .li-ci-quote-cite .li-ci-quote-country { color: var(--li-accent-dark); font-weight: 500; border: none; }

  /* PILLARS (smaller cell-grid that opens the hub's anchor articles) */
  .li-ci-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
  @media (max-width: 820px) { .li-ci-pillars { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 480px) { .li-ci-pillars { grid-template-columns: 1fr; } }
  .li-ci-pillar { display: flex; flex-direction: column; gap: 6px; background: var(--li-surface); border: 1px solid var(--li-line); border-radius: 4px; padding: 20px; transition: all .15s ease; min-height: 130px; }
  .li-ci-pillar:hover { background: var(--li-accent-soft); border-color: var(--li-accent); }
  .li-ci-pillar-label { font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--li-accent-dark); }
  .li-ci-pillar-name { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 18px; line-height: 1.2; color: var(--li-text); }
  .li-ci-pillar-source { font-size: 12.5px; color: var(--li-text-muted); margin-top: auto; padding-top: 8px; font-style: italic; }

  /* 2026 INDEX */
  .li-ci-index-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--li-line); border: 1px solid var(--li-line); border-radius: 4px; overflow: hidden; }
  @media (max-width: 900px) { .li-ci-index-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 480px) { .li-ci-index-grid { grid-template-columns: 1fr; } }
  .li-ci-index-cell { background: var(--li-bg); padding: 22px 20px; display: flex; flex-direction: column; gap: 8px; min-height: 150px; transition: background .15s; }
  .li-ci-index-cell:hover { background: var(--li-accent-soft); }
  .li-ci-index-cell.is-static { cursor: default; }
  .li-ci-index-cell.is-static:hover { background: var(--li-bg); }
  .li-ci-index-cell .label { font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--li-text-muted); font-weight: 500; }
  .li-ci-index-cell .pick { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 22px; line-height: 1.1; color: var(--li-text); }
  .li-ci-index-cell .pick em { font-style: italic; color: var(--li-accent-dark); font-weight: 500; }
  .li-ci-index-cell .source { font-size: 12px; color: var(--li-text-muted); margin-top: auto; font-style: italic; }

  /* ARTICLE DIRECTORY */
  .li-ci-region { margin-bottom: 48px; }
  .li-ci-region-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--li-line); padding-bottom: 12px; margin-bottom: 20px; }
  .li-ci-region-name { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 600; margin: 0; }
  .li-ci-region-meta { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--li-text-muted); font-feature-settings: "tnum"; }
  .li-ci-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
  .li-ci-card { position: relative; background: var(--li-bg); border: 1px solid var(--li-line); padding: 18px 18px 16px; border-radius: 4px; display: flex; flex-direction: column; gap: 4px; transition: all .15s ease; min-height: 180px; }
  .li-ci-card:hover { border-color: var(--li-accent); background: var(--li-surface); }
  .li-ci-card-name { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 17px; color: var(--li-text); line-height: 1.25; }
  .li-ci-card-byline { font-family: 'Playfair Display', serif; font-style: italic; font-weight: 400; font-size: 12.5px; color: var(--li-accent-dark); line-height: 1.35; margin-top: 2px; }
  .li-ci-card-blurb { font-size: 13px; color: var(--li-text-soft); line-height: 1.45; margin-top: 6px; flex-grow: 1; }
  .li-ci-card-meta { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--li-line); font-size: 11.5px; color: var(--li-text-muted); }
  .li-ci-card-arrow { color: var(--li-accent-dark); font-family: 'Playfair Display', serif; transition: transform .15s; }
  .li-ci-card:hover .li-ci-card-arrow { transform: translateX(3px); }

  /* OFF THE BEATEN PATH */
  .li-ci-otb-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; }
  @media (max-width: 820px) { .li-ci-otb-grid { grid-template-columns: 1fr; } }
  .li-ci-otb-card { display: flex; flex-direction: column; padding: 28px; border-radius: 4px; border: 1px solid var(--li-line); transition: all .2s ease; text-decoration: none; color: inherit; }
  .li-ci-otb-card:hover { border-color: var(--li-accent); transform: translateY(-2px); }
  .li-ci-otb-card-feature { background: var(--li-surface-2); }
  .li-ci-otb-card-feature:hover { background: var(--li-accent-soft); }
  .li-ci-otb-card-list { background: var(--li-bg); }
  .li-ci-otb-card-list:hover { background: var(--li-surface); }
  .li-ci-otb-kicker { font-size: 10.5px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--li-accent-dark); margin-bottom: 14px; }
  .li-ci-otb-title { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 22px; line-height: 1.2; color: var(--li-text); margin: 0 0 14px; }
  .li-ci-otb-text { font-size: 14px; color: var(--li-text-soft); line-height: 1.55; margin: 0 0 16px; }
  .li-ci-otb-byline { font-family: 'Playfair Display', serif; font-style: italic; font-size: 13px; color: var(--li-text-muted); margin-bottom: 14px; }
  .li-ci-otb-mini { list-style: none; padding: 0; margin: 0 0 16px; font-size: 13px; }
  .li-ci-otb-mini li { padding: 8px 0 8px 14px; border-bottom: 1px dashed var(--li-line); color: var(--li-text-soft); position: relative; line-height: 1.45; }
  .li-ci-otb-mini li:last-child { border-bottom: none; }
  .li-ci-otb-mini li::before { content: "·"; position: absolute; left: 0; color: var(--li-accent-dark); font-weight: 700; }
  .li-ci-otb-cta { margin-top: auto; font-family: 'Playfair Display', serif; font-style: italic; font-size: 14px; color: var(--li-accent-dark); font-weight: 500; padding-top: 14px; border-top: 1px solid var(--li-line); }

  /* QUIZ CTA — replaces the old iframe embed.
     A single clickable card linking to the existing widget page. */
  .li-ci-quiz-cta { display: block; text-align: center; background: var(--li-surface-2); border: 1px solid var(--li-accent); border-radius: 4px; padding: 48px 32px; transition: all .2s ease; text-decoration: none; color: inherit; }
  .li-ci-quiz-cta:hover { background: var(--li-accent-soft); transform: translateY(-2px); }
  .li-ci-quiz-cta-eyebrow { display: block; font-size: 11px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: var(--li-accent-dark); margin-bottom: 14px; }
  .li-ci-quiz-cta-title { font-family: 'Playfair Display', serif; font-size: 28px; font-weight: 600; margin: 0 0 14px; line-height: 1.2; color: var(--li-text); }
  .li-ci-quiz-cta-title em { font-style: italic; color: var(--li-accent-dark); }
  .li-ci-quiz-cta-lede { color: var(--li-text-soft); font-size: 14.5px; max-width: 56ch; margin: 0 auto 24px; line-height: 1.55; }
  .li-ci-quiz-cta-btn { display: inline-block; padding: 12px 22px; background: var(--li-text); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; border-radius: 4px; transition: background .15s; }
  .li-ci-quiz-cta:hover .li-ci-quiz-cta-btn { background: var(--li-accent-dark); }

  /* INSTAGRAM CTA */
  .li-ci-instagram { margin-top: 48px; }
  .li-ci-instagram-card { display: block; text-align: center; background: var(--li-surface-2); border: 1px solid var(--li-line); border-radius: 4px; padding: 48px 32px; transition: all .2s ease; text-decoration: none; color: inherit; }
  .li-ci-instagram-card:hover { background: var(--li-accent-soft); border-color: var(--li-accent); }
  .li-ci-instagram-handle { font-family: 'Playfair Display', serif; font-style: italic; font-size: 14px; color: var(--li-accent-dark); letter-spacing: 0.05em; margin-bottom: 12px; }
  .li-ci-instagram h3 { font-family: 'Playfair Display', serif; font-size: 26px; font-weight: 600; margin: 0 0 12px; line-height: 1.2; }
  .li-ci-instagram h3 em { font-style: italic; color: var(--li-accent-dark); }
  .li-ci-instagram p { color: var(--li-text-soft); max-width: 52ch; margin: 0 auto 24px; font-size: 14.5px; }
  .li-ci-instagram-cta { display: inline-block; padding: 12px 22px; background: var(--li-text); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; border-radius: 4px; transition: background .15s; }
  .li-ci-instagram-card:hover .li-ci-instagram-cta { background: var(--li-accent-dark); }

  /* ARCHIVE HEADER (above the WordPress loop, at the bottom of the page) */
  .li-ci-archive-head {
    margin: 56px 0 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--li-line);
  }
  .li-ci-archive-head h2 {
    font-size: 28px;
    line-height: 1.2;
    font-weight: 600;
    margin-top: 8px;
  }
  .li-ci-archive-head h2 em {
    font-style: italic;
    color: var(--li-accent-dark);
    font-weight: 500;
  }
  .li-ci-archive-lede {
    font-size: 14px;
    color: var(--li-text-soft);
    margin: 12px 0 0;
    max-width: 60ch;
    line-height: 1.55;
  }

  

  /* DYNAMIC-NUMBER MARKERS (mockup-only — shows what comes from WP) */

  
  /* ============================================================
     REGIONS / COUNTRIES / CITIES — where-to-go hub only.
     Uses the SAME class names + visual styling as the
     li-country-info plugin's "Top cities to visit" section on
     country pages, so /where-to-go/ looks consistent with
     /montenegro/, /austria/, /portugal/ etc.
     ============================================================ */

  /* Region grouping (our addition — country-info doesn't group) */
  .li-ci-region-group { margin-bottom: 28px; }
  .li-ci-region-group:last-child { margin-bottom: 0; }
  .li-ci-region-label {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 18px;
    font-weight: 500;
    margin: 0 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--li-line);
    color: var(--li-text);
  }
  .li-ci-region-count {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--li-text-muted);
    margin-left: 4px;
  }

  /* .li-ci-cities + .li-ci-city — IDENTICAL to country-info plugin */
  .li-ci-cities {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  @media (max-width: 768px) {
    .li-ci-cities { grid-template-columns: 1fr; }
  }
  .li-ci-city {
    display: block;
    padding: 14px 16px;
    background: var(--li-surface);
    border: 1px solid var(--li-line);
    border-radius: 2px;
    text-decoration: none;
    color: var(--li-text);
    transition: all 0.15s ease;
  }
  .li-ci-city:hover {
    border-color: var(--li-accent);
    background: var(--li-accent-soft);
    transform: translateY(-1px);
  }
  .li-ci-city.li-ci-city-empty {
    opacity: 0.55;
  }
  .li-ci-city.li-ci-city-empty:hover {
    opacity: 0.8;
    transform: none;
  }
  .li-ci-city-name {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 600;
    font-size: 16px;
    display: block;
    margin: 0 0 4px 0;
    color: var(--li-text);
  }
  .li-ci-city-name::after {
    content: " →";
    color: var(--li-accent-dark);
    font-family: 'Inter', sans-serif;
    font-weight: 400;
  }
  .li-ci-city-desc {
    font-size: 12px;
    color: var(--li-text-muted);
    line-height: 1.5;
    display: block;
  }

  /* Country flag + count badge inside .li-ci-city-name */
  .li-ci-country-flag {
    font-size: 17px;
    line-height: 1;
    margin-right: 4px;
    vertical-align: -1px;
  }
  .li-ci-country-count {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: var(--li-accent-dark);
    background: var(--li-accent-soft);
    padding: 2px 7px;
    border-radius: 10px;
    margin-left: 6px;
    vertical-align: 1px;
  }
  /* Hide the "→" arrow when count badge is present (cleaner layout) */
  .li-ci-city-name:has(.li-ci-country-count)::after { content: ""; }

  /* Use the country-info plugin's section-title style for these sections too */
  .li-ci-hub .li-ci-section-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 16px;
    line-height: 1.2;
    color: var(--li-text);
  }
  .li-ci-hub .li-ci-section-title em {
    font-style: italic;
    color: var(--li-accent-dark);
  }
  .li-ci-hub .li-ci-eyebrow {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--li-accent-dark);
    margin-bottom: 14px;
  }
/* ===== Where to Go: months + this month's events ===== */
.li-ci-months{padding:34px 0 8px}
.li-ci-months-head{margin-bottom:18px}
.li-ci-h2{font-family:'Playfair Display',serif;font-size:26px;font-weight:600;margin:0 0 6px}.li-ci-h2 em{font-style:italic;color:#9a7d4d}
.li-ci-lede{font-size:13.5px;color:#4a4a4a;margin:0;max-width:640px;line-height:1.6}
.li-ci-mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.li-ci-mo{display:flex;flex-direction:column;gap:8px;border:1px solid #e4e4e2;border-radius:6px;padding:16px 16px 18px;color:#1a1a1a;text-decoration:none;background:#fff}
.li-ci-mo.is-now{border-color:#c5a572;background:#faf8f3}
.li-ci-mo-n{font-family:'Playfair Display',serif;font-size:19px;font-weight:600}
.li-ci-mo-n small{font:600 9.5px/1 Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#9a7d4d;margin-left:8px}
.li-ci-mo-tip{font-size:12px;color:#4a4a4a;line-height:1.5;border-top:1px solid #e4e4e2;padding-top:8px}
.li-ci-mo-tip::before{content:'Tip \00b7 ';color:#9a7d4d;font-weight:600}
.li-ci-mo-go{font:600 10.5px/1 Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid #c5a572;align-self:flex-start;padding-bottom:2px;margin-top:auto}
.li-ci-mo:hover .li-ci-mo-go{color:#9a7d4d}
.li-ci-events{margin-top:30px;padding-top:26px;border-top:1px solid #e4e4e2}
@media(max-width:900px){.li-ci-mgrid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.li-ci-mgrid{display:flex;overflow-x:auto;gap:12px;margin:0 -16px;padding:0 16px 8px;scroll-snap-type:x proximity}.li-ci-mgrid::-webkit-scrollbar{display:none}.li-ci-mo{flex:0 0 78%;scroll-snap-align:start}}

/* ===== 3.27.6 — hub intro at reading size (theme's display subtitle was far too large) ===== */
body.category .cs-page__header .cs-entry__subtitle{
  font-family:Inter,-apple-system,sans-serif!important;font-size:16px!important;line-height:1.6!important;
  font-weight:400!important;letter-spacing:0!important;color:#4a4a4a!important;
  max-width:680px;margin:12px 0 0!important}
@media(min-width:769px){body.category .cs-page__header .cs-entry__subtitle{font-size:17px!important;margin-top:14px!important}}