/* ==========================================================================
   INNER PAGES — banners, breadcrumb, content layout
   ========================================================================== */

.page-banner {
  background: linear-gradient(160deg, var(--color-royal-blue) 0%, var(--color-royal-blue-dark) 100%);
  color: var(--color-white);
  padding-block: var(--space-5);
}
.page-banner h1 { color: var(--color-white); }
.page-banner-lead {
  color: #DCE3EE;
  font-size: var(--text-lg);
  max-width: 60ch;
  margin-bottom: var(--space-3);
}

.breadcrumb {
  padding-block: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text-muted);
}
.breadcrumb a { color: var(--color-text-muted); }

.content-section h2 { margin-top: var(--space-2); }
.content-section h2:first-child { margin-top: 0; }

.list-plain {
  list-style: none;
  margin: 0; padding: 0;
}
.list-plain li {
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--border-subtle);
}
.list-plain li:last-child { border-bottom: none; }

.tag {
  display: inline-block;
  background: var(--surface-alt);
  color: var(--color-wine);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.25em 0.7em;
  border-radius: var(--radius-pill);
  margin-bottom: var(--space-1);
}

.legacy-note {
  background: #FFF6E9;
  border: 1px solid var(--color-gold);
  border-radius: var(--radius-md);
  padding: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text);
}

.form-grid {
  display: grid;
  gap: var(--space-2);
  max-width: 560px;
}
.form-grid label {
  font-weight: 600;
  font-size: var(--text-sm);
  color: var(--color-charcoal);
  display: block;
  margin-bottom: 0.3em;
}
.form-grid input,
.form-grid select,
.form-grid textarea {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  font: inherit;
}
.form-grid textarea { resize: vertical; min-height: 120px; }
.form-grid [aria-invalid="true"] {
  border-color: var(--color-warm-orange);
  outline: 2px solid transparent;
}
.form-status {
  font-size: var(--text-sm);
  color: var(--color-wine);
  min-height: 1.2em;
}

.audio-player {
  background: var(--color-charcoal);
  color: var(--color-white);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.schedule-table {
  width: 100%;
  border-collapse: collapse;
}
.table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.schedule-table th, .schedule-table td {
  text-align: left;
  padding: var(--space-1) var(--space-2);
  border-bottom: 1px solid var(--border-subtle);
}
.schedule-table th { color: var(--color-wine); font-size: var(--text-sm); }

.resource-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-3);
}

.giving-tier {
  border: 2px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: var(--space-3);
  text-align: center;
}
.giving-tier.featured { border-color: var(--color-gold); box-shadow: var(--shadow-raised); }

.map-placeholder {
  aspect-ratio: 16/9;
  background: var(--surface-alt);
  border: 1px dashed var(--border-subtle);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-muted);
  text-align: center;
  padding: var(--space-2);
}

