/* ================================================================
   CATHOLIC CHURCH THEME — LIGHT MODE
   Paroki Santo Yoseph Matraman
   Revision: Ivory/Cream + Gold + Burgundy palette
             EB Garamond — single font (body & headings)
             Hamburger-only navbar (all screen sizes)
             Left slide-in sidebar drawer
   ================================================================ */

/* ── Google Fonts ──────────────────────────────────────────────── */
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Cinzel:wght@400;500;600&display=swap");

/* ── CSS Custom Properties ─────────────────────────────────────── */
:root {
    --ivory: #faf6ee;
    --ivory-dark: #f0e8d8;
    --ivory-card: #fffdf7;
    --ivory-border: #e8deca;
    --gold: #b89a0c;
    --gold-light: #c9a861;
    --gold-dim: rgba(184, 154, 12, 0.3);
    --burgundy: #6d2b35;
    --burgundy-light: #8a3542;
    --burgundy-dim: rgba(109, 43, 53, 0.12);
    --text: #2a180e;
    --text-muted: rgba(42, 24, 14, 0.6);
    --text-faint: rgba(42, 24, 14, 0.4);
    --text-ghost: rgba(42, 24, 14, 0.22);
    --border: rgba(42, 24, 14, 0.1);
    --border-gold: rgba(184, 154, 12, 0.28);
    --font-primary: "Chamberi", Georgia, serif;        /* body text / long text */
    --font-heading: "Cinzel", Georgia, serif;            /* h1–h6 headings */
    --font-label: "Cinzel", Georgia, serif;              /* small labels, tags, eyebrow */
    --shadow: rgba(42, 24, 14, 0.1);
    --shadow-md: rgba(42, 24, 14, 0.18);
}

/* ================================================================
   GLOBAL / BASE
   ================================================================ */

html,
body {
    background-color: var(--ivory);
    color: var(--text);
    font-family: var(--font-primary);
}

/* Subtle parchment texture */
body {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
}

/* Headings: Chamberi — consistent between light and dark */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    color: var(--text);
}

/* ================================================================
   BREADCRUMB BAR — Replaces navbar (hamburger + page trail)
   ================================================================ */

/* Hide old navbar just in case */
.navbar {
    display: none !important;
}

/* Floating pill — top-left, no full-width bar */
.breadcrumb-bar {
    position: fixed;
    top: 18px;
    left: 20px;
    z-index: 100;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 10px 14px;
    background: rgba(250, 246, 238, 0.92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border-gold);
    border-radius: 999px;
    box-shadow: 0 2px 12px rgba(42, 24, 14, 0.12);
}

/* Logo link in breadcrumb bar */
.breadcrumb-bar__logo-wrap {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    text-decoration: none;
}

.breadcrumb-bar__logo {
    display: block;
    object-fit: contain;
}

/* Hamburger toggle */
.breadcrumb-bar__toggle {
    background: none;
    border: 1px solid var(--border-gold);
    color: var(--text);
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    padding: 5px 9px;
    border-radius: 4px;
    flex-shrink: 0;
    transition:
        border-color 0.2s,
        color 0.2s,
        background 0.2s;
}

.breadcrumb-bar__toggle:hover {
    color: var(--burgundy);
    border-color: var(--burgundy);
    background: var(--burgundy-dim);
}

/* Breadcrumb trail */
.breadcrumb-bar__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    font-family: var(--font-primary);
    font-size: 0.95rem;
    color: var(--text-muted);
}

.breadcrumb-bar__item {
    display: flex;
    align-items: center;
}

.breadcrumb-bar__item--current {
    color: var(--text);
    font-weight: 500;
}

.breadcrumb-bar__link {
    color: var(--text-muted);
    text-decoration: none;
    transition: color 0.15s;
}

.breadcrumb-bar__link:hover {
    color: var(--burgundy);
}

.breadcrumb-bar__sep {
    color: var(--text-ghost);
    font-size: 0.8rem;
    padding: 0 5px;
    user-select: none;
    list-style: none;
    display: flex;
    align-items: center;
}

/* ================================================================
   PAGE CONTENT PADDING — room for floating breadcrumb
   ================================================================ */

/* Push page-hero and sections down so floating pill doesn't overlap */
.page-hero {
    padding-top: 100px;
    min-height: 520px;
}

#pjax-container > *:first-child:not(.page-hero) {
    padding-top: 100px;
}

/* ================================================================
   OFFCANVAS — Left slide-in drawer
   ================================================================ */

