@font-face {
    font-family: "Anek Devanagari";
    font-style: normal;
    font-weight: 100 800;
    font-display: swap;
    src: url("/assets/fonts/anek-devanagari-latin-hindi.woff2") format("woff2");
    unicode-range: U+0900-097F, U+1CD0-1CF4, U+1CF7-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B0A;
}

:root {
    color-scheme: light;
    font-family: system-ui, "Noto Sans Devanagari", sans-serif;
    color: #1f2a21;
    background: #fff;
    font-synthesis: none;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    --forest: #174c2c;
    --leaf: #6da943;
    --orange: #e9572b;
    --ink: #1f2a21;
    --muted: #627064;
    --paper: #f5f7ef;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
body { min-height: 100vh; margin: 0; overflow-wrap: anywhere; }
p { font-family: "Anek Devanagari", system-ui, "Noto Sans Devanagari", sans-serif; }
h1, h2, h3 {
    font-family: "Anek Devanagari", system-ui, "Noto Sans Devanagari", sans-serif;
    font-weight: 700;
}
a { color: var(--forest); }
img, video, iframe { max-width: 100%; }
button, input, textarea { max-width: 100%; }
button, a, input, textarea { touch-action: manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 3px solid var(--orange);
    outline-offset: 3px;
}
button, .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.85rem;
    border: 0;
    border-radius: 0.4rem;
    padding: 0.7rem 1.15rem;
    color: #fff;
    background: var(--forest);
    font: inherit;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
    transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}
