/* ============================================================
   Section 2 — Quick Info Bar  (darbar-info.css)
   ============================================================ */

.di {
    position: relative;
    /*z-index: var(--od-z-sticky);*/
    z-index:1;
    /* 
     * THE LOCK: 
     * This exact negative margin pulls the bar precisely into the dark 
     * pocket created by Section 1's padding-bottom. 
     */
    margin-top: calc(clamp(7rem, 10vw, 9rem) * -1); 
    padding-inline: var(--od-gutter-fluid);
    max-width: var(--od-container-default);
    margin-inline: auto;
}

.di__bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: rgba(42, 36, 34, 0.85); /* Frosted --od-ink-primary */
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--od-radius-lg);
    box-shadow: var(--od-elevation-modal); 
    overflow: hidden;
}

.di__block {
    display: flex;
    flex-direction: column;
    gap: var(--od-space-2);
    padding: var(--od-space-6);
    transition: 
        background-color var(--od-duration-standard) var(--od-ease-standard),
        opacity var(--od-duration-slow) var(--od-ease-entrance), 
        transform var(--od-duration-slow) var(--od-ease-entrance);
}

.di__block--bordered {
    border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.di__block:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.di__icon-wrapper {
    display: inline-flex;
    margin-block-end: var(--od-space-1);
}

.di__icon {
    color: var(--od-gold-base); 
    transition: 
        transform var(--od-duration-fast) var(--od-ease-standard),
        color var(--od-duration-fast) var(--od-ease-standard);
}

.di__block:hover .di__icon {
    transform: translateY(-2px) scale(1.1);
    color: var(--od-saffron-base); 
}

.di__content {
    display: flex;
    flex-direction: column;
    gap: var(--od-space-1);
}

.di__label {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--od-text-inverse-muted); 
}

.di__value {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    color: var(--od-text-inverse);
    line-height: var(--od-leading-snug);
}

.di__value--link {
    text-decoration: none;
    color: var(--od-text-inverse);
    position: relative;
    display: inline-block;
    width: fit-content;
    transition: color var(--od-duration-fast) var(--od-ease-standard);
}

.di__value--link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -2px;
    left: 0;
    background-color: var(--od-saffron-base);
    transition: width var(--od-duration-standard) var(--od-ease-standard);
}

.di__value--link:hover {
    color: var(--od-gold-wash);
}
.di__value--link:hover::after {
    width: 100%;
}

/* ── Tablet (max 1024px) ────────────────────────────────────── */
@media (max-width: 1024px) {
    .di__bar {
        grid-template-columns: 1fr 1fr;
    }
    .di__block--bordered { border-right: none; }
    
    .di__block:nth-child(1),
    .di__block:nth-child(2) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
    .di__block:nth-child(odd) {
        border-right: 1px solid rgba(255, 255, 255, 0.08);
    }
}

/* ── Mobile (max 767px) ─────────────────────────────────────── */
@media (max-width: 767px) {
    .di {
        /* Matches the modified mobile pocket padding of Section 1 */
        margin-top: calc(clamp(6rem, 15vw, 7rem) * -1); 
    }
    .di__bar {
        grid-template-columns: 1fr;
    }
    .di__block--bordered {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
    .di__block:nth-child(odd) { border-right: none; }
    
    .di__block {
        flex-direction: row;
        align-items: center;
        gap: var(--od-space-4);
        padding: var(--od-space-4);
    }
    .di__icon-wrapper { margin-block-end: 0; }
}

/* ── Reduce Motion Overrides ────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .di__block, .di__icon, .di__value--link::after {
        transition: none !important;
        transform: none !important;
    }
}

/* ============================================================
   Section 3 — History & Spiritual Legacy (darbar-history.css)
   Prefix: .darbar-s3-history
   Editorial two-column layout with sticky left panel.
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s3-history {
    background-color: var(--od-bg-page); /* Beautiful light Sandstone canvas */
    padding-block: var(--od-space-24);
    position: relative;
    overflow: hidden;
}

/* ── 12-column grid ──────────────────────────────────────────── */
.darbar-s3-history__grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 clamp(1.5rem, 3vw, 2.5rem);
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Left column — spans 5 of 12 ─────────────────────────────── */
.darbar-s3-history__left {
    grid-column: 1 / 6;
}

.darbar-s3-history__sticky {
    position: sticky;
    top: calc(var(--od-space-16) + 40px); /* Adjust based on your header height */
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Right column — spans 6, starts at col 7 ────────────────── */
.darbar-s3-history__right {
    grid-column: 7 / 13;
}

/* ── Eyebrow ─────────────────────────────────────────────────── */
.darbar-s3-history__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--od-maroon-base); /* Institutional authority color on light bg */
    margin-block-end: var(--od-space-3);
}

/* ── Heading ─────────────────────────────────────────────────── */
.darbar-s3-history__heading {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-primary); /* Deep ink for high contrast */
    margin-block-end: var(--od-space-4);
}

/* ── Decorative rule ─────────────────────────────────────────── */
.darbar-s3-history__rule {
    display: block;
    width: 48px;
    height: 2px;
    background: var(--od-saffron-base); /* Ties in the primary brand color */
    margin-block-end: var(--od-space-8);
    border-radius: var(--od-radius-pill);
}

/* ── Image frame ─────────────────────────────────────────────── */
.darbar-s3-history__img-frame {
    position: relative;
    aspect-ratio: 3 / 4;
    border-radius: var(--od-radius-lg);
    overflow: hidden;
    /* Clean subtle border for the light theme */
    border: 1px solid var(--od-border-subtle); 
    box-shadow: var(--od-elevation-floating);
}

.darbar-s3-history__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform var(--od-duration-slow) var(--od-ease-standard);
}

.darbar-s3-history__img-frame:hover .darbar-s3-history__img {
    transform: scale(1.03);
}

/* ── Right column — history text ─────────────────────────────── */
.darbar-s3-history__content {
    max-width: 65ch;
    padding-top: var(--od-space-6); 
}