.offcanvas__backdrop {
    background: rgba(20, 8, 4, 0.55);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

/* Override centered modal → left drawer */
.offcanvas .offcanvas__panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    max-width: 85vw;
    height: 100%;
    max-height: 100%;
    border-radius: 0 16px 16px 0;
    background: var(--ivory-card);
    border: none;
    border-right: 1px solid var(--border-gold);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: 4px 0 32px var(--shadow-md);
    /* Slide from left */
    transform: translateX(-100%);
    transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
    animation: none;
    /* Stack content top-to-bottom */
    align-items: flex-start;
    justify-content: flex-start;
    padding: 64px 28px 48px;
    gap: 28px;
    overflow-y: auto;
}

.offcanvas.is-open .offcanvas__panel {
    transform: translateX(0);
}

/* Cross ornament removed — logo used instead */
.offcanvas .offcanvas__panel::before {
    content: none;
}

/* Logo in offcanvas drawer */
.offcanvas__brand {
    width: 100%;
    display: flex;
    justify-content: center;
}

.offcanvas__logo {
    display: block;
    object-fit: contain;
}

/* Close button */
.offcanvas__close {
    color: var(--text);
    font-size: 1rem;
    opacity: 0.5;
    top: 20px;
    right: 16px;
}

.offcanvas__close:hover {
    opacity: 1;
    color: var(--burgundy);
}

/* Nav menu inside drawer — left-aligned */
.offcanvas__menu {
    width: 100%;
}

.offcanvas__menu ul {
    align-items: flex-start;
    text-align: left;
    gap: 0;
}

.offcanvas__menu > ul > li {
    width: 100%;
    border-bottom: 1px solid var(--border-gold);
    padding: 12px 0;
}

.offcanvas__menu > ul > li:first-child {
    border-top: 1px solid var(--border-gold);
}

.offcanvas__menu a {
    font-family: var(--font-primary);
    font-size: 1.1rem;
    color: var(--text);
    letter-spacing: 0.04em;
}

.offcanvas__menu a:hover {
    color: var(--burgundy);
    opacity: 1;
}

/* Accordion toggles */
.offcanvas__acc-toggle {
    font-family: var(--font-primary);
    font-size: 1.1rem;
    color: var(--text);
    letter-spacing: 0.04em;
}

.offcanvas__acc-toggle:hover {
    color: var(--burgundy);
    opacity: 1;
}

.offcanvas__acc-arrow {
    color: var(--gold);
    opacity: 0.8;
}

/* Sub-menu links */
.offcanvas__submenu a {
    font-size: 0.95rem;
    color: var(--text-muted);
}

.offcanvas__submenu a:hover {
    color: var(--burgundy);
}

/* Ensure dropdown items align left */
.offcanvas__has-dropdown {
    align-items: flex-start;
}

/* CTA button in drawer */
.offcanvas__btn {
    display: block !important;
    margin-top: 8px;
    padding: 10px 20px !important;
    background: var(--burgundy) !important;
    color: #fff !important;
    font-family: var(--font-primary) !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-align: center;
    border-radius: 4px;
    text-decoration: none;
    transition: background 0.22s;
    width: 100%;
    box-sizing: border-box;
}

.offcanvas__btn:hover {
    background: var(--burgundy-light) !important;
    color: #fff !important;
}

/* Override button-primary fill animation for the offcanvas CTA */
.offcanvas__btn::before {
    display: none !important;
}

/* ================================================================
   BUTTON PRIMARY — general context (gold/burgundy theme)
   ================================================================ */

.button-primary {
    color: var(--text);
    font-size: 1rem;
    letter-spacing: 0.05em;
}

.button-primary::before {
    background: var(--gold);
}

.button-primary:hover {
    color: var(--text);
}

/* ================================================================
   SECTION 2 / JADWAL MISA (homepage)
   ================================================================ */

.section-2 {
    background-color: var(--ivory-dark);
}

.section-2::before {
    background: var(--gold-light);
    opacity: 0.3;
    filter: blur(120px);
}

.jadwal__label {
    color: var(--text-faint);
    letter-spacing: 0.16em;
    font-family: var(--font-label);
}

.jadwal__title {
    color: var(--text);
    font-family: var(--font-heading);
}

.jadwal__card {
    background: var(--ivory-card);
    border: 1px solid var(--border);
    box-shadow: 0 2px 16px var(--shadow);
}

.jadwal__card:hover {
    border-color: var(--gold-dim);
    box-shadow: 0 6px 24px var(--shadow-md);
}

.jadwal__card--highlight {
    background: var(--burgundy);
    border-color: transparent;
    box-shadow: 0 4px 24px rgba(109, 43, 53, 0.35);
}

.jadwal__card--highlight .jadwal__hari,
.jadwal__card--highlight .jadwal__waktu,
.jadwal__card--highlight .jadwal__nama {
    color: rgba(255, 255, 255, 0.92);
}

