
:root {
    --navy: #153f5c;
    --navy-dark: #0c293e;
    --teal: #4fa7b6;
    --teal-soft: #e8f5f6;
    --sky: #dff4f7;
    --gold: #d8aa52;
    --white: #ffffff;
    --ink: #1b2730;
    --muted: #5f6d77;
    --line: #d8e2e7;
    --surface: #f6f9fa;
    --radius: 18px;
    --shadow: 0 18px 45px rgba(15, 50, 73, .12);
    --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    color: var(--ink);
    background: var(--white);
    line-height: 1.65;
}
img { max-width: 100%; display: block; }
a { color: var(--navy); text-decoration: none; }
a:hover { color: var(--teal); }
h1, h2, h3 { color: var(--navy-dark); line-height: 1.12; margin-top: 0; }
h1 { font-size: clamp(2.45rem, 6vw, 5.2rem); letter-spacing: -.045em; }
h2 { font-size: clamp(1.8rem, 4vw, 3rem); letter-spacing: -.025em; }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1.15rem; }
.container { width: min(calc(100% - 2rem), var(--max)); margin-inline: auto; }
.narrow { width: min(calc(100% - 2rem), 820px); margin-inline: auto; }
.skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 9999; background: var(--navy); color: white; padding: .75rem 1rem; border-radius: 8px; }
.skip-link:focus { top: 1rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.top-bar { background: var(--navy-dark); color: #eaf4f7; font-size: .9rem; }
.top-bar-inner { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.top-bar a { color: inherit; }
.site-header { position: sticky; top: 0; z-index: 1000; background: rgba(255,255,255,.97); box-shadow: 0 4px 20px rgba(10, 34, 50, .08); backdrop-filter: blur(12px); }
.header-main { min-height: 92px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { width: min(460px, 42vw); }
.site-nav { display: flex; align-items: center; gap: 1.1rem; font-weight: 700; font-size: .94rem; }
.site-nav a:not(.button) { padding: .65rem 0; position: relative; }
.site-nav a:not(.button)::after { content:""; position:absolute; left:0; right:100%; bottom:.35rem; height:2px; background:var(--teal); transition:.2s ease; }
.site-nav a:hover::after, .site-nav a.active::after { right:0; }
.nav-toggle { display:none; border:0; background:transparent; padding:.5rem; }
.nav-toggle span:not(.sr-only) { display:block; width:27px; height:3px; background:var(--navy); margin:5px 0; border-radius:5px; }

.button {
    display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
    padding:.95rem 1.35rem; border-radius:999px; background:var(--navy);
    color:white; font-weight:800; border:2px solid var(--navy); transition:.2s ease;
}
.button:hover { background:var(--teal); border-color:var(--teal); color:white; transform:translateY(-2px); }
.button-secondary { background:transparent; color:white; border-color:white; }
.button-secondary:hover { background:white; color:var(--navy); }
.button-small { padding:.7rem 1rem; font-size:.9rem; }

.hero {
    min-height: 670px;
    display:grid; place-items:center;
    background:
      linear-gradient(90deg, rgba(7,31,47,.92) 0%, rgba(10,44,65,.78) 46%, rgba(10,44,65,.18) 100%),
      url("../images/campridge-sign.png") center/cover no-repeat;
    color:white; position:relative; overflow:hidden;
}
.hero::after { content:""; position:absolute; inset:auto 0 0; height:150px; background:linear-gradient(transparent, rgba(4,20,30,.35)); }
.hero-content { position:relative; z-index:1; padding:6rem 0; max-width:760px; margin-right:auto; }
.eyebrow { text-transform:uppercase; letter-spacing:.19em; font-size:.8rem; font-weight:900; color:var(--teal); margin-bottom:1rem; }
.hero .eyebrow { color:#9fe4ec; }
.hero h1 { color:white; margin-bottom:1.3rem; }
.hero .lead { font-size:clamp(1.08rem,2vw,1.35rem); max-width:670px; color:#edf8fa; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2rem; }
.mission-band { background:var(--navy); color:white; padding:1.4rem 0; text-align:center; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }

.section { padding:clamp(4rem,8vw,7rem) 0; }
.section-soft { background:var(--surface); }
.section-dark { background:var(--navy-dark); color:white; }
.section-dark h2, .section-dark h3 { color:white; }
.section-intro { max-width:730px; margin-bottom:2.4rem; }
.section-intro p { color:var(--muted); font-size:1.08rem; }
.section-dark .section-intro p { color:#d3e6ec; }
.grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,5vw,5rem); align-items:center; }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.35rem; }
.card {
    background:white; border:1px solid var(--line); border-radius:var(--radius);
    padding:1.6rem; box-shadow:0 8px 26px rgba(10,42,60,.06);
}
.card-icon {
    width:54px; height:54px; border-radius:16px; display:grid; place-items:center;
    font-size:1.45rem; background:var(--teal-soft); color:var(--navy); margin-bottom:1rem; font-weight:900;
}
.feature-panel { background:linear-gradient(145deg,var(--navy),#246c88); color:white; border-radius:28px; padding:clamp(2rem,5vw,4rem); box-shadow:var(--shadow); }
.feature-panel h2 { color:white; }
.service-time { display:flex; align-items:center; gap:1rem; margin:1.6rem 0; padding:1rem; background:rgba(255,255,255,.1); border-radius:14px; }
.service-time strong { display:block; font-size:1.45rem; }
.quote { font-size:clamp(1.45rem,3vw,2.2rem); font-weight:800; color:var(--navy); border-left:5px solid var(--teal); padding-left:1.3rem; }
.page-hero { padding:clamp(4rem,9vw,7rem) 0; background:linear-gradient(135deg,var(--sky),#f7fbfc); border-bottom:1px solid var(--line); }
.page-hero h1 { font-size:clamp(2.5rem,6vw,4.6rem); margin-bottom:.8rem; }
.breadcrumb { font-size:.9rem; font-weight:700; color:var(--muted); }
.breadcrumb a { color:var(--teal); }

.timeline { display:grid; gap:1rem; }
.event-card {
    display:grid; grid-template-columns:115px 1fr auto; gap:1.4rem; align-items:center;
    background:white; border:1px solid var(--line); border-radius:var(--radius); padding:1.15rem;
}
.event-date { background:var(--navy); color:white; border-radius:14px; padding:.85rem; text-align:center; }
.event-date .day { display:block; font-size:2rem; font-weight:900; line-height:1; }
.event-date .month { display:block; font-size:.82rem; text-transform:uppercase; letter-spacing:.14em; margin-top:.25rem; }
.tag { display:inline-block; padding:.34rem .7rem; border-radius:999px; background:var(--teal-soft); color:var(--navy); font-size:.8rem; font-weight:800; }

.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:2rem; align-items:start; }
.contact-card { background:var(--navy-dark); color:white; border-radius:24px; padding:2rem; }
.contact-card h2, .contact-card h3 { color:white; }
.contact-list { list-style:none; padding:0; margin:1.5rem 0 0; }
.contact-list li { margin:.85rem 0; }
.contact-list a { color:#bcecf1; }
.form-card { border:1px solid var(--line); border-radius:24px; padding:clamp(1.4rem,4vw,2.4rem); box-shadow:var(--shadow); }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.form-group { display:grid; gap:.4rem; margin-bottom:1rem; }
.form-group.full { grid-column:1/-1; }
label { font-weight:800; color:var(--navy-dark); }
input, select, textarea {
    width:100%; border:1px solid #bfcdd4; border-radius:12px; padding:.9rem 1rem; font:inherit; color:var(--ink); background:white;
}
input:focus, select:focus, textarea:focus { outline:3px solid rgba(79,167,182,.22); border-color:var(--teal); }
textarea { min-height:150px; resize:vertical; }
.form-note { font-size:.88rem; color:var(--muted); }

.cta { text-align:center; background:linear-gradient(135deg,#e9f8f9,#f7fcfc); border-radius:28px; padding:clamp(2rem,6vw,4.5rem); border:1px solid #cbe6ea; }
.cta p { max-width:700px; margin-inline:auto; color:var(--muted); }

.site-footer { background:#071f2f; color:#d6e6ec; padding-top:4rem; }
.footer-grid { display:grid; grid-template-columns:1.35fr repeat(3,1fr); gap:2rem; }
.footer-logo { width:min(360px,100%); filter:brightness(0) invert(1); opacity:.96; }
.footer-mission { color:#9cdce5; font-weight:800; max-width:380px; }
.site-footer h2 { color:white; font-size:1.05rem; margin-bottom:1rem; }
.site-footer a { color:#d6e6ec; }
.site-footer a:hover { color:#8edbe5; }
.footer-links { list-style:none; padding:0; margin:0; }
.footer-links li { margin:.45rem 0; }
.footer-bottom { margin-top:3rem; padding:1.2rem 0; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:1rem; font-size:.9rem; }
.footer-bottom p { margin:0; }

@media (max-width: 980px) {
    .brand { width:min(390px,65vw); }
    .nav-toggle { display:block; }
    .site-nav {
        position:absolute; left:0; right:0; top:100%; padding:1rem;
        background:white; box-shadow:0 14px 28px rgba(10,33,48,.12);
        display:none; flex-direction:column; align-items:stretch;
    }
    .site-nav.open { display:flex; }
    .site-nav a { padding:.85rem 1rem !important; }
    .site-nav a:not(.button)::after { display:none; }
    .grid-3 { grid-template-columns:1fr 1fr; }
    .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px) {
    .top-bar-inner { justify-content:center; text-align:center; flex-wrap:wrap; padding:.35rem 0; }
    .top-bar-inner > span:first-child { display:none; }
    .header-main { min-height:78px; }
    .brand { width:min(320px,72vw); }
    .hero { min-height:610px; background-position:58% center; }
    .grid-2, .grid-3, .contact-grid, .form-grid { grid-template-columns:1fr; }
    .event-card { grid-template-columns:84px 1fr; }
    .event-card .button { grid-column:1/-1; }
    .footer-grid { grid-template-columns:1fr; }
    .footer-bottom { flex-direction:column; text-align:center; }
}


/* ===============================================================
   CampRidge 2026 brand + Purpose / Vision / Mission update
   =============================================================== */

.top-purpose {
    font-weight: 800;
    color: #a9e4df;
    text-align: center;
}

.header-main {
    min-height: 104px;
}

.brand {
    width: 235px;
    max-width: 38vw;
    flex: 0 0 auto;
}

.brand img {
    width: 100%;
    height: 84px;
    object-fit: contain;
    object-position: left center;
}

.mission-band {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .7rem;
    flex-wrap: wrap;
}

.mission-band span {
    color: #a9e4df;
    font-size: .72rem;
    letter-spacing: .16em;
    padding-right: .7rem;
    border-right: 1px solid rgba(255,255,255,.35);
}

.pvm-grid {
    align-items: stretch;
}

.pvm-card {
    position: relative;
    overflow: hidden;
    padding-top: 2.15rem;
}

.pvm-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 5px;
    background: var(--teal);
}

.pvm-label {
    display: inline-block;
    margin-bottom: .75rem;
    text-transform: uppercase;
    letter-spacing: .16em;
    font-size: .76rem;
    font-weight: 900;
    color: var(--teal);
}

.pvm-card p {
    font-size: 1.05rem;
}

.values-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.value-card {
    border-top: 4px solid var(--teal);
    background: var(--surface);
    padding: 1.55rem;
    border-radius: 0 0 var(--radius) var(--radius);
}

.value-card > span {
    display: block;
    color: var(--teal);
    font-weight: 900;
    letter-spacing: .12em;
    font-size: .8rem;
    margin-bottom: 1.6rem;
}

.value-card h3 {
    margin-bottom: .65rem;
}

.dark-links {
    display: grid;
    gap: .75rem;
}

.dark-links a {
    display: grid;
    gap: .15rem;
    padding: 1.15rem 1.25rem;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 14px;
    background: rgba(255,255,255,.05);
    color: white;
    transition: .2s ease;
}

.dark-links a:hover {
    background: rgba(255,255,255,.1);
    transform: translateX(4px);
}

.dark-links span {
    color: #b8d9e1;
    font-size: .92rem;
}


.pvm-stack {
    display: grid;
    gap: 1rem;
}

.pvm-wide {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 1.4rem;
    align-items: start;
    background: white;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: clamp(1.4rem, 3vw, 2rem);
    box-shadow: 0 8px 26px rgba(10,42,60,.05);
}

.pvm-wide h3 {
    font-size: clamp(1.25rem, 2.4vw, 1.75rem);
    margin-bottom: .75rem;
}

.pvm-number {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--navy);
    color: white;
    font-weight: 900;
}

.centre-statement {
    max-width: 900px;
    text-align: center;
}

.centre-statement p:last-child {
    max-width: 760px;
    margin-inline: auto;
    color: #d4e7ed;
    font-size: 1.08rem;
}

.footer-logo-panel {
    display: inline-block;
    background: white;
    border-radius: 16px;
    padding: .65rem .8rem;
    margin-bottom: 1rem;
}

.footer-logo {
    width: 205px;
    max-width: 100%;
    filter: none !important;
    opacity: 1;
}

.footer-tagline {
    margin-bottom: .35rem;
    color: white;
    font-weight: 800;
}

.footer-purpose {
    color: #9cdce5;
    font-weight: 700;
    max-width: 370px;
}

.footer-values {
    margin-top: 2.5rem;
    padding: 1rem 0;
    border-top: 1px solid rgba(255,255,255,.12);
    border-bottom: 1px solid rgba(255,255,255,.12);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .76rem;
    font-weight: 900;
    color: #9cdce5;
}

@media (max-width: 1080px) {
    .top-purpose { display: none; }
    .brand { width: 210px; }
    .site-nav { gap: .85rem; }
    .values-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 720px) {
    .header-main { min-height: 88px; }
    .brand { width: 185px; max-width: 62vw; }
    .brand img { height: 72px; }
    .mission-band { padding-inline: 1rem; }
    .mission-band span {
        width: 100%;
        border: 0;
        padding: 0;
    }
    .values-grid { grid-template-columns: 1fr; }
    .pvm-wide { grid-template-columns: 1fr; }
    .pvm-number { width: 52px; height: 52px; }
    .footer-values { grid-template-columns: 1fr 1fr; gap: .8rem; }
}

/* Podcast Ministry + Sound Team Admin */
.podcast-list{display:grid;gap:1.25rem}.podcast-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);box-shadow:0 8px 28px rgba(10,42,60,.06)}.podcast-card h3{font-size:clamp(1.35rem,2.8vw,1.85rem);margin-bottom:.55rem}.podcast-meta{display:flex;flex-wrap:wrap;gap:.55rem 1rem;margin-bottom:.75rem;color:var(--muted);font-size:.9rem;font-weight:700}.podcast-scripture{color:var(--teal);font-weight:900}.podcast-card audio{width:100%;margin:.9rem 0}.podcast-download{display:inline-block;font-weight:900}.podcast-empty{padding:2rem;border:1px dashed var(--line);border-radius:var(--radius);background:var(--surface)}
.admin-body{min-height:100vh;background:radial-gradient(circle at top right,rgba(79,167,182,.16),transparent 35%),var(--surface)}.admin-shell{min-height:100vh;display:grid;place-items:center;padding:2rem 1rem}.admin-login-card,.admin-panel{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.admin-login-card{width:min(100%,460px);padding:clamp(1.5rem,5vw,2.6rem)}.admin-login-card h1,.admin-dashboard h1{font-size:clamp(2rem,4vw,3rem)}.admin-brand{display:inline-block;width:190px;margin-bottom:1.5rem}.admin-brand img{width:100%;height:auto}.admin-brand-small{width:150px;margin:0}.admin-button{width:100%}.admin-alert{padding:.9rem 1rem;border-radius:12px;margin:1rem 0;font-weight:700}.admin-alert-error{background:#fff1f1;border:1px solid #e7b7b7;color:#8e2424}.admin-alert-success{background:#edf9f4;border:1px solid #b9decf;color:#236548}.admin-topbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem clamp(1rem,4vw,2rem);background:#fff;border-bottom:1px solid var(--line)}.admin-topbar>div{display:flex;gap:1rem;font-weight:800}.admin-dashboard{width:min(calc(100% - 2rem),1180px);margin:2rem auto;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.75fr);gap:1.4rem;align-items:start}.admin-panel{padding:clamp(1.4rem,4vw,2.2rem)}.admin-recent-list{display:grid;gap:.75rem}.admin-recent-list article{padding:.9rem 0;border-bottom:1px solid var(--line);display:grid;gap:.2rem}.admin-recent-list span{color:var(--muted);font-size:.88rem}@media(max-width:820px){.admin-dashboard{grid-template-columns:1fr}.admin-topbar{align-items:flex-start}.admin-topbar>div{flex-direction:column;text-align:right;gap:.35rem}}


/* ===============================================================
   MOBILE-FIRST PODCAST ADMIN
   Admin pages intentionally override public website typography
   and layout so the dashboard works comfortably on smartphones.
   =============================================================== */

.admin-body {
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    background: #f3f7f8;
    color: var(--ink);
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
}

.admin-body *,
.admin-body *::before,
.admin-body *::after {
    box-sizing: border-box;
}

.admin-body h1,
.admin-body h2,
.admin-body h3,
.admin-body p {
    overflow-wrap: anywhere;
}

.admin-body h1 {
    margin: 0 0 .65rem;
    font-size: clamp(1.65rem, 7vw, 2.45rem);
    line-height: 1.08;
    letter-spacing: -.035em;
}

.admin-body h2 {
    margin: 0 0 .6rem;
    font-size: clamp(1.3rem, 5vw, 1.75rem);
    line-height: 1.15;
}

.admin-body .eyebrow {
    margin-bottom: .55rem;
    font-size: .72rem;
    letter-spacing: .16em;
}

.admin-login-shell {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.admin-login-card {
    width: 100%;
    max-width: 430px;
    margin: 0 auto;
    padding: clamp(1.25rem, 5vw, 2rem);
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 16px 42px rgba(15, 50, 73, .11);
}

.admin-brand-login {
    display: block;
    width: 150px;
    max-width: 50vw;
    margin: 0 auto 1.25rem;
}

.admin-brand-login img,
.admin-brand-small img {
    width: 100%;
    height: auto;
    max-height: 76px;
    object-fit: contain;
}

.admin-login-heading {
    text-align: center;
    margin-bottom: 1.3rem;
}

.admin-login-heading p:last-child {
    margin-bottom: 0;
    color: var(--muted);
    font-size: .95rem;
}

.admin-login-help {
    margin: 1rem 0 0;
    text-align: center;
    font-size: .9rem;
}

.admin-topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    min-height: 68px;
    padding: .65rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    background: rgba(255,255,255,.97);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 4px 16px rgba(10, 33, 48, .06);
    backdrop-filter: blur(10px);
}

.admin-brand-small {
    display: block;
    flex: 0 0 auto;
    width: 118px;
    max-width: 38vw;
    margin: 0;
}

.admin-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
}

.admin-action-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: .55rem .72rem;
    border-radius: 10px;
    font-size: .82rem;
    font-weight: 800;
    white-space: nowrap;
    background: var(--surface);
    border: 1px solid var(--line);
}

.admin-action-logout {
    background: var(--navy);
    color: #fff;
    border-color: var(--navy);
}

.admin-action-logout:hover {
    color: #fff;
    background: var(--teal);
    border-color: var(--teal);
}

.admin-dashboard {
    width: min(100% - 1.25rem, 1120px);
    margin: 1rem auto 2rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.admin-panel {
    min-width: 0;
    padding: clamp(1rem, 4vw, 1.65rem);
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 8px 24px rgba(10, 42, 60, .06);
}

.admin-panel-heading {
    margin-bottom: 1.1rem;
}

.admin-panel-heading > p:last-child {
    margin-bottom: 0;
    color: var(--muted);
    font-size: .95rem;
}

.admin-form {
    width: 100%;
}

.admin-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .9rem;
}

.admin-form .form-group {
    min-width: 0;
    margin: 0;
    gap: .35rem;
}

.admin-form label {
    font-size: .92rem;
    line-height: 1.3;
}

.admin-form input,
.admin-form select,
.admin-form textarea {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 48px;
    padding: .78rem .85rem;
    border-radius: 11px;
    font-size: 16px; /* prevents iOS form zoom */
    line-height: 1.35;
}

.admin-form textarea {
    min-height: 120px;
}

.admin-file-wrap {
    width: 100%;
    overflow: hidden;
    border: 1px dashed #b8c9d1;
    border-radius: 12px;
    background: var(--surface);
    padding: .75rem;
}

.admin-file-wrap input[type="file"] {
    width: 100%;
    min-height: 44px;
    padding: .35rem;
    border: 0;
    background: transparent;
    overflow: hidden;
}

.admin-file-wrap input[type="file"]::file-selector-button {
    min-height: 40px;
    margin-right: .7rem;
    padding: .55rem .75rem;
    border: 0;
    border-radius: 8px;
    background: var(--navy);
    color: #fff;
    font: inherit;
    font-weight: 800;
}

.admin-submit-wrap {
    margin-top: 1rem;
}

.admin-button {
    width: 100%;
    min-height: 50px;
    padding: .85rem 1rem;
    font-size: 1rem;
}

.admin-alert {
    margin: 0 0 1rem;
    padding: .85rem;
    border-radius: 11px;
    font-size: .9rem;
    line-height: 1.45;
}

.admin-recent-list {
    display: grid;
    gap: 0;
}

.admin-recent-list article {
    min-width: 0;
    padding: .85rem 0;
    border-bottom: 1px solid var(--line);
}

.admin-recent-list article:last-child {
    border-bottom: 0;
}

.admin-recent-list strong,
.admin-recent-list span {
    display: block;
    overflow-wrap: anywhere;
}

.admin-recent-list strong {
    font-size: .98rem;
    line-height: 1.35;
}

.admin-recent-list span {
    margin-top: .25rem;
    color: var(--muted);
    font-size: .82rem;
    line-height: 1.4;
}

.admin-empty-state {
    margin: 0;
    color: var(--muted);
}

/* Small phones */
@media (max-width: 430px) {
    .admin-login-shell {
        align-items: flex-start;
        padding: 12px;
    }

    .admin-login-card {
        margin-top: 10px;
        padding: 1.1rem;
        border-radius: 16px;
    }

    .admin-brand-login {
        width: 130px;
        margin-bottom: .9rem;
    }

    .admin-topbar {
        padding: .55rem .7rem;
    }

    .admin-brand-small {
        width: 96px;
    }

    .admin-actions {
        gap: .3rem;
    }

    .admin-action-link {
        min-height: 38px;
        padding: .45rem .55rem;
        font-size: .74rem;
    }

    .admin-dashboard {
        width: min(100% - .8rem, 1120px);
        margin-top: .65rem;
        gap: .65rem;
    }

    .admin-panel {
        padding: .95rem;
        border-radius: 14px;
    }

    .admin-body h1 {
        font-size: 1.7rem;
    }
}

/* Tablet / landscape phones */
@media (min-width: 700px) {
    .admin-dashboard {
        width: min(100% - 2rem, 1120px);
        margin-top: 1.5rem;
        gap: 1.25rem;
    }

    .admin-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-form-full {
        grid-column: 1 / -1;
    }

    .admin-submit-wrap {
        display: flex;
        justify-content: flex-start;
    }

    .admin-button {
        width: auto;
        min-width: 190px;
    }
}

/* Desktop */
@media (min-width: 980px) {
    .admin-dashboard {
        grid-template-columns: minmax(0, 1.8fr) minmax(280px, .7fr);
    }

    .admin-panel {
        padding: 1.75rem;
    }

    .admin-recent-panel {
        position: sticky;
        top: 88px;
    }
}


/* ===============================================================
   EVENTS PAGE + EVENTS ADMIN
   =============================================================== */

.events-page-nav {
    position: sticky;
    top: 142px;
    z-index: 40;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 5px 18px rgba(10,42,60,.05);
    backdrop-filter: blur(10px);
}

.events-page-nav .container {
    display: flex;
    gap: .5rem;
    overflow-x: auto;
    padding-top: .7rem;
    padding-bottom: .7rem;
    scrollbar-width: thin;
}

.events-page-nav a {
    flex: 0 0 auto;
    padding: .6rem .85rem;
    border-radius: 999px;
    background: var(--surface);
    border: 1px solid var(--line);
    font-size: .86rem;
    font-weight: 800;
    white-space: nowrap;
}

.events-page-nav a:hover {
    background: var(--teal-soft);
    border-color: var(--teal);
}

.events-section-intro {
    margin-bottom: 1.8rem;
}

.events-public-list {
    display: grid;
    gap: 1rem;
}

.event-card-dynamic {
    grid-template-columns: 100px minmax(0, 1fr) auto;
}

.event-card-content {
    min-width: 0;
}

.event-meta-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem .8rem;
    color: var(--muted);
    font-size: .86rem;
    font-weight: 700;
    margin-bottom: .45rem;
}

.event-location {
    color: var(--navy);
    font-weight: 800;
    margin-bottom: .55rem;
}

.event-date-undated {
    background: var(--teal);
}

.event-calendar-mark {
    display: block;
    font-size: 2rem;
    line-height: .8;
}

.events-empty-state {
    padding: 1.4rem;
    background: white;
    border: 1px dashed #bcccd3;
    border-radius: var(--radius);
}

.events-empty-state h3 {
    margin-bottom: .4rem;
}

.events-empty-state p {
    margin: 0;
    color: var(--muted);
}

/* Events Admin */
.events-admin-shell {
    width: min(100% - 1rem, 1180px);
    margin: .8rem auto 2rem;
    display: grid;
    gap: .8rem;
}

.events-admin-heading {
    padding-bottom: 1rem;
}

.events-admin-heading > p:last-child {
    color: var(--muted);
    margin-bottom: 0;
}

.events-section-tabs {
    display: flex;
    gap: .45rem;
    overflow-x: auto;
    padding: .2rem 0 .5rem;
    scrollbar-width: thin;
}

.events-section-tabs a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: .55rem .75rem;
    border-radius: 10px;
    background: white;
    border: 1px solid var(--line);
    font-size: .82rem;
    font-weight: 850;
    white-space: nowrap;
}

.events-section-tabs a.active {
    background: var(--navy);
    border-color: var(--navy);
    color: white;
}

.events-admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .8rem;
}

.events-admin-form-actions {
    display: flex;
    flex-direction: column;
    gap: .55rem;
    margin-top: 1rem;
}

.events-cancel-button {
    background: white;
    color: var(--navy);
    border-color: var(--line);
}

.events-admin-list {
    display: grid;
    gap: .65rem;
}

.events-admin-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .8rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
}

.events-admin-item h3 {
    margin: .25rem 0 .4rem;
    font-size: 1.06rem;
}

.events-admin-item p {
    margin: 0;
    color: var(--muted);
    font-size: .9rem;
}

.events-admin-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .65rem;
    font-size: .78rem;
    font-weight: 800;
    color: var(--teal);
}

.events-admin-item-actions {
    display: flex;
    gap: .45rem;
    align-items: stretch;
}

.events-admin-item-actions form {
    margin: 0;
}

.events-delete-button {
    min-height: 42px;
    border: 1px solid #e0b8b8;
    background: #fff3f3;
    color: #8c2626;
    border-radius: 10px;
    padding: .55rem .75rem;
    font: inherit;
    font-size: .82rem;
    font-weight: 850;
    cursor: pointer;
}

@media (max-width: 720px) {
    .events-page-nav {
        top: 126px;
    }

    .event-card-dynamic {
        grid-template-columns: 70px minmax(0, 1fr);
        gap: .8rem;
        align-items: start;
    }

    .event-card-dynamic > .button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .event-date {
        padding: .65rem .4rem;
    }

    .event-date .day {
        font-size: 1.65rem;
    }
}

@media (max-width: 430px) {
    .events-page-nav {
        top: 112px;
    }

    .events-admin-shell {
        width: min(100% - .65rem, 1180px);
        margin-top: .55rem;
    }

    .events-admin-heading,
    .events-items-panel {
        padding: .9rem;
    }
}

@media (min-width: 700px) {
    .events-admin-shell {
        width: min(100% - 2rem, 1180px);
        gap: 1rem;
        margin-top: 1.2rem;
    }

    .events-admin-grid {
        grid-template-columns: .8fr 1.2fr;
        gap: 1rem;
    }

    .events-admin-form-actions {
        flex-direction: row;
        align-items: center;
    }

    .events-admin-item {
        grid-template-columns: minmax(0,1fr) auto;
        align-items: center;
    }
}


/* Podcast Admin edit / delete controls */
.podcast-form-actions{display:flex;flex-direction:column;gap:.55rem;margin-top:1rem}
.podcast-cancel-button{background:#fff;color:var(--navy);border-color:var(--line)}
.podcast-current-file{margin-bottom:.5rem;padding:.6rem .75rem;border-radius:9px;background:var(--teal-soft);color:var(--navy);overflow-wrap:anywhere}
.podcast-admin-list{display:grid;gap:.7rem}
.podcast-admin-item{padding:.9rem 0;border-bottom:1px solid var(--line);display:grid;gap:.7rem}
.podcast-admin-item:last-child{border-bottom:0}
.podcast-admin-item-main{min-width:0}
.podcast-admin-item-main strong,.podcast-admin-item-main span{display:block;overflow-wrap:anywhere}
.podcast-admin-item-main strong{line-height:1.35;color:var(--navy-dark)}
.podcast-admin-item-main span{margin-top:.25rem;color:var(--muted);font-size:.82rem}
.podcast-admin-item-actions{display:flex;gap:.4rem;align-items:stretch}
.podcast-admin-item-actions form{margin:0}
.podcast-delete-button{min-height:42px;padding:.55rem .72rem;border-radius:10px;border:1px solid #e1b4b4;background:#fff1f1;color:#8b2525;font:inherit;font-size:.82rem;font-weight:850;cursor:pointer}
.podcast-delete-button:hover{background:#f8dede}
@media (min-width:700px){.podcast-form-actions{flex-direction:row;align-items:center}.podcast-admin-item{grid-template-columns:minmax(0,1fr) auto;align-items:center}}


/* ===============================================================
   PRAYER REQUEST PAGE
   Inspired by the simple church prayer-card workflow:
   optional identity/contact information + prominent prayer request.
   =============================================================== */

.prayer-page-hero {
    background:
        radial-gradient(circle at 90% 20%, rgba(79,167,182,.16), transparent 28%),
        linear-gradient(135deg, var(--sky), #f9fcfd);
}

.prayer-layout {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
    gap: clamp(1.3rem, 4vw, 3rem);
    align-items: start;
}

.prayer-intro-card {
    position: sticky;
    top: 155px;
    padding: clamp(1.4rem, 4vw, 2rem);
    border-radius: 24px;
    background: var(--navy-dark);
    color: white;
    box-shadow: var(--shadow);
}

.prayer-intro-card h2 {
    color: white;
}

.prayer-intro-card > p:not(.eyebrow):not(.prayer-confidentiality) {
    color: #d8e9ee;
}

.prayer-promise {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: .9rem;
    align-items: start;
    margin: 1.5rem 0;
    padding: 1rem;
    border-radius: 16px;
    background: rgba(255,255,255,.08);
}

.prayer-promise-mark {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--teal);
    color: white;
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 1;
}

.prayer-promise strong {
    display: block;
    margin-bottom: .25rem;
    color: white;
}

.prayer-promise p {
    margin: 0;
    color: #d8e9ee;
    font-size: .92rem;
}

.prayer-confidentiality {
    margin: 0;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(255,255,255,.14);
    color: #a8dce3;
    font-size: .88rem;
}

.prayer-form-card {
    max-width: none;
}

.prayer-form-card h2 {
    margin-bottom: .55rem;
}

.prayer-form-intro {
    color: var(--muted);
    margin-bottom: 1.5rem;
}

.prayer-contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.prayer-email-field {
    grid-column: 1 / -1;
}

.optional-label {
    display: inline-block;
    margin-left: .35rem;
    color: var(--muted);
    font-size: .76rem;
    font-weight: 600;
}

.prayer-request-field {
    margin-top: .35rem;
}

.prayer-request-field textarea {
    min-height: 230px;
    font-size: 1rem;
}

.prayer-submit-button {
    width: 100%;
    min-height: 52px;
    margin-top: .3rem;
}

.prayer-note {
    margin-top: .7rem;
    margin-bottom: 0;
}

.prayer-scripture-block {
    text-align: center;
}

.prayer-scripture-block p:last-child {
    color: var(--muted);
    font-size: 1.05rem;
}

.prayer-thank-you h1 {
    font-size: clamp(2rem, 6vw, 3.6rem);
}

.prayer-thank-actions {
    justify-content: center;
}

.prayer-secondary-button {
    background: transparent;
    color: var(--navy);
}

.prayer-secondary-button:hover {
    color: white;
}

@media (max-width: 900px) {
    .prayer-layout {
        grid-template-columns: 1fr;
    }

    .prayer-intro-card {
        position: static;
    }
}

@media (max-width: 620px) {
    .prayer-contact-grid {
        grid-template-columns: 1fr;
    }

    .prayer-email-field {
        grid-column: auto;
    }

    .prayer-request-field textarea {
        min-height: 190px;
    }

    .prayer-form-card,
    .prayer-intro-card {
        border-radius: 18px;
    }
}


/* Event image upload + display */
.event-card-has-image {
    grid-template-columns: 160px 100px minmax(0,1fr) auto;
}
.event-card-image {
    width:160px;
    height:120px;
    overflow:hidden;
    border-radius:14px;
    background:var(--surface);
}
.event-card-image img {
    width:100%;
    height:100%;
    object-fit:cover;
}
.events-admin-current-image {
    display:grid;
    gap:.7rem;
    padding:.75rem;
    margin-bottom:.65rem;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--surface);
}
.events-admin-current-image img {
    width:min(100%,280px);
    max-height:180px;
    object-fit:cover;
    border-radius:10px;
}
.events-remove-image {
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    font-size:.88rem;
    color:#8c2626;
}
.events-remove-image input {
    width:auto;
    min-height:auto;
}
.events-admin-list-thumb {
    width:90px;
    height:65px;
    object-fit:cover;
    border-radius:9px;
    float:left;
    margin:0 .7rem .45rem 0;
}
@media (max-width:900px) {
    .event-card-has-image {
        grid-template-columns:130px 82px minmax(0,1fr);
    }
    .event-card-has-image > .button {
        grid-column:1/-1;
    }
    .event-card-image {
        width:130px;
        height:100px;
    }
}
@media (max-width:620px) {
    .event-card-has-image {
        grid-template-columns:70px minmax(0,1fr);
    }
    .event-card-has-image .event-card-image {
        grid-column:1/-1;
        width:100%;
        height:210px;
    }
}


/* ===============================================================
   CLICKABLE EVENT IMAGES + EVENT IMAGE VIEWER
   =============================================================== */

.event-image-link {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
}

.event-image-link img {
    transition: transform .25s ease;
}

.event-image-link:hover img,
.event-image-link:focus img {
    transform: scale(1.035);
}

.event-image-overlay {
    position: absolute;
    left: .55rem;
    right: .55rem;
    bottom: .55rem;
    display: block;
    padding: .45rem .65rem;
    border-radius: 8px;
    background: rgba(7,31,47,.82);
    color: #fff;
    text-align: center;
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .02em;
    opacity: 0;
    transform: translateY(6px);
    transition: .2s ease;
}

.event-image-link:hover .event-image-overlay,
.event-image-link:focus .event-image-overlay {
    opacity: 1;
    transform: translateY(0);
}

.event-image-viewer-wrap {
    max-width: 1100px;
}

.event-image-viewer-card {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: clamp(.5rem, 2vw, 1.25rem);
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.event-image-viewer-card img {
    max-width: 100%;
    max-height: 78vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
}

.event-image-viewer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1.2rem;
    justify-content: center;
}

.event-image-open-original {
    background: transparent;
    color: var(--navy);
    border-color: var(--navy);
}

.event-image-open-original:hover {
    color: white;
}

@media (max-width: 620px) {
    .event-image-overlay {
        opacity: 1;
        transform: none;
        font-size: .74rem;
    }

    .event-image-viewer-card {
        padding: .4rem;
        border-radius: 14px;
    }

    .event-image-viewer-card img {
        border-radius: 10px;
    }

    .event-image-viewer-actions {
        flex-direction: column;
    }

    .event-image-viewer-actions .button {
        width: 100%;
    }
}


/* ===============================================================
   UNIFIED ADMIN PORTAL + ROLE-BASED ACCESS
   =============================================================== */

.admin-user-badge {
    display:inline-flex; align-items:center; min-height:42px;
    padding:.55rem .75rem; border-radius:10px;
    background:var(--teal-soft); color:var(--navy);
    font-size:.82rem; font-weight:850;
}

.unified-admin-shell {
    width:min(100% - 1rem,1120px);
    margin:.8rem auto 2rem;
    display:grid;
    gap:.85rem;
}

.unified-admin-welcome p:last-child { margin-bottom:0; color:var(--muted); }

.unified-admin-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:.85rem;
}

.unified-admin-card {
    min-width:0;
    display:grid;
    grid-template-columns:54px minmax(0,1fr) auto;
    gap:1rem;
    align-items:center;
    padding:1.2rem;
    border:1px solid var(--line);
    border-radius:18px;
    background:white;
    box-shadow:0 8px 24px rgba(10,42,60,.06);
    color:var(--ink);
    transition:.2s ease;
}

.unified-admin-card:hover {
    transform:translateY(-2px);
    border-color:var(--teal);
    color:var(--ink);
}

.unified-admin-card h2 { margin:0 0 .25rem; font-size:1.25rem; }
.unified-admin-card p { margin:0; color:var(--muted); font-size:.92rem; }

.unified-admin-icon {
    width:54px; height:54px; display:grid; place-items:center;
    border-radius:16px; background:var(--navy); color:white;
    font-size:1.2rem; font-weight:900;
}

.unified-admin-arrow { font-size:1.5rem; color:var(--teal); font-weight:900; }

.users-admin-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:.85rem;
}

.admin-permission-box {
    margin:1rem 0;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:14px;
}

.admin-permission-box legend {
    padding:0 .4rem;
    font-weight:850;
    color:var(--navy);
}

.admin-check-row {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:.7rem;
    align-items:start;
    padding:.65rem 0;
}

.admin-check-row input {
    width:20px;
    height:20px;
    min-height:auto;
    margin-top:.1rem;
}

.admin-check-row span { display:grid; gap:.15rem; }
.admin-check-row small { color:var(--muted); font-weight:400; }
.admin-active-row { margin:.4rem 0 .9rem; }

.admin-users-list { display:grid; gap:.7rem; }

.admin-user-item {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:.8rem;
    padding:1rem;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--surface);
}

.admin-user-item h3 { margin:0 0 .2rem; font-size:1.05rem; }
.admin-user-item p { margin:0; color:var(--muted); font-size:.86rem; }

.admin-user-permissions {
    display:flex;
    flex-wrap:wrap;
    gap:.35rem;
    margin-top:.55rem;
}

.admin-user-permissions span {
    padding:.28rem .5rem;
    border-radius:999px;
    background:var(--teal-soft);
    color:var(--navy);
    font-size:.72rem;
    font-weight:850;
}

.admin-user-permissions span.inactive {
    background:#fff0f0;
    color:#8c2626;
}

.admin-user-actions {
    display:flex;
    gap:.4rem;
    align-items:stretch;
}

.admin-user-actions form { margin:0; }

@media (min-width:700px) {
    .unified-admin-shell {
        width:min(100% - 2rem,1120px);
        margin-top:1.3rem;
        gap:1rem;
    }

    .unified-admin-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .users-admin-grid {
        grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
        gap:1rem;
    }

    .admin-user-item {
        grid-template-columns:minmax(0,1fr) auto;
        align-items:center;
    }
}