/* Paragraph styling — premium reading experience */
.darbar-s3-history__content p {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-base);
    font-weight: var(--od-weight-regular);
    line-height: var(--od-leading-relaxed);
    color: var(--od-text-secondary); /* Soft, highly readable ink */
    margin-block-end: 1.8em;
}

.darbar-s3-history__content p:last-child {
    margin-block-end: 0;
}

/* Drop cap — first letter of the first paragraph */
.darbar-s3-history__content p:first-of-type::first-letter {
    float: left;
    font-family: var(--od-font-deva);
    font-size: 3.8rem;
    font-weight: var(--od-weight-bold);
    line-height: 0.85;
    color: var(--od-saffron-deep); /* A deeper saffron for the drop cap on light bg */
    margin-right: 12px;
    margin-top: 6px;
}

/* Highlighted text — <strong> inside paragraphs */
.darbar-s3-history__content strong {
    font-weight: var(--od-weight-bold);
    color: var(--od-text-primary);
}

/* ── Tablet (max 1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .darbar-s3-history {
        padding-block: var(--od-space-16);
    }
    
    .darbar-s3-history__grid {
        grid-template-columns: 1fr;
        gap: var(--od-space-8);
    }

    .darbar-s3-history__left,
    .darbar-s3-history__right {
        grid-column: 1 / -1;
    }

    .darbar-s3-history__sticky {
        position: static;
    }

    .darbar-s3-history__img-frame {
        aspect-ratio: 16 / 9;
        max-height: 400px;
    }

    .darbar-s3-history__content {
        max-width: 100%;
        padding-top: 0;
    }
}

/* ── Mobile (max 767px) ──────────────────────────────────────── */
@media (max-width: 767px) {
    .darbar-s3-history {
        padding-block: var(--od-space-12);
    }

    .darbar-s3-history__heading {
        font-size: var(--od-type-h3);
    }

    .darbar-s3-history__img-frame {
        aspect-ratio: 4 / 3;
        max-height: 280px;
        border-radius: var(--od-radius-md);
    }

    .darbar-s3-history__content p {
        font-size: var(--od-type-sm);
    }

    .darbar-s3-history__content p:first-of-type::first-letter {
        font-size: 3.2rem;
        margin-right: 10px;
        margin-top: 4px;
    }
}

/* ── Reduce Motion Overrides ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s3-history__sticky { position: static; }
    .darbar-s3-history__img { transition: none; transform: none !important; }
}


/* ============================================================
   Section 4 — The Sacred Parampara (Divine Lineage)
   Prefix: .darbar-s4-parampara
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s4-parampara {
    /* Shifts back to the dark theme, creating a powerful, reverent break from Section 3 */
    background-color: var(--od-ink-primary); 
    padding-block: var(--od-space-24);
    position: relative;
    overflow: hidden;
}

/* ── Container ───────────────────────────────────────────────── */
.darbar-s4-parampara__container {
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Section header ──────────────────────────────────────────── */
.darbar-s4-parampara__header {
    text-align: center;
    margin-block-end: var(--od-space-12);
}

.darbar-s4-parampara__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--od-gold-base);
    margin-block-end: var(--od-space-3);
}

.darbar-s4-parampara__title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-inverse);
}

/* ── Grid ────────────────────────────────────────────────────── */
.darbar-s4-parampara__grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 clamp(1.5rem, 3vw, 2.5rem);
    align-items: start;
}

.darbar-s4-parampara__left {
    grid-column: 1 / 6;
}

.darbar-s4-parampara__right {
    grid-column: 7 / 13;
}

/* ── Spotlight card ──────────────────────────────────────────── */
.darbar-s4-parampara__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--od-space-8) var(--od-space-6);
    background: rgba(255, 255, 255, 0.03); /* Premium glass lift */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08); /* Replaced hardcoded grey */
    border-radius: var(--od-radius-lg);
    box-shadow: var(--od-elevation-floating);
}

/* ── Portrait (Arch Shape) ───────────────────────────────────── */
.darbar-s4-parampara__portrait-wrap {
    width: 160px;
    height: 200px;
    border-radius: 80px 80px 12px 12px;
    overflow: hidden;
    margin-block-end: var(--od-space-6);
    box-shadow:
        0 0 0 1px rgba(198, 156, 56, 0.25), /* Richer gold ring */
        var(--od-elevation-modal);
}

.darbar-s4-parampara__portrait {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── Card text ───────────────────────────────────────────────── */
.darbar-s4-parampara__card-role {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--od-gold-base);
    margin-block-end: var(--od-space-2);
}

.darbar-s4-parampara__card-name {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h4);
    font-weight: var(--od-weight-bold);
    color: var(--od-text-inverse);
    line-height: var(--od-leading-snug);
    margin-block-end: var(--od-space-1);
}

.darbar-s4-parampara__card-since {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-regular);
    color: rgba(255, 255, 255, 0.55);
    margin-block-end: var(--od-space-6);
}

/* ── CTA button ──────────────────────────────────────────────── */
.darbar-s4-parampara__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.6rem;
    background-color: var(--od-action-primary-bg);
    color: var(--od-action-primary-text);
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    text-decoration: none;
    border-radius: var(--od-radius-md);
    border: 1px solid var(--od-action-primary-bg);
    transition: all var(--od-duration-fast) var(--od-ease-standard);
    min-height: 44px;
}