.jadwal__card--highlight .jadwal__item {
    border-bottom-color: rgba(255, 255, 255, 0.15);
}

.jadwal__card--highlight:hover {
    border-color: rgba(255, 255, 255, 0.25);
}

.jadwal__hari {
    color: var(--text-faint);
}

.jadwal__waktu {
    color: var(--burgundy);
}

.jadwal__nama {
    color: var(--text-muted);
}

/* ================================================================
   SEJARAH SECTION (homepage + sub-page)
   ================================================================ */

.sejarah {
    background-color: var(--ivory);
    min-height: auto;
}

.sejarah__label {
    color: var(--text-faint);
    font-family: var(--font-label);
}

.sejarah__body {
    color: var(--text-muted);
}

.sejarah__quote {
    color: var(--text);
    border-left-color: var(--gold);
    font-family: var(--font-primary);
    font-size: clamp(1.3rem, 2.2vw, 2rem);
}

.sejarah__img {
    filter: grayscale(15%) brightness(1.02);
}

.sejarah__img:hover {
    filter: grayscale(0%) brightness(1.05);
}

/* Ornamental divider between sejarah sections */
.sejarah__right > * + * {
    padding-top: 40px;
}

/* ================================================================
   BERITA SECTION (homepage)
   ================================================================ */

.berita {
    background-color: var(--ivory);
}

/* Remove orange light beams */
.berita::before,
.berita::after {
    display: none;
}

.berita__label {
    color: var(--text-faint);
    font-family: var(--font-label);
}

.berita__counter {
    color: var(--text-ghost);
}

.berita__title {
    color: var(--text);
    font-family: var(--font-heading);
}

.berita__card-tag {
    color: var(--text-ghost);
}

.berita__card--featured .berita__card-tag {
    color: var(--text-faint);
}

.berita__card-title {
    color: var(--text);
}

.berita__nav-btn {
    color: var(--text-faint);
}

.berita__nav-btn:hover {
    color: var(--text);
}

.berita__nav {
    border-top-color: var(--border);
}

.berita__nav-current {
    color: var(--text);
    font-family: var(--font-primary);
}

.berita__nav-sep {
    color: var(--text-ghost);
}

.berita__nav-total {
    color: var(--text-faint);
}

.berita__dot {
    background: var(--text-ghost);
}

.berita__dot--active {
    background: var(--gold);
}

/* ================================================================
   PENGUMUMAN SECTION (homepage)
   ================================================================ */

.pengumuman {
    background: var(--ivory-dark);
}

.pengumuman__eyebrow {
    color: var(--text-faint);
    font-family: var(--font-label);
}

.pengumuman__title {
    color: var(--text);
    font-family: var(--font-heading);
}

.pengumuman__nav-btn {
    color: var(--text-faint);
}

.pengumuman__nav-btn:hover {
    color: var(--text);
}

.pengumuman__card-label {
    color: var(--text-ghost);
}

.pengumuman__side-title {
    color: var(--text-muted);
}

.pengumuman__card-title {
    color: var(--text);
}

.pengumuman__card-author {
    color: var(--text-faint);
}

.pengumuman__col p {
    color: var(--text-muted);
}

.pengumuman__view-all {
    color: var(--text-faint);
    font-family: var(--font-primary);
    font-style: italic;
}

.pengumuman__view-all:hover {
    color: var(--burgundy);
}

/* ================================================================
   FOOTER — Keep dark (deep warm brown) for contrast
   ================================================================ */

.footer {
    background: #1e0f08;
    border-top: 2px solid var(--border-gold);
}

.footer__logo {
    color: var(--ivory);
    font-family: var(--font-heading);
    font-weight: 700;
}

.footer__tagline {
    color: rgba(250, 246, 238, 0.45);
    font-style: italic;
}

.footer__nav-heading {
    color: rgba(250, 246, 238, 0.3);
    letter-spacing: 0.18em;
    font-size: 13.5px;
    font-weight: 600;
    text-transform: uppercase;
}

.footer__nav-link {
    color: rgba(250, 246, 238, 0.55);
}

.footer__nav-link:hover {
    color: var(--ivory);
}

.footer__bottom {
    border-top-color: rgba(250, 246, 238, 0.08);
}

.footer__copy,
.footer__address {
    color: rgba(250, 246, 238, 0.2);
}

.footer__nav-text {
    color: rgba(250, 246, 238, 0.3);
}

.footer__copy-link {
    color: rgba(250, 246, 238, 0.3);
}

.footer__copy-link:hover {
    color: rgba(250, 246, 238, 0.6);
}

.footer__social-link {
    border-color: rgba(250, 246, 238, 0.12);
    color: rgba(250, 246, 238, 0.35);
}

