/* NG CMS - tema "zvezda" (sajt jednog izvodjaca). Mere i boje preuzete sa WP originala
   (hello-elementor + Elementor sablon zajednicki za sve zvezde). */

/* ---------- osnova (hello-elementor reset) ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: #fff; color: #333;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem; font-weight: 400; line-height: 1.5;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 { margin-block: .5rem 1rem; font-family: inherit; font-weight: 500; line-height: 1.2; color: inherit; }
h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } h3 { font-size: 1.75rem; } h4 { font-size: 1.5rem; } h5 { font-size: 1.25rem; } h6 { font-size: 1rem; }
p { margin-block: 0 .9rem; }
a { background-color: transparent; color: #c36; text-decoration: none; }
a:hover, a:active { color: #336; }
img { border-style: none; height: auto; max-width: 100%; }
b, strong { font-weight: bolder; }
table { border-collapse: collapse; max-width: 100%; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 1000; background: #fff; color: #333; padding: 8px 14px; }
.skip-link:focus { left: 8px; top: 8px; }
:focus-visible { outline: 2px solid #E20303; outline-offset: 2px; }

/* sadrzaj iz editora */
.z-prose > :last-child { margin-bottom: 0; }
.z-prose img { height: auto; max-width: 100%; }
.z-prose .aligncenter { display: block; margin-left: auto; margin-right: auto; }
.z-prose .alignleft { float: left; margin: 0 1.5em 1em 0; }
.z-prose .alignright { float: right; margin: 0 0 1em 1.5em; }
.z-prose .wp-caption { max-width: 100%; }
.z-prose::after { content: ""; display: table; clear: both; }
.z-prose iframe { max-width: 100%; }

.z-wrap { max-width: 1140px; margin: 0 auto; }

