/*
 Theme Name:   ZZJZ Child (Twenty Twenty-Five)
 Description:  Modern, professional UI for ZZJZ — HZJZ-inspired nav
 Template:     twentytwentyfive
 Requires at least: 6.5
 Version:      4.1.0
 Text Domain:  zzjz
*/

/* =========================================================
   1. DESIGN TOKENS
   ========================================================= */

:root {
  --color-bg:            #ffffff;
  --color-ink:           #1a1a1a;
  --color-surface:       #f4f7fb;
  --color-border:        #dde4ed;
  --color-primary:       #005baa;
  --color-primary-hover: #004080;
  --color-primary-light: #e8f0fa;
  --color-accent:        #e8322a;
  --color-muted:         #5a6a7e;

  --font-sans:           "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-size-base:      clamp(14.5px, 0.85vw + 10px, 16px);
  --font-weight-heading: 700;
  --line-height-base:    1.65;
  --line-height-tight:   1.2;

  --space-xs:  0.375rem;
  --space-sm:  0.625rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;

  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 3px rgba(0,50,120,0.07);
  --shadow-md: 0 4px 12px rgba(0,50,120,0.10);
  --shadow-lg: 0 8px 24px rgba(0,50,120,0.12);
  --shadow-xl: 0 20px 40px rgba(0,50,120,0.14);

  --content-width: 96%;
  --content-max:   1700px;
  --post-max:      1360px;

  --card-height:        370px;
  --card-media-height:  190px;
  --card-min-width:     280px;
}*, *::before, *::after { box-sizing: border-box; }html {
  font-size: var(--font-size-base);
  scroll-behavior: smooth;
}body {
  margin: 0;
  font-family: var(--font-sans);
  color: var(--color-ink);
  background: var(--color-bg);
  line-height: var(--line-height-base);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}img, svg, video { max-width: 100%; height: auto; display: block; }a { color: inherit; text-decoration: none; }:where(a, button, [role="button"], input, textarea, select):focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 2px;
  border-radius: 4px;
}:where(h1,h2,h3,h4,h5,h6) {
  font-weight: var(--font-weight-heading);
  line-height: var(--line-height-tight);
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--color-ink);
}h1 { font-size: clamp(1.9rem, 3vw + 1rem, 2.8rem);     margin-bottom: var(--space-lg); }h2 { font-size: clamp(1.5rem, 2vw + 0.5rem, 2rem);     margin-bottom: var(--space-md); }h3 { font-size: clamp(1.1rem, 1.3vw + 0.3rem, 1.4rem); margin-bottom: var(--space-sm); }h4 { font-size: 1.05rem; margin-bottom: var(--space-xs); }p  { margin: 0 0 var(--space-md); line-height: 1.7; }.wp-site-blocks > * { margin-inline: auto; }.wp-site-blocks, .wp-block-group.alignfull { overflow-x: clip; }main.wp-block-group {
  width: var(--content-width);
  max-width: var(--content-max);
  padding-inline: clamp(1rem, 2.5vw, 2rem);
  padding-block: var(--space-xl) var(--space-2xl);
  margin-inline: auto;
}.single main.wp-block-group,
.page   main.wp-block-group {
  max-width: var(--post-max);
  display: grid;
  gap: var(--space-2xl);
  align-items: start;
}.zzjz-section { margin-top: var(--space-xl); }.zzjz-section:first-child { margin-top: 0; }header.zzjz-header,
.wp-site-blocks > header,
.wp-site-blocks > .wp-block-template-part > header {
  position: static !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}.zzjz-topbar {
  background: #ffffff !important;
  border-bottom: 1px solid var(--color-border) !important;
  padding: 0 !important;
  margin: 0 !important;
}.zzjz-topbar-inner {
  width: var(--content-width) !important;
  max-width: var(--content-max) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
  padding-block: 0.75rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 1rem !important;
  box-shadow: none !important;
}.zzjz-topbar .wp-block-site-logo,
.zzjz-topbar .zzjz-logo-img {
  flex-shrink: 0 !important;
  margin: 0 !important;
}.zzjz-topbar .wp-block-site-logo img,
.zzjz-topbar .zzjz-logo-img img {
  height: 52px !important;
  width: auto !important;
  display: block !important;
}.zzjz-topbar .wp-block-site-logo a,
.zzjz-topbar .zzjz-logo-img a {
  display: inline-flex !important;
  transition: opacity 0.2s ease !important;
}.zzjz-topbar .wp-block-site-logo a:hover,
.zzjz-topbar .zzjz-logo-img a:hover { opacity: 0.82 !important; }.zzjz-topbar .wp-block-site-title,
.zzjz-topbar .zzjz-site-title {
  font-size: clamp(0.85rem, 1.2vw, 1.05rem) !important;
  font-weight: 700 !important;
  color: var(--color-primary) !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  padding: 0 !important;
}.zzjz-topbar .wp-block-site-title a,
.zzjz-topbar .zzjz-site-title a {
  color: inherit !important;
  text-decoration: none !important;
}.zzjz-topbar .wp-block-site-title a:hover,
.zzjz-topbar .zzjz-site-title a:hover {
  color: var(--color-primary-hover) !important;
  text-decoration: none !important;
}.zzjz-navbar {
  background: var(--color-primary) !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: 0 3px 10px rgba(0,50,120,0.18) !important;
}.zzjz-navbar-inner {
  width: var(--content-width) !important;
  max-width: var(--content-max) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
  padding-block: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  box-shadow: none !important;
}.wp-site-blocks > header .wp-block-navigation,
header.zzjz-header .wp-block-navigation,
.zzjz-navbar .wp-block-navigation {
  background: var(--color-primary) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}.wp-site-blocks > header > .wp-block-group,