.footer__social-link:hover {
    color: var(--gold-light);
    border-color: rgba(201, 168, 97, 0.4);
}

/* ================================================================
   PAGE HERO (sub-page banners) — keep dark/dramatic, change accents
   ================================================================ */

.page-hero {
    background-color: #1a0c06;
}

.page-hero::after {
    background: linear-gradient(
        to top,
        #1a0c06 0%,
        rgba(26, 12, 6, 0.45) 60%,
        transparent 100%
    );
}

.page-hero__eyebrow {
    color: var(--gold-light);
    letter-spacing: 0.18em;
    font-family: var(--font-label);
}

.page-hero__title {
    color: var(--ivory);
    font-family: var(--font-heading);
}

.page-hero__accent {
    color: rgba(250, 246, 238, 0.4);
    font-style: italic;
}

/* ─── Ornamental separator under page hero eyebrow ───────── */
.page-hero__eyebrow::after {
    content: " ✦ ";
    opacity: 0.5;
}

/* ================================================================
   PAGE SECTIONS (sub-pages: all dark → ivory)
   ================================================================ */

.page-section {
    background: var(--ivory);
}

.page-section--alt {
    background: var(--ivory-dark);
}

/* Gothic-style ornamental section divider */
.page-section + .page-section::before,
.page-section--alt + .page-section::before,
.page-section + .page-section--alt::before {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(
        to right,
        transparent,
        var(--border-gold),
        transparent
    );
}

.page-label {
    color: var(--text-faint);
    letter-spacing: 0.18em;
}

.page-year {
    color: var(--text-ghost);
    font-family: var(--font-primary);
}

.page-body p {
    color: var(--text-muted);
}

.page-source {
    color: var(--text-ghost);
    border-top-color: var(--border-gold);
}

.page-section-title {
    color: var(--text-faint);
    letter-spacing: 0.2em;
}

/* ================================================================
   TIMELINE (Sejarah sub-page)
   ================================================================ */

.timeline__item {
    border-top-color: var(--border);
}

.timeline__year {
    color: var(--burgundy);
    font-weight: 600;
}

.timeline__title {
    color: var(--text);
}

.timeline__text {
    color: var(--text-muted);
}

/* ================================================================
   VISI-MISI
   ================================================================ */

.visi-statement__text {
    color: var(--text);
    border-left-color: var(--burgundy);
    font-family: var(--font-primary);
    font-size: clamp(1.2rem, 2vw, 1.75rem);
}

.misi-intro {
    color: var(--text-muted);
}

.misi-pillar {
    background: rgba(42, 24, 14, 0.02);
    border-color: var(--border);
}

.misi-pillar:hover {
    background: var(--burgundy-dim);
    border-color: rgba(109, 43, 53, 0.2);
}

.misi-pillar__name {
    color: var(--burgundy);
    letter-spacing: 0.14em;
}

.misi-pillar__text {
    color: var(--text-muted);
}

.values-list {
    background: var(--border);
}

.value-item {
    background: var(--ivory);
}

.value-item__num {
    color: var(--text-ghost);
}

.value-item__text {
    color: var(--text-muted);
}

/* ================================================================
   PASTOR PAGE
   ================================================================ */

.pastor-featured {
    border-bottom-color: var(--border);
}

.pastor-img-wrap {
    border: 1px solid var(--border) !important;
}

.pastor-role {
    color: var(--burgundy);
}

.pastor-name {
    color: var(--text);
    font-family: var(--font-primary);
}

.pastor-order,
.pastor-period {
    color: var(--text-faint);
}

.pastor-bio {
    color: var(--text-muted);
}

.pastor-list__item {
    border-top-color: var(--border);
}

.pastor-list__name {
    color: var(--text);
}

.pastor-list__order {
    color: var(--text-ghost);
    font-style: italic;
}

.pastor-list__period {
    color: var(--burgundy);
    font-weight: 600;
}

.pastor-list__item--note .pastor-list__name {
    color: var(--text-faint);
}

/* Inline-style classes from pastor.blade.php */
.pastor-img-wrap {
    border: 1px solid var(--border) !important;
}

.pastor-card {
    background: rgba(42, 24, 14, 0.03) !important;
    border: 1px solid var(--border) !important;
}

.pastor-card:hover {
    border-color: var(--gold-dim) !important;
    box-shadow: 0 6px 20px var(--shadow);
}

.pastor-card__role {
    color: var(--text-faint) !important;
}

.pastor-card__name {
    color: var(--text) !important;
    font-family: var(--font-primary) !important;
}

.pastor-card__period {
    color: var(--text-faint) !important;
}

