/* Župa Uznesenja BDM – Tuhelj
   Bijela, mirna stranica: Playfair Display (naslovi), PT Serif (tekst), Montserrat (izbornik, oznake) */
:root {
  --bijelo: #ffffff;
  --siva-poz: #f6f5f2;
  --tekst: #222222;
  --tekst-2: #6b6b6b;
  --tekst-3: #8f8f8f;
  --crta: #e6e3dc;
  --pijesak: #8c877d;
  --zlato: #cfcac0;
  --zlato-tamno: #3d3a35;
  --zlato-svijetlo: #f6f5f2;
  --plava: var(--zlato-tamno);
  --nebo: #297ece;
  --fb: #1877f2;
  --upis: #8a4b00;
  --upis-poz: #fff3dc;
  --naslov: "Playfair Display", Georgia, "Times New Roman", serif;
  --tijelo: "PT Serif", Georgia, serif;
  --oznaka: "Montserrat", "Segoe UI", Arial, sans-serif;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--bijelo); color: var(--tekst); font: 400 1.1875rem/1.7 var(--tijelo); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: var(--plava); text-underline-offset: .2em; text-decoration-thickness: 1px; }
:focus-visible { outline: 2px solid var(--plava); outline-offset: 3px; }
h1, h2, h3 { font-family: var(--naslov); font-weight: 400; line-height: 1.12; margin: 0; }
p { margin: 0 0 1em; }
strong { font-weight: 700; }
.versal { font-size: .9em; letter-spacing: .03em; }

