:root{--red:#7b1f25;--red-dark:#561218;--red-deep:#3f0e13;--blue:#243a5e;--cream:#f4efe6;--paper:#fbf8f2;--gold:#b18a4b;--ink:#2c2724;--muted:#756b64;--border:rgba(71,49,40,.16)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Inter",sans-serif;line-height:1.65}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 40px));margin:0 auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(252,248,241,.96);border-bottom:1px solid rgba(70,50,40,.1);backdrop-filter:blur(12px)}.header-inner{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:14px}.brand-cross{color:var(--red);font-size:42px;line-height:1}.brand-kicker,.brand small{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}.brand strong{display:block;margin:2px 0;color:var(--red-dark);font-family:"Cormorant Garamond",serif;font-size:26px;line-height:1}.main-nav{display:flex;align-items:center;gap:25px;font-size:13px;text-transform:uppercase;letter-spacing:.04em}.main-nav a{position:relative;padding:32px 0}.main-nav a::after{content:"";position:absolute;left:0;bottom:22px;width:0;height:1px;background:var(--red);transition:.25s}.main-nav a:hover::after{width:100%}.menu-toggle{display:none}.hero{position:relative;min-height:800px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(35,15,12,.74),rgba(35,15,12,.25)),url("assets/CrkvaSVIlije.png") center bottom/cover no-repeat}.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(60,10,15,.06),rgba(27,16,13,.18))}.hero-content{position:relative;z-index:1;max-width:680px;color:#fff}.eyebrow{margin:0 0 13px;font-size:12px;letter-spacing:.22em;font-weight:600}.eyebrow.red{color:var(--red)}.eyebrow.light{color:#ebd8c7}.hero h1,.section h2,.gallery-section h2{font-family:"Cormorant Garamond",serif}.hero h1{margin:0;font-size:clamp(54px,7vw,86px);font-weight:600;line-height:.96}.hero-quote{margin:28px 0 8px;max-width:620px;font-family:"Cormorant Garamond",serif;font-size:25px}.hero-source{opacity:.8;margin-bottom:30px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border:1px solid rgba(255,255,255,.5);font-size:13px;letter-spacing:.05em;text-transform:uppercase}.btn-primary{background:var(--red);color:#fff}.btn-primary:hover{background:var(--red-dark)}.section{padding:76px 0}.intro-section{background:#fff;color:var(--red)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:70px}.section-heading{display:flex;gap:18px;align-items:flex-start}.section-mark{width:5px;height:50px;background:var(--red);margin-top:6px}.section h2,.gallery-section h2{margin:0 0 25px;color:var(--red-dark);font-size:43px;font-weight:600}.service-list{margin-top:18px;border-top:1px solid var(--border)}.service-row{display:grid;grid-template-columns:1.05fr 1.35fr 70px;gap:20px;padding:16px 0;border-bottom:1px solid var(--border);font-size:14px}.service-row strong{font-weight:500}.service-row time{text-align:right}.about-preview{display:grid;grid-template-columns:1fr 210px;gap:34px;align-items:stretch}.about-copy p{color:#514943}.about-image{width:100%;height:100%;min-height:320px;object-fit:cover}.text-link{color:var(--red);font-weight:600;font-size:14px}.feature-strip{padding:26px 0;background:linear-gradient(rgba(90,14,20,.94),rgba(90,14,20,.94)),url("assets/pattern.jpg") center/cover}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature-card{background:#2e1717;color:#fff}.feature-card img{width:100%;aspect-ratio:1.15/1;object-fit:cover;filter:saturate(.86) contrast(1.03)}.feature-content{padding:18px 18px 20px;background:linear-gradient(180deg,#6c191f,#4f1116)}.feature-content h3{margin:0 0 2px;font-family:"Cormorant Garamond",serif;font-size:26px;font-weight:600}.feature-content p{margin:0;opacity:.78;font-size:13px}.news-section{background:var(--red);color:var(--paper)}.section-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:28px}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.news-card{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;padding-top:18px;border-top:1px solid var(--border)}.news-card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.news-card time{color:var(--muted);font-size:11px}.news-card h3{margin:6px 0;font-family:"Cormorant Garamond",serif;font-size:23px;line-height:1.15}.news-card p{margin:0;color:#615851;font-size:13px}.gallery-section{padding:70px 0;background:var(--paper);color:var(--ink)}.gallery-section h2{color:var(--red-dark)}.gallery-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:12px}.gallery-grid img{width:100%;height:360px;object-fit:cover}.site-footer{background:var(--blue);color:#e9dfd5;padding-top:52px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:45px;align-items:start}.footer-brand{display:flex;gap:14px}.footer-brand .brand-cross{color:#c7a56a}.footer-brand strong{font-family:"Cormorant Garamond",serif;font-size:27px}.footer-grid h4{margin-top:0;color:#c7a56a;font-size:12px;letter-spacing:.15em;text-transform:uppercase}.footer-grid p,.footer-grid blockquote{margin:4px 0;color:#cfc4b9;font-size:13px}.footer-grid blockquote{font-family:"Cormorant Garamond",serif;font-size:20px}.footer-grid blockquote span{display:block;margin-top:10px;font-family:"Inter",sans-serif;font-size:12px;color:#c4cbd6}.footer-bottom{margin-top:42px;padding:18px 0 24px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:20px;color:#c4cbd6;font-size:12px}@media(max-width:900px){.main-nav{position:absolute;left:0;right:0;top:86px;display:none;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--border);padding:10px 20px 22px}.main-nav.open{display:flex}.main-nav a{width:100%;padding:13px 0}.main-nav a::after{display:none}.menu-toggle{width:40px;height:40px;display:inline-flex;flex-direction:column;justify-content:center;gap:5px;background:none;border:0}.menu-toggle span{width:24px;height:2px;background:var(--red-dark);display:block}.two-col,.about-preview,.footer-grid{grid-template-columns:1fr}.feature-grid,.news-grid{grid-template-columns:repeat(2,1fr)}.gallery-grid{grid-template-columns:repeat(2,1fr)}.about-image{max-height:420px}}@media(max-width:620px){.container{width:min(100% - 28px,1180px)}.header-inner{min-height:76px}.main-nav{top:76px}.brand strong{font-size:21px}.brand-kicker,.brand small{font-size:9px}.brand-cross{font-size:34px}.hero{min-height:700px}.hero h1{font-size:54px}.hero-quote{font-size:21px}.section{padding:54px 0}.section h2,.gallery-section h2{font-size:36px}.two-col{gap:48px}.service-row{grid-template-columns:1fr auto}.service-row strong{grid-column:1/-1;grid-row:2;color:var(--muted)}.service-row time{grid-column:2;grid-row:1}.feature-grid,.news-grid,.gallery-grid{grid-template-columns:1fr}.news-card{grid-template-columns:minmax(0,1fr)}.news-card img{width:100%;height:auto}.gallery-grid img{height:300px}.footer-bottom{flex-direction:column}}

/* White schedule and burgundy parish news. */
.intro-section h2 { color: var(--red-dark); }
.intro-section .eyebrow.red, .intro-section .text-link { color: var(--red); }
.intro-section .section-mark { background: var(--red); }
.intro-section .about-copy p, .intro-section .service-row strong { color: var(--red); }
.intro-section .service-list, .intro-section .service-row { border-color: rgba(123,31,37,.2); }
.news-section h2, .news-section .eyebrow.red, .news-section .text-link { color: var(--paper); }
.news-section .news-card time, .news-section .news-card p { color: #f1e1da; }
.news-section .news-card { border-color: rgba(251,248,242,.25); align-content: start; }
.news-section .news-card h3 a:hover { color: var(--paper); text-decoration: underline; text-underline-offset: 4px; }
.news-section a:focus-visible { outline-color: var(--paper); }
.gallery-section .eyebrow.light { color: var(--red); }

/* Gold interlace above the blue footer, with the official SPC crest. */
.site-footer { position: relative; padding-top: 52px; }
.footer-brand { align-items: center; gap: 22px; }
.footer-spc-logo { display: block; flex: 0 0 120px; width: 120px; height: 140px; overflow: hidden; }
.footer-spc-logo img { width: 394px; height: 140px; max-width: none; }
.footer-spc-logo:focus-visible { outline: 2px solid #f2d6a5; outline-offset: 5px; }
@media (max-width:620px) {
 .site-footer { padding-top: 40px; }
 .footer-brand { gap: 18px; }
 .footer-spc-logo { flex-basis: 96px; width: 96px; height: 112px; }
 .footer-spc-logo img { width: 315.2px; height: 112px; }
}

/* Closing ornament remains inside the blue footer below the copyright. */
.site-footer::after { content: ""; display: block; height: 54px; background: url("assets/footer-ornament.svg") center / 160px 54px repeat-x; border-block: 1px solid rgba(199,165,106,.45); opacity: .85; pointer-events: none; }

/* Inner pages and maps. */
.page-section h1 { margin: 0 0 26px; font-family: "Cormorant Garamond", serif; font-size: clamp(38px, 5vw, 60px); line-height: 1.1; color: var(--red-dark); }
.page-lead { font-size: 19px; color: var(--muted); }
.contact-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); align-items: start; gap: 54px; }
.church-contact { margin: 28px 0; }
.church-contact > div { padding: 12px 0; border-bottom: 1px solid var(--border); }
.church-contact dt { font-size: 12px; color: var(--muted); }
.church-contact dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.contact-map iframe { width: 100%; height: 440px; border: 0; display: block; }
.footer-map { min-width: 0; }
.footer-map iframe { display: block; width: 100%; height: 180px; border: 0; margin-bottom: 12px; }
.footer-map > a { color: #f2d6a5; font-size: 12px; }
.about-page-content { max-width: 840px; }
.about-page-note { margin: 36px 0; padding: 26px; background: var(--cream); border-left: 3px solid var(--gold); }
.page-actions { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; }
.main-nav a[aria-current="page"] { color: var(--red); }
.main-nav a[aria-current="page"]::after { width: 100%; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width:900px) { .contact-layout { grid-template-columns: 1fr; gap: 32px; } .footer-map iframe { max-width: 600px; } }
@media (max-width:620px) { .contact-map iframe { height: 320px; } }

/* Full photographs arranged in columns at their natural aspect ratios. */
.gallery-page-grid { columns: 3; column-gap: 28px; margin-top: 36px; }
.gallery-photo { display: inline-block; width: 100%; margin: 0 0 28px; break-inside: avoid; vertical-align: top; }
.gallery-photo a { display: block; background: var(--cream); }
.gallery-photo img { display: block; width: 100%; height: auto; }
.gallery-photo figcaption { padding-top: 12px; font-size: 13px; color: var(--muted); }
@media (max-width:900px) { .gallery-page-grid { columns: 2; } }
@media (max-width:620px) { .gallery-page-grid { columns: 1; } .gallery-photo { margin-bottom: 24px; } }

/* Burgundy background for the About church page. */
.about-church-section { background: var(--red); color: #fff; }
.about-church-section h1, .about-church-section h2 { color: #fff; }
.about-church-section .eyebrow, .about-church-section .text-link { color: #f2d6a5; }
.about-church-section .page-lead { color: #f4e6df; }
.about-church-section .about-page-note { background: rgba(0,0,0,.12); border-left-color: #f2d6a5; }
.about-church-section .btn-primary { background: var(--red-dark); border-color: rgba(255,255,255,.4); }
.about-church-section .btn-primary:hover { background: var(--red-deep); }

/* Consistent vector arrows instead of device-dependent symbol glyphs. */
.inline-icon { display: inline-block; width: 1em; height: 1em; margin-left: .25em; vertical-align: -.12em; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* Inverted colors for the hero schedule button. */
.hero .btn-primary { background: #fff; color: var(--red); border-color: #fff; }
.hero .btn-primary:hover { background: var(--cream); color: var(--red-dark); border-color: var(--cream); }

/* Compact news list and five-item pagination. */
.news-page { background: var(--paper); }
.news-page-content { max-width: 1120px; }
.news-count { color: var(--muted); font-size: 13px; margin: -10px 0 30px; }
.news-count:empty { display: none; }
.news-feed { display: flex; flex-direction: column; gap: 32px; }
.news-entry { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 34px; padding: 0 0 32px; border-bottom: 1px solid var(--border); scroll-margin-top: 110px; }
.news-entry[hidden] { display: none; }
.news-entry time { color: var(--muted); font-size: 13px; }
.news-entry h2 { margin: 8px 0 18px; font-size: 36px; line-height: 1.15; }
.news-entry img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; background: var(--cream); }
.news-entry p { margin: 0; font-size: 16px; line-height: 1.8; }
.news-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 36px; }
.news-pagination[hidden] { display: none; }
.news-pagination button { min-width: 44px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--border); background: #fff; color: var(--red); font: inherit; font-size: 13px; cursor: pointer; }
.news-pagination button:hover:not(:disabled), .news-pagination button[aria-current="page"] { background: var(--red); color: #fff; border-color: var(--red); }
.news-pagination button:disabled { opacity: .45; cursor: default; }
#news-heading { scroll-margin-top: 110px; }
.news-card h3 a:hover { color: var(--red); }
@media (min-width:901px) and (max-width:1150px) { .main-nav { gap: 14px; font-size: 12px; } .header-inner { gap: 20px; } }
@media (max-width:620px) {
 .news-entry { grid-template-columns: minmax(0, 1fr); gap: 18px; }
 .news-entry img { height: auto; }
 .news-entry h2 { font-size: 32px; }
}

/* Instagram links use a vector icon on every device. */
.instagram-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; max-width: 100%; }
.instagram-link span { min-width: 0; overflow-wrap: anywhere; }
.instagram-icon { width: 21px; height: 21px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.7; }
.site-footer .instagram-link { color: #f2d6a5; }
.church-contact .instagram-link { color: var(--red); }
.instagram-link:hover span { text-decoration: underline; text-underline-offset: 4px; }

/* Responsive YouTube video below the home gallery. */
.video-section { background: #fff; }
.video-player { aspect-ratio: 16 / 9; width: 100%; background: #161d2a; }
.video-player iframe { display: block; width: 100%; height: 100%; border: 0; }
@media (max-width:620px) { .video-section .section-title-row { align-items: flex-start; flex-direction: column; gap: 12px; } }

/* Parish history and archival photographs. */
.about-page-content > p { line-height: 1.9; }
.about-page-content > h2 { margin-top: 44px; margin-bottom: 20px; }
.history-photo { margin: 36px 0 44px; }
.history-photo img { display: block; width: 100%; height: auto; }
.history-photo figcaption { margin-top: 12px; color: #f2d6a5; font-size: 13px; }
.history-quote { margin: 28px 0; padding: 24px 28px; border-left: 3px solid #f2d6a5; background: rgba(0,0,0,.12); }
.history-quote p { margin: 0 0 16px; line-height: 1.85; }
.history-quote footer { color: #f2d6a5; font-size: 13px; }
@media (max-width:620px) { .history-quote { padding: 20px; margin-inline: 0; } }

/* Parish logo beside the name in the shared header. */
.header-church-logo { width: 78px; height: 64px; object-fit: contain; flex-shrink: 0; }
.site-header .brand { min-width: 0; }
.menu-toggle { flex-shrink: 0; }
@media (max-width:620px) {
 .header-church-logo { width: 52px; height: 48px; }
 .site-header .brand { gap: 10px; }
 .header-inner { gap: 12px; }
}

.footer-church-logo { display: block; flex: 0 0 120px; }
.footer-church-logo img { width: 120px; height: auto; }
@media (max-width:620px) { .footer-church-logo { flex-basis: 90px; } .footer-church-logo img { width: 90px; } }

/* Parish and SPC logos shown together. */
.footer-brand { flex-direction: column; align-items: flex-start; gap: 18px; }
.footer-logos { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }

/* Balanced footer columns and consistent contact spacing. */
.site-footer .footer-grid { grid-template-columns: minmax(350px, 1.3fr) minmax(190px, .8fr) minmax(240px, 1fr); gap: 36px; }
.footer-brand { gap: 20px; }
.footer-brand strong { display: block; white-space: nowrap; font-size: 27px; line-height: 1.2; margin-bottom: 12px; }
.footer-logos { height: 112px; gap: 28px; align-items: center; }
.footer-logos .footer-church-logo { flex: 0 0 120px; }
.footer-logos .footer-church-logo img { width: 120px; }
.footer-logos .footer-spc-logo { flex: 0 0 96px; width: 96px; height: 112px; }
.footer-logos .footer-spc-logo img { width: 315.2px; height: 112px; }
.footer-grid h4 { margin: 0 0 20px; }
.footer-contact p { margin: 0 0 14px; line-height: 1.65; }
.footer-contact .instagram-link { min-height: 0; color: inherit; }
.footer-contact a:hover { color: #f2d6a5; }
.footer-brand p { margin: 6px 0; }
@media (max-width:1000px) {
 .site-footer .footer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; }
 .footer-brand { grid-column: 1 / -1; }
}
@media (max-width:620px) {
 .site-footer .footer-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
 .footer-brand strong { font-size: clamp(21px, 5.4vw, 27px); }
 .footer-contact p { margin-bottom: 14px; }
}

/* White parish sketch beside the hero introduction. */
.hero-content.hero-introduction { max-width: 1180px; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); align-items: center; gap: clamp(28px, 5vw, 70px); padding-block: 60px; }
.hero-church-sketch { width: 100%; height: auto; max-width: 360px; justify-self: center; }
.hero-introduction-copy { min-width: 0; }
.hero-introduction h1 { font-size: clamp(42px, 5.2vw, 68px); line-height: 1.04; }
.hero-description { max-width: 640px; margin: 26px 0 30px; font-size: 18px; line-height: 1.8; color: #f4efe6; }
@media (max-width:620px) {
 .hero-content.hero-introduction { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-block: 40px; }
 .hero-church-sketch { max-width: 160px; justify-self: start; }
 .hero-introduction h1 { font-size: clamp(36px, 9vw, 48px); }
 .hero-description { font-size: 14px; line-height: 1.5; letter-spacing: normal; word-spacing: normal; text-align: left; margin-block: 16px 22px; }
}

/* Keep the complete church name on one line within the hero text column. */
.hero-introduction-copy { container-type: inline-size; }
.hero-introduction h1 { font-size: clamp(20px, 2.8vw, 38px); font-size: 5.2cqi; white-space: nowrap; line-height: 1.2; }
@media (max-width:620px) {
 .hero-introduction h1 { font-size: 4.7vw; font-size: 5.2cqi; }
}

/* Text-only hero. */
.hero-content.hero-introduction { grid-template-columns: minmax(0, 1fr); }
.hero-introduction-copy { width: 100%; max-width: 760px; }

.hero-introduction h1 { text-transform: uppercase; font-size: 4.5cqi; }

/* Subtle decorative birds crossing the upper part of the hero. */
.hero-birds { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hero-bird { position: absolute; top: 14%; left: 0; width: 38px; color: rgba(255,255,255,.7); opacity: 0; animation: bird-from-left 19s linear infinite; animation-delay: -3s; }
.hero-bird:nth-child(2) { top: 24%; left: auto; right: 0; width: 27px; animation-name: bird-from-right; animation-duration: 23s; animation-delay: -10s; }
.hero-bird:nth-child(3) { top: 8%; width: 22px; animation-name: bird-high-arc; animation-duration: 28s; animation-delay: -17s; }
.hero-bird svg { display: block; width: 100%; overflow: visible; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.bird-wing { transform-origin: 32px 22px; }
.bird-wing-left { animation: bird-left-wing 2.4s ease-in-out infinite alternate; }
.bird-wing-right { animation: bird-right-wing 2.4s ease-in-out infinite alternate; }
.hero-bird:nth-child(2) .bird-wing { animation-delay: -.8s; }
.hero-bird:nth-child(3) .bird-wing { animation-delay: -1.6s; }
@keyframes bird-from-left {
  0% { transform: translate(-60px, 24px) rotate(-8deg); opacity: 0; }
  10% { opacity: .8; }
  30% { transform: translate(18vw, -22px) rotate(5deg); opacity: .8; }
  50% { transform: translate(35vw, 12px) rotate(-4deg); opacity: .65; }
  70%, 100% { transform: translate(51vw, -36px) rotate(8deg); opacity: 0; }
}
@keyframes bird-from-right {
  0% { transform: translate(60px, -15px) rotate(7deg); opacity: 0; }
  12% { opacity: .65; }
  32% { transform: translate(-17vw, 25px) rotate(-6deg); opacity: .65; }
  51% { transform: translate(-33vw, -12px) rotate(4deg); opacity: .5; }
  72%, 100% { transform: translate(-49vw, -55px) rotate(-9deg); opacity: 0; }
}
@keyframes bird-high-arc {
  0% { transform: translate(-45px, 40px) rotate(-5deg); opacity: 0; }
  15% { opacity: .45; }
  34% { transform: translate(21vw, 0) rotate(6deg); opacity: .45; }
  53% { transform: translate(38vw, 28px) rotate(-3deg); opacity: .3; }
  74%, 100% { transform: translate(57vw, 5px) rotate(4deg); opacity: 0; }
}
@keyframes bird-left-wing { from { transform: rotate(-9deg); } to { transform: rotate(13deg); } }
@keyframes bird-right-wing { from { transform: rotate(9deg); } to { transform: rotate(-13deg); } }
@media (max-width:620px) { .hero-bird { width: 28px; } .hero-bird:nth-child(2) { width: 22px; } .hero-bird:nth-child(3) { width: 18px; } }
@media (prefers-reduced-motion:reduce) { .hero-birds { display: none; } .hero-bird, .bird-wing { animation: none; } }

/* Parish logo above the hero heading, within the text block. */
.hero-title-logo { display: block; width: 150px; height: auto; margin: 0 0 24px; }
@media (max-width:620px) { .hero-title-logo { width: 110px; margin-bottom: 20px; } }

/* Three balanced marks: SPC, Diocese of Žiča and the parish. */
.footer-logos { height: auto; min-height: 100px; gap: 18px; }
.footer-diocese-logo { display: flex; align-items: center; flex: 0 0 88px; }
.footer-diocese-logo img { width: 88px; height: 100px; object-fit: contain; }
.footer-logos .footer-church-logo { flex-basis: 100px; }
.footer-logos .footer-church-logo img { width: 100px; }

/* Larger introduction anchored toward the lower left of the photograph. */
.hero { align-items: flex-end; }
.hero-content.hero-introduction { width: calc(100% - 80px); max-width: 1320px; padding-block: 100px 76px; }
.hero-introduction-copy { max-width: 1000px; }
.hero-introduction h1 { font-size: clamp(26px, 3.4vw, 46px); font-size: 4.6cqi; line-height: 1.15; }
.hero-description { max-width: 660px; }
@media (max-width:620px) {
 .hero-content.hero-introduction { width: calc(100% - 28px); padding-block: 70px 48px; }
 .hero-introduction h1 { font-size: 4.7vw; font-size: 4.6cqi; }
}

/* Quiet photographic hero: warm white typography and a restrained burgundy veil. */
.home-page .site-header { background: rgba(251,248,242,.98); border-bottom-color: rgba(86,18,24,.12); }
.home-page .header-inner { min-height: 94px; }
.home-page .brand strong { font-weight: 600; }
.hero.hero-refined { min-height: 690px; align-items: center; background: #481820 url("assets/CrkvaSVIlije.png") center 48% / cover no-repeat; isolation: isolate; }
.hero-refined .hero-overlay { background: linear-gradient(90deg, rgba(64,15,24,.94) 0%, rgba(72,20,30,.8) 26%, rgba(72,20,30,.4) 43%, rgba(72,20,30,.06) 64%, transparent 100%); }
.hero-refined .hero-content { width: min(1180px, calc(100% - 80px)); max-width: 1180px; display: block; padding: 76px 0 84px; }
.hero-refined .hero-introduction-copy { width: 44%; max-width: 490px; container-type: normal; color: var(--paper); }
.hero-refined h1 { margin: 0; font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(44px, 4.6vw, 68px); line-height: 1.04; font-weight: 500; letter-spacing: -.025em; white-space: normal; text-transform: none; }
/* Complete footer-inspired interlace with closed ends. */
.hero-ornament {
  width: 216px;
  max-width: 100%;
  height: 48px;
  margin: 16px 0 0;
  background-color: rgba(251,248,242,.65);
  -webkit-mask: url("assets/hero-ornament.svg") center / contain no-repeat;
  mask: url("assets/hero-ornament.svg") center / contain no-repeat;
}
.hero-subtitle { margin: 22px 0 0; color: #f1e7e2; font-size: 14px; letter-spacing: .09em; }
.hero-refined .hero-description { max-width: 385px; margin: 12px 0 32px; font-size: 15px; line-height: 1.8; color: #f1e7e2; }
.hero-refined .btn-primary { min-height: 50px; padding: 0 24px; background: var(--paper); border-color: var(--paper); color: var(--red-dark); font-size: 11px; font-weight: 600; letter-spacing: .06em; }
.hero-refined .btn-primary:hover { background: #eee5db; border-color: #eee5db; }
.home-page #bogosluzenja { scroll-margin-top: 94px; }
@media (min-width:901px) and (max-width:1150px) {
 .home-page .header-inner { gap: 16px; }
 .home-page .main-nav { gap: 12px; font-size: 11px; }
 .home-page .header-church-logo { width: 60px; }
 .home-page .brand strong { font-size: 23px; }
}
@media (max-width:900px) {
 .home-page .main-nav { top: 94px; }
 .hero-refined .hero-content { width: calc(100% - 48px); }
 .hero-refined .hero-introduction-copy { width: 47%; }
 .hero-refined h1 { font-size: 46px; }
}
@media (max-width:620px) {
 .home-page .header-inner { min-height: 80px; }
 .home-page .main-nav { top: 80px; }
 .home-page .brand strong { font-size: clamp(18px, 4.7vw, 22px); line-height: 1.05; }
 .home-page .header-church-logo { width: 46px; }
 .hero.hero-refined { min-height: 0; background-size: auto 400px; background-position: center top; align-items: flex-end; }
 .hero-refined .hero-overlay { background: linear-gradient(180deg, transparent 0, transparent 240px, rgba(72,24,32,.3) 310px, #481820 400px); }
 .hero-refined .hero-content { width: calc(100% - 40px); padding: 345px 0 44px; }
 .hero-refined .hero-introduction-copy { width: 100%; max-width: none; }
 .hero-ornament { margin: 12px 0 0; }
 .hero-refined h1 { font-size: clamp(40px, 10.8vw, 56px); }
 .hero-subtitle { font-size: 12px; margin-top: 18px; letter-spacing: .07em; }
 .hero-refined .hero-description { max-width: 370px; font-size: 14px; line-height: 1.65; margin: 10px 0 26px; }
 .home-page #bogosluzenja { scroll-margin-top: 80px; }
}

/* A discreet external link within the hero subtitle. */
.hero-diocese-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding-block: 6px;
  margin-block: -6px;
  color: inherit;
  vertical-align: baseline;
  transition: color .2s ease;
}
.hero-diocese-link span {
  text-decoration: underline;
  text-decoration-color: rgba(241,231,226,.4);
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  transition: text-decoration-color .2s ease;
}
.hero-diocese-link svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hero-diocese-link:hover, .hero-diocese-link:focus-visible { color: #fff; }
.hero-diocese-link:hover span, .hero-diocese-link:focus-visible span { text-decoration-color: currentColor; }
.hero-diocese-link:focus-visible { outline: 2px solid var(--paper); outline-offset: 5px; border-radius: 2px; }
@media (prefers-reduced-motion: reduce) {
  .hero-diocese-link, .hero-diocese-link span { transition: none; }
}

/* Individual news article. */
.news-image-link { display: block; }
.news-entry h2 a:hover { text-decoration: underline; text-underline-offset: 5px; }
.news-read-more { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px; min-height: 44px; }
.article-page { background: var(--paper); padding: 38px 0 72px; }
.parish-article { max-width: 960px; }
.article-breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 12px; margin-bottom: 48px; }
.article-breadcrumb a:hover { color: var(--red); text-decoration: underline; }
.article-heading { max-width: 740px; margin: 0 auto 34px; }
.article-heading h1 { margin: 0 0 20px; font-family: "Cormorant Garamond", Georgia, serif; font-size: clamp(42px, 5vw, 64px); line-height: 1.08; font-weight: 600; color: var(--red-dark); }
.article-heading time { color: var(--muted); font-size: 13px; }
.article-photo { margin: 0 auto 36px; width: 100%; }
.article-photo img { width: 100%; height: auto; }
.article-photo figcaption { margin-top: 12px; color: var(--muted); font-size: 12px; }
.article-body { max-width: 740px; margin: 0 auto; font-size: 17px; line-height: 1.9; }
.article-lead { margin: 0; font-size: 21px; color: var(--red-dark); }
.article-return { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--border); }
.article-return a { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; }
@media (max-width:620px) {
  .article-page { padding: 28px 0 48px; }
  .article-breadcrumb { margin-bottom: 32px; }
  .article-heading { margin-bottom: 26px; }
  .article-lead { font-size: 19px; }
}
.news-load-notice { color: var(--muted); font-size: 13px; padding: 12px 0; }

.service-row > span, .service-row > strong { min-width: 0; overflow-wrap: anywhere; }

.article-gallery { columns: 2; column-gap: 20px; margin: 32px 0; }
.article-gallery figure { margin: 0 0 20px; break-inside: avoid; }
.article-gallery img { width: 100%; height: auto; }
@media (max-width: 620px) { .article-gallery { columns: 1; } }

.embed-preview { position: relative; width: 100%; height: 100%; background: var(--cream); color: var(--red-dark); }
.footer-map .embed-preview { height: 180px; margin-bottom: 12px; }
.contact-map .embed-preview { height: 440px; }
.video-player .embed-preview { background: #161d2a; color: var(--paper); }
.embed-preview > iframe { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.embed-loader { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; background: inherit; color: inherit; font-size: 13px; pointer-events: none; }
.embed-spinner { width: 34px; height: 34px; border: 3px solid rgba(177,138,75,.25); border-top-color: var(--gold); border-radius: 50%; animation: embed-spin .9s linear infinite; }
.embed-preview:has(noscript a) .embed-loader { display: none; }
@keyframes embed-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .embed-spinner { animation: none; } }
@media (max-width: 620px) { .contact-map .embed-preview { height: 320px; } }

.glog-preview { background: var(--cream); }
.glog-preview-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 48px; }
.glog-preview-layout > a { display: block; }
.glog-preview img { width: 100%; height: auto; }
.glog-preview h2 { margin-bottom: 18px; }
.glog-preview p:not(.eyebrow) { margin: 0 0 24px; line-height: 1.85; color: var(--muted); }
@media (max-width: 760px) { .glog-preview-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; } }