.pastor-img--placeholder,
.pastor-card__img--placeholder {
    background: rgba(42, 24, 14, 0.04) !important;
    color: var(--text-ghost) !important;
}

/* ================================================================
   DEWAN PAROKI PAGE
   ================================================================ */

.dewan-grid .dewan-card {
    background: rgba(42, 24, 14, 0.03) !important;
    border: 1px solid var(--border) !important;
}

.dewan-grid .dewan-card:hover {
    border-color: var(--gold-dim) !important;
    box-shadow: 0 6px 20px var(--shadow);
}

.dewan-card__img--placeholder {
    background: rgba(42, 24, 14, 0.05) !important;
    color: var(--text-ghost) !important;
}

.dewan-card__jabatan {
    color: var(--text-faint) !important;
}

.dewan-card__nama {
    color: var(--text) !important;
    font-family: var(--font-primary) !important;
    font-size: 0.88rem !important;
}

/* ================================================================
   PETA PAROKI / MAP
   ================================================================ */

.map-embed {
    border: 1px solid var(--border);
}

.map-embed iframe {
    filter: none;
}

.map-info__item {
    background: rgba(42, 24, 14, 0.025);
    border-color: var(--border);
}

.map-info__label {
    color: var(--text-faint);
}

.map-info__value {
    color: var(--text-muted);
}

.jadwal-ops__item {
    border-top-color: var(--border);
}

.jadwal-ops__item:last-child {
    border-bottom-color: var(--border);
}

.jadwal-ops__day {
    color: var(--text-muted);
}

.jadwal-ops__time {
    color: var(--burgundy);
    font-weight: 600;
}

/* ================================================================
   BERITA PAGE (list)
   ================================================================ */

.berita-filter-section {
    background: var(--ivory-dark);
    border-bottom-color: var(--border);
}

.berita-filter__btn {
    border-color: var(--border);
    color: var(--text-faint);
    font-family: var(--font-primary);
    letter-spacing: 0.1em;
}

.berita-filter__btn:hover {
    color: var(--text);
    border-color: rgba(42, 24, 14, 0.32);
}

.berita-filter__btn--active {
    border-color: var(--burgundy);
    color: var(--burgundy);
    background: var(--burgundy-dim);
}

.berita-tag {
    color: var(--burgundy);
}

.berita-date {
    color: var(--text-ghost);
}

.berita-featured__title {
    color: var(--text);
    font-family: var(--font-primary);
}

.berita-featured__excerpt {
    color: var(--text-muted);
}

.berita-featured__link {
    color: var(--burgundy);
}

.berita-featured__link:hover {
    color: var(--burgundy-light);
    opacity: 1;
}

.berita-grid {
    background: var(--border);
    gap: 1px;
}

.berita-card__link {
    background: var(--ivory-card);
    border-color: transparent;
}

.berita-card__link:hover {
    background: rgba(42, 24, 14, 0.03);
}

.berita-card__title {
    color: var(--text);
    font-family: var(--font-primary);
    font-size: 0.92rem;
}

.berita-card__excerpt {
    color: var(--text-faint);
}

.berita-load-more__btn {
    border-color: var(--border);
    color: var(--text-faint);
    font-family: var(--font-primary);
    letter-spacing: 0.1em;
}

.berita-load-more__btn:hover {
    border-color: var(--burgundy);
    color: var(--burgundy);
}

/* ================================================================
   PENGUMUMAN PAGE (list)
   ================================================================ */

.pengumuman-pin {
    background: var(--burgundy-dim);
    border-color: rgba(109, 43, 53, 0.22);
}

.pengumuman-pin__category {
    color: var(--burgundy);
}

.pengumuman-pin__date {
    color: var(--text-ghost);
}

.pengumuman-pin__title {
    color: var(--text);
    font-family: var(--font-primary);
}

.pengumuman-pin__body {
    color: var(--text-muted);
}

.pengumuman-pin__link {
    color: var(--burgundy);
}

.pengumuman-pin__link:hover {
    opacity: 0.8;
}

.pengumuman-item {
    border-top-color: var(--border);
}

.pengumuman-item:last-child {
    border-bottom-color: var(--border);
}

.pengumuman-item__category {
    color: var(--burgundy);
}

.pengumuman-item__title {
    color: var(--text);
    font-family: var(--font-primary);
    font-size: 1rem;
}

.pengumuman-item__desc {
    color: var(--text-faint);
}

.pengumuman-item__date {
    color: var(--text-muted);
    font-family: var(--font-primary);
}

.pengumuman-item__year {
    color: var(--text-ghost);
}

/* ================================================================
   UNDUHAN PAGE
   ================================================================ */

.unduhan-intro {
    color: var(--text-muted);
}