.wp-site-blocks > header .wp-block-columns {
  max-width: var(--content-max) !important;
  width: var(--content-width) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
}.wp-site-blocks > header .wp-block-columns {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 1rem !important;
  padding-block: 0.75rem !important;
  margin: 0 !important;
}.wp-site-blocks > header .wp-block-columns > .wp-block-column {
  margin: 0 !important;
  padding: 0 !important;
}.wp-site-blocks > header .wp-block-columns > .wp-block-column:first-child {
  flex: 0 0 auto !important;
}.wp-site-blocks > header .wp-block-columns > .wp-block-column:last-child {
  flex: 1 1 auto !important;
  display: flex !important;
  justify-content: flex-end !important;
}.wp-site-blocks > header .wp-block-site-logo img {
  height: 52px !important;
  width: auto !important;
}.wp-site-blocks > header .wp-block-site-logo a {
  display: inline-flex;
  transition: opacity 0.2s ease;
}.wp-site-blocks > header .wp-block-site-title {
  font-size: clamp(0.85rem, 1.2vw, 1rem) !important;
  font-weight: 700 !important;
  color: var(--color-primary) !important;
  margin: 0 !important;
}.wp-site-blocks > header .wp-block-site-title a {
  color: inherit !important;
  text-decoration: none !important;
}.wp-site-blocks > header .wp-block-navigation__container,
.zzjz-navbar .wp-block-navigation__container {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 52px !important;
}.wp-site-blocks > header .wp-block-navigation-item > a,
.wp-site-blocks > header .wp-block-navigation a,
.zzjz-navbar .wp-block-navigation-item > a,
.zzjz-navbar .wp-block-navigation a {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  height: 52px !important;
  padding: 0 1rem !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
  color: rgba(255,255,255,0.92) !important;
  white-space: nowrap !important;
  border-radius: 0 !important;
  transition: background 0.18s ease, color 0.18s ease !important;
}.wp-site-blocks > header .wp-block-navigation a::after,
.zzjz-navbar .wp-block-navigation a::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: rgba(255,255,255,0.9) !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform 0.2s ease !important;
}.wp-site-blocks > header .wp-block-navigation a:hover,
.zzjz-navbar .wp-block-navigation a:hover {
  background: rgba(255,255,255,0.14) !important;
  color: white !important;
}.wp-site-blocks > header .wp-block-navigation a:hover::after,
.zzjz-navbar .wp-block-navigation a:hover::after {
  transform: scaleX(1) !important;
}.wp-site-blocks > header .wp-block-navigation .current-menu-item > a,
.wp-site-blocks > header .wp-block-navigation .current-menu-ancestor > a,
.zzjz-navbar .wp-block-navigation .current-menu-item > a,
.zzjz-navbar .wp-block-navigation .current-menu-ancestor > a {
  background: rgba(255,255,255,0.2) !important;
  color: white !important;
}.wp-site-blocks > header .wp-block-navigation .current-menu-item > a::after,
.wp-site-blocks > header .wp-block-navigation .current-menu-ancestor > a::after,
.zzjz-navbar .wp-block-navigation .current-menu-item > a::after,
.zzjz-navbar .wp-block-navigation .current-menu-ancestor > a::after {
  transform: scaleX(1) !important;
}.wp-site-blocks > header .wp-block-navigation__submenu-container,
.zzjz-navbar .wp-block-navigation__submenu-container {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 500 !important;
  min-width: 250px !important;
  background: #ffffff !important;
  border-top: 3px solid var(--color-accent) !important;
  border-radius: 0 0 var(--radius-md) var(--radius-md) !important;
  box-shadow: 0 14px 36px rgba(0,50,120,0.16) !important;
  padding: 0.4rem 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-4px) !important;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s !important;
}.wp-site-blocks > header .wp-block-navigation-item:hover > .wp-block-navigation__submenu-container,
.wp-site-blocks > header .wp-block-navigation-item:focus-within > .wp-block-navigation__submenu-container,
.zzjz-navbar .wp-block-navigation-item:hover > .wp-block-navigation__submenu-container,
.zzjz-navbar .wp-block-navigation-item:focus-within > .wp-block-navigation__submenu-container {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}.wp-site-blocks > header .wp-block-navigation__submenu-container a,
.zzjz-navbar .wp-block-navigation__submenu-container a {
  height: auto !important;
  padding: 0.6rem 1.1rem !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: var(--color-ink) !important;
  background: none !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(0,0,0,0.05) !important;
  display: flex !important;
  align-items: center !important;
  transition: background 0.15s ease, padding-left 0.15s ease !important;
}.wp-site-blocks > header .wp-block-navigation__submenu-container a::after,
.zzjz-navbar .wp-block-navigation__submenu-container a::after {
  display: none !important;
}.wp-site-blocks > header .wp-block-navigation__submenu-container a:hover,
.zzjz-navbar .wp-block-navigation__submenu-container a:hover {
  background: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
  padding-left: 1.5rem !important;
}.wp-site-blocks > header .wp-block-navigation__submenu-container li:last-child a,
.zzjz-navbar .wp-block-navigation__submenu-container li:last-child a {
  border-bottom: none !important;
}.wp-site-blocks > header .wp-block-navigation__responsive-container-open,
.wp-site-blocks > header .wp-block-navigation__responsive-container-close,
.zzjz-navbar .wp-block-navigation__responsive-container-open,
.wp-site-blocks > header .wp-block-navigation__responsive-container-open svg,
.wp-site-blocks > header .wp-block-navigation__responsive-container-close svg,
.zzjz-navbar .wp-block-navigation__responsive-container-open svg,
.zzjz-navbar .wp-block-navigation__responsive-container-close svg {
  width: 22px !important;
  height: 22px !important;
  fill: white !important;
}@keyframes menuFadeIn { from { opacity: 0; } to { opacity: 1; } }.wp-block-navigation__responsive-container.is-menu-open {
  display: flex !important;
  flex-direction: column !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  background: var(--color-primary) !important;
  overflow-y: auto !important;
  animation: menuFadeIn 0.2s ease !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close {
  position: fixed !important;
  top: 1rem !important;
  right: 1rem !important;
  z-index: 10000 !important;
  width: 40px !important;
  height: 40px !important;
  background: rgba(255,255,255,0.2) !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  color: white !important;
  border-radius: var(--radius-sm) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close svg {
  fill: white !important;
  width: 22px !important;
  height: 22px !important;
}.wp-block-navigation__responsive-container-content {
  padding: 5rem 1.5rem 2rem !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  gap: 6px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item > a,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation a {
  display: flex !important;
  align-items: center !important;
  height: auto !important;
  padding: 0.85rem 1.25rem !important;
  border-radius: var(--radius-md) !important;
  font-weight: 600 !important;
  font-size: 1.05rem !important;
  color: white !important;
  background: rgba(255,255,255,0.1) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  transition: background 0.15s ease, transform 0.15s ease !important;
  white-space: normal !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation a::after {
  display: none !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation a:hover {
  background: rgba(255,255,255,0.2) !important;
  transform: translateX(4px) !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .current-menu-item > a {
  background: rgba(255,255,255,0.25) !important;
  border-color: rgba(255,255,255,0.35) !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container {
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  background: rgba(0,0,0,0.18) !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  box-shadow: none !important;
  padding: 4px 0 !important;
  margin: 4px 0 4px 1rem !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container a {
  font-size: 0.95rem !important;
  color: rgba(255,255,255,0.88) !important;
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
  padding: 0.6rem 1rem !important;
  border-radius: var(--radius-sm) !important;
}.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__submenu-container a:hover {
  background: rgba(255,255,255,0.12) !important;
  transform: none !important;
}@media (min-width: 1024px) {
  
  .wp-block-navigation__responsive-container-open,
  .wp-block-navigation__responsive-container-close {
    display: none !important;
  }

  .wp-block-navigation__responsive-container {
    display: block !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open {
    position: static !important;
    inset: auto !important;
    background: transparent !important;
    animation: none !important;
    overflow: visible !important;
    flex-direction: row !important;
    height: auto !important;
  }

  .wp-block-navigation__responsive-container-content {
    padding: 0 !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container {
    flex-direction: row !important;
    height: 52px !important;
    gap: 0 !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item > a,
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation a {
    height: 52px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    font-size: 0.875rem !important;
    color: rgba(255,255,255,0.92) !important;
    white-space: nowrap !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation a:hover {
    background: rgba(255,255,255,0.14) !important;
    transform: none !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container {
    position: absolute !important;
    opacity: 0 !important;
    visibility: hidden !important;
    background: white !important;
    border-top: 3px solid var(--color-accent) !important;
    margin: 0 !important;
    padding: 0.4rem 0 !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item:hover > .wp-block-navigation__submenu-container,
  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item:focus-within > .wp-block-navigation__submenu-container {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container a {
    color: var(--color-ink) !important;
    background: none !important;
    border-bottom: 1px solid rgba(0,0,0,0.05) !important;
    padding: 0.6rem 1.1rem !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container a:hover {
    background: var(--color-primary-light) !important;
    color: var(--color-primary) !important;
    padding-left: 1.5rem !important;
  }
}.is-style-card,
.zzjz-card {
  position: relative;
  background: white;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  height: var(--card-height);
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  padding: 0;
}.is-style-card:hover,
.zzjz-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-xl);
  border-color: var(--color-primary);
}.zzjz-cards-grid .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--card-min-width), 1fr));
  gap: var(--space-lg);
  list-style: none;
  margin: 0; padding: 0;
  align-items: stretch;
}.zzjz-cards-grid .wp-block-post-template:empty { display: none !important; }.zzjz-cards-grid .wp-block-post-template > li {
  display: flex;
  list-style: none; margin: 0;
  width: auto !important; max-width: none !important; flex: 0 0 auto !important;
}.zzjz-cards-grid .wp-block-query-no-results,
.zzjz-cards-grid > p {
  grid-column: 1/-1;
  padding: 2rem;
  text-align: center;
  color: var(--color-muted);
}.zzjz-card .wp-block-post-featured-image {
  flex: 0 0 auto;
  height: var(--card-media-height);
  overflow: hidden;
  background: var(--color-surface);
}.zzjz-card .wp-block-post-featured-image img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}.zzjz-card:hover .wp-block-post-featured-image img { transform: scale(1.06); }.zzjz-card > .wp-block-group {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 0.85rem 1rem 1rem;
  gap: 0.35rem;
}.zzjz-card .wp-block-post-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
}.zzjz-card .wp-block-post-title a {
  position: relative; z-index: 2;
  display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--color-ink);
  transition: color 0.18s ease;
}.zzjz-card .wp-block-post-title a::after {
  content: ""; position: absolute; inset: -1rem; z-index: 1;
}.zzjz-card:hover .wp-block-post-title a { color: var(--color-primary); }.zzjz-card .wp-block-post-excerpt {
  margin: 0; font-size: 0.85rem; color: var(--color-muted); line-height: 1.6;
}.zzjz-card .wp-block-post-excerpt p {
  display: -webkit-box;
  -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden; margin: 0;
}.zzjz-card .wp-block-post-excerpt .wp-block-post-excerpt__more-link {
  font-size: 0.8rem; font-weight: 600;
  color: var(--color-primary);
  display: inline-block; margin-top: 0.25rem;
  position: relative; z-index: 3;
}.zzjz-date,
.wp-block-post-date {
  display: inline-flex; align-items: center; width: fit-content;
  font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  padding: 2px 7px; border-radius: var(--radius-sm);
  color: white; background: var(--color-primary);
}.zzjz-section-header {
  display: flex; justify-content: space-between; align-items: center;
  gap: var(--space-md); margin-bottom: var(--space-md); flex-wrap: wrap;
}.zzjz-section h2,
.zzjz-section-title {
  margin: 0;
  font-size: clamp(1.1rem, 1.5vw + 0.3rem, 1.35rem);
  font-weight: 700;
  color: var(--color-primary);
  padding-left: 0.75rem;
  border-left: 4px solid var(--color-accent);
  line-height: 1.25;
}.zzjz-section-divider {
  border: none;
  border-top: 1px solid var(--color-border);
  margin: 0 0 var(--space-lg);
}.zzjz-more,
a.zzjz-archive-link {
  display: inline-flex; align-items: center; gap: 0.3rem;
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-accent); padding: 3px 10px;
  border: 1.5px solid var(--color-accent); border-radius: var(--radius-sm);
  transition: all 0.18s ease; white-space: nowrap;
}.zzjz-more:hover, a.zzjz-archive-link:hover {
  background: var(--color-accent); color: white;
}.zzjz-sidebar {
  position: sticky;
  top: var(--space-md);
}.zzjz-sidebar-widget {
  background: white; border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); overflow: hidden;
  margin-bottom: var(--space-md); box-shadow: var(--shadow-sm);
}.zzjz-sidebar-widget-header {
  background: var(--color-primary); color: white;
  padding: 0.55rem 1rem;
  font-size: 0.78rem; font-weight: 700;
  letter-spacing: 0.05em; text-transform: uppercase;
}.zzjz-sidebar-widget-body { padding: var(--space-md); }.zzjz-sidebar-links { list-style: none; margin: 0; padding: 0; }.zzjz-sidebar-links li { border-bottom: 1px solid var(--color-border); }.zzjz-sidebar-links li:last-child { border-bottom: none; }.zzjz-sidebar-links a {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 0.25rem; font-size: 0.875rem; font-weight: 500;
  color: var(--color-ink); transition: all 0.15s ease;
}.zzjz-sidebar-links a::before {
  content: "›"; color: var(--color-accent);
  font-size: 1.2em; font-weight: 700; flex-shrink: 0;
}.zzjz-sidebar-links a:hover { color: var(--color-primary); padding-left: 0.4rem; }.zzjz-contact-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 0.65rem; font-size: 0.875rem;
}.zzjz-contact-list li strong {
  display: block; font-size: 0.72rem; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--color-muted); margin-bottom: 1px;
}.zzjz-tip-box {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
  border-radius: var(--radius-lg); padding: var(--space-md); color: white;
  margin-bottom: var(--space-md);
}.zzjz-tip-box h3 { color: white; font-size: 0.9rem; margin-bottom: 0.5rem; }.zzjz-tip-box p  { font-size: 0.85rem; opacity: 0.92; margin: 0; line-height: 1.55; }.wp-block-button .wp-block-button__link,
.zzjz-pdf-btn, .konkurs-pdf {
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.6rem 1.2rem; border-radius: var(--radius-sm);
  background: var(--color-primary); color: white;
  font-weight: 700; font-size: 0.875rem;
  border: 2px solid transparent; cursor: pointer;
  text-decoration: none; transition: all 0.2s ease;
}.wp-block-button .wp-block-button__link:hover,
.zzjz-pdf-btn:hover, .konkurs-pdf:hover {
  background: var(--color-primary-hover);
  transform: translateY(-1px); box-shadow: var(--shadow-md);
}.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent; color: var(--color-primary); border-color: var(--color-primary);
}.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--color-primary); color: white;
}.has-custom-width.wp-block-button__width-100 { width: 100%; }.has-custom-width.wp-block-button__width-100 .wp-block-button__link { width: 100%; justify-content: center; }.zzjz-hero-section {
  margin-bottom: var(--space-xl) !important;
  
  max-width: none !important;
  width: 100% !important;
}.zzjz-hero-carousel {
  position: relative;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}.zzjz-carousel-slides {
  position: relative;
  width: 100%;
  height: 480px;           
  background: var(--color-primary);
  overflow: hidden;
}.zzjz-carousel-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 500ms ease;
  
  display: block;
}.zzjz-carousel-slide.active {
  opacity: 1;
  pointer-events: auto;
  z-index: 1;
}.zzjz-carousel-image {
  position: absolute;
  inset: 0;
  overflow: hidden;
}.zzjz-carousel-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}.zzjz-carousel-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    100deg,
    rgba(0, 25, 70, 0.90) 0%,
    rgba(0, 25, 70, 0.65) 38%,
    rgba(0, 25, 70, 0.20) 65%,
    transparent 85%
  );
  z-index: 1;
}.zzjz-carousel-content {
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  z-index: 2;
  width: min(560px, 55%);
  padding: 2.5rem clamp(1.5rem, 3vw, 3rem);
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 0.5rem;
}.zzjz-carousel-date {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  background: var(--color-accent);
  color: white;
  padding: 3px 9px;
  border-radius: var(--radius-sm);
  width: fit-content;
  margin-bottom: 0.25rem;
}.zzjz-carousel-title {
  margin: 0;
  font-size: clamp(1.4rem, 2.2vw, 2.2rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  text-shadow: 0 2px 16px rgba(0,0,0,0.35);
  color: #fff;
}.zzjz-carousel-title a {
  color: inherit;
  text-decoration: none;
}.zzjz-carousel-title a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}.zzjz-carousel-excerpt {
  margin: 0.1rem 0 0.5rem;
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: rgba(255,255,255,0.92);
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-shadow: 0 1px 8px rgba(0,0,0,0.3);
}.zzjz-carousel-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1.2rem;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--color-primary);
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.01em;
  width: fit-content;
  margin-top: 0.25rem;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
  position: relative;
  z-index: 3;
}.zzjz-carousel-button:hover {
  background: var(--color-primary);
  color: white;
  transform: translateY(-2px);
}.zzjz-carousel-prev,
.zzjz-carousel-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: none;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  background: rgba(255,255,255,0.92);
  color: var(--color-primary);
  box-shadow: 0 2px 12px rgba(0,0,0,0.2);
  transition: all 0.2s ease;
}.zzjz-carousel-prev { left: 1.25rem; }.zzjz-carousel-next { right: 1.25rem; }.zzjz-carousel-prev:hover,
.zzjz-carousel-next:hover {
  background: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
  transform: translateY(-50%) scale(1.08);
}.zzjz-carousel-dots {
  position: absolute;
  bottom: 1.1rem;
  right: 1.5rem;
  display: flex;
  gap: 6px;
  z-index: 10;
}.zzjz-carousel-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.65);
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: all 0.25s ease;
}.zzjz-carousel-dot:hover {
  border-color: white;
  background: rgba(255,255,255,0.45);
}.zzjz-carousel-dot.active {
  width: 28px;
  border-radius: var(--radius-full);
  background: white;
  border-color: white;
}.zzjz-hero-quicklinks {
  display: flex;
  background: var(--color-primary-hover);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);  
}.zzjz-hero-quicklinks a {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  border-right: 1px solid rgba(255,255,255,0.1);
  transition: background 0.18s ease, color 0.18s ease;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}.zzjz-hero-quicklinks a:last-child { border-right: none; }.zzjz-hero-quicklinks a:hover { background: rgba(255,255,255,0.13); color: white; }.zzjz-hero-quicklinks .icon { font-size: 1.1em; flex-shrink: 0; }.zzjz-footer {
  background: #1a2e4a; color: rgba(255,255,255,0.82);
  margin-top: var(--space-2xl); padding-block: var(--space-2xl);
}.zzjz-footer > .wp-block-group {
  width: var(--content-width); max-width: var(--content-max);
  margin: 0 auto; padding-inline: clamp(1rem, 2.5vw, 2rem);
}.zzjz-footer h3 {
  color: white; font-size: 0.8rem; text-transform: uppercase;
  letter-spacing: 0.08em; margin-bottom: var(--space-sm);
  padding-bottom: var(--space-xs);
  border-bottom: 2px solid var(--color-accent); width: fit-content;
}.zzjz-footer a { color: rgba(255,255,255,0.65); }.zzjz-footer a:hover { color: white; }footer + .wp-block-query, footer + * .wp-block-query { display: none !important; }.u-hide { display: none !important; }.u-text-muted { color: var(--color-muted); }.home .zzjz-alert { display: none !important; }.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border-width: 0;
}.skip-link { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }.skip-link:focus {
  position: fixed; top: var(--space-md); left: var(--space-md);
  width: auto; height: auto; padding: var(--space-sm) var(--space-md);
  background: var(--color-primary); color: white; font-weight: 600;
  border-radius: var(--radius-md); box-shadow: var(--shadow-lg); z-index: 10000;
}@media (min-width: 1600px) {
  :root { --card-min-width: 340px; }
}@media (max-width: 1200px) {
  .zzjz-cards-grid .wp-block-post-template { grid-template-columns: repeat(2, 1fr); }
}@media (max-width: 1024px) {
  :root { --card-height: 350px; --card-media-height: 170px; }
  .zzjz-section { margin-top: var(--space-lg); }
  .single main.wp-block-group, .page main.wp-block-group { grid-template-columns: 1fr; gap: var(--space-xl); }
  .zzjz-sidebar { position: static; }
  .zzjz-carousel-slides { height: 380px; }
  .zzjz-carousel-content { width: min(520px, 65%); }
  .zzjz-hero-quicklinks { flex-wrap: wrap; }
  .zzjz-hero-quicklinks a { flex: 1 1 40%; }
}@media (max-width: 768px) {
  :root { --card-min-width: 260px; }
  .zzjz-carousel-slides { height: 300px; }
  .zzjz-carousel-content { width: 90%; }
  .zzjz-carousel-excerpt, .zzjz-carousel-prev, .zzjz-carousel-next{ display: none; }
  .zzjz-hero-quicklinks { display: none; }
}@media (max-width: 640px) {
  :root {
    --space-xl: 1.25rem; --space-2xl: 2rem;
    --card-height: 330px; --card-media-height: 150px;
  }
  main.wp-block-group { padding-inline: var(--space-md); padding-block: var(--space-lg); }
  .zzjz-cards-grid .wp-block-post-template { grid-template-columns: 1fr; gap: var(--space-md); }
  .zzjz-section h2, .zzjz-section-title { font-size: 1.1rem; }
}@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important; animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important; scroll-behavior: auto !important;
  }
}@media (prefers-contrast: high) {
  :root { --color-border: #000; }
  .is-style-card, .zzjz-card { border-width: 2px; }
}@media print {
  .wp-site-blocks > header, header.zzjz-header,
  .zzjz-footer, .zzjz-sidebar, .wp-block-navigation, .skip-link { display: none !important; }
  .single main.wp-block-group, .page main.wp-block-group { grid-template-columns: 1fr; max-width: 100%; }
  .is-style-card { break-inside: avoid; box-shadow: none; border: 1px solid #ccc; }
}.zzjz-footer {
  background: #142840; 
  color: rgba(255,255,255,0.82);
}.zzjz-footer-inner {
  width: var(--content-width);
  max-width: var(--content-max);
  margin: 0 auto;
  padding-inline: clamp(1rem, 2.5vw, 2rem);
}.zzjz-footer-columns {
  gap: clamp(1rem, 2vw, 2rem) !important;
}.zzjz-footer-col p { margin: 0; }.zzjz-footer-text strong {
  color: rgba(255,255,255,0.92);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}.zzjz-footer a {
  color: rgba(255,255,255,0.72);
  text-decoration: none;
  transition: color 0.15s ease, opacity 0.15s ease, transform 0.15s ease;
}.zzjz-footer a:hover {
  color: #ffffff;
}.zzjz-footer-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}.zzjz-footer-list li a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}.zzjz-footer-list li a::before {
  content: "›";
  color: var(--color-accent);
  font-weight: 800;
  transform: translateY(-0.5px);
}.zzjz-footer-mini {
  margin-top: 0.85rem !important;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
}.zzjz-footer-sep {
  border-top: 1px solid rgba(255,255,255,0.12) !important;
  margin: 1.5rem 0 1rem !important;
}.zzjz-footer-bottom {
  gap: 0.75rem;
}.zzjz-footer-copy,
.zzjz-footer-legal {
  margin: 0 !important;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
}.zzjz-footer-legal span {
  margin: 0 0.4rem;
  color: rgba(255,255,255,0.35);
}.zzjz-footer-sitemap {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1rem;
}@media (max-width: 768px) {
  .zzjz-footer-sitemap { grid-template-columns: 1fr; }
}@media (min-width: 1024px) {
  
  .wp-block-navigation__responsive-container-open,
  .wp-block-navigation__responsive-container-close {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  
  .wp-block-navigation__responsive-container {
    display: block !important;
    position: static !important;
    inset: auto !important;
    background: transparent !important;
    overflow: visible !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  
  body.has-modal-open {
    overflow: auto !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open {
    display: block !important;
  }
  .wp-block-navigation__responsive-container-content {
    padding: 0 !important;
  }
}.zzjz-footer {
  margin-top: var(--space-3xl);
  background: radial-gradient(1200px 600px at 10% 0%, rgba(232,50,42,0.10), transparent 55%),
              radial-gradient(900px 500px at 90% 10%, rgba(0,91,170,0.16), transparent 60%),
              #0f2238;
  color: rgba(255,255,255,0.82);
}.zzjz-hours-day {
  font-weight: 700;
  color: rgba(255,255,255,0.92);
}.zzjz-hours-time {
  font-weight: 600;
  color: rgba(255,255,255,0.72);
}.zzjz-footer-bottom {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,0.10);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
}.zzjz-footer-legal span {
  margin: 0 0.5rem;
  color: rgba(255,255,255,0.32);
}@media (max-width: 768px) {
  .zzjz-footer-links-2col { grid-template-columns: 1fr; }
  .zzjz-footer-card { padding: 1rem; }
}.zzjz-footer-inner {
  width: var(--content-width);
  max-width: var(--content-max);
  margin: 0 auto;
  padding: clamp(1.25rem, 2.5vw, 2rem);
  padding-top: clamp(1.5rem, 2.8vw, 2.25rem);
}.zzjz-footer a {
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  transition: color 0.15s ease, transform 0.15s ease, opacity 0.15s ease;
}.zzjz-footer-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}.zzjz-footer-logo {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
}.zzjz-footer-mark {
  font-weight: 900;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.92);
  font-size: 0.9rem;
}.wp-site-blocks > header > .wp-block-group,
.wp-site-blocks > header .wp-block-columns,
header.zzjz-header .zzjz-topbar-inner,
header.zzjz-header .zzjz-navbar-inner,
.zzjz-navbar-inner,
.zzjz-topbar-inner {
  width: var(--content-width) !important;
  max-width: var(--content-max) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
}.zzjz-topbar-inner,
.zzjz-navbar-inner,
.zzjz-footer-inner,
main.wp-block-group {
  width: var(--content-width) !important;
  max-width: var(--content-max) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
}main.wp-block-group {
  padding-inline: clamp(1rem, 2.5vw, 2rem);
}.zzjz-footer {
  margin-top: var(--space-3xl);
  background: radial-gradient(1200px 600px at 10% 0%, rgba(232,50,42,0.10), transparent 55%),
              radial-gradient(900px 500px at 90% 10%, rgba(0,91,170,0.16), transparent 60%),
              #0f2238;
  color: rgba(255,255,255,0.82);
  padding: 0;
}.zzjz-footer-accent {
  height: 4px;
  background: linear-gradient(90deg, var(--color-accent), var(--color-primary));
  opacity: 0.95;
}.zzjz-footer-inner {
  padding-top: clamp(1.5rem, 2.8vw, 2.25rem) !important;
  padding-bottom: clamp(1.25rem, 2.5vw, 2rem) !important;
}.zzjz-footer-grid {
  gap: clamp(0.9rem, 1.8vw, 1.5rem) !important;
  margin: 0 !important;
}.zzjz-footer-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  padding: 1.1rem 1.1rem 1rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.18);
  backdrop-filter: blur(6px);
}.zzjz-footer h3 {
  margin: 0 0 0.9rem !important;
  color: rgba(255,255,255,0.96);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}.zzjz-footer a {
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  transition: color 0.15s ease, transform 0.15s ease;
}.zzjz-footer a:hover { color: #fff; }.zzjz-footer-kv { margin: 0 0 0.85rem !important; line-height: 1.55; }.zzjz-footer-kv:last-child { margin-bottom: 0 !important; }.zzjz-label {
  display: inline-block;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.62);
  margin-bottom: 0.15rem;
}.zzjz-hours { display: grid; gap: 0.55rem; margin-bottom: 0.85rem; }.zzjz-hours-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.55rem 0.7rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
}.zzjz-hours-day { font-weight: 700; color: rgba(255,255,255,0.92); }.zzjz-hours-time { font-weight: 600; color: rgba(255,255,255,0.72); }.zzjz-footer-note {
  margin: 0 !important;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.68);
}.zzjz-footer-links {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  display: grid;
  gap: 0.6rem;
}.zzjz-footer-links li a {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
}.zzjz-footer-links li a::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(232,50,42,0.16);
  flex: 0 0 auto;
}.zzjz-footer-links li a:hover { transform: translateX(2px); }.zzjz-footer-links-2col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1rem;
}.zzjz-footer-pills { display: flex; flex-wrap: wrap; gap: 0.55rem; }.zzjz-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 0.7rem;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 700;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.14);
  color: rgba(255,255,255,0.86);
}.zzjz-pill:hover {
  background: rgba(255,255,255,0.12);
  transform: translateY(-1px);
  color: #fff;
}.zzjz-footer-mini {
  margin: 0.9rem 0 0 !important;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.66);
}.zzjz-footer-bottom {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,0.10);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}.zzjz-footer-brand {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-width: 240px;
}.zzjz-footer-logo {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  overflow: hidden;
}.zzjz-footer-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 6px;
}.zzjz-footer-brandtext { display: grid; gap: 0.1rem; }.zzjz-footer-org { font-weight: 800; color: rgba(255,255,255,0.92); }.zzjz-footer-sub { font-size: 0.9rem; color: rgba(255,255,255,0.65); }.zzjz-footer-meta { display: grid; gap: 0.25rem; text-align: right; }.zzjz-footer-copy,
.zzjz-footer-legal {
  margin: 0 !important;
  font-size: 0.88rem;
  color: rgba(255,255,255,0.62);
}.zzjz-footer-legal span { margin: 0 0.5rem; color: rgba(255,255,255,0.32); }@media (max-width: 768px) {
  .zzjz-footer-links-2col { grid-template-columns: 1fr; }
  .zzjz-footer-card { padding: 1rem; }
  .zzjz-footer-meta { text-align: left; }
}@media (min-width: 1024px) {
  :root {
    --card-height: 420px; 
    --card-media-height: 200px; 
  }
}.zzjz-card .wp-block-post-excerpt p {
  -webkit-line-clamp: 4; 
}.wp-block-query-pagination {
  margin-top: var(--space-2xl) !important;
  display: flex !important;
  gap: 0.5rem !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
}@media (min-width: 1024px) {
  :root {
    --card-height: 440px;      
    --card-media-height: 200px; 
  }
}.zzjz-breadcrumbs {
  font-size: 0.875rem;
  color: var(--color-muted);
  margin-bottom: var(--space-md);
  padding: 0.5rem 0;
}.wp-block-query-title {
  margin: 0 !important;
  font-size: clamp(1.3rem, 1.8vw + 0.3rem, 1.6rem) !important;
  font-weight: 700 !important;
  color: var(--color-primary) !important;
  padding-left: 0.75rem !important;
  border-left: 4px solid var(--color-accent) !important;
  line-height: 1.25 !important;
}.zzjz-card .wp-block-post-excerpt p {
  -webkit-line-clamp: 4 !important;
}.wp-block-query-pagination {
  display: flex !important;
  gap: 0.5rem !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
}.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--color-primary);
  background: white;
  border: 1.5px solid var(--color-border);
  transition: all 0.18s ease;
  text-decoration: none;
}.wp-block-query-pagination a:hover {
  background: var(--color-primary);
  color: white;
  border-color: var(--color-primary);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}.wp-block-query-pagination .page-numbers.current {
  background: var(--color-primary);
  color: white;
  border-color: var(--color-primary);
  pointer-events: none;
}.wp-block-query-pagination .page-numbers.dots {
  border: none;
  background: transparent;
  color: var(--color-muted);
  pointer-events: none;
  min-width: auto;
}.wp-block-query-pagination-previous a,
.wp-block-query-pagination-next a {
  font-weight: 700;
  padding: 0.5rem 1.25rem;
}body:not(.home) {
  background: var(--color-bg) !important;
}body.page main,
body.single main,
body.page .wp-site-blocks > .wp-block-group,
body.single .wp-site-blocks > .wp-block-group,
body.page .wp-site-blocks > main,
body.single .wp-site-blocks > main {
  margin-top: 0 !important;
  padding-top: 1.25rem !important; 
}body.page .wp-site-blocks > .wp-block-group:first-of-type,
body.single .wp-site-blocks > .wp-block-group:first-of-type {
  padding-top: 0 !important;
}body.page main > :first-child,
body.single main > :first-child,
body.page main .wp-block-post-content > :first-child,
body.single main .wp-block-post-content > :first-child {
  margin-top: 0 !important;
}body.page .wp-block-post-content :is(h1,h2,h3,.wp-block-heading):first-child,
body.single .wp-block-post-content :is(h1,h2,h3,.wp-block-heading):first-child {
  margin-top: 0 !important;
}.wp-block-navigation-item.no-arrow .wp-block-navigation__submenu-icon {
  display: none !important;
}body.page .wp-block-post-content,
body.single .wp-block-post-content {
  max-width: 1100px;
  margin-inline: auto;
}body.page .wp-block-post-content p,
body.single .wp-block-post-content p,
body.page .wp-block-post-content li,
body.single .wp-block-post-content li {
  font-size: 1rem;
  line-height: 1.7;
  color: rgba(255,255,255,0.88);
}body.page .wp-block-post-content :is(h1,h2,h3,.wp-block-heading),
body.single .wp-block-post-content :is(h1,h2,h3,.wp-block-heading) {
  color: rgba(255,255,255,0.96);
  letter-spacing: -0.015em;
}body.page main,
body.single main {
  background: transparent !important;
}body.page .wp-block-post-content ul,
body.single .wp-block-post-content ul {
  padding-left: 1.2rem;
}body.page .wp-block-post-content li,
body.single .wp-block-post-content li {
  margin-bottom: 0.4rem;
}body.page .wp-site-blocks > main.wp-block-group,
body.single .wp-site-blocks > main.wp-block-group {
  width: var(--content-width) !important;
  max-width: var(--content-max) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;
}body.page,
body.single {
  --wp--style--global--content-size: var(--content-max) !important;
  --wp--style--global--wide-size: var(--content-max) !important;
}body.page main.wp-block-group,
body.single main.wp-block-group {
  margin-top: 0 !important; 
}body.page main.wp-block-group > .wp-block-group.alignfull:first-child,
body.single main.wp-block-group > .wp-block-group.alignfull:first-child {
  padding-top: 1.25rem !important; 
}body {
  background: var(--color-bg) !important;
}.zzjz-breadcrumbs {
  font-size: 0.875rem;
  color: var(--color-muted);
  margin-bottom: 1.5rem;
  padding: 0.5rem 0;
}.zzjz-breadcrumbs a {
  color: var(--color-primary);
  transition: color 0.15s ease;
}.zzjz-breadcrumbs a:hover {
  color: var(--color-primary-hover);
  text-decoration: underline;
}.wp-block-post-title {
  color: var(--color-ink) !important;
  font-size: clamp(1.8rem, 3vw + 1rem, 2.8rem) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}.zzjz-post-meta {
  display: flex !important;
  align-items: center !important;
  gap: 1rem !important;
  flex-wrap: wrap !important;
  padding: 0.75rem 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}.zzjz-post-meta .wp-block-post-date,