.darbar-s4-parampara__cta:hover {
    background-color: var(--od-action-primary-hover);
    border-color: var(--od-action-primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(222, 91, 60, 0.35); /* Saffron glow */
}

/* ── Timeline heading ────────────────────────────────────────── */
.darbar-s4-parampara__timeline-heading {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
    margin-block-end: var(--od-space-8);
}

/* ── Vertical timeline ───────────────────────────────────────── */
.darbar-s4-parampara__timeline {
    list-style: none;
    position: relative;
    padding-left: var(--od-space-8);
}

/* The vertical line */
.darbar-s4-parampara__timeline::before {
    content: '';
    position: absolute;
    left: 5px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(198, 156, 56, 0.2);
}

/* ── Individual timeline node ────────────────────────────────── */
.darbar-s4-parampara__node {
    position: relative;
    padding-block-end: var(--od-space-8);
}

.darbar-s4-parampara__node:last-child {
    padding-block-end: 0;
}

/* Golden dot on the line */
.darbar-s4-parampara__node::before {
    content: '';
    position: absolute;
    left: -2rem;
    top: 0.35rem;
    width: 12px;
    height: 12px;
    border-radius: var(--od-radius-pill);
    background: var(--od-gold-base);
    opacity: 0.5;
    /* Gap ring uses --od-ink-primary to cut seamlessly into the background */
    box-shadow: 0 0 0 3px var(--od-ink-primary); 
    transition: all var(--od-duration-standard) var(--od-ease-standard);
}

/* Hover — dot brightens */
.darbar-s4-parampara__node:hover::before {
    opacity: 1;
    box-shadow:
        0 0 0 3px var(--od-ink-primary),
        0 0 12px rgba(198, 156, 56, 0.5); 
}

/* ── Node content ────────────────────────────────────────────── */
.darbar-s4-parampara__node-content {
    transition: transform var(--od-duration-standard) var(--od-ease-standard);
}

.darbar-s4-parampara__node:hover .darbar-s4-parampara__node-content {
    transform: translateX(6px);
}

.darbar-s4-parampara__node-period {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.06em;
    color: var(--od-gold-base);
    opacity: 0.8;
    margin-block-end: var(--od-space-1);
}

.darbar-s4-parampara__node-name {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-base);
    font-weight: var(--od-weight-bold);
    color: rgba(255, 255, 255, 0.85);
    line-height: var(--od-leading-snug);
    margin-block-end: var(--od-space-1);
    transition: color var(--od-duration-standard) var(--od-ease-standard);
}

.darbar-s4-parampara__node:hover .darbar-s4-parampara__node-name {
    color: var(--od-text-inverse);
}

.darbar-s4-parampara__node-role {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-regular);
    color: rgba(255, 255, 255, 0.5);
}

/* ── Tablet (max 1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .darbar-s4-parampara { padding-block: var(--od-space-16); }
    .darbar-s4-parampara__grid { grid-template-columns: 1fr; gap: 0; }
    .darbar-s4-parampara__left { grid-column: 1 / -1; }
    .darbar-s4-parampara__right { grid-column: 1 / -1; margin-top: var(--od-space-12); }
    .darbar-s4-parampara__card { max-width: 460px; margin-inline: auto; }
}

/* ── Mobile (max 767px) ──────────────────────────────────────── */
@media (max-width: 767px) {
    .darbar-s4-parampara { padding-block: var(--od-space-12); }
    .darbar-s4-parampara__card { max-width: 100%; padding: var(--od-space-6) var(--od-space-4); }
    
    .darbar-s4-parampara__portrait-wrap {
        width: 130px;
        height: 165px;
        border-radius: 65px 65px 10px 10px;
    }
    
    .darbar-s4-parampara__cta { width: 100%; }
    .darbar-s4-parampara__right { margin-top: var(--od-space-8); }
    .darbar-s4-parampara__node { padding-block-end: var(--od-space-6); }
    .darbar-s4-parampara__title { font-size: var(--od-type-h3); }
}

/* ── Reduce Motion ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s4-parampara__node-content,
    .darbar-s4-parampara__node::before,
    .darbar-s4-parampara__node-name,
    .darbar-s4-parampara__cta {
        transition: none;
        transform: none !important;
    }
}


/* ============================================================
   Section 5 — Daily Prayers & Grand Festivals
   Prefix: .darbar-s5-schedule
   LIGHT THEME — uses root tokens strictly to provide a 
   bright contrast to Section 4.
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s5-schedule {
    background-color: var(--od-bg-page);
    padding-block: var(--od-space-24);
    overflow: hidden;
}

/* ── Container ───────────────────────────────────────────────── */
.darbar-s5-schedule__container {
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Section header ──────────────────────────────────────────── */
.darbar-s5-schedule__header {
    margin-block-end: var(--od-space-12);
}

.darbar-s5-schedule__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--od-maroon-base); /* Institutional accent */
    margin-block-end: var(--od-space-2);
}

.darbar-s5-schedule__title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-primary);
}

/* ── 12-column grid ──────────────────────────────────────────── */
.darbar-s5-schedule__grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 clamp(1.5rem, 3vw, 2.5rem);
    align-items: start;
}

.darbar-s5-schedule__left {
    grid-column: 1 / 6;
}

.darbar-s5-schedule__right {
    grid-column: 6 / 13;
}

/* ── Panel heading ───────────────────────────────────────────── */
.darbar-s5-schedule__panel-heading {
    display: flex;
    align-items: center;
    gap: var(--od-space-2);
    font-family: var(--od-font-sans);
    font-size: var(--od-type-base);
    font-weight: var(--od-weight-bold);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-4);
}

.darbar-s5-schedule__panel-icon {
    color: var(--od-saffron-base);
    flex-shrink: 0;
}

/* ── Daily timetable panel ───────────────────────────────────── */
.darbar-s5-schedule__panel {
    background: var(--od-bg-surface);
    border-radius: var(--od-radius-lg);
    border: 1px solid var(--od-border-subtle);
    box-shadow: 0 1px 3px rgba(42, 36, 34, 0.04),
                0 4px 12px rgba(42, 36, 34, 0.03);
    overflow: hidden;
}

/* ── Schedule row ────────────────────────────────────────────── */
.darbar-s5-schedule__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--od-space-4) var(--od-space-6);
    transition: background-color var(--od-duration-fast) var(--od-ease-standard);
}

