/*
Theme Name: Východ News
Theme URI: https://example.com/
Author: OpenAI
Description: Responzívna spravodajská WordPress téma s rotujúcim hlavným článkom, aktuálnymi správami a kategóriovými kartami.
Version: 4.49.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 8.0
Text Domain: vychod-news
License: GPL-2.0-or-later
*/

:root {
  --vn-navy: #041d45;
  --vn-navy-2: #082857;
  --vn-blue: #f10e1d;
  --vn-red: #f10e1d;
  --vn-text: #041d45;
  --vn-muted: #6d7683;
  --vn-border: #dde2ea;
  --vn-bg: #ffffff;
  --vn-soft: #f7f8fb;
  --vn-radius: 4px;
  --vn-shadow: 0 6px 24px rgba(8, 30, 51, .06);
  --vn-container: 1390px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--vn-text);
  background: var(--vn-bg);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--vn-blue); }
button, input, textarea, select { font: inherit; }

.vn-container {
  width: min(calc(100% - 32px), var(--vn-container));
  margin-inline: auto;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}
.screen-reader-text:focus {
  clip: auto !important; width: auto; height: auto;
  padding: 10px 14px; margin: 8px; background: #fff;
  z-index: 100000; top: 0; left: 0;
}

/* Top bar */
.vn-topbar {
  background: var(--vn-navy);
  color: rgba(255,255,255,.88);
  font-size: 13px;
}
.vn-topbar__inner {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.vn-topbar__left, .vn-topbar__right { display: flex; align-items: center; gap: 22px; }
.vn-topbar__date { font-weight: 700; white-space: nowrap; }
.vn-topbar .menu { display: flex; align-items: center; gap: 20px; list-style: none; padding: 0; margin: 0; }
.vn-topbar a { color: rgba(255,255,255,.86); }
.vn-topbar a:hover { color: #fff; }
.vn-social { display: flex; align-items: center; gap: 16px; }
.vn-social a { font-weight: 800; opacity: .92; }

/* Branding */
.vn-branding {
  min-height: 130px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 30px;
}
.vn-branding__logo { display: flex; align-items: center; min-width: 0; }
.custom-logo-link { display: inline-flex; align-items: center; }
.custom-logo { max-height: 96px; width: auto; }
.vn-site-title {
  margin: 0;
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 900;
  letter-spacing: -1.5px;
}
.vn-site-description { margin: 4px 0 0; color: var(--vn-muted); font-size: 13px; }
.vn-branding__actions { display: flex; align-items: stretch; border-left: 1px solid var(--vn-border); }
.vn-icon-action, .vn-login-link {
  min-height: 72px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 28px;
  border: 0;
  background: transparent;
  color: var(--vn-text);
  font-weight: 700;
  cursor: pointer;
}
.vn-icon-action { font-size: 27px; border-right: 1px solid var(--vn-border); }
.vn-login-link { font-size: 14px; }
.vn-icon { width: 22px; height: 22px; display: inline-block; }

/* Search */
.vn-search-panel { display: none; border-top: 1px solid var(--vn-border); border-bottom: 1px solid var(--vn-border); padding: 16px 0; background: #fff; }
.vn-search-panel.is-open { display: block; }
.vn-search-form { display: flex; gap: 10px; }
.vn-search-form input[type="search"] {
  flex: 1;
  min-width: 0;
  padding: 13px 15px;
  border: 1px solid #cfd6dd;
  border-radius: var(--vn-radius);
}
.vn-search-form button {
  border: 0;
  background: var(--vn-navy);
  color: #fff;
  font-weight: 800;
  padding: 0 22px;
  border-radius: var(--vn-radius);
  cursor: pointer;
}

/* Main navigation */
.vn-mainnav-wrap { border-top: 1px solid var(--vn-border); border-bottom: 1px solid var(--vn-border); background: #fff; }
.vn-mainnav { min-height: 56px; display: flex; align-items: stretch; }
.vn-home-link {
  width: 58px;
  flex: 0 0 58px;
  background: var(--vn-navy);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}
.vn-home-link:hover { color: #fff; background: var(--vn-navy-2); }
.vn-menu-toggle { display: none; margin-left: auto; border: 0; background: transparent; font-size: 25px; padding: 0 16px; cursor: pointer; }
.vn-primary-nav { flex: 1; min-width: 0; }
.vn-primary-nav .menu {
  list-style: none;
  margin: 0;
  padding: 0 8px;
  display: flex;
  align-items: stretch;
  height: 100%;
}
.vn-primary-nav .menu > li { position: relative; display: flex; }
.vn-primary-nav .menu > li > a {
  display: flex;
  align-items: center;
  padding: 0 24px;
  min-height: 56px;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -.1px;
  white-space: nowrap;
}
.vn-primary-nav .menu > li.current-menu-item > a,
.vn-primary-nav .menu > li.current-menu-ancestor > a { color: var(--vn-blue); }
.vn-primary-nav .menu > li.menu-item-has-children > a::after { content: "⌄"; font-size: 14px; margin-left: 9px; transform: translateY(-2px); }
.vn-primary-nav .sub-menu {
  display: none;
  position: absolute;
  top: 100%; left: 0;
  min-width: 230px;
  background: #fff;
  list-style: none;
  padding: 7px 0;
  margin: 0;
  border: 1px solid var(--vn-border);
  box-shadow: var(--vn-shadow);
  z-index: 50;
}
.vn-primary-nav li:hover > .sub-menu,
.vn-primary-nav li:focus-within > .sub-menu { display: block; }
.vn-primary-nav .sub-menu a { display: block; padding: 10px 15px; font-size: 14px; font-weight: 700; }

/* Homepage */
.vn-home { padding: 24px 0 50px; }
.vn-lead-grid {
  display: grid;
  grid-template-columns: minmax(0, 2.1fr) minmax(315px, .9fr);
  gap: 22px;
  align-items: stretch;
}
.vn-hero {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  min-height: 470px;
  overflow: hidden;
  border-radius: var(--vn-radius);
  background: var(--vn-navy);
  box-shadow: var(--vn-shadow);
}
.vn-hero__media { position: relative; min-height: 370px; background: #dce3e8; }
.vn-hero__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vn-placeholder { width: 100%; height: 100%; min-height: 220px; background: linear-gradient(135deg, #dbe3e9, #aebbc6); }
.vn-hero__content {
  background: var(--vn-navy);
  color: #fff;
  padding: clamp(30px, 4vw, 52px) clamp(26px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.vn-kicker {
  display: inline-flex;
  align-self: flex-start;
  padding: 4px 8px;
  background: var(--vn-blue);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  margin-bottom: 15px;
}
.vn-hero__title {
  margin: 0;
  font-size: clamp(31px, 3.3vw, 50px);
  line-height: 1.05;
  letter-spacing: -1.4px;
  font-weight: 900;
}
.vn-hero__title a { color: #fff; }
.vn-hero__excerpt { margin: 20px 0 0; color: rgba(255,255,255,.82); font-size: 17px; line-height: 1.48; }
.vn-meta { margin-top: 24px; color: rgba(255,255,255,.76); display: flex; flex-wrap: wrap; gap: 10px 14px; font-size: 13px; }
.vn-meta--dark { color: var(--vn-muted); }

/* Quick news */
.vn-quick {
  border: 1px solid var(--vn-border);
  border-radius: var(--vn-radius);
  background: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
.vn-quick__title { margin: 0; padding: 18px 22px 12px; font-size: 20px; line-height: 1.1; text-transform: uppercase; font-weight: 900; }
.vn-quick__list { list-style: none; margin: 0; padding: 0 22px; flex: 1; }
.vn-quick__item { display: grid; grid-template-columns: 52px 1fr; gap: 10px; padding: 13px 0; border-top: 1px solid var(--vn-border); }
.vn-quick__time { color: var(--vn-red); font-size: 13px; font-weight: 900; }
.vn-quick__link { font-size: 14px; line-height: 1.32; font-weight: 800; }
.vn-quick__all { margin-top: auto; display: flex; align-items: center; justify-content: center; min-height: 48px; background: var(--vn-navy); color: #fff; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.vn-quick__all:hover { color: #fff; background: var(--vn-navy-2); }

.vn-card-grid { margin-top: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.vn-card { border: 1px solid var(--vn-border); border-radius: var(--vn-radius); overflow: hidden; background: #fff; box-shadow: 0 3px 14px rgba(8, 30, 51, .035); }
.vn-card__media { aspect-ratio: 16/7.4; background: #dfe5e9; position: relative; overflow: hidden; }
.vn-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; display: block; }
.vn-card:hover .vn-card__media img { transform: scale(1.025); }
.vn-card__label { position: absolute; left: 12px; bottom: 0; padding: 4px 8px; background: var(--vn-blue); color: #fff; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.vn-card__body { padding: 14px 14px 13px; }
.vn-card__title { margin: 0; font-size: 18px; line-height: 1.2; font-weight: 900; letter-spacing: -.2px; }
.vn-card__meta { margin-top: 9px; color: var(--vn-muted); font-size: 12px; }

/* Generic pages */
.vn-content-grid { padding: 36px 0 60px; display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 40px; }
.vn-page-title { margin: 0 0 25px; font-size: clamp(30px, 4vw, 48px); line-height: 1.1; }
.vn-post-list { display: grid; gap: 25px; }
.vn-list-card { display: grid; grid-template-columns: 290px 1fr; gap: 22px; padding-bottom: 25px; border-bottom: 1px solid var(--vn-border); }
.vn-list-card__media { aspect-ratio: 16 / 10; background: #e0e6eb; overflow: hidden; }
.vn-list-card__media img { width: 100%; height: 100%; object-fit: cover; }
.vn-list-card h2 { margin: 0 0 10px; font-size: 26px; line-height: 1.16; }
.vn-list-card p { color: #4d5965; margin: 10px 0 0; }
.vn-pagination { margin-top: 35px; }
.vn-pagination .nav-links { display: flex; gap: 7px; flex-wrap: wrap; }
.vn-pagination a, .vn-pagination span { padding: 8px 12px; border: 1px solid var(--vn-border); border-radius: 3px; }
.vn-pagination .current { background: var(--vn-navy); color: #fff; border-color: var(--vn-navy); }

.vn-sidebar .widget { border: 1px solid var(--vn-border); padding: 20px; margin-bottom: 20px; }
.vn-sidebar .widget-title { margin: 0 0 14px; font-size: 18px; text-transform: uppercase; }
.vn-sidebar ul { margin: 0; padding-left: 20px; }

/* Single */
.vn-article { max-width: 860px; }
.vn-article__category { margin-bottom: 12px; }
.vn-article__title { margin: 0; font-size: clamp(36px, 5.2vw, 62px); line-height: 1.03; letter-spacing: -1.7px; }
.vn-article__lead { font-size: 20px; color: #475461; margin: 20px 0; }
.vn-article__image { margin: 28px 0; }
.vn-article__image img { width: 100%; display: block; }
.vn-entry-content { font-size: 18px; line-height: 1.75; }
.vn-entry-content h2 { margin-top: 1.7em; font-size: 31px; line-height: 1.18; }
.vn-entry-content h3 { margin-top: 1.5em; font-size: 24px; }
.vn-entry-content a { color: var(--vn-blue); text-decoration: underline; }
.vn-entry-content blockquote { margin: 1.6em 0; padding: 10px 0 10px 22px; border-left: 4px solid var(--vn-blue); font-size: 21px; font-weight: 700; }
.vn-entry-content figure { max-width: 100%; }

/* Comments */
.comments-area { margin-top: 50px; padding-top: 25px; border-top: 1px solid var(--vn-border); }
.comment-list { padding-left: 20px; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea {
  width: 100%; border: 1px solid #cfd6dd; padding: 12px; border-radius: 3px;
}
.form-submit .submit { background: var(--vn-navy); color: #fff; border: 0; padding: 12px 20px; font-weight: 800; cursor: pointer; }

/* Footer */
.vn-footer { margin-top: 30px; background: var(--vn-navy); color: #fff; }
.vn-footer__inner { padding: 36px 0; display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; }
.vn-footer__title { font-size: 24px; font-weight: 900; }
.vn-footer__meta { margin-top: 5px; color: rgba(255,255,255,.68); font-size: 13px; }
.vn-footer .menu { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 18px; }
.vn-footer .menu a { color: rgba(255,255,255,.86); font-size: 13px; }

@media (max-width: 1180px) {
  .vn-primary-nav .menu > li > a { padding-inline: 12px; font-size: 11.5px; }
}

@media (max-width: 900px) {
  .vn-lead-grid { grid-template-columns: 1fr; }
  .vn-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vn-quick__list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 24px; }
  .vn-topbar__inner { min-height: 36px; }
  .vn-topbar__left .menu { display: none; }
  .vn-branding { min-height: 95px; }
  .custom-logo { max-height: 68px; }
  .vn-branding__actions { border-left: 0; }
  .vn-icon-action, .vn-login-link { padding: 0 14px; min-height: 58px; }
  .vn-login-link span { display: none; }

  .vn-menu-toggle { display: block; }
  .vn-primary-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--vn-border); box-shadow: var(--vn-shadow); z-index: 100; }
  .vn-mainnav-wrap { position: relative; }
  .vn-primary-nav.is-open { display: block; }
  .vn-primary-nav .menu { display: block; padding: 8px 16px 18px; }
  .vn-primary-nav .menu > li { display: block; }
  .vn-primary-nav .menu > li > a { min-height: 44px; padding: 0 4px; }
  .vn-primary-nav .sub-menu { display: block; position: static; box-shadow: none; border: 0; padding: 0 0 7px 15px; }
  .vn-primary-nav .sub-menu a { padding: 7px 4px; }

  .vn-hero { grid-template-columns: 1fr; }
  .vn-hero__media { min-height: 360px; }
  .vn-content-grid { grid-template-columns: 1fr; }
  .vn-sidebar { order: 2; }
}

@media (max-width: 640px) {
  .vn-container { width: min(calc(100% - 20px), var(--vn-container)); }
  .vn-topbar__right { display: none; }
  .vn-branding { min-height: 82px; }
  .vn-site-title { font-size: 30px; }
  .vn-site-description { display: none; }
  .vn-login-link { display: none; }
  .vn-home-link { width: 52px; flex-basis: 52px; }
  .vn-home { padding-top: 12px; }
  .vn-lead-grid, .vn-card-grid { gap: 14px; }
  .vn-hero__media { min-height: 285px; }
  .vn-hero__content { padding: 25px 22px 28px; }
  .vn-hero__title { font-size: 32px; }
  .vn-hero__excerpt { font-size: 15px; }
  .vn-quick__list { grid-template-columns: 1fr; }
  .vn-card-grid { grid-template-columns: 1fr; }
  .vn-card__media { aspect-ratio: 16/8.6; }
  .vn-list-card { grid-template-columns: 1fr; }
  .vn-list-card h2 { font-size: 23px; }
  .vn-footer__inner { grid-template-columns: 1fr; }
  .vn-footer .menu { gap: 10px 16px; }
}

/* Homepage refinements: compact four-card strip + news feed + popular filter */
.vn-card-grid {
  margin-top: 20px;
  gap: 18px;
}
.vn-card {
  border-radius: 3px;
  box-shadow: 0 2px 8px rgba(8, 30, 51, .035);
}
.vn-card__media {
  aspect-ratio: 16 / 6.3;
}
.vn-card__body {
  padding: 12px 13px 12px;
}
.vn-card__title {
  font-size: 17px;
  line-height: 1.22;
}
.vn-card__meta {
  margin-top: 7px;
  font-size: 11.5px;
}

.vn-home-more {
  margin-top: 34px;
  padding-top: 8px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 42px;
  align-items: start;
}

.vn-home-feed__list {
  display: grid;
  gap: 0;
}
.vn-feed-card {
  display: grid;
  grid-template-columns: minmax(330px, 41%) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  padding: 32px 0;
  border-top: 1px solid var(--vn-border);
}
.vn-feed-card:first-child {
  border-top: 0;
  padding-top: 0;
}
.vn-feed-card__media {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 4px;
  background: #dfe5e9;
}
.vn-feed-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .25s ease;
}
.vn-feed-card:hover .vn-feed-card__media img {
  transform: scale(1.018);
}
.vn-feed-card__label {
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 2;
  padding: 4px 9px;
  background: var(--vn-blue);
  color: #fff;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-feed-card__meta {
  margin-bottom: 11px;
  color: var(--vn-blue);
  font-size: 13px;
  line-height: 1.25;
  font-weight: 900;
}
.vn-feed-card__title {
  margin: 0;
  font-size: clamp(23px, 2vw, 30px);
  line-height: 1.12;
  letter-spacing: -.55px;
  font-weight: 900;
}
.vn-feed-card__excerpt {
  margin: 14px 0 0;
  color: #4c5967;
  font-size: 16px;
  line-height: 1.48;
}
.vn-empty-state {
  margin: 0;
  padding: 28px;
  border: 1px solid var(--vn-border);
  color: var(--vn-muted);
}

.vn-popular {
  position: sticky;
  top: 20px;
  border: 1px solid var(--vn-border);
  background: #fff;
  padding: 22px 22px 18px;
  box-shadow: 0 3px 16px rgba(8, 30, 51, .035);
}
.vn-popular__title {
  margin: 0 0 18px;
  color: var(--vn-text);
  font-size: 22px;
  line-height: 1.12;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-popular__tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 18px;
}
.vn-popular__tab {
  min-height: 43px;
  border: 1px solid #d7e0e8;
  background: #fff;
  color: var(--vn-blue);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.vn-popular__tab:hover,
.vn-popular__tab.is-active {
  border-color: var(--vn-blue);
  background: var(--vn-blue);
  color: #fff;
}
.vn-popular__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.vn-popular__list[hidden] {
  display: none !important;
}
.vn-popular__item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid var(--vn-border);
}
.vn-popular__item:first-child {
  padding-top: 3px;
  border-top: 0;
}
.vn-popular__rank {
  color: var(--vn-blue);
  font-size: 30px;
  line-height: 1;
  font-weight: 900;
}
.vn-popular__link {
  display: block;
  font-size: 15px;
  line-height: 1.32;
  font-weight: 900;
}
.vn-popular__views {
  margin-top: 7px;
  color: var(--vn-muted);
  font-size: 12px;
  line-height: 1.2;
}

@media (max-width: 1180px) {
  .vn-home-more {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 28px;
  }
  .vn-feed-card {
    grid-template-columns: minmax(280px, 40%) minmax(0, 1fr);
    gap: 22px;
  }
}

@media (max-width: 980px) {
  .vn-home-more {
    grid-template-columns: 1fr;
  }
  .vn-popular {
    position: static;
  }
}

@media (max-width: 700px) {
  .vn-feed-card {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px 0;
  }
  .vn-feed-card__media {
    aspect-ratio: 16 / 9;
  }
  .vn-feed-card__title {
    font-size: 24px;
  }
  .vn-feed-card__excerpt {
    font-size: 15px;
  }
  .vn-card__media {
    aspect-ratio: 16 / 8.6;
  }
  .vn-popular {
    padding: 18px 16px 14px;
  }
}


/* Desktop density refinement v1.2
   The desktop layout is intentionally about 10% more compact while mobile
   keeps the existing touch-friendly sizing. */
@media (min-width: 901px) {
  .vn-topbar { font-size: 12px; }
  .vn-topbar__inner { min-height: 36px; }
  .vn-topbar__left, .vn-topbar__right { gap: 20px; }
  .vn-topbar .menu { gap: 18px; }
  .vn-social { gap: 14px; }

  .vn-branding { min-height: 117px; gap: 27px; }
  .custom-logo { max-height: 86px; }
  .vn-site-title { font-size: clamp(25px, 3.6vw, 43px); }
  .vn-site-description { font-size: 12px; }
  .vn-icon-action, .vn-login-link { min-height: 65px; padding-inline: 25px; }
  .vn-icon-action { font-size: 24px; }
  .vn-login-link { font-size: 13px; }
  .vn-icon { width: 20px; height: 20px; }

  .vn-mainnav { min-height: 50px; }
  .vn-home-link { width: 52px; flex-basis: 52px; font-size: 20px; }
  .vn-primary-nav .menu > li > a {
    min-height: 50px;
    padding-inline: 21px;
    font-size: 12px;
  }

  .vn-home { padding: 22px 0 45px; }
  .vn-lead-grid { gap: 20px; }
  .vn-hero { min-height: 423px; }
  .vn-hero__media { min-height: 333px; }
  .vn-hero__content { padding: clamp(27px, 3.6vw, 47px) clamp(23px, 3.6vw, 43px); }
  .vn-kicker { padding: 4px 7px; margin-bottom: 13px; font-size: 10px; }
  .vn-hero__title { font-size: clamp(28px, 3vw, 45px); letter-spacing: -1.2px; }
  .vn-hero__excerpt { margin-top: 18px; font-size: 15.5px; }
  .vn-meta { margin-top: 22px; gap: 9px 13px; font-size: 12px; }

  .vn-quick__title { padding: 16px 20px 11px; font-size: 18px; }
  .vn-quick__list { padding-inline: 20px; }
  .vn-quick__item { grid-template-columns: 47px 1fr; gap: 9px; padding: 12px 0; }
  .vn-quick__time { font-size: 12px; }
  .vn-quick__link { font-size: 13px; }
  .vn-quick__all { min-height: 43px; font-size: 11px; }

  .vn-card-grid { margin-top: 18px; gap: 16px; }
  .vn-card__label { left: 11px; padding: 4px 7px; font-size: 9px; }
  .vn-card__body { padding: 11px 12px; }
  .vn-card__title { font-size: 15.5px; }
  .vn-card__meta { margin-top: 6px; font-size: 10.5px; }

  .vn-home-more {
    margin-top: 31px;
    padding-top: 7px;
    grid-template-columns: minmax(0, 1fr) 324px;
    gap: 38px;
  }
  .vn-feed-card {
    grid-template-columns: minmax(297px, 41%) minmax(0, 1fr);
    gap: 25px;
    padding: 29px 0;
  }
  .vn-feed-card__label { left: 11px; top: 11px; padding: 4px 8px; font-size: 9px; }
  .vn-feed-card__meta { margin-bottom: 10px; font-size: 12px; }
  .vn-feed-card__title { font-size: clamp(21px, 1.8vw, 27px); letter-spacing: -.5px; }
  .vn-feed-card__excerpt { margin-top: 13px; font-size: 14.5px; }

  .vn-popular { top: 18px; padding: 20px 20px 16px; }
  .vn-popular__title { margin-bottom: 16px; font-size: 20px; }
  .vn-popular__tabs { gap: 6px; margin-bottom: 16px; }
  .vn-popular__tab { min-height: 39px; font-size: 12px; }
  .vn-popular__item { grid-template-columns: 31px minmax(0, 1fr); gap: 9px; padding: 13px 0; }
  .vn-popular__rank { font-size: 27px; }
  .vn-popular__link { font-size: 13.5px; }
  .vn-popular__views { margin-top: 6px; font-size: 11px; }

  .vn-content-grid { padding: 32px 0 54px; grid-template-columns: minmax(0, 1fr) 297px; gap: 36px; }
  .vn-page-title { margin-bottom: 23px; font-size: clamp(27px, 3.6vw, 43px); }
  .vn-post-list { gap: 23px; }
  .vn-list-card { grid-template-columns: 261px 1fr; gap: 20px; padding-bottom: 23px; }
  .vn-list-card h2 { margin-bottom: 9px; font-size: 23px; }
  .vn-sidebar .widget { padding: 18px; margin-bottom: 18px; }
  .vn-sidebar .widget-title { margin-bottom: 13px; font-size: 16px; }

  .vn-article { max-width: 774px; }
  .vn-article__title { font-size: clamp(32px, 4.7vw, 56px); letter-spacing: -1.5px; }
  .vn-article__lead { margin: 18px 0; font-size: 18px; }
  .vn-article__image { margin: 25px 0; }
  .vn-entry-content { font-size: 16.2px; }
  .vn-entry-content h2 { font-size: 28px; }
  .vn-entry-content h3 { font-size: 22px; }
  .vn-entry-content blockquote { font-size: 19px; }

  .vn-footer { margin-top: 27px; }
  .vn-footer__inner { padding: 32px 0; gap: 27px; }
  .vn-footer__title { font-size: 22px; }
  .vn-footer__meta, .vn-footer .menu a { font-size: 12px; }
}


/* Main homepage headline refinement v1.3
   Reduce only the main hero article title by 20% across breakpoints. */
.vn-hero__title {
  font-size: clamp(24.8px, 2.64vw, 40px);
}
@media (min-width: 901px) {
  .vn-hero__title { font-size: clamp(22.4px, 2.4vw, 36px); }
}
@media (max-width: 640px) {
  .vn-hero__title { font-size: 25.6px; }
}


/* Homepage reference-match refinement v1.5
   Matches the supplied desktop reference: compact header, 2-column lead block,
   quick-news panel alongside it, and four headline cards in a single row. */
@media (min-width: 901px) {
  .vn-topbar__inner { min-height: 28px; }
  .vn-topbar { font-size: 11.5px; }

  .vn-branding { min-height: 96px; }
  .custom-logo { max-height: 82px; }
  .vn-icon-action, .vn-login-link { min-height: 62px; }

  .vn-mainnav { min-height: 42px; }
  .vn-home-link { width: 46px; flex-basis: 46px; font-size: 19px; }
  .vn-primary-nav .menu > li > a {
    min-height: 42px;
    padding-inline: clamp(10px, 1.45vw, 20px);
    font-size: 11.5px;
  }

  .vn-home { padding-top: 16px; }
  .vn-lead-grid {
    grid-template-columns: minmax(0, 2.1fr) minmax(300px, .9fr);
    gap: 18px;
  }
  .vn-hero {
    min-height: 350px;
    grid-template-columns: 1.05fr .95fr;
  }
  .vn-hero__media { min-height: 350px; }
  .vn-hero__content { padding: 24px 22px 23px; }
  .vn-kicker { margin-bottom: 11px; font-size: 9px; padding: 3px 6px; }
  .vn-hero__title {
    font-size: clamp(25px, 2.65vw, 31px);
    line-height: 1.08;
    letter-spacing: -.8px;
  }
  .vn-hero__excerpt {
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.42;
  }
  .vn-meta { margin-top: 16px; font-size: 11px; }

  .vn-quick { min-height: 350px; }
  .vn-quick__title { padding: 13px 17px 9px; font-size: 17px; }
  .vn-quick__list { padding: 0 17px; display: block; }
  .vn-quick__item {
    grid-template-columns: 43px 1fr;
    gap: 8px;
    padding: 8px 0;
  }
  .vn-quick__time { font-size: 11px; }
  .vn-quick__link { font-size: 11.5px; line-height: 1.25; }
  .vn-quick__all { min-height: 35px; font-size: 10px; }

  .vn-card-grid {
    margin-top: 16px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
  }
  .vn-card__media { aspect-ratio: 16 / 6.7; }
  .vn-card__label {
    left: 10px;
    top: auto;
    bottom: 0;
    padding: 3px 6px;
    font-size: 8.5px;
    z-index: 2;
  }
  .vn-card__body { padding: 10px 11px 9px; }
  .vn-card__title {
    position: static;
    margin: 0;
    color: var(--vn-text);
    font-size: 14.5px;
    line-height: 1.18;
    letter-spacing: -.15px;
    text-shadow: none;
    display: block;
    overflow: visible;
  }
  .vn-card__title a { color: inherit; }
  .vn-card__meta { margin-top: 6px; font-size: 10px; }
  .vn-card__media::after { display: none; }
}

/* Keep the familiar two-column tablet strip until mobile. */
@media (min-width: 641px) and (max-width: 900px) {
  .vn-card__label { top: auto; bottom: 0; }
  .vn-card__title { position: static; color: var(--vn-text); text-shadow: none; display: block; }
  .vn-card__media::after { display: none; }
}

@media (max-width: 640px) {
  .vn-card__label { top: auto; bottom: 0; }
  .vn-card__title { position: static; color: var(--vn-text); text-shadow: none; display: block; font-size: 17px; }
  .vn-card__media::after { display: none; }
}


/* Homepage card headline visibility fix v1.6
   Ensure the four cards below the hero always show a visible headline.
   The title is displayed inside the image with a dark gradient overlay,
   while the body below keeps the meta/date line. */
.vn-card__media {
  display: block;
}
.vn-card__overlay {
  position: absolute;
  inset: auto 0 0 0;
  padding: 34px 12px 10px;
  background: linear-gradient(to top, rgba(5,18,34,.88) 0%, rgba(5,18,34,.55) 45%, rgba(5,18,34,0) 100%);
  z-index: 1;
}
.vn-card__overlay-title {
  display: block;
  color: #fff;
  font-size: 15px;
  line-height: 1.22;
  font-weight: 900;
  letter-spacing: -.15px;
  text-shadow: 0 1px 1px rgba(0,0,0,.18);
}
.vn-card__label {
  z-index: 2;
}
.vn-card__body {
  padding-top: 8px;
}
.vn-card__body .vn-card__title {
  display: none;
}
@media (min-width: 901px) {
  .vn-card__overlay {
    padding: 36px 10px 9px;
  }
  .vn-card__overlay-title {
    font-size: 13.5px;
    line-height: 1.18;
  }
  .vn-card__body {
    padding: 8px 11px 9px;
  }
  .vn-card__meta {
    margin-top: 0;
  }
}
@media (max-width: 640px) {
  .vn-card__overlay-title {
    font-size: 16px;
  }
}


/* Homepage card title fallback fix v1.7
   Show the headline clearly below the image, because this is the most robust
   layout and matches the original homepage-style cards more reliably. */
.vn-card__overlay {
  display: none !important;
}
.vn-card__body {
  padding: 12px 12px 10px !important;
}
.vn-card__body .vn-card__title {
  display: block !important;
  margin: 0 !important;
  color: var(--vn-text) !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  letter-spacing: -.15px !important;
}
.vn-card__body .vn-card__title a {
  color: inherit !important;
}
.vn-card__meta {
  margin-top: 7px !important;
}
@media (min-width: 901px) {
  .vn-card__body {
    padding: 11px 12px 10px !important;
  }
  .vn-card__body .vn-card__title {
    font-size: 14.5px !important;
    line-height: 1.18 !important;
  }
}
@media (max-width: 640px) {
  .vn-card__body .vn-card__title {
    font-size: 17px !important;
  }
}

/* Rotating main stories v1.8 */
.vn-hero-slider {
  position: relative;
  min-width: 0;
}
.vn-hero-slider .vn-hero-slide[hidden] {
  display: none !important;
}
.vn-hero-slider .vn-hero-slide.is-active {
  animation: vnHeroFade .28s ease;
}
@keyframes vnHeroFade {
  from { opacity: .35; }
  to { opacity: 1; }
}
.vn-hero-slider__dots {
  position: absolute;
  z-index: 8;
  right: 14px;
  bottom: 12px;
  display: flex;
  gap: 7px;
}
.vn-hero-slider__dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 50%;
  background: rgba(255,255,255,.35);
  cursor: pointer;
}
.vn-hero-slider__dot.is-active {
  background: #fff;
}
@media (max-width: 900px) {
  .vn-hero-slider__dots {
    right: 12px;
    bottom: 10px;
  }
}


/* Main story carousel controls v1.9
   Five-second rotation with familiar clickable newsroom-style pagination dots. */
.vn-hero-slider__dots {
  left: 50% !important;
  right: auto !important;
  bottom: 12px !important;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(6, 30, 53, .58);
  backdrop-filter: blur(2px);
}
.vn-hero-slider__dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  padding: 0;
  border: 1.5px solid rgba(255,255,255,.95);
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  box-shadow: 0 0 0 1px rgba(0,0,0,.08);
  cursor: pointer;
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.vn-hero-slider__dot:hover {
  background: rgba(255,255,255,.65);
  transform: scale(1.16);
}
.vn-hero-slider__dot:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.vn-hero-slider__dot.is-active {
  background: #fff;
  box-shadow: 0 0 0 2px rgba(13,93,172,.8);
}
@media (max-width: 900px) {
  .vn-hero-slider__dots {
    bottom: 9px !important;
  }
}


/* Homepage refinements v2.0 -------------------------------------------------
   Slider dots live inside the hero panel at the lower-right edge.
   Category news rows show three image-led story cards per row. */
.vn-hero-slider {
  overflow: hidden;
  border-radius: var(--vn-radius);
}
.vn-hero-slider__dots {
  left: auto !important;
  right: 14px !important;
  bottom: 13px !important;
  transform: none !important;
  justify-content: flex-end !important;
  padding: 5px 8px !important;
  background: rgba(6,30,53,.62) !important;
}

.vn-category-rows {
  margin-top: 30px;
  display: grid;
  gap: 34px;
}
.vn-category-row {
  min-width: 0;
}
.vn-category-row__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
  padding-bottom: 9px;
  border-bottom: 2px solid var(--vn-navy);
}
.vn-category-row__title {
  margin: 0;
  color: var(--vn-text);
  font-size: 20px;
  line-height: 1.1;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-category-row__more {
  flex: 0 0 auto;
  color: var(--vn-blue);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-category-row__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.vn-category-card {
  overflow: hidden;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 2px 9px rgba(8,30,51,.035);
}
.vn-category-card__media {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #dfe5e9;
}
.vn-category-card__media img,
.vn-category-card__media .vn-placeholder {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  display: block;
}
.vn-category-card__media img {
  transition: transform .24s ease;
}
.vn-category-card:hover .vn-category-card__media img {
  transform: scale(1.02);
}
.vn-category-card__label {
  position: absolute;
  z-index: 2;
  left: 10px;
  bottom: 0;
  padding: 4px 8px;
  background: var(--vn-blue);
  color: #fff;
  font-size: 9px;
  line-height: 1.1;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-category-card__body {
  padding: 12px 13px 12px;
}
.vn-category-card__title {
  margin: 0;
  color: var(--vn-text);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: -.2px;
}
.vn-category-card__title a {
  color: inherit;
}
.vn-category-card__meta {
  margin-top: 8px;
  color: var(--vn-muted);
  font-size: 11px;
  line-height: 1.25;
}

/* The old four-card strip is intentionally no longer used on front-page.php. */

@media (min-width: 901px) {
  .vn-category-rows { margin-top: 26px; gap: 30px; }
  .vn-category-row__title { font-size: 18px; }
  .vn-category-row__grid { gap: 17px; }
  .vn-category-card__body { padding: 11px 12px 10px; }
  .vn-category-card__title { font-size: 14.5px; line-height: 1.2; }
  .vn-category-card__meta { margin-top: 7px; font-size: 10px; }
}
@media (max-width: 900px) {
  .vn-hero-slider__dots {
    right: 12px !important;
    bottom: 10px !important;
  }
  .vn-category-row__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .vn-category-rows { margin-top: 22px; gap: 26px; }
  .vn-category-row__header { margin-bottom: 11px; }
  .vn-category-row__title { font-size: 17px; }
  .vn-category-row__grid { grid-template-columns: 1fr; gap: 14px; }
  .vn-category-card__title { font-size: 17px; }
}

/* Homepage lead MASTER layout v3.0
   This replaces the accumulated v2.2-v2.9 overrides. Keeping one desktop
   rule set removes the conflicting heights that prevented exact alignment. */
@media (min-width: 901px) {
  .vn-lead-grid {
    display: grid;
    grid-template-columns: minmax(0, 2.18fr) minmax(300px, .82fr);
    gap: 14px;
    align-items: stretch;
  }

  /* Both top panels are exactly the same height. */
  .vn-hero-slider,
  .vn-quick {
    height: 420px;
    min-height: 420px;
    max-height: 420px;
    align-self: stretch;
    box-sizing: border-box;
  }

  .vn-hero-slider {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: var(--vn-radius);
  }
  .vn-hero-slider .vn-hero-slide[hidden] {
    display: none !important;
  }
  .vn-hero-slider .vn-hero-slide,
  .vn-hero {
    width: 100%;
    height: 420px;
    min-height: 420px;
    max-height: 420px;
  }
  .vn-hero {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    overflow: hidden;
  }
  .vn-hero__media,
  .vn-hero__content {
    height: 420px;
    min-height: 420px;
    max-height: 420px;
    box-sizing: border-box;
  }
  .vn-hero__media {
    overflow: hidden;
  }
  .vn-hero__media img,
  .vn-hero__media .vn-placeholder {
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
    display: block;
  }
  .vn-hero__content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: hidden;
    padding: 20px 20px 42px;
  }
  .vn-kicker {
    margin: 0 0 10px;
    padding: 4px 7px;
    font-size: 9px;
  }
  .vn-hero__title {
    margin: 0;
    font-size: clamp(27px, 2.45vw, 33px);
    line-height: 1.05;
    letter-spacing: -.55px;
  }
  .vn-hero__excerpt {
    margin: 13px 0 0;
    font-size: 14px;
    line-height: 1.38;
  }
  .vn-meta {
    margin-top: 14px;
    font-size: 10.5px;
  }

  /* Dots are fully inside the dark right-hand field. */
  .vn-hero-slider__dots {
    position: absolute;
    z-index: 30;
    left: auto !important;
    right: 12px !important;
    bottom: 8px !important;
    transform: none !important;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    padding: 4px 7px;
    border-radius: 999px;
    background: rgba(6,30,53,.68);
  }
  .vn-hero-slider__dot {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
  }

  /* Quick-news panel uses the same 420px box; its six rows share space
     evenly so longer headlines cannot make the panel taller than the hero. */
  .vn-quick {
    display: grid;
    grid-template-rows: 48px minmax(0, 1fr) 39px;
    overflow: hidden;
  }
  .vn-quick__title {
    margin: 0;
    padding: 13px 16px 8px;
    font-size: 16.5px;
    line-height: 1.1;
  }
  .vn-quick__list {
    display: grid;
    grid-template-rows: repeat(6, minmax(0, 1fr));
    min-height: 0;
    margin: 0;
    padding: 0 16px;
    overflow: hidden;
  }
  .vn-quick__item {
    min-height: 0;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    padding: 5px 0;
    overflow: hidden;
  }
  .vn-quick__time {
    font-size: 11px;
  }
  .vn-quick__link {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    font-size: 11.2px;
    line-height: 1.18;
  }
  .vn-quick__all {
    height: 39px;
    min-height: 39px;
    margin: 0;
    font-size: 10px;
  }
}

@media (max-width: 900px) {
  .vn-hero-slider__dots {
    left: auto !important;
    right: 12px !important;
    bottom: 10px !important;
    transform: none !important;
  }
}


/* Lead width rebalance v3.1
   Extend the "Aktuálne správy" panel by about 5% at the expense of the
   top-story block, while preserving the aligned top section. */
@media (min-width: 901px) {
  .vn-lead-grid {
    grid-template-columns: minmax(0, 2.04fr) minmax(315px, .87fr);
  }
}


/* Brand color refresh v3.3
   Updated the theme palette to match the supplied Východňar logo:
   deep navy + vivid red + clean white. */

/* ================================================================
   News article + footer refinement v3.4
   ================================================================ */

/* Single article layout inspired by the supplied desktop reference. */
.vn-single-wrap {
  padding-top: 18px;
  padding-bottom: 54px;
  max-width: 1240px;
}
.vn-breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 13px;
  color: var(--vn-muted);
  font-size: 11px;
  line-height: 1.35;
}
.vn-breadcrumbs a:hover { color: var(--vn-red); }
.vn-breadcrumbs__current {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 58ch;
}
.vn-single-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 315px;
  gap: 34px;
  align-items: start;
}
.vn-single-main { min-width: 0; }
.vn-article--news {
  max-width: none;
}
.vn-article--news .vn-article__category {
  margin: 0 0 8px;
}
.vn-article--news .vn-kicker {
  margin: 0;
  font-size: 9px;
  padding: 4px 7px;
  background: var(--vn-red);
}
.vn-article--news .vn-article__title {
  margin: 0;
  max-width: 850px;
  color: var(--vn-text);
  font-size: clamp(31px, 3.15vw, 45px);
  line-height: 1.04;
  letter-spacing: -1.2px;
  font-weight: 900;
}
.vn-article__meta {
  margin-top: 10px;
  color: var(--vn-muted);
  font-size: 11px;
}
.vn-article--news .vn-article__image {
  margin: 14px 0 16px;
}
.vn-article--news .vn-article__image img {
  display: block;
  width: 100%;
  max-height: 620px;
  object-fit: cover;
}
.vn-article--news .vn-article__lead {
  margin: 0 0 14px;
  color: var(--vn-text);
  font-size: 16px;
  line-height: 1.5;
  font-weight: 800;
}
.vn-article--news .vn-entry-content {
  color: #1d2a39;
  font-size: 15.5px;
  line-height: 1.62;
}
.vn-article--news .vn-entry-content p { margin: 0 0 15px; }
.vn-article--news .vn-entry-content h2 {
  margin: 28px 0 10px;
  color: var(--vn-text);
  font-size: 25px;
  line-height: 1.15;
}
.vn-article--news .vn-entry-content h3 {
  margin: 24px 0 8px;
  font-size: 20px;
  line-height: 1.2;
}

/* Article sidebar */
.vn-news-sidebar {
  display: grid;
  gap: 18px;
}
.vn-sidebox {
  overflow: hidden;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: #fff;
}
.vn-sidebox__title {
  margin: 0;
  padding: 14px 15px 11px;
  border-bottom: 1px solid var(--vn-border);
  color: var(--vn-text);
  font-size: 17px;
  line-height: 1.1;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-side-popular { padding: 0 12px; }
.vn-side-popular__item {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--vn-border);
}
.vn-side-popular__item:last-child { border-bottom: 0; }
.vn-side-popular__media {
  position: relative;
  display: block;
  height: 73px;
  overflow: hidden;
  background: var(--vn-soft);
}
.vn-side-popular__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vn-side-popular__rank {
  position: absolute;
  left: 0;
  top: 0;
  min-width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--vn-red);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}
.vn-side-popular__body { min-width: 0; }
.vn-side-popular__title {
  display: block;
  color: var(--vn-text);
  font-size: 12px;
  line-height: 1.23;
  font-weight: 900;
}
.vn-side-popular__title:hover { color: var(--vn-red); }
.vn-side-popular__date {
  margin-top: 6px;
  color: var(--vn-muted);
  font-size: 9.5px;
}
.vn-sidebox__more {
  display: flex;
  min-height: 37px;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  background: var(--vn-navy);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-sidebox__more:hover { background: var(--vn-navy-2); color: #fff; }
.vn-side-latest {
  list-style: none;
  margin: 0;
  padding: 0 13px;
}
.vn-side-latest li {
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);
  gap: 7px;
  padding: 9px 0;
  border-bottom: 1px solid var(--vn-border);
}
.vn-side-latest li:last-child { border-bottom: 0; }
.vn-side-latest time {
  color: var(--vn-red);
  font-size: 10px;
  font-weight: 900;
}
.vn-side-latest a {
  color: var(--vn-text);
  font-size: 10.5px;
  line-height: 1.25;
  font-weight: 800;
}
.vn-side-latest a:hover { color: var(--vn-red); }

/* Homepage category rows: one WordPress category per row, three stories. */
.vn-category-rows {
  margin-top: 30px;
  margin-bottom: 6px;
}
.vn-category-row__header {
  border-bottom-color: var(--vn-navy);
}
.vn-category-row__more { color: var(--vn-red); }
.vn-category-card__label { background: var(--vn-red); }
.vn-category-card__title a:hover { color: var(--vn-red); }

/* Footer with editable WordPress menu pages. */
.vn-footer {
  margin-top: 44px;
  border-top: 4px solid var(--vn-red);
  background: var(--vn-navy);
}
.vn-footer__inner--news {
  padding: 34px 0;
  display: grid;
  grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr);
  gap: 38px;
  align-items: start;
}
.vn-footer__title {
  font-size: 25px;
  line-height: 1;
}
.vn-footer__tagline {
  margin-top: 7px;
  color: rgba(255,255,255,.68);
  font-size: 12px;
}
.vn-footer__meta {
  margin-top: 14px;
  color: rgba(255,255,255,.62);
  font-size: 11px;
}
.vn-footer__nav .menu {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 22px;
  list-style: none;
  margin: 0;
  padding: 2px 0 0;
}
.vn-footer__nav .menu a {
  color: rgba(255,255,255,.9);
  font-size: 12px;
  font-weight: 800;
}
.vn-footer__nav .menu a:hover { color: #fff; text-decoration: underline; }

/* Standard pages created by the theme. */
.vn-page-wrap {
  width: min(calc(100% - 32px), 980px);
  padding-top: 36px;
  padding-bottom: 60px;
}
.vn-page-article {
  max-width: 840px;
  margin: 0 auto;
}
.vn-page-article .vn-article__title {
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.05;
}
.vn-page-article .vn-entry-content {
  margin-top: 28px;
  font-size: 16px;
  line-height: 1.72;
}
.vn-page-article .vn-entry-content h2 {
  margin: 30px 0 10px;
  color: var(--vn-text);
  font-size: 25px;
}
.vn-page-article .vn-entry-content ul { padding-left: 22px; }

@media (max-width: 980px) {
  .vn-single-grid { grid-template-columns: 1fr; }
  .vn-news-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .vn-single-wrap { padding-top: 12px; }
  .vn-breadcrumbs__current { display: none; }
  .vn-article--news .vn-article__title { font-size: 31px; }
  .vn-article--news .vn-entry-content { font-size: 16px; }
  .vn-news-sidebar { grid-template-columns: 1fr; }
  .vn-footer__inner--news { grid-template-columns: 1fr; gap: 24px; }
  .vn-footer__nav .menu { justify-content: flex-start; }
}


/* Highest top-bar O nás dropdown v3.5 */
.vn-topbar .menu > li {
  position: relative;
}
.vn-topbar .menu > li.menu-item-has-children > a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.vn-topbar .menu > li.menu-item-has-children > a::after {
  content: "⌄";
  font-size: 11px;
  line-height: 1;
  transform: translateY(-1px);
}
.vn-topbar .sub-menu {
  display: none;
  position: absolute;
  top: calc(100% + 1px);
  left: -12px;
  z-index: 200;
  min-width: 185px;
  margin: 0;
  padding: 7px 0;
  list-style: none;
  background: #fff;
  border: 1px solid var(--vn-border);
  box-shadow: 0 10px 26px rgba(6,38,92,.13);
}
.vn-topbar li:hover > .sub-menu,
.vn-topbar li:focus-within > .sub-menu {
  display: block;
}
.vn-topbar .sub-menu li {
  display: block;
}
.vn-topbar .sub-menu a {
  display: block;
  padding: 9px 13px;
  color: var(--vn-navy);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 800;
  white-space: nowrap;
}
.vn-topbar .sub-menu a:hover,
.vn-topbar .sub-menu a:focus {
  color: var(--vn-red);
  background: var(--vn-soft);
}


/* Header advertising + name-day topbar v3.7 */
.vn-topbar__date {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}
.vn-header-ad {
  background: #fff;
  padding: 16px 0 12px;
}
.vn-header-ad__inner {
  width: 100%;
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.vn-header-ad__inner.is-placeholder {
  background: #ededed;
  border: 1px solid #e3e3e3;
}
.vn-header-ad__label {
  color: #7c838b;
  font-size: 15px;
  line-height: 1;
  font-weight: 800;
}
.vn-header-ad__widget,
.vn-header-ad__widget > * {
  max-width: 100%;
}
.vn-header-ad__widget {
  width: 100%;
  text-align: center;
}
.vn-header-ad__widget img,
.vn-header-ad__widget iframe,
.vn-header-ad__widget ins {
  max-width: 100%;
}
@media (min-width: 901px) {
  .vn-header-ad__inner {
    min-height: 180px;
  }
}
@media (max-width: 900px) {
  .vn-header-ad {
    padding: 10px 0;
  }
  .vn-header-ad__inner {
    min-height: 100px;
  }
  .vn-topbar__date {
    font-size: 11px;
  }
}
@media (max-width: 640px) {
  .vn-header-ad__inner {
    min-height: 82px;
  }
}


/* ================================================================
   Advertising manager v3.8
   ================================================================ */
.vn-ad-slot {
  width: 100%;
  margin: 18px 0;
  text-align: center;
}
.vn-ad-slot__inner {
  width: 100%;
  min-height: 110px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #f1f1f1;
  border: 1px solid #e4e4e4;
}
.vn-ad-slot.has-creative .vn-ad-slot__inner {
  min-height: 0;
  background: transparent;
  border: 0;
}
.vn-ad-slot__label {
  display: block;
  margin-bottom: 7px;
  color: #858c94;
  font-size: 10px;
  line-height: 1;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .35px;
}
.vn-ad-slot__creative,
.vn-ad-slot__creative > * {
  max-width: 100%;
}
.vn-ad-slot__creative {
  width: 100%;
  text-align: center;
}
.vn-ad-slot__creative img,
.vn-ad-slot__creative iframe,
.vn-ad-slot__creative ins {
  max-width: 100%;
}
.vn-ad-slot__creative img {
  height: auto;
  display: inline-block;
}
.vn-ad-slot--article-under-image {
  margin: 8px 0 22px;
}
.vn-ad-slot--article-under-image .vn-ad-slot__inner {
  min-height: 135px;
}
.vn-ad-slot--article-inline {
  margin: 28px 0;
}
.vn-ad-slot--article-sidebar {
  margin: 0 0 18px;
}
.vn-ad-slot--article-sidebar .vn-ad-slot__inner {
  min-height: 220px;
}
.vn-ad-slot--home-after-cards {
  margin: 22px 0 4px;
}
.vn-ad-slot--home-after-cards .vn-ad-slot__inner {
  min-height: 120px;
}
.vn-header-ad__inner .vn-ad-slot {
  margin: 0;
}
.vn-header-ad__inner .vn-ad-slot__inner {
  min-height: inherit;
}
@media (max-width: 640px) {
  .vn-ad-slot--article-under-image .vn-ad-slot__inner,
  .vn-ad-slot--home-after-cards .vn-ad-slot__inner {
    min-height: 90px;
  }
  .vn-ad-slot--article-inline { margin: 22px 0; }
}


/* Advertising placeholder call-to-action v3.9 */
.vn-ad-placeholder-copy,
.vn-header-ad__placeholder-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 16px;
  text-align: center;
}
.vn-ad-placeholder-copy__title,
.vn-header-ad__placeholder-title {
  color: var(--vn-text);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
}
.vn-ad-placeholder-copy__email,
.vn-header-ad__placeholder-email {
  color: var(--vn-red);
  font-size: 13px;
  line-height: 1.2;
  font-weight: 800;
}
.vn-ad-placeholder-copy__email:hover,
.vn-header-ad__placeholder-email:hover {
  color: var(--vn-navy);
}
.vn-header-ad__inner.is-placeholder .vn-header-ad__label {
  display: none;
}
@media (max-width: 640px) {
  .vn-ad-placeholder-copy__title,
  .vn-header-ad__placeholder-title { font-size: 14px; }
  .vn-ad-placeholder-copy__email,
  .vn-header-ad__placeholder-email { font-size: 12px; }
}


/* Header social buttons + extra ad placements v4.1 */
.vn-branding__actions{align-items:stretch}.vn-social-icon-action{min-height:72px;width:66px;display:inline-flex;align-items:center;justify-content:center;border-right:1px solid var(--vn-border);color:var(--vn-text);background:transparent;transition:background .18s ease,color .18s ease}.vn-social-icon-action:hover{background:var(--vn-soft);color:var(--vn-blue)}.vn-social-icon-action.is-disabled{opacity:.42;cursor:default}.vn-social-icon-action .vn-icon{width:22px;height:22px}@media(min-width:901px){.vn-social-icon-action{min-height:62px;width:58px}}@media(max-width:640px){.vn-social-icon-action{width:48px;min-height:52px}}
.vn-ad-slot--home-after-lead,.vn-ad-slot--home-after-first-category,.vn-ad-slot--article-after-content,.vn-ad-slot--site-above-footer,.vn-ad-slot--site-footer-bottom{margin:28px 0}.vn-ad-slot--site-above-footer .vn-ad-slot__inner,.vn-ad-slot--site-footer-bottom .vn-ad-slot__inner,.vn-ad-slot--home-after-lead .vn-ad-slot__inner,.vn-ad-slot--home-after-first-category .vn-ad-slot__inner,.vn-ad-slot--article-after-content .vn-ad-slot__inner{min-height:110px}.vn-site-bottom-ad{background:var(--vn-bg)}.vn-site-bottom-ad .vn-container{padding-top:2px;padding-bottom:2px}


/* Mobile single-row header v4.4
   Logo + Rubriky + search + Facebook + Instagram live in one compact row.
   The mobile row is about 20% shorter than before; desktop remains unchanged. */
.vn-mobile-menu-toggle {
  display: none;
}

@media (max-width: 900px) {
  .vn-branding {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 4px !important;
    min-height: 66px !important;
    height: 66px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .vn-branding__logo {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .vn-branding__logo .custom-logo-link {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
  }
  .vn-branding__logo .custom-logo {
    width: auto !important;
    height: auto !important;
    max-height: 46px !important;
    max-width: 112px !important;
    object-fit: contain !important;
  }
  .vn-site-title {
    font-size: 21px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
  .vn-site-description {
    display: none !important;
  }

  .vn-branding__actions {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    height: 52px !important;
    border-left: 0 !important;
  }
  .vn-mobile-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 7px !important;
    border: 0 !important;
    border-right: 1px solid var(--vn-border) !important;
    background: transparent !important;
    color: var(--vn-text) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    white-space: nowrap !important;
  }
  .vn-mobile-menu-toggle__chevron {
    font-size: 12px !important;
    line-height: 1 !important;
    transform: translateY(-1px);
  }
  .vn-icon-action,
  .vn-social-icon-action {
    width: 38px !important;
    min-width: 38px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border-right: 1px solid var(--vn-border) !important;
  }
  .vn-branding__actions > :last-child {
    border-right: 0 !important;
  }
  .vn-icon-action .vn-icon,
  .vn-social-icon-action .vn-icon {
    width: 18px !important;
    height: 18px !important;
  }

  /* The desktop navigation bar disappears as a visible row, but its menu
     remains available as the dropdown opened by the Rubriky button. */
  .vn-mainnav-wrap {
    position: relative !important;
    height: 0 !important;
    min-height: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
  }
  .vn-mainnav {
    height: 0 !important;
    min-height: 0 !important;
  }
  .vn-home-link,
  .vn-mainnav > .vn-menu-toggle {
    display: none !important;
  }
  .vn-primary-nav {
    top: 0 !important;
    z-index: 150 !important;
  }
  .vn-primary-nav.is-open {
    display: block !important;
  }
}

@media (max-width: 380px) {
  .vn-container.vn-branding {
    width: min(calc(100% - 12px), var(--vn-container)) !important;
  }
  .vn-branding__logo .custom-logo {
    max-width: 88px !important;
    max-height: 42px !important;
  }
  .vn-mobile-menu-toggle {
    padding-inline: 5px !important;
    font-size: 10px !important;
  }
  .vn-icon-action,
  .vn-social-icon-action {
    width: 34px !important;
    min-width: 34px !important;
  }
}


/* Article first paragraph emphasis v4.5
   The first real paragraph of article content is automatically bold and
   2px larger than the article body size selected in Theme Settings. */
.vn-article--news .vn-entry-content > p:first-of-type {
  font-size: calc(var(--vn-article-size, 18px) + 2px) !important;
  font-weight: 700 !important;
  line-height: var(--vn-article-line, 1.75) !important;
}


/* Unified single-row header v4.6
   Desktop now mirrors mobile: logo + Rubriky + search + social links
   are kept in one line. The old separate navigation bar is collapsed
   and opens as a dropdown from the Rubriky button. */
@media (min-width: 901px) {
  .vn-branding {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    min-height: 78px !important;
    height: 78px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .vn-branding__logo {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
  }
  .vn-branding__logo .custom-logo-link {
    display: inline-flex !important;
    align-items: center !important;
  }
  .vn-branding__logo .custom-logo {
    width: auto !important;
    height: auto !important;
    max-height: 62px !important;
    max-width: 250px !important;
    object-fit: contain !important;
  }
  .vn-site-title {
    font-size: clamp(28px, 3vw, 42px) !important;
    line-height: 1 !important;
  }
  .vn-site-description {
    display: none !important;
  }

  .vn-branding__actions {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    height: 54px !important;
    border-left: 1px solid var(--vn-border) !important;
  }
  .vn-mobile-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-right: 1px solid var(--vn-border) !important;
    background: transparent !important;
    color: var(--vn-text) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    white-space: nowrap !important;
  }
  .vn-mobile-menu-toggle:hover,
  .vn-icon-action:hover,
  .vn-social-icon-action:hover {
    background: var(--vn-soft) !important;
  }
  .vn-mobile-menu-toggle__chevron {
    font-size: 13px !important;
    line-height: 1 !important;
    transform: translateY(-1px);
  }
  .vn-icon-action,
  .vn-social-icon-action {
    width: 54px !important;
    min-width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border-right: 1px solid var(--vn-border) !important;
  }
  .vn-branding__actions > :last-child {
    border-right: 0 !important;
  }
  .vn-icon-action .vn-icon,
  .vn-social-icon-action .vn-icon {
    width: 20px !important;
    height: 20px !important;
  }

  /* Remove the separate desktop navigation strip. The menu remains in the
     DOM and becomes a full-width dropdown controlled by Rubriky. */
  .vn-mainnav-wrap {
    position: relative !important;
    height: 0 !important;
    min-height: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background: transparent !important;
    z-index: 180 !important;
  }
  .vn-mainnav {
    height: 0 !important;
    min-height: 0 !important;
    position: relative !important;
  }
  .vn-home-link,
  .vn-mainnav > .vn-menu-toggle {
    display: none !important;
  }
  .vn-primary-nav {
    display: none !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: #fff !important;
    border: 1px solid var(--vn-border) !important;
    border-top: 3px solid var(--vn-blue) !important;
    box-shadow: var(--vn-shadow) !important;
    z-index: 200 !important;
  }
  .vn-primary-nav.is-open {
    display: block !important;
  }
  .vn-primary-nav .menu {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    height: auto !important;
    margin: 0 !important;
    padding: 8px 12px !important;
  }
  .vn-primary-nav .menu > li {
    display: flex !important;
    position: relative !important;
  }
  .vn-primary-nav .menu > li > a {
    min-height: 44px !important;
    padding: 0 15px !important;
    font-size: 11.5px !important;
  }
  .vn-primary-nav .sub-menu {
    top: 100% !important;
  }
}

/* Modern newsroom comments v4.7 ------------------------------------------------ */
.vn-comments {
  margin-top: 42px;
  padding-top: 28px;
  border-top: 3px solid var(--vn-navy);
}
.vn-comments__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 22px;
}
.vn-comments__eyebrow {
  display: block;
  margin-bottom: 6px;
  color: var(--vn-red);
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .45px;
}
.vn-comments__title {
  margin: 0;
  color: var(--vn-navy);
  font-size: 27px;
  line-height: 1.05;
  font-weight: 900;
}
.vn-comments__intro {
  max-width: 430px;
  margin: 0;
  color: var(--vn-muted);
  font-size: 13px;
  line-height: 1.45;
}
.vn-comment-list,
.vn-comment-list .children {
  list-style: none;
  margin: 0;
  padding: 0;
}
.vn-comment-list > .vn-comment + .vn-comment {
  border-top: 1px solid var(--vn-border);
}
.vn-comment-list .children {
  margin-left: 58px;
  padding-left: 18px;
  border-left: 2px solid var(--vn-border);
}
.vn-comment__card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 14px;
  padding: 22px 0;
}
.vn-comment__avatar img {
  display: block;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--vn-soft);
}
.vn-comment__meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px 11px;
}
.vn-comment__author {
  color: var(--vn-navy);
  font-size: 14px;
  line-height: 1.2;
  font-weight: 900;
}
.vn-comment__date {
  color: var(--vn-muted);
  font-size: 11px;
  line-height: 1.2;
}
.vn-comment__date:hover { color: var(--vn-red); }
.vn-comment__text {
  margin-top: 8px;
  color: var(--vn-text);
  font-size: 14px;
  line-height: 1.55;
}
.vn-comment__text p { margin: 0 0 9px; }
.vn-comment__text p:last-child { margin-bottom: 0; }
.vn-comment__moderation {
  display: inline-block;
  margin: 9px 0 0;
  padding: 5px 8px;
  background: #fff5dd;
  color: #785600;
  font-size: 11px;
  font-weight: 800;
}
.vn-comment__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}
.vn-comment__votes {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.vn-comment-vote {
  min-width: 48px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: #fff;
  color: var(--vn-muted);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease, opacity .15s ease;
}
.vn-comment-vote:hover {
  border-color: #b9c3ce;
  color: var(--vn-navy);
}
.vn-comment-vote.is-active {
  border-color: var(--vn-navy);
  background: var(--vn-navy);
  color: #fff;
}
.vn-comment__votes.is-loading { opacity: .62; }
.vn-comment__votes.has-error::after {
  content: "Skúste znova";
  color: var(--vn-red);
  font-size: 11px;
  font-weight: 800;
}
.vn-comment__reply a,
.vn-cancel-reply a {
  color: var(--vn-red);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-comment__reply a:hover,
.vn-cancel-reply a:hover { color: var(--vn-navy); }

.vn-comment-form {
  margin-top: 28px;
  padding: 24px;
  border: 1px solid var(--vn-border);
  border-top: 3px solid var(--vn-red);
  background: var(--vn-soft);
}
.vn-comment-form__title {
  margin: 0 0 7px;
  color: var(--vn-navy);
  font-size: 22px;
  line-height: 1.12;
  font-weight: 900;
}
.vn-comment-form__note {
  margin: 0 0 18px;
  color: var(--vn-muted);
  font-size: 12px;
}
.vn-comment-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.vn-comment-form p { margin: 0 0 15px; }
.vn-comment-form label {
  display: block;
  margin-bottom: 6px;
  color: var(--vn-navy);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-comment-form input[type="text"],
.vn-comment-form input[type="email"],
.vn-comment-form input[type="number"],
.vn-comment-form textarea {
  width: 100%;
  border: 1px solid #cfd6de;
  border-radius: 3px;
  background: #fff;
  color: var(--vn-text);
  padding: 11px 12px;
  font-size: 14px;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.vn-comment-form input:focus,
.vn-comment-form textarea:focus {
  border-color: var(--vn-navy);
  box-shadow: 0 0 0 2px rgba(4, 29, 69, .08);
}
.vn-comment-form textarea {
  min-height: 130px;
  resize: vertical;
}
.vn-antispam {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 2px 0 18px;
  padding: 12px 14px;
  border: 1px solid #d8dee6;
  background: #fff;
}
.vn-antispam__copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: var(--vn-text);
  font-size: 12px;
}
.vn-antispam__copy strong {
  color: var(--vn-navy);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .3px;
}
.vn-antispam__answer { margin: 0 !important; }
.vn-antispam__answer input {
  width: 68px !important;
  height: 38px;
  padding: 7px 8px !important;
  text-align: center;
  font-weight: 900;
}
.vn-honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}
.vn-comment-submit {
  min-height: 40px;
  padding: 0 18px;
  border: 0;
  border-radius: 3px;
  background: var(--vn-navy);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
}
.vn-comment-submit:hover { background: var(--vn-red); }
.vn-comments .comment-navigation {
  margin: 8px 0 22px;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 640px) {
  .vn-comments { margin-top: 30px; padding-top: 22px; }
  .vn-comments__head { display: block; }
  .vn-comments__intro { margin-top: 9px; }
  .vn-comments__title { font-size: 23px; }
  .vn-comment-list .children { margin-left: 22px; padding-left: 11px; }
  .vn-comment__card { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 18px 0; }
  .vn-comment__avatar img { width: 38px; height: 38px; }
  .vn-comment-form { padding: 18px 14px; }
  .vn-comment-form__grid { grid-template-columns: 1fr; gap: 0; }
  .vn-antispam { align-items: flex-end; }
}


/* Comment sorting controls v4.8 --------------------------------------------- */
.vn-comments-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: -3px 0 10px;
  padding: 11px 0 13px;
  border-bottom: 1px solid var(--vn-border);
}
.vn-comments-filter__label {
  flex: 0 0 auto;
  color: var(--vn-muted);
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .25px;
}
.vn-comments-filter__buttons {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}
.vn-comments-filter__button {
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: #fff;
  color: var(--vn-navy);
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  cursor: pointer;
  transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.vn-comments-filter__button:hover {
  border-color: var(--vn-navy);
}
.vn-comments-filter__button.is-active {
  border-color: var(--vn-navy);
  background: var(--vn-navy);
  color: #fff;
}
.vn-comments-filter__button:focus-visible {
  outline: 2px solid var(--vn-red);
  outline-offset: 2px;
}
@media (max-width: 640px) {
  .vn-comments-filter {
    display: block;
    margin-top: 0;
  }
  .vn-comments-filter__label {
    display: block;
    margin-bottom: 8px;
  }
  .vn-comments-filter__buttons {
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }
  .vn-comments-filter__button {
    flex: 0 0 auto;
    min-height: 32px;
    padding-inline: 9px;
    font-size: 10.5px;
  }
}


/* Desktop rubrics always visible v4.9 -----------------------------------------
   On desktop the primary rubrics are written out directly in the header row.
   Mobile keeps the compact "Rubriky" dropdown from v4.4. */
.vn-desktop-rubrics {
  display: none;
}

@media (min-width: 901px) {
  .vn-branding {
    gap: 14px !important;
  }

  .vn-branding__logo {
    flex: 0 0 auto !important;
  }

  .vn-branding__logo .custom-logo {
    max-width: 210px !important;
  }

  /* The Rubriky button is no longer needed on desktop. */
  .vn-mobile-menu-toggle {
    display: none !important;
  }

  .vn-desktop-rubrics {
    display: flex !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: stretch !important;
  }

  .vn-desktop-rubrics__menu {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .vn-desktop-rubrics__menu > li {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
  }

  .vn-desktop-rubrics__menu > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 54px !important;
    padding: 0 clamp(7px, .72vw, 13px) !important;
    color: var(--vn-text) !important;
    font-size: clamp(10px, .69vw, 12px) !important;
    line-height: 1.05 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    border-bottom: 3px solid transparent !important;
    transition: color .16s ease, border-color .16s ease, background .16s ease !important;
  }

  .vn-desktop-rubrics__menu > li > a:hover,
  .vn-desktop-rubrics__menu > li.current-menu-item > a,
  .vn-desktop-rubrics__menu > li.current-menu-ancestor > a,
  .vn-desktop-rubrics__menu > li.current-post-ancestor > a {
    color: var(--vn-blue) !important;
    border-bottom-color: var(--vn-blue) !important;
    background: var(--vn-soft) !important;
  }

  .vn-desktop-rubrics__menu > li.menu-item-has-children > a::after {
    content: "⌄";
    margin-left: 5px;
    font-size: 11px;
    transform: translateY(-1px);
  }

  .vn-desktop-rubrics__menu .sub-menu {
    display: none !important;
    position: absolute !important;
    top: calc(100% - 1px) !important;
    left: 0 !important;
    z-index: 300 !important;
    min-width: 220px !important;
    margin: 0 !important;
    padding: 6px 0 !important;
    list-style: none !important;
    background: #fff !important;
    border: 1px solid var(--vn-border) !important;
    border-top: 3px solid var(--vn-blue) !important;
    box-shadow: var(--vn-shadow) !important;
  }

  .vn-desktop-rubrics__menu li:hover > .sub-menu,
  .vn-desktop-rubrics__menu li:focus-within > .sub-menu {
    display: block !important;
  }

  .vn-desktop-rubrics__menu .sub-menu a {
    display: block !important;
    padding: 9px 13px !important;
    color: var(--vn-text) !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
  }

  .vn-desktop-rubrics__menu .sub-menu a:hover {
    color: var(--vn-blue) !important;
    background: var(--vn-soft) !important;
  }

  /* Keep the older duplicate primary-nav DOM only for mobile. */
  .vn-mainnav-wrap {
    display: none !important;
  }

  .vn-branding__actions {
    flex: 0 0 auto !important;
  }
}

@media (max-width: 900px) {
  .vn-desktop-rubrics {
    display: none !important;
  }
}


/* Comment form reliability v4.10 */
.vn-comment-form .vn-required { color: var(--vn-red); font-weight: 900; }
.vn-comment-form input:invalid:not(:placeholder-shown),
.vn-comment-form textarea:invalid:not(:placeholder-shown) { border-color: var(--vn-red); }


/* Header advertising + mobile hamburger refinement v4.11 -------------------
   The header advertisement is rendered after the main logo/rubrics row.
   On mobile the Rubriky text button is replaced by a compact hamburger icon. */
.vn-mobile-menu-toggle__hamburger {
  display: inline-flex;
  width: 20px;
  height: 16px;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
}
.vn-mobile-menu-toggle__hamburger span {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}
@media (max-width: 900px) {
  .vn-mobile-menu-toggle {
    width: 38px !important;
    min-width: 38px !important;
    padding: 0 !important;
    gap: 0 !important;
  }
  .vn-mobile-menu-toggle__label,
  .vn-mobile-menu-toggle__chevron {
    display: none !important;
  }
  .vn-mobile-menu-toggle__hamburger {
    width: 18px !important;
    height: 14px !important;
  }
}
@media (max-width: 380px) {
  .vn-mobile-menu-toggle {
    width: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
  }
  .vn-mobile-menu-toggle__hamburger {
    width: 17px !important;
    height: 13px !important;
  }
}

.vn-mobile-menu-toggle[aria-expanded="true"] .vn-mobile-menu-toggle__hamburger span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
.vn-mobile-menu-toggle[aria-expanded="true"] .vn-mobile-menu-toggle__hamburger span:nth-child(2) {
  opacity: 0;
}
.vn-mobile-menu-toggle[aria-expanded="true"] .vn-mobile-menu-toggle__hamburger span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}
.vn-mobile-menu-toggle__hamburger span {
  transition: transform .18s ease, opacity .18s ease;
}


/* Two-level desktop header with spanning logo v4.12 -----------------------
   The larger logo forms a left column spanning the top information bar and
   the main rubrics row. Both horizontal bars live visually to its right.
   Mobile keeps the compact single-row header introduced earlier. */
@media (min-width: 901px) {
  :root {
    --vn-header-logo-col: 250px;
    --vn-header-top-row: 34px;
    --vn-header-main-row: 74px;
  }

  .vn-header {
    position: relative;
  }

  /* Reserve the same logo column in both desktop rows. */
  .vn-topbar__inner {
    min-height: var(--vn-header-top-row) !important;
    height: var(--vn-header-top-row) !important;
    padding-left: calc(var(--vn-header-logo-col) + 18px) !important;
  }
  .vn-topbar__left {
    width: 100% !important;
    min-width: 0 !important;
  }

  .vn-branding {
    position: relative !important;
    min-height: var(--vn-header-main-row) !important;
    height: var(--vn-header-main-row) !important;
    padding-left: calc(var(--vn-header-logo-col) + 18px) !important;
    gap: 10px !important;
    overflow: visible !important;
  }

  /* Pull the logo upward so it spans BOTH rows. */
  .vn-branding__logo {
    position: absolute !important;
    z-index: 60 !important;
    left: 0 !important;
    top: calc(-1 * var(--vn-header-top-row)) !important;
    width: var(--vn-header-logo-col) !important;
    height: calc(var(--vn-header-top-row) + var(--vn-header-main-row)) !important;
    min-width: var(--vn-header-logo-col) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
    background: var(--vn-bg) !important;
    padding: 5px 18px 5px 0 !important;
  }
  .vn-branding__logo .custom-logo-link {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 100% !important;
  }
  .vn-branding__logo .custom-logo {
    width: auto !important;
    height: auto !important;
    max-width: 242px !important;
    max-height: 98px !important;
    object-fit: contain !important;
  }
  .vn-branding__logo .vn-site-title {
    font-size: clamp(34px, 3.3vw, 48px) !important;
  }

  /* Keep rubrics and utility icons vertically centred in the lower row. */
  .vn-desktop-rubrics,
  .vn-branding__actions {
    height: var(--vn-header-main-row) !important;
    min-height: var(--vn-header-main-row) !important;
    align-self: center !important;
  }
  .vn-desktop-rubrics__menu > li > a {
    min-height: var(--vn-header-main-row) !important;
  }
  .vn-branding__actions {
    display: flex !important;
    align-items: center !important;
  }
  .vn-icon-action,
  .vn-social-icon-action {
    height: 54px !important;
    min-height: 54px !important;
  }
}


/* Square logo + rubric font-size setting v4.13 -----------------------------
   The logo occupies a true square box. On desktop the square spans both the
   date row and the main navigation row. The image is contained without
   distortion. Rubric font size is controlled by the admin setting. */
@media (min-width: 901px) {
  :root {
    --vn-header-logo-col: calc(var(--vn-header-top-row) + var(--vn-header-main-row)) !important;
  }
  .vn-branding__logo {
    width: var(--vn-header-logo-col) !important;
    min-width: var(--vn-header-logo-col) !important;
    height: var(--vn-header-logo-col) !important;
    padding: 5px !important;
    justify-content: center !important;
  }
  .vn-branding__logo .custom-logo-link {
    width: 100% !important;
    height: 100% !important;
    justify-content: center !important;
  }
  .vn-branding__logo .custom-logo {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
  }
}

@media (max-width: 900px) {
  .vn-branding__logo {
    flex: 0 0 48px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    overflow: hidden !important;
  }
  .vn-branding__logo .custom-logo-link {
    width: 48px !important;
    height: 48px !important;
  }
  .vn-branding__logo .custom-logo {
    display: block !important;
    width: 48px !important;
    height: 48px !important;
    max-width: 48px !important;
    max-height: 48px !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
  }
}
@media (max-width: 380px) {
  .vn-branding__logo,
  .vn-branding__logo .custom-logo-link,
  .vn-branding__logo .custom-logo {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
  }
}


/* Desktop rubrics left alignment v4.14 ------------------------------------
   Rubric names begin from the left edge of the navigation area instead of
   being centred between the logo and utility icons. */
@media (min-width: 901px) {
  .vn-desktop-rubrics {
    justify-content: flex-start !important;
  }
  .vn-desktop-rubrics__menu {
    justify-content: flex-start !important;
  }
  .vn-desktop-rubrics__menu > li > a {
    justify-content: flex-start !important;
    text-align: left !important;
  }
}


/* Topbar starts at the logo v4.15 -----------------------------------------
   Remove the navy strip to the left of the desktop logo. The highest navy
   bar now begins exactly at the logo's right edge and continues to the right. */
@media (min-width: 901px) {
  .vn-topbar {
    background: var(--vn-bg) !important;
  }
  .vn-topbar__inner {
    background: linear-gradient(
      to right,
      transparent 0,
      transparent var(--vn-header-logo-col),
      var(--vn-navy) var(--vn-header-logo-col),
      var(--vn-navy) 100%
    ) !important;
  }
}


/* Najnovšie správy page v4.16 */
.vn-latest-news-header { margin-bottom: 24px; }
.vn-latest-news-header .vn-page-title { margin-bottom: 7px; }
.vn-latest-news-intro { margin: 0; color: var(--vn-muted); font-size: 14px; }
.vn-latest-news-page .vn-pagination ul.page-numbers {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0;
  padding: 0;
}
.vn-latest-news-page .vn-pagination .page-numbers a,
.vn-latest-news-page .vn-pagination .page-numbers span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: #fff;
}
.vn-latest-news-page .vn-pagination .page-numbers .current {
  background: var(--vn-navy);
  border-color: var(--vn-navy);
  color: #fff;
}


/* ================================================================
   Link hover + vertical article sidebar advertising v4.17
   ================================================================ */

/* The configured accent colour is the hover colour across editorial links,
   including homepage/card/category headlines. Specific older hover rules are
   intentionally overridden so the Settings value is authoritative. */
body a:hover,
body a:focus-visible {
  color: var(--vn-blue) !important;
}

/* Keep image/banner ads visually stable while giving a very subtle zoom on
   pointer hover. Transform does not change the page layout. */
.vn-ad-slot.has-creative .vn-ad-slot__creative,
.vn-header-ad__inner.has-ad .vn-header-ad__widget {
  transform: scale(1);
  transform-origin: center center;
  transition: transform .18s ease;
}
.vn-ad-slot.has-creative:hover .vn-ad-slot__creative,
.vn-header-ad__inner.has-ad .vn-header-ad__widget:hover {
  transform: scale(1.012);
}

/* Article right-column advertising is a portrait/vertical unit.  When no ad
   is assigned, the same "Priestor pre Vašu reklamu" placeholder remains
   visible so the position is obvious in the layout and in sales previews. */
.vn-ad-slot--article-sidebar {
  width: 100%;
  margin: 0 0 18px;
}
.vn-ad-slot--article-sidebar .vn-ad-slot__inner {
  min-height: 430px;
  aspect-ratio: 3 / 5;
  max-height: 560px;
}
.vn-ad-slot--article-sidebar.has-creative .vn-ad-slot__inner {
  min-height: 0;
  aspect-ratio: auto;
  max-height: none;
}
.vn-ad-slot--article-sidebar .vn-ad-slot__creative,
.vn-ad-slot--article-sidebar .vn-ad-slot__creative > * {
  max-width: 100%;
}
@media (max-width: 900px) {
  .vn-ad-slot--article-sidebar .vn-ad-slot__inner {
    min-height: 180px;
    aspect-ratio: auto;
    max-height: none;
  }
}


/* Mobile two-row header with spanning square logo v4.18 --------------------
   Mirrors the desktop header: the square logo spans the date/name-day bar
   and the main utility row. The hamburger sits immediately next to the logo,
   while search and social icons stay aligned on the right. */
@media (max-width: 900px) {
  :root {
    --vn-mobile-header-top-row: 28px;
    --vn-mobile-header-main-row: 52px;
    --vn-mobile-header-logo: 80px;
  }

  .vn-header {
    position: relative !important;
  }

  /* The navy top bar starts after the square logo, just like desktop. */
  .vn-topbar {
    background: var(--vn-bg) !important;
  }
  .vn-topbar__inner {
    min-height: var(--vn-mobile-header-top-row) !important;
    height: var(--vn-mobile-header-top-row) !important;
    padding-left: calc(var(--vn-mobile-header-logo) + 8px) !important;
    background: linear-gradient(
      to right,
      transparent 0,
      transparent var(--vn-mobile-header-logo),
      var(--vn-navy) var(--vn-mobile-header-logo),
      var(--vn-navy) 100%
    ) !important;
  }
  .vn-topbar__left {
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
  }
  .vn-topbar__date {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 9.5px !important;
  }
  .vn-topbar .menu {
    display: none !important;
  }

  .vn-branding {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    min-height: var(--vn-mobile-header-main-row) !important;
    height: var(--vn-mobile-header-main-row) !important;
    padding: 0 0 0 calc(var(--vn-mobile-header-logo) + 4px) !important;
    overflow: visible !important;
  }

  /* Square logo spans both header rows. */
  .vn-branding__logo {
    position: absolute !important;
    z-index: 70 !important;
    left: 0 !important;
    top: calc(-1 * var(--vn-mobile-header-top-row)) !important;
    flex: none !important;
    width: var(--vn-mobile-header-logo) !important;
    height: var(--vn-mobile-header-logo) !important;
    min-width: var(--vn-mobile-header-logo) !important;
    max-width: var(--vn-mobile-header-logo) !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 4px !important;
    background: var(--vn-bg) !important;
  }
  .vn-branding__logo .custom-logo-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
  }
  .vn-branding__logo .custom-logo {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
  }
  .vn-branding__logo .vn-site-title {
    font-size: 16px !important;
    line-height: 1 !important;
  }

  /* Hamburger belongs to the logo side, not to the search/social group. */
  .vn-branding > .vn-mobile-menu-toggle {
    order: 1 !important;
    display: inline-flex !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 40px !important;
    min-height: 40px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 2px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-right: 1px solid var(--vn-border) !important;
    background: transparent !important;
    color: var(--vn-text) !important;
  }
  .vn-branding > .vn-mobile-menu-toggle .vn-mobile-menu-toggle__hamburger {
    width: 18px !important;
    height: 14px !important;
  }

  .vn-desktop-rubrics {
    display: none !important;
  }

  .vn-branding__actions {
    order: 2 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    height: var(--vn-mobile-header-main-row) !important;
    margin-left: auto !important;
    border-left: 0 !important;
  }
  .vn-icon-action,
  .vn-social-icon-action {
    width: 36px !important;
    min-width: 36px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
  }
  .vn-icon-action .vn-icon,
  .vn-social-icon-action .vn-icon {
    width: 17px !important;
    height: 17px !important;
  }

  /* The dropdown menu still opens underneath the compact header. */
  .vn-mainnav-wrap {
    position: relative !important;
    height: 0 !important;
    min-height: 0 !important;
    border: 0 !important;
  }
  .vn-primary-nav {
    top: 0 !important;
  }
}

@media (max-width: 380px) {
  :root {
    --vn-mobile-header-top-row: 26px;
    --vn-mobile-header-main-row: 48px;
    --vn-mobile-header-logo: 74px;
  }
  .vn-container.vn-branding,
  .vn-container.vn-topbar__inner {
    width: min(calc(100% - 12px), var(--vn-container)) !important;
  }
  .vn-branding > .vn-mobile-menu-toggle {
    width: 34px !important;
    min-width: 34px !important;
  }
  .vn-icon-action,
  .vn-social-icon-action {
    width: 32px !important;
    min-width: 32px !important;
  }
  .vn-topbar__date {
    font-size: 9px !important;
  }
}


/* Anketa týždňa v4.20 ------------------------------------------------------- */
.vn-weekly-poll {
  margin: 30px 0 0;
  padding: 24px 26px 22px;
  border: 1px solid var(--vn-border);
  border-top: 4px solid var(--vn-red);
  border-radius: 4px;
  background: #fff;
}
.vn-weekly-poll__eyebrow {
  margin-bottom: 8px;
  color: var(--vn-red);
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .7px;
  text-transform: uppercase;
}
.vn-weekly-poll__question {
  margin: 0 0 18px;
  color: var(--vn-text);
  font-size: 24px;
  line-height: 1.18;
  font-weight: 900;
}
.vn-weekly-poll__choices {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  border: 0;
}
.vn-weekly-poll__choice {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 10px 13px;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: var(--vn-soft);
  color: var(--vn-text);
  font-size: 15px;
  line-height: 1.3;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease;
}
.vn-weekly-poll__choice:hover {
  border-color: var(--vn-red);
  background: #fff;
}
.vn-weekly-poll__choice input {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--vn-red);
}
.vn-weekly-poll__actions {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-top: 15px;
}
.vn-weekly-poll__submit {
  min-height: 42px;
  padding: 0 19px;
  border: 0;
  border-radius: 3px;
  background: var(--vn-navy);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  transition: background .16s ease, transform .16s ease;
}
.vn-weekly-poll__submit:hover { background: var(--vn-red); transform: translateY(-1px); }
.vn-weekly-poll__submit:disabled { opacity: .6; cursor: wait; transform: none; }
.vn-weekly-poll__hint { color: var(--vn-muted); font-size: 12px; }
.vn-weekly-poll__feedback { min-height: 18px; margin: 8px 0 0; color: var(--vn-red); font-size: 12px; font-weight: 700; }
.vn-weekly-poll__form.is-loading { opacity: .7; }
.vn-weekly-poll__results[hidden], .vn-weekly-poll__form[hidden] { display: none !important; }
.vn-weekly-poll__results-list { display: grid; gap: 14px; }
.vn-weekly-poll__result-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  color: var(--vn-text);
  font-size: 14px;
  line-height: 1.3;
  font-weight: 800;
}
.vn-weekly-poll__result-head strong { flex: 0 0 auto; color: var(--vn-red); }
.vn-weekly-poll__track {
  height: 9px;
  margin-top: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9edf2;
}
.vn-weekly-poll__track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--vn-navy);
  transition: width .35s ease;
}
.vn-weekly-poll__votes { margin-top: 4px; color: var(--vn-muted); font-size: 11px; }
.vn-weekly-poll__total { margin: 16px 0 0; color: var(--vn-muted); font-size: 12px; }
.vn-weekly-poll__thanks { margin: 9px 0 0; color: var(--vn-red); font-size: 12px; font-weight: 800; }
@media (max-width: 640px) {
  .vn-weekly-poll { margin-top: 22px; padding: 19px 15px 17px; }
  .vn-weekly-poll__question { font-size: 20px; }
  .vn-weekly-poll__actions { align-items: flex-start; flex-direction: column; gap: 8px; }
  .vn-weekly-poll__submit { width: 100%; }
}


/* Advertising reliability refinements v4.21 ------------------------------ */
.vn-ad-slot__creative .vn-ad-image-link,
.vn-ad-slot__creative .vn-ad-image {
  display: block;
  max-width: 100%;
}
.vn-ad-slot__creative .vn-ad-image-link {
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  line-height: 0;
}
.vn-ad-slot__creative .vn-ad-image {
  width: auto;
  height: auto;
  max-height: none;
  margin-inline: auto;
  object-fit: contain;
}
.vn-header-ad__inner .vn-ad-slot--header,
.vn-header-ad__inner .vn-ad-slot--header .vn-ad-slot__inner {
  width: 100%;
}
.vn-header-ad__inner .vn-ad-slot--header .vn-ad-slot__creative {
  display: flex;
  align-items: center;
  justify-content: center;
}
.vn-ad-slot--article-sidebar .vn-ad-image {
  width: 100%;
  height: auto;
}


/* Poll-to-comments advertising slot v4.22 --------------------------------- */
.vn-ad-slot--article-between-poll-comments {
  width: 100%;
  margin: 26px 0 30px;
}
.vn-ad-slot--article-between-poll-comments .vn-ad-slot__inner {
  min-height: 125px;
}
.vn-ad-slot--article-between-poll-comments.has-creative .vn-ad-slot__inner {
  min-height: 0;
}
@media (max-width: 640px) {
  .vn-ad-slot--article-between-poll-comments {
    margin: 20px 0 24px;
  }
  .vn-ad-slot--article-between-poll-comments .vn-ad-slot__inner {
    min-height: 92px;
  }
}


/* Advertising diagnostics/reliability v4.23 */
.vn-ad-slot.has-creative .vn-ad-slot__creative:empty{display:none}


/* Single article category + breadcrumb in one row v4.25 */
.vn-single-topline {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  min-width: 0;
}
.vn-single-topline .vn-article__category {
  margin: 0;
  flex: 0 0 auto;
}
.vn-single-topline .vn-breadcrumbs {
  margin-bottom: 0;
  flex: 1 1 auto;
  min-width: 0;
  flex-wrap: nowrap;
  overflow: hidden;
}
.vn-single-topline .vn-breadcrumbs__current {
  max-width: none;
  flex: 1 1 auto;
}
@media (max-width: 700px) {
  .vn-single-topline {
    gap: 8px;
  }
  .vn-single-topline .vn-kicker {
    font-size: 8px;
    padding: 4px 6px;
  }
  .vn-single-topline .vn-breadcrumbs {
    font-size: 10px;
    gap: 5px;
  }
}


/* Advertising navigation stability v4.26 ----------------------------------
   Reserve predictable space for ads and keep the above-the-fold header ad at
   a fixed height. This prevents the page from jumping when an image finishes
   loading or when the reader opens another page. */
.vn-ad-slot,
.vn-ad-slot__inner,
.vn-ad-slot__creative {
  box-sizing: border-box;
}
.vn-ad-slot.has-creative .vn-ad-slot__inner {
  min-height: 110px;
}
.vn-ad-slot--article-under-image.has-creative .vn-ad-slot__inner {
  min-height: 135px;
}
.vn-ad-slot--home-after-cards.has-creative .vn-ad-slot__inner,
.vn-ad-slot--home-after-lead.has-creative .vn-ad-slot__inner,
.vn-ad-slot--home-after-first-category.has-creative .vn-ad-slot__inner,
.vn-ad-slot--article-after-content.has-creative .vn-ad-slot__inner,
.vn-ad-slot--article-between-poll-comments.has-creative .vn-ad-slot__inner,
.vn-ad-slot--site-above-footer.has-creative .vn-ad-slot__inner,
.vn-ad-slot--site-footer-bottom.has-creative .vn-ad-slot__inner {
  min-height: 110px;
}

/* Header is the most visible source of layout shift, so its footprint is
   fixed on desktop/tablet/mobile. Images are contained rather than cropped. */
.vn-header-ad__inner.has-ad {
  height: 180px;
  min-height: 180px;
  max-height: 180px;
}
.vn-header-ad__inner.has-ad .vn-ad-slot--header,
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-slot__inner,
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-slot__creative {
  height: 100%;
  min-height: 0;
  max-height: 100%;
}
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-slot__inner {
  position: relative;
  padding: 18px 10px 8px;
  justify-content: center;
}
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-slot__label {
  position: absolute;
  top: 5px;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
}
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-slot__creative,
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-image-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-image {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 150px;
  object-fit: contain;
}
@media (max-width: 900px) {
  .vn-header-ad__inner.has-ad {
    height: 100px;
    min-height: 100px;
    max-height: 100px;
  }
  .vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-slot__inner {
    padding: 15px 7px 5px;
  }
  .vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-image {
    max-height: 80px;
  }
}
@media (max-width: 640px) {
  .vn-header-ad__inner.has-ad {
    height: 82px;
    min-height: 82px;
    max-height: 82px;
  }
  .vn-header-ad__inner.has-ad .vn-ad-slot--header .vn-ad-image {
    max-height: 64px;
  }
}


/* AdBlock reader notice v4.27 ------------------------------------------- */
.vn-adblock-bait {
  position: absolute !important;
  left: -10000px !important;
  top: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
.vn-reader-notice[hidden] { display: none !important; }
.vn-reader-notice {
  position: fixed;
  z-index: 2147483000;
  font-family: inherit;
  color: var(--vn-text);
}
.vn-reader-notice__panel {
  position: relative;
  background: #fff;
  border: 1px solid var(--vn-border);
  border-top: 5px solid var(--vn-red);
  box-shadow: 0 18px 55px rgba(4,29,69,.22);
  padding: 24px;
}
.vn-reader-notice__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--vn-soft);
  color: var(--vn-text);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
.vn-reader-notice__close:hover { background: #eef1f5; color: var(--vn-red); }
.vn-reader-notice__kicker {
  display: inline-block;
  margin: 0 0 9px;
  padding: 4px 7px;
  background: var(--vn-red);
  color: #fff;
  font-size: 10px;
  line-height: 1.1;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-reader-notice h2 {
  margin: 0 44px 9px 0;
  color: var(--vn-navy);
  font-size: 25px;
  line-height: 1.08;
  font-weight: 900;
}
.vn-reader-notice p {
  margin: 0;
  color: #46556a;
  font-size: 14px;
  line-height: 1.5;
}
.vn-reader-notice__help {
  margin-top: 16px;
  border-top: 1px solid var(--vn-border);
  border-bottom: 1px solid var(--vn-border);
}
.vn-reader-notice__help summary {
  padding: 11px 0;
  color: var(--vn-navy);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}
.vn-reader-notice__help-body { padding: 0 0 12px; }
.vn-reader-notice__help ol {
  margin: 0;
  padding-left: 20px;
  color: #526074;
  font-size: 12px;
  line-height: 1.45;
}
.vn-reader-notice__help li + li { margin-top: 6px; }
.vn-reader-notice__status {
  min-height: 18px;
  margin-top: 12px;
  font-size: 12px;
  font-weight: 700;
}
.vn-reader-notice__status.is-warning { color: var(--vn-red); }
.vn-reader-notice__status.is-success { color: #147a42; }
.vn-reader-notice__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.vn-reader-notice__primary,
.vn-reader-notice__secondary {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 2px;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}
.vn-reader-notice__primary {
  border: 1px solid var(--vn-navy);
  background: var(--vn-navy);
  color: #fff;
}
.vn-reader-notice__primary:hover { background: var(--vn-navy-2); color: #fff; }
.vn-reader-notice__secondary {
  border: 1px solid var(--vn-border);
  background: #fff;
  color: var(--vn-text);
}
.vn-reader-notice__secondary:hover { border-color: var(--vn-red); color: var(--vn-red); }

.vn-reader-notice--modal {
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
}
.vn-reader-notice--modal .vn-reader-notice__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(4,29,69,.58);
  backdrop-filter: blur(2px);
}
.vn-reader-notice--modal .vn-reader-notice__panel {
  width: min(560px, 100%);
  max-height: min(720px, calc(100vh - 40px));
  overflow: auto;
}
html.vn-reader-notice-open { overflow: hidden; }

.vn-reader-notice--bottom {
  left: 0;
  right: 0;
  bottom: 0;
  padding: 12px;
}
.vn-reader-notice--bottom .vn-reader-notice__backdrop { display: none; }
.vn-reader-notice--bottom .vn-reader-notice__panel {
  width: min(1180px, calc(100% - 20px));
  margin-inline: auto;
}

.vn-reader-notice--corner {
  right: 16px;
  bottom: 16px;
  width: min(430px, calc(100% - 32px));
}
.vn-reader-notice--corner .vn-reader-notice__backdrop { display: none; }
.vn-reader-notice--corner .vn-reader-notice__panel { width: 100%; }

@media (max-width: 640px) {
  .vn-reader-notice--modal { padding: 12px; }
  .vn-reader-notice__panel { padding: 20px 17px 17px; }
  .vn-reader-notice h2 { font-size: 21px; }
  .vn-reader-notice__actions { display: grid; grid-template-columns: 1fr; }
  .vn-reader-notice__primary,
  .vn-reader-notice__secondary { width: 100%; }
  .vn-reader-notice--corner { right: 10px; bottom: 10px; width: calc(100% - 20px); }
  .vn-reader-notice--bottom { padding: 8px; }
  .vn-reader-notice--bottom .vn-reader-notice__panel { width: 100%; }
}


/* AdBlock notice reliability + compact bottom bar v4.28 ---------------- */
.vn-adblock-probes {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  left: -10000px !important;
  top: -10000px !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
.vn-reader-notice__secondary[data-vn-reader-reload] {
  border-color: rgba(4,29,69,.22);
  background: var(--vn-soft);
}
.vn-reader-notice--bottom .vn-reader-notice__panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 20px;
  align-items: center;
  padding: 15px 54px 14px 18px;
}
.vn-reader-notice--bottom .vn-reader-notice__kicker,
.vn-reader-notice--bottom h2,
.vn-reader-notice--bottom p,
.vn-reader-notice--bottom .vn-reader-notice__help,
.vn-reader-notice--bottom .vn-reader-notice__status {
  grid-column: 1;
}
.vn-reader-notice--bottom .vn-reader-notice__kicker {
  justify-self: start;
  margin-bottom: 5px;
}
.vn-reader-notice--bottom h2 {
  margin: 0 0 5px;
  font-size: 19px;
}
.vn-reader-notice--bottom p {
  font-size: 12.5px;
  line-height: 1.38;
}
.vn-reader-notice--bottom .vn-reader-notice__help {
  margin-top: 7px;
}
.vn-reader-notice--bottom .vn-reader-notice__help summary {
  padding: 7px 0;
}
.vn-reader-notice--bottom .vn-reader-notice__status {
  margin-top: 6px;
  min-height: 0;
}
.vn-reader-notice--bottom .vn-reader-notice__actions {
  grid-column: 2;
  grid-row: 1 / span 5;
  align-self: center;
  justify-content: flex-end;
  max-width: 390px;
  margin-top: 0;
}
@media (max-width: 760px) {
  .vn-reader-notice--bottom .vn-reader-notice__panel {
    display: block;
    padding: 18px 42px 15px 15px;
  }
  .vn-reader-notice--bottom .vn-reader-notice__actions {
    display: grid;
    grid-template-columns: 1fr;
    max-width: none;
    margin-top: 10px;
  }
}


/* AdBlock detection probe correction v4.29 ------------------------------
   Keep probes measurable when no blocker is present. A blocker may hide or
   remove them; reader-notice.js checks both cases. */
.vn-adblock-probes {
  position: fixed !important;
  left: -10000px !important;
  top: 0 !important;
  width: 20px !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: none !important;
  z-index: -1 !important;
}
.vn-adblock-probes .vn-adblock-bait {
  position: static !important;
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* AdBlock notice clarity + quick 3-step guide v4.31 --------------------- */
.vn-reader-notice__quick-help {
  margin-top: 17px;
  padding: 14px;
  border: 1px solid rgba(4,29,69,.12);
  border-radius: 5px;
  background: var(--vn-soft);
}
.vn-reader-notice__quick-title {
  margin-bottom: 10px;
  color: var(--vn-navy);
  font-size: 13px;
  line-height: 1.2;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .2px;
}
.vn-reader-notice__quick-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}
.vn-reader-notice__quick-steps li {
  display: grid;
  grid-template-columns: 30px minmax(0,1fr);
  gap: 10px;
  align-items: start;
  color: var(--vn-text);
  font-size: 13px;
  line-height: 1.28;
}
.vn-reader-notice__quick-steps small {
  display: inline-block;
  margin-top: 2px;
  color: #667286;
  font-size: 11.5px;
  line-height: 1.35;
}
.vn-reader-notice__step-number {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--vn-red);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}
.vn-reader-notice__help {
  margin-top: 10px;
}
.vn-reader-notice__help summary {
  position: relative;
  padding: 10px 28px 10px 0;
}
.vn-reader-notice__help summary::after {
  content: '＋';
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--vn-red);
  font-size: 16px;
  font-weight: 900;
}
.vn-reader-notice__help[open] summary::after { content: '−'; }
.vn-reader-notice__help-grid {
  display: grid;
  gap: 8px;
}
.vn-reader-notice__help-grid > div {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  background: #fff;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
}
.vn-reader-notice__help-grid strong {
  color: var(--vn-navy);
  font-size: 12px;
}
.vn-reader-notice__help-grid span {
  color: #59667a;
  font-size: 11.5px;
  line-height: 1.35;
}
.vn-reader-notice__actions {
  align-items: center;
}
.vn-reader-notice__primary {
  min-height: 44px;
  padding-inline: 18px;
}
.vn-reader-notice__later {
  border-color: transparent;
  background: transparent;
  color: var(--vn-muted);
}
.vn-reader-notice__later:hover {
  background: transparent;
}
.vn-reader-notice--modal .vn-reader-notice__panel {
  width: min(590px,100%);
}
@media (min-width: 761px) {
  .vn-reader-notice--bottom .vn-reader-notice__quick-help,
  .vn-reader-notice--bottom .vn-reader-notice__help {
    grid-column: 1;
  }
}
@media (max-width: 640px) {
  .vn-reader-notice__quick-help { padding: 12px; }
  .vn-reader-notice__quick-steps li { grid-template-columns: 28px minmax(0,1fr); gap: 8px; }
  .vn-reader-notice__step-number { width: 26px; height: 26px; }
  .vn-reader-notice__actions { gap: 6px; }
}


/* AdBlock no-flash guard v4.32 -------------------------------------------
   If the AdBlock notice is enabled, <html> starts in vn-adblock-checking.
   Real ad creatives are invisible before the first paint while detection runs,
   so a blocker cannot make them flash for a split second during navigation. */
html.vn-adblock-checking .vn-ad-slot.has-creative .vn-ad-slot__creative,
html.vn-adblock-checking .vn-header-ad__inner.has-ad > *,
html.vn-adblock-checking .vn-site-bottom-ad .vn-ad-slot.has-creative .vn-ad-slot__creative {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Once a blocker is confirmed, remove managed creatives on the current page.
   A small first-party cookie also prevents them from being server-rendered on
   subsequent page views, eliminating the navigation flash entirely. */
html.vn-adblock-detected .vn-ad-slot.has-creative,
html.vn-adblock-detected .vn-header-ad__inner.has-ad,
html.vn-adblock-detected .vn-site-bottom-ad .vn-ad-slot.has-creative {
  display: none !important;
}

html.vn-adblock-clear .vn-ad-slot.has-creative .vn-ad-slot__creative,
html.vn-adblock-clear .vn-header-ad__inner.has-ad > * {
  visibility: visible;
  opacity: 1;
}


/* Narrower desktop article reading layout v4.34
   Reduce the single-article page width by roughly 10% for easier reading.
   Homepage, category archives and mobile layouts stay unchanged. */
@media (min-width: 981px) {
  .vn-single-wrap {
    max-width: 1116px;
  }
}


/* End-sticky article sidebar v4.36 ---------------------------------------
   The sidebar scrolls with the article exactly like normal. Only after the
   reader has reached the bottom of the sidebar does that bottom edge stay
   visible, so the right column does not turn into empty space. The actual
   sidebar height is supplied by theme.js because ads can change its height. */
@media (min-width: 901px) {
  body.single .vn-news-sidebar {
    --vn-sidebar-height: 0px;
    position: sticky;
    top: calc(100vh - var(--vn-sidebar-height) - 18px);
    align-self: start;
    max-height: none;
    overflow: visible;
  }
}
@media (max-width: 900px) {
  body.single .vn-news-sidebar {
    position: static;
    top: auto;
    max-height: none;
    overflow: visible;
  }
}


/* Comment management controls v4.38 ----------------------------------------- */
.vn-comment__manage {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.vn-comment__manage[hidden] { display: none !important; }
.vn-comment-manage-btn {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 2px 0;
  color: var(--vn-muted);
  font-size: 11px;
  line-height: 1.2;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
}
.vn-comment-manage-btn:hover { color: var(--vn-navy); }
.vn-comment-manage-btn--delete { color: var(--vn-red); }
.vn-comment-manage-btn--delete:hover { color: #b70b16; }
.vn-comment-manage-btn:disabled { opacity: .5; cursor: wait; }
.vn-comment-editor { width: 100%; }
.vn-comment-editor__textarea {
  display: block;
  width: 100%;
  min-height: 110px;
  resize: vertical;
  padding: 11px 12px;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: #fff;
  color: var(--vn-text);
  font: inherit;
  line-height: 1.55;
}
.vn-comment-editor__textarea:focus {
  outline: 0;
  border-color: var(--vn-navy);
  box-shadow: 0 0 0 2px rgba(4,29,69,.08);
}
.vn-comment-editor__actions {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  margin-top: 9px;
}
.vn-comment-editor__save,
.vn-comment-editor__cancel {
  min-height: 32px;
  padding: 0 11px;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}
.vn-comment-editor__save {
  border: 1px solid var(--vn-navy);
  background: var(--vn-navy);
  color: #fff;
}
.vn-comment-editor__save:hover { background: var(--vn-red); border-color: var(--vn-red); }
.vn-comment-editor__cancel { border: 1px solid var(--vn-border); background: #fff; color: var(--vn-navy); }
.vn-comment-editor__feedback { color: var(--vn-red); font-size: 11px; font-weight: 800; }
@media (max-width: 700px) {
  .vn-comment__actions { flex-wrap: wrap; gap: 9px; }
  .vn-comment__manage { width: 100%; margin-left: 0; }
}


/* Article column balance v4.39 ----------------------------------------------
   On desktop, make the right sidebar exactly 5% wider than the previous
   315px column and increase the article/sidebar gap by 5%. The overall
   article wrapper stays the same width, so the extra space comes from the
   reading column as requested. */
@media (min-width: 981px) {
  body.single .vn-single-grid {
    grid-template-columns: minmax(0, 1fr) 330.75px;
    gap: 35.7px;
  }
}


/* Article/sidebar spacing v4.41 ---------------------------------------------
   Add another 5% to the desktop gap requested in v4.39. Sidebar width stays
   unchanged; the extra gap comes from the article reading column. */
@media (min-width: 981px) {
  body.single .vn-single-grid {
    gap: 37.485px;
  }
}


/* Sidebar typography + 7/30/90-day popular filter v4.42 ------------------ */
.vn-sidebox__heading-row {
  border-bottom: 1px solid var(--vn-border);
  background: #fff;
}
.vn-sidebox__heading-row .vn-sidebox__title {
  border-bottom: 0;
  padding-bottom: 8px;
}
.vn-side-popular__tabs {
  display: flex;
  gap: 5px;
  padding: 0 12px 11px;
}
.vn-side-popular__tab {
  appearance: none;
  min-height: 29px;
  flex: 1 1 0;
  padding: 4px 7px;
  border: 1px solid var(--vn-border);
  border-radius: 3px;
  background: var(--vn-soft);
  color: var(--vn-navy);
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  cursor: pointer;
}
.vn-side-popular__tab:hover,
.vn-side-popular__tab:focus-visible {
  border-color: var(--vn-red);
  color: var(--vn-red);
  outline: none;
}
.vn-side-popular__tab.is-active {
  border-color: var(--vn-navy);
  background: var(--vn-navy);
  color: #fff;
}
.vn-side-popular[hidden] { display: none !important; }

/* Curated "Odporúčame prečítať" article-sidebar block v4.43 ------------ */
.vn-side-recommended {
  padding: 0 12px;
}
.vn-side-recommended__item {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 11px 0;
  border-bottom: 1px solid var(--vn-border);
}
.vn-side-recommended__item:last-child {
  border-bottom: 0;
}
.vn-side-recommended__media {
  display: block;
  height: 61px;
  overflow: hidden;
  border-radius: 2px;
  background: var(--vn-soft);
}
.vn-side-recommended__media img,
.vn-side-recommended__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vn-side-recommended__placeholder {
  background: linear-gradient(135deg, var(--vn-soft), #e9edf3);
}
.vn-side-recommended__body {
  min-width: 0;
}
.vn-side-recommended__category {
  margin-bottom: 4px;
  color: var(--vn-red);
  font-size: 8.5px;
  line-height: 1.1;
  font-weight: 900;
  text-transform: uppercase;
}
.vn-side-recommended__title {
  display: block;
  color: var(--vn-text);
  font-size: 12px;
  line-height: 1.24;
  font-weight: 900;
}
.vn-side-recommended__title:hover {
  color: var(--vn-red);
}

/* Article/sidebar spacing v4.44 ---------------------------------------------
   Increase the desktop gap between the article and right sidebar by a further
   8% compared with v4.43. Sidebar width remains unchanged. */
@media (min-width: 981px) {
  body.single .vn-single-grid {
    gap: 40.484px;
  }
}


/* Global article author card v4.46 ---------------------------------------- */
.vn-author-card {
  position: relative;
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 30px 0 18px;
  padding: 18px 20px 18px 18px;
  border: 1px solid var(--vn-border);
  border-left: 4px solid var(--vn-red);
  border-radius: 8px;
  background: linear-gradient(135deg, #fff 0%, var(--vn-soft) 100%);
  box-shadow: 0 7px 24px rgba(4, 29, 69, .055);
  overflow: hidden;
}
.vn-author-card::after {
  content: "";
  position: absolute;
  width: 140px;
  height: 140px;
  right: -65px;
  top: -82px;
  border: 18px solid rgba(241, 14, 29, .045);
  border-radius: 50%;
  pointer-events: none;
}
.vn-author-card__avatar {
  width: 82px;
  height: 82px;
  border-radius: 50%;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: #eef1f5;
  border: 3px solid #fff;
  box-shadow: 0 0 0 1px var(--vn-border), 0 4px 14px rgba(4,29,69,.10);
}
.vn-author-card__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vn-author-card__silhouette {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #8b94a0;
}
.vn-author-card__silhouette svg {
  width: 51px;
  height: 51px;
  fill: currentColor;
}
.vn-author-card__content {
  min-width: 0;
  text-align: left;
}
.vn-author-card__label {
  margin-bottom: 4px;
  color: var(--vn-red);
  font-size: 11px;
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.vn-author-card__name {
  color: var(--vn-text);
  font-size: 20px;
  line-height: 1.2;
  font-weight: 900;
}
.vn-author-card__bio {
  max-width: 720px;
  margin-top: 6px;
  color: var(--vn-muted);
  font-size: 13px;
  line-height: 1.48;
  font-weight: 500;
}
.vn-author-card__button {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid var(--vn-navy);
  border-radius: 5px;
  background: var(--vn-navy);
  color: #fff;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}
.vn-author-card__button:hover,
.vn-author-card__button:focus-visible {
  transform: translateY(-1px);
  border-color: var(--vn-red);
  background: var(--vn-red);
  color: #fff;
  outline: none;
}
.vn-author-card__arrow {
  font-size: 14px;
  line-height: 1;
}
@media (max-width: 680px) {
  .vn-author-card {
    grid-template-columns: 66px minmax(0, 1fr);
    gap: 13px;
    margin-top: 32px;
    padding: 15px;
  }
  .vn-author-card__avatar {
    width: 66px;
    height: 66px;
  }
  .vn-author-card__silhouette svg {
    width: 41px;
    height: 41px;
  }
  .vn-author-card__name {
    font-size: 17px;
  }
  .vn-author-card__button {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 40px;
  }
}

/* Article videos v4.49 ----------------------------------------------------
 * News-style presentation for video inside article content.
 * Desktop/tablet: another 15% smaller than v4.48 (48% -> 40.8%, rounded to 41% of text column).
 * Mobile: keep full available width for comfortable viewing.
 */
.vn-article--news .vn-entry-content .wp-block-embed-youtube,
.vn-article--news .vn-entry-content .wp-block-embed-vimeo,
.vn-article--news .vn-entry-content .wp-block-video,
.vn-article--news .vn-entry-content .wp-video {
  position: relative;
  clear: both;
  margin-top: 30px !important;
  margin-bottom: 32px !important;
}

/* Small editorial VIDEO flag, matching the site's red/navy news language. */
.vn-article--news .vn-entry-content .wp-block-embed-youtube::before,
.vn-article--news .vn-entry-content .wp-block-embed-vimeo::before,
.vn-article--news .vn-entry-content .wp-block-video::before,
.vn-article--news .vn-entry-content .wp-video::before {
  content: "VIDEO";
  position: absolute;
  left: 10px;
  top: -13px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 3px;
  background: var(--vn-red);
  color: #fff;
  box-shadow: 0 3px 10px rgba(4, 29, 69, .16);
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .08em;
}

/* The actual player gets a restrained newsroom frame instead of a large naked embed. */
.vn-article--news .vn-entry-content .wp-block-embed-youtube iframe,
.vn-article--news .vn-entry-content .wp-block-embed-vimeo iframe,
.vn-article--news .vn-entry-content .wp-block-video video,
.vn-article--news .vn-entry-content .wp-video video,
.vn-article--news .vn-entry-content .mejs-container,
.vn-article--news .vn-entry-content > video,
.vn-article--news .vn-entry-content > iframe[src*="youtube.com"],
.vn-article--news .vn-entry-content > iframe[src*="youtube-nocookie.com"],
.vn-article--news .vn-entry-content > iframe[src*="youtu.be"],
.vn-article--news .vn-entry-content > iframe[src*="vimeo.com"] {
  overflow: hidden;
  border: 1px solid rgba(4, 29, 69, .16) !important;
  border-top: 4px solid var(--vn-red) !important;
  border-radius: 6px;
  background: #020913;
  box-shadow: 0 10px 28px rgba(4, 29, 69, .13);
}

.vn-article--news .vn-entry-content .wp-block-embed figcaption,
.vn-article--news .vn-entry-content .wp-block-video figcaption {
  margin-top: 9px;
  color: var(--vn-muted);
  font-size: 12px;
  line-height: 1.45;
  text-align: center;
}

@media (min-width: 781px) {
  .vn-article--news .vn-entry-content .wp-block-embed-youtube,
  .vn-article--news .vn-entry-content .wp-block-embed-vimeo,
  .vn-article--news .vn-entry-content .wp-block-video,
  .vn-article--news .vn-entry-content .wp-video,
  .vn-article--news .vn-entry-content > video {
    width: 41% !important;
    max-width: 41% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .vn-article--news .vn-entry-content .wp-block-embed-youtube iframe,
  .vn-article--news .vn-entry-content .wp-block-embed-vimeo iframe,
  .vn-article--news .vn-entry-content .wp-block-video video,
  .vn-article--news .vn-entry-content .wp-video video,
  .vn-article--news .vn-entry-content .wp-video .mejs-container,
  .vn-article--news .vn-entry-content .mejs-container video {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Classic editor / raw YouTube and Vimeo iframe embeds. */
  .vn-article--news .vn-entry-content > iframe[src*="youtube.com"],
  .vn-article--news .vn-entry-content > iframe[src*="youtube-nocookie.com"],
  .vn-article--news .vn-entry-content > iframe[src*="youtu.be"],
  .vn-article--news .vn-entry-content > iframe[src*="vimeo.com"] {
    display: block;
    width: 41% !important;
    max-width: 41% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    margin: 30px auto 32px !important;
  }
}

@media (max-width: 780px) {
  .vn-article--news .vn-entry-content .wp-block-embed-youtube,
  .vn-article--news .vn-entry-content .wp-block-embed-vimeo,
  .vn-article--news .vn-entry-content .wp-block-video,
  .vn-article--news .vn-entry-content .wp-video,
  .vn-article--news .vn-entry-content .mejs-container,
  .vn-article--news .vn-entry-content > video,
  .vn-article--news .vn-entry-content > iframe[src*="youtube.com"],
  .vn-article--news .vn-entry-content > iframe[src*="youtube-nocookie.com"],
  .vn-article--news .vn-entry-content > iframe[src*="youtu.be"],
  .vn-article--news .vn-entry-content > iframe[src*="vimeo.com"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .vn-article--news .vn-entry-content .wp-block-embed-youtube,
  .vn-article--news .vn-entry-content .wp-block-embed-vimeo,
  .vn-article--news .vn-entry-content .wp-block-video,
  .vn-article--news .vn-entry-content .wp-video {
    margin-top: 27px !important;
    margin-bottom: 27px !important;
  }
}