.zzjz-post-meta .wp-block-post-author {
  margin: 0 !important;
  font-size: 0.875rem;
  color: var(--color-muted);
}.zzjz-post-meta .zzjz-date {
  background: var(--color-primary);
  color: white;
  padding: 3px 9px;
  border-radius: var(--radius-sm);
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}.zzjz-featured-image {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}.zzjz-featured-image img {
  width: 100%;
  height: auto;
  display: block;
}.wp-block-post-content {
  line-height: 1.75;
  color: var(--color-ink);
}.wp-block-post-content h2 {
  margin-top: 2.5rem;
  margin-bottom: 1rem;
  padding-top: 1rem;
  border-top: 2px solid var(--color-border);
}.wp-block-post-content h3 {
  margin-top: 2rem;
  margin-bottom: 0.75rem;
}.wp-block-post-content p {
  margin-bottom: 1.5rem;
}.wp-block-post-content a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}.wp-block-post-content a:hover {
  color: var(--color-primary-hover);
}.wp-block-post-content ul,
.wp-block-post-content ol {
  margin: 1.5rem 0;
  padding-left: 1.5rem;
}.wp-block-post-content li {
  margin-bottom: 0.5rem;
}.wp-block-post-content blockquote {
  margin: 2rem 0;
  padding: 1.25rem 1.5rem;
  border-left: 4px solid var(--color-primary);
  background: var(--color-surface);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-style: italic;
  color: var(--color-muted);
}.wp-block-post-content img {
  margin: 2rem 0;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}.wp-block-post-content table {
  width: 100%;
  margin: 2rem 0;
  border-collapse: collapse;
}.wp-block-post-content table th {
  background: var(--color-primary);
  color: white;
  padding: 0.75rem 1rem;
  text-align: left;
  font-weight: 700;
}.wp-block-post-content table td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--color-border);
}.wp-block-post-content table tr:hover {
  background: var(--color-surface);
}.wp-block-post-content pre {
  background: #1a2332;
  color: #e8ecf1;
  padding: 1.5rem;
  border-radius: var(--radius-md);
  overflow-x: auto;
  margin: 2rem 0;
}.wp-block-post-content code {
  background: var(--color-surface);
  color: var(--color-accent);
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  font-size: 0.9em;
  font-family: "Courier New", monospace;
}.wp-block-post-content pre code {
  background: none;
  color: inherit;
  padding: 0;
}main.wp-block-group {
  background: transparent !important;
}.wp-block-group.has-background {
  background: transparent !important;
}body.page .zzjz-post-meta { display: none !important; }.zzjz-breadcrumbs {
  margin: 0 0 1.25rem;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.65);
}.zzjz-breadcrumbs a { color: rgba(255,255,255,0.8); }.zzjz-breadcrumbs a:hover { color: #fff; text-decoration: underline; }.zzjz-breadcrumbs .sep { opacity: 0.5; }.wp-block-post-content p { margin-bottom: 1rem; }.wp-block-post-content { font-style: normal; }.zzjz-cards-grid .wp-block-post-template {
  gap: 1.25rem;
}@media (max-width: 1200px) {
  .zzjz-cards-grid .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}@media (max-width: 700px) {
  .zzjz-cards-grid .wp-block-post-template { grid-template-columns: 1fr; }
}:root {
  --font-sans: Inter, "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-size-base: clamp(14px, 0.55vw + 11px, 15.5px);
}html { font-size: var(--font-size-base); }body {
  font-family: var(--font-sans);
  color: var(--color-ink);
  background: var(--color-bg) !important;
}.zzjz-cards-grid .zzjz-card,
.zzjz-cards-grid .is-style-card {
  height: auto;
  min-height: clamp(360px, 34vw, 430px);
}.zzjz-cards-grid .zzjz-card .wp-block-post-featured-image,
.zzjz-cards-grid .is-style-card .wp-block-post-featured-image {
  height: clamp(160px, 16vw, 220px);
}.zzjz-cards-grid .zzjz-card > .wp-block-group,
.zzjz-cards-grid .is-style-card > .wp-block-group {
  padding: 0.9rem 1rem 1rem !important;
  gap: 0.45rem !important;
}.zzjz-card .wp-block-post-title,
.is-style-card .wp-block-post-title,
.zzjz-cards-grid .wp-block-post-title {
  font-size: clamp(1rem, 0.55vw + 0.9rem, 1.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.015em !important;
  color: var(--color-ink) !important;
  margin: 0 !important;
}.zzjz-card .wp-block-post-title a,
.is-style-card .wp-block-post-title a,
.zzjz-cards-grid .wp-block-post-title a {
  color: var(--color-ink) !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-decoration: none;
}.zzjz-card .wp-block-post-excerpt,
.is-style-card .wp-block-post-excerpt {
  font-size: 0.92rem !important;
  line-height: 1.55 !important;
  color: var(--color-muted) !important;
}.zzjz-card .wp-block-post-excerpt p,
.is-style-card .wp-block-post-excerpt p {
  -webkit-line-clamp: 3 !important;
  line-clamp: 3;
}.zzjz-card .wp-block-post-date,
.zzjz-card .zzjz-date,
.is-style-card .wp-block-post-date,
.is-style-card .zzjz-date {
  font-size: 0.72rem !important;
}.zzjz-sidebar-widget h3,
.zzjz-sidebar-widget .widget-title,
.zzjz-sidebar h3 {
  font-size: 0.95rem !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em;
}body.page .wp-block-post-content,
body.single .wp-block-post-content, body.page .wp-block-post-content :is(p, li, td, th, blockquote),
body.single .wp-block-post-content :is(p, li, td, th, blockquote){
  color: var(--color-ink) !important;
}body.page .wp-block-post-content :is(h1,h2,h3,h4,h5,h6,.wp-block-heading),
body.single .wp-block-post-content :is(h1,h2,h3,h4,h5,h6,.wp-block-heading) {
  color: var(--color-ink) !important;
}.zzjz-breadcrumbs,
.zzjz-breadcrumbs a {
  color: var(--color-muted) !important;
}.zzjz-breadcrumbs a:hover {
  color: var(--color-primary) !important;
}body.archive main.wp-block-group,
body.blog main.wp-block-group,
body.search main.wp-block-group,
body.page.page-slug-novosti main.wp-block-group,
body.post-type-archive-post main.wp-block-group {
  background: transparent !important;
}body.archive .wp-block-query,
body.blog .wp-block-query,
body.search .wp-block-query {
  background: color-mix(in srgb, var(--color-surface) 78%, white 22%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: clamp(0.9rem, 1.8vw, 1.25rem);
  box-shadow: var(--shadow-sm);
}body.page .wp-block-post-content,
body.single .wp-block-post-content {
  background: color-mix(in srgb, var(--color-surface) 70%, white 30%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: clamp(1rem, 1.8vw, 1.5rem);
  box-shadow: var(--shadow-sm);
  max-width: min(1100px, 100%);
}body.page .wp-block-post-content pre,
body.single .wp-block-post-content pre {
  border: 1px solid rgba(255,255,255,0.06);
}body.page .wp-block-post-content table,
body.single .wp-block-post-content table {
  background: #fff;
  border-radius: var(--radius-md);
  overflow: hidden;
}@media (max-width: 900px) {
  .zzjz-card .wp-block-post-title,
  .is-style-card .wp-block-post-title,
  .zzjz-cards-grid .wp-block-post-title {
    font-size: clamp(1rem, 3.8vw, 1.2rem) !important;
  }

  .zzjz-card .wp-block-post-excerpt,
  .is-style-card .wp-block-post-excerpt {
    font-size: 0.88rem !important;
  }

  body.page .wp-block-post-content,
  body.single .wp-block-post-content {
    padding: 0.9rem !important;
    border-radius: var(--radius-md);
  }
}.zzjz-cards-grid,
.wp-block-query ul.wp-block-post-template.is-layout-grid,
.wp-block-post-template.is-layout-grid {
  align-items: stretch !important;
}.zzjz-cards-grid > * ,
.wp-block-post-template.is-layout-grid > li,
.wp-block-post-template.is-layout-grid > .wp-block-post {
  display: flex !important;
}.zzjz-card,
.is-style-card,
.wp-block-post-template.is-layout-grid > li > .wp-block-group,
.wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-group {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: clamp(320px, 28vw, 430px) !important; 
  height: 100% !important;
  box-sizing: border-box;
}.zzjz-card .wp-block-post-featured-image,
.is-style-card .wp-block-post-featured-image {
  margin-bottom: 0.75rem !important;
}.zzjz-card > .wp-block-group,
.is-style-card > .wp-block-group {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0;
}.zzjz-card .wp-block-post-title,
.is-style-card .wp-block-post-title {
  margin-bottom: 0.5rem !important;
}.zzjz-card .wp-block-post-title a,
.is-style-card .wp-block-post-title a {
  display: -webkit-box;
  -webkit-line-clamp: 3;        
  -webkit-box-orient: vertical;
  overflow: hidden;
}.zzjz-card .wp-block-post-excerpt p,
.is-style-card .wp-block-post-excerpt p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}.zzjz-card .wp-block-read-more,
.zzjz-card .read-more,
.is-style-card .wp-block-read-more,
.is-style-card .read-more,
.zzjz-card a[href*="novosti/"]:last-child,
.is-style-card a[href*="novosti/"]:last-child {
  margin-top: auto !important;
}body.single .wp-block-post-content img,
body.single .entry-content img,
body.page .wp-block-post-content img,
body.page .entry-content img {
  max-width: min(100%, 980px) !important;
  height: auto !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: var(--radius-md);
}body.single .wp-block-image,
body.page .wp-block-image {
  max-width: min(100%, 980px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}body.single .wp-block-post-featured-image,
body.single .post-thumbnail,
body.single .entry-thumbnail {
  max-width: min(100%, 1200px) !important;
  margin-inline: auto !important;
}body.single .wp-block-post-featured-image img,
body.single .post-thumbnail img,
body.single .entry-thumbnail img {
  width: 100% !important;
  height: auto !important;
  max-height: clamp(320px, 52vh, 620px) !important;
  object-fit: cover !important; 
  border-radius: var(--radius-lg);
}body.single .alignfull img,
body.page .alignfull img {
  width: 100% !important;
  max-width: min(100%, 1200px) !important;
  margin-inline: auto !important;
}body.single .wp-block-post-content,
body.page .wp-block-post-content {
  max-width: min(100%, 1100px) !important;
  margin-inline: auto !important;
}@media (max-width: 900px) {
  .zzjz-card,
  .is-style-card,
  .wp-block-post-template.is-layout-grid > li > .wp-block-group,
  .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-group {
    min-height: 220px !important;
  }

  body.single .wp-block-post-featured-image img,
  body.single .post-thumbnail img,
  body.single .entry-thumbnail img {
    max-height: 38vh !important;
  }
}body.single .wp-block-post-author,
body.single .wp-block-post-author-name,
body.single .wp-block-post-author-biography,
body.single .wp-block-post-author__content,
body.single .wp-block-post-author__name,
body.single .wp-block-post-author__bio,
body.single .entry-author,
body.single .post-author,
body.single .byline,
body.single .author-box {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}body.single .wp-block-post-content + p,
body.single .wp-block-post-content + .wp-block-group p {
  
}body.single :is(p, span, div, small) {
  
}body.single .comments-area,
body.single #comments,
body.single .comment-respond,
body.single .wp-block-post-comments,
body.single .wp-block-comments,
body.single .wp-block-comment-template,
body.single .wp-block-post-comments-form,
body.single .comment-list,
body.single .comments-title,
body.single .no-comments {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}body.single .wp-block-post-featured-image {
  margin-bottom: 1rem !important;
}body.single .wp-block-post-featured-image + * {
  margin-top: 0 !important;
}body.single .wp-block-post-featured-image + .wp-block-spacer,
body.single .wp-block-post-featured-image + .wp-block-group,
body.single .wp-block-post-featured-image + .wp-block-columns {
  margin-top: 0 !important;
  padding-top: 0 !important;
}body.single main .wp-block-post-content,
body.single article .wp-block-post-content,
body.single .entry-content {
  margin-top: 0 !important;
  padding-top: clamp(0.9rem, 1.6vw, 1.25rem) !important;
}body.single article .wp-block-group,
body.single main .wp-block-group {
  row-gap: normal;
}body.single article,
body.single main,
body.single .wp-site-blocks,
body.single .wp-block-post {
  --wp--style--block-gap: clamp(0.75rem, 1.2vw, 1rem) !important;
}body.single .wp-block-spacer {
  max-height: 1rem !important; 
}body.single .wp-block-post-featured-image + .wp-block-spacer {
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}body.single p:empty {
  display: none !important;
  margin: 0 !important;
}body.single .wp-block-post-content {
  margin-bottom: 0 !important;
}body.single article,
body.single .wp-block-post {
  padding-bottom: 0 !important;
}body.single .wp-block-post-title {
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin-bottom: 0.75rem;
}body.single .wp-block-post-content {
  max-width: 1100px;
  margin-inline: auto;
}body.single .wp-block-post-featured-image img {
  max-height: clamp(320px, 52vh, 620px);
  object-fit: cover;
}header,
.site-header,
.wp-block-template-part[aria-label*="Header"],
.wp-block-template-part[aria-label*="header"] {
  --wp--style--block-gap: initial !important;
}header .wp-block-group,
.site-header .wp-block-group,
.wp-block-template-part[aria-label*="Header"] .wp-block-group,
.wp-block-template-part[aria-label*="header"] .wp-block-group {
  row-gap: normal !important;
  column-gap: normal !important;
  margin-top: 0 !important;   
  margin-bottom: 0 !important;
}header nav,
.site-header nav,
header .wp-block-navigation,
.site-header .wp-block-navigation,
.wp-block-template-part[aria-label*="Header"] nav,
.wp-block-template-part[aria-label*="header"] nav {
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  min-height: auto !important;
}header .wp-block-navigation__container,
.site-header .wp-block-navigation__container {
  gap: 0.5rem !important; 
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}header .wp-block-navigation-item__content,
.site-header .wp-block-navigation-item__content,
header .wp-block-navigation a,
.site-header .wp-block-navigation a {
  line-height: 1.2 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  color: inherit !important; 
}header .wp-block-navigation__submenu-icon,
.site-header .wp-block-navigation__submenu-icon,
header .wp-block-navigation__submenu-container,
.site-header .wp-block-navigation__submenu-container {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}header .alignfull,
.site-header .alignfull {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}header .wp-block-navigation__responsive-container-open,
header .wp-block-navigation__responsive-container-close,
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close {
  margin: 0 !important;
  padding: 0.25rem !important;
  line-height: 1 !important;
}header .wp-block-navigation-item,
.site-header .wp-block-navigation-item {
  margin: 0 !important;
  padding: 0 !important;
}header .wp-block-navigation-item__label,
.site-header .wp-block-navigation-item__label {
  font-size: inherit !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  white-space: nowrap;
}header .wp-block-group.alignwide,
header .wp-block-group.alignfull,
header .wp-block-columns.alignwide,
header .wp-block-columns.alignfull,
.site-header .wp-block-group.alignwide,
.site-header .wp-block-group.alignfull,
.site-header .wp-block-columns.alignwide,
.site-header .wp-block-columns.alignfull {
  box-sizing: border-box;
}header .wp-block-columns,
.site-header .wp-block-columns {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important; 
  flex-wrap: nowrap !important;
  gap: 1rem !important;
  margin: 0 !important;
}header .wp-block-columns > .wp-block-column,
.site-header .wp-block-columns > .wp-block-column {
  margin: 0 !important;
  min-width: 0 !important;
}header .wp-block-columns > .wp-block-column:first-child,
.site-header .wp-block-columns > .wp-block-column:first-child {
  flex: 0 0 auto !important;
  width: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}header .wp-block-columns > .wp-block-column:last-child,
.site-header .wp-block-columns > .wp-block-column:last-child {
  flex: 1 1 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important; 
  text-align: left !important;
}header img.custom-logo,
header .custom-logo,
header .wp-block-site-logo img,
.site-header img.custom-logo,
.site-header .custom-logo,
.site-header .wp-block-site-logo img {
  display: block !important;
  max-height: 56px !important; 
  width: auto !important;
  margin: 0 !important;
}header .wp-block-site-logo,
.site-header .wp-block-site-logo {
  margin: 0 !important;
  padding: 0 !important;
  justify-self: auto !important;
}header .wp-block-site-title,
header .site-title,
header .wp-block-heading,
header p,
.site-header .wp-block-site-title,
.site-header .site-title,
.site-header .wp-block-heading,
.site-header p {
  margin: 0 !important;
  text-align: left !important;
}header .has-text-align-center,
.site-header .has-text-align-center {
  text-align: left !important;
}header > .wp-block-group:first-child,
.site-header > .wp-block-group:first-child {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}header .wp-block-navigation,
.site-header .wp-block-navigation {
  justify-content: initial !important;
}header .wp-block-columns > .wp-block-column:last-child > * ,
.site-header .wp-block-columns > .wp-block-column:last-child > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
  justify-content: flex-start !important;
}header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title),
header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title),
.site-header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title),
.site-header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important; 
  flex-wrap: nowrap !important;
  gap: 14px !important;
  margin: 0 !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title) > *,
header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) > *,
.site-header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title) > *,
.site-header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) > * {
  margin: 0 !important;
  min-width: 0 !important;
}header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-logo,
header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-logo,
.site-header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-logo,
.site-header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-logo {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}header .wp-block-site-logo img,
.site-header .wp-block-site-logo img,
header img.custom-logo,
.site-header img.custom-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-height: 52px !important; 
  margin: 0 !important;
}header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-title,
header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-title,
.site-header .wp-block-group:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-title,
.site-header .wp-block-columns:has(.wp-block-site-logo):has(.wp-block-site-title) .wp-block-site-title {
  flex: 0 1 auto !important;             
  margin: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
}header .wp-block-site-title,
header .wp-block-site-title a,
.site-header .wp-block-site-title,
.site-header .wp-block-site-title a {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  white-space: nowrap;
}header .wp-block-group:has(.wp-block-site-logo) p,
header .wp-block-group:has(.wp-block-site-logo) .wp-block-heading,
header .wp-block-columns:has(.wp-block-site-logo) p,
header .wp-block-columns:has(.wp-block-site-logo) .wp-block-heading,
.site-header .wp-block-group:has(.wp-block-site-logo) p,
.site-header .wp-block-group:has(.wp-block-site-logo) .wp-block-heading,
.site-header .wp-block-columns:has(.wp-block-site-logo) p,
.site-header .wp-block-columns:has(.wp-block-site-logo) .wp-block-heading {
  margin: 0 !important;
  text-align: left !important;
}header .wp-block-navigation,
.site-header .wp-block-navigation {
  all: unset; 
  display: revert;
}header.zzjz-header .zzjz-topbar {
  padding-block: 0 !important; 
}header.zzjz-header .zzjz-topbar-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important; 
  gap: 14px !important;
  flex-wrap: nowrap !important;

  
  width: var(--content-width, 1200px) !important;
  max-width: var(--content-max, 1700px) !important;
  margin-inline: auto !important;
  padding-inline: clamp(1rem, 2.5vw, 2rem) !important;

  
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}header.zzjz-header .zzjz-topbar-inner > * {
  margin: 0 !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
}header.zzjz-header .zzjz-topbar-inner .wp-block-site-logo,
header.zzjz-header .zzjz-topbar-inner .custom-logo-link {
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}header.zzjz-header .zzjz-topbar-inner .wp-block-site-logo img,
header.zzjz-header .zzjz-topbar-inner img.custom-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-height: 52px !important; 
  margin: 0 !important;
}header.zzjz-header .zzjz-topbar-inner .wp-block-site-title,
header.zzjz-header .zzjz-topbar-inner .site-title {
  margin: 0 !important;
  flex: 0 1 auto !important;
  text-align: left !important;
  justify-content: flex-start !important;
}header.zzjz-header .zzjz-topbar-inner .wp-block-site-title a,
header.zzjz-header .zzjz-topbar-inner .site-title a {
  display: inline-block !important;
  margin: 0 !important;
  white-space: nowrap;
  text-align: left !important;
}header.zzjz-header .zzjz-topbar-inner p,
header.zzjz-header .zzjz-topbar-inner .wp-block-heading {
  margin: 0 !important;
  text-align: left !important;
}header.zzjz-header .zzjz-topbar-inner.is-content-justification-left {
  justify-content: flex-start !important;
}header.zzjz-header .zzjz-topbar-inner > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}header.zzjz-header .zzjz-topbar-inner .wp-block-site-logo + * {
  margin-left: 8px !important;
}


/* ==========================================================
   ZZJZ HNK Homepage (v2)
   Brand-centered redesign around #0047ab
   Scope: .zzjz-home-hzjz
   Footer intentionally untouched
   ========================================================== */

.zzjz-home-hzjz {
  --zz-primary: #0047ab;
  --zz-primary-2: #0b5fd6;
  --zz-primary-3: #2f7ff0;
  --zz-primary-soft: rgba(0, 71, 171, 0.14);
  --zz-primary-soft-2: rgba(47, 127, 240, 0.12);

  --zz-bg: #061327;
  --zz-bg-2: #091a34;
  --zz-surface: #0d213f;
  --zz-surface-2: #10284b;
  --zz-surface-3: #142f58;

  --zz-text: #eaf2ff;
  --zz-text-soft: #b7c8ea;
  --zz-text-muted: #8ea6cf;

  --zz-border: rgba(99, 146, 223, 0.22);
  --zz-border-strong: rgba(99, 146, 223, 0.35);

  --zz-danger: #ff3b3b;
  --zz-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  --zz-radius: 14px;
  --zz-radius-sm: 10px;

  background:
    radial-gradient(1200px 500px at 0% -5%, rgba(11, 95, 214, 0.12), transparent 60%),
    radial-gradient(1000px 450px at 100% 0%, rgba(47, 127, 240, 0.09), transparent 60%),
    linear-gradient(180deg, #061327 0%, #07162c 35%, #07162c 100%);
  color: var(--zz-text);
  padding-top: 1rem;
  padding-bottom: 2rem;
}

/* Keep homepage width comfortable */
.zzjz-home-hzjz.wp-block-group {
  max-width: 1320px;
}

/* Reset any inherited "light HZJZ" styles if present */
.zzjz-home-hzjz .zzjz-hz-section,
.zzjz-home-hzjz .zzjz-hz-aktualnosti,
.zzjz-home-hzjz .zzjz-hz-djelatnosti {
  background: transparent;
}

/* ==========================================================
   HERO (split layout)
   ========================================================== */
.zzjz-home-hzjz .zzjz-hz-hero-wrap {
  gap: 0 !important;
  margin: 0 0 1.1rem;
  background: transparent;
  align-items: stretch;
}

.zzjz-home-hzjz .zzjz-hz-hero-main,
.zzjz-home-hzjz .zzjz-hz-hero-side {
  min-height: 460px;
}

/* Left hero */
.zzjz-home-hzjz .zzjz-hz-hero-main {
  position: relative;
  overflow: hidden;
  border-radius: 16px 0 0 16px;
  border: 1px solid var(--zz-border);
  border-right: 0;
  box-shadow: var(--zz-shadow);
}

/* Make shortcode output fill space */
.zzjz-home-hzjz .zzjz-hz-hero-main > * {
  height: 100%;
}

/* Common slider wrappers */
.zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-carousel,
.zzjz-home-hzjz .zzjz-hz-hero-main .swiper,
.zzjz-home-hzjz .zzjz-hz-hero-main .slick-slider {
  height: 100%;
}

.zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-slide,
.zzjz-home-hzjz .zzjz-hz-hero-main .swiper-slide,
.zzjz-home-hzjz .zzjz-hz-hero-main .slick-slide {
  min-height: 460px;
  position: relative;
}

/* Hero overlay gradient for readability */
.zzjz-home-hzjz .zzjz-hz-hero-main::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(4, 13, 28, 0.72) 0%, rgba(4, 13, 28, 0.52) 38%, rgba(4, 13, 28, 0.15) 72%, rgba(4, 13, 28, 0.10) 100%),
    linear-gradient(180deg, rgba(4, 13, 28, 0.05) 0%, rgba(4, 13, 28, 0.35) 100%);
}

/* Try to catch common hero content wrappers */
.zzjz-home-hzjz .zzjz-hz-hero-main .hero-caption,
.zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-content,
.zzjz-home-hzjz .zzjz-hz-hero-main .slide-content,
.zzjz-home-hzjz .zzjz-hz-hero-main .carousel-caption {
  position: absolute;
  z-index: 2;
  left: 28px;
  bottom: 28px;
  max-width: min(560px, 62%);
  color: #fff;
}

.zzjz-home-hzjz .zzjz-hz-hero-main .hero-caption h2,
.zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-content h2,
.zzjz-home-hzjz .zzjz-hz-hero-main .slide-content h2,
.zzjz-home-hzjz .zzjz-hz-hero-main .carousel-caption h2 {
  margin: 0 0 0.7rem;
  color: #fff;
  font-size: clamp(1.6rem, 2.2vw, 2.45rem);
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.zzjz-home-hzjz .zzjz-hz-hero-main .hero-caption p,
.zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-content p,
.zzjz-home-hzjz .zzjz-hz-hero-main .slide-content p,
.zzjz-home-hzjz .zzjz-hz-hero-main .carousel-caption p {
  margin: 0 0 1rem;
  color: rgba(255, 255, 255, 0.88);
  font-size: 0.98rem;
  line-height: 1.45;
}

.zzjz-home-hzjz .zzjz-hz-hero-main .hero-caption a,
.zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-content a,
.zzjz-home-hzjz .zzjz-hz-hero-main .slide-content a,
.zzjz-home-hzjz .zzjz-hz-hero-main .carousel-caption a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  background: linear-gradient(180deg, var(--zz-primary-3), var(--zz-primary));
  color: #fff;
  text-decoration: none;
  padding: 0.78rem 1.1rem;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  font-weight: 700;
  box-shadow: 0 8px 20px rgba(0, 71, 171, 0.35);
}

/* Right hero panel */
.zzjz-home-hzjz .zzjz-hz-hero-side {
  border-radius: 0 16px 16px 0;
  background: linear-gradient(180deg, rgba(11, 95, 214, 0.22), rgba(0, 71, 171, 0.12));
  border: 1px solid var(--zz-border);
  border-left: 1px solid rgba(99, 146, 223, 0.16);
  box-shadow: var(--zz-shadow);
  overflow: hidden;
}

.zzjz-home-hzjz .zzjz-hz-side-panel {
  height: 100%;
  padding: 18px;
  background:
    linear-gradient(180deg, rgba(16, 40, 75, 0.92), rgba(13, 33, 63, 0.94));
  backdrop-filter: blur(4px);
}

.zzjz-home-hzjz .zzjz-hz-side-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.zzjz-home-hzjz .zzjz-hz-side-links li {
  margin: 0;
}

.zzjz-home-hzjz .zzjz-hz-side-links a {
  display: block;
  position: relative;
  padding: 14px 14px 14px 34px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid transparent;
  color: var(--zz-text);
  text-decoration: none;
  font-weight: 700;
  line-height: 1.25;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

.zzjz-home-hzjz .zzjz-hz-side-links a::before {
  content: "›";
  position: absolute;
  left: 12px;
  top: 12px;
  color: #9dc5ff;
  font-size: 1.25rem;
  line-height: 1;
}

.zzjz-home-hzjz .zzjz-hz-side-links a:hover {
  background: rgba(0, 71, 171, 0.18);
  border-color: rgba(47, 127, 240, 0.28);
  transform: translateY(-1px);
}

/* ==========================================================
   SECTION HEADERS / CTA / TABS
   ========================================================== */
.zzjz-home-hzjz .zzjz-hz-section {
  margin: 0 0 1.6rem;
}

.zzjz-home-hzjz .zzjz-hz-section-head,
.zzjz-home-hzjz .zzjz-hz-subhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.95rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--zz-border);
}

.zzjz-home-hzjz .zzjz-hz-section-head h2,
.zzjz-home-hzjz .zzjz-hz-subhead h2 {
  margin: 0;
  color: #dbe9ff;
  font-size: clamp(1.15rem, 1.7vw, 1.65rem);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -0.02em;
  position: relative;
  padding-left: 14px;
}