.darbar-s5-schedule__row--bordered {
    border-bottom: 1px solid var(--od-border-subtle);
}

/* Hover — row highlights gently */
.darbar-s5-schedule__row:hover {
    background-color: var(--od-bg-surface-raised);
}

/* Time */
.darbar-s5-schedule__time {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-bold);
    color: var(--od-saffron-base);
    white-space: nowrap;
    min-width: 80px;
}

/* Activity */
.darbar-s5-schedule__activity {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    color: var(--od-text-primary);
    text-align: right;
    transition: transform var(--od-duration-fast) var(--od-ease-standard);
}

.darbar-s5-schedule__row:hover .darbar-s5-schedule__activity {
    transform: translateX(-3px); /* Subtle shift left on hover */
}

/* ── Events card grid ────────────────────────────────────────── */
.darbar-s5-schedule__events {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--od-space-4);
}

/* ── Individual event card ───────────────────────────────────── */
.darbar-s5-schedule__card {
    background: var(--od-bg-surface);
    border-radius: var(--od-radius-lg);
    border: 1px solid var(--od-border-subtle);
    padding: var(--od-space-6);
    box-shadow: 0 1px 3px rgba(42, 36, 34, 0.04),
                0 4px 12px rgba(42, 36, 34, 0.03);
    transition:
        transform  var(--od-duration-standard) var(--od-ease-standard),
        box-shadow var(--od-duration-standard) var(--od-ease-standard),
        border-color var(--od-duration-standard) var(--od-ease-standard);
}

/* Hover — card lifts */
.darbar-s5-schedule__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 4px 12px rgba(42, 36, 34, 0.06),
                0 12px 24px rgba(42, 36, 34, 0.08);
    border-color: var(--od-saffron-base);
}

.darbar-s5-schedule__card-icon {
    color: var(--od-saffron-base);
    margin-block-end: var(--od-space-3);
}

.darbar-s5-schedule__card-name {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-base);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-snug);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-2);
}

.darbar-s5-schedule__card-date {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--od-text-muted);
}

/* ── Tablet (max 1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .darbar-s5-schedule { padding-block: var(--od-space-16); }
    .darbar-s5-schedule__grid {
        grid-template-columns: 1fr;
        gap: var(--od-space-12);
    }
    .darbar-s5-schedule__left,
    .darbar-s5-schedule__right {
        grid-column: 1 / -1;
    }
}

/* ── Mobile (max 767px) ──────────────────────────────────────── */
@media (max-width: 767px) {
    .darbar-s5-schedule { padding-block: var(--od-space-12); }
    .darbar-s5-schedule__events { grid-template-columns: 1fr; }
    .darbar-s5-schedule__card { padding: var(--od-space-4); }
    .darbar-s5-schedule__row { padding: var(--od-space-3) var(--od-space-4); }
    .darbar-s5-schedule__title { font-size: var(--od-type-h3); }
}

/* ── Reduce Motion ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s5-schedule__card,
    .darbar-s5-schedule__row,
    .darbar-s5-schedule__activity {
        transition: none;
        transform: none !important;
    }
}


/* ============================================================
   Section 6 — Community Sewa & Facilities (darbar-sewa.css)
   Prefix: .darbar-s6-sewa
   LIGHT THEME — Uses the pure white surface canvas.
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s6-sewa {
    background-color: var(--od-bg-surface); /* Pure white to contrast S5 Sandstone */
    padding-block: var(--od-space-24);
    border-top: 1px solid var(--od-border-subtle);
    overflow: hidden;
}

/* ── Container ───────────────────────────────────────────────── */
.darbar-s6-sewa__container {
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Section header — centered ───────────────────────────────── */
.darbar-s6-sewa__header {
    text-align: center;
    margin-block-end: var(--od-space-12);
}

.darbar-s6-sewa__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--od-maroon-base);
    margin-block-end: var(--od-space-3);
}

.darbar-s6-sewa__title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-4);
}

/* Decorative saffron accent bar below heading */
.darbar-s6-sewa__accent {
    display: block;
    width: 48px;
    height: 3px;
    background: var(--od-saffron-base);
    border-radius: var(--od-radius-pill);
    margin-inline: auto;
}

/* ── Facility grid — 2×2 ────────────────────────────────────── */
.darbar-s6-sewa__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--od-space-8);
}

/* ── Facility card ───────────────────────────────────────────── */
.darbar-s6-sewa__card {
    background: var(--od-bg-surface-raised); /* Sandstone card inside white canvas */
    border-radius: var(--od-radius-lg);
    border: 1px solid var(--od-border-subtle);
    padding: var(--od-space-8) var(--od-space-6);
    transition:
        transform    var(--od-duration-standard) var(--od-ease-standard),
        border-color var(--od-duration-standard) var(--od-ease-standard),
        box-shadow   var(--od-duration-standard) var(--od-ease-standard);
}

/* Card hover — lifts, shadow deepens */
.darbar-s6-sewa__card:hover {
    transform: translateY(-4px);
    border-color: var(--od-gold-base);
    box-shadow: var(--od-elevation-floating);
}

/* ── Icon circle ─────────────────────────────────────────────── */
.darbar-s6-sewa__icon-wrap {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--od-bg-surface);
    border-radius: var(--od-radius-pill);
    border: 1px solid var(--od-border-subtle);
    margin-block-end: var(--od-space-4);
    box-shadow: 0 2px 8px rgba(42, 36, 34, 0.04);
    transition:
        background-color var(--od-duration-standard) var(--od-ease-standard),
        border-color     var(--od-duration-standard) var(--od-ease-standard);
}

.darbar-s6-sewa__icon {
    color: var(--od-saffron-base);
    flex-shrink: 0;
    transition: color var(--od-duration-standard) var(--od-ease-standard);
}

/* Hover — icon circle fills saffron, icon goes white */
.darbar-s6-sewa__card:hover .darbar-s6-sewa__icon-wrap {
    background: var(--od-saffron-base);
    border-color: var(--od-saffron-base);
}

