/* Kingdom Revival Ministries — inner pages: base elements, page layout, donation card and band.
   Design tokens and the components shared with the home page are in theme-global.css. */
:root {
  color-scheme: light;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--white);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  scrollbar-color: var(--navy) #E8ECF6;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); line-height: var(--line-height-body); overflow-x: hidden; }
img { max-width: 100%; }
a { color: inherit; }
h1, h2, h3, h4 { color: var(--navy); font-family: var(--font-heading); line-height: var(--line-height-heading); letter-spacing: var(--letter-spacing-heading); }
.wrap { width: min(var(--wrap), 100% - var(--container-gutter)); margin: 0 auto; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }
.skip-link:focus { top: 12px; }

/* Keyboard focus */
.button:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.eyebrow { margin: 0 0 12px; color: var(--red); font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.section { padding: var(--space-section) 0; }
.section-soft { background: var(--soft); }
.section-head { max-width: 720px; margin-bottom: clamp(32px, 4vw, 48px); }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head h2 { margin: 0; font-size: var(--font-size-h2); font-weight: 800; }
.section-head p:not(.eyebrow) { margin: 16px 0 0; color: var(--muted); font-size: 17px; line-height: 1.75; }

/* Navigation: inner-page differences from the shared menu */
.menu > li > a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--red); }
.submenu { position: absolute; top: 100%; left: -14px; z-index: 60; display: none; width: 250px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); box-shadow: var(--shadow); }
.submenu .sub-toggle > .chev, .submenu .sub-toggle[aria-expanded="true"] > .chev { transform: rotate(-90deg); }
@media (max-width: 900px) {
  .site-nav .menu { position: absolute; top: 100%; left: 0; right: 0; z-index: 60; display: none; flex-direction: column; align-items: stretch; gap: 0; max-height: calc(100vh - 90px); overflow-y: auto; padding: 8px 20px 16px; border-bottom: 1px solid var(--line); background: var(--white); box-shadow: 0 18px 30px rgba(12,28,79,.1); }
  .menu > li > a[aria-current="page"] { box-shadow: none; }
  .submenu, .submenu .submenu, .submenu .submenu.open-left, .submenu.align-right { position: static; width: auto; margin: 0 0 10px; padding: 4px 0 4px 12px; border: 0; border-left: 2px solid #E8ECF6; border-radius: 0; box-shadow: none; }
  .submenu .submenu { margin: 2px 0 6px 12px; }
  .submenu .sub-toggle > .chev { transform: none; }
  .submenu .sub-toggle[aria-expanded="true"] > .chev { transform: rotate(180deg); }
}

/* Page hero */
.page-hero { position: relative; overflow: hidden; background: var(--navy-deep) center / cover no-repeat; color: var(--white); }
.page-hero::before { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(8,16,48,.92) 0%, rgba(8,16,48,.72) 55%, rgba(8,16,48,.45) 100%); content: ""; }
.page-hero .wrap { position: relative; padding: clamp(72px, 10vw, 128px) 0 clamp(64px, 8vw, 104px); }
.page-hero .eyebrow { color: var(--orange); }
.page-hero h1 { max-width: 820px; margin: 0; color: var(--white); font-size: var(--font-size-h1); font-weight: 800; line-height: 1.08; letter-spacing: -.03em; }
.page-hero h1 em { color: var(--orange); font-style: normal; }
.page-hero p.lead { max-width: 640px; margin: 20px 0 0; color: #E4E8F3; font-size: clamp(16px, 1.6vw, 19px); line-height: 1.75; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; padding: 0; list-style: none; color: #C8D0E6; font-size: 14px; }
.breadcrumb li + li::before { margin-right: 8px; content: "/"; opacity: .6; }
.breadcrumb a { color: var(--white); text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

/* Donation card (filled in by site.js) */
.give-card { display: grid; gap: 16px; padding: 24px; border-radius: 10px; background: var(--white); color: var(--ink); box-shadow: 0 16px 40px rgba(12,28,79,.16); }
.give-card h3 { margin: 0; font-size: var(--font-size-h3); }
.give-card .give-intro { margin: -6px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.give-card fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.give-frequency { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px !important; border-radius: 6px; background: var(--soft); }
.give-frequency input, .give-amounts input { position: absolute; opacity: 0; pointer-events: none; }
.give-frequency span { display: block; padding: 9px; border-radius: 4px; color: var(--muted); font-size: 14px; font-weight: 700; text-align: center; cursor: pointer; }
.give-frequency input:checked + span { background: var(--navy); color: var(--white); }
.give-amounts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.give-amounts legend { grid-column: 1 / -1; margin-bottom: 10px; color: var(--navy); font-size: 14px; font-weight: 800; }
.give-amounts span { display: flex; min-height: 44px; align-items: center; justify-content: center; border: 2px solid #DDE3F0; border-radius: 4px; color: var(--navy); font-weight: 700; cursor: pointer; transition: border-color .15s ease; }
.give-amounts span:hover { border-color: var(--navy); }
.give-amounts input:checked + span { border-color: var(--red); background: var(--red); color: var(--white); }
.give-frequency input:focus-visible + span, .give-amounts input:focus-visible + span { outline: 3px solid var(--orange); outline-offset: 2px; }
.give-custom { display: grid; gap: 6px; color: var(--navy); font-size: 14px; font-weight: 700; }
.give-custom input { min-height: 44px; padding: 10px 12px; border: 2px solid #DDE3F0; border-radius: 4px; font: inherit; font-weight: 600; }
.give-custom input:focus { border-color: var(--navy); outline: none; }
.give-submit { width: 100%; font-weight: 800; }
.give-note { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; text-align: center; }

/* Donation band */
.give-band { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: clamp(28px, 5vw, 64px); align-items: center; padding: clamp(28px, 5vw, 56px); border-radius: var(--radius); background: var(--navy) center / cover no-repeat; color: #D6DDF0; position: relative; overflow: hidden; }
.give-band::before { position: absolute; inset: 0; background: linear-gradient(110deg, rgba(8,16,48,.95), rgba(12,28,79,.82)); content: ""; }
.give-band > * { position: relative; }
.give-band .eyebrow { color: #FF9C9E; }
.give-band h2 { margin: 0; color: var(--white); font-size: clamp(28px, 3.6vw, 40px); font-weight: 800; }
.give-band p:not(.eyebrow) { margin: 16px 0 0; font-size: 17px; line-height: 1.75; }
.give-band ul { display: grid; gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }
.give-band li { display: flex; gap: 10px; align-items: flex-start; color: #E4E8F3; }
.give-band li svg { flex: none; margin-top: 3px; color: var(--orange); }

/* Responsive */
@media (max-width: 960px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .give-band { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .wrap { width: min(var(--wrap), 100% - 32px); }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .brand img { width: 52px; height: 52px; }
  .brand-text strong { font-size: 17px; }
  .header-inner { min-height: 72px; }
  .topbar-contacts .topbar-email { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}