.zzjz-home-hzjz .zzjz-hz-section-head h2::before,
.zzjz-home-hzjz .zzjz-hz-subhead h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.12em;
  width: 4px;
  height: 0.95em;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--zz-primary-3), var(--zz-primary));
  box-shadow: 0 0 0 1px rgba(47, 127, 240, 0.18);
}

/* Tabs */
.zzjz-home-hzjz .zzjz-hz-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.zzjz-home-hzjz .zzjz-hz-tabs a {
  color: var(--zz-text-soft);
  text-decoration: none;
  font-size: 0.92rem;
  line-height: 1;
  padding: 0.5rem 0.75rem;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  transition: all .18s ease;
}

.zzjz-home-hzjz .zzjz-hz-tabs a:hover {
  color: #eaf2ff;
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(99, 146, 223, 0.16);
}

.zzjz-home-hzjz .zzjz-hz-tabs a.is-active {
  color: #fff;
  background: rgba(0, 71, 171, 0.24);
  border-color: rgba(47, 127, 240, 0.28);
  box-shadow: inset 0 0 0 1px rgba(47, 127, 240, 0.08);
}

/* CTA */
.zzjz-home-hzjz .zzjz-hz-section-cta {
  margin-top: 0.9rem;
  text-align: right;
}

.zzjz-home-hzjz .zzjz-hz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0.65rem 1rem;
  border-radius: 10px;
  text-decoration: none;
  color: #fff;
  font-weight: 700;
  line-height: 1;
  border: 1px solid rgba(47, 127, 240, 0.28);
  background: linear-gradient(180deg, var(--zz-primary-2), var(--zz-primary));
  box-shadow: 0 8px 20px rgba(0, 71, 171, 0.28);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.zzjz-home-hzjz .zzjz-hz-btn:hover {
  color: #fff;
  transform: translateY(-1px);
  filter: brightness(1.04);
  box-shadow: 0 12px 26px rgba(0, 71, 171, 0.32);
}

/* ==========================================================
   AKTUALNOSTI PANEL
   ========================================================== */
.zzjz-home-hzjz .zzjz-hz-aktualnosti {
  background:
    linear-gradient(180deg, rgba(14, 33, 63, 0.96), rgba(11, 26, 49, 0.96));
  border: 1px solid var(--zz-border);
  border-radius: 16px;
  box-shadow: var(--zz-shadow);
  padding: 1rem;
}

/* Top tiles */
.zzjz-home-hzjz .zzjz-hz-akt-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9rem;
  margin-bottom: 1rem;
}

.zzjz-home-hzjz .zzjz-hz-tile {
  display: block;
  text-decoration: none;
  color: var(--zz-text);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--zz-border);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.zzjz-home-hzjz .zzjz-hz-tile:hover {
  transform: translateY(-2px);
  border-color: var(--zz-border-strong);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.18);
}

.zzjz-home-hzjz .zzjz-hz-tile-media {
  display: block;
  aspect-ratio: 16 / 10;
  background: #0c1f3a;
  overflow: hidden;
  position: relative;
}

.zzjz-home-hzjz .zzjz-hz-tile-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.18) 100%);
  pointer-events: none;
}

.zzjz-home-hzjz .zzjz-hz-tile-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.zzjz-home-hzjz .zzjz-hz-tile-title {
  display: block;
  padding: 0.75rem 0.8rem 0.85rem;
  color: #dfeaff;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.25;
}

/* Dynamic news row */
.zzjz-home-hzjz .zzjz-hz-news-list {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9rem;
}

.zzjz-home-hzjz .zzjz-hz-news-list .wp-block-post-template {
  display: contents;
}

.zzjz-home-hzjz .zzjz-hz-news-item {
  padding: 0.85rem 0.9rem;
  border-radius: 12px;
  border: 1px solid rgba(99, 146, 223, 0.12);
  background: rgba(255,255,255,0.015);
  min-height: 180px;
}

.zzjz-home-hzjz .zzjz-hz-news-item h3 {
  margin: 0 0 0.45rem;
  font-size: 0.98rem;
  line-height: 1.28;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.zzjz-home-hzjz .zzjz-hz-news-item h3 a {
  color: #dbe9ff;
  text-decoration: none;
}

.zzjz-home-hzjz .zzjz-hz-news-item h3 a:hover {
  color: #ffffff;
}

.zzjz-home-hzjz .zzjz-hz-news-item .wp-block-post-excerpt,
.zzjz-home-hzjz .zzjz-hz-news-item .wp-block-post-excerpt p {
  margin: 0 0 0.55rem;
  color: var(--zz-text-soft);
  font-size: 0.9rem;
  line-height: 1.45;
}

.zzjz-home-hzjz .zzjz-hz-news-date {
  color: #8fbaff;
  font-weight: 700;
  font-size: 0.84rem;
  text-transform: none;
}

/* ==========================================================
   PROGRAM / PROJECT LOGO GRIDS
   ========================================================== */
.zzjz-home-hzjz .zzjz-hz-logo-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.8rem;
}

.zzjz-home-hzjz .zzjz-hz-logo-grid a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 108px;
  padding: 0.85rem;
  border-radius: 12px;
  border: 1px solid var(--zz-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}

.zzjz-home-hzjz .zzjz-hz-logo-grid a:hover {
  transform: translateY(-2px);
  border-color: var(--zz-border-strong);
  background: rgba(0, 71, 171, 0.08);
}

.zzjz-home-hzjz .zzjz-hz-logo-grid img {
  max-width: 100%;
  max-height: 62px;
  object-fit: contain;
  display: block;
  filter: saturate(1.02) contrast(1.02);
}

/* ==========================================================
   DOGAĐANJA
   ========================================================== */
.zzjz-home-hzjz .zzjz-hz-events {
  background:
    linear-gradient(180deg, rgba(14, 33, 63, 0.9), rgba(11, 26, 49, 0.9));
  border: 1px solid var(--zz-border);
  border-radius: 16px;
  box-shadow: var(--zz-shadow);
  padding: 1rem;
}

.zzjz-home-hzjz .zzjz-hz-events-list .wp-block-post-template {
  margin: 0;
  padding: 0;
  list-style: none;
}

.zzjz-home-hzjz .zzjz-hz-event-item {
  margin: 0 0 0.75rem;
  padding: 0.85rem 0.95rem;
  border-radius: 12px;
  border: 1px solid rgba(99, 146, 223, 0.12);
  background: rgba(255,255,255,0.015);
}

.zzjz-home-hzjz .zzjz-hz-event-item:last-child {
  margin-bottom: 0;
}

.zzjz-home-hzjz .zzjz-hz-event-item h3 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
  line-height: 1.28;
  font-weight: 700;
}

.zzjz-home-hzjz .zzjz-hz-event-item h3 a {
  color: #dbe9ff;
  text-decoration: none;
}

.zzjz-home-hzjz .zzjz-hz-event-item h3 a:hover {
  color: #fff;
}

.zzjz-home-hzjz .zzjz-hz-event-date {
  color: var(--zz-text-muted);
  font-size: 0.9rem;
}

/* ==========================================================
   DJELATNOSTI (main directory block)
   ========================================================== */
.zzjz-home-hzjz .zzjz-hz-djelatnosti {
  background:
    linear-gradient(180deg, rgba(12, 31, 58, 0.96), rgba(10, 25, 47, 0.96));
  border: 1px solid var(--zz-border);
  border-radius: 16px;
  box-shadow: var(--zz-shadow);
  padding: 1rem;
}

.zzjz-home-hzjz .zzjz-hz-services-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.zzjz-home-hzjz .zzjz-hz-service-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.zzjz-home-hzjz .zzjz-hz-service-box {
  border: 1px solid rgba(99, 146, 223, 0.12);
  border-radius: 12px;
  background: rgba(255,255,255,0.015);
  padding: 0.9rem 0.95rem;
  min-height: 150px;
}

.zzjz-home-hzjz .zzjz-hz-service-box h3 {
  margin: 0 0 0.55rem;
  color: #e2ecff;
  font-size: 1rem;
  line-height: 1.22;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.zzjz-home-hzjz .zzjz-hz-service-box ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.zzjz-home-hzjz .zzjz-hz-service-box li {
  margin: 0 0 0.28rem;
  line-height: 1.3;
}

.zzjz-home-hzjz .zzjz-hz-service-box li:last-child {
  margin-bottom: 0;
}

.zzjz-home-hzjz .zzjz-hz-service-box a {
  color: var(--zz-text-soft);
  text-decoration: none;
  font-size: 0.9rem;
}

.zzjz-home-hzjz .zzjz-hz-service-box a:hover {
  color: #ffffff;
}

/* ==========================================================
   Kill old homepage dark sidebar widgets if they still render
   ========================================================== */
.zzjz-home-hzjz .zzjz-sidebar,
.zzjz-home-hzjz .zzjz-tip-box,
.zzjz-home-hzjz .zzjz-sidebar-widget {
  display: none !important;
}

/* ==========================================================
   Optional: style quick-links strip if present in hero template
   ========================================================== */
.zzjz-home-hzjz .zzjz-hero-quicklinks {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.65rem;
}

.zzjz-home-hzjz .zzjz-hero-quicklinks a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 46px;
  padding: 0.5rem 0.75rem;
  border-radius: 12px;
  border: 1px solid var(--zz-border);
  background: rgba(255,255,255,0.02);
  color: var(--zz-text);
  text-decoration: none;
  font-weight: 700;
  font-size: 0.9rem;
}

.zzjz-home-hzjz .zzjz-hero-quicklinks a:hover {
  background: rgba(0, 71, 171, 0.16);
  border-color: rgba(47, 127, 240, 0.28);
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 1200px) {
  .zzjz-home-hzjz.wp-block-group {
    max-width: 1140px;
  }

  .zzjz-home-hzjz .zzjz-hz-akt-grid,
  .zzjz-home-hzjz .zzjz-hz-news-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .zzjz-home-hzjz .zzjz-hz-logo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .zzjz-home-hzjz .zzjz-hz-services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .zzjz-home-hzjz .zzjz-hero-quicklinks {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .zzjz-home-hzjz {
    padding-top: 0.75rem;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-wrap {
    display: block;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-main {
    border-radius: 16px 16px 0 0;
    border-right: 1px solid var(--zz-border);
    border-bottom: 0;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-side {
    border-radius: 0 0 16px 16px;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-main,
  .zzjz-home-hzjz .zzjz-hz-hero-side {
    min-height: auto;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-slide,
  .zzjz-home-hzjz .zzjz-hz-hero-main .swiper-slide,
  .zzjz-home-hzjz .zzjz-hz-hero-main .slick-slide {
    min-height: 330px;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-main .hero-caption,
  .zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-content,
  .zzjz-home-hzjz .zzjz-hz-hero-main .slide-content,
  .zzjz-home-hzjz .zzjz-hz-hero-main .carousel-caption {
    left: 14px;
    right: 14px;
    bottom: 14px;
    max-width: none;
  }

  .zzjz-home-hzjz .zzjz-hz-hero-main .hero-caption p,
  .zzjz-home-hzjz .zzjz-hz-hero-main .zzjz-hero-content p,
  .zzjz-home-hzjz .zzjz-hz-hero-main .slide-content p,
  .zzjz-home-hzjz .zzjz-hz-hero-main .carousel-caption p {
    display: none;
  }

  .zzjz-home-hzjz .zzjz-hz-akt-grid,
  .zzjz-home-hzjz .zzjz-hz-news-list,
  .zzjz-home-hzjz .zzjz-hz-logo-grid,
  .zzjz-home-hzjz .zzjz-hz-services-grid {
    grid-template-columns: 1fr;
  }

  .zzjz-home-hzjz .zzjz-hz-section-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .zzjz-home-hzjz .zzjz-hz-tabs {
    width: 100%;
  }

  .zzjz-home-hzjz .zzjz-hz-section-cta {
    text-align: left;
  }

  .zzjz-home-hzjz .zzjz-hero-quicklinks {
    grid-template-columns: 1fr;
  }
}
/* ==========================================================
   ZZJZ Homepage v3 — STABILIZED LAYOUT + CLEAN BRAND LOOK
   Brand: #0047ab
   Footer untouched
   ========================================================== */

.zzjz-home-v3 {
  --zz-primary: #0047ab;
  --zz-primary-2: #1565d8;
  --zz-primary-3: #3b82f6;

  --zz-bg: #071529;
  --zz-bg-2: #0a1b34;
  --zz-surface: #0f2343;
  --zz-surface-2: #132a4f;

  --zz-text: #e8f0ff;
  --zz-text-soft: #bfd0ef;
  --zz-muted: #94add6;

  --zz-border: rgba(103, 150, 230, 0.22);
  --zz-border-strong: rgba(103, 150, 230, 0.35);

  --zz-shadow: 0 10px 28px rgba(0, 0, 0, 0.25);
  --zz-radius: 14px;

  background:
    radial-gradient(1100px 450px at 0% 0%, rgba(0, 71, 171, 0.14), transparent 60%),
    radial-gradient(900px 400px at 100% 5%, rgba(59, 130, 246, 0.10), transparent 60%),
    linear-gradient(180deg, #061327 0%, #071529 40%, #071529 100%);
  color: var(--zz-text);
  padding: 20px 0 32px;
}

/* Force a sane content width regardless of theme.json constraints */
.zzjz-home-v3.wp-block-group {
  width: min(1320px, calc(100% - 32px));
  margin-left: auto;
  margin-right: auto;
  max-width: none !important;
}

/* Critical: prevent WP blocks from causing width collapse */
.zzjz-home-v3 *,
.zzjz-home-v3 *::before,
.zzjz-home-v3 *::after {
  box-sizing: border-box;
}

.zzjz-home-v3 .wp-block-columns,
.zzjz-home-v3 .wp-block-column,
.zzjz-home-v3 .wp-block-group,
.zzjz-home-v3 .wp-block-query,
.zzjz-home-v3 .wp-block-post-template,
.zzjz-home-v3 .wp-block-post {
  min-width: 0;
}

/* Prevent pathological word/letter wrapping */
.zzjz-home-v3 h1,
.zzjz-home-v3 h2,
.zzjz-home-v3 h3,
.zzjz-home-v3 h4,
.zzjz-home-v3 p,
.zzjz-home-v3 a,
.zzjz-home-v3 li,
.zzjz-home-v3 span {
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: none;
}

/* ==========================================================
   Generic card/panel
   ========================================================== */
.zzjz-home-v3 .zz-panel {
  background: linear-gradient(180deg, rgba(15, 35, 67, 0.98), rgba(11, 27, 51, 0.98));
  border: 1px solid var(--zz-border);
  border-radius: 16px;
  box-shadow: var(--zz-shadow);
}

.zzjz-home-v3 .zz-section {
  margin: 0 0 22px;
}

.zzjz-home-v3 .zz-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 0 2px 10px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--zz-border);
}

.zzjz-home-v3 .zz-section-head h2 {
  margin: 0;
  color: #e7efff;
  font-size: clamp(1.2rem, 1.5vw, 1.75rem);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -0.02em;
  position: relative;
  padding-left: 14px;
}

.zzjz-home-v3 .zz-section-head h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.14em;
  width: 4px;
  height: 0.9em;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--zz-primary-3), var(--zz-primary));
}

.zzjz-home-v3 .zz-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.zzjz-home-v3 .zz-tabs a {
  color: var(--zz-text-soft);
  text-decoration: none;
  padding: 8px 12px;
  line-height: 1;
  font-size: 0.92rem;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
}

.zzjz-home-v3 .zz-tabs a:hover,
.zzjz-home-v3 .zz-tabs a.is-active {
  color: #fff;
  background: rgba(0, 71, 171, 0.22);
  border-color: rgba(59, 130, 246, 0.25);
}

.zzjz-home-v3 .zz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(59, 130, 246, 0.25);
  background: linear-gradient(180deg, var(--zz-primary-2), var(--zz-primary));
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(0, 71, 171, 0.28);
}

/* ==========================================================
   HERO (stable split)
   IMPORTANT: uses CSS grid, not flex, to prevent collapse
   ========================================================== */
.zzjz-home-v3 .zz-hero {
  display: grid;
  grid-template-columns: minmax(0, 2.1fr) minmax(300px, 0.9fr);
  gap: 0;
  margin-bottom: 18px;
  align-items: stretch;
}

.zzjz-home-v3 .zz-hero-main,
.zzjz-home-v3 .zz-hero-side {
  min-width: 0;
}

.zzjz-home-v3 .zz-hero-main {
  position: relative;
  min-height: 430px;
  overflow: hidden;
  border-radius: 16px 0 0 16px;
  border: 1px solid var(--zz-border);
  border-right: 0;
  background: #0c1f3d;
  box-shadow: var(--zz-shadow);
}

/* Make existing shortcode slider fill area without breaking */
.zzjz-home-v3 .zz-hero-main > * {
  height: 100%;
}

.zzjz-home-v3 .zz-hero-main .zzjz-hero-carousel,
.zzjz-home-v3 .zz-hero-main .swiper,
.zzjz-home-v3 .zz-hero-main .slick-slider,
.zzjz-home-v3 .zz-hero-main .carousel {
  height: 100%;
}

.zzjz-home-v3 .zz-hero-main .swiper-wrapper,
.zzjz-home-v3 .zz-hero-main .slick-list,
.zzjz-home-v3 .zz-hero-main .slick-track {
  height: 100%;
}

.zzjz-home-v3 .zz-hero-main .swiper-slide,
.zzjz-home-v3 .zz-hero-main .slick-slide,
.zzjz-home-v3 .zz-hero-main .zzjz-hero-slide {
  min-height: 430px;
  height: 100%;
  position: relative;
}

/* Force hero images to behave */
.zzjz-home-v3 .zz-hero-main img,
.zzjz-home-v3 .zz-hero-main .wp-post-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Overlay */
.zzjz-home-v3 .zz-hero-main::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5, 14, 30, 0.75) 0%, rgba(5, 14, 30, 0.55) 36%, rgba(5, 14, 30, 0.18) 72%, rgba(5, 14, 30, 0.08) 100%),
    linear-gradient(180deg, rgba(5, 14, 30, 0.08) 0%, rgba(5, 14, 30, 0.38) 100%);
}

/* Try to target common caption wrappers */
.zzjz-home-v3 .zz-hero-main .hero-caption,
.zzjz-home-v3 .zz-hero-main .zzjz-hero-content,
.zzjz-home-v3 .zz-hero-main .slide-content,
.zzjz-home-v3 .zz-hero-main .carousel-caption {
  position: absolute;
  left: 26px;
  right: auto;
  bottom: 26px;
  z-index: 2;
  max-width: min(560px, 70%);
  color: #fff;
}

.zzjz-home-v3 .zz-hero-main .hero-caption h2,
.zzjz-home-v3 .zz-hero-main .zzjz-hero-content h2,
.zzjz-home-v3 .zz-hero-main .slide-content h2,
.zzjz-home-v3 .zz-hero-main .carousel-caption h2 {
  margin: 0 0 10px;
  color: #fff;
  font-size: clamp(1.6rem, 2vw, 2.4rem);
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.zzjz-home-v3 .zz-hero-main .hero-caption p,
.zzjz-home-v3 .zz-hero-main .zzjz-hero-content p,
.zzjz-home-v3 .zz-hero-main .slide-content p,
.zzjz-home-v3 .zz-hero-main .carousel-caption p {
  margin: 0 0 12px;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.45;
}

.zzjz-home-v3 .zz-hero-main .hero-caption a,
.zzjz-home-v3 .zz-hero-main .zzjz-hero-content a,
.zzjz-home-v3 .zz-hero-main .slide-content a,
.zzjz-home-v3 .zz-hero-main .carousel-caption a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 14px;
  border-radius: 10px;
  text-decoration: none;
  color: #fff;
  font-weight: 700;
  background: linear-gradient(180deg, var(--zz-primary-2), var(--zz-primary));
  border: 1px solid rgba(255, 255, 255, 0.16);
}

/* Right side quick panel */
.zzjz-home-v3 .zz-hero-side {
  border-radius: 0 16px 16px 0;
  border: 1px solid var(--zz-border);
  background: linear-gradient(180deg, rgba(19, 42, 79, 0.98), rgba(14, 33, 63, 0.98));
  box-shadow: var(--zz-shadow);
  overflow: hidden;
}

.zzjz-home-v3 .zz-hero-side-inner {
  height: 100%;
  padding: 14px;
}

.zzjz-home-v3 .zz-hero-side ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.zzjz-home-v3 .zz-hero-side li {
  margin: 0;
}

.zzjz-home-v3 .zz-hero-side a {
  display: block;
  min-width: 0;
  padding: 12px 12px 12px 30px;
  position: relative;
  border-radius: 10px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.03);
  color: var(--zz-text);
  text-decoration: none;
  font-weight: 700;
  line-height: 1.3;
  white-space: normal;
}

.zzjz-home-v3 .zz-hero-side a::before {
  content: "›";
  position: absolute;
  left: 10px;
  top: 10px;
  color: #9dc5ff;
  font-size: 1.15rem;
  line-height: 1;
}

.zzjz-home-v3 .zz-hero-side a:hover {
  background: rgba(0, 71, 171, 0.16);
  border-color: rgba(59, 130, 246, 0.22);
}

/* ==========================================================
   AKTUALNOSTI
   ========================================================== */
.zzjz-home-v3 .zz-aktualnosti {
  padding: 14px;
  margin-bottom: 22px;
}

.zzjz-home-v3 .zz-akt-tiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.zzjz-home-v3 .zz-tile {
  display: block;
  color: var(--zz-text);
  text-decoration: none;
  border: 1px solid var(--zz-border);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,0.015);
  min-width: 0;
}

.zzjz-home-v3 .zz-tile:hover {
  border-color: var(--zz-border-strong);
  background: rgba(0, 71, 171, 0.06);
}

.zzjz-home-v3 .zz-tile-media {
  aspect-ratio: 16 / 9;
  background: #0b1c35;
  overflow: hidden;
}

.zzjz-home-v3 .zz-tile-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Hide broken image icon if placeholder src missing */
.zzjz-home-v3 .zz-tile-media img[src=""],
.zzjz-home-v3 .zz-tile-media img:not([src]) {
  display: none;
}

.zzjz-home-v3 .zz-tile-title {
  display: block;
  padding: 10px 12px 12px;
  font-weight: 700;
  line-height: 1.3;
  color: #dce9ff;
  white-space: normal;
}

/* Query cards */
.zzjz-home-v3 .zz-news-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.zzjz-home-v3 .zz-news-grid .wp-block-post-template {
  display: contents;
}