.darbar-s6-sewa__card:hover .darbar-s6-sewa__icon {
    color: var(--od-white);
}

/* ── Card text ───────────────────────────────────────────────── */
.darbar-s6-sewa__card-title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h4);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-snug);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-2);
}

.darbar-s6-sewa__card-desc {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-regular);
    line-height: var(--od-leading-relaxed);
    color: var(--od-text-secondary);
}

/* ── Donation CTA banner ─────────────────────────────────────── */
.darbar-s6-sewa__donate {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--od-space-6);
    margin-block-start: var(--od-space-12);
    padding: var(--od-space-6) var(--od-space-8);
    background: var(--od-bg-surface-raised);
    border-left: 4px solid var(--od-saffron-base);
    border-radius: var(--od-radius-md);
    box-shadow: var(--od-elevation-floating);
}

/* Donate text block — left side */
.darbar-s6-sewa__donate-heading {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h4);
    font-weight: var(--od-weight-bold);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-1);
}

.darbar-s6-sewa__donate-desc {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-regular);
    line-height: var(--od-leading-base);
    color: var(--od-text-secondary);
    max-width: 52ch;
}

/* Donate button — right side */
.darbar-s6-sewa__donate-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.6rem;
    background: var(--od-action-primary-bg);
    color: var(--od-action-primary-text);
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    text-decoration: none;
    border-radius: var(--od-radius-md);
    border: 1.5px solid var(--od-action-primary-bg);
    min-height: 44px;
    transition:
        background-color var(--od-duration-fast) var(--od-ease-standard),
        border-color     var(--od-duration-fast) var(--od-ease-standard),
        transform        var(--od-duration-fast) var(--od-ease-standard),
        box-shadow       var(--od-duration-fast) var(--od-ease-standard);
}

.darbar-s6-sewa__donate-btn:hover {
    background: var(--od-action-primary-hover);
    border-color: var(--od-action-primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(222, 91, 60, 0.35);
}

.darbar-s6-sewa__donate-btn:active {
    transform: translateY(0);
    box-shadow: none;
}

/* ── Tablet (max 1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .darbar-s6-sewa { padding-block: var(--od-space-16); }
    .darbar-s6-sewa__grid { gap: var(--od-space-6); }
    .darbar-s6-sewa__card { padding: var(--od-space-6); }

    .darbar-s6-sewa__donate {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }
    .darbar-s6-sewa__donate-desc { max-width: 100%; }
    .darbar-s6-sewa__donate-btn {
        width: 100%;
        max-width: 320px;
    }
}

/* ── Mobile (max 767px) ──────────────────────────────────────── */
@media (max-width: 767px) {
    .darbar-s6-sewa { padding-block: var(--od-space-12); }
    .darbar-s6-sewa__grid {
        grid-template-columns: 1fr;
        gap: var(--od-space-4);
    }

    .darbar-s6-sewa__card { padding: var(--od-space-6) var(--od-space-4); }
    .darbar-s6-sewa__title { font-size: var(--od-type-h3); }

    .darbar-s6-sewa__donate {
        padding: var(--od-space-4);
        border-left-width: 3px;
        margin-block-start: var(--od-space-8);
    }
    .darbar-s6-sewa__donate-btn { max-width: 100%; }
}

/* ── Reduce Motion ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s6-sewa__card,
    .darbar-s6-sewa__icon-wrap,
    .darbar-s6-sewa__icon,
    .darbar-s6-sewa__donate-btn {
        transition: none;
        transform: none !important;
    }
}



/* ============================================================
   Section 7 — Sacred Literature & Administration
   Prefix: .darbar-s7-lit
   LIGHT THEME — Uses standard Sandstone variables.
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s7-lit {
    background-color: var(--od-bg-page);
    padding-block: var(--od-space-24);
    border-top: 1px solid var(--od-border-subtle);
    overflow: hidden;
}

/* ── Container ───────────────────────────────────────────────── */
.darbar-s7-lit__container {
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Section header ──────────────────────────────────────────── */
.darbar-s7-lit__header {
    margin-block-end: var(--od-space-12);
}

.darbar-s7-lit__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--od-maroon-base);
    margin-block-end: var(--od-space-2);
}

.darbar-s7-lit__title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-primary);
}

/* ── 12-column grid ──────────────────────────────────────────── */
.darbar-s7-lit__grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 clamp(2rem, 4vw, 3.75rem);
    align-items: start;
}

.darbar-s7-lit__left {
    grid-column: 1 / 7;
}

.darbar-s7-lit__right {
    grid-column: 7 / 13;
}

/* ── Panel title — shared between left and right ─────────────── */
.darbar-s7-lit__panel-title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h4);
    font-weight: var(--od-weight-bold);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-5);
    padding-block-end: var(--od-space-3);
    border-bottom: 2px solid var(--od-gold-base);
    display: inline-block;
}

/* ============================================================
   LEFT PANEL — Sacred Literature
   ============================================================ */

/* ── Featured granth card ────────────────────────────────────── */
.darbar-s7-lit__granth-card {
    display: flex;
    gap: var(--od-space-4);
    background: var(--od-bg-surface);
    border-left: 4px solid var(--od-saffron-base);
    border-radius: var(--od-radius-md);
    padding: var(--od-space-6) var(--od-space-4);
    box-shadow: 0 1px 3px rgba(42, 36, 34, 0.04),
                0 4px 12px rgba(42, 36, 34, 0.03);
    margin-block-end: var(--od-space-6);
    transition: transform var(--od-duration-standard) var(--od-ease-standard),
                box-shadow var(--od-duration-standard) var(--od-ease-standard);
}

.darbar-s7-lit__granth-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--od-elevation-floating);
}

.darbar-s7-lit__granth-icon {
    color: var(--od-saffron-base);
    flex-shrink: 0;
    margin-block-start: 0.15rem;
}