.omot { width: min(1140px, 100% - 48px); margin-inline: auto; }
@media (max-width: 600px) { .omot { width: calc(100% - 32px); } }
.preskoci { position: absolute; left: -999px; top: 8px; background: #000; color: #fff; padding: 10px 16px; z-index: 60; }
.preskoci:focus { left: 16px; }

/* Male oznake velikim slovima (Montserrat) */
.oznaka { font: 600 .75rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin: 0 0 .9rem; }

/* Gumbi i poveznice */
.veza-strelica { font: 600 .78rem/1 var(--oznaka); letter-spacing: .16em; text-transform: uppercase; color: var(--tekst); text-decoration: none; display: inline-flex; align-items: center; gap: 10px; padding: 14px 0; border-bottom: 1px solid currentColor; }
.veza-strelica::after { content: "→"; letter-spacing: 0; font-size: 1.1rem; }
.veza-strelica:hover { color: var(--tekst); }
.gumb { display: inline-flex; align-items: center; gap: 10px; padding: 16px 26px; font: 600 .8rem/1 var(--oznaka); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; border: 1px solid var(--crta); color: var(--tekst); background: #fff; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.gumb:hover { background: var(--zlato-svijetlo); }
.gumb svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.gumb--puni { background: var(--siva-poz); border-color: var(--crta); color: var(--tekst); }
.gumb--puni:hover { background: #eeece6; }
.gumb--fb svg { fill: var(--fb); width: 20px; height: 20px; }
.gumb--fb { color: var(--tekst); border-color: var(--crta); }
.gumb--fb:hover { background: var(--siva-poz); }

/* ===== Gornja traka (prozirna preko fotografije, bijela nakon pomicanja) ===== */
.traka { position: fixed; inset: 0 0 auto; z-index: 40; transition: background .3s, box-shadow .3s; }
.traka__unutra { display: flex; align-items: center; gap: 32px; min-height: 84px; }
.znak { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; flex: none; }
.znak svg { width: 22px; height: 22px; fill: currentColor; }
.znak span { font: 600 .82rem/1.25 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; }
.znak small { display: block; font-weight: 500; letter-spacing: .14em; opacity: .8; font-size: .68rem; }
.izbornik { display: flex; gap: 30px; margin-left: auto; }
.izbornik a { font: 500 .75rem/1 var(--oznaka); letter-spacing: .18em; text-transform: uppercase; color: rgba(255, 255, 255, .85); text-decoration: none; padding: 10px 0; white-space: nowrap; border-bottom: 1px solid transparent; }
.izbornik a:hover, .izbornik a[aria-current="page"] { color: #fff; border-bottom-color: currentColor; }
.traka__tel { font: 600 .8rem/1 var(--oznaka); letter-spacing: .08em; color: #fff; text-decoration: none; border: 1px solid rgba(255, 255, 255, .7); padding: 12px 16px; white-space: nowrap; display: inline-flex; gap: 8px; align-items: center; }
.traka__tel svg { width: 14px; height: 14px; fill: currentColor; }
.traka__tel:hover { background: #fff; color: var(--tekst); }

.traka--bijela, .traka--uvijek { background: rgba(255, 255, 255, .97); box-shadow: 0 1px 0 var(--crta); }
.traka--bijela .znak, .traka--uvijek .znak, .traka--bijela .traka__tel, .traka--uvijek .traka__tel { color: var(--tekst); }
.traka--bijela .izbornik a, .traka--uvijek .izbornik a { color: var(--tekst-2); }
.traka--bijela .izbornik a:hover, .traka--uvijek .izbornik a:hover,
.traka--bijela .izbornik a[aria-current="page"], .traka--uvijek .izbornik a[aria-current="page"] { color: var(--tekst); }
.traka--bijela .traka__tel, .traka--uvijek .traka__tel { border-color: var(--crta); background: var(--siva-poz); }
.traka--bijela .traka__tel:hover, .traka--uvijek .traka__tel:hover { background: #eeece6; color: var(--tekst); }

.meni-gumb, .izbornik__dodatno { display: none; }
@media (max-width: 1000px) {
  .traka__unutra { min-height: 72px; gap: 12px; }
  .traka__tel { display: none; }
  .meni-gumb { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; width: 48px; height: 48px; margin: 0 -10px 0 auto; padding: 0; border: 0; background: none; color: #fff; cursor: pointer; }
  .meni-gumb span { display: block; width: 26px; height: 2px; background: currentColor; transition: transform .25s, opacity .2s; }
  .traka--bijela .meni-gumb, .traka--uvijek .meni-gumb { color: var(--tekst); }

  .izbornik { position: fixed; inset: 0; z-index: -1; display: none; flex-direction: column; gap: 0; margin: 0; padding: 96px 24px 32px; background: #fff; overflow-y: auto; }
  .izbornik a, .traka--bijela .izbornik a, .traka--uvijek .izbornik a { font: 400 1.75rem/1.2 var(--naslov); letter-spacing: 0; text-transform: none; color: var(--tekst); padding: 18px 0; border: 0; border-bottom: 1px solid var(--crta); white-space: normal; }
  .izbornik a[aria-current="page"] { color: var(--pijesak) !important; }
  .izbornik__dodatno { display: block; margin-top: 28px; }
  .izbornik__dodatno .gumb { width: 100%; justify-content: center; margin-bottom: 10px; font-size: .85rem; }
  .izbornik__dodatno p { margin: 14px 0 0; color: var(--tekst-2); font-size: 1rem; text-align: center; }

  body.meni-otvoren { overflow: hidden; }
  .meni-otvoren .izbornik { display: flex; }
  .meni-otvoren .traka { background: #fff; box-shadow: 0 1px 0 var(--crta); }
  .meni-otvoren .znak, .meni-otvoren .meni-gumb { color: var(--tekst); }
  .meni-otvoren .meni-gumb span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  .meni-otvoren .meni-gumb span:nth-child(2) { opacity: 0; }
  .meni-otvoren .meni-gumb span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
  .izbornik .izbornik__dodatno .gumb { font: 600 .85rem/1 var(--oznaka); letter-spacing: .14em; text-transform: uppercase; padding: 18px; border: 1px solid var(--crta); }
}

/* ===== Naslovnica: fotografija slavlja preko cijelog zaslona ===== */
.uvod { position: relative; min-height: min(100vh, 980px); min-height: min(100svh, 980px); display: flex; align-items: flex-end; color: #fff; background: #d9d6cf; overflow: hidden; }
.uvod__slika { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--poz, 50% 32%); }
.uvod::after { content: ""; position: absolute; inset: 0; pointer-events: none; background:
  linear-gradient(0deg, rgba(25, 22, 18, .66) 0%, rgba(25, 22, 18, .22) 46%, rgba(25, 22, 18, 0) 62%),
  linear-gradient(90deg, rgba(25, 22, 18, .35) 0%, rgba(25, 22, 18, 0) 55%),
  linear-gradient(180deg, rgba(25, 22, 18, .45) 0%, rgba(25, 22, 18, 0) 20%); }
.uvod__tekst { position: relative; z-index: 1; width: min(1140px, 100% - 48px); margin: 0 auto; padding: 0 0 150px; }
.uvod .oznaka { color: rgba(255, 255, 255, .92); }
.uvod h1 { font-size: clamp(2.5rem, 4.6vw, 4.2rem); line-height: 1.07; max-width: 14ch; text-shadow: 0 2px 30px rgba(0, 0, 0, .3); }
.uvod__mjesto { margin: .5rem 0 0; font-family: var(--naslov); font-size: clamp(1.4rem, 2.3vw, 1.9rem); }
.uvod__gumbi { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.uvod__gumb { display: inline-flex; align-items: center; gap: 10px; padding: 16px 24px; font: 600 .76rem/1 var(--oznaka); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; border: 1px solid #fff; transition: background .2s, color .2s; }
.uvod__gumb--bijeli { background: #fff; color: var(--tekst); }
.uvod__gumb--bijeli:hover { background: var(--siva-poz); }
.uvod__gumb--obrub { color: #fff; background: rgba(255, 255, 255, .08); }
.uvod__gumb--obrub:hover { background: #fff; color: var(--tekst); }
.uvod__tekst > * { animation: pojava .9s cubic-bezier(.2, .7, .2, 1) both; }
.uvod__tekst > :nth-child(2) { animation-delay: .08s; }
.uvod__tekst > :nth-child(3) { animation-delay: .16s; }
.uvod__tekst > :nth-child(4) { animation-delay: .26s; }
@keyframes pojava { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .uvod__tekst > * { animation: none; } }

/* Bijela kartica koja ulazi u donji rub fotografije */
.kartica { position: relative; z-index: 2; width: min(1140px, 100% - 48px); margin: -84px auto 0; background: #fff; box-shadow: 0 24px 60px -24px rgba(40, 35, 25, .28); display: grid; grid-template-columns: 1.25fr 1fr 1fr; }
.kartica > * { padding: 30px 32px; border-left: 1px solid var(--crta); }
.kartica > :first-child { border-left: 0; }
.kartica b { display: block; font: 600 .7rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin-bottom: 8px; }
.kartica .vel { display: block; font-family: var(--naslov); font-size: 1.6rem; line-height: 1.2; color: var(--tekst); text-decoration: none; }
.kartica a.vel:hover { text-decoration: underline; }
.kartica small { display: block; color: var(--tekst-2); font-size: 1rem; margin-top: 4px; overflow-wrap: anywhere; }
.kartica small a { color: var(--tekst); }

@media (max-width: 860px) {
  .uvod::after { background: linear-gradient(0deg, rgba(25, 22, 18, .82) 0%, rgba(25, 22, 18, .6) 30%, rgba(25, 22, 18, .06) 58%, rgba(25, 22, 18, .12) 82%, rgba(25, 22, 18, .5) 100%); }
  .uvod h1 { font-size: 2.1rem; }
  .uvod { min-height: 100vh; min-height: 100svh; }
  .uvod .oznaka { font-size: .7rem; margin-bottom: .6rem; }
  .uvod__mjesto { font-size: 1.3rem; }
  .uvod__gumbi { flex-wrap: nowrap; gap: 8px; margin-top: 20px; }
  .uvod__gumb { padding: 14px 14px; font-size: .68rem; letter-spacing: .1em; }
  .uvod__slika { object-position: 50% 0%; }
  .slajd:not(:first-child) .uvod__slika { object-position: 50% 40%; }
  .uvod__tekst { width: calc(100% - 32px); padding-bottom: 100px; }
  .kartica { grid-template-columns: 1fr; margin-top: -48px; width: calc(100% - 32px); }
  .kartica > * { border-left: 0; border-top: 1px solid var(--crta); padding: 20px 22px; }
  .kartica > :first-child { border-top: 0; }
}

/* ===== Brzi podaci ===== */
.brzo { border-bottom: 1px solid var(--crta); }
.brzo__mreza { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.brzo a { display: flex; gap: 18px; align-items: center; padding: 34px 28px; text-decoration: none; color: var(--tekst); border-left: 1px solid var(--crta); transition: background .2s; }
.brzo a:first-child { border-left: 0; padding-left: 0; }
.brzo a:hover { background: var(--siva-poz); }
.brzo svg { width: 22px; height: 22px; fill: var(--pijesak); flex: none; }
.brzo b { display: block; font: 600 .7rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--tekst-3); margin-bottom: 4px; }
.brzo span { display: block; font-size: 1.12rem; overflow-wrap: anywhere; }
@media (max-width: 860px) {
  .brzo__mreza { grid-template-columns: 1fr; }
  .brzo a { border-left: 0; border-top: 1px solid var(--crta); padding: 20px 0; }
  .brzo a:first-child { border-top: 0; }
}

/* ===== Odjeljci ===== */
.odjeljak { padding: clamp(64px, 9vw, 120px) 0; }
.odjeljak--siva { background: var(--siva-poz); }
.naslov-odjeljka { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 32px; align-items: end; margin-bottom: clamp(32px, 5vw, 56px); }
.naslov-odjeljka h2 { font-size: clamp(2.3rem, 4.6vw, 3.4rem); }
.naslov-odjeljka__pod { display: block; font-size: .6em; color: var(--tekst-2); margin-top: .25em; }
.naslov-odjeljka__crta { display: flex; align-items: center; gap: 24px; }
.naslov-odjeljka__crta::after { content: ""; flex: 1; height: 1px; background: var(--crta); min-width: 40px; }
.naslov-odjeljka__opis { grid-column: 1 / -1; color: var(--tekst-2); max-width: 62ch; margin: 0; }
.naslov-odjeljka__desno { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.legenda { display: inline-flex; align-items: center; gap: 10px; font: 500 .72rem/1 var(--oznaka); letter-spacing: .14em; text-transform: uppercase; color: var(--tekst-2); }
.legenda i { width: 8px; height: 8px; border-radius: 50%; background: var(--plava); }
.napomena { margin-top: 28px; color: var(--tekst-2); font-size: 1rem; }
@media (max-width: 700px) { .naslov-odjeljka { grid-template-columns: 1fr; } }

/* ===== Raspored (tablica s tankim linijama) ===== */
.raspored { border-top: 1px solid var(--tekst); }
.dan { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 6px 40px; padding: 26px 0; border-bottom: 1px solid var(--crta); position: relative; }
.dan__glava { display: flex; flex-direction: column; gap: 4px; }
.dan__ime { font: 600 .74rem/1.3 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--tekst-3); margin: 0; }
.dan__datum { margin: 0; display: flex; align-items: baseline; gap: 8px; }
.dan__broj { font-family: var(--naslov); font-size: 2.3rem; line-height: 1.05; }
.dan__mj { color: var(--tekst-2); font-size: 1rem; }
.dan__oznaka { display: inline-block; vertical-align: 1px; margin-left: 10px; font: 600 .62rem/1 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; background: #fff; color: var(--tekst); border: 1px solid var(--zlato); padding: 4px 8px; }
.dan__spomen { margin: 0 0 12px; color: var(--tekst-2); font-size: 1.02rem; }
.dan__stavke { list-style: none; margin: 0; padding: 0; }
.stavka { display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 8px 0; border-top: 1px dotted var(--crta); }
.stavka:first-child { border-top: 0; padding-top: 0; }
.stavka__vrijeme { font-family: var(--naslov); font-size: 1.45rem; line-height: 1.2; font-variant-numeric: lining-nums tabular-nums; }
.stavka__opis { font-size: 1.1rem; line-height: 1.5; }
.stavka__mjesto { font-weight: 700; }
.stavka__mjesto::after { content: " — "; font-weight: 400; color: var(--tekst-3); }
.stavka--posebno .stavka__vrijeme { color: var(--tekst); }
.stavka--posebno .stavka__sto { font-style: italic; }
.stavka--posebno .stavka__vrijeme { position: relative; }
.dan__bez { margin: 0; color: var(--tekst-3); font-style: italic; }
.dan--svetkovina .dan__spomen { font-family: var(--naslov); font-size: 1.6rem; line-height: 1.2; color: var(--tekst); }
.dan--svetkovina .dan__broj { color: var(--pijesak); }
.dan--danas { background: var(--siva-poz); padding-left: 24px; padding-right: 24px; margin: 0 -24px; border-bottom-color: transparent; }
.dan--danas::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--zlato); }
.dan--danas .dan__broj { color: var(--tekst); }
/* Svi dani u tjednu prikazuju se jednako, kao na listiću; istaknut je samo današnji. */
.prazno { color: var(--tekst-2); font-style: italic; padding: 24px 0; }
.greska { background: #fde8e6; color: #7d1d14; border: 1px solid #f2b8b1; padding: 12px 16px; margin: 16px 0; font-size: 1rem; }
@media (max-width: 760px) {
  .dan { grid-template-columns: 1fr; gap: 4px; padding: 22px 0; }
  .dan__glava { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
  .dan__broj { font-size: 1.9rem; }
  .dan--danas { margin: 0 -16px; padding: 22px 16px; }
  .stavka { grid-template-columns: 4rem minmax(0, 1fr); gap: 10px; }
  .stavka__vrijeme { font-size: 1.3rem; }
  .stavka__opis { font-size: 1.05rem; }
  .stavka__mjesto { display: block; }
  .stavka__mjesto::after { content: none; }
  }

/* ===== Obavijesti ===== */
.obavijesti { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 48px 64px; }
.obavijest { border-top: 1px solid var(--tekst); padding-top: 24px; }
.obavijest--vazno { border-top-width: 3px; }
.obavijest__datum { font: 600 .72rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin-bottom: .8rem; }
.obavijest__naslov { font-size: clamp(1.6rem, 2.6vw, 2rem); margin-bottom: 1rem; }
.obavijest__tekst { font-size: 1.08rem; }
.obavijest__tekst p:last-child { margin-bottom: 0; }

/* ===== Marija ===== */
.marija { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 7vw, 100px); align-items: center; }
.marija__slika { margin: 0; }
.marija__slika img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; }
.marija h2 { font-size: clamp(2.2rem, 4.4vw, 3.3rem); margin-bottom: 1.4rem; }
.marija__uvod { font-size: 1.2rem; color: var(--tekst-2); }
.blagdani { margin-top: 32px; border-top: 1px solid var(--tekst); }
.blagdan { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--crta); align-items: baseline; }
.blagdan__kad { font-family: var(--naslov); font-size: 1.35rem; margin: 0; }
.blagdan p:last-child { margin: 0; color: var(--tekst-2); font-size: 1.05rem; }
@media (max-width: 860px) {
  .marija { grid-template-columns: 1fr; }
  .blagdan { grid-template-columns: 1fr; gap: 2px; }
}

/* ===== Kontakt i put ===== */
.dolazak { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: clamp(36px, 6vw, 80px); align-items: start; }
.dolazak__crkva { margin: 0; position: sticky; top: 110px; }
.dolazak__crkva img { width: 100%; height: auto; aspect-ratio: 765 / 1020; object-fit: cover; }
.dolazak__crkva figcaption { margin-top: 12px; font-size: .98rem; color: var(--tekst-2); font-style: italic; }
.dolazak__desno { display: grid; gap: 40px; min-width: 0; }
@media (max-width: 900px) { .dolazak__crkva { position: static; max-width: 460px; } }
.kontakt-kartica h3 { font-size: 2rem; margin-bottom: .3rem; }
.kontakt-kartica__zupnik { color: var(--tekst-2); margin-bottom: 1.4rem; }
.kontakt-kartica__zupnik strong { color: var(--tekst); font-weight: 400; }
.kontakt-red { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 18px; padding: 16px 0; border-top: 1px solid var(--crta); align-items: start; }
.kontakt-red svg { width: 18px; height: 18px; fill: var(--pijesak); margin-top: 6px; }
.kontakt-red b { display: block; font: 600 .7rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--tekst-3); margin-bottom: 2px; }
.kontakt-red a, .kontakt-red .vel { font-size: 1.15rem; color: var(--tekst); text-decoration: none; overflow-wrap: anywhere; }
.kontakt-red a:hover { color: var(--plava); text-decoration: underline; }
.karta-okvir { display: flex; flex-direction: column; gap: 20px; }
.karta-okvir iframe { width: 100%; height: 440px; border: 0; background: var(--siva-poz); }
.karta-okvir__gumbi { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 900px) { .dolazak { grid-template-columns: 1fr; } .karta-okvir iframe { height: 340px; } }

/* ===== Poziv na povijest ===== */
.poziv { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: clamp(24px, 5vw, 64px); align-items: center; padding: clamp(36px, 5vw, 56px) 0; border-top: 1px solid var(--tekst); border-bottom: 1px solid var(--crta); text-decoration: none; color: var(--tekst); }
.poziv__godina { font-family: var(--naslov); font-size: clamp(3.6rem, 8vw, 6rem); line-height: .9; color: var(--zlato); margin: 0; }
.poziv h2 { font-size: clamp(1.8rem, 3.2vw, 2.4rem); margin-bottom: .4rem; }
.poziv p { margin: 0; color: var(--tekst-2); }
.poziv:hover .veza-strelica { color: var(--plava); border-color: var(--plava); }
@media (max-width: 860px) { .poziv { grid-template-columns: 1fr; } }

/* ===== Mjesta za upis ===== */
.upisati { background: var(--upis-poz); color: var(--upis); border: 1px dashed currentColor; padding: 1px 7px; font: 600 .82em/1.5 var(--oznaka); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.mjesto-slike { margin: 0; aspect-ratio: 3 / 2; border: 1px dashed #cfcac0; background: var(--siva-poz); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; padding: 24px; color: var(--tekst-2); font-size: .98rem; }

/* ===== Povijest (zasebna stranica) ===== */
.stranica-uvod { position: relative; min-height: min(64vh, 680px); display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: #8c877d; }
.stranica-uvod img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.stranica-uvod::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10, 20, 35, .65) 0%, rgba(10, 20, 35, .1) 55%, rgba(10, 20, 35, .35) 100%); }
.stranica-uvod .omot { position: relative; z-index: 1; padding: 150px 0 56px; }
.stranica-uvod .oznaka { color: rgba(255, 255, 255, .85); }
.stranica-uvod h1 { font-size: clamp(2.8rem, 6vw, 4.8rem); }
.stranica-uvod p { font-size: 1.15rem; max-width: 56ch; margin: 1rem 0 0; color: rgba(255, 255, 255, .9); }

.isprava { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(24px, 5vw, 72px); align-items: center; padding-bottom: clamp(40px, 6vw, 64px); border-bottom: 1px solid var(--crta); }
.isprava__godina { font-family: var(--naslov); font-size: clamp(4.6rem, 12vw, 9rem); line-height: .85; color: var(--zlato); margin: 0; }
.isprava__citat { margin: 0; }
.isprava__citat p { font-family: var(--naslov); font-size: clamp(1.5rem, 2.8vw, 2.1rem); line-height: 1.3; margin-bottom: .8rem; }
.isprava__citat footer { color: var(--tekst-2); font-size: 1rem; }
@media (max-width: 760px) { .isprava { grid-template-columns: 1fr; } }

.povijest__mreza { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(40px, 7vw, 100px); align-items: start; }
.povijest__mreza h2 { font-size: clamp(2rem, 3.6vw, 2.8rem); margin-bottom: 1.4rem; }
.vodeci { font-size: 1.3rem; line-height: 1.6; }
.cinjenice { margin: 2rem 0 0; border-top: 1px solid var(--tekst); }
.cinjenice div { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--crta); }
.cinjenice dt { font: 600 .72rem/1.9 var(--oznaka); letter-spacing: .18em; text-transform: uppercase; color: var(--tekst-3); }
.cinjenice dd { margin: 0; }
.vremenska { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--tekst); }
.vremenska li { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--crta); }
.vremenska__kad { font-family: var(--naslov); font-size: 1.2rem; line-height: 1.4; }
.vremenska__sad .vremenska__kad { color: var(--pijesak); }
.vremenska p { margin: 0; }
@media (max-width: 860px) {
  .povijest__mreza { grid-template-columns: 1fr; }
  .cinjenice div, .vremenska li { grid-template-columns: 1fr; gap: 2px; }
}

.mjesta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 64px; border-top: 1px solid var(--tekst); }
.mjesto { padding: 28px 0; border-bottom: 1px solid var(--crta); }
.mjesto h3 { font-size: 1.8rem; margin-bottom: .2rem; }
.mjesto__god { font: 600 .72rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin-bottom: .6rem; }
.mjesto__gdje { color: var(--tekst-2); font-style: italic; margin-bottom: .6rem; }
.mjesto p:last-child { margin-bottom: 0; }
.mjesto--istaknuto { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
@media (max-width: 760px) {
  .mjesta { grid-template-columns: 1fr; }
  .mjesto--istaknuto { grid-template-columns: 1fr; gap: 24px; }
}

/* ===== Podnožje ===== */
.podnozje { background: var(--siva-poz); color: var(--tekst-2); padding: 56px 0 64px; font-size: 1rem; border-top: 1px solid var(--crta); }
.podnozje a { color: var(--tekst); }
.podnozje__unutra { display: flex; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.podnozje p { margin: 0 0 4px; }
.podnozje__ime { color: var(--tekst); font-family: var(--naslov); font-size: 1.5rem; margin-bottom: 8px !important; }
.izvori { max-width: 600px; }
.izvori summary { cursor: pointer; font: 600 .72rem/1.4 var(--oznaka); letter-spacing: .18em; text-transform: uppercase; color: var(--tekst); }
.izvori ul { padding-left: 18px; margin: 14px 0 0; font-size: .95rem; }
.izvori li { margin-bottom: 6px; }

/* ===== Kapele s fotografijama ===== */
.kapele-mreza { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px 36px; }
.kapela-k img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 25%; margin-bottom: 22px; }
.kapela-k h3 { font-size: 1.75rem; margin-bottom: .2rem; }
.kapela-k p:last-child { margin-bottom: 0; }
.kapela-k--istaknuta { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.kapela-k--istaknuta img { aspect-ratio: 16 / 9; margin: 0; }
.kapela-k--istaknuta h3 { font-size: clamp(2rem, 3.4vw, 2.6rem); }
@media (max-width: 900px) {
  .kapele-mreza { grid-template-columns: 1fr 1fr; }
  .kapela-k--istaknuta { grid-template-columns: 1fr; }
}
@media (max-width: 600px) { .kapele-mreza { grid-template-columns: 1fr; gap: 44px; } }

/* ===== Facebook: obavijest ispod rasporeda ===== */
.fb-red { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; margin-top: 36px; padding: 24px 28px; background: var(--siva-poz); }
.fb-red p { margin: 0; color: var(--tekst-2); max-width: 52ch; }
.fb-veze { display: flex; flex-wrap: wrap; gap: 10px; }
.fb-veze a { display: inline-flex; align-items: center; gap: 8px; color: var(--tekst); text-decoration: none; font-size: 1.05rem; }
.fb-veze a svg { width: 20px; height: 20px; fill: var(--fb); flex: none; }
.fb-veze a:hover { text-decoration: underline; }
.kontakt-red .fb-veze { flex-direction: column; gap: 6px; }

/* ===== Podnožje: kontakt i lokacija ===== */
.podnozje__stupci { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 32px 48px; }
.podnozje h3 { font: 600 .72rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin-bottom: 12px; }
.podnozje a { text-decoration: none; }
.podnozje a:hover { text-decoration: underline; }
.podnozje__dno { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--crta); font-size: .9rem; color: var(--tekst-3); }
@media (max-width: 760px) { .podnozje__stupci { grid-template-columns: 1fr; } }
.zasluga { position: absolute; right: 16px; bottom: 10px; z-index: 1; font: 500 .68rem/1.3 var(--oznaka); color: rgba(255, 255, 255, .8); letter-spacing: .04em; }
.zasluga a { color: inherit; }

/* ===== Ispis: samo raspored ===== */
@media print {
  @page { margin: 14mm; }
  body { font-size: 11pt; }
  .traka, .uvod, .brzo, .podnozje, #obavijesti, .marija-odjeljak, #kako-do-nas, .poziv-odjeljak, .naslov-odjeljka__desno, .napomena, .preskoci { display: none !important; }
  .odjeljak { padding: 0; }
  .omot { width: 100%; }
  .dan { padding: 6pt 0; grid-template-columns: 120pt 1fr; break-inside: avoid; }
  .dan--danas { background: none; margin: 0; padding: 6pt 0; }
  .dan--danas::before, .dan__oznaka { display: none; }
  .dan--proslo { opacity: 1; }
  .dan__broj { font-size: 18pt; }
  .stavka__vrijeme { font-size: 12pt; }
  .stavka__opis { font-size: 11pt; }
}

/* ===== Mobitel: veće površine za prst i čitljivije sitne oznake ===== */
@media (max-width: 760px) {
  .kartica small a, .podnozje a, .kontakt-red > div > a, .napomena a { display: inline-block; padding-block: 11px; }
  .fb-veze a { padding-block: 9px; }
  .kartica a.vel { padding-block: 6px; }
  .kartica small, .podnozje p { line-height: 1.4; }
  .podnozje p { margin-bottom: 0; }
  .znak small { font-size: .75rem; }
  .oznaka, .kartica b, .dan__ime, .obavijest__datum, .mjesto__god, .cinjenice dt, .kontakt-red b, .podnozje h3 { font-size: .78rem; }
  .dan__oznaka { font-size: .7rem; }
}
.poziv__kriz svg { display: block; width: clamp(56px, 7vw, 84px); height: clamp(56px, 7vw, 84px); fill: currentColor; }

/* ===== Kapela Majke Božje Snježne, Risvica ===== */
.risvica { background: #fff; margin-bottom: clamp(56px, 8vw, 96px); }
.risvica__glavna { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 40%; display: block; }
.risvica__sadrzaj { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); padding: clamp(28px, 5vw, 56px); }
.risvica h3 { font-size: clamp(2rem, 3.6vw, 2.8rem); margin-bottom: .3rem; }
.risvica .vodeci { font-size: 1.2rem; }
.risvica__mise { align-self: start; background: var(--siva-poz); padding: 26px 28px; }
.risvica h4 { font: 600 .72rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin: 0 0 14px; }
.risvica__mise ul { list-style: none; margin: 0 0 16px; padding: 0; }
.risvica__mise li { font-family: var(--naslov); font-size: 1.2rem; line-height: 1.3; padding: 12px 0; border-bottom: 1px solid var(--crta); }
.risvica__mise li:first-child { padding-top: 0; }
.risvica__mise p { margin: 0; font-size: 1rem; color: var(--tekst-2); }
.galerija { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 0 8px; }
.galerija figure { margin: 0; }
.galerija img { width: 100%; height: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.galerija__siroka { grid-column: span 2; }
.galerija__siroka img { aspect-ratio: auto; }
.galerija figure:nth-child(n+3) { grid-row: auto; }
.risvica__lokacija { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: center; padding: clamp(28px, 5vw, 56px); }
.risvica__lokacija iframe { width: 100%; height: 320px; border: 0; background: var(--siva-poz); }
.risvica__lokacija p { color: var(--tekst-2); }
@media (min-width: 761px) {
  .galerija { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .galerija__siroka { grid-column: 1 / 3; grid-row: 1 / 3; }
  .galerija figure.galerija__siroka--dolje { grid-column: 3 / 5; grid-row: 3 / 5; }
  .galerija__siroka img { height: 100%; object-fit: cover; }
  .galerija figure:not(.galerija__siroka) img { aspect-ratio: auto; height: 100%; }
  .galerija { grid-template-rows: repeat(2, clamp(200px, 22vw, 300px)); grid-auto-rows: clamp(200px, 22vw, 300px); }
}
@media (max-width: 760px) {
  .risvica { margin-inline: -16px; }
  .risvica__glavna { aspect-ratio: 3 / 4; object-position: 50% 50%; }
  .risvica__sadrzaj { grid-template-columns: 1fr; padding: 28px 16px; }
  .galerija { grid-template-columns: 1fr 1fr; padding: 0 16px; }
  .galerija__siroka img { aspect-ratio: 4 / 3; }
  .risvica__lokacija { grid-template-columns: 1fr; padding: 28px 16px 36px; }
}

/* ===== Kapelice i sveta mjesta (stranica Povijest) ===== */
.svetiste { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; padding: clamp(28px, 4vw, 48px) 0; border-top: 1px solid var(--crta); }
.svetista-par { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); padding-bottom: clamp(28px, 4vw, 48px); align-items: start; }
.svetiste-mala { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(16px, 2.5vw, 32px); align-items: start; }
.svetiste-mala img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.svetiste-mala h3 { font-family: var(--naslov); font-weight: 400; font-size: clamp(1.4rem, 2.2vw, 1.8rem); line-height: 1.15; margin: 0 0 .4rem; }
.svetiste-mala p { color: var(--tekst-2); }
.svetiste-mala__rijeci { margin: 0; padding: 0; list-style: none; }
.svetiste-mala__rijeci li { font-style: italic; color: var(--tekst-2); padding: 6px 0; border-top: 1px solid var(--crta); line-height: 1.45; }
@media (max-width: 1000px) { .svetista-par { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .svetiste-mala { grid-template-columns: 1fr; } .svetiste-mala img { aspect-ratio: 4 / 5; } }
.svetiste__slike { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 8px; }
.svetiste__slike img { width: 100%; height: clamp(220px, 26vw, 380px); object-fit: cover; display: block; }
.svetiste__tekst h3 { font-family: var(--naslov); font-weight: 400; font-size: clamp(1.6rem, 2.6vw, 2.1rem); line-height: 1.15; margin: 0 0 .4rem; }
.svetiste__tekst p { color: var(--tekst-2); }
@media (max-width: 760px) {
  .svetiste { grid-template-columns: 1fr; }
  .svetiste__slike { grid-template-columns: 1fr 1fr; }
  .svetiste__glavna { grid-column: 1 / -1; }
  .svetiste__slike img { height: auto; aspect-ratio: 3 / 4; }
  .svetiste__slike .svetiste__glavna { aspect-ratio: 4 / 3; }
}

/* ===== Kartice kapela (stranica Povijest) ===== */
.kapele-kartice { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 28px; }
.kapela-kartica { display: flex; flex-direction: column; color: var(--tekst); text-decoration: none; }
.kapela-kartica img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 30%; margin-bottom: 20px; transition: transform .4s ease, filter .3s; }
.kapela-kartica { overflow: hidden; }
.kapela-kartica:hover img { filter: brightness(1.05); transform: scale(1.02); }
.kapela-kartica .mjesto__god { margin-bottom: .4rem; }
.kapela-kartica__ime { font-family: var(--naslov); font-size: 1.45rem; line-height: 1.15; }
.kapela-kartica__mjesto { color: var(--tekst-2); font-style: italic; margin-top: 4px; }
.kapela-kartica__vise { margin-top: 14px; font: 600 .74rem/1 var(--oznaka); letter-spacing: .16em; text-transform: uppercase; }
.kapela-kartica__vise::after { content: "  →"; }
.kapela-kartica:hover .kapela-kartica__ime { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.kapele-kartice > .kapela-kartica:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 4px 48px; align-content: center; }
.kapele-kartice > .kapela-kartica:first-child img { grid-row: 1 / 6; aspect-ratio: 16 / 10; margin: 0; }
.kapele-kartice > .kapela-kartica:first-child .mjesto__god { align-self: end; }
.kapele-kartice > .kapela-kartica:first-child .kapela-kartica__ime { font-size: clamp(2rem, 3.4vw, 2.8rem); }
@media (max-width: 900px) { .kapele-kartice { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
  .kapele-kartice { grid-template-columns: 1fr; gap: 40px; }
  .kapele-kartice > .kapela-kartica:first-child { display: flex; }
  .kapele-kartice > .kapela-kartica:first-child img { aspect-ratio: 4 / 3; margin-bottom: 20px; }
}

/* ===== Stranica pojedine kapele ===== */
.kapela-str { padding-top: 84px; }
.kapela-str__natrag { padding: 20px 0 16px; }
.kapela-str__natrag a { font: 600 .74rem/1 var(--oznaka); letter-spacing: .14em; text-transform: uppercase; color: var(--tekst); text-decoration: none; display: inline-block; padding: 10px 0; }
.kapela-str__natrag a:hover { text-decoration: underline; }
.kapela-str__slika { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100vh - 150px); margin: 0 auto; object-fit: contain; }
.kapela-str__sadrzaj { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 80px); padding-block: clamp(36px, 6vw, 72px); }
.kapela-str h1 { font-size: clamp(2.4rem, 5vw, 3.8rem); margin-bottom: .3rem; }
.kapela-str .vodeci { font-size: 1.25rem; margin-top: 1.4rem; }
.kapela-str .cinjenice { margin-top: 2rem; }
.kapela-str__izvori { margin-top: 1.4rem; font-size: .95rem; color: var(--tekst-3); }
.mali-naslov { font: 600 .72rem/1.4 var(--oznaka); letter-spacing: .2em; text-transform: uppercase; color: var(--pijesak); margin: 0 0 14px; }
.kapela-str__mise { background: var(--siva-poz); padding: 26px 28px; position: sticky; top: 110px; }
.kapela-str__mise ul { list-style: none; margin: 0 0 16px; padding: 0; }
.kapela-str__mise li { font-family: var(--naslov); font-size: 1.2rem; line-height: 1.3; padding: 12px 0; border-bottom: 1px solid var(--crta); }
.kapela-str__mise li:first-child { padding-top: 0; }
.kapela-str__mise p { margin: 0; font-size: 1rem; color: var(--tekst-2); }
.kapela-str__galerija .galerija { padding: 0; }
.kapela-str__lokacija { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; padding-block: clamp(48px, 7vw, 88px); }
.kapela-str__lokacija iframe { width: 100%; height: 360px; border: 0; background: var(--siva-poz); }
.kapela-str__lokacija p { color: var(--tekst-2); }
.kapele-kartice--male { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.kapele-kartice--male > .kapela-kartica:first-child { display: flex; grid-column: auto; }
.kapele-kartice--male .kapela-kartica img, .kapele-kartice--male > .kapela-kartica:first-child img { aspect-ratio: 4 / 3; margin: 0 0 12px; }
.kapele-kartice--male .kapela-kartica__ime, .kapele-kartice--male > .kapela-kartica:first-child .kapela-kartica__ime { font-size: 1.25rem; }
@media (max-width: 900px) {
  .kapela-str { padding-top: 72px; }
  .kapela-str__sadrzaj, .kapela-str__lokacija { grid-template-columns: 1fr; }
  .kapela-str__mise { position: static; }
  .kapele-kartice--male { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .kapela-str__vrh { width: 100%; }
  .kapela-str__slika { max-height: none; width: 100%; }
  .kapela-str__galerija { width: 100%; }
  .kapela-str__galerija .galerija { padding: 0 8px; }
}
.kapele-kartice--male > .kapela-kartica:first-child .mjesto__god { align-self: auto; }

/* ===== Izmjenjivanje fotografija na naslovnici ===== */
.slajdovi { position: absolute; inset: 0; overflow: hidden; }
.slajd { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease; }
.slajd.je-aktivan { opacity: 1; }
.slajd .uvod__slika { transform: scale(1.12); transition: transform 8s cubic-bezier(.25, .6, .3, 1); will-change: transform; }
.slajd.je-aktivan .uvod__slika { transform: scale(1); }
@media (prefers-reduced-motion: reduce) { .slajd .uvod__slika { transform: scale(1.03); transition-duration: 6s; } .slajd.je-aktivan .uvod__slika { transform: scale(1); } }
.uvod .uvod__tekst { pointer-events: none; }
.uvod .uvod__tekst a, .uvod .uvod__tekst button { pointer-events: auto; }
.slajdovi__kontrole { position: absolute; z-index: 2; right: max(24px, calc((100vw - 1140px) / 2)); bottom: 118px; }
.slajdovi__tocke { display: flex; align-items: center; gap: 10px; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .45)); }
.slajdovi__tocke button { position: relative; width: 9px; height: 9px; padding: 0; border: 1.5px solid #fff; border-radius: 5px; background: transparent; cursor: pointer; transition: width .35s ease, background .35s ease; }
.slajdovi__tocke button::after { content: ""; position: absolute; inset: -12px -6px; }   /* veća površina za prst */
.slajdovi__tocke button[aria-selected="true"] { width: 26px; background: #fff; }
.slajdovi__tocke button:hover { background: rgba(255, 255, 255, .6); }
.slajdovi__tocke button:focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
@media (max-width: 860px) {
  .slajdovi__kontrole { left: 0; right: 0; bottom: 68px; display: flex; justify-content: center; }
}

/* ===== Plamen Srca – župni listić ===== */
.listic { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: clamp(32px, 7vw, 96px); align-items: center; }
.listic__naslovnica { display: block; position: relative; aspect-ratio: 421 / 595; background: var(--siva-poz); box-shadow: 0 1px 2px rgba(40, 35, 25, .08), 0 28px 60px -28px rgba(40, 35, 25, .45); transform: rotate(-1.5deg); transition: transform .3s ease, box-shadow .3s ease; }
.listic__naslovnica::before { content: "Plamen Srca"; position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--naslov); font-size: 1.8rem; color: var(--tekst-3); }
.listic__naslovnica.je-nacrtana::before { content: none; }
.listic__naslovnica:hover { transform: rotate(0) translateY(-4px); box-shadow: 0 1px 2px rgba(40, 35, 25, .08), 0 36px 70px -28px rgba(40, 35, 25, .5); }
.listic__naslovnica canvas { position: relative; display: block; width: 100%; height: 100%; }
.listic h2 { font-size: clamp(2.4rem, 5vw, 3.6rem); margin-bottom: .4rem; }
.listic__broj { font: 600 .78rem/1.4 var(--oznaka); letter-spacing: .16em; text-transform: uppercase; color: var(--tekst-2); margin-bottom: 1.2rem; }
.listic__tema { font-family: var(--naslov); font-size: clamp(1.4rem, 2.4vw, 1.9rem); line-height: 1.3; margin-bottom: 1.6rem; }
.listic__gumbi { display: flex; flex-wrap: wrap; gap: 12px; }
.listic__arhiva { margin-top: 36px; border-top: 1px solid var(--crta); padding-top: 22px; }
.listic__arhiva ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.listic__arhiva a { display: inline-flex; gap: 12px; padding: 8px 0; color: var(--tekst-2); text-decoration: none; }
.listic__arhiva a span { color: var(--tekst); font-weight: 700; }
.listic__arhiva a:hover { color: var(--tekst); text-decoration: underline; }
@media (max-width: 760px) {
  .listic { grid-template-columns: 1fr; }
  .listic__naslovnica { width: min(78%, 300px); margin: 0 auto 8px; }
  .listic__gumbi .gumb { flex: 1; justify-content: center; }
}
.kapela-str__mise li small { display: block; margin-top: 6px; font-family: var(--tijelo); font-size: .95rem; line-height: 1.45; color: var(--tekst-2); }