/* ================================================================
   rural-children.css
   Colour & theme overrides for Rural Deprived Children page.
   Builds on top of styles.css + street-children.css.
   Theme: Forest green · earthy amber · warm cream
================================================================ */

/* ── Green palette tokens ── */
:root {
    --rdc-green-deep: #1a4a2a;
    --rdc-green-mid: #2d7a46;
    --rdc-green-light: #4caf72;
    --rdc-green-pale: #e2f0e7;
    --rdc-amber: #c8860a;
    --rdc-amber-light: #f0b429;
    --rdc-amber-pale: #fdf3d7;
}

/* ── Nav scrolled-state overrides ── */
.site-header.scrolled .nav__logo-text strong {
    color: var(--rdc-green-deep);
}

.site-header.scrolled .nav__link:hover {
    color: var(--rdc-green-deep);
}

/* ── Page header background ── */
.rdc-page-header__bg {
    background:
        radial-gradient(ellipse 80% 100% at 0% 50%, rgba(26, 74, 42, .15) 0%, transparent 65%),
        linear-gradient(160deg, #f4f9f5 0%, #e2f0e7 40%, #fdf8ee 100%) !important;
}

/* ── Program badge ── */
.rdc-badge {
    background: var(--rdc-green-pale) !important;
    border-color: rgba(45, 122, 70, .25) !important;
    color: var(--rdc-green-mid) !important;
}

.rdc-badge i {
    color: var(--rdc-green-mid);
}

/* ── Page title italic subtitle colour ── */
.rdc-page-header .sc-page-header__title span {
    color: var(--rdc-green-mid) !important;
}

/* ── Glance panel icons ── */
.rdc-icon {
    background: var(--rdc-green-pale) !important;
    color: var(--rdc-green-mid) !important;
}

/* ── Eyebrow on this page ── */
.rdc-page-header .eyebrow,
.sc-objectives .eyebrow,
.sc-gallery .eyebrow,
.sc-cta .eyebrow,
.sc-other-programs .eyebrow {
    color: var(--rdc-green-mid);
}

/* ── Panel verse accent ── */
.rdc-page-header .sc-panel__heading {
    color: var(--rdc-green-mid);
}

.rdc-page-header .sc-panel__verse cite {
    color: var(--rdc-green-mid);
}

/* ── Danger / risk tags ── */
.rdc-tag {
    background: rgba(45, 122, 70, .08) !important;
    border-color: rgba(45, 122, 70, .2) !important;
    color: var(--rdc-green-mid) !important;
}

.rdc-tag i {
    color: #b45309 !important;
}

/* ── Image placeholders: green forest gradients ── */
.rdc-placeholder--1 {
    background: linear-gradient(145deg, #0d2b17 0%, #1a4a2a 40%, #2d7a46 100%) !important;
}

.rdc-placeholder--gallery1 {
    background: linear-gradient(145deg, #1a4a2a 0%, #2d7a46 50%, #0d2b17 100%) !important;
}

.rdc-placeholder--gallery2 {
    background: linear-gradient(145deg, #1f3d10 0%, #2d5a1a 50%, #1a4a2a 100%) !important;
}

.rdc-ph-icon {
    background: rgba(76, 175, 114, .2) !important;
    color: var(--rdc-green-light) !important;
    border-color: rgba(76, 175, 114, .3) !important;
}

/* ── btn--rdc: green primary CTA ── */
.btn--rdc {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.78rem 1.8rem;
    font-family: var(--font-body);
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    border-radius: var(--radius-pill);
    border: 2px solid var(--rdc-green-mid);
    background: var(--rdc-green-mid);
    color: var(--white);
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 4px 18px rgba(45, 122, 70, .35);
    transition: all var(--t);
}

.btn--rdc:hover {
    background: var(--rdc-green-deep);
    border-color: var(--rdc-green-deep);
    box-shadow: 0 6px 28px rgba(45, 122, 70, .5);
    transform: translateY(-2px);
}

.btn--rdc.btn--large {
    padding: 1rem 2.4rem;
    font-size: 0.98rem;
}

/* ── Objective cards: green icon wrap ── */
.rdc-icon-wrap {
    background: var(--rdc-green-pale) !important;
    color: var(--rdc-green-mid) !important;
}

.sc-obj-card:hover .rdc-icon-wrap {
    background: var(--rdc-green-mid) !important;
    color: var(--white) !important;
}

/* Accent bar colour on objective card hover */
.sc-obj-card::before {
    background: linear-gradient(90deg, var(--rdc-green-mid), var(--rdc-green-light)) !important;
}

/* ── Water card highlight ── */
.rdc-card--water {
    background: linear-gradient(135deg, var(--rdc-green-pale) 0%, var(--white) 100%) !important;
    border-color: rgba(45, 122, 70, .25) !important;
}

/* ── 4-objective grid: 2×2 centred ── */
.rdc-obj-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    max-width: 860px;
    margin: 0 auto;
}

/* Override the 7th-card centring rule from street-children.css */
.rdc-obj-grid .sc-obj-card:nth-child(7) {
    grid-column: auto !important;
}

/* Supply bullet list inside the in-school card */
.rdc-supply-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-top: var(--sp-md);
    padding-top: var(--sp-md);
    border-top: 1px solid var(--border);
}

.rdc-supply-list li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-mid);
}

.rdc-supply-list i {
    color: var(--rdc-green-mid);
    font-size: 1rem;
}

/* ── Eyebrow inside widget ── */
.sc-cta__widget-label {
    color: var(--rdc-green-mid) !important;
}

/* ── Challenges strip (dark green forest) ── */
.rdc-challenges__bg {
    background: linear-gradient(160deg, #0d2b17 0%, #1a4a2a 45%, #0a1a0d 100%) !important;
}

/* ── Scripture card: green ── */
.rdc-scripture {
    background: linear-gradient(135deg, var(--rdc-green-deep) 0%, #1f5c35 100%) !important;
}

/* ── Related card hover border ── */
.sc-related-card:hover {
    border-color: var(--rdc-green-mid) !important;
}

.sc-related-card:hover .sc-related-card__icon {
    background: var(--rdc-green-mid) !important;
    color: var(--white) !important;
}

/* ── Responsive: stack grid on mobile ── */
@media (max-width: 640px) {
    .rdc-obj-grid {
        grid-template-columns: 1fr !important;
    }
}