.darbar-s7-lit__granth-name {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-base);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-snug);
    color: var(--od-text-primary);
    margin-block-end: var(--od-space-2);
}

.darbar-s7-lit__granth-desc {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-regular);
    line-height: var(--od-leading-base);
    color: var(--od-text-secondary);
}

/* ── Publications label ──────────────────────────────────────── */
.darbar-s7-lit__pub-label {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--od-text-muted);
    margin-block-end: var(--od-space-3);
}

/* ── Publication pills ───────────────────────────────────────── */
.darbar-s7-lit__pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--od-space-2);
}

.darbar-s7-lit__pill {
    display: inline-block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    color: var(--od-text-primary);
    background: transparent;
    border: 1px solid var(--od-border-default);
    border-radius: var(--od-radius-pill);
    padding: var(--od-space-1) var(--od-space-4);
    transition:
        background-color var(--od-duration-fast) var(--od-ease-standard),
        color            var(--od-duration-fast) var(--od-ease-standard),
        border-color     var(--od-duration-fast) var(--od-ease-standard);
    cursor: default;
}

/* Pill hover — fills saffron, text goes white */
.darbar-s7-lit__pill:hover {
    background: var(--od-saffron-base);
    color: var(--od-white);
    border-color: var(--od-saffron-base);
}

/* ============================================================
   RIGHT PANEL — Administration
   ============================================================ */

/* ── Trust member list ───────────────────────────────────────── */
.darbar-s7-lit__trust-list {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-block-end: var(--od-space-6);
}

.darbar-s7-lit__trust-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--od-space-3) 0;
    transition: transform var(--od-duration-fast) var(--od-ease-standard);
}

.darbar-s7-lit__trust-row--bordered {
    border-bottom: 1px solid var(--od-border-subtle);
}

/* Row hover — subtle indent right */
.darbar-s7-lit__trust-row:hover {
    transform: translateX(4px);
}

.darbar-s7-lit__trust-name {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    color: var(--od-text-primary);
}

.darbar-s7-lit__trust-role {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--od-text-muted);
    flex-shrink: 0;
    margin-inline-start: var(--od-space-4);
}

/* ── Sewadar CTA card ────────────────────────────────────────── */
.darbar-s7-lit__sewadar {
    display: flex;
    align-items: center;
    gap: var(--od-space-4);
    background: var(--od-bg-surface);
    border-radius: var(--od-radius-md);
    padding: var(--od-space-4) var(--od-space-6);
    border: 1px solid var(--od-border-subtle);
    box-shadow: 0 1px 3px rgba(42, 36, 34, 0.04),
                0 4px 12px rgba(42, 36, 34, 0.03);
    transition:
        transform  var(--od-duration-standard) var(--od-ease-standard),
        box-shadow var(--od-duration-standard) var(--od-ease-standard);
}

/* Card hover — lifts */
.darbar-s7-lit__sewadar:hover {
    transform: translateY(-4px);
    box-shadow: var(--od-elevation-floating);
}

/* Phone icon circle */
.darbar-s7-lit__sewadar-icon-wrap {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--od-saffron-wash);
    border-radius: var(--od-radius-pill);
    flex-shrink: 0;
}

.darbar-s7-lit__sewadar-icon {
    color: var(--od-saffron-base);
}

/* Sewadar text stack */
.darbar-s7-lit__sewadar-info {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.darbar-s7-lit__sewadar-label {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--od-text-muted);
}

.darbar-s7-lit__sewadar-name {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-bold);
    color: var(--od-text-primary);
}

.darbar-s7-lit__sewadar-phone {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    color: var(--od-link-default);
    text-decoration: none;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    transition: color var(--od-duration-fast) var(--od-ease-standard);
}

.darbar-s7-lit__sewadar-phone:hover {
    color: var(--od-link-hover);
}

/* ── Tablet (max 1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .darbar-s7-lit { padding-block: var(--od-space-16); }
    .darbar-s7-lit__grid { gap: var(--od-space-12) var(--od-space-8); }
    
    .darbar-s7-lit__trust-row {
        flex-wrap: wrap;
        gap: 0.15rem;
    }
    .darbar-s7-lit__trust-role { margin-inline-start: 0; }
}

/* ── Mobile (max 767px) ──────────────────────────────────────── */
@media (max-width: 767px) {
    .darbar-s7-lit { padding-block: var(--od-space-12); }
    .darbar-s7-lit__grid {
        grid-template-columns: 1fr;
        gap: var(--od-space-12);
    }
    .darbar-s7-lit__left,
    .darbar-s7-lit__right { grid-column: 1 / -1; }

    .darbar-s7-lit__title { font-size: var(--od-type-h3); }

    .darbar-s7-lit__granth-card {
        flex-direction: column;
        gap: var(--od-space-3);
    }

    .darbar-s7-lit__pills { gap: var(--od-space-2); }
    .darbar-s7-lit__pill { padding: var(--od-space-1) var(--od-space-3); }

    .darbar-s7-lit__trust-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.15rem;
    }
    .darbar-s7-lit__trust-role { margin-inline-start: 0; }
}

/* ── Reduce Motion ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s7-lit__pill,
    .darbar-s7-lit__trust-row,
    .darbar-s7-lit__sewadar,
    .darbar-s7-lit__granth-card {
        transition: none;
        transform: none !important;
    }
}


/* ============================================================
   Section 8 — Visual Darshan (Photo Gallery)
   Prefix: .darbar-s8-gallery
   DARK THEME — Cinematic framing for photography.
   Desktop: asymmetrical CSS Grid collage.
   Mobile: horizontal snap-scroll gallery.
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s8-gallery {
    /* Shifts to dark ink to act as a cinematic lightbox for the photos */
    background-color: var(--od-ink-primary);
    padding-block: var(--od-space-24);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    overflow: hidden;
}