/* --- Utility classes: replace the most-repeated inline styles --- */
.u-text-center { text-align: center; }
.u-mt-2 { margin-top: var(--space-2); }
.u-mt-3 { margin-top: var(--space-3); }
.u-mb-2 { margin-bottom: var(--space-2); }
.u-mb-3 { margin-bottom: var(--space-3); }
.u-max-content { max-width: 640px; margin-left: auto; margin-right: auto; }
.u-max-prose { max-width: 760px; margin-left: auto; margin-right: auto; }
.u-muted { color: var(--color-text-muted); }
.u-on-dark { color: #DCE3EE; }
.u-gold-eyebrow { color: var(--color-gold-light); }


/* ==========================================================
   PREMIUM INNER-PAGE SYSTEM — 2026-10-06
   ========================================================== */
body {
  background:linear-gradient(180deg,#fbfaf7 0%,#fff 24rem);
}
.site-header {
  border-bottom:1px solid rgba(16,43,87,.08);
  box-shadow:0 10px 30px rgba(16,43,87,.08);
}
.site-header .header-inner { min-height:78px; }
.brand { text-decoration:none!important; }
.brand img {
  width:60px;height:60px;object-fit:contain;
  filter:drop-shadow(0 5px 12px rgba(20,39,77,.12));
}
.brand-subline {
  display:block;
  margin-top:.24rem;
  font-size:.62rem;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#5e6e86;
}
.main-nav a {
  position:relative;
  border-radius:9px;
  padding:.55rem .45rem;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.main-nav a:hover {
  background:#f7f3ea;
  transform:translateY(-1px);
}
.main-nav a[aria-current="page"] {
  border-bottom:0;
  background:#f7f3ea;
}
.main-nav a[aria-current="page"]::after {
  content:"";
  position:absolute;
  left:.45rem;right:.45rem;bottom:.2rem;
  height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--color-wine),var(--color-gold));
}
.nav-community-gateway {
  border:1px solid rgba(122,27,43,.18);
  border-radius:10px!important;
  padding:.55rem .7rem!important;
  background:linear-gradient(135deg,#fff7da,#fff);
  color:#6f162b!important;
  font-weight:800!important;
}
.nav-community-gateway:hover {
  background:#ffefae!important;
  border-color:#d29d19;
}
.premium-flags {
  align-items:center;
  gap:4px!important;
}
.premium-flags span {
  font-size:1rem;
  line-height:1;
  filter:saturate(.95);
}
.page-banner {
  position:relative;
  overflow:hidden;
  padding-block:clamp(4.25rem,8vw,7rem);
  background:
    radial-gradient(circle at 12% 18%,rgba(245,190,54,.18),transparent 24rem),
    radial-gradient(circle at 88% 80%,rgba(122,27,43,.26),transparent 28rem),
    linear-gradient(135deg,#102b57 0%,#173b72 55%,#5f172b 145%);
}
.page-banner::before {
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:46px 46px;
  pointer-events:none;
}
.page-banner .container { position:relative; z-index:1; max-width:1120px; }
.page-banner .eyebrow {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.5rem .78rem;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,221,121,.26);
  color:#ffdf7c!important;
}
.page-banner .eyebrow::before {
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:#ffd75f;
  box-shadow:0 0 14px rgba(255,215,95,.8);
}
.page-banner h1 {
  max-width:900px;
  font-size:clamp(2.8rem,6vw,5.5rem);
  line-height:.98;
  letter-spacing:-.045em;
  margin:.9rem 0 1rem;
}
.page-banner-lead {
  max-width:70ch;
  font-size:clamp(1rem,1.7vw,1.22rem);
  line-height:1.75;
}
.page-banner .hero-ctas {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  margin-top:1.35rem;
}
.page-banner .btn {
  min-height:50px;
  border-radius:13px;
  font-weight:800;
}
.breadcrumb {
  display:flex;
  align-items:center;
  gap:.55rem;
  min-height:48px;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.02em;
}
.breadcrumb a:hover { color:var(--color-wine); text-decoration:none; }

.content-section {
  padding-block:clamp(4rem,7vw,6.5rem);
}
.content-section > .container > h2,
.content-section .container > h2 {
  font-size:clamp(2rem,4vw,3.6rem);
  letter-spacing:-.035em;
}
.content-section p {
  line-height:1.75;
}
.content-section .card,
.resource-grid > *,
.giving-tier {
  border:1px solid rgba(20,52,96,.10);
  border-radius:20px;
  box-shadow:0 12px 32px rgba(23,45,79,.07);
}
.content-section .card {
  padding:clamp(1.25rem,2.5vw,2rem);
}
.content-section .grid-2,
.content-section .grid-3,
.resource-grid {
  gap:1.2rem;
}
.list-plain li {
  padding:1rem 0;
}
.list-plain li::marker { color:var(--color-wine); }
.form-grid {
  max-width:none;
  padding:clamp(1.2rem,2.5vw,2rem);
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(20,52,96,.10);
  box-shadow:0 14px 38px rgba(23,45,79,.08);
}
.form-grid input,
.form-grid select,
.form-grid textarea {
  min-height:48px;
  padding:.85rem .9rem;
  border-radius:11px;
  border-color:rgba(20,52,96,.14);
  background:#fbfcfe;
}
.form-grid textarea { min-height:140px; }
.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus {
  border-color:var(--color-royal-blue);
  box-shadow:0 0 0 3px rgba(27,58,107,.08);
  outline:none;
}
.tag {
  padding:.4em .72em;
  background:#f8f2e6;
  border:1px solid rgba(122,27,43,.08);
}
.giving-tier {
  transition:transform .2s ease,box-shadow .2s ease;
}
.giving-tier:hover {
  transform:translateY(-4px);
  box-shadow:0 20px 44px rgba(23,45,79,.12);
}
.giving-tier.featured {
  border-color:#d6aa35;
  background:linear-gradient(180deg,#fffdf4,#fff);
}
.schedule-table {
  border:1px solid rgba(20,52,96,.08);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}
.schedule-table th {
  background:#f4f7fb;
  color:#17396c;
}
.schedule-table th,.schedule-table td {
  padding:.9rem 1rem;
}
.site-footer {
  background:
    radial-gradient(circle at 15% 5%,rgba(255,213,95,.08),transparent 16rem),
    linear-gradient(135deg,#151d2b,#0d1625);
}
.footer-grid { gap:clamp(2rem,4vw,4rem); }

@media(max-width:1200px){
  .main-nav {
    padding-top:5.5rem!important;
    box-shadow:-24px 0 60px rgba(9,24,49,.16);
  }
  .main-nav a {
    font-size:1rem!important;
    padding:.8rem .85rem!important;
  }
  .nav-community-gateway {
    margin-top:.4rem;
    padding:.95rem!important;
    background:linear-gradient(135deg,#fff3bd,#fffaf0)!important;
  }
}
@media(max-width:900px){
  .site-header .header-inner{min-height:70px}
  .brand img{width:52px;height:52px}
  .brand-subline{display:none}
  .premium-flags span:nth-child(n+7){display:none}
}
@media(max-width:640px){
  .premium-flags{display:none!important}
  .page-banner{padding-block:3rem 3.5rem}
  .page-banner h1{font-size:clamp(2.5rem,13vw,4rem)}
  .content-section{padding-block:3rem}
}
@media(prefers-reduced-motion:reduce){
  .main-nav a,.giving-tier{transition:none!important;transform:none!important}
}


/* About page premium storytelling */
.about-identity-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-bottom:clamp(2.5rem,5vw,4.5rem);
}
.about-identity-card {
  padding:1.35rem;
  border-radius:20px;
  background:#fff;
  border:1px solid rgba(20,52,96,.10);
  box-shadow:0 12px 30px rgba(23,45,79,.07);
}
.about-identity-card span {
  display:inline-grid;
  place-items:center;
  width:36px;height:36px;
  border-radius:11px;
  margin-bottom:1rem;
  background:#eef3fa;
  color:#17396c;
  font-weight:900;
  font-size:.74rem;
}
.about-identity-card strong {
  display:block;
  margin-bottom:.55rem;
  color:#6f162b;
  font-size:.78rem;
  letter-spacing:.08em;
}
.about-identity-card p {
  margin:0;
  font-size:.92rem;
  line-height:1.6;
}
.about-story-block {
  max-width:900px;
  margin:0 auto;
}
.about-story-block h2 {
  font-size:clamp(2.3rem,4vw,3.8rem);
  letter-spacing:-.035em;
}
.about-section-kicker {
  display:inline-block;
  color:#7a1b2b;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.14em;
}
.about-mission-grid .card:first-child {
  background:linear-gradient(180deg,#f8fbff,#fff);
}
.about-mission-grid .card:last-child {
  background:linear-gradient(180deg,#fffaf0,#fff);
}
.about-section-heading {
  max-width:760px;
  margin:0 auto clamp(2rem,4vw,3.2rem);
  text-align:center;
}
.about-section-heading h2 {
  font-size:clamp(2.3rem,4.5vw,4rem);
  letter-spacing:-.04em;
  margin:.45rem 0 .7rem;
}
.about-section-heading p {
  max-width:62ch;
  margin:0 auto;
}
@media(max-width:1000px){
  .about-identity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .about-identity-grid{grid-template-columns:1fr}
  .about-section-heading{text-align:left}
}