/* A calm, luminous layer for APNOM: forest, sage, cream, and gold. */
:root {
    --forest-deep: #09271b;
    --forest-glow: #247554;
    --gold-light: #f9e8ad;
    --gold-warm: #e5ae43;
    --cream-glow: #fffaf0;
    --line-gold: rgba(213, 156, 52, .28);
    --surface-glow: linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(248, 244, 233, .96));
    --sanctuary-gradient: linear-gradient(135deg, #0a3223 0%, #15513a 53%, #216d4d 100%);
    --gold-gradient: linear-gradient(135deg, #f7d779 0%, #d59c34 52%, #b8771b 100%);
    --soft-ring: 0 0 0 1px rgba(255,255,255,.32), 0 18px 45px rgba(10, 47, 32, .16);
}

body {
    background:
        radial-gradient(circle at 3% 8%, rgba(229, 174, 67, .12), transparent 22rem),
        radial-gradient(circle at 97% 32%, rgba(31, 112, 77, .09), transparent 27rem),
        var(--cream-50);
}

.site-main {
    position: relative;
    background: linear-gradient(180deg, rgba(255, 252, 245, .18), rgba(229, 240, 233, .2) 54%, rgba(255, 252, 245, .7));
}

.utility-bar {
    background: linear-gradient(100deg, var(--forest-deep), var(--forest-900) 48%, #19543d);
    box-shadow: inset 0 -1px rgba(255,255,255,.08);
}

.site-header {
    border-bottom-color: rgba(184, 123, 28, .14);
    background: rgba(255, 252, 245, .93);
}

.site-header.is-scrolled {
    background: rgba(255, 252, 245, .97);
    box-shadow: 0 12px 34px rgba(10, 47, 32, .12);
}

.desktop-nav a, .nav-account {
    position: relative;
    transition: color .22s ease, background .22s ease, transform .22s ease;
}

.desktop-nav a::after {
    position: absolute;
    right: .7rem;
    bottom: .28rem;
    left: .7rem;
    height: 2px;
    border-radius: 999px;
    background: var(--gold-gradient);
    content: "";
    opacity: 0;
    transform: scaleX(.45);
    transition: opacity .22s ease, transform .22s ease;
}

.desktop-nav a:hover, .desktop-nav a.is-active {
    background: linear-gradient(135deg, rgba(229, 240, 233, .9), rgba(255, 248, 228, .92));
    color: var(--forest-900);
}

.desktop-nav a:hover::after, .desktop-nav a.is-active::after { opacity: 1; transform: scaleX(1); }
.nav-account:hover { color: var(--gold-600); transform: translateY(-1px); }

.nav-drawer__signout button {
    display: flex;
    width: 100%;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    padding: .7rem 1rem;
    border: 1px solid rgba(163, 51, 34, .25);
    border-radius: 12px;
    background: linear-gradient(135deg, #fff8f5, #fff0e9);
    color: var(--danger);
    font: inherit;
    font-size: .88rem;
    font-weight: 800;
    letter-spacing: .01em;
    box-shadow: 0 6px 14px rgba(163, 51, 34, .07);
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.nav-drawer__signout button:hover {
    border-color: rgba(163, 51, 34, .46);
    background: #ffe7dc;
    transform: translateY(-1px);
}

.btn {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    box-shadow: 0 8px 18px rgba(18, 59, 42, .1);
    transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}

.btn::before {
    position: absolute;
    z-index: -1;
    top: -45%;
    left: -35%;
    width: 34%;
    height: 190%;
    background: rgba(255,255,255,.28);
    content: "";
    transform: skewX(-22deg) translateX(-250%);
    transition: transform .55s ease;
}

.btn:hover { box-shadow: 0 13px 25px rgba(18, 59, 42, .18); }
.btn:hover::before { transform: skewX(-22deg) translateX(700%); }
.btn--primary, form button[type="submit"] { background: var(--sanctuary-gradient); }
.btn--primary:hover, form button[type="submit"]:hover { background: linear-gradient(135deg, #0a2f21, var(--forest-800), var(--forest-glow)); }
.btn--gold, .btn-primary { background: var(--gold-gradient); box-shadow: 0 10px 22px rgba(184, 123, 28, .2); }
.btn--light { border-color: rgba(213, 156, 52, .25); background: linear-gradient(135deg, #fff, #fff8e5); }

.section-heading__eyebrow, .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    color: var(--gold-600);
}

.section-heading__eyebrow::before, .eyebrow::before {
    width: 1.6rem;
    height: 1px;
    background: linear-gradient(90deg, var(--gold-500), transparent);
    content: "";
}

.card, .info-card, .page-card, .event-card, .auth-card, .list-card,
.program-card, .ministry-card, .feature-card, .belief-card, .resource-card,
.giving-card, .testimony-card, .member-quick-card, .control-panel {
    border-color: rgba(18, 59, 42, .1);
    background: var(--surface-glow);
    box-shadow: 0 12px 31px rgba(18, 59, 42, .075);
    transition: transform .3s cubic-bezier(.2,.75,.25,1), box-shadow .3s ease, border-color .3s ease;
}

.card:hover, .info-card:hover, .page-card:hover, .event-card:hover, .list-card:hover,
.program-card:hover, .ministry-card:hover, .feature-card:hover, .belief-card:hover,
.resource-card:hover, .giving-card:hover, .testimony-card:hover, .member-quick-card:hover {
    border-color: var(--line-gold);
    box-shadow: 0 19px 42px rgba(18, 59, 42, .12);
    transform: translateY(-5px);
}

.pill, .resource-card__count, .control-status {
    border: 1px solid rgba(31, 112, 77, .12);
    background: linear-gradient(135deg, #edf6ef, #dcecdf);
    box-shadow: inset 0 1px rgba(255,255,255,.75);
}

.pill--gold {
    border-color: rgba(213,156,52,.24);
    background: linear-gradient(135deg, #fff9e8, #f6df9d);
}

.icon-circle, .control-row__icon, .leader-control-row img, .leader-control-row > span {
    background: linear-gradient(145deg, #eff7f0, #cee4d4);
    box-shadow: inset 0 1px rgba(255,255,255,.9), 0 7px 14px rgba(18,59,42,.07);
}

input, textarea, select, .control-input {
    border-color: rgba(31, 112, 77, .18);
    background: rgba(255,255,255,.88);
    box-shadow: inset 0 1px 2px rgba(18,59,42,.035);
}

input:hover, textarea:hover, select:hover, .control-input:hover { border-color: rgba(213,156,52,.5); }
input:focus, textarea:focus, select:focus, .control-input:focus {
    border-color: var(--gold-500);
    box-shadow: 0 0 0 4px rgba(213,156,52,.14), inset 0 1px 2px rgba(18,59,42,.035);
}

.alert {
    border-color: rgba(31,112,77,.2);
    background: linear-gradient(135deg, #eff8ef, #e2f0e5);
    box-shadow: 0 11px 27px rgba(18,59,42,.09);
}

.page-hero {
    border: 1px solid rgba(213,156,52,.18);
    background:
        radial-gradient(circle at 85% 15%, rgba(244,214,140,.45), transparent 23%),
        radial-gradient(circle at 10% 100%, rgba(31,112,77,.16), transparent 30%),
        linear-gradient(125deg, #edf5ed, #fff8e9);
    box-shadow: var(--soft-ring);
}

.page-hero::after {
    border-color: rgba(213,156,52,.2);
    animation: sanctuary-drift 17s ease-in-out infinite;
}

.home-hero, .control-hero {
    background: var(--sanctuary-gradient);
    background-size: 170% 170%;
    box-shadow: 0 24px 58px rgba(10,47,32,.22);
    animation: sanctuary-breathe 18s ease-in-out infinite;
}

.home-hero::before, .home-hero::after {
    border-color: rgba(249,232,173,.2);
    animation: sanctuary-drift 20s ease-in-out infinite;
}

.home-hero::after { animation-delay: -8s; }
.hero-portrait { box-shadow: 14px 20px 0 rgba(229,174,67,.8), 0 18px 40px rgba(0,0,0,.2); }
.hero-note { border-color: rgba(249,232,173,.68); box-shadow: 0 15px 34px rgba(1,31,20,.28); }

.home-stats {
    background: linear-gradient(90deg, rgba(213,156,52,.35), rgba(31,112,77,.28));
    box-shadow: 0 15px 30px rgba(18,59,42,.08);
}

.stat { background: linear-gradient(145deg, #fff, #f8f5ea); }
.stat strong { color: var(--forest-800); }

.daily-word, .founder-profile { box-shadow: var(--shadow-md); }
.daily-word__prayer, .outreach-callout, .auth-layout__aside, .editor-aside {
    background: var(--sanctuary-gradient);
}

/* These variants intentionally use light text; keep their surfaces dark. */
.member-quick-card--accent {
    border-color: rgba(249,232,173,.2);
    background: radial-gradient(circle at 100% 0%, rgba(249,232,173,.16), transparent 31%), var(--sanctuary-gradient);
    box-shadow: 0 17px 36px rgba(10,47,32,.19);
}

.member-quick-card--accent .icon-circle {
    background: linear-gradient(145deg, var(--gold-light), var(--gold-warm));
    color: var(--forest-deep);
}

.member-quick-card--accent p strong { color: var(--white); }
.member-quick-card--accent p span { color: rgba(255,255,255,.72); }

.values-card, .contact-details {
    border-color: rgba(249,232,173,.2);
    background: radial-gradient(circle at 100% 0%, rgba(249,232,173,.16), transparent 32%), var(--sanctuary-gradient);
    box-shadow: 0 18px 38px rgba(10,47,32,.18);
}

.values-card .eyebrow, .contact-details .eyebrow { color: var(--gold-light); }
.contact-details__item > span:last-child { color: rgba(255,255,255,.78); letter-spacing: 0; text-transform: none; }

.visit-card {
    border-color: rgba(249,232,173,.2);
    background: radial-gradient(circle at 100% 0%, rgba(249,232,173,.16), transparent 32%), var(--sanctuary-gradient);
    box-shadow: 0 18px 38px rgba(10,47,32,.18);
}

.visit-card .eyebrow { color: var(--gold-light); }

.program-card--empty {
    border-color: rgba(31,112,77,.12);
    background: linear-gradient(145deg, #edf6ef, #dcecdf);
}

.daily-word__prayer { position: relative; overflow: hidden; }
.daily-word__prayer::after {
    position: absolute;
    right: -5rem;
    bottom: -7rem;
    width: 16rem;
    height: 16rem;
    border: 1px solid rgba(249,232,173,.25);
    border-radius: 50%;
    content: "";
}

.member-welcome, .profile-hero {
    background: radial-gradient(circle at 88% 8%, rgba(249,232,173,.25), transparent 24%), var(--sanctuary-gradient);
    box-shadow: 0 20px 46px rgba(10,47,32,.18);
}

.control-stats { background: linear-gradient(135deg, rgba(213,156,52,.35), rgba(31,112,77,.3)); }
.control-stats article { background: linear-gradient(145deg, #fff, #f7f4e9); }
.control-panel--wide { background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(245,250,245,.96)); }

.site-footer {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #09271b, #0f3d2b 52%, #174f39);
}

.site-footer::before {
    position: absolute;
    top: -13rem;
    right: -9rem;
    width: 29rem;
    height: 29rem;
    border: 1px solid rgba(249,232,173,.16);
    border-radius: 50%;
    box-shadow: 0 0 0 3.4rem rgba(249,232,173,.025), 0 0 0 7rem rgba(249,232,173,.018);
    content: "";
}

.site-footer__grid, .site-footer__bottom { position: relative; z-index: 1; }
.site-footer h2 { color: var(--gold-light); }
.footer-links a, .footer-contact a { transition: color .2s ease, transform .2s ease; }
.footer-links a:hover, .footer-contact a:hover { transform: translateX(3px); }

@keyframes sanctuary-breathe {
    0%, 100% { background-position: 0% 35%; }
    50% { background-position: 100% 66%; }
}

@keyframes sanctuary-drift {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(-12px, 9px, 0) scale(1.035); }
}

@media (max-width: 640px) {
    .card:hover, .info-card:hover, .page-card:hover, .event-card:hover, .list-card:hover,
    .program-card:hover, .ministry-card:hover, .feature-card:hover, .belief-card:hover,
    .resource-card:hover, .giving-card:hover, .testimony-card:hover, .member-quick-card:hover {
        transform: none;
    }

    .section-heading__eyebrow::before, .eyebrow::before { width: 1.1rem; }
}

@media (prefers-reduced-motion: reduce) {
    .home-hero, .control-hero, .page-hero::after, .home-hero::before, .home-hero::after { animation: none; }
    .btn::before { display: none; }
}