/* ── Container ───────────────────────────────────────────────── */
.darbar-s8-gallery__container {
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Section header — centered ───────────────────────────────── */
.darbar-s8-gallery__header {
    text-align: center;
    margin-block-end: var(--od-space-12);
}

.darbar-s8-gallery__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--od-gold-base);
    margin-block-end: var(--od-space-3);
}

.darbar-s8-gallery__title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-inverse);
    margin-block-end: var(--od-space-3);
}

.darbar-s8-gallery__subtitle {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-base);
    font-weight: var(--od-weight-regular);
    line-height: var(--od-leading-base);
    color: rgba(255, 255, 255, 0.7);
    max-width: 52ch;
    margin-inline: auto;
}

/* ── Gallery grid — asymmetrical collage ─────────────────────── */
.darbar-s8-gallery__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 280px;
    gap: var(--od-space-5);
}

/*
   Asymmetrical layout via nth-child:
   ┌───────────────────┬────────────────────┐
   │  1 (2 cols × 2 rows)  │  2 (2 cols × 1 row) │
   │                       ├────────┬───────────│
   │                       │ 3 (1×1)│ 4 (1×1)   │
   ├────────┬───────────────┴────────┴───────────┤
   │ 5 (1×1)│  6 (3 cols × 1 row)                │
   └────────┴──────────────────────────────────── ┘
*/
.darbar-s8-gallery__item:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.darbar-s8-gallery__item:nth-child(2) { grid-column: span 2; grid-row: span 1; }
.darbar-s8-gallery__item:nth-child(3) { grid-column: span 1; grid-row: span 1; }
.darbar-s8-gallery__item:nth-child(4) { grid-column: span 1; grid-row: span 1; }
.darbar-s8-gallery__item:nth-child(5) { grid-column: span 1; grid-row: span 1; }
.darbar-s8-gallery__item:nth-child(6) { grid-column: span 3; grid-row: span 1; }

/* ── Gallery item — the image container ──────────────────────── */
.darbar-s8-gallery__item {
    position: relative;
    border-radius: var(--od-radius-lg);
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.08); /* crisp edge against dark bg */
    box-shadow: var(--od-elevation-floating);
}

/* Saffron overlay — faint divine glow on hover */
.darbar-s8-gallery__item::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        var(--od-saffron-base) 0%,
        var(--od-gold-base) 100%
    );
    opacity: 0;
    transition: opacity var(--od-duration-slow) var(--od-ease-standard);
    pointer-events: none;
    z-index: 1;
}

.darbar-s8-gallery__item:hover::after {
    opacity: 0.2;
}

/* ── Image ───────────────────────────────────────────────────── */
.darbar-s8-gallery__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform;
}

.darbar-s8-gallery__item:hover .darbar-s8-gallery__img {
    transform: scale(1.06);
}

/* ── Tablet (max 1024px) — 2-column grid ─────────────────────── */
@media (max-width: 1024px) {
    .darbar-s8-gallery { padding-block: var(--od-space-16); }
    
    .darbar-s8-gallery__grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 240px;
        gap: var(--od-space-4);
    }

    /* Reset asymmetric spans to clean 2-column */
    .darbar-s8-gallery__item:nth-child(1) { grid-column: span 2; grid-row: span 1; }
    .darbar-s8-gallery__item:nth-child(2),
    .darbar-s8-gallery__item:nth-child(3),
    .darbar-s8-gallery__item:nth-child(4),
    .darbar-s8-gallery__item:nth-child(5) { grid-column: span 1; grid-row: span 1; }
    .darbar-s8-gallery__item:nth-child(6) { grid-column: span 2; grid-row: span 1; }
}

/* ── Mobile (max 767px) — horizontal snap-scroll ─────────────── */
@media (max-width: 767px) {
    .darbar-s8-gallery {
        padding-block: var(--od-space-12);
    }

    .darbar-s8-gallery__title { font-size: var(--od-type-h3); }
    .darbar-s8-gallery__subtitle { font-size: var(--od-type-sm); }

    /* Convert grid → horizontal flex scroll */
    .darbar-s8-gallery__grid {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: var(--od-space-4);
        padding-block-end: var(--od-space-5);
        
        /* Ensures the scrollbar is hidden but swiping works */
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .darbar-s8-gallery__grid::-webkit-scrollbar {
        display: none;
    }

    /* Reset all nth-child grid spans */
    .darbar-s8-gallery__item:nth-child(n) {
        grid-column: unset;
        grid-row: unset;
    }

    /* Each item becomes a fixed-width swipeable card */
    .darbar-s8-gallery__item {
        width: 82vw;
        height: 320px;
        flex-shrink: 0;
        scroll-snap-align: center;
        border-radius: var(--od-radius-md);
    }

    /* Padding offsets for edge scrolling */
    .darbar-s8-gallery__item:first-child { margin-inline-start: 0; }
    .darbar-s8-gallery__item:last-child { margin-inline-end: var(--od-space-4); }
}

/* ── Small mobile (max 380px) ────────────────────────────────── */
@media (max-width: 380px) {
    .darbar-s8-gallery__item {
        width: 88vw;
        height: 260px;
    }
}

/* ── Reduced motion ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s8-gallery__img { transition: none; transform: none !important; }
    .darbar-s8-gallery__item::after { transition: none; }
}



/* ============================================================
   Section 9 — Plan Your Pilgrimage (Location & Maps)
   Prefix: .darbar-s9-visit
   LIGHT THEME — Clean logistical footer using styles.css
   ============================================================ */

/* ── Section wrapper ─────────────────────────────────────────── */
.darbar-s9-visit {
    background-color: var(--od-bg-page);
    padding-block: var(--od-space-24);
    border-top: 1px solid var(--od-border-subtle);
    overflow: hidden;
}

/* ── Container ───────────────────────────────────────────────── */
.darbar-s9-visit__container {
    max-width: var(--od-container-default);
    margin-inline: auto;
    padding-inline: var(--od-gutter-fluid);
}

/* ── Section header ──────────────────────────────────────────── */
.darbar-s9-visit__header {
    margin-block-end: var(--od-space-12);
}

.darbar-s9-visit__eyebrow {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--od-maroon-base);
    margin-block-end: var(--od-space-2);
}