.zzjz-home-v3 .zz-news-card {
  min-width: 0;
  border: 1px solid rgba(103, 150, 230, 0.14);
  border-radius: 12px;
  background: rgba(255,255,255,0.015);
  padding: 12px;
  min-height: 190px;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-featured-image {
  margin: -12px -12px 10px;
  border-radius: 12px 12px 0 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #0b1c35;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-title {
  margin: 0 0 8px;
  line-height: 1.22;
  font-size: 1rem;
  font-weight: 800;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-title a {
  color: #e0ebff;
  text-decoration: none;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-title a:hover {
  color: #fff;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-excerpt,
.zzjz-home-v3 .zz-news-card .wp-block-post-excerpt p {
  margin: 0 0 8px;
  color: var(--zz-text-soft);
  font-size: 0.92rem;
  line-height: 1.45;
}

.zzjz-home-v3 .zz-news-card .wp-block-post-date {
  display: inline-flex;
  color: #8fbaff;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.2;
}

/* ==========================================================
   LOGO GRIDS
   ========================================================== */
.zzjz-home-v3 .zz-logo-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.zzjz-home-v3 .zz-logo-grid a {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 106px;
  border: 1px solid var(--zz-border);
  border-radius: 12px;
  background: rgba(255,255,255,0.015);
  text-decoration: none;
  padding: 10px;
}

.zzjz-home-v3 .zz-logo-grid a:hover {
  border-color: var(--zz-border-strong);
  background: rgba(0, 71, 171, 0.06);
}

.zzjz-home-v3 .zz-logo-grid img {
  max-width: 100%;
  max-height: 58px;
  object-fit: contain;
  display: block;
}

/* ==========================================================
   DOGAĐANJA
   ========================================================== */
.zzjz-home-v3 .zz-events {
  padding: 14px;
  margin: 0 auto 22px;
  width: min(620px, 100%);
}

.zzjz-home-v3 .zz-events .wp-block-post-template {
  margin: 0;
  padding: 0;
  list-style: none;
}

.zzjz-home-v3 .zz-event-item {
  border: 1px solid rgba(103, 150, 230, 0.14);
  background: rgba(255,255,255,0.015);
  border-radius: 12px;
  padding: 12px;
  margin-bottom: 10px;
}

.zzjz-home-v3 .zz-event-item:last-child {
  margin-bottom: 0;
}

.zzjz-home-v3 .zz-event-item .wp-block-post-title {
  margin: 0 0 6px;
  font-size: 1rem;
  line-height: 1.25;
}

.zzjz-home-v3 .zz-event-item .wp-block-post-title a {
  color: #e0ebff;
  text-decoration: none;
}

.zzjz-home-v3 .zz-event-item .wp-block-post-date {
  color: var(--zz-muted);
  font-size: 0.9rem;
}

/* ==========================================================
   DJELATNOSTI DIRECTORY
   ========================================================== */
.zzjz-home-v3 .zz-djelatnosti {
  padding: 14px;
  margin-bottom: 18px;
}

.zzjz-home-v3 .zz-djelatnosti-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.zzjz-home-v3 .zz-service-box {
  min-width: 0;
  border: 1px solid rgba(103, 150, 230, 0.14);
  border-radius: 12px;
  background: rgba(255,255,255,0.015);
  padding: 12px;
}

.zzjz-home-v3 .zz-service-box h3 {
  margin: 0 0 10px;
  color: #e4edff;
  font-size: 1rem;
  line-height: 1.24;
  font-weight: 800;
  white-space: normal;
}

.zzjz-home-v3 .zz-service-box ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.zzjz-home-v3 .zz-service-box li {
  margin: 0 0 7px;
  line-height: 1.28;
}

.zzjz-home-v3 .zz-service-box li:last-child {
  margin-bottom: 0;
}

.zzjz-home-v3 .zz-service-box a {
  color: var(--zz-text-soft);
  text-decoration: none;
  white-space: normal;
}

.zzjz-home-v3 .zz-service-box a:hover {
  color: #fff;
}

/* ==========================================================
   Hide old sidebar widgets if old template bits remain
   ========================================================== */
.zzjz-home-v3 .zzjz-sidebar,
.zzjz-home-v3 .zzjz-tip-box,
.zzjz-home-v3 .zzjz-sidebar-widget {
  display: none !important;
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 1200px) {
  .zzjz-home-v3.wp-block-group {
    width: min(1140px, calc(100% - 24px));
  }

  .zzjz-home-v3 .zz-akt-tiles,
  .zzjz-home-v3 .zz-news-grid,
  .zzjz-home-v3 .zz-djelatnosti-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .zzjz-home-v3 .zz-logo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .zzjz-home-v3.wp-block-group {
    width: calc(100% - 16px);
  }

  .zzjz-home-v3 .zz-hero {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .zzjz-home-v3 .zz-hero-main {
    min-height: 320px;
    border-radius: 16px 16px 0 0;
    border-right: 1px solid var(--zz-border);
    border-bottom: 0;
  }

  .zzjz-home-v3 .zz-hero-side {
    border-radius: 0 0 16px 16px;
  }

  .zzjz-home-v3 .zz-hero-main .hero-caption,
  .zzjz-home-v3 .zz-hero-main .zzjz-hero-content,
  .zzjz-home-v3 .zz-hero-main .slide-content,
  .zzjz-home-v3 .zz-hero-main .carousel-caption {
    left: 14px;
    right: 14px;
    bottom: 14px;
    max-width: none;
  }

  .zzjz-home-v3 .zz-hero-main .hero-caption p,
  .zzjz-home-v3 .zz-hero-main .zzjz-hero-content p,
  .zzjz-home-v3 .zz-hero-main .slide-content p,
  .zzjz-home-v3 .zz-hero-main .carousel-caption p {
    display: none;
  }

  .zzjz-home-v3 .zz-akt-tiles,
  .zzjz-home-v3 .zz-news-grid,
  .zzjz-home-v3 .zz-logo-grid,
  .zzjz-home-v3 .zz-djelatnosti-grid {
    grid-template-columns: 1fr;
  }

  .zzjz-home-v3 .zz-section-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .zzjz-home-v3 .zz-tabs {
    width: 100%;
  }
}
/* emergency anti-collapse patch */
#main-content,
#main-content .wp-block-columns,
#main-content .wp-block-column,
#main-content .wp-block-group,
#main-content .wp-block-query,
#main-content .wp-block-post-template,
#main-content .wp-block-post {
  min-width: 0 !important;
}

#main-content h1,
#main-content h2,
#main-content h3,
#main-content p,
#main-content a,
#main-content li,
#main-content span {
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
}
/* =========================================================
   HZJZ HOME (Početna) HARD FIX — paste at VERY END
   Fixes vertical/stacked letters, collapsed query items,
   and re-centers design around #0047ab
   ========================================================= */

:root{
  --hz-primary: #0047ab;
  --hz-primary-2: #0b5fd1;
  --hz-primary-3: #2d7df0;
  --hz-bg-deep: #061a3a;
  --hz-bg-panel: #0a234d;
  --hz-bg-panel-2: #0c2a59;
  --hz-border: rgba(73, 130, 225, 0.22);
  --hz-text: #eaf2ff;
  --hz-text-soft: #b9ccee;
  --hz-shadow: 0 12px 28px rgba(2, 10, 28, 0.35);
}

/* 1) Prevent width-collapse inside the custom homepage wrapper */
.zzjz-home-v3,
.zzjz-home-v3 * ,
.zzjz-home-v3 *::before,
.zzjz-home-v3 *::after{
  box-sizing: border-box;
}

.zzjz-home-v3 .wp-block-query,
.zzjz-home-v3 .wp-block-post-template,
.zzjz-home-v3 .wp-block-post,
.zzjz-home-v3 .wp-block-group,
.zzjz-home-v3 .wp-block-column {
  min-width: 0 !important;
  max-width: 100%;
}

/* 2) IMPORTANT: neutralize generic/global post-template/card patches only for this section */
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-grid,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-flex {
  display: grid !important;                    /* force stable grid */
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* WP query often outputs LI wrappers even if you wrote <article> in template */
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template > li,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template > .wp-block-post {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  display: block !important;                   /* kill inherited flex weirdness */
  flex: initial !important;
}

/* 3) Card itself — readable, no vertical text */
.zzjz-home-v3 .zzjz-hz-news-item,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 220px;
  padding: 14px 14px 12px !important;
  border-radius: 14px;
  border: 1px solid var(--hz-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)),
    linear-gradient(180deg, var(--hz-bg-panel), var(--hz-bg-panel-2));
  box-shadow: var(--hz-shadow);
  overflow: hidden;
  position: relative;
}

/* subtle blue top glow line */
.zzjz-home-v3 .zzjz-hz-news-item::before,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:2px;
  background: linear-gradient(90deg, var(--hz-primary-3), var(--hz-primary));
  opacity:.95;
}

/* 4) Typography reset: stop pathological vertical wrapping */
.zzjz-home-v3 .zzjz-hz-news-item,
.zzjz-home-v3 .zzjz-hz-news-item * ,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post * {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  hyphens: none !important;
  letter-spacing: normal;
  min-width: 0 !important;
}

/* Title */
.zzjz-home-v3 .zzjz-hz-news-item .wp-block-post-title,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post .wp-block-post-title {
  margin: 0 0 8px !important;
  font-size: 1rem !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
}

.zzjz-home-v3 .zzjz-hz-news-item .wp-block-post-title a,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post .wp-block-post-title a {
  color: var(--hz-text) !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

.zzjz-home-v3 .zzjz-hz-news-item .wp-block-post-title a:hover,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post .wp-block-post-title a:hover {
  color: #ffffff !important;
}

/* Excerpt */
.zzjz-home-v3 .zzjz-hz-news-item .wp-block-post-excerpt,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post .wp-block-post-excerpt {
  margin: 0 0 10px !important;
  color: var(--hz-text-soft) !important;
  font-size: 0.9rem !important;
  line-height: 1.45 !important;
}

.zzjz-home-v3 .zzjz-hz-news-item .wp-block-post-excerpt p,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post .wp-block-post-excerpt p {
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 4 !important;
  overflow: hidden !important;
}

/* Date badge */
.zzjz-home-v3 .zzjz-hz-news-date,
.zzjz-home-v3 .zzjz-hz-news-item .wp-block-post-date,
.zzjz-home-v3 .zzjz-hz-news-list .wp-block-post .wp-block-post-date {
  margin-top: auto !important;
  align-self: flex-start !important;
  display: inline-flex !important;
  width: auto !important;
  max-width: 100%;
  padding: 5px 9px !important;
  border-radius: 10px !important;
  font-size: 0.72rem !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  color: #dfeeff !important;
  background: linear-gradient(180deg, rgba(45,125,240,.25), rgba(0,71,171,.35)) !important;
  border: 1px solid rgba(73,130,225,.35) !important;
}

/* 5) Feature tiles above news — make them match #0047ab better */
.zzjz-home-v3 .zzjz-hz-tile {
  background: linear-gradient(180deg, rgba(10,35,77,.95), rgba(8,28,62,.95)) !important;
  border: 1px solid var(--hz-border) !important;
  box-shadow: var(--hz-shadow) !important;
}

.zzjz-home-v3 .zzjz-hz-tile-title {
  color: var(--hz-text) !important;
}

.zzjz-home-v3 .zzjz-hz-tile:hover {
  transform: translateY(-2px);
  border-color: rgba(73,130,225,.45) !important;
}

/* 6) Buttons / CTAs */
.zzjz-home-v3 .zzjz-hz-btn,
.zzjz-home-v3 a.zzjz-hz-btn {
  background: linear-gradient(180deg, var(--hz-primary-2), var(--hz-primary)) !important;
  color: #fff !important;
  border: 1px solid rgba(115,165,245,.35) !important;
  box-shadow: 0 8px 18px rgba(0,71,171,.28) !important;
}
.zzjz-home-v3 .zzjz-hz-btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

/* 7) Section chrome (optional but helps overall "doesn't look right") */
.zzjz-home-v3 .zzjz-hz-section {
  background: linear-gradient(180deg, rgba(8,28,62,.65), rgba(6,24,55,.5)) !important;
  border: 1px solid rgba(73,130,225,.18) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

.zzjz-home-v3 .zzjz-hz-subhead h2,
.zzjz-home-v3 .zzjz-hz-section h2 {
  color: #eaf2ff !important;
}

.zzjz-home-v3 .zzjz-hz-subhead h2::before {
  background: var(--hz-primary) !important;
}

/* 8) Responsive */
@media (max-width: 1200px) {
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-flex,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 900px) {
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-flex,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .zzjz-home-v3 .zzjz-hz-news-item,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post {
    min-height: 200px;
  }
}
@media (max-width: 560px) {
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-flex,
  .zzjz-home-v3 .zzjz-hz-news-list .wp-block-post-template.is-layout-grid {
    grid-template-columns: 1fr !important;
  }
}
/* ==========================================================
   ZZJZ HNK — HOMEPAGE FIX v2
   - Full-width layout matching HZJZ.hr proportions
   - Header/navbar stretch to full viewport
   - Aktualnosti: 4×2 thumbnail cards only (top tile row hidden)
   - All sections same width as hero
   Drop this at the very VERY end of style.css
   ========================================================== */

/* ═══════════════════════════════════════════════════════════
   0. NUCLEAR RESET — prevent vertical text stacking
   ═══════════════════════════════════════════════════════════ */
.zzjz-home-v3,
.zzjz-home-hzjz,
#main-content {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

.zzjz-home-v3 *,
.zzjz-home-hzjz *,
#main-content * {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* ═══════════════════════════════════════════════════════════
   1. FULL-WIDTH LAYOUT — match HZJZ.hr proportions
      The site uses a white/light full-bleed background with
      content constrained to ~1300px centred.
   ═══════════════════════════════════════════════════════════ */

/* Site-wide content width tokens */
:root {
  --site-max:   1540px;
  --site-pad:   clamp(1rem, 2vw, 2.5rem);
}

/* Main wrapper — stretch to near full viewport */
main.wp-block-group,
main.wp-block-group.zzjz-home-v3,
main.wp-block-group.zzjz-home-hzjz,
#main-content {
  width: 100% !important;
  max-width: var(--site-max) !important;
  margin-inline: auto !important;
  padding-inline: var(--site-pad) !important;
  padding-block: 1rem 2.5rem !important;
}

/* Header/topbar — full viewport stretch */
.zzjz-topbar,
.zzjz-navbar,
.wp-site-blocks > header,
.wp-site-blocks > .wp-block-template-part > header,
header.zzjz-header {
  width: 100% !important;
  max-width: none !important;
}

.zzjz-topbar-inner,
.zzjz-navbar-inner,
.wp-site-blocks > header > .wp-block-group,
.wp-site-blocks > header .wp-block-columns {
  width: 100% !important;
  max-width: var(--site-max) !important;
  margin-inline: auto !important;
  padding-inline: var(--site-pad) !important;
}

/* ═══════════════════════════════════════════════════════════
   2. HERO SPLIT — CSS grid (immune to WP flex-basis injection)
   ═══════════════════════════════════════════════════════════ */
#main-content .zzjz-hz-hero-wrap,
.zzjz-home-v3 .zzjz-hz-hero-wrap {
  display: grid !important;
  grid-template-columns: minmax(0, 2.05fr) minmax(260px, 0.95fr) !important;
  gap: 0 !important;
  align-items: stretch !important;
  /* neutralise WP inline flex-basis */
  flex-wrap: nowrap !important;
  min-height: 460px;
  margin-bottom: 1.6rem !important;
}

/* WP column flex-basis override */
#main-content .zzjz-hz-hero-main,
#main-content .zzjz-hz-hero-side,
.zzjz-home-v3 .zzjz-hz-hero-main,
.zzjz-home-v3 .zzjz-hz-hero-side {
  flex-basis: unset !important;
  width: auto !important;
  min-height: 460px;
}

#main-content .zzjz-hz-hero-main,
.zzjz-home-v3 .zzjz-hz-hero-main {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 14px 0 0 14px !important;
  border: 1px solid rgba(73,130,225,.22) !important;
  border-right: none !important;
}

#main-content .zzjz-hz-hero-side,
.zzjz-home-v3 .zzjz-hz-hero-side {
  border-radius: 0 14px 14px 0 !important;
  background: linear-gradient(180deg,#0f2549,#0a1b36) !important;
  border: 1px solid rgba(73,130,225,.22) !important;
  border-left: 1px solid rgba(73,130,225,.12) !important;
  overflow: hidden !important;
}

/* Carousel fills hero height */
#main-content .zzjz-hz-hero-main .zzjz-carousel-slides {
  height: 460px !important;
}

/* Force carousel text horizontal */
#main-content .zzjz-carousel-content,
#main-content .zzjz-carousel-title,
#main-content .zzjz-carousel-excerpt,
#main-content .zzjz-carousel-date {
  writing-mode: horizontal-tb !important;
  white-space: normal !important;
  max-width: min(540px, 68%) !important;
}

#main-content .zzjz-carousel-title {
  font-size: clamp(1.35rem, 2.2vw, 2.2rem) !important;
  line-height: 1.12 !important;
  color: #fff !important;
}

/* Side panel links — no clipping */
#main-content .zzjz-hz-side-panel {
  height: 100% !important;
  padding: 16px !important;
  background: transparent !important;
}

#main-content .zzjz-hz-side-links {
  list-style: none !important;
  margin: 0 !important; padding: 0 !important;
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
}

#main-content .zzjz-hz-side-links li {
  margin: 0 !important;
  width: 100% !important;
  display: block !important;
}

#main-content .zzjz-hz-side-links a {
  display: flex !important;
  align-items: flex-start !important;
  width: 100% !important;
  padding: 13px 12px 13px 30px !important;
  position: relative !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.04) !important;
  border: 1px solid transparent !important;
  color: #d8e8ff !important;
  font-weight: 700 !important;
  font-size: 0.88rem !important;
  line-height: 1.32 !important;
  white-space: normal !important;
  text-decoration: none !important;
  transition: background .18s, border-color .18s, transform .18s !important;
}

#main-content .zzjz-hz-side-links a::before {
  content: "›" !important;
  position: absolute !important;
  left: 10px !important; top: 11px !important;
  color: #7eb8ff !important;
  font-size: 1.2rem !important;
  line-height: 1 !important;
}

#main-content .zzjz-hz-side-links a:hover {
  background: rgba(0,71,171,.2) !important;
  border-color: rgba(59,130,246,.3) !important;
  transform: translateY(-1px) !important;
}

/* ═══════════════════════════════════════════════════════════
   3. AKTUALNOSTI — hide static tile row, show 4×2 news grid
   ═══════════════════════════════════════════════════════════ */
#main-content .zzjz-hz-aktualnosti,
.zzjz-home-v3 .zzjz-hz-aktualnosti {
  background: linear-gradient(180deg,rgba(12,28,55,.97),rgba(9,22,44,.97)) !important;
  border: 1px solid rgba(73,130,225,.22) !important;
  border-radius: 16px !important;
  padding: 18px 18px 14px !important;
  margin-bottom: 1.6rem !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.3) !important;
}

/* ── HIDE the 4 static feature tiles ── */
#main-content .zzjz-hz-akt-grid,
.zzjz-home-v3 .zzjz-hz-akt-grid {
  display: none !important;
}

/* ── Section head (Aktualnosti title + tabs) ── */
#main-content .zzjz-hz-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 14px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(73,130,225,.18) !important;
}

#main-content .zzjz-hz-section-head h2,
#main-content .zzjz-hz-subhead h2 {
  font-size: clamp(1.15rem,1.5vw,1.55rem) !important;
  font-weight: 800 !important;
  color: #e8f0ff !important;
  padding-left: 14px !important;
  position: relative !important;
  margin: 0 !important;
  line-height: 1.18 !important;
  letter-spacing: -.02em !important;
  border-left: none !important;
}

#main-content .zzjz-hz-section-head h2::before,
#main-content .zzjz-hz-subhead h2::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important; top: .1em !important;
  width: 4px !important; height: .9em !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg,#3b82f6,#0047ab) !important;
}

/* ── NEWS GRID: 4×2 with thumbnails ── */
#main-content .zzjz-hz-news-list,
.zzjz-home-v3 .zzjz-hz-news-list {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 14px !important;
  list-style: none !important;
  margin: 0 !important; padding: 0 !important;
  width: 100% !important;
}

/* WP post-template: let its children flow into the parent grid */
#main-content .zzjz-hz-news-list .wp-block-post-template,
.zzjz-home-v3  .zzjz-hz-news-list .wp-block-post-template {
  display: contents !important;
  list-style: none !important;
}

/* Each card */
#main-content .zzjz-hz-news-item,
#main-content .zzjz-hz-news-list .wp-block-post,
#main-content .zzjz-hz-news-list > li,
.zzjz-home-v3 .zzjz-hz-news-item {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  flex-basis: unset !important;
  min-height: 240px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(73,130,225,.18) !important;
  background: rgba(255,255,255,.018) !important;
  overflow: hidden !important;
  position: relative !important;
  transition: transform .2s, border-color .2s, box-shadow .2s !important;
  padding: 0 !important; /* padding goes on inner body, not card */
}

#main-content .zzjz-hz-news-item:hover,
#main-content .zzjz-hz-news-list .wp-block-post:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(73,130,225,.4) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.28) !important;
}

/* Blue top accent bar */
#main-content .zzjz-hz-news-item::before,
#main-content .zzjz-hz-news-list .wp-block-post::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg,#2d7df0,#0047ab) !important;
  z-index: 2 !important;
}

/* ── THUMBNAIL (featured image) ── */
#main-content .zzjz-hz-news-item .wp-block-post-featured-image,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-featured-image {
  flex: 0 0 auto !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
  background: #0a1e3c !important;
  display: block !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

#main-content .zzjz-hz-news-item .wp-block-post-featured-image img,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-featured-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform .35s ease !important;
}

#main-content .zzjz-hz-news-item:hover .wp-block-post-featured-image img,
#main-content .zzjz-hz-news-list .wp-block-post:hover .wp-block-post-featured-image img {
  transform: scale(1.04) !important;
}

/* ── Card body ── */
#main-content .zzjz-hz-news-item .wp-block-group,
#main-content .zzjz-hz-news-list .wp-block-post > .wp-block-group {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 12px 13px 13px !important;
  gap: 0 !important;
  min-width: 0 !important;
}

/* Title */
#main-content .zzjz-hz-news-item .wp-block-post-title,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-title {
  font-size: .98rem !important;
  font-weight: 800 !important;
  line-height: 1.24 !important;
  margin: 0 0 7px !important;
  color: #e4f0ff !important;
}

#main-content .zzjz-hz-news-item .wp-block-post-title a,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-title a {
  color: #e4f0ff !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

#main-content .zzjz-hz-news-item .wp-block-post-title a:hover,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-title a:hover {
  color: #fff !important;
}

/* Excerpt */
#main-content .zzjz-hz-news-item .wp-block-post-excerpt,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-excerpt {
  margin: 0 0 8px !important;
  color: #afc6ec !important;
  font-size: .88rem !important;
  line-height: 1.48 !important;
}

#main-content .zzjz-hz-news-item .wp-block-post-excerpt p,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-excerpt p {
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Date badge */
#main-content .zzjz-hz-news-date,
#main-content .zzjz-hz-news-item .wp-block-post-date,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-date {
  margin-top: auto !important;
  align-self: flex-start !important;
  display: inline-flex !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #c8e0ff !important;
  background: rgba(0,71,171,.3) !important;
  border: 1px solid rgba(73,130,225,.35) !important;
  white-space: nowrap !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  width: auto !important;
  max-width: fit-content !important;
}