.unduhan-tabs {
    border-bottom-color: var(--border);
}

.unduhan-tabs__btn {
    color: var(--text-faint);
    font-family: var(--font-primary);
    letter-spacing: 0.12em;
}

.unduhan-tabs__btn:hover {
    color: var(--text-muted);
}

.unduhan-tabs__btn--active {
    color: var(--burgundy);
    border-bottom-color: var(--burgundy);
}

.unduhan-category__title {
    color: var(--burgundy);
    letter-spacing: 0.2em;
}

.unduhan-list {
    border-top-color: var(--border);
}

.unduhan-item {
    border-bottom-color: var(--border);
}

.unduhan-item__icon {
    color: var(--text-ghost);
}

.unduhan-item__name {
    color: var(--text);
}

.unduhan-item__name small {
    color: var(--text-faint);
}

.unduhan-item__fmt {
    color: var(--text-ghost);
}

.unduhan-item__dl {
    color: var(--text-faint);
    border-color: var(--border);
    font-family: var(--font-primary);
}

.unduhan-item__dl:hover {
    color: var(--burgundy);
    border-color: var(--burgundy);
    background: var(--burgundy-dim);
}

/* ================================================================
   KONTAK PAGE
   ================================================================ */

.kontak-card {
    background: rgba(42, 24, 14, 0.025);
    border-color: var(--border);
}

.kontak-card__icon {
    color: var(--burgundy);
}

.kontak-card__label {
    color: var(--text-ghost);
}

.kontak-card__value {
    color: var(--text);
}

.kontak-card__sub {
    color: var(--text-faint);
}

.kontak-card__link:hover {
    color: var(--burgundy);
}

.kontak-form-wrap__title {
    color: var(--text);
    font-family: var(--font-primary);
}

.kontak-form__label {
    color: var(--text-faint);
    letter-spacing: 0.12em;
}

.kontak-form__input {
    background: rgba(42, 24, 14, 0.03);
    border-color: var(--border);
    color: var(--text);
}

.kontak-form__input::placeholder {
    color: var(--text-ghost);
}

.kontak-form__input:focus {
    border-color: var(--burgundy);
    background: var(--burgundy-dim);
}

.kontak-form__submit {
    background: var(--burgundy);
    color: #fff;
    font-family: var(--font-primary);
}

.kontak-form__submit:hover {
    background: var(--burgundy-light);
}

.kontak-hours,
.kontak-misa,
.kontak-follow {
    border-top-color: var(--border);
}

.kontak-hours__title,
.kontak-misa__title,
.kontak-follow__title {
    color: var(--text-ghost);
    letter-spacing: 0.18em;
}

.kontak-hours__day,
.kontak-misa__day {
    color: var(--text-muted);
}

.kontak-hours__time,
.kontak-misa__time {
    color: var(--text);
}

.kontak-misa__cta {
    color: var(--burgundy);
}

.kontak-misa__cta:hover {
    opacity: 0.8;
}

.kontak-follow__link {
    color: var(--text-faint);
}

.kontak-follow__link:hover {
    color: var(--text);
}

.kontak-map {
    border-top-color: var(--border);
}

.kontak-map iframe {
    filter: none;
}

/* Inline-style classes from kontak.blade.php */
.kontak-jp {
    background: rgba(42, 24, 14, 0.03) !important;
    border: 1px solid var(--border) !important;
}

.kontak-jp__head-icon {
    background: rgba(42, 24, 14, 0.06) !important;
    color: var(--text-faint) !important;
}

.kontak-jp__title {
    color: var(--text) !important;
    font-family: var(--font-primary) !important;
}

.kontak-jp__sub {
    color: var(--text-ghost) !important;
}

.kontak-jp__day {
    color: var(--text-muted) !important;
}

.kontak-jp__sep {
    background: repeating-linear-gradient(
        to right,
        var(--border) 0,
        var(--border) 2px,
        transparent 2px,
        transparent 6px
    ) !important;
}

.kontak-jp__time {
    color: var(--text) !important;
    font-weight: 600;
}

.kontak-jp__row {
    border-bottom: 1px solid var(--border) !important;
}

.kontak-jp__note {
    color: var(--text-faint) !important;
    border-top-color: var(--border) !important;
}

/* ================================================================
   BERITA DETAIL PAGE
   ================================================================ */

.berita-detail__lead {
    color: var(--text-muted);
    border-left-color: var(--burgundy);
    font-style: italic;
}

.berita-detail__isi {
    color: var(--text);
}

/* Prose (TinyMCE output) */
.prose h1,
.prose h2,
.prose h3,
.prose h4 {
    color: var(--text);
    font-family: var(--font-primary);
}