.darbar-s9-visit__title {
    font-family: var(--od-font-deva);
    font-size: var(--od-type-h2);
    font-weight: var(--od-weight-bold);
    line-height: var(--od-leading-tight);
    color: var(--od-text-primary);
}

/* ── 12-column grid ──────────────────────────────────────────── */
.darbar-s9-visit__grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 clamp(2rem, 4vw, 3.75rem);
    align-items: start;
}

.darbar-s9-visit__left {
    grid-column: 1 / 6;
}

.darbar-s9-visit__right {
    grid-column: 6 / 13;
}

/* ============================================================
   LEFT PANEL — Logistics
   ============================================================ */

/* ── Info row — icon + text pair ──────────────────────────────── */
.darbar-s9-visit__info-row {
    display: flex;
    gap: var(--od-space-4);
    padding-block: var(--od-space-5);
    border-bottom: 1px solid var(--od-border-subtle);
}

.darbar-s9-visit__info-row:first-child {
    padding-block-start: 0;
}

/* Icon circle */
.darbar-s9-visit__info-icon-wrap {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--od-bg-surface);
    border: 1px solid var(--od-border-subtle);
    border-radius: var(--od-radius-pill);
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(42, 36, 34, 0.03);
}

.darbar-s9-visit__info-icon {
    color: var(--od-saffron-base);
}

/* Info text stack */
.darbar-s9-visit__info-text {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.darbar-s9-visit__info-label {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--od-text-muted);
}

.darbar-s9-visit__info-value {
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-regular);
    line-height: var(--od-leading-base);
    color: var(--od-text-primary);
    margin: 0;
}

/* Website link */
.darbar-s9-visit__info-link {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-sm);
    font-weight: var(--od-weight-medium);
    color: var(--od-link-default);
    text-decoration: none;
    transition:
        color     var(--od-duration-fast) var(--od-ease-standard),
        transform var(--od-duration-fast) var(--od-ease-standard);
}

.darbar-s9-visit__info-link:hover {
    color: var(--od-link-hover);
    transform: translateX(3px);
}

/* ── Social links ────────────────────────────────────────────── */
.darbar-s9-visit__social {
    padding-block-start: var(--od-space-6);
}

.darbar-s9-visit__social-label {
    display: block;
    font-family: var(--od-font-sans);
    font-size: var(--od-type-xs);
    font-weight: var(--od-weight-medium);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--od-text-muted);
    margin-block-end: var(--od-space-3);
}

.darbar-s9-visit__social-row {
    display: flex;
    gap: var(--od-space-3);
}

.darbar-s9-visit__social-btn {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--od-bg-surface);
    border: 1px solid var(--od-border-subtle);
    border-radius: var(--od-radius-pill);
    color: var(--od-text-secondary);
    text-decoration: none;
    transition:
        background-color var(--od-duration-fast) var(--od-ease-standard),
        border-color     var(--od-duration-fast) var(--od-ease-standard),
        color            var(--od-duration-fast) var(--od-ease-standard),
        transform        var(--od-duration-fast) var(--od-ease-standard),
        box-shadow       var(--od-duration-fast) var(--od-ease-standard);
}

/* Social hover — fills saffron, icon turns white, lifts */
.darbar-s9-visit__social-btn:hover {
    background: var(--od-action-primary-hover);
    border-color: var(--od-action-primary-hover);
    color: var(--od-white);
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(222, 91, 60, 0.25);
}

.darbar-s9-visit__social-btn:active {
    transform: translateY(0);
    box-shadow: none;
}

/* ============================================================
   RIGHT PANEL — Map
   ============================================================ */

/* ── Map wrapper — framed container ──────────────────────────── */
.darbar-s9-visit__map-wrap {
    background: var(--od-bg-surface);
    padding: var(--od-space-3);
    border-radius: var(--od-radius-lg);
    border: 1px solid var(--od-border-subtle);
    box-shadow: var(--od-elevation-floating);
    height: 100%;
    min-height: 450px;
    display: flex;
}

.darbar-s9-visit__map {
    width: 100%;
    height: 100%;
    min-height: 420px;
    border: none;
    border-radius: var(--od-radius-md);
    display: block;
}

/* ── Tablet (max 1024px) ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .darbar-s9-visit__grid { gap: 0 var(--od-space-8); }
    .darbar-s9-visit__map-wrap { min-height: 380px; }
    .darbar-s9-visit__map { min-height: 350px; }
}

/* ── Mobile (max 767px) ──────────────────────────────────────── */
@media (max-width: 767px) {
    .darbar-s9-visit { padding-block: var(--od-space-12); }
    .darbar-s9-visit__grid {
        grid-template-columns: 1fr;
        gap: var(--od-space-12);
    }
    
    .darbar-s9-visit__left,
    .darbar-s9-visit__right { grid-column: 1 / -1; }
    .darbar-s9-visit__title { font-size: var(--od-type-h3); }

    /* Map has fixed height on mobile */
    .darbar-s9-visit__map-wrap {
        min-height: auto;
        height: auto;
    }
    .darbar-s9-visit__map { min-height: 320px; }

    /* Social buttons row — centered on mobile */
    .darbar-s9-visit__social { text-align: center; }
    .darbar-s9-visit__social-row { justify-content: center; }
}

/* ── Small mobile (max 380px) ────────────────────────────────── */
@media (max-width: 380px) {
    .darbar-s9-visit__map { min-height: 260px; }
    .darbar-s9-visit__info-icon-wrap { width: 38px; height: 38px; }
    .darbar-s9-visit__info-icon { width: 18px; height: 18px; }
}

/* ── Reduced motion ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .darbar-s9-visit__info-link,
    .darbar-s9-visit__social-btn {
        transition: none;
        transform: none !important;
    }
}