/* ═══════════════════════════════════════════════════════════
   4. PROGRAMMES LOGO GRID — same width as rest
   ═══════════════════════════════════════════════════════════ */
#main-content .zzjz-hz-logo-grid,
.zzjz-home-v3 .zzjz-hz-logo-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0,1fr)) !important;
  gap: 10px !important;
}

#main-content .zzjz-hz-logo-grid a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 100px !important;
  padding: 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(73,130,225,.2) !important;
  background: rgba(255,255,255,.02) !important;
  text-decoration: none !important;
  transition: transform .18s, border-color .18s !important;
}

#main-content .zzjz-hz-logo-grid a:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(73,130,225,.4) !important;
  background: rgba(0,71,171,.08) !important;
}

#main-content .zzjz-hz-logo-grid img {
  max-height: 60px !important;
  object-fit: contain !important;
}

/* ═══════════════════════════════════════════════════════════
   5. DOGAĐANJA — centred, reasonable max-width
   ═══════════════════════════════════════════════════════════ */
#main-content .zzjz-hz-events,
.zzjz-home-v3 .zzjz-hz-events {
  background: linear-gradient(180deg,rgba(12,28,55,.97),rgba(9,22,44,.97)) !important;
  border: 1px solid rgba(73,130,225,.22) !important;
  border-radius: 16px !important;
  padding: 18px !important;
  margin-bottom: 1.6rem !important;
  max-width: 700px !important;
  margin-inline: auto !important;
}

#main-content .zzjz-hz-event-item {
  border: 1px solid rgba(73,130,225,.14) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.015) !important;
  padding: 12px 14px !important;
  margin-bottom: 10px !important;
}

#main-content .zzjz-hz-event-item:last-child { margin-bottom: 0 !important; }

#main-content .zzjz-hz-event-item h3 a {
  color: #d8e8ff !important;
  text-decoration: none !important;
}

/* ═══════════════════════════════════════════════════════════
   6. DJELATNOSTI — same full width, 4-column grid
   ═══════════════════════════════════════════════════════════ */
#main-content .zzjz-hz-djelatnosti,
.zzjz-home-v3 .zzjz-hz-djelatnosti {
  background: linear-gradient(180deg,rgba(11,26,50,.97),rgba(8,20,40,.97)) !important;
  border: 1px solid rgba(73,130,225,.22) !important;
  border-radius: 16px !important;
  padding: 18px !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.3) !important;
  margin-bottom: 1.6rem !important;
}

#main-content .zzjz-hz-services-grid,
.zzjz-home-v3 .zzjz-hz-services-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 14px !important;
  align-items: start !important;
}

#main-content .zzjz-hz-service-col,
.zzjz-home-v3 .zzjz-hz-service-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

#main-content .zzjz-hz-service-box,
.zzjz-home-v3 .zzjz-hz-service-box {
  border: 1px solid rgba(73,130,225,.14) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.018) !important;
  padding: 12px 14px !important;
}

#main-content .zzjz-hz-service-box h3 {
  margin: 0 0 8px !important;
  color: #e4edff !important;
  font-size: .97rem !important;
  font-weight: 800 !important;
  line-height: 1.22 !important;
}

#main-content .zzjz-hz-service-box ul {
  list-style: none !important;
  margin: 0 !important; padding: 0 !important;
}

#main-content .zzjz-hz-service-box li {
  margin: 0 0 5px !important;
  line-height: 1.3 !important;
}

#main-content .zzjz-hz-service-box a {
  color: #adc5ef !important;
  text-decoration: none !important;
  font-size: .87rem !important;
}

#main-content .zzjz-hz-service-box a:hover { color: #fff !important; }

/* ═══════════════════════════════════════════════════════════
   7. SHARED SECTION CHROME — subheads, buttons, tabs, CTA
   ═══════════════════════════════════════════════════════════ */
#main-content .zzjz-hz-section,
.zzjz-home-v3 .zzjz-hz-section {
  margin-bottom: 1.6rem !important;
}

/* Buttons */
#main-content .zzjz-hz-btn,
.zzjz-home-v3 .zzjz-hz-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 10px 18px !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg,#1565d8,#0047ab) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: .9rem !important;
  text-decoration: none !important;
  border: 1px solid rgba(59,130,246,.28) !important;
  box-shadow: 0 8px 18px rgba(0,71,171,.28) !important;
  transition: transform .18s, filter .18s !important;
  white-space: nowrap !important;
}

#main-content .zzjz-hz-btn:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.06) !important;
}

#main-content .zzjz-hz-section-cta {
  margin-top: 14px !important;
  text-align: right !important;
}

/* Tabs */
#main-content .zzjz-hz-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#main-content .zzjz-hz-tabs a {
  color: #b0c6e8 !important;
  text-decoration: none !important;
  font-size: .9rem !important;
  padding: 7px 13px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  transition: all .18s !important;
  white-space: nowrap !important;
}

#main-content .zzjz-hz-tabs a:hover,
#main-content .zzjz-hz-tabs a.is-active {
  color: #fff !important;
  background: rgba(0,71,171,.22) !important;
  border-color: rgba(59,130,246,.25) !important;
}

/* ═══════════════════════════════════════════════════════════
   8. RESPONSIVE
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
  #main-content .zzjz-hz-hero-wrap {
    grid-template-columns: minmax(0,1.85fr) minmax(240px,1fr) !important;
  }
  #main-content .zzjz-hz-news-list {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
  #main-content .zzjz-hz-logo-grid {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
  #main-content .zzjz-hz-services-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

@media (max-width: 960px) {
  #main-content .zzjz-hz-hero-wrap {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }
  #main-content .zzjz-hz-hero-main {
    border-radius: 14px 14px 0 0 !important;
    border-right: 1px solid rgba(73,130,225,.22) !important;
    border-bottom: none !important;
    min-height: 340px !important;
  }
  #main-content .zzjz-carousel-slides { height: 340px !important; }
  #main-content .zzjz-hz-hero-side {
    border-radius: 0 0 14px 14px !important;
    min-height: auto !important;
  }
  #main-content .zzjz-hz-news-list {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
  #main-content .zzjz-hz-logo-grid {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
  #main-content .zzjz-hz-section-head {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  #main-content .zzjz-hz-section-cta { text-align: left !important; }
}

@media (max-width: 600px) {
  #main-content .zzjz-hz-news-list,
  #main-content .zzjz-hz-services-grid {
    grid-template-columns: 1fr !important;
  }
  #main-content .zzjz-hz-logo-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

/* ==========================================================
   ZZJZ DEFINITIVE WIDTH FIX
   Based on exact rendered HTML — paste at very end of style.css
   ========================================================== */

/* ── 1. Header: constrain the inner zzjz-header, not the template-part shell ── */
header.wp-block-template-part {
  width: 100% !important;
  max-width: none !important;
}

header.wp-block-group.zzjz-header {
  max-width: 1320px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ── 2. Kill WP global padding on main — this is what's been fighting us ── */
main.wp-block-group.is-layout-constrained,
main.wp-block-group.has-global-padding,
main#main-content {
  --wp--style--global--content-size: 1320px !important;
  --wp--style--global--wide-size: 1320px !important;
  max-width: 1320px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  /* Override WP's injected padding-inline from has-global-padding */
  padding-left: clamp(1rem, 2vw, 1.5rem) !important;
  padding-right: clamp(1rem, 2vw, 1.5rem) !important;
  box-sizing: border-box !important;
}

/* ── 3. Prevent constrained layout children from getting extra WP padding ── */
main.wp-block-group.is-layout-constrained > * {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
header.wp-block-group.zzjz-header {
  max-width: 1320px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(1rem, 2vw, 1.5rem) !important;
  padding-right: clamp(1rem, 2vw, 1.5rem) !important;
  box-sizing: border-box !important;
}

header.wp-block-group.zzjz-header .zzjz-topbar,
header.wp-block-group.zzjz-header .zzjz-navbar {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

header.wp-block-group.zzjz-header .zzjz-topbar-inner,
header.wp-block-group.zzjz-header .zzjz-navbar-inner {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}
.zzjz-navbar,
.zzjz-navbar-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
}

.zzjz-navbar .wp-block-navigation,
.zzjz-navbar-inner .wp-block-navigation {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  min-height: 0 !important;
}

.wp-block-navigation__responsive-container-open {
  display: none !important;
}
/* Hide hamburger at desktop only */
@media (min-width: 769px) {
  .wp-site-blocks > header .wp-block-navigation__responsive-container-open,
  .zzjz-navbar .wp-block-navigation__responsive-container-open,
  header.zzjz-header .wp-block-navigation__responsive-container-open,
  .zzjz-navbar-inner .wp-block-navigation__responsive-container-open {
    display: none !important;
  }
}

/* Mobile: restore hamburger, fix hero, fix text overflow */
@media (max-width: 768px) {
  .wp-site-blocks > header .wp-block-navigation__responsive-container-open,
  .zzjz-navbar .wp-block-navigation__responsive-container-open,
  header.zzjz-header .wp-block-navigation__responsive-container-open,
  .zzjz-navbar-inner .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }

  /* Hero: stack vertically */
  .zzjz-hz-hero-wrap {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: unset !important;
  }

  .zzjz-hz-hero-main,
  .zzjz-hz-hero-side {
    width: 100% !important;
    flex-basis: 100% !important;
    min-height: 0 !important;
  }

  /* Fix text overflow in carousel */
  .zzjz-carousel-title,
  .zzjz-carousel-excerpt,
  .zzjz-carousel-content {
    max-width: 100% !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Topbar text truncation */
  .zzjz-site-title {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: calc(100vw - 80px) !important;
  }
}
@media (max-width: 768px) {
  .zzjz-site-title {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    max-width: calc(100vw - 90px) !important;
    word-break: break-word !important;
    font-size: 0.9rem !important;
    line-height: 1.3 !important;
  }

  .zzjz-topbar-inner {
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 8px 12px !important;
  }

  .zzjz-logo-img {
    flex-shrink: 0 !important;
  }
}
/* ==========================================================
   FORCE LIGHT MODE SITE-WIDE
   ========================================================== */
:root {
  color-scheme: light only !important;
}

/* ==========================================================
   LIGHT BACKGROUNDS ON SECTION BLOCKS + CARDS
   ========================================================== */

/* Aktualnosti section block */
.zzjz-hz-aktualnosti {
  background: color-mix(in srgb, blue 15%, white 85%) !important;
  border-color: color-mix(in srgb, blue 20%, white 80%) !important;
}

/* Djelatnosti section block */
.zzjz-hz-djelatnosti {
  background: color-mix(in srgb, blue 15%, white 85%) !important;
  border-color: color-mix(in srgb, blue 20%, white 80%) !important;
}

/* Section headings inside light blocks */
.zzjz-hz-aktualnosti .zzjz-hz-section-head h2,
.zzjz-hz-djelatnosti .zzjz-hz-subhead h2 {
  color: #0a1e3c !important;
}

/* News cards inside Aktualnosti */
.zzjz-hz-aktualnosti .zzjz-hz-news-item,
.zzjz-hz-aktualnosti .wp-block-post {
  background: white !important;
  border-color: color-mix(in srgb, blue 20%, white 80%) !important;
  color: #1a1a2e !important;
}

.zzjz-hz-aktualnosti .wp-block-post-title a {
  color: #0a1e3c !important;
}

.zzjz-hz-aktualnosti .wp-block-post-excerpt p {
  color: #2a3a5c !important;
}

/* Service boxes inside Djelatnosti */
.zzjz-hz-djelatnosti .zzjz-hz-service-box {
  background: white !important;
  border-color: color-mix(in srgb, blue 20%, white 80%) !important;
}

.zzjz-hz-djelatnosti .zzjz-hz-service-box h3 {
  color: #0a1e3c !important;
}

.zzjz-hz-djelatnosti .zzjz-hz-service-box a {
  color: #0047ab !important;
}

.zzjz-hz-djelatnosti .zzjz-hz-service-box a:hover {
  color: #002f7a !important;
  text-decoration: underline !important;
}

/* Tabs */
.zzjz-hz-aktualnosti .zzjz-hz-tabs a {
  color: #0047ab !important;
}

.zzjz-hz-aktualnosti .zzjz-hz-tabs a:hover,
.zzjz-hz-aktualnosti .zzjz-hz-tabs a.is-active {
  background: color-mix(in srgb, blue 20%, white 80%) !important;
  color: #0a1e3c !important;
  border-color: color-mix(in srgb, blue 30%, white 70%) !important;
}
/* ==========================================================
   ZZJZ HNK — LIGHT CARDS / LIGHT BLOCKS OVERRIDE
   Put this at the VERY END of style.css
   ========================================================== */

:root {
  --zz-primary: #0047ab;
  --zz-text: var(--wp--preset--color--ink, #0f172a);
  --zz-muted: #475569;
  --zz-border: color-mix(in srgb, var(--zz-primary) 12%, white 88%);
  --zz-surface: color-mix(in srgb, var(--zz-primary) 8%, white 92%);
  --zz-surface-2: color-mix(in srgb, var(--zz-primary) 15%, white 85%); /* your requested mix */
  --zz-surface-3: color-mix(in srgb, var(--zz-primary) 20%, white 80%);
  --zz-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

/* Fallback if browser struggles with color-mix */
@supports not (background: color-mix(in srgb, blue 15%, white 85%)) {
  :root {
    --zz-border: #d8e4f7;
    --zz-surface: #eef4fc;
    --zz-surface-2: #e3eefb;
    --zz-surface-3: #d7e8fb;
  }
}

/* 1) MAIN SECTION BLOCKS -> LIGHT BACKGROUND */
#main-content .zzjz-hz-aktualnosti,
.zzjz-home-v3 .zzjz-hz-aktualnosti,
#main-content .zzjz-hz-djelatnosti,
.zzjz-home-v3 .zzjz-hz-djelatnosti,
#main-content .zzjz-hz-events,
.zzjz-home-v3 .zzjz-hz-events {
  background: var(--zz-surface) !important;
  border: 1px solid var(--zz-border) !important;
  box-shadow: var(--zz-shadow) !important;
}

/* 2) CARDS INSIDE BLOCKS -> requested light blue mix */
#main-content .zzjz-hz-news-item,
#main-content .zzjz-hz-news-list .wp-block-post,
.zzjz-home-v3 .zzjz-hz-news-item,
#main-content .zzjz-hz-service-box,
.zzjz-home-v3 .zzjz-hz-service-box,
#main-content .zzjz-hz-event-item,
.zzjz-home-v3 .zzjz-hz-event-item,
#main-content .zzjz-hz-logo-grid a,
.zzjz-home-v3 .zzjz-hz-logo-grid a {
  background: var(--zz-surface-2) !important;
  border: 1px solid var(--zz-border) !important;
  box-shadow: none !important;
}

/* 3) HERO RIGHT PANEL + side links cards (if you want them lighter too) */
#main-content .zzjz-hz-hero-side,
.zzjz-home-v3 .zzjz-hz-hero-side {
  background: var(--zz-surface) !important;
  border-color: var(--zz-border) !important;
}

#main-content .zzjz-hz-side-links a,
.zzjz-home-v3 .zzjz-hz-side-links a {
  background: var(--zz-surface-2) !important;
  color: var(--zz-text) !important;
  border: 1px solid var(--zz-border) !important;
}

#main-content .zzjz-hz-side-links a::before,
.zzjz-home-v3 .zzjz-hz-side-links a::before {
  color: var(--zz-primary) !important;
}

#main-content .zzjz-hz-side-links a:hover,
.zzjz-home-v3 .zzjz-hz-side-links a:hover {
  background: var(--zz-surface-3) !important;
  border-color: color-mix(in srgb, var(--zz-primary) 22%, white 78%) !important;
}

/* 4) TEXT COLORS -> use normal site text color */
#main-content .zzjz-hz-section-head h2,
#main-content .zzjz-hz-subhead h2,
#main-content .zzjz-hz-news-item .wp-block-post-title,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-title,
#main-content .zzjz-hz-news-item .wp-block-post-title a,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-title a,
#main-content .zzjz-hz-service-box h3,
#main-content .zzjz-hz-event-item h3 a,
#main-content .zzjz-hz-logo-grid a {
  color: var(--zz-text) !important;
}

#main-content .zzjz-hz-news-item .wp-block-post-excerpt,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-excerpt,
#main-content .zzjz-hz-service-box a,
#main-content .zzjz-hz-tabs a,
#main-content .zzjz-hz-event-item,
#main-content .zzjz-hz-djelatnosti p,
#main-content .zzjz-hz-aktualnosti p {
  color: var(--zz-muted) !important;
}

/* 5) Keep primary blue accents consistent */
#main-content .zzjz-hz-news-item::before,
#main-content .zzjz-hz-news-list .wp-block-post::before {
  background: linear-gradient(90deg, #0047ab, #2d7df0) !important;
}

#main-content .zzjz-hz-section-head h2::before,
#main-content .zzjz-hz-subhead h2::before {
  background: linear-gradient(180deg, #2d7df0, #0047ab) !important;
}

/* 6) Date badge -> readable on light card */
#main-content .zzjz-hz-news-date,
#main-content .zzjz-hz-news-item .wp-block-post-date,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-date {
  background: color-mix(in srgb, var(--zz-primary) 14%, white 86%) !important;
  border: 1px solid color-mix(in srgb, var(--zz-primary) 22%, white 78%) !important;
  color: var(--zz-primary) !important;
}

/* 7) Featured image placeholder bg (when image missing) */
#main-content .zzjz-hz-news-item .wp-block-post-featured-image,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-featured-image {
  background: #dfeafb !important;
}

/* 8) Tabs active/hover on light background */
#main-content .zzjz-hz-tabs a:hover,
#main-content .zzjz-hz-tabs a.is-active {
  color: var(--zz-primary) !important;
  background: color-mix(in srgb, var(--zz-primary) 12%, white 88%) !important;
  border-color: color-mix(in srgb, var(--zz-primary) 22%, white 78%) !important;
}

/* 9) Optional: make service links darker by default for readability */
#main-content .zzjz-hz-service-box a:hover,
#main-content .zzjz-hz-news-item .wp-block-post-title a:hover,
#main-content .zzjz-hz-news-list .wp-block-post .wp-block-post-title a:hover {
  color: #003b90 !important;
}
/* ==========================================================
   HOMEPAGE LIGHT SURFACE OVERRIDE (FINAL)
   Put at VERY END of style.css
   ========================================================== */

:root {
  --hz-light-surface: color-mix(in srgb, blue 15%, white 85%);
  --hz-light-surface-2: color-mix(in srgb, blue 12%, white 88%);
  --hz-light-surface-3: color-mix(in srgb, blue 20%, white 80%);
  --hz-light-border: color-mix(in srgb, blue 22%, white 78%);
  --hz-light-text: var(--wp--preset--color--foreground, #0f172a);
  --hz-light-muted: #475569;
  --hz-light-heading: #0b254a;
}

@supports not (background: color-mix(in srgb, blue 15%, white 85%)) {
  :root {
    --hz-light-surface: #e3eefb;
    --hz-light-surface-2: #edf4fd;
    --hz-light-surface-3: #d8e8fb;
    --hz-light-border: #c8dcf7;
  }
}

/* ===== MAIN BLOCKS (Aktualnosti / Djelatnosti / optional Events) ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-aktualnosti,
#main-content.zzjz-home-hzjz .zzjz-hz-djelatnosti,
#main-content.zzjz-home-hzjz .zzjz-hz-events {
  background: var(--hz-light-surface-2) !important;
  border: 1px solid var(--hz-light-border) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
}

/* ===== SECTION HEADINGS / DIVIDERS ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-section-head h2,
#main-content.zzjz-home-hzjz .zzjz-hz-subhead h2 {
  color: var(--hz-light-heading) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-section-head,
#main-content.zzjz-home-hzjz .zzjz-hz-subhead {
  border-color: var(--hz-light-border) !important;
}

/* ===== NEWS CARDS (Aktualnosti) ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-news-item,
#main-content.zzjz-home-hzjz .zzjz-hz-news-list .wp-block-post,
#main-content.zzjz-home-hzjz .zzjz-hz-news-list .wp-block-post-template > li {
  background: var(--hz-light-surface) !important;
  border: 1px solid var(--hz-light-border) !important;
  box-shadow: none !important;
}

/* kill dark gradient variants if they exist on same elements */
#main-content.zzjz-home-hzjz .zzjz-hz-news-item,
#main-content.zzjz-home-hzjz .zzjz-hz-news-list .wp-block-post {
  background-image: none !important;
}

/* news text */
#main-content.zzjz-home-hzjz .zzjz-hz-news-item h3,
#main-content.zzjz-home-hzjz .zzjz-hz-news-item .wp-block-post-title,
#main-content.zzjz-home-hzjz .zzjz-hz-news-item .wp-block-post-title a,
#main-content.zzjz-home-hzjz .zzjz-hz-news-list .wp-block-post .wp-block-post-title a {
  color: var(--hz-light-heading) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-news-item .wp-block-post-excerpt,
#main-content.zzjz-home-hzjz .zzjz-hz-news-item .wp-block-post-excerpt p {
  color: var(--hz-light-muted) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-news-date,
#main-content.zzjz-home-hzjz .zzjz-hz-news-date time {
  color: #1d4f91 !important;
}

/* ===== DJELATNOSTI CARDS ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-service-box {
  background: var(--hz-light-surface) !important;
  border: 1px solid var(--hz-light-border) !important;
  box-shadow: none !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-service-box h3 {
  color: var(--hz-light-heading) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-service-box a {
  color: var(--hz-light-text) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-service-box a:hover {
  color: #0047ab !important;
}

/* ===== HERO RIGHT PANEL + QUICK LINKS ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-hero-side,
#main-content.zzjz-home-hzjz .zzjz-hz-side-panel {
  background: var(--hz-light-surface-2) !important;
  border-color: var(--hz-light-border) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-side-links a {
  background: var(--hz-light-surface) !important;
  border: 1px solid var(--hz-light-border) !important;
  color: var(--hz-light-heading) !important;
  box-shadow: none !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-side-links a::before {
  color: #0b5fd1 !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-side-links a:hover {
  background: var(--hz-light-surface-3) !important;
  border-color: color-mix(in srgb, blue 28%, white 72%) !important;
  color: #003b8e !important;
}

/* ===== Optional: tabs in Aktualnosti (if present) ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-tabs a {
  color: var(--hz-light-text) !important;
}

#main-content.zzjz-home-hzjz .zzjz-hz-tabs a:hover,
#main-content.zzjz-home-hzjz .zzjz-hz-tabs a.is-active {
  background: var(--hz-light-surface) !important;
  border-color: var(--hz-light-border) !important;
  color: #0047ab !important;
}

/* ===== Keep CTA button blue but harmonize shadow ===== */
#main-content.zzjz-home-hzjz .zzjz-hz-btn {
  box-shadow: 0 8px 18px rgba(0, 71, 171, 0.18) !important;
}
/* =========================================================
   HERO CAROUSEL — CLEAN FIX (ratio, typography, controls)
   ========================================================= */