.prose p {
    color: var(--text-muted);
}

.prose a {
    color: var(--burgundy);
}

.prose ul,
.prose ol {
    color: var(--text-muted);
}

.prose blockquote {
    border-left-color: var(--burgundy);
    color: var(--text-muted);
    background: var(--burgundy-dim);
}

.prose th,
.prose td {
    border-color: var(--border);
    color: var(--text-muted);
}

.prose th {
    background: rgba(42, 24, 14, 0.04);
}

.berita-detail__back {
    border-top-color: var(--border);
}

.btn-back {
    color: var(--burgundy);
}

.btn-back:hover {
    color: var(--burgundy-light);
    opacity: 1;
}

.sidebar-related__title {
    color: var(--text-ghost);
    border-bottom-color: var(--border);
    letter-spacing: 0.18em;
}

.sidebar-related__item {
    border-bottom-color: var(--border);
}

.sidebar-related__date {
    color: var(--text-ghost);
}

.sidebar-related__judul {
    color: var(--text);
}

/* ================================================================
   RENUNGAN PAGE
   ================================================================ */

.renungan-tema-tag {
    color: var(--gold);
    border-color: var(--gold-dim);
}

.renungan-featured-section {
    background: var(--ivory-dark);
    border-bottom-color: var(--border);
}

.renungan-featured__ornament {
    color: var(--gold);
    opacity: 0.6;
}

.renungan-featured__quote {
    color: var(--text-muted);
    font-family: var(--font-primary);
    font-style: italic;
}

.renungan-featured__title {
    color: var(--text);
    font-family: var(--font-primary);
}

.renungan-date {
    color: var(--text-muted);
    font-size: 1rem;
}

.renungan-author-badge {
    color: var(--gold);
    font-size: 1rem;
}

.renungan-row__author {
    color: var(--text-muted);
}

.page-hero__author {
    color: #fff;
}

.page-hero__author strong {
    color: #fff;
}

.renungan-featured__cta {
    color: var(--gold);
    border-bottom-color: var(--gold-dim);
    font-family: var(--font-primary);
    letter-spacing: 0.14em;
}

.renungan-featured__cta:hover {
    color: var(--burgundy);
    border-bottom-color: rgba(109, 43, 53, 0.4);
}

.renungan-row {
    border-bottom-color: var(--border);
}

.renungan-row:first-child {
    border-top-color: var(--border);
}

.renungan-row:hover {
    background: rgba(42, 24, 14, 0.028);
}

.renungan-row__day {
    color: var(--text);
    font-family: var(--font-primary);
}

.renungan-row__month {
    color: var(--text-faint);
    letter-spacing: 0.1em;
}

.renungan-row__divider {
    background: var(--border);
}

.renungan-row__title {
    color: var(--text);
    font-family: var(--font-primary);
    font-size: 1.05rem;
}

.renungan-row:hover .renungan-row__title {
    color: var(--gold);
}

.renungan-row__quote {
    color: var(--text-faint);
    font-style: italic;
}

.renungan-row__arrow {
    color: var(--text-ghost);
}

.renungan-row:hover .renungan-row__arrow {
    color: var(--gold);
    transform: translateX(4px);
}

/* Renungan detail */
.renungan-detail__scripture {
    background: rgba(184, 154, 12, 0.06);
    border-left-color: var(--gold);
    color: var(--text-muted);
    font-style: italic;
}

.renungan-detail__scripture-mark {
    color: rgba(184, 154, 12, 0.28);
}

.renungan-detail__isi {
    color: var(--text);
}

.renungan-detail__back {
    border-top-color: var(--border);
}

.sidebar-renungan__title {
    color: var(--text-faint);
    border-bottom-color: var(--border);
    letter-spacing: 0.18em;
}

.sidebar-renungan__item {
    border-bottom-color: var(--border);
}

.sidebar-renungan__item-title {
    color: var(--text);
}

.sidebar-renungan__item-quote {
    color: var(--text-faint);
    font-style: italic;
}

.sidebar-renungan__item-date {
    color: var(--text-ghost);
}

/* ================================================================
   SAKRAMEN PAGE (pelayanan)
   ================================================================ */

/* Hero sections can stay dark (dramatic image) */

/* Inline-style class overrides from sakramen.blade.php */
.sak-intro-section {
    background: var(--ivory) !important;
}

.sak-intro-text {
    color: var(--text-muted) !important;
}

.sak-label-chip {
    color: var(--text-faint) !important;
    border-color: var(--border) !important;
}

.sak-content-section {
    background: var(--ivory-dark) !important;
    border-top-color: var(--border) !important;
}

.sak-content-section--alt {
    background: var(--ivory) !important;
}