/* ---------- zaglavlje: logotipi levo, meni desno; lepi se za vrh ---------- */
.z-header { position: sticky; top: 0; z-index: 99; background: #fff; }
.z-header__in { display: flex; align-items: center; justify-content: center; min-height: 96px; padding: 0 50px; }
.z-header__logos, .z-header__nav { flex: 1 1 50%; min-width: 0; padding: 10px; }
.z-header__logos { display: flex; align-items: center; gap: 4px; }
.z-header__logo { flex: 0 0 auto; width: 170px; line-height: 0; }
.z-header__logo img { width: 170px; height: auto; }
.z-header__nav { display: flex; justify-content: flex-end; }
.z-header-gap { height: 21px; border-bottom: 1px solid #e20303; }

.z-nav ul { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.z-nav a {
  position: relative; display: block; padding: 13px 20px;
  font-family: "Roboto", sans-serif; font-size: 16px; line-height: 20px; font-weight: 600; color: #7A7A7A;
  transition: color .4s;
}
.z-nav a::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 3px;
  background: #E20303; opacity: 0; transition: opacity .4s;
}
.z-nav a:hover, .z-nav a:focus, .z-nav a.is-active { color: #E20303; }
.z-nav a:hover::after, .z-nav a:focus::after, .z-nav a.is-active::after { opacity: 1; }

.z-nav-toggle {
  display: none; margin: 0 auto; padding: .25em; border: 0; border-radius: 3px; cursor: pointer;
  background: rgba(0, 0, 0, .05); color: #33373d; font-size: 22px; line-height: 0;
}
.z-nav-toggle svg { width: 1em; height: 1em; fill: currentColor; }
.z-nav-toggle__close { display: none; }
.z-nav-toggle[aria-expanded="true"] .z-nav-toggle__open { display: none; }
.z-nav-toggle[aria-expanded="true"] .z-nav-toggle__close { display: inline; }

/* ---------- hero ---------- */
.z-hero { line-height: 0; }
.z-hero img { display: block; width: 100%; height: auto; }

/* ---------- aktuelna ponuda (#pocetna) ---------- */
.z-cur { width: 80%; margin: 0 auto; padding: 50px 0; background: #fff; text-align: center; }
.z-cur__intro, .z-gig--cur .z-gig__title {
  margin: .5rem 0 1rem; font-family: "Roboto", sans-serif; font-size: 40px; line-height: 1.2; font-weight: 500; color: #7A7A7A;
}
.z-gig--cur .z-gig__place { margin: 6px 0 30px; font-family: "Roboto", sans-serif; font-size: 25px; line-height: 1; font-weight: 600; color: #7A7A7A; }
.z-gig--cur .z-gig__img { margin: 0 0 20px; }
/* liste u tekstu aktuelne ponude: bez tackica (tekst je centriran, pa tackice vise smetaju nego sto pomazu) */
.z-gig--cur .z-gig__text ul, .z-gig--cur .z-gig__text ol { list-style: none; margin: 10px 0; padding: 0; }
.z-gig--cur .z-gig__text li { margin: 0 0 6px; }
.z-gig--cur .z-gig__text { margin-top: 10px; font-family: "Roboto", sans-serif; font-size: 22px; line-height: 1.5; font-weight: 400; color: #7A7A7A; text-align: center; }
.z-gig--cur + .z-gig--cur { margin-top: 50px; }
.z-cur__logos { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 20px; }
.z-cur__logos img { width: 192px; }
.z-cur__intro + .z-cur__logos { margin: 0 0 50px; }

/* ---------- crvena traka i slike ---------- */
.z-band { background: #E20303; padding: 50px 10px; }
.z-band__title { max-width: 1140px; margin: 0 auto; font-family: "Roboto", sans-serif; font-size: 32px; line-height: 1; font-weight: 600; color: #fff; text-align: center; }
.z-band-grid { background: #E20303; padding: 60px 10px; }
.z-band-grid__in { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; justify-items: center; }
.z-band-grid--2 .z-band-grid__in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.z-band-grid__item { min-width: 0; text-align: center; }
.z-band-grid__item img { display: block; margin: 0 auto; }
.z-band-grid__title { margin: 20px 0 10px; font-family: "Roboto", sans-serif; font-size: 32px; line-height: 1; font-weight: 600; color: #fff; }
.z-band-grid__text { font-family: "Roboto", sans-serif; font-size: 20px; line-height: 1.45; color: #fff; }
.z-band-grid__text a { color: #fff; text-decoration: underline; }

/* ---------- biografija ---------- */
.z-bio { padding: 50px 0; background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFFFA 100%); }
.z-bio__title { margin: 0 0 20px; font-family: "Roboto", sans-serif; font-size: 50px; line-height: 1; font-weight: 600; color: #4C4C4C; text-align: center; }
.z-bio__text { font-family: "Roboto", sans-serif; font-size: 20px; line-height: 1.5; color: #7A7A7A; text-align: center; }

/* ---------- dosadasnji nastupi ---------- */
.z-past { padding: 50px 0; background: #E20303; color: #fff; }
.z-past__title { margin: 0 0 60px; font-family: "Roboto", sans-serif; font-size: 32px; line-height: 1; font-weight: 600; color: #fff; text-align: center; }
.z-gig--past { padding: 0 10px; }
.z-gig--past .z-gig__title { margin: 40px 0 10px; font-family: "Roboto", sans-serif; font-size: 28px; line-height: 1; font-weight: 600; color: #fff; text-align: center; }
.z-gig--past:first-of-type .z-gig__title:first-child { margin-top: 0; }
.z-gig--past .z-gig__place { margin: 0 0 10px; font-family: "Roboto", sans-serif; font-size: 22px; font-weight: 600; text-align: center; }
.z-gig--past .z-gig__img { margin: 20px 0; text-align: center; line-height: 0; }
.z-gig--past .z-gig__img img { max-width: min(100%, 800px); }
.z-gig--past .z-gig__img:first-child { margin-top: 40px; }
.z-gig--past .z-gig__text { margin-top: 20px; font-family: "Roboto", sans-serif; font-size: 20px; line-height: 29px; font-weight: 700; color: #fff; }
.z-past--normal .z-gig--past .z-gig__text { font-weight: 400; }
.z-gig--past .z-gig__text p { margin-bottom: 14.4px; }
.z-past a { color: #fff; text-decoration: underline; }

/* ---------- blog ---------- */
.z-blog { max-width: 1140px; margin: 0 auto; padding: 100px 0 10px; }
.z-blog__title { margin: 0; padding: 12px 0 95px; font-family: "Roboto", sans-serif; font-size: 32px; line-height: 1; font-weight: 600; color: #000; text-align: center; }
.z-blog__desc { margin: -40px 0 40px; text-align: center; }
.z-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 35px 30px; }
.z-card { display: flex; flex-direction: column; background: #fff; border-radius: 3px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15); overflow: hidden; }
.z-card__thumb { display: block; line-height: 0; }
.z-card__thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.z-card__body { flex: 1 1 auto; padding: 0 30px; margin-top: 20px; }
.z-card__title { margin: 0 0 25px; font-family: "Roboto", sans-serif; font-size: 21px; line-height: 1.2; font-weight: 600; color: #54595F; }
.z-card__title a { color: inherit; }
.z-card__excerpt { margin: 0 0 25px; font-family: "Roboto", sans-serif; font-size: 14px; line-height: 1.5; color: #777; }
.z-card__more { display: inline-block; margin-bottom: 20px; font-family: "Roboto", sans-serif; font-size: 12px; font-weight: 500; text-transform: uppercase; color: #61CE70; }
.z-card__more:hover { color: #61CE70; }
.z-card__meta { padding: 15px 30px; border-top: 1px solid #eaeaea; font-family: "Roboto Slab", serif; font-size: 12px; line-height: 1.3; color: #adadad; }
.z-pagination { display: flex; justify-content: center; gap: 10px; margin-top: 0; font-family: "Roboto Slab", serif; font-size: 16px; line-height: 1.5; }
.z-pagination a { color: #CC3366; }
.z-pagination .is-current { color: #333; }

/* ---------- clanak / stranica ---------- */
.z-single { max-width: 1140px; margin: 0 auto; padding: 0 0 14px; }
.z-single__title { margin: .5rem 0 1rem; }
.z-crumbs { margin: 1rem 0 0; font-size: 14px; color: #777; }
.z-crumbs a { color: #777; text-decoration: underline; }
.z-crumbs span[aria-current] { color: #333; }
.z-single__meta { margin: -.5rem 0 1.2rem; font-family: "Roboto Slab", serif; font-size: 12px; color: #adadad; }
.z-single__content h2, .z-single__content h3 { margin-top: 1.2rem; }

/* ---------- footer ---------- */
/* na originalu je izmedju sadrzaja i footera prazan red od 20px (kontejner plutajucih ikonica) */
.z-footer { margin-top: 20px; border-top: 1px solid #e20303; background: #fff; }
.z-footer__in { max-width: 1140px; margin: 0 auto; display: flex; flex-wrap: wrap; padding: 10px; }
.z-footer__logos, .z-footer__text, .z-footer__friends { padding: 10px; }
.z-footer__logos { width: 20%; display: flex; flex-direction: column; align-items: center; gap: 20px; }
.z-footer__logo { width: 100%; text-align: center; line-height: 0; }
.z-footer__logo img { width: 69%; }
.z-footer__text { width: 27.163%; display: flex; flex-direction: column; justify-content: center; font-family: "Roboto", sans-serif; color: #7A7A7A; text-align: center; }
.z-footer__text p { margin-bottom: 14.4px; }
.z-footer__friends { width: 50%; font-family: "Roboto", sans-serif; color: #7A7A7A; text-align: center; }
.z-footer__friends p { margin: 0; }
.z-footer__friends h2 { margin: 0 0 20px; font-size: 32px; line-height: 1; font-weight: 600; color: #000; }
.z-footer__friends a { color: #CC3366; text-decoration: underline; margin: 0 5px; }
.z-footer__friends a:hover { color: #336; }

/* ---------- plutajuce ikonice (telefon, WhatsApp, Viber) ---------- */
.z-float__btn { position: fixed; z-index: 3333; display: block; width: 50px; height: 50px; line-height: 0; }
.z-float__btn svg { width: 50px; height: 50px; }
.z-float__btn--viber { bottom: 17px; right: 20px; }
.z-float__btn--whatsapp { bottom: 72px; right: 20px; }
.z-float__btn--phone { bottom: 127px; right: 30px; width: 40px; }
.z-float__btn--phone svg { width: 40px; }

/* ---------- tablet ---------- */
@media (max-width: 980px) {
  .z-header__in { padding: 0; }
  .z-header__logo { width: 32%; }
  .z-header__logo img { width: 100%; }
}
@media (max-width: 1024px) {
  .z-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- telefon ---------- */
@media (max-width: 767px) {
  .z-header__in { flex-wrap: wrap; min-height: 0; }
  .z-header__logos, .z-header__nav { flex: 0 0 100%; }
  .z-header__nav { position: relative; justify-content: center; }
  .z-nav-toggle { display: block; }
  .z-nav {
    position: absolute; left: 0; right: 0; top: 100%; z-index: 100; background: #fff;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .08); max-height: 0; overflow: hidden; transition: max-height .3s;
  }
  .z-nav.is-open { max-height: 80vh; overflow-y: auto; }
  .z-nav ul { flex-direction: column; }
  .z-nav a { padding: 13px 20px; font-weight: 500; color: #33373d; text-align: center; }
  .z-nav a::after { display: none; }
  .z-nav a:hover, .z-nav a:focus, .z-nav a.is-active { background: #3f444b; color: #fff; }

  .z-cur { width: 100%; }
  .z-cur__intro, .z-gig--cur .z-gig__title, .z-gig--cur .z-gig__place, .z-gig--cur .z-gig__text { padding: 0 30px; }
  .z-band, .z-band-grid { padding-left: 10px; padding-right: 10px; }
  .z-band__title { padding: 0 20px; }
  .z-band-grid--2 .z-band-grid__in { grid-template-columns: minmax(0, 1fr); }
  .z-bio, .z-past { padding-left: 30px; padding-right: 30px; }
  .z-gig--past { padding: 0; }
  .z-gig--past .z-gig__img { margin-left: -20px; margin-right: -20px; }
  .z-bio__title { font-size: 30px; }
  .z-blog { padding: 60px 20px 10px; }
  .z-blog__title { padding-bottom: 50px; }
  .z-cards { grid-template-columns: minmax(0, 1fr); }
  .z-single { padding: 0 30px 14px; }
  .z-footer__logos, .z-footer__text, .z-footer__friends { width: 100%; }
  .z-float__btn--viber, .z-float__btn--whatsapp { right: 20px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
/* sidra iz menija ne zavrsavaju ispod zalepljenog zaglavlja */
[id="pocetna"], [id="biografija"], [id="dosadasnji-nastupi"] { scroll-margin-top: 96px; }
@media (max-width: 767px) { [id="pocetna"], [id="biografija"], [id="dosadasnji-nastupi"] { scroll-margin-top: 126px; } }