:root {
  --zz-primary: #0047ab;
  --zz-ink: #0f172a;
  --zz-surface-soft: color-mix(in srgb, var(--zz-primary) 10%, white 90%);
  --zz-surface-card: color-mix(in srgb, var(--zz-primary) 14%, white 86%);
  --zz-border-soft: color-mix(in srgb, var(--zz-primary) 18%, white 82%);
}

/* Outer frame */
.zzjz-hero-carousel {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.14);
  border: 1px solid color-mix(in srgb, var(--zz-primary) 12%, white 88%);
}

/* Kill shortcode garbage spacing */
.zzjz-hero-carousel > p:empty,
.zzjz-hero-carousel p:has(> br:only-child) {
  display: none !important;
}

/* Some WP/plugin outputs <p> wrappers around controls */
.zzjz-hero-carousel > p {
  margin: 0;
}

/* Slide track */
.zzjz-carousel-slides {
  position: relative;
  min-height: 520px;
  background: #e9eef7;
}

/* Individual slide */
.zzjz-carousel-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s ease;
  display: grid;
  grid-template-columns: 1fr;
}

.zzjz-carousel-slide.active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

/* Image area */
.zzjz-carousel-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #dfe7f4;
}

.zzjz-carousel-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;      /* crucial for mixed image sizes */
  object-position: center;
}

/* Dark readable gradient overlay */
.zzjz-carousel-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(10, 25, 55, 0.72) 0%,
      rgba(10, 25, 55, 0.52) 35%,
      rgba(10, 25, 55, 0.18) 62%,
      rgba(10, 25, 55, 0.08) 100%
    ),
    linear-gradient(
      0deg,
      rgba(10, 25, 55, 0.45) 0%,
      rgba(10, 25, 55, 0.10) 35%,
      rgba(10, 25, 55, 0.05) 100%
    );
}

/* Content card over image */
.zzjz-carousel-content {
  position: relative;
  z-index: 2;
  max-width: 560px;
  padding: clamp(24px, 4vw, 44px);
  margin: auto auto auto 0;
  color: #fff;
}

/* Date badge */
.zzjz-carousel-date {
  display: inline-block;
  margin: 0 0 16px 0;
  padding: 10px 14px;
  border-radius: 10px;
  background: #ff3b30;
  color: #fff;
  font: 700 0.85rem/1.1 Inter, system-ui, sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

/* Title */
.zzjz-carousel-title {
  margin: 0 0 12px 0 !important;
  font-family: Merriweather, Georgia, serif;
  font-size: clamp(1.75rem, 2.5vw, 3rem);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.02em;
  max-width: 16ch;
}

.zzjz-carousel-title a {
  color: #fff !important;
  text-decoration: none;
}

.zzjz-carousel-title a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Excerpt */
.zzjz-carousel-excerpt {
  margin: 0 0 20px 0 !important;
  max-width: 46ch;
  color: rgba(255, 255, 255, 0.95);
  font: 400 1.05rem/1.55 Inter, system-ui, sans-serif;
  text-wrap: pretty;
}

/* CTA button */
.zzjz-carousel-button {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 12px 18px;
  border-radius: 12px;
  background: #fff;
  color: var(--zz-primary) !important;
  text-decoration: none;
  font: 700 0.98rem/1 Inter, system-ui, sans-serif;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.zzjz-carousel-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.2);
}

/* Prev/next buttons (works even if wrapped weirdly) */
.zzjz-carousel-prev,
.zzjz-carousel-next {
  position: absolute;
  top: 50%;
  z-index: 4;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--zz-primary);
  cursor: pointer;
  transform: translateY(-50%);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.16);
  font-size: 1.6rem;
  line-height: 1;
  display: grid;
  place-items: center;
}

.zzjz-carousel-prev { left: 18px; }
.zzjz-carousel-next { right: 18px; }

.zzjz-carousel-prev:hover,
.zzjz-carousel-next:hover {
  background: #fff;
}

/* Dots */
.zzjz-carousel-dots {
  position: absolute;
  right: 20px;
  bottom: 16px;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 8px;
}

.zzjz-carousel-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  border: 0;
  background: rgba(255, 255, 255, 0.65);
  cursor: pointer;
  padding: 0;
}

.zzjz-carousel-dot.active,
.zzjz-carousel-dot[aria-selected="true"] {
  width: 28px;
  background: #fff;
}

/* If plugin wraps controls inside a <p>, neutralize layout */
.zzjz-hero-carousel > p:has(.zzjz-carousel-prev),
.zzjz-hero-carousel > p:has(.zzjz-carousel-next) {
  margin: 0;
  padding: 0;
  display: contents;
}

/* =========================================================
   HOME SECTION PANELS + CARDS (your requested light mix)
   ========================================================= */