.sak-content-num {
    color: rgba(42, 24, 14, 0.05) !important;
    font-family: var(--font-primary) !important;
}

.sak-content-heading {
    color: var(--text) !important;
    font-family: var(--font-primary) !important;
}

.sak-content-aside-rule {
    background: var(--border-gold) !important;
}

.sak-par {
    color: var(--text-muted) !important;
}

.sak-list li {
    color: var(--text-muted) !important;
    border-bottom-color: var(--border) !important;
}

.sak-list__bullet {
    color: var(--text-ghost) !important;
}

.sak-kontak-section {
    background: var(--ivory-dark) !important;
    border-top-color: var(--border) !important;
}

.sak-kontak-subtitle {
    color: var(--text-faint) !important;
}

.sak-kontak-card {
    background: rgba(42, 24, 14, 0.025) !important;
    border-color: var(--border) !important;
}

.sak-kontak__name {
    color: var(--text) !important;
    border-bottom-color: var(--border) !important;
    font-family: var(--font-primary) !important;
}

.sak-kontak__item {
    color: var(--text-muted) !important;
    border-bottom-color: var(--border) !important;
}

.sak-kontak__item:hover {
    color: var(--text) !important;
}

.sak-kontak__item-icon {
    color: var(--text-ghost) !important;
}

.sak-kontak__item:hover .sak-kontak__item-icon {
    color: var(--text-faint) !important;
}

.sak-kontak__note {
    color: var(--text-faint) !important;
    border-top-color: var(--border) !important;
}

.sak-unduhan-section {
    background: var(--ivory) !important;
    border-top-color: var(--border) !important;
}

.sak-unduhan-card {
    background: rgba(42, 24, 14, 0.025) !important;
    border-color: var(--border) !important;
}

.sak-unduhan-card:hover {
    background: rgba(42, 24, 14, 0.05) !important;
    border-color: var(--gold-dim) !important;
}

.sak-ornament__line {
    background: var(--border-gold) !important;
}

.sak-ornament__icon {
    color: var(--gold-dim) !important;
}

/* ================================================================
   FOOTER MISA CARD (handled here via !important to beat inline CSS)
   ================================================================ */

.footer-misa-card {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(201, 168, 97, 0.2) !important;
}

.footer-misa-card__title {
    color: rgba(250, 246, 238, 0.88) !important;
    font-family: var(--font-primary) !important;
}

.footer-misa-card__sub {
    color: rgba(250, 246, 238, 0.38) !important;
}

.footer-misa-card__day {
    color: rgba(250, 246, 238, 0.48) !important;
}

.footer-misa-card__time {
    color: rgba(250, 246, 238, 0.85) !important;
}

.footer-misa-card__row {
    border-bottom: 1px solid rgba(250, 246, 238, 0.07) !important;
}

.footer-misa-card__icon {
    background: rgba(255, 255, 255, 0.05) !important;
    color: rgba(250, 246, 238, 0.45) !important;
}

.footer-misa-card__sep {
    background: repeating-linear-gradient(
        to right,
        rgba(250, 246, 238, 0.12) 0,
        rgba(250, 246, 238, 0.12) 2px,
        transparent 2px,
        transparent 6px
    ) !important;
}

/* ================================================================
   ORNAMENTAL DETAILS — Gothic-style decorative elements
   ================================================================ */

/* Section header visual ornament — for eyebrow labels */
.jadwal__label::before,
.berita__label::before,
.pengumuman__eyebrow::before {
    content: "—  ";
    color: var(--gold);
    opacity: 0.6;
    font-size: 0.7em;
}

/* Page label ornament */
.page-label::before {
    content: "✦ ";
    color: var(--gold);
    opacity: 0.5;
    font-size: 0.6em;
}

/* Ornamental horizontal rule */
.page-section::after {
    display: none;
}

/* Timeline year bullet */
.timeline__year::before {
    content: "‣ ";
    color: var(--gold-dim);
    font-size: 0.8em;
}

/* Renungan featured section ornament */
.renungan-featured__ornament {
    letter-spacing: 0.4em;
}

/* ================================================================
   FOCUS / ACCESSIBILITY
   ================================================================ */

a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 3px;
    border-radius: 2px;
}

/* ================================================================
   DEWAN PAROKI — Inline-style: page-section level classes
   ================================================================ */

/* Sejarah section from the milestones */
.sejarah__milestone {
    border-top-color: var(--border);
}

.sejarah__milestone-year {
    color: var(--burgundy);
}

.sejarah__milestone-title {
    color: var(--text);
}

/* ================================================================
   SELECTION HIGHLIGHT
   ================================================================ */

::selection {
    background: rgba(109, 43, 53, 0.18);
    color: var(--text);
}