button:hover, .button:hover { background: #23643b; box-shadow: 0 0.5rem 1.5rem rgb(20 57 31 / 16%); transform: translateY(-2px); }
.site-header, .admin-header {
    position: relative;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 5.25rem;
    padding: 0.75rem max(4vw, env(safe-area-inset-left));
    color: #fff;
    background: var(--forest);
}
.site-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 100; min-height: 3.75rem; gap: 0.75rem; padding-block: 0.3rem; box-shadow: 0 2px 12px rgb(0 0 0 / 18%); }
.brand, .admin-header > a { color: #fff; font-size: 1.35rem; font-weight: 750; text-decoration: none; }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; }
.brand img { display: block; width: 4.25rem; height: 4.4rem; object-fit: contain; }
.site-header .brand img { width: 3.2rem; height: 3.2rem; }
.site-header nav, .admin-header nav { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 0.55rem; }
.site-header nav a {
    border: 1px solid rgb(233 87 43 / 52%);
    border-radius: 999px;
    padding: 0.42rem 0.8rem;
    color: #30362f;
    background: #fff;
    font-size: 0.92rem;
    font-weight: 650;
    text-decoration: none;
    box-shadow: 0 3px 7px rgb(0 0 0 / 18%);
    transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}
.site-header nav a:hover, .site-header nav a[aria-current="page"] { color: #fff; background: var(--leaf); transform: translateY(-1px); }
.admin-header nav a, .language-switch { color: #fff; text-decoration: none; }
.language-switch { min-width: 4.25rem; text-align: center; font-weight: 700; }
.nav-toggle { display: none; }
.admin-header form { margin: 0; }
.admin-header button { min-height: auto; background: transparent; padding: 0.25rem; }
.admin-user { color: #cfe3cf; font-size: 0.9rem; }
.admin-panel { margin: 1.5rem 0; border: 1px solid #ddd; border-radius: 0.5rem; padding: 1rem 1.25rem; background: #fafcf7; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.75rem; margin: 1rem 0; }
.media-tile { display: grid; gap: 0.25rem; border: 1px solid #ddd; border-radius: 0.5rem; padding: 0.4rem; color: inherit; background: #fff; font-size: 0.82rem; text-decoration: none; }
.media-tile .admin-thumb { width: 100%; height: 100px; }
.media-choice { position: relative; margin: 0; cursor: pointer; font-weight: 400; }
.media-choice input { position: absolute; top: 0.6rem; left: 0.6rem; width: 1.2rem; height: 1.2rem; }
.media-choice:has(input:checked) { outline: 3px solid var(--leaf); }
.admin-thumb { display: block; width: 96px; height: 64px; border-radius: 0.3rem; object-fit: cover; background: #eee; }
.admin-preview { display: block; max-width: min(100%, 520px); height: auto; border-radius: 0.4rem; }
.button-danger { color: #fff; background: #a32020; }
.button-danger:hover { background: #7f1717; }
.button-secondary { color: var(--forest); background: #e9f2df; }
.admin-main td input { margin: 0; }
.temporary-password code { display: inline-block; border: 2px dashed var(--forest); border-radius: 0.4rem; padding: 0.6rem 1rem; background: #f1f7e9; font-size: 1.4rem; letter-spacing: 0.08em; user-select: all; }
select { display: block; width: 100%; margin-top: 0.35rem; padding: 0.65rem; border: 1px solid #a9a9a9; border-radius: 0.25rem; font: inherit; }
.public-main { width: min(100%, 1600px); min-height: 65vh; margin-inline: auto; }
/* Boxed layout for public pages: header, content and footer share one centred 1320px column on wide screens. */
body:has(> .site-header) { background: #e3ebdc linear-gradient(180deg, #d5e2c8, #eef3e8 40rem); }
body:has(> .site-header) > .site-topbar, body:has(> .site-header) > .site-header, body:has(> .site-header) > .public-main, body:has(> .site-header) > .site-footer { width: min(100%, 1240px); margin-inline: auto; }
/* From laptop width up, keep at least 2rem of background visible on each side so the box always shows. */
@media (min-width: 1024px) {
    body:has(> .site-header) > .site-topbar, body:has(> .site-header) > .site-header, body:has(> .site-header) > .public-main, body:has(> .site-header) > .site-footer { width: min(calc(100% - 4rem), 1240px); }
    body:has(> .site-header) > .site-topbar { margin-top: 1rem; border-radius: 0.9rem 0.9rem 0 0; }
    body:has(> .site-header) > .site-footer { margin-bottom: 1rem; border-radius: 0 0 0.9rem 0.9rem; }
}
body:has(> .site-header) > .public-main { overflow-x: clip; background: #fff; box-shadow: 0 0 40px rgb(23 76 44 / 14%); }
body:has(> .site-header) > .site-footer { padding-inline: clamp(1.25rem, 4vw, 3.5rem); }
.page-heading { padding: clamp(2rem, 5vw, 4rem) max(1.25rem, calc((100vw - 1200px) / 2)); background: linear-gradient(180deg, #deedcb 0%, #fff 100%); }
.page-heading h1 { max-width: 900px; margin: 0.35rem 0 0; color: var(--forest); font-size: clamp(1.5rem, 2vw, 1.85rem); line-height: 1.3; }
.eyebrow { margin: 0 0 0.55rem; color: var(--orange); font-size: 0.83rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.hero { position: relative; display: flex; min-height: clamp(27rem, 47.7vw, 40.5rem); align-items: center; overflow: hidden; color: #fff; background: #193d25; isolation: isolate; }
.hero-media { position: absolute; z-index: -1; inset: 0; overflow: hidden; }
.hero-image, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
/* Taller than the hero so the scroll parallax never exposes an edge. */
.hero-image { top: -6%; height: 112%; object-fit: cover; object-position: center 44%; }
/* Container units size the 16:9 player to cover the hero; the extra scale pushes YouTube's title bar out of view. */
.hero-video { position: absolute; top: -6%; left: 0; width: 100%; height: 112%; overflow: hidden; container-type: size; opacity: 0; pointer-events: none; transition: opacity 1.2s ease; }
.hero-video.is-playing { opacity: 1; }
.hero-video iframe { position: absolute; top: 50%; left: 50%; width: max(100cqw, 177.78cqh); max-width: none; height: max(100cqh, 56.25cqw); border: 0; transform: translate(-50%, -50%) scale(1.15); }
.hero-shade { background: linear-gradient(90deg, rgb(9 37 19 / 88%) 0%, rgb(12 45 23 / 64%) 43%, rgb(11 38 20 / 10%) 100%), linear-gradient(0deg, rgb(9 37 19 / 32%), transparent 55%); }
.hero-copy { width: min(760px, 88%); margin-left: max(7vw, calc((100vw - 1260px) / 2)); padding: 4rem 0; }
.hero-copy .eyebrow { color: #c7e29f; }
.hero-copy h1 { margin: 0.5rem 0 1rem; color: #fff; font-size: clamp(2.4rem, 4vw, 3.5rem); line-height: 1.2; text-wrap: balance; }
.hero-copy h1.hero-title-image { position: relative; isolation: isolate; width: min(518px, 72%); margin: 0.5rem auto 1rem; }
.hero-title-image img { display: block; width: 100%; height: auto; }
.hero-title-main { filter: drop-shadow(0 1px 2px rgb(20 12 0 / 55%)); }
.hero-title-glow {
    position: absolute;
    z-index: -1;
    inset: 0;
    filter: drop-shadow(0 0 0.35rem rgb(255 222 150 / 95%)) drop-shadow(0 0 1.2rem rgb(255 176 72 / 75%)) drop-shadow(0 0 2.6rem rgb(233 110 43 / 45%));
    opacity: 0.85;
}
.hero-title-shine { display: none; }
@supports (mask-image: url("")) or (-webkit-mask-image: url("")) {
    .hero-title-shine {
        position: absolute;
        inset: 0;
        display: block;
        pointer-events: none;
        background: linear-gradient(105deg, transparent 40%, rgb(255 196 92) 50%, transparent 60%) 100% 0 / 250% 100% no-repeat;
        opacity: 0;
        -webkit-mask: url("/assets/images/hero%20tagline.webp") center / 100% 100% no-repeat;
        mask: url("/assets/images/hero%20tagline.webp") center / 100% 100% no-repeat;
    }
}
.hero-home .hero-copy h1:not(.hero-title-image) { text-shadow: 0 1px 2px rgb(20 12 0 / 55%), 0 0 1.2rem rgb(255 196 92 / 55%), 0 0 2.6rem rgb(233 110 43 / 35%); }
.hero-slide-text p { max-width: 580px; margin: 0; color: #f3f6eb; font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.8; text-shadow: 0 1px 3px rgb(0 0 0 / 50%); }
.hero-note { position: absolute; right: max(4vw, calc((100vw - 1320px) / 2)); bottom: 1.5rem; color: #fff; font-size: 0.9rem; text-shadow: 0 2px 8px #111; }
.hero.hero-home { z-index: 2; align-items: flex-end; overflow: visible; margin-bottom: 7rem; }
/* The home copy sits low and centred, so shade from the bottom and leave the temples and waterfall bright. */
.hero-home .hero-shade { background: linear-gradient(0deg, rgb(6 26 13 / 82%) 0%, rgb(6 26 13 / 58%) 38%, rgb(6 26 13 / 18%) 72%, rgb(6 26 13 / 0%) 100%); }
/* Bottom padding keeps the buttons clear of the cards that overlap the hero's lower edge. */
.hero-home .hero-copy { position: relative; z-index: 1; width: min(900px, 90%); margin: 0 auto; padding-top: clamp(4rem, 8vw, 7rem); padding-bottom: 8rem; text-align: center; }
.hero-home .hero-slide-text p { margin-inline: auto; }
.hero-home .hero-note { bottom: 1.25rem; }
/* Without the slider (no JS or reduced motion) the slides simply stack. */
.hero-slides.is-slider { display: grid; align-items: center; }
.hero-slides.is-slider > .hero-slide { grid-area: 1 / 1; }
.hero-slides.is-slider .hero-slide-text p { max-width: 660px; font-size: clamp(1.2rem, 2.1vw, 1.55rem); font-weight: 500; line-height: 1.75; text-wrap: balance; }
.hero-slide-text h2 { max-width: 760px; margin: 0 auto 0.6rem; color: #fff; font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.3; text-wrap: balance; text-shadow: 0 1px 2px rgb(20 12 0 / 55%), 0 0 1.2rem rgb(255 196 92 / 50%), 0 0 2.6rem rgb(233 110 43 / 30%); }
.hero-slide-controls { display: flex; align-items: center; justify-content: center; gap: 0.25rem; margin-top: 1.25rem; }
.hero-slide-controls button, .hero-slide-controls button:hover { width: 1.5rem; min-height: 0; height: 1.5rem; padding: 0; background: transparent; box-shadow: none; transform: none; }
.hero-slide-dot::before { width: 0.55rem; height: 0.55rem; border-radius: 999px; background: rgb(255 255 255 / 55%); content: ""; transition: width 300ms ease, background-color 300ms ease; }
.hero-slide-dot:hover::before { background: rgb(255 255 255 / 85%); }
.hero-slide-dot[aria-current="true"]::before { width: 1.4rem; background: #ffd27a; }
.hero-slide-controls .hero-slide-pause { margin-left: 0.5rem; border: 1px solid rgb(255 255 255 / 60%); border-radius: 50%; }
.hero-slide-pause::before { width: 0.5rem; height: 0.6rem; background: linear-gradient(90deg, currentColor 0 34%, transparent 34% 66%, currentColor 66%); content: ""; }
.hero-slide-pause[aria-pressed="true"]::before { width: 0.55rem; background: currentColor; clip-path: polygon(15% 0, 100% 50%, 15% 100%); }
.hero-carousel { position: absolute; z-index: 3; right: 0; bottom: -6.25rem; left: 0; display: flex; width: min(900px, 92%); align-items: center; gap: 0.75rem; margin-inline: auto; }
.hero-carousel-track { display: flex; min-width: 0; flex: 1; gap: 0.85rem; overflow-x: auto; padding: 0.6rem 0.6rem 1.2rem; scroll-behavior: smooth; scroll-snap-type: x proximity; scrollbar-width: none; }
.hero-carousel-track::-webkit-scrollbar { display: none; }
/* Header colours rotate orange, green, taupe as in the mockup, darkened for white-text contrast. */
.hero-photo-card {
    --card-accent: #c9461c;
    display: flex;
    min-width: 0;
    flex: 0 0 180px;
    flex-direction: column;
    overflow: hidden;
    border-radius: 1rem;
    color: #2f352e;
    background: #f3f4ef;
    box-shadow: 0 12px 26px rgb(16 35 20 / 26%), 0 2px 6px rgb(16 35 20 / 12%);
    font-family: "Anek Devanagari", system-ui, "Noto Sans Devanagari", sans-serif;
    scroll-snap-align: center;
    text-decoration: none;
    transition: translate 220ms ease, box-shadow 220ms ease;
}
.hero-photo-card:nth-child(3n + 2) { --card-accent: #4a8228; }
.hero-photo-card:nth-child(3n + 3) { --card-accent: #8d6e63; }
.hero-photo-card:hover, .hero-photo-card:focus-visible { translate: 0 -4px; box-shadow: 0 18px 34px rgb(16 35 20 / 30%), 0 3px 8px rgb(16 35 20 / 14%); }
.hero-card-label { padding: 0.35rem 0.7rem; color: #fff; background: var(--card-accent); font-size: 0.8rem; font-weight: 700; line-height: 1.35; }
.hero-card-title { padding: 0.35rem 0.7rem 0.3rem; font-size: 0.92rem; font-weight: 700; line-height: 1.3; }
.hero-card-media { display: block; aspect-ratio: 16 / 10; margin: 0 0.55rem 0.55rem; overflow: hidden; border: 1px solid rgb(31 42 33 / 12%); border-radius: 0.45rem; background: #dce7d3; }
.hero-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 450ms cubic-bezier(.2,.7,.2,1); }
.hero-photo-card:hover .hero-card-media img, .hero-photo-card:focus-visible .hero-card-media img { transform: scale(1.06); }
.carousel-control { display: grid; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; place-items: center; border: 0; border-radius: 50%; padding: 0; color: #fff; background: var(--leaf); box-shadow: 0 4px 14px rgb(16 35 20 / 25%); font-size: 1.75rem; line-height: 1; }
.carousel-control:hover { background: var(--forest); }
.hero-carousel.is-static .carousel-control { visibility: hidden; }
.hero-carousel.is-static .hero-carousel-track { overflow: visible; }
.public-home .hero-home + .section-shell, .public-home .hero-home + .content-section { margin-top: 0; }
.section-shell, .content-section { width: min(1200px, 90%); margin: clamp(2rem, 4.5vw, 3.75rem) auto; }
.section-heading { max-width: 720px; margin: 0 0 2rem; }
.section-heading h2, .content-section h2, .contact-panel h2, .donation-panel h2 { margin: 0.35rem 0 0.75rem; color: var(--forest); font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.3; }
.section-heading p:not(.eyebrow), .content-section > p:not(.eyebrow) { color: var(--muted); line-height: 1.8; }
.temple-finder { padding: clamp(1.25rem, 4vw, 3rem); border: 1px solid #e3e9dc; border-radius: 1rem; background: var(--paper); }
/* The temple map photo sits behind the finder; the dark overlay keeps the heading, search and tiles readable. */
.temple-finder { position: relative; isolation: isolate; overflow: hidden; border-color: #1f4a2c; color: #fff; background: #173d24 url("/assets/images/temple-map-1920.webp") center / cover no-repeat; }
.temple-finder::before { position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgb(9 34 18 / 72%) 0%, rgb(9 34 18 / 84%) 55%, rgb(9 34 18 / 90%) 100%); content: ""; }
.temple-finder .section-heading h2 { color: #fff; }
.temple-finder .eyebrow { color: #ffc98a; }
.temple-finder .section-heading p:not(.eyebrow), .temple-finder .search-status { color: #e1ecdc; }
.temple-search-label { display: block; margin-bottom: 0.45rem; font-weight: 700; }
.temple-finder input[type="search"] { width: min(100%, 540px); min-height: 3.25rem; margin-bottom: 0.5rem; border: 1px solid #b9c9b2; border-radius: 0.45rem; padding: 0.75rem 1rem; background: #fff; font: inherit; }
.search-status { min-height: 1.5rem; margin: 0.2rem 0 1rem; color: var(--muted); font-size: 0.92rem; }
.temple-grid { display: grid; grid-template-columns: repeat(13, minmax(0, 1fr)); gap: 0.65rem; }
.temple-tile { display: flex; min-height: 6rem; flex-direction: column; gap: 0.45rem; border: 1px solid #e4e8dc; border-radius: 0.65rem; padding: 0.65rem 0.25rem; color: var(--ink); background: #fff; font-size: 0.78rem; box-shadow: 0 5px 15px rgb(26 65 35 / 5%); }
.temple-tile:hover, .temple-tile[aria-pressed="true"] { border-color: var(--leaf); color: var(--forest); background: #f6faef; }
.temple-marker { display: grid; width: 2.15rem; height: 2.15rem; place-items: center; align-self: center; border-radius: 50% 50% 50% 0; color: #fff; background: var(--orange); font-size: 0.95rem; font-weight: 800; }
.temple-selection { margin-top: 1rem; border-left: 4px solid var(--leaf); border-radius: 0.35rem; padding: 0.9rem 1rem; color: var(--forest); background: #e9f2df; }
.gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.gallery-card { position: relative; display: block; min-width: 0; aspect-ratio: 1.12; overflow: hidden; border-radius: 0.8rem; color: #fff; background: #dce7d3; box-shadow: 0 12px 28px rgb(26 53 34 / 12%); }
.gallery-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms cubic-bezier(.2,.7,.2,1), filter 350ms ease; }
.gallery-card:hover img, .gallery-card:focus-visible img { filter: saturate(1.12); transform: scale(1.07); }
.gallery-card-caption { position: absolute; inset: auto 0 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 2rem 1.1rem 1rem; color: #fff; background: linear-gradient(transparent, rgb(8 29 15 / 82%)); font-size: 1.1rem; font-weight: 750; }
.gallery-card-caption span:last-child { display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid rgb(255 255 255 / 65%); border-radius: 50%; }
.image-viewer { width: min(92vw, 1000px); max-width: 92vw; max-height: 92vh; border: 0; border-radius: 0.8rem; padding: 1.1rem; color: #fff; background: #102d1b; box-shadow: 0 1.5rem 5rem rgb(0 0 0 / 48%); }
.image-viewer::backdrop { background: rgb(4 16 8 / 82%); }
.image-viewer img { display: block; width: 100%; max-height: 76vh; border-radius: 0.45rem; object-fit: contain; }
.image-viewer p { margin: 0.75rem 0 0; }
.image-viewer-close { display: flex; min-height: 2.4rem; margin: 0 0 0.8rem auto; padding: 0.4rem 0.8rem; color: var(--forest); background: #fff; }
.intro-panel { max-width: 1100px; padding: clamp(1.5rem, 4vw, 3rem); border-left: 5px solid var(--leaf); background: linear-gradient(110deg, #f1f7e9, #fff); }
.text-panel { max-width: 1100px; }
/* #27AE60 from the content brief is too faint on the green cards (2.6:1); this darker shade reads at about 4.2:1. */
.article-section.article-heading-green h2 { color: #1e8449; }
.rich-text h3 { margin: 1.25rem 0 0.5rem; color: #d35400; font-size: 1.15rem; }
.rich-text ul { margin: 0 0 0.9rem; padding-left: 1.3rem; }
.rich-text li { margin-bottom: 0.45rem; }
.rich-text li::marker { color: #d35400; }
/* Icons: a round badge before an article heading, and before bullets whose lead-in matches a topic. */
.article-section h2:has(.heading-icon) { display: flex; align-items: center; gap: 0.7rem; }
.heading-icon { box-sizing: content-box; width: 1.4rem; height: 1.4rem; padding: 0.55rem; border-radius: 50%; color: #c9461c; background: #fde3cf; }
/* Icon chips under an article ("highlights" setting), e.g. the home क्षेत्र परिचय section. */
.article-highlights { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: 0.6rem; clear: both; margin: 1.1rem 0 0; padding: 0; list-style: none; }
.rich-text .article-highlights li { display: flex; align-items: center; gap: 0.6rem; margin: 0; border: 1px solid #e9cdb4; border-radius: 0.8rem; padding: 0.6rem 0.75rem; color: #5d4037; background: #fff7ef; font-weight: 600; line-height: 1.35; }
.highlight-icon { box-sizing: content-box; flex: none; width: 1.3rem; height: 1.3rem; padding: 0.45rem; border-radius: 50%; color: #c9461c; background: #fde3cf; }
.article-heading-green .heading-icon { color: #1e8449; background: #d9f0e1; }
.rich-text ul:has(.has-icon) { padding-left: 0; list-style: none; }
.rich-text li.has-icon { display: flex; align-items: flex-start; gap: 0.75rem; border-radius: 0.6rem; padding: 0.55rem 0.7rem; background: rgb(255 255 255 / 55%); }
.lead-icon { width: 1.35rem; height: 1.35rem; margin-top: 0.25rem; color: #c9461c; }
/* "term-cards" sections: definition cards with a "Read more" toggle (as in sourcedocs/muktagiri-index.html). */
.term-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 1rem; margin: 1.25rem 0 0.5rem; }
.term-card { position: relative; display: flex; flex-direction: column; border: 1px solid #e9b48f; border-radius: 0.9rem; padding: 1.1rem 1.15rem 0.9rem; background: linear-gradient(170deg, #fff4ea, #fdfbf7 60%); box-shadow: 0 6px 18px rgb(93 64 55 / 7%); }
.term-card h3 { display: flex; align-items: center; gap: 0.6rem; margin: 0 0 0.5rem; color: #d35400; font-size: 1.2rem; }
.term-icon { box-sizing: content-box; width: 1.3rem; height: 1.3rem; padding: 0.5rem; border-radius: 50%; color: #c9461c; background: #fde3cf; }
.term-card p { margin: 0 0 0.5rem; font-size: 0.98rem; line-height: 1.75; }
.term-badge { align-self: flex-start; margin-bottom: 0.5rem; border-radius: 999px; padding: 0.1rem 0.6rem; color: #fff; background: #c9461c; font-size: 0.78rem; font-weight: 700; }
.term-card details { margin-top: auto; }
.term-card summary { display: flex; align-items: center; gap: 0.35rem; min-height: 2rem; color: #c9461c; font-weight: 700; cursor: pointer; list-style: none; }
.term-card summary::-webkit-details-marker { display: none; }
.term-card summary::after { content: "+"; }
.term-card details[open] summary::after { content: "–"; }
.term-card summary:focus-visible { outline: 3px solid var(--leaf); outline-offset: 2px; border-radius: 0.3rem; }
/* Articles, gallery albums and videos: card lists inside the cream band. */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: clamp(1rem, 2.5vw, 1.6rem); width: min(1100px, 90%); margin: 0 auto; }
.content-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #dbe8cc; border-radius: 1rem; color: #333; background: linear-gradient(160deg, #eef6e4, #f7fbf1); box-shadow: 0 10px 28px rgb(38 74 34 / 8%); text-decoration: none; transition: translate 220ms ease, box-shadow 220ms ease; }
.content-card:hover, .content-card:focus-visible { translate: 0 -4px; box-shadow: 0 16px 34px rgb(38 74 34 / 14%); }
.content-card-media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #dce7d3; }
.content-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.content-card-body { display: grid; gap: 0.35rem; padding: 1rem 1.15rem 1.25rem; font-family: "Anek Devanagari", system-ui, "Noto Sans Devanagari", sans-serif; line-height: 1.6; }
.content-card-body time { color: var(--muted); font-size: 0.88rem; }
.content-card-body strong { color: #d35400; font-size: 1.2rem; line-height: 1.35; }
.empty-state { grid-column: 1 / -1; color: var(--muted); text-align: center; }
.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4rem; margin-top: 2rem; }
.pagination a { min-width: 2.5rem; border: 1px solid #c9dcb8; border-radius: 0.5rem; padding: 0.4rem 0.7rem; color: var(--forest); background: #fff; text-align: center; text-decoration: none; }
.pagination a[aria-current="page"] { color: #fff; background: var(--forest); }
.preview-banner { margin: 0; padding: 0.7rem 1rem; color: #4a2a00; background: #ffe2a8; font-weight: 700; text-align: center; }
.article-heading time { color: var(--muted); }
.page-heading .eyebrow a { color: inherit; }
.page-heading p:not(.eyebrow) { max-width: 760px; color: var(--muted); line-height: 1.7; }
.article-cover { width: min(1100px, 90%); margin: clamp(1.5rem, 4vw, 2.5rem) auto 0; }
.article-cover img { display: block; width: 100%; height: auto; border-radius: 1rem; }
.article-lead { color: #5d4037; font-size: 1.15em; font-weight: 500; }
.video-card { margin: 0; overflow: hidden; border: 1px solid #dbe8cc; border-radius: 1rem; background: #f7fbf1; box-shadow: 0 10px 28px rgb(38 74 34 / 8%); }
.video-card figcaption { padding: 0.85rem 1.1rem 1.1rem; color: #d35400; font-family: "Anek Devanagari", system-ui, sans-serif; font-weight: 700; line-height: 1.4; }
.video-thumb, .video-frame { position: relative; display: block; aspect-ratio: 16 / 9; background: #111; }
.video-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-play { position: absolute; top: 50%; left: 50%; width: 4rem; height: 4rem; border-radius: 50%; background: rgb(201 70 28 / 92%); box-shadow: 0 6px 20px rgb(0 0 0 / 35%); transform: translate(-50%, -50%); transition: transform 180ms ease; }
.video-play::before { position: absolute; top: 50%; left: 54%; border-width: 0.75rem 0 0.75rem 1.2rem; border-style: solid; border-color: transparent transparent transparent #fff; content: ""; transform: translate(-50%, -50%); }
.video-thumb:hover .video-play, .video-thumb:focus-visible .video-play { transform: translate(-50%, -50%) scale(1.08); }
/* Long-form "article" sections use the home page content palette (sourcedocs/homepage content.md). */
.article-flow { --article-heading: #d35400; --article-strong: #5d4037; --article-text: #333; padding: clamp(1.75rem, 4vw, 3rem) 0; background: #fdfbf7; }
/* Directly under the hero the band starts at the hero edge, so the photo cards overlap the cream. */
.public-home .hero-home + .article-flow { margin-top: -10rem; padding-top: calc(10rem + 0.75rem); }
.article-section { width: min(1100px, 90%); margin: 0 auto; border: 1px solid #dbe8cc; border-radius: 1rem; padding: clamp(1.25rem, 3.5vw, 2.5rem); background: linear-gradient(160deg, #eef6e4, #f7fbf1); box-shadow: 0 10px 28px rgb(38 74 34 / 8%); }
.article-section + .article-section { margin-top: clamp(1.1rem, 2.5vw, 1.6rem); }
/* Card and accordion headings share the tab pill text size. */
.article-section h2 { margin: 0 0 0.75rem; color: var(--article-heading); font-size: 1rem; font-weight: 700; line-height: 1.3; }
.rich-text { color: var(--article-text); font-size: 1.05rem; line-height: 1.9; }
.rich-text p { margin: 0 0 0.9rem; }
.rich-text:has(.article-figure) { display: flow-root; }
.article-figure { display: block; width: clamp(96px, 20%, 170px); margin-block: 0.25rem 0.75rem; }
.article-figure-right { float: right; margin-left: clamp(1rem, 2.5vw, 1.75rem); }
.article-figure-left { float: left; margin-right: clamp(1rem, 2.5vw, 1.75rem); }
.article-figure img { display: block; width: 100%; height: auto; border-radius: 0.9rem; }
/* Framed photos: a white mat and border, with the picture's edges feathered into the mat. */
.article-figure-framed { position: relative; width: clamp(120px, 26%, 240px); border: 1px solid #c9dcb8; border-radius: 1.1rem; padding: 6px; background: #fff; box-shadow: 0 10px 24px rgb(38 74 34 / 14%); }
.article-figure-framed::after { content: ""; position: absolute; inset: 6px; border-radius: 0.9rem; box-shadow: inset 0 0 16px 9px #fff; pointer-events: none; }
.rich-text strong { color: var(--article-strong); font-weight: 700; }
.rich-text blockquote { margin: 0.2rem 0 1.1rem; border-left: 4px solid var(--article-heading); border-radius: 0 0.4rem 0.4rem 0; padding: 0.8rem 1.1rem; color: var(--article-strong); background: #fdfbf7; font-family: "Anek Devanagari", system-ui, "Noto Sans Devanagari", sans-serif; line-height: 1.85; }
/* Accordion and tab sections: the same article card, holding several articles. */
.accordion-item + .accordion-item { border-top: 1px solid #dbe8cc; }
.accordion-item summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.9rem 0; cursor: pointer; list-style: none; }
.accordion-item summary::-webkit-details-marker { display: none; }
.accordion-item summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; margin-left: auto; border-radius: 50%; color: #fff; background: var(--tone, var(--article-heading)); font-size: 1.3rem; line-height: 1; }
.accordion-item[open] summary::after { content: "−"; }
.accordion-item summary:focus-visible { outline: 3px solid var(--leaf); outline-offset: 2px; border-radius: 0.4rem; }
.article-section .accordion-item h2 { margin: 0; }
.accordion-item .rich-text { padding-bottom: 0.6rem; }
/* Each topic keeps one vivid colour in the accordion and on its tab (white text on each passes WCAG AA). */
.tone-1 { --tone: #c2410c; }
.tone-2 { --tone: #be185d; }
.tone-3 { --tone: #1d4ed8; }
.tone-4 { --tone: #15803d; }
.tone-5 { --tone: #7e22ce; }
.section-icon { flex: none; width: 1.25em; height: 1.25em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.accordion-item summary .section-icon { box-sizing: content-box; width: 1.4rem; height: 1.4rem; padding: 0.55rem; border-radius: 50%; color: var(--tone); background: color-mix(in srgb, var(--tone) 12%, #fff); }
.tabs-group-heading { font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 700; color: var(--ink); margin: 0 0 1rem; }
.tab-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1.5rem; }
.tab { flex: none; gap: 0.45rem; min-height: 0; border: 1.5px solid color-mix(in srgb, var(--tone) 45%, #fff); border-radius: 999px; padding: 0.45rem 1rem 0.45rem 0.8rem; color: var(--tone); background: color-mix(in srgb, var(--tone) 9%, #fff); font-family: "Anek Devanagari", system-ui, "Noto Sans Devanagari", sans-serif; font-size: 1rem; font-weight: 600; line-height: 1.35; transition: background-color 160ms ease, color 160ms ease; }
.tab:hover { border-color: var(--tone); color: var(--tone); background: color-mix(in srgb, var(--tone) 18%, #fff); box-shadow: none; transform: none; }
.tab[aria-selected="true"], .tab[aria-selected="true"]:hover { border-color: var(--tone); color: #fff; background: var(--tone); box-shadow: 0 6px 16px color-mix(in srgb, var(--tone) 35%, transparent); }
.tab:focus-visible, .tab-panel:focus-visible { outline: 3px solid var(--leaf); outline-offset: 2px; border-radius: 0.4rem; }
.tab-panel + .tab-panel { margin-top: 1.5rem; }
.is-tabbed .tab-panel-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.section-body { max-width: 850px; color: #3f4941; font-size: 1.05rem; line-height: 1.95; white-space: normal; }
.text-panel .gallery-grid { margin-top: 2rem; }
.contact-panel, .donation-panel { display: grid; grid-template-columns: 1.1fr 0.9fr; align-items: center; gap: clamp(1.5rem, 5vw, 4rem); padding: clamp(1.5rem, 5vw, 4rem); border-radius: 1rem; background: var(--paper); }
.contact-card { padding: 1.5rem; border-radius: 0.65rem; background: #fff; box-shadow: 0 8px 30px rgb(27 53 33 / 7%); }
.contact-card h3 { margin-top: 0; color: var(--forest); }
.contact-card p { line-height: 1.8; }
.contact-form { grid-column: 1 / -1; padding: clamp(1.25rem, 3vw, 2rem); border-radius: 0.65rem; background: #fff; box-shadow: 0 8px 30px rgb(27 53 33 / 7%); }
.contact-form h3 { margin: 0 0 1rem; color: var(--forest); font-size: 1.3rem; }
.contact-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); column-gap: 1.25rem; }
.contact-form label { margin: 0 0 1rem; color: var(--ink); font-size: 0.95rem; }
.contact-form input, .contact-form textarea { border-color: #c8d1c1; border-radius: 0.4rem; background: #fbfcf8; }
.contact-form textarea { resize: vertical; }
.contact-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-status { margin: 0 0 1rem; border-radius: 0.4rem; padding: 0.8rem 1rem; font-weight: 600; }
.form-status-ok { border-left: 4px solid var(--leaf); color: #1d4d2a; background: #e7f4e8; }
.form-status-error { border-left: 4px solid #a32020; color: #7f1717; background: #fbe9e7; }
.press-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 1.25rem; width: min(1100px, 90%); margin: 0 auto 3rem; }
.press-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #dbe8cc; border-radius: 0.8rem; color: inherit; background: #fff; box-shadow: 0 10px 28px rgb(38 74 34 / 8%); text-decoration: none; transition: translate 220ms ease, box-shadow 220ms ease; }
.press-card:hover, .press-card:focus-visible { translate: 0 -4px; box-shadow: 0 16px 34px rgb(38 74 34 / 14%); }
.press-card img { display: block; width: 100%; height: 260px; object-fit: cover; object-position: top; background: #eef2e8; }
.press-card span { display: grid; gap: 0.2rem; padding: 0.85rem 1rem 1rem; font-family: "Anek Devanagari", system-ui, sans-serif; line-height: 1.5; }
.press-card strong { color: var(--forest); }
.press-card time, .press-card small { color: var(--muted); font-size: 0.9rem; }
.download-group { width: min(900px, 90%); margin: 0 auto 2.5rem; }
.download-group h2 { margin: 0 0 0.85rem; color: var(--forest); font-size: 1.35rem; }
.download-list { margin: 0; padding: 0; list-style: none; border: 1px solid #dbe8cc; border-radius: 0.8rem; background: #fff; box-shadow: 0 8px 24px rgb(38 74 34 / 6%); }
.download-list li + li { border-top: 1px solid #edf2e6; }
.download-list a { display: flex; align-items: center; gap: 1rem; padding: 0.95rem 1.15rem; color: inherit; text-decoration: none; }
.download-list a:hover { background: #f5f9ef; }
.download-list strong { display: block; color: var(--ink); font-family: "Anek Devanagari", system-ui, sans-serif; }
.download-list small { color: var(--muted); }
.download-list .download-arrow { margin-left: auto; color: var(--forest); font-weight: 700; white-space: nowrap; }
.download-type { flex: 0 0 auto; min-width: 3.1rem; border-radius: 0.35rem; padding: 0.3rem 0.45rem; color: #fff; background: var(--forest); font-size: 0.75rem; font-weight: 800; text-align: center; text-transform: uppercase; }
.download-type-pdf { background: #b3261e; }
.download-type-doc, .download-type-docx { background: #1f5fae; }
.download-type-xls, .download-type-xlsx { background: #1d7a45; }
.download-type-ppt, .download-type-pptx { background: #c4521c; }
.donation-panel { color: #fff; background: var(--forest); }
.donation-panel h2, .donation-panel .eyebrow { color: #fff; }
.donation-panel > div > p:not(.eyebrow) { max-width: 660px; color: #e5eee2; line-height: 1.8; }
.payment-status { margin: 1.2rem 0; border-left: 3px solid #e5b74c; padding: 0.7rem 1rem; color: #fff !important; background: rgb(255 255 255 / 9%); }
.donation-panel .button { color: var(--forest); background: #fff; }
.committee-placeholder { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.8rem; margin-top: 1.5rem; }
.committee-placeholder span { min-height: 9rem; border: 1px solid #f0a48c; border-radius: 0.4rem; background: linear-gradient(140deg, #fff, #f7f8f5); }
.site-footer { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 2rem; padding: 2.5rem max(5vw, calc((100vw - 1200px) / 2)); color: #fff; background: #123c23; }
.site-footer p { margin: 0.35rem 0 0; color: #d1dfd1; }
.footer-brand { display: inline-flex; color: #fff; text-decoration: none; }
.footer-brand img { display: block; width: 4.5rem; height: 4.65rem; object-fit: contain; }
.footer-links { display: flex; flex-wrap: wrap; gap: 1rem; }
.footer-links a, .back-to-top { color: #fff; text-decoration: none; }
.admin-main { width: min(960px, 92vw); margin: 2rem auto; }
.login-card { width: min(440px, 92vw); margin: 8vh auto; padding: 2rem; border: 1px solid #ddd; border-radius: 0.5rem; }
form label { display: block; margin: 1rem 0; font-weight: 600; }
input, textarea { display: block; width: 100%; margin-top: 0.35rem; padding: 0.65rem; border: 1px solid #a9a9a9; border-radius: 0.25rem; font: inherit; }
input[type="checkbox"] { display: inline-block; width: auto; }
.inline { display: flex; align-items: center; gap: 0.5rem; }
fieldset { margin: 1.5rem 0; border: 1px solid #ccc; }
legend { font-weight: 700; }
table { display: block; width: 100%; max-width: 100%; margin: 1.5rem 0; overflow-x: auto; border-collapse: collapse; -webkit-overflow-scrolling: touch; }
th, td { padding: 0.7rem; border-bottom: 1px solid #ddd; text-align: left; }
.heading-row { display: flex; align-items: center; justify-content: space-between; }
.integration-form { margin: 2rem 0; padding: 1.5rem; border: 1px solid #ddd; border-radius: 0.4rem; }
.integration-form small { display: block; color: var(--forest); font-weight: 400; }
.notice { padding: 0.75rem; background: #e7f4e8; }
.error { color: #a32020; }
.offline-page { width: min(600px, 90vw); margin: 12vh auto; padding: clamp(1.25rem, 5vw, 2.5rem); }
.offline-page h1 { color: var(--forest); }
.offline-page p { line-height: 1.7; }
.motion-ready [data-animate="reveal"]:not(.is-visible) { opacity: 0; transform: translateY(1rem); }
.motion-ready [data-animate="reveal"].is-visible { opacity: 1; transform: translateY(0); transition: opacity 450ms ease, transform 450ms ease; }
.motion-ready [data-animate="reveal"].gsap-animated { transition: none; }

@media (max-width: 1100px) {
    .site-header { flex-wrap: wrap; }
    .site-header nav { order: 3; width: 100%; justify-content: center; }
    .temple-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
    .site-header { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 0.45rem; min-height: 3.4rem; padding: 0.2rem 0.8rem; }
    .admin-header { align-items: flex-start; flex-direction: column; padding: 0.85rem 1rem; }
    .nav-toggle { display: inline-flex; min-height: 2.25rem; padding: 0.35rem 0.65rem; font-size: 0.9rem; }
    .site-header nav { grid-column: 1 / -1; order: initial; flex-direction: column; align-items: stretch; width: 100%; gap: 0.35rem; }
    .site-header nav a { padding: 0.55rem 0.85rem; }
    .site-header .brand img { width: 2.65rem; height: 2.65rem; }
    .site-header .brand { font-size: 1.1rem; }
    .site-header .language-switch { grid-column: 3; grid-row: 1; min-width: 2.8rem; font-size: 0.9rem; }
    .js-enabled .site-header nav:not(.is-open) { display: none; }
    .js-enabled .site-header nav.is-open { display: flex; }
    .hero { min-height: 35rem; align-items: flex-end; }
    .hero-image { object-position: 50% center; }
    .hero-shade { background: linear-gradient(0deg, rgb(7 31 16 / 92%), rgb(9 35 18 / 55%) 58%, rgb(10 36 18 / 6%)); }
    /* On phones the home copy covers the middle of the photo, so shade from just below the top edge. */
    .hero-home .hero-shade { background: linear-gradient(180deg, rgb(7 31 16 / 28%) 0%, rgb(9 35 18 / 60%) 32%, rgb(7 31 16 / 72%) 100%); }
    .hero-copy { width: auto; margin: 0; padding: 2rem 1.2rem 4rem; }
    .hero-copy h1 { font-size: clamp(2.1rem, 8vw, 2.8rem); }
    .hero-note { right: 1.1rem; bottom: 0.9rem; font-size: 0.76rem; }
    .hero.hero-home { min-height: 23.4rem; align-items: flex-end; margin-bottom: 7rem; }
    .hero-home .hero-copy { width: 100%; padding: 2.5rem 1.1rem 8rem; }
    .hero-home .hero-slide-text p { max-width: 42rem; font-size: 1rem; line-height: 1.65; }
    .hero-slides.is-slider .hero-slide-text p { font-size: 1.08rem; line-height: 1.65; }
    .hero-slide-text h2 { font-size: 1.45rem; }
    .hero-home .hero-note { display: none; }
    .hero-carousel { bottom: -6rem; width: 100%; gap: 0.25rem; }
    .hero-carousel-track { gap: 0.75rem; padding-inline: 0.4rem; }
    .hero-photo-card { flex-basis: min(48vw, 165px); box-shadow: 0 8px 16px rgb(16 35 20 / 22%), 0 2px 5px rgb(16 35 20 / 12%); }
    .hero-card-label { padding: 0.3rem 0.6rem; font-size: 0.78rem; }
    .hero-card-title { padding: 0.3rem 0.6rem 0.25rem; font-size: 0.88rem; }
    .hero-card-media { margin: 0 0.45rem 0.45rem; }
    .carousel-control { width: 2rem; height: 2rem; font-size: 1.4rem; }
    .section-shell, .content-section { width: calc(100% - 2rem); margin: 2rem auto; }
    .public-home .hero-home + .article-flow { margin-top: -9rem; padding-top: calc(9rem + 0.5rem); }
    .article-section { width: calc(100% - 1.5rem); }
    .rich-text { font-size: 1rem; line-height: 1.8; }
    .rich-text blockquote { padding: 0.7rem 0.85rem; }
    /* Phones: tabs stack as full-width rows instead of a sideways-scrolling strip. */
    .tab-list { flex-direction: column; gap: 0.4rem; }
    .tab { justify-content: flex-start; width: 100%; border-radius: 0.7rem; padding: 0.6rem 0.9rem; text-align: left; }
    .public-home .hero-home + .section-shell, .public-home .hero-home + .content-section { margin-top: 0; }
    .page-heading { padding: 2rem 1rem; }
    .temple-finder { padding: 1.1rem; background-image: url("/assets/images/temple-map-960.webp"); }
    .temple-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.45rem; }
    .temple-tile { min-height: 5.4rem; font-size: 0.72rem; }
    .gallery-grid { grid-template-columns: 1fr; gap: 1rem; }
    .gallery-card { aspect-ratio: 1.45; }
    .contact-panel, .donation-panel { grid-template-columns: 1fr; gap: 1rem; }
    .committee-placeholder { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .committee-placeholder span { min-height: 6rem; }
    .site-footer { grid-template-columns: 1fr; gap: 1rem; padding: 2rem 1.25rem; }
    .footer-links { flex-direction: column; gap: 0.7rem; }
    .admin-main { width: auto; margin: 1.25rem 1rem; }
    .heading-row { align-items: flex-start; flex-direction: column; gap: 0.75rem; }
    .integration-form { padding: 1rem; }
    .login-card { padding: 1.25rem; }
    th, td { padding: 0.55rem; }
}
@media (max-width: 380px) {
    .brand, .admin-header > a { font-size: 1.12rem; }
    button, .button { padding: 0.6rem 0.85rem; }
    .hero { min-height: 32rem; }
    .hero-copy { padding-inline: 1rem; }
    .hero.hero-home { min-height: 23.4rem; }
    .hero-home .hero-copy { padding-inline: 0.75rem; }
    .page-heading h1 { font-size: 1.5rem; }
    .temple-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Contact top bar and footer contact */
.site-topbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.4rem 1rem; padding: 0.35rem max(4vw, 1rem); color: #e5eee2; background: #0f3520; font-size: 0.86rem; }
.site-topbar > div { display: flex; flex-wrap: wrap; gap: 0.3rem 1.25rem; }
.site-topbar a { color: #fff; text-decoration: none; }
.site-topbar a:hover { text-decoration: underline; }
.site-topbar .topbar-donate { border-radius: 999px; padding: 0.2rem 0.85rem; background: var(--orange); font-weight: 700; }
.site-topbar .topbar-donate:hover { text-decoration: none; background: #c9441c; }
.footer-contact { display: grid; gap: 0.3rem; margin-top: 0.75rem; color: #d1dfd1; font-size: 0.9rem; font-style: normal; line-height: 1.6; }
.footer-contact a { color: #fff; }

/* Announcement ticker */
/* Tiranga band: saffron, white and green, with Ashoka-chakra navy text so it stays readable on the white middle. */
.announcement-ticker { display: flex; align-items: stretch; width: min(1100px, 90%); margin: 0 auto clamp(1.25rem, 3vw, 1.75rem); overflow: hidden; border: 1px solid #0b2a6b; border-radius: 0.75rem; color: #000080; background: linear-gradient(90deg, #ff9933 0%, #ffc58a 22%, #ffffff 50%, #9fd89a 78%, #138808 100%); box-shadow: 0 6px 18px rgb(0 0 0 / 10%); }
.ticker-label { position: relative; z-index: 1; flex: 0 0 auto; display: flex; align-items: center; margin: 0; padding: 0.4rem 1rem; color: #fff; background: #000080; font-weight: 800; white-space: nowrap; }
.ticker-window { flex: 1; overflow: hidden; display: flex; align-items: center; }
.ticker-track { display: flex; flex: 0 0 auto; width: max-content; padding-left: 100%; animation: ticker-scroll 18s linear infinite; }
.announcement-ticker:hover .ticker-track, .announcement-ticker:focus-within .ticker-track { animation-play-state: paused; }
.ticker-track ul { display: flex; margin: 0; padding: 0; list-style: none; }
.ticker-track li { display: flex; align-items: center; }
.ticker-track li + li::before { content: "☸"; margin: 0 1.25rem; color: #000080; }
.ticker-track button { min-height: auto; padding: 0.35rem 0.2rem; color: #000080; background: transparent; font-weight: 700; white-space: nowrap; box-shadow: none; }
.ticker-track button:hover { color: #b34700; background: transparent; transform: none; box-shadow: none; text-decoration: underline; }
@keyframes ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
    .ticker-track { animation: none; width: auto; padding-left: 0.75rem; }
    .ticker-track ul { flex-wrap: wrap; }
}
.announcement-dialog { width: min(560px, 92vw); border: 0; border-top: 5px solid var(--orange); border-radius: 0.8rem; padding: 1.5rem 1.75rem; box-shadow: 0 20px 60px rgb(0 0 0 / 30%); }
.announcement-dialog::backdrop { background: rgb(15 35 20 / 55%); }
.announcement-dialog h2 { margin: 0 0 0.75rem; color: var(--forest); font-size: 1.35rem; }
.announcement-dialog p { line-height: 1.75; }
.announcement-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.25rem; }

/* Hero slide backgrounds */
.hero-bg-layer { position: absolute; inset: 0; z-index: 2; opacity: 0; transition: opacity 900ms ease; }
.hero-bg-layer img { width: 100%; height: 100%; object-fit: cover; }
.hero-bg-layer.is-active { opacity: 1; }

/* Home promotions and Donate CTA */
.home-promo { padding: clamp(1.5rem, 3.5vw, 2.5rem) 0; }
.home-promo:nth-of-type(even) { background: var(--paper); }
.home-promo .section-heading { width: min(1100px, 90%); margin: 0 auto 1.5rem; }
.home-promo .press-grid { margin-bottom: 0; }
.home-promo-more { width: min(1100px, 90%); margin: 1.5rem auto 0; text-align: center; }
.button-outline-light { border: 2px solid var(--forest); color: var(--forest); background: transparent; }
.button-outline-light:hover { color: #fff; background: var(--forest); }
.donate-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; width: min(1100px, 90%); margin: 1.75rem auto; padding: clamp(1.5rem, 4vw, 2.75rem); border-radius: 1rem; color: #fff; background: linear-gradient(120deg, #174c2c 0%, #2b6b3f 60%, #6da943 100%); box-shadow: 0 16px 40px rgb(23 76 44 / 22%); }
.donate-cta h2 { margin: 0.2rem 0 0.5rem; font-size: clamp(1.4rem, 2.5vw, 2rem); }
.donate-cta p:not(.eyebrow) { max-width: 620px; margin: 0; color: #e5eee2; line-height: 1.7; }
.donate-cta .eyebrow { color: #f6c35b; }
.donate-button { padding: 0.9rem 1.8rem; background: var(--orange); font-size: 1.1rem; }
.donate-button:hover { background: #c9441c; }

/* Donate page */
.donation-details { width: min(1100px, 90%); margin: 2rem auto; }
.scheme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 1.25rem; margin-bottom: 2rem; }
.scheme-card { border: 1px solid #dbe8cc; border-top: 4px solid var(--orange); border-radius: 0.8rem; padding: 1.25rem; background: #fff; box-shadow: 0 8px 24px rgb(38 74 34 / 7%); }
.scheme-card h3 { margin: 0 0 0.4rem; color: var(--forest); }
.scheme-amount { margin: 0 0 0.6rem; color: var(--orange); font-size: 1.25rem; font-weight: 800; }
.scheme-card p { line-height: 1.7; }
.bank-card { max-width: 640px; border-radius: 0.8rem; padding: 1.5rem; background: var(--paper); border: 1px dashed var(--forest); }
.bank-card h3 { margin: 0 0 1rem; color: var(--forest); }
.bank-card dl { display: grid; grid-template-columns: max-content 1fr; gap: 0.5rem 1.25rem; margin: 0; }
.bank-card dt { color: var(--muted); font-weight: 600; }
.bank-card dd { margin: 0; font-weight: 700; user-select: all; }

/* Article meta */
.article-meta { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; color: var(--muted); }
.badge-soft { border-radius: 999px; padding: 0.1rem 0.7rem; color: var(--forest); background: #e9f2df; font-size: 0.85rem; font-weight: 700; }
.rich-text h2, .rich-text h3 { color: var(--forest); }
.hero-media .hero-shade { z-index: 3; }
@media (max-width: 700px) { .announcement-ticker { width: calc(100% - 1.5rem); } .ticker-label { padding-inline: 0.7rem; font-size: 0.85rem; } }

/* Hero photo cards: soft faded edges where cards slide in and out, and rounder card corners. */
.hero-carousel:not(.is-static) .hero-carousel-track {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.hero-photo-card { border-radius: 15%; }
.hero-card-media { border-radius: 12%; }
.map-link { margin: 1rem 0 0; }

/* सहयोग योजना: numbered scheme cards with an icon, on the Donate page */
.scheme-heading { margin: 0 0 1.5rem; text-align: center; }
.scheme-heading h2 { display: inline-block; margin: 0.25rem 0 0; border-radius: 999px; padding: 0.7rem 1.75rem; color: #fff; background: linear-gradient(120deg, #174c2c, #2b6b3f); font-size: clamp(1.15rem, 2.4vw, 1.6rem); line-height: 1.4; box-shadow: 0 8px 22px rgb(23 76 44 / 22%); }
.scheme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 1rem; margin: 0 0 2rem; padding: 0; list-style: none; }
.scheme-card { position: relative; display: flex; align-items: center; gap: 1rem; border: 1px solid #e8dcc6; border-left: 5px solid var(--orange); border-radius: 0.9rem; padding: 1rem 1.1rem; background: linear-gradient(135deg, #fffaf2, #fff); box-shadow: 0 8px 22px rgb(80 50 10 / 7%); transition: translate 200ms ease, box-shadow 200ms ease; }
.scheme-card:hover { translate: 0 -3px; box-shadow: 0 14px 30px rgb(80 50 10 / 12%); }
.scheme-icon { display: grid; flex: 0 0 3.4rem; width: 3.4rem; height: 3.4rem; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(140deg, #ff9933, #e9572b); box-shadow: 0 4px 12px rgb(233 87 43 / 30%); }
.scheme-icon svg { width: 1.7rem; height: 1.7rem; }
.scheme-number { position: absolute; top: 0.55rem; right: 0.8rem; color: #c9b48f; font-size: 0.75rem; font-weight: 800; }
.scheme-card h3 { margin: 0 1.25rem 0.3rem 0; color: var(--forest); font-size: 0.92rem; line-height: 1.4; }
.scheme-card .scheme-amount { margin: 0; color: var(--orange); font-size: 1.1rem; font-weight: 800; }
.scheme-amount small { color: var(--muted); font-size: 0.72rem; font-weight: 600; }
.scheme-card p { margin: 0; }

/* "Show interest" link on each scheme card, and the interest form */
.scheme-card > div { display: grid; gap: 0.15rem; }
.scheme-interest { justify-self: start; margin-top: 0.45rem; border: 1px solid var(--forest); border-radius: 999px; padding: 0.2rem 0.8rem; color: var(--forest); font-size: 0.8rem; font-weight: 700; text-decoration: none; transition: background-color 160ms ease, color 160ms ease; }
.scheme-interest:hover, .scheme-interest:focus-visible { color: #fff; background: var(--forest); }
.interest-form { max-width: 860px; margin: 2rem auto 0; scroll-margin-top: 5rem; border-top: 4px solid var(--orange); }
.interest-form select { display: block; width: 100%; margin-top: 0.35rem; border: 1px solid #c8d1c1; border-radius: 0.4rem; padding: 0.65rem; background: #fbfcf8; font: inherit; }
.interest-form.is-highlighted { box-shadow: 0 0 0 4px rgb(233 87 43 / 30%), 0 8px 30px rgb(27 53 33 / 7%); transition: box-shadow 300ms ease; }
.form-intro { margin: -0.5rem 0 1rem; color: var(--muted); line-height: 1.6; }
.captcha-field input { max-width: 8rem; }
.captcha-field strong { color: var(--orange); font-size: 1.1rem; }
.verify-section { max-width: 560px; }
.otp-input { max-width: 12rem; font-size: 1.5rem; letter-spacing: 0.4em; text-align: center; }
.resend-form { margin-top: 1rem; text-align: center; }

/* Cookie consent banner (consent.js): the three choices have equal weight, as consent rules require. */
.consent-banner { position: fixed; z-index: 500; right: 1rem; bottom: 1rem; left: 1rem; max-width: 34rem; margin-left: auto; border: 1px solid #c9dcb8; border-radius: 1rem; padding: 1.1rem 1.25rem; color: #333; background: #fff; box-shadow: 0 18px 50px rgb(16 35 20 / 28%); }
.consent-banner h2 { margin: 0 0 0.4rem; color: var(--forest); font-size: 1.15rem; }
.consent-banner p { margin: 0 0 0.75rem; font-size: 0.95rem; line-height: 1.65; }
.consent-banner a { color: var(--forest); font-weight: 700; }
.consent-choices { margin: 0 0 0.85rem; border-radius: 0.6rem; padding: 0.75rem 0.9rem; background: #f3f8ec; }
.consent-choices p { color: var(--muted); font-size: 0.88rem; }
.consent-choices label { display: flex; align-items: flex-start; gap: 0.55rem; margin: 0; font-weight: 600; }
.consent-choices input { width: 1.15rem; height: 1.15rem; margin: 0.2rem 0 0; flex: none; }
.consent-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
.consent-actions button { min-height: 2.6rem; padding: 0.5rem 0.6rem; border: 1px solid var(--forest); color: var(--forest); background: #fff; font-size: 0.9rem; }
.consent-actions button:hover { color: #fff; background: var(--forest); transform: none; }
@media (max-width: 480px) { .consent-actions { grid-template-columns: 1fr; } }

/* Footer row of statutory links and "Cookie settings". */
.footer-legal { display: flex; flex-wrap: wrap; grid-column: 1 / -1; gap: 0.4rem 1.25rem; border-top: 1px solid rgb(255 255 255 / 18%); padding-top: 1rem; font-size: 0.88rem; }
.footer-legal a, .footer-legal button { color: #d1dfd1; text-decoration: none; }
.footer-legal a:hover, .footer-legal button:hover { color: #fff; text-decoration: underline; }
.footer-legal button { min-height: 0; padding: 0; background: none; font: inherit; box-shadow: none; transform: none; }
/* Shorter menu: house icon for Home; Contact sits beside Donate in the top bar */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.site-header nav a.nav-home { display: inline-grid; place-items: center; padding: 0.38rem 0.6rem; }
.nav-home-icon { display: block; width: 1.2rem; height: 1.2rem; }
.site-topbar .topbar-actions { display: flex; flex-wrap: nowrap; align-items: center; gap: 0.5rem; margin-left: auto; }
.site-topbar .topbar-contact { border: 1px solid rgb(255 255 255 / 55%); border-radius: 999px; padding: 0.15rem 0.85rem; font-weight: 700; }
.site-topbar .topbar-contact:hover { text-decoration: none; color: var(--forest); background: #fff; }
@media (max-width: 700px) {
    .site-topbar { justify-content: center; padding-inline: 0.75rem; font-size: 0.8rem; }
    .site-topbar .topbar-details { justify-content: center; }
    .site-topbar .topbar-email { display: none; }
    .site-topbar .topbar-actions { margin-left: 0; }
}

/* Floating "Donate now": appears after 3 minutes on the site, flashes, and slides away after 6 seconds */
.floating-donate {
    position: fixed; z-index: 90; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom));
    display: inline-flex; align-items: center; gap: 0.45rem; border-radius: 999px; padding: 0.8rem 1.4rem;
    color: #fff; background: linear-gradient(120deg, #ff9933, #e9572b); font-size: 1.05rem; font-weight: 800; text-decoration: none;
    box-shadow: 0 10px 28px rgb(233 87 43 / 45%); transform: translateY(160%); opacity: 0;
    transition: transform 500ms cubic-bezier(.2,.8,.2,1), opacity 400ms ease;
}
.floating-donate.is-shown { transform: translateY(0); opacity: 1; animation: donate-flash 900ms ease-in-out 3; }
.floating-donate:hover, .floating-donate:focus-visible { color: #fff; background: linear-gradient(120deg, #e9572b, #c9441c); }
@keyframes donate-flash {
    0%, 100% { box-shadow: 0 10px 28px rgb(233 87 43 / 45%); filter: brightness(1); }
    50% { box-shadow: 0 0 0 10px rgb(255 153 51 / 35%), 0 10px 28px rgb(233 87 43 / 55%); filter: brightness(1.15); }
}
@media (max-width: 700px) {
    .floating-donate { right: 50%; padding: 0.7rem 1.2rem; font-size: 0.95rem; transform: translate(50%, 160%); }
    .floating-donate.is-shown { transform: translate(50%, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .floating-donate { transition: opacity 300ms ease; }
    .floating-donate.is-shown { animation: none; }
}

/* Mobile field with country code, and the thank-you panel shown after a confirmed form */
.phone-inputs { display: flex; gap: 0.4rem; margin-top: 0.35rem; }
.phone-inputs select { flex: 0 0 auto; width: 8.5rem; margin: 0; border: 1px solid #c8d1c1; border-radius: 0.4rem; padding: 0.6rem 0.4rem; background: #fbfcf8; font: inherit; }
.phone-inputs input { flex: 1; min-width: 0; margin: 0; }
.phone-field small { display: block; margin-top: 0.3rem; color: var(--muted); font-size: 0.78rem; font-weight: 400; line-height: 1.4; }
.thank-you-panel { display: grid; justify-items: center; gap: 0.25rem; padding: clamp(1.75rem, 5vw, 3rem) 1.5rem; border-top: 4px solid var(--leaf); text-align: center; }
.thank-you-panel img { width: 5.5rem; height: 5.5rem; border-radius: 50%; padding: 0.6rem; background: var(--forest); object-fit: contain; }
.thank-you-panel h3 { margin: 0.5rem 0 0; color: var(--forest); font-size: 1.6rem; }
.thank-you-panel p { max-width: 480px; margin: 0; color: var(--ink); line-height: 1.7; }
.thank-you-panel .thank-you-blessing { margin-top: 0.5rem; color: var(--orange); font-weight: 700; }
@media (max-width: 480px) { .phone-inputs select { width: 6.5rem; } }

/* ── Section divider ─────────────────────────────────────────────────────── */
.section-divider { display: flex; justify-content: center; margin: 0; padding: 0; background: #fff; line-height: 0; }
.section-divider img { width: clamp(100px, 22%, 200px); height: auto; opacity: 0.22; filter: sepia(1) saturate(5) hue-rotate(-15deg); }

/* ── Decorative patterns ──────────────────────────────────────────────────── */
:root {
    --pattern-rangoli: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='24'%3E%3Ccircle cx='6' cy='12' r='3' fill='none' stroke='%236da943' stroke-width='1.5'/%3E%3Ccircle cx='6' cy='12' r='1' fill='%236da943'/%3E%3Cpath d='M9 12 Q18 4 30 12 Q42 20 51 12' stroke='%236da943' stroke-width='1.5' fill='none'/%3E%3Ccircle cx='54' cy='12' r='3' fill='none' stroke='%236da943' stroke-width='1.5'/%3E%3Ccircle cx='54' cy='12' r='1' fill='%236da943'/%3E%3C/svg%3E");
}
.toran-border {
    height: 29px;
    background: transparent url("/assets/images/toran.svg") repeat-x center / auto 100%;
}
@media (max-width: 479px) { .toran-border { height: 20px; } }