.zzjz-hz-section {
  background: color-mix(in srgb, blue 15%, white 85%) !important;
  border: 1px solid color-mix(in srgb, blue 18%, white 82%) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.zzjz-hz-section h2,
.zzjz-hz-section h3,
.zzjz-hz-section p,
.zzjz-hz-section li,
.zzjz-hz-section a {
  color: var(--zz-ink);
}

/* News cards + service cards */
.zzjz-hz-news-item,
.zzjz-hz-service-box {
  background: color-mix(in srgb, blue 15%, white 85%) !important;
  border: 1px solid color-mix(in srgb, blue 22%, white 78%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.65);
}

/* Optional: soften top blue line on news cards if too aggressive */
.zzjz-hz-news-item {
  border-top: 3px solid color-mix(in srgb, var(--zz-primary) 65%, white 35%) !important;
}

/* Better readability for news excerpts */
.zzjz-hz-news-item .wp-block-post-excerpt__excerpt,
.zzjz-hz-news-item p {
  color: color-mix(in srgb, var(--zz-ink) 78%, white 22%) !important;
}

/* Date pill in news cards */
.zzjz-hz-news-date {
  background: color-mix(in srgb, var(--zz-primary) 14%, white 86%) !important;
  color: var(--zz-primary) !important;
  border: 1px solid color-mix(in srgb, var(--zz-primary) 20%, white 80%) !important;
  border-radius: 999px;
  padding: 4px 10px;
  display: inline-block;
  font-weight: 600;
  font-size: 0.84rem;
}

/* =========================================================
   Responsive adjustments
   ========================================================= */

@media (max-width: 1024px) {
  .zzjz-carousel-slides { min-height: 460px; }

  .zzjz-carousel-content {
    max-width: 92%;
    padding: 22px;
  }

  .zzjz-carousel-title {
    font-size: clamp(1.4rem, 4vw, 2.1rem);
    max-width: 20ch;
  }

  .zzjz-carousel-excerpt {
    font-size: 0.98rem;
    max-width: 52ch;
  }
}

@media (max-width: 700px) {
  .zzjz-carousel-slides { min-height: 420px; }

  .zzjz-carousel-content {
    margin: auto 0 0 0;
    padding: 18px 16px 58px;
  }

  .zzjz-carousel-title {
    font-size: 1.45rem;
    line-height: 1.08;
  }

  .zzjz-carousel-excerpt {
    font-size: 0.92rem;
    line-height: 1.45;
    margin-bottom: 14px !important;
  }

  .zzjz-carousel-button {
    padding: 10px 14px;
    font-size: 0.92rem;
  }

  .zzjz-carousel-prev,
  .zzjz-carousel-next {
    width: 40px;
    height: 40px;
  }

  .zzjz-carousel-prev { left: 10px; }
  .zzjz-carousel-next { right: 10px; }

  .zzjz-carousel-dots {
    right: 12px;
    bottom: 12px;
  }
}
/* =========================================================
   HERO FINAL TWEAKS (height + CTA position + cleaner bg)
   ========================================================= */

/* 1) Make hero row visually stronger */
.zzjz-hz-hero-wrap {
  align-items: stretch;
}

/* 2) Taller left slider + matching right panel */
.zzjz-hz-hero-main,
.zzjz-hz-hero-side,
.zzjz-hz-side-panel,
.zzjz-hero-carousel {
  min-height: 560px; /* was effectively shorter */
}

/* If your shortcode uses this wrapper, force height */
.zzjz-hero-carousel,
.zzjz-carousel-slides {
  height: 560px;
  min-height: 560px;
}

/* 3) Image fill + darker overlay only on left side for readability */
.zzjz-carousel-image,
.zzjz-carousel-image img {
  height: 100%;
}

.zzjz-carousel-image img {
  object-fit: cover;
  object-position: center center;
}

/* Slightly stronger left gradient so text reads better on bright images */
.zzjz-carousel-overlay {
  background:
    linear-gradient(
      90deg,
      rgba(10, 25, 55, 0.78) 0%,
      rgba(10, 25, 55, 0.58) 34%,
      rgba(10, 25, 55, 0.22) 62%,
      rgba(10, 25, 55, 0.08) 100%
    ),
    linear-gradient(
      0deg,
      rgba(10, 25, 55, 0.30) 0%,
      rgba(10, 25, 55, 0.06) 35%,
      rgba(10, 25, 55, 0.03) 100%
    );
}

/* 4) Keep content away from dots / bottom bar */
.zzjz-carousel-content {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 56px;              /* reserve space for dots */
  z-index: 3;
  width: min(560px, 62%);
  padding: 36px 40px 22px;
  display: flex;
  flex-direction: column;
  justify-content: center;   /* centers the stack nicely */
  align-items: flex-start;
  margin: 0;
}

/* 5) Title sizing (still strong, but prevents pushing CTA down) */
.zzjz-carousel-title {
  margin: 0 0 10px 0 !important;
  font-size: clamp(1.9rem, 2.4vw, 3.1rem);
  line-height: 1.05;
  max-width: 15ch;
}

/* 6) Excerpt clamp so CTA doesn't get pushed below fold */
.zzjz-carousel-excerpt {
  margin: 0 0 16px 0 !important;
  max-width: 42ch;
  font-size: 1rem;
  line-height: 1.45;

  display: -webkit-box;
  -webkit-line-clamp: 3;      /* key fix */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 7) Ensure CTA always stays visible */
.zzjz-carousel-button {
  margin-top: 2px;
  margin-bottom: 0;
  position: relative;
  z-index: 4;
}

/* 8) Bottom controls sit cleanly */
.zzjz-carousel-dots {
  bottom: 14px;
  right: 18px;
  z-index: 5;
}

.zzjz-carousel-prev,
.zzjz-carousel-next {
  z-index: 5;
}

/* 9) Right quick-links panel background less "flat purple", more clean */
.zzjz-hz-side-panel {
  background: color-mix(in srgb, #0047ab 12%, white 88%) !important;
  border: 1px solid color-mix(in srgb, #0047ab 20%, white 80%) !important;
  border-radius: 16px;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
  padding: 14px;
}

/* 10) Quick-link cards inside right panel */
.zzjz-hz-side-links li a {
  display: block;
  background: color-mix(in srgb, #0047ab 10%, white 90%) !important;
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%) !important;
  border-radius: 12px;
  color: #0f172a !important;
  padding: 14px 16px;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
}

.zzjz-hz-side-links li a:hover {
  background: color-mix(in srgb, #0047ab 14%, white 86%) !important;
  border-color: color-mix(in srgb, #0047ab 28%, white 72%) !important;
  transform: translateY(-1px);
}

/* optional arrow look */
.zzjz-hz-side-links li a::before {
  content: "›";
  color: #0047ab;
  font-weight: 700;
  margin-right: 10px;
}

/* 11) If the shortcode/plugin injects extra bottom whitespace wrappers */
.zzjz-hero-carousel p {
  margin-top: 0;
  margin-bottom: 0;
}

/* Hide empty wpautop leftovers safely */
.zzjz-hero-carousel p:empty {
  display: none !important;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1200px) {
  .zzjz-hero-carousel,
  .zzjz-carousel-slides,
  .zzjz-hz-hero-main,
  .zzjz-hz-hero-side,
  .zzjz-hz-side-panel {
    height: 520px;
    min-height: 520px;
  }

  .zzjz-carousel-content {
    width: min(520px, 64%);
    padding: 28px 28px 18px;
  }

  .zzjz-carousel-title {
    font-size: clamp(1.6rem, 2.2vw, 2.4rem);
    max-width: 16ch;
  }
}

@media (max-width: 900px) {
  .zzjz-hz-hero-wrap {
    flex-direction: column;
  }

  .zzjz-hero-carousel,
  .zzjz-carousel-slides,
  .zzjz-hz-hero-main {
    height: 460px;
    min-height: 460px;
  }

  .zzjz-hz-hero-side,
  .zzjz-hz-side-panel {
    height: auto;
    min-height: unset;
  }

  .zzjz-carousel-content {
    width: 100%;
    max-width: none;
    bottom: 52px;
    padding: 20px 18px 14px;
    justify-content: flex-end;
  }

  .zzjz-carousel-title {
    font-size: 1.6rem;
    max-width: 18ch;
  }

  .zzjz-carousel-excerpt {
    font-size: 0.95rem;
    -webkit-line-clamp: 2;
  }

  .zzjz-carousel-button {
    padding: 10px 14px;
    font-size: 0.92rem;
  }
}
.zzjz-carousel-title a {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* =========================================================
   MOBILE FIX v2 — hero overlap + header title wrapping
   ========================================================= */
@media (max-width: 600px) {

  /* -----------------------------
     HEADER: logo + site name
     ----------------------------- */

  /* Make header row align nicely and prevent weird wrapping */
  .site-header .wp-block-group,
  header.wp-block-template-part .wp-block-group {
    align-items: center !important;
  }

  /* If header has logo + title in columns/flex */
  .site-header .wp-block-site-logo,
  header.wp-block-template-part .wp-block-site-logo {
    flex: 0 0 auto !important;
    margin-right: 10px !important;
  }

  /* Site title text: smaller, cleaner wrapping */
  .site-header .wp-block-site-title,
  .site-header .site-title,
  header.wp-block-template-part .wp-block-site-title,
  header.wp-block-template-part .site-title {
    max-width: calc(100vw - 130px) !important;
    font-size: 0.95rem !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    margin: 0 !important;

    /* better line breaks */
    white-space: normal !important;
    text-wrap: balance;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: auto;
  }

  .site-header .wp-block-site-title a,
  .site-header .site-title a,
  header.wp-block-template-part .wp-block-site-title a,
  header.wp-block-template-part .site-title a {
    display: block;
    text-decoration: none;
    line-height: inherit !important;
  }

  /* -----------------------------
     HERO: size + layout
     ----------------------------- */

  .zzjz-hz-hero-main,
  .zzjz-hero-carousel,
  .zzjz-carousel-slides {
    height: 420px !important;
    min-height: 420px !important;
    border-radius: 16px 16px 0 0 !important;
    overflow: hidden !important;
  }

  /* Make photo crop less awkward for portrait */
  .zzjz-carousel-image img {
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* Strong readable overlay */
  .zzjz-carousel-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(8, 20, 45, 0.12) 0%,
        rgba(8, 20, 45, 0.30) 35%,
        rgba(8, 20, 45, 0.62) 68%,
        rgba(8, 20, 45, 0.82) 100%
      ),
      linear-gradient(
        90deg,
        rgba(8, 20, 45, 0.55) 0%,
        rgba(8, 20, 45, 0.20) 60%,
        rgba(8, 20, 45, 0.05) 100%
      ) !important;
  }

  /* Content anchored lower, with room for controls */
  .zzjz-carousel-content {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: 52px !important; /* room for dots */
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 14px 0 14px !important;
    z-index: 5 !important;
  }

  /* Date badge */
  .zzjz-carousel-date,
  .zzjz-carousel-content .zzjz-date,
  .zzjz-carousel-content .post-date {
    display: inline-block !important;
    margin: 0 0 10px 0 !important;
    padding: 8px 12px !important;
    border-radius: 12px !important;
    font-size: 0.78rem !important;
    line-height: 1.15 !important;
    max-width: 130px !important;
    white-space: normal !important;
    font-weight: 700 !important;
  }

  /* TITLE: reduce overlap with arrows by narrowing width */
  .zzjz-carousel-title {
    margin: 0 0 8px 0 !important;
    width: calc(100% - 96px) !important; /* leaves room for arrows */
    max-width: 240px !important;
    font-size: 1rem !important;
    line-height: 1.08 !important;
    letter-spacing: -0.01em !important;
    text-wrap: pretty;
  }

  .zzjz-carousel-title a {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-decoration: none !important;
    hyphens: auto;
    overflow-wrap: anywhere;
  }

  /* Excerpt shorter and aligned */
  .zzjz-carousel-excerpt {
    margin: 0 0 10px 0 !important;
    width: calc(100% - 40px) !important;
    max-width: 250px !important;
    font-size: 0.88rem !important;
    line-height: 1.3 !important;
    color: rgba(255,255,255,.95) !important;

    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  /* CTA */
  .zzjz-carousel-button,
  .zzjz-carousel-content .wp-element-button,
  .zzjz-carousel-content a.zzjz-hz-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 10px 14px !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    font-size: 0.9rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  /* -----------------------------
     HERO CONTROLS: arrows + dots
     ----------------------------- */

  .zzjz-carousel-prev,
  .zzjz-carousel-next {
    width: 36px !important;
    height: 36px !important;
    top: 46% !important;               /* slightly higher than text */
    transform: translateY(-50%) !important;
    z-index: 7 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.95) !important;
    box-shadow: 0 4px 10px rgba(0,0,0,.12) !important;
  }

  .zzjz-carousel-prev { left: 10px !important; }
  .zzjz-carousel-next { right: 10px !important; }

  /* Dots centered so they don't look random on right side */
  .zzjz-carousel-dots {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 10px !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    gap: 6px !important;
    z-index: 7 !important;
  }

  .zzjz-carousel-dots button,
  .zzjz-carousel-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 999px !important;
    opacity: 0.95 !important;
  }

  .zzjz-carousel-dots .is-active,
  .zzjz-carousel-dot.is-active {
    width: 18px !important;
  }

  /* -----------------------------
     RIGHT PANEL under hero
     ----------------------------- */
  .zzjz-hz-side-panel {
    border-radius: 0 0 16px 16px !important;
    padding: 10px !important;
  }

  .zzjz-hz-side-links li a {
    font-size: 0.92rem !important;
    line-height: 1.25 !important;
    padding: 12px !important;
    border-radius: 10px !important;
  }
}
/* =========================================================
   HZJZ-style news cards polish (Aktualnosti + Odluke/Konkursi)
   ========================================================= */

/* Card internals spacing */
.zzjz-hz-news-item {
  position: relative;
  padding: 12px 14px 44px; /* extra top + bottom room for date */
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.zzjz-hz-news-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(11, 99, 182, 0.08);
}

/* Title spacing */
.zzjz-hz-news-item .wp-block-post-title,
.zzjz-hz-news-item h3 {
  margin-top: 8px !important;   /* <- this is the header top breathing room */
  margin-bottom: 8px !important;
  line-height: 1.22;
}

/* Title link styling */
.zzjz-hz-news-item .wp-block-post-title a {
  text-decoration: none;
  color: var(--wp--preset--color--ink, #0f172a);
}

.zzjz-hz-news-item:hover .wp-block-post-title a {
  color: #0047ab;
}

/* Excerpt spacing */
.zzjz-hz-news-item .wp-block-post-excerpt,
.zzjz-hz-news-item .wp-block-post-excerpt__excerpt {
  margin-top: 4px !important;
  margin-bottom: 0 !important;
  color: color-mix(in srgb, #0f172a 68%, white 32%);
  line-height: 1.42;
}

/* Date badge anchored bottom-left */
.zzjz-hz-news-item .zzjz-hz-news-date,
.zzjz-hz-news-item .wp-block-post-date {
  position: absolute;
  left: 14px;
  bottom: 12px;
  margin: 0 !important;
}

/* Make stretched-link host */
.zzjz-hz-news-item .wp-block-post-title {
  position: static;
}

/* Optional: make link fill card using pseudo-element */
.zzjz-hz-news-item .wp-block-post-title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Keep actual text above stretched-link overlay for selection/hover clarity */
.zzjz-hz-news-item .wp-block-post-title a,
.zzjz-hz-news-item .wp-block-post-excerpt,
.zzjz-hz-news-item .wp-block-post-date {
  position: relative;
  z-index: 2;
}

/* Date badge should not block click */
.zzjz-hz-news-item .wp-block-post-date {
  pointer-events: none;
}
/* ============================================================
   HOMEPAGE CARDS (Novosti + Odluke) — archive-like visuals
   ============================================================ */

.zzjz-home-card-grid {
  margin-top: 0.5rem;
}

.zzjz-home-card-grid .wp-block-post-template {
  gap: 1rem;
}

.zzjz-home-card {
  position: relative;
  cursor: pointer;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.zzjz-home-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.10);
  border-color: color-mix(in srgb, #0047ab 35%, white 65%);
}

/* Featured image inside the card */
.zzjz-home-card .wp-block-post-featured-image {
  margin: 0;
  line-height: 0;
  border-bottom: 1px solid color-mix(in srgb, #0047ab 12%, white 88%);
}

.zzjz-home-card .wp-block-post-featured-image a {
  display: block;
}

.zzjz-home-card .wp-block-post-featured-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

/* Card body */
.zzjz-home-card__body {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.9rem 1rem 1rem;
  min-height: 210px;
}

/* Date badge */
.zzjz-home-card__date {
  display: inline-flex;
  align-self: flex-start;
  margin: 0 0 0.2rem 0 !important;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  background: color-mix(in srgb, #0047ab 10%, white 90%);
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%);
  color: #0047ab;
  font-weight: 700;
  font-size: 0.82rem;
  line-height: 1.1;
}

/* Title spacing fix (what you asked) */
.zzjz-home-card__title {
  margin: 0.15rem 0 0.2rem 0 !important; /* adds breathing room from top */
  padding-top: 0.15rem;                  /* extra safety */
  line-height: 1.22;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--wp--preset--color--ink, #0f172a);
}

/* Clamp title so long konkurs titles don't wreck layout */
.zzjz-home-card__title a {
  color: inherit;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;         /* 2 lines for uniformity */
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative;
  z-index: 2; /* stays above overlay text layers */
}

.zzjz-home-card__title a:hover {
  color: #0047ab;
}

/* Excerpt */
.zzjz-home-card__excerpt {
  margin: 0;
  color: color-mix(in srgb, #0f172a 78%, white 22%);
  font-size: 0.95rem;
  line-height: 1.45;
}

.zzjz-home-card__excerpt p {
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;         /* keep even card heights */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Keep "read more" text style nice if rendered in excerpt */
.zzjz-home-card__excerpt .wp-block-post-excerpt__more-link {
  position: relative;
  z-index: 6;
  display: inline-block;
  margin-top: .4rem;
  color: #0047ab;
  font-weight: 700;
  text-decoration: none;
}

/* Make title link generate a full-card overlay */
.zzjz-home-card__title a {
  position: static !important; /* IMPORTANT: don't trap ::after inside title area */
}

/* This becomes the invisible full-card clickable layer */
.zzjz-home-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;              /* cover entire card */
  z-index: 5;            /* above text/blank area */
  background: transparent;
  border-radius: inherit;
}

/* Keep visible interactive elements above overlay (optional but nice) */
.zzjz-home-card .wp-block-post-featured-image a,
.zzjz-home-card__title a,
.zzjz-home-card__excerpt .wp-block-post-excerpt__more-link {
  position: relative;
  z-index: 6;
}

/* Optional: keep date badge also above */
.zzjz-home-card__date {
  position: relative;
  z-index: 6;
}

.zzjz-home-card:focus-within {
  outline: 2px solid color-mix(in srgb, #0B63B6 45%, white 55%);
  outline-offset: 2px;
}

.zzjz-home-card__body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.zzjz-home-card__excerpt {
  flex: 1; /* pushes "Pročitaj više" lower and evens cards visually */
}

/* Mobile layout for these cards */
@media (max-width: 1024px) {
  .zzjz-home-card-grid .wp-block-post-template {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 640px) {
  .zzjz-home-card-grid .wp-block-post-template {
    grid-template-columns: 1fr !important;
  }

  .zzjz-home-card__body {
    min-height: unset;
    padding: 0.85rem 0.9rem 0.95rem;
  }

  .zzjz-home-card__title {
    font-size: 1rem;
  }
}
/* =========================================================
   SHARED SOFT PANEL COLOR (homepage-like)
   ========================================================= */
:root {
  --zzjz-soft-panel: color-mix(in srgb, blue 15%, white 85%);
  --zzjz-soft-panel-border: color-mix(in srgb, blue 24%, white 76%);
  --zzjz-soft-card: #ffffff;
  --zzjz-ink: #0f172a;
  --zzjz-primary: #0B63B6;
}

/* Fallback for browsers that don't support color-mix well */
@supports not (background: color-mix(in srgb, blue 15%, white 85%)) {
  :root {
    --zzjz-soft-panel: #dfe5ff;
    --zzjz-soft-panel-border: #c6cff8;
  }
}

/* =========================================================
   ARCHIVE NOVOSTI PANEL
   ========================================================= */
.zzjz-archive-panel {
  background: var(--zzjz-soft-panel);
  border: 1px solid var(--zzjz-soft-panel-border);
  border-radius: 18px;
  padding: 1rem 1rem 1.25rem;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
}

.zzjz-archive-panel .zzjz-hz-section-head {
  margin: 0 0 0.9rem;
  padding: 0 0 0.9rem;
  border-bottom: 1px solid var(--zzjz-soft-panel-border);
}

.zzjz-archive-panel .zzjz-hz-section-head h2 {
  margin: 0;
  font-size: clamp(1.3rem, 1.1rem + 0.7vw, 2rem);
  line-height: 1.2;
  color: var(--zzjz-ink);
  font-weight: 800;
  letter-spacing: -0.02em;
  position: relative;
  padding-left: 0.95rem;
}

.zzjz-archive-panel .zzjz-hz-section-head h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.12em;
  width: 4px;
  height: 1.1em;
  border-radius: 999px;
  background: var(--zzjz-primary);
}

/* =========================================================
   ARCHIVE CARDS (same family as homepage)
   ========================================================= */
.zzjz-archive-cards {
  gap: 1rem !important;
}

.zzjz-archive-cards .zzjz-card {
  background: #fff;
  border: 1px solid #cfd8e6;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.zzjz-archive-cards .zzjz-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.08);
  border-color: #b6c6df;
}

.zzjz-archive-cards .wp-block-post-featured-image {
  margin: 0;
  line-height: 0;
  border-bottom: 1px solid #e6edf6;
}

.zzjz-archive-cards .wp-block-post-featured-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* Slightly nicer spacing inside card */
.zzjz-archive-cards .zzjz-card-content {
  padding: 0.95rem 1rem 1rem !important;
}

/* Title spacing / typography */
.zzjz-archive-cards .wp-block-post-title {
  margin-top: 0.45rem !important;
  margin-bottom: 0.15rem !important;
  line-height: 1.25;
}

.zzjz-archive-cards .wp-block-post-title a {
  color: var(--zzjz-ink);
  text-decoration: none;
}

.zzjz-archive-cards .wp-block-post-title a:hover {
  color: var(--zzjz-primary);
}

/* Date badge */
.zzjz-archive-cards .zzjz-date {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: .35rem .7rem;
  border-radius: 10px;
  background: #e7f0fb;
  color: #0a58a8;
  border: 1px solid #c7daf3;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1;
}

/* Excerpt */
.zzjz-archive-cards .wp-block-post-excerpt {
  margin-top: 0.35rem;
  color: #475569;
  line-height: 1.65;
}

.zzjz-archive-cards .wp-block-post-excerpt__more-link {
  color: var(--zzjz-primary);
  font-weight: 700;
  text-decoration: none;
}

.zzjz-archive-cards .wp-block-post-excerpt__more-link:hover {
  text-decoration: underline;
}

/* =========================================================
   UNIVERSAL PAGE CONTENT PANEL (img2 red box area)
   Targets common page content wrappers
   ========================================================= */

/* Gutenberg page/post content wrappers */
body.page .entry-content > .wp-block-group,
body.page .wp-site-blocks main .wp-block-post-content > .wp-block-group,
body.page .wp-site-blocks main .wp-block-post-content > .is-layout-constrained {
  background: var(--zzjz-soft-panel);
  border: 1px solid var(--zzjz-soft-panel-border);
  border-radius: 18px;
  padding: 1.2rem 1.35rem;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

/* If page content is directly in post-content without nested group */
body.page .wp-site-blocks main .wp-block-post-content {
  background: transparent;
}

/* Page titles styled like archive/home titles */
body.page .wp-block-post-title,
body.page h1 {
  color: var(--zzjz-ink);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

/* Optional: give the H1 a left accent line similar to sections */
body.page .wp-block-post-title {
  position: relative;
  padding-left: 0.95rem;
  margin-bottom: 1.1rem;
}

body.page .wp-block-post-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.12em;
  width: 4px;
  height: 1.05em;
  border-radius: 999px;
  background: #ff3b30; /* keep your red accent if you like */
}

/* =========================================================
   BETTER PAGINATION (site-wide Query Loop pagination)
   ========================================================= */
.zzjz-pagination,
.wp-block-query-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .5rem;
}

.wp-block-query-pagination a,
.wp-block-query-pagination span {
  min-width: 2.4rem;
  height: 2.4rem;
  padding: 0 .8rem;
  border-radius: 10px;
  border: 1px solid #c7d4e6;
  background: #fff;
  color: var(--zzjz-ink);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  line-height: 1;
  transition: all .15s ease;
}

.wp-block-query-pagination a:hover {
  border-color: #9ec0ea;
  color: var(--zzjz-primary);
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(11, 99, 182, 0.10);
}

.wp-block-query-pagination .is-selected,
.wp-block-query-pagination .current {
  background: linear-gradient(180deg, #1672cf, #0B63B6);
  color: #fff;
  border-color: #0B63B6;
  box-shadow: 0 6px 16px rgba(11, 99, 182, 0.22);
}

/* Prev / Next pills */
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
  padding-inline: 1rem !important;
  min-width: auto !important;
}

/* Mobile tightening */
@media (max-width: 782px) {
  .zzjz-archive-panel {
    padding: 0.8rem 0.75rem 1rem;
    border-radius: 14px;
  }

  .zzjz-archive-cards {
    gap: 0.75rem !important;
  }

  .wp-block-query-pagination a,
  .wp-block-query-pagination span {
    height: 2.2rem;
    min-width: 2.2rem;
    border-radius: 9px;
    font-size: .92rem;
  }

  body.page .entry-content > .wp-block-group,
  body.page .wp-site-blocks main .wp-block-post-content > .wp-block-group,
  body.page .wp-site-blocks main .wp-block-post-content > .is-layout-constrained {
    padding: 1rem;
    border-radius: 14px;
  }
}
/* =========================================================
   PAGE TEMPLATE POLISH (matches homepage soft panel style)
   ========================================================= */

:root {
  --zzjz-soft-panel: color-mix(in srgb, blue 15%, white 85%);
  --zzjz-soft-panel-border: color-mix(in srgb, blue 24%, white 76%);
  --zzjz-ink: #0f172a;
  --zzjz-primary: #0B63B6;
}

@supports not (background: color-mix(in srgb, blue 15%, white 85%)) {
  :root {
    --zzjz-soft-panel: #dfe5ff;
    --zzjz-soft-panel-border: #c6cff8;
  }
}

/* Page title like archive/home section */
.zzjz-page-title,
body.page .wp-block-post-title {
  color: var(--zzjz-ink);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  position: relative;
  padding-left: 0.95rem;
  margin-bottom: 1rem !important;
  font-size: clamp(1.7rem, 1.25rem + 1.6vw, 3rem);
}

.zzjz-page-title::before,
body.page .wp-block-post-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.13em;
  width: 4px;
  height: 1.05em;
  border-radius: 999px;
  background: #ff3b30; /* or var(--zzjz-primary) if you want blue */
}

/* Main page content panel */
.zzjz-page-content-panel {
  background: var(--zzjz-soft-panel);
  border: 1px solid var(--zzjz-soft-panel-border);
  border-radius: 18px;
  padding: 1.25rem 1.35rem;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

/* Keep inner content readable */
.zzjz-page-content-panel .wp-block-post-content,
.zzjz-page-content-panel p,
.zzjz-page-content-panel li {
  color: #334155;
  line-height: 1.75;
}

/* Nice headings inside pages */
.zzjz-page-content-panel h2,
.zzjz-page-content-panel h3,
.zzjz-page-content-panel h4 {
  color: var(--zzjz-ink);
  line-height: 1.25;
  margin-top: 0.2rem;
}

/* Subtle top divider look if the page starts with a heading block */
.zzjz-page-content-panel > *:first-child {
  margin-top: 0 !important;
}

/* =========================================================
   EMPTY GAP CLEANUP (common Gutenberg empties in pages)
   ========================================================= */

/* Remove totally empty paragraphs/spacer-like empties inside page content */
.zzjz-page-content-panel .wp-block-post-content p:empty {
  display: none;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide empty groups that sometimes remain after edits */
.zzjz-page-content-panel .wp-block-post-content .wp-block-group:empty {
  display: none;
}

/* Hide empty image wrappers / featured image blocks if inserted but empty */
.zzjz-page-content-panel .wp-block-image:not(:has(img)),
.zzjz-page-content-panel .wp-block-post-featured-image:not(:has(img)) {
  display: none;
}

/* If a spacer is too large on pages, cap it */
.zzjz-page-content-panel .wp-block-spacer {
  max-height: 2rem;
}

/* =========================================================
   BETTER QUERY PAGINATION (site-wide)
   ========================================================= */
.wp-block-query-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: 2rem;
}

.wp-block-query-pagination a,
.wp-block-query-pagination span {
  min-width: 2.35rem;
  height: 2.35rem;
  padding: 0 .8rem;
  border-radius: 10px;
  border: 1px solid #c7d4e6;
  background: #fff;
  color: var(--zzjz-ink);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  line-height: 1;
  transition: all .15s ease;
}

.wp-block-query-pagination a:hover {
  border-color: #9ec0ea;
  color: var(--zzjz-primary);
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(11, 99, 182, 0.10);
}

.wp-block-query-pagination .is-selected,
.wp-block-query-pagination .current {
  background: linear-gradient(180deg, #1672cf, #0B63B6);
  color: #fff;
  border-color: #0B63B6;
  box-shadow: 0 6px 16px rgba(11, 99, 182, 0.22);
}

.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
  min-width: auto !important;
  padding-inline: 1rem !important;
}

/* Mobile */
@media (max-width: 782px) {
  .zzjz-page-content-panel {
    border-radius: 14px;
    padding: 1rem;
  }

  .zzjz-page-title,
  body.page .wp-block-post-title {
    padding-left: 0.8rem;
    margin-bottom: 0.85rem !important;
  }

  .wp-block-query-pagination a,
  .wp-block-query-pagination span {
    height: 2.15rem;
    min-width: 2.15rem;
    border-radius: 9px;
    font-size: .92rem;
  }
}
.zzjz-page-section-title {
  font-size: clamp(1.65rem, 2.2vw, 2.15rem); /* was smaller */
}

.zzjz-tijela-label {
  font-size: 1.06rem;
}

.zzjz-tijela-name {
  font-size: 1.05rem;
}

.zzjz-tijela-list li {
  font-size: 1.03rem;
  line-height: 1.6;
}
.zzjz-tijela-card {
  padding: 1.25rem 1.35rem;
}

.zzjz-tijela-group + .zzjz-tijela-group {
  margin-top: 1.05rem;
  padding-top: 0.95rem;
}

/* =========================================================
   ODLUKE / KONKURSI — match Aktualnosti closer
   ========================================================= */

#main-content .zzjz-hz-odluke {
  background: var(--hz-light-surface-2) !important;
  border: 1px solid #cbd6e8 !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  padding: 0.9rem 0.95rem 1rem !important;
}

#main-content .zzjz-hz-odluke > .zzjz-hz-section-head {
  margin: 0 0 0.75rem 0 !important;
  padding: 0 0 0.7rem 0 !important;
  border-bottom: 1px solid #bfcde4 !important;
}

#main-content .zzjz-hz-odluke > .zzjz-hz-section-head h2 {
  font-family: var(--font-sans) !important;
  font-size: 0.98rem !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  color: #0e2e60 !important;
  letter-spacing: -0.01em !important;
}

#main-content .zzjz-hz-odluke > .zzjz-hz-section-head h2::before {
  background: #1d6fe8 !important;
  box-shadow: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-hz-subsection {
  margin: 0 0 0.9rem 0 !important;
  padding: 0 !important;
}

#main-content .zzjz-hz-odluke .zzjz-hz-subsection:last-child {
  margin-bottom: 0 !important;
}

#main-content .zzjz-hz-odluke .zzjz-hz-subsection > .zzjz-hz-section-head {
  margin: 0 0 0.7rem 0 !important;
  padding: 0 0 0.55rem 0 !important;
  border-bottom: 1px solid #bfcde4 !important;
}

#main-content .zzjz-hz-odluke .zzjz-hz-subsection > .zzjz-hz-section-head h3 {
  font-family: var(--font-sans) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  color: #0e2e60 !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
}

#main-content .zzjz-hz-odluke .zzjz-hz-subsection > .zzjz-hz-section-head h3::before {
  content: "" !important;
  display: inline-block !important;
  width: 4px !important;
  height: 0.95em !important;
  margin-right: 0.45rem !important;
  border-radius: 999px !important;
  background: #1d6fe8 !important;
  vertical-align: -0.08em !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid {
  gap: 0.9rem !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card {
  min-height: 168px !important;
  background: #f7f9fd !important;
  border: 1px solid #c7d4e6 !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 0.65rem 0.75rem 0.7rem !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card::before {
  left: 10px !important;
  right: 10px !important;
  height: 2px !important;
  background: #6ea4ff !important;
}

#main-content .zzjz-hz-odluke .wp-block-post-featured-image {
  display: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card__body {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.2rem !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card__date,
#main-content .zzjz-hz-odluke .zzjz-hz-news-date,
#main-content .zzjz-hz-odluke .wp-block-post-date {
  position: static !important;
  align-self: flex-start !important;
  margin: 0 0 0.2rem 0 !important;
  padding: 0.2rem 0.45rem !important;
  border-radius: 999px !important;
  font-family: var(--font-sans) !important;
  font-size: 0.52rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
  color: #0b63b6 !important;
  background: #dbe6f5 !important;
  border: 1px solid #c5d5ec !important;
  text-transform: uppercase !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card__title,
#main-content .zzjz-hz-odluke .wp-block-post-title {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--font-sans) !important;
  font-size: 0.52rem !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
  color: #0f2647 !important;
  text-transform: uppercase !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card__title::before,
#main-content .zzjz-hz-odluke .wp-block-post-title::before {
  display: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card__title a,
#main-content .zzjz-hz-odluke .wp-block-post-title a {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-transform: inherit !important;
  color: inherit !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card__excerpt,
#main-content .zzjz-hz-odluke .wp-block-post-excerpt {
  display: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-hz-section-cta {
  margin-top: 0.55rem !important;
}

#main-content .zzjz-hz-odluke .zzjz-archive-link {
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  padding: 0.26rem 0.6rem !important;
  border-radius: 4px !important;
}

/* =========================================================
   HOMEPAGE ODLUKE/KONKURSI -> match Novosti cards
   ========================================================= */

.zzjz-hz-odluke {
  background: var(--hz-light-surface-2) !important;
  border: 1px solid var(--hz-light-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08) !important;
  padding: 1rem !important;
}

.zzjz-hz-odluke .zzjz-hz-subsection {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 0 1.1rem !important;
}

.zzjz-hz-odluke .zzjz-hz-subsection:last-child {
  margin-bottom: 0 !important;
}

.zzjz-hz-odluke .zzjz-hz-section-head {
  margin-bottom: 0.9rem !important;
  padding-bottom: 0.65rem !important;
  border-bottom: 1px solid var(--hz-light-border) !important;
}

.zzjz-hz-odluke .zzjz-hz-section-head h2,
.zzjz-hz-odluke .zzjz-hz-section-head h3 {
  color: #0a1e3c !important;
  font-size: clamp(1.05rem, 1.1vw, 1.3rem) !important;
  line-height: 1.18 !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
}

.zzjz-hz-odluke .zzjz-home-card-grid {
  gap: 1rem !important;
}

.zzjz-hz-odluke .zzjz-home-card {
  min-height: 240px !important;
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05) !important;
  padding: 0.95rem 1rem 1rem !important;
}

.zzjz-hz-odluke .zzjz-home-card::before {
  left: 14px !important;
  right: 14px !important;
  height: 3px !important;
  background: linear-gradient(90deg, #2f7df6 0%, #4f93ff 45%, #8bb7ff 100%) !important;
}

.zzjz-hz-odluke .zzjz-home-card:hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, #0047ab 35%, white 65%) !important;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.10) !important;
}

.zzjz-hz-odluke .wp-block-post-featured-image {
  display: none !important;
}

.zzjz-hz-odluke .zzjz-home-card__body {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.45rem !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 0 !important;
}

.zzjz-hz-odluke .zzjz-home-card__date,
.zzjz-hz-odluke .zzjz-hz-news-date,
.zzjz-hz-odluke .wp-block-post-date {
  position: static !important;
  align-self: flex-start !important;
  margin: 0 0 0.15rem 0 !important;
  padding: 0.28rem 0.65rem !important;
  border-radius: 999px !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: #0047ab !important;
  background: color-mix(in srgb, #0047ab 10%, white 90%) !important;
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%) !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
}

.zzjz-hz-odluke .zzjz-home-card__title,
.zzjz-hz-odluke .wp-block-post-title {
  margin: 0.15rem 0 0.2rem 0 !important;
  padding: 0 !important;
  font-size: 1rem !important;
  line-height: 1.22 !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  color: #0f172a !important;
}

.zzjz-hz-odluke .zzjz-home-card__title::before,
.zzjz-hz-odluke .wp-block-post-title::before {
  display: none !important;
}

.zzjz-hz-odluke .zzjz-home-card__title a,
.zzjz-hz-odluke .wp-block-post-title a {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  color: inherit !important;
  font: inherit !important;
  text-decoration: none !important;
}

.zzjz-hz-odluke .zzjz-home-card__title a:hover,
.zzjz-hz-odluke .wp-block-post-title a:hover {
  color: #0047ab !important;
}

.zzjz-hz-odluke .zzjz-home-card__excerpt,
.zzjz-hz-odluke .wp-block-post-excerpt {
  display: block !important;
  margin: 0 !important;
  color: color-mix(in srgb, #0f172a 78%, white 22%) !important;
  font-size: 0.92rem !important;
  line-height: 1.45 !important;
  flex: 1 1 auto !important;
}

.zzjz-hz-odluke .zzjz-home-card__excerpt p,
.zzjz-hz-odluke .wp-block-post-excerpt p {
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

.zzjz-hz-odluke .wp-block-post-excerpt__more-link,
.zzjz-hz-odluke .zzjz-home-card__more {
  display: inline-block !important;
  margin-top: 0.4rem !important;
  color: #0047ab !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.zzjz-hz-odluke .zzjz-hz-section-cta {
  margin-top: 0.8rem !important;
}

.zzjz-hz-odluke .zzjz-archive-link {
  font-size: 0.75rem !important;
  padding: 0.3rem 0.7rem !important;
}

@media (max-width: 782px) {
  .zzjz-hz-odluke .zzjz-home-card {
    min-height: 190px !important;
    padding: 0.9rem !important;
  }

  .zzjz-hz-odluke .zzjz-home-card__title,
  .zzjz-hz-odluke .wp-block-post-title {
    font-size: 0.95rem !important;
    line-height: 1.25 !important;
  }
}

/* =========================================================
   ODLUKE/KONKURSI SHORTCODE FINAL OVERRIDE
   Uses actual [zzjz_konkurs_grid] markup
   ========================================================= */

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1rem !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke > .zzjz-home-card--konkurs {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  min-height: 170px !important;
  height: auto !important;
  padding: 0.85rem 1rem 0.95rem !important;
  border-radius: 16px !important;
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%) !important;
  background: #fff !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05) !important;
  overflow: hidden !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke > .zzjz-home-card--konkurs::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 14px !important;
  right: 14px !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #2f7df6 0%, #4f93ff 45%, #8bb7ff 100%) !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke > .zzjz-home-card--konkurs:hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, #0047ab 35%, white 65%) !important;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.10) !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .wp-block-post-featured-image {
  display: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__body {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.35rem !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__date {
  position: static !important;
  align-self: flex-start !important;
  margin: 0 0 0.15rem 0 !important;
  padding: 0.28rem 0.65rem !important;
  border-radius: 999px !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  color: #0047ab !important;
  background: color-mix(in srgb, #0047ab 10%, white 90%) !important;
  border: 1px solid color-mix(in srgb, #0047ab 18%, white 82%) !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__title {
  margin: 0.1rem 0 0.15rem 0 !important;
  padding: 0 !important;
  font-size: 0.98rem !important;
  line-height: 1.24 !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  color: #0f172a !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__title::before {
  display: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__title a {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  color: inherit !important;
  font: inherit !important;
  text-decoration: none !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__title a:hover {
  color: #0047ab !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__excerpt {
  display: block !important;
  margin: 0 !important;
  color: color-mix(in srgb, #0f172a 78%, white 22%) !important;
  font-size: 0.9rem !important;
  line-height: 1.45 !important;
  flex: 0 0 auto !important;
  min-height: 0 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__excerpt p {
  margin: 0 !important;
}

#main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke .zzjz-home-card__excerpt:empty {
  display: none !important;
}

@media (max-width: 1200px) {
  #main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 640px) {
  #main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke {
    grid-template-columns: 1fr !important;
  }

  #main-content .zzjz-hz-odluke .zzjz-home-card-grid--odluke > .zzjz-home-card--konkurs {
    min-height: 150px !important;
    padding: 0.9rem !important;
  }
}