:root {
  --ink: #071317;
  --ink-soft: #10272d;
  --teal: #2da2ba;
  --teal-bright: #42bfd4;
  --paper: #f3f5f4;
  --white: #fff;
  --muted: #6d7a7d;
  --line: rgba(7, 19, 23, .13);
  --max: 1200px;
  --pad: clamp(1.25rem, 4vw, 4rem);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "DM Sans", sans-serif;
  font-size: 1rem;
  line-height: 1.65;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }
.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;
}
.skip-link {
  position: fixed;
  left: 1rem;
  top: -5rem;
  z-index: 100;
  background: var(--white);
  padding: .75rem 1rem;
  color: var(--ink);
}
.skip-link:focus { top: 1rem; }

.site-header {
  position: fixed;
  z-index: 50;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 88px;
  padding: .75rem var(--pad);
  color: var(--white);
  transition: background .25s ease, min-height .25s ease, box-shadow .25s ease;
}
.site-header.scrolled {
  min-height: 72px;
  background: rgba(7, 19, 23, .96);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
}
.brand { display: inline-flex; align-items: center; }
.brand img { width: 62px; height: 68px; object-fit: contain; }
.main-nav { display: flex; align-items: center; gap: clamp(1.25rem, 2.4vw, 2.75rem); }
.main-nav a {
  text-decoration: none;
  font-weight: 600;
  font-size: .95rem;
  letter-spacing: .02em;
  position: relative;
}
.main-nav a:not(.nav-give)::after {
  content: "";
  position: absolute;
  height: 2px;
  left: 0;
  right: 100%;
  bottom: -.4rem;
  background: var(--teal-bright);
  transition: right .2s ease;
}
.main-nav a:hover::after, .main-nav a:focus-visible::after { right: 0; }
.nav-give {
  padding: .7rem 1.2rem;
  border: 1px solid rgba(255, 255, 255, .65);
}
.nav-give:hover, .nav-give:focus-visible { background: var(--white); color: var(--ink); }
.menu-toggle { display: none; }

.hero {
  min-height: 100svh;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 9rem var(--pad) 4.5rem;
  color: var(--white);
  background:
    radial-gradient(circle at 82% 18%, rgba(66, 191, 212, .2), transparent 32%),
    linear-gradient(145deg, #071317 0%, #10272d 58%, #0b3d47 100%);
}
.hero-message {
  width: min(1120px, calc(100% - 4rem));
  margin: 0 auto clamp(2rem, 5vw, 4rem);
}
.hero-message h1 {
  max-width: 880px;
  margin: 0;
  font-family: "Libre Franklin", sans-serif;
  font-size: clamp(3rem, 7.5vw, 7rem);
  line-height: .9;
  letter-spacing: -.06em;
}
.hero-message p {
  max-width: 640px;
  margin: 1.4rem 0 0;
  color: rgba(255,255,255,.82);
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height: 1.45;
}
.hero-service-card {
  width: min(1120px, calc(100% - 4rem));
  margin: 0 auto;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(255, 255, 255, .55);
}
.hero-service-card > div:first-child { display: grid; }
.hero-service-card strong {
  margin: .1rem 0;
  font-family: "Libre Franklin", sans-serif;
  font-size: clamp(2.4rem, 6vw, 5.5rem);
  line-height: 1;
  letter-spacing: -.05em;
}
.eyebrow {
  display: block;
  margin-bottom: .65rem;
  font-size: .75rem;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.eyebrow.teal { color: #167f96; }
.hero-actions, .visit-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.button {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .8rem 1.3rem;
  border: 1px solid transparent;
  text-decoration: none;
  font-weight: 700;
  line-height: 1.2;
  transition: transform .18s ease, background .18s ease, color .18s ease;
}
.button:hover, .button:focus-visible { transform: translateY(-2px); }
.button svg { width: 1rem; fill: currentColor; }
.button-primary { background: var(--teal); color: var(--white); }
.button-primary:hover, .button-primary:focus-visible { background: var(--teal-bright); color: var(--ink); }
.button-ghost { border-color: rgba(255,255,255,.6); color: var(--white); }
.button-ghost:hover, .button-ghost:focus-visible { background: var(--white); color: var(--ink); }
.button-dark { background: var(--ink); color: var(--white); }
.button-outline-dark { border-color: var(--ink); color: var(--ink); }
.button-outline-dark:hover, .button-outline-dark:focus-visible { background: var(--ink); color: var(--white); }
.button-light { background: var(--white); color: var(--ink); }
.hero-scroll {
  position: absolute;
  right: var(--pad);
  bottom: 1.3rem;
  display: flex;
  gap: .5rem;
  align-items: center;
  text-decoration: none;
  color: rgba(255,255,255,.8);
  font-size: .82rem;
  font-weight: 600;
}
.hero-scroll svg { width: 1.1rem; fill: none; stroke: currentColor; stroke-width: 2; }

.section { padding: clamp(5rem, 10vw, 9rem) var(--pad); }
.welcome {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(3rem, 9vw, 9rem);
  align-items: start;
}
h2 {
  margin: 0;
  font-family: "Libre Franklin", sans-serif;
  font-size: clamp(2.6rem, 6vw, 5.5rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.welcome-copy { padding-top: 1.7rem; }
.lead { font-size: clamp(1.25rem, 2.3vw, 1.75rem); line-height: 1.45; }
.welcome-copy p:not(.lead), .pastors-copy p:not(.lead), .ministries-heading p { color: var(--muted); max-width: 42rem; }
.text-link {
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  margin-top: 1rem;
  color: #126e82;
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}
.text-link span { transition: transform .18s ease; }
.text-link:hover span, .text-link:focus-visible span { transform: translateX(.3rem); }

.pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  color: var(--white);
  background: var(--ink);
}
.pillar {
  min-height: 380px;
  padding: clamp(2.2rem, 5vw, 5rem);
  display: flex;
  flex-direction: column;
  justify-content: end;
  border-right: 1px solid rgba(255,255,255,.14);
}
.pillar:nth-child(2) { background: var(--teal); }
.pillar-number { margin-bottom: auto; font-size: .8rem; font-weight: 800; opacity: .7; }
.pillar h3 { margin: 0 0 .5rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(2rem, 4vw, 3.8rem); letter-spacing: -.05em; }
.pillar p { margin: 0; max-width: 19rem; color: rgba(255,255,255,.72); }
.pillar:nth-child(2) p { color: rgba(7,19,23,.76); }

.visit {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 0;
  max-width: 1320px;
  margin: 0 auto;
}
.visit-card { background: var(--white); padding: clamp(2rem, 6vw, 6rem); }
.visit-card h2 { font-size: clamp(2.5rem, 5vw, 4.8rem); }
.visit-card p { max-width: 40rem; margin: 2rem 0; color: var(--muted); font-size: 1.08rem; }
.visit-details { padding: clamp(2rem, 5vw, 4.5rem); background: var(--ink-soft); color: var(--white); }
.detail-row { display: grid; grid-template-columns: 38px 1fr; gap: 1rem; padding: 1.7rem 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.detail-row:first-child { padding-top: 0; }
.detail-row:last-child { border-bottom: 0; }
.detail-row svg { width: 1.55rem; fill: none; stroke: var(--teal-bright); stroke-width: 1.7; }
.detail-row div { display: grid; gap: .2rem; }
.detail-row span { color: rgba(255,255,255,.58); font-size: .82rem; text-transform: uppercase; letter-spacing: .1em; }
.detail-row strong { font-size: 1.15rem; line-height: 1.4; }
.detail-row small { color: rgba(255,255,255,.62); line-height: 1.4; }

.first-visit { max-width: var(--max); margin: 0 auto; padding-top: 2rem; }
.first-visit-heading { max-width: 780px; }
.first-visit-heading h2 { font-size: clamp(2.5rem, 5vw, 4.8rem); }
.first-visit-heading p { margin: 1.5rem 0 0; color: var(--muted); font-size: 1.08rem; }
.expect-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 3rem; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.expect-card { min-height: 240px; padding: clamp(1.6rem, 3vw, 2.5rem); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.expect-card > span { color: #167f96; font-size: .76rem; font-weight: 800; }
.expect-card h3 { margin: 3.5rem 0 .5rem; font-family: "Libre Franklin", sans-serif; font-size: 1.6rem; letter-spacing: -.035em; }
.expect-card p { margin: 0; color: var(--muted); }

.watch { max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: 1.2fr .8fr; padding-top: 0; }
.watch-copy { padding: clamp(2.5rem, 6vw, 6rem); color: var(--white); background: var(--teal); }
.watch-copy h2 { max-width: 760px; font-size: clamp(2.8rem, 5.5vw, 5rem); }
.watch-copy p { max-width: 620px; margin: 1.5rem 0 2rem; color: rgba(7,19,23,.74); font-size: 1.08rem; }
.watch-note { display: flex; flex-direction: column; justify-content: center; padding: clamp(2.5rem, 6vw, 6rem); color: var(--white); background: var(--ink); }
.watch-note span { color: var(--teal-bright); font-size: .8rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.watch-note strong { font-family: "Libre Franklin", sans-serif; font-size: clamp(4rem, 9vw, 8rem); line-height: .95; letter-spacing: -.07em; }
.watch-note small { font-size: 1.25rem; color: rgba(255,255,255,.62); }

.ministries { background: var(--white); }
.ministries-heading {
  max-width: var(--max);
  margin: 0 auto clamp(3rem, 6vw, 5rem);
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 5rem;
}
.ministries-heading .eyebrow { grid-column: 1 / -1; }
.ministries-heading p { align-self: end; margin: 0 0 .4rem; }
.ministry-grid { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.ministry-card { min-height: 280px; padding: clamp(1.6rem, 3vw, 2.7rem); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; }
.ministry-card > span { color: #167f96; font-size: .76rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ministry-card h3 { margin: auto 0 .6rem; font-family: "Libre Franklin", sans-serif; font-size: 1.8rem; letter-spacing: -.035em; }
.ministry-card p { margin: 0; color: var(--muted); line-height: 1.5; }
.ministry-card a { margin-top: 1.2rem; color: inherit; font-weight: 800; text-decoration: none; }
.ministry-card.featured { background: var(--teal); color: var(--ink); }
.ministry-card.featured > span, .ministry-card.featured p { color: rgba(7,19,23,.72); }

.youth { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 8vw, 8rem); }
.youth-intro { position: sticky; top: 110px; align-self: start; }
.youth-intro h2 { font-size: clamp(3rem, 6vw, 5.5rem); }
.youth-intro .lead { margin-bottom: 1rem; }
.youth-intro p:not(.lead) { color: var(--muted); }
.youth-intro .button { margin-top: 1rem; }
.youth-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 190px 190px;
  gap: .65rem;
  margin: 2rem 0 1.25rem;
}
.youth-photo { margin: 0; overflow: hidden; background: var(--ink-soft); }
.youth-photo-wide { grid-column: 1 / -1; }
.youth-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.youth-photo-wide img { object-position: center 46%; }
.youth-photo:last-child img { object-position: center 28%; }
.youth-photo:hover img { transform: scale(1.025); }
.youth-details { border-top: 1px solid var(--line); }
.youth-panel { padding: 2.5rem 0; border-bottom: 1px solid var(--line); }
.youth-panel h3 { margin: 0 0 1rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.12; letter-spacing: -.04em; }
.youth-panel p, .youth-panel li { color: var(--muted); }
.youth-panel ul { margin: 0; padding-left: 1.25rem; }
.youth-panel li + li { margin-top: .9rem; }

.pastors { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 8vw, 8rem); align-items: center; }
.pastors-photo { position: relative; }
.pastors-photo::before { content: ""; position: absolute; inset: -1rem 1rem 1rem -1rem; border: 2px solid var(--teal); z-index: -1; }
.pastors-photo img { aspect-ratio: 4/5; width: 100%; object-fit: cover; object-position: center top; filter: saturate(.88); }
.pastors-copy h2 { font-size: clamp(2.5rem, 5vw, 4.8rem); }

.cta { min-height: 580px; display: grid; place-items: center; padding: 5rem var(--pad); text-align: center; color: var(--white); background: radial-gradient(circle at 20% 0%, rgba(66,191,212,.24), transparent 35%), linear-gradient(135deg, #0a1f24, #071317 70%); }
.cta-content { max-width: 800px; }
.cta h2 { margin: 0 auto 1.5rem; }
.cta p { max-width: 590px; margin: 0 auto 2rem; color: rgba(255,255,255,.7); font-size: 1.1rem; }

.fundraiser-hero {
  min-height: 78svh;
  display: grid;
  align-items: end;
  padding: 11rem var(--pad) clamp(4.5rem, 9vw, 8rem);
  color: var(--white);
  background:
    radial-gradient(circle at 82% 20%, rgba(66,191,212,.24), transparent 30%),
    linear-gradient(145deg, #071317 0%, #10272d 58%, #0b3d47 100%);
}
.fundraiser-hero-inner {
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(2rem, 7vw, 7rem);
  align-items: end;
}
.fundraiser-hero h1 {
  max-width: 820px;
  margin: 0;
  font-family: "Libre Franklin", sans-serif;
  font-size: clamp(3.4rem, 8vw, 7.5rem);
  line-height: .9;
  letter-spacing: -.065em;
}
.fundraiser-hero-copy { max-width: 680px; margin: 1.5rem 0 0; color: rgba(255,255,255,.78); font-size: clamp(1.05rem, 2vw, 1.35rem); line-height: 1.5; }
.fundraiser-goal {
  min-width: 250px;
  padding: 2rem;
  border: 1px solid rgba(255,255,255,.3);
  background: rgba(7,19,23,.42);
  backdrop-filter: blur(8px);
}
.fundraiser-goal span { display: block; color: var(--teal-bright); font-size: .75rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.fundraiser-goal strong { display: block; margin: .4rem 0; font-family: "Libre Franklin", sans-serif; font-size: clamp(3.2rem, 6vw, 5rem); line-height: 1; letter-spacing: -.06em; }
.fundraiser-goal small { color: rgba(255,255,255,.68); font-size: .95rem; }
.fundraiser-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.fundraiser-main { background: var(--paper); }
.fundraiser-impact {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: clamp(3rem, 8vw, 8rem);
  align-items: start;
}
.fundraiser-story h2 { font-size: clamp(2.8rem, 6vw, 5.4rem); }
.fundraiser-story .lead { margin-bottom: 1.25rem; }
.fundraiser-story p:not(.lead) { color: var(--muted); }
.impact-list { border-top: 1px solid var(--line); }
.impact-item { padding: 2rem 0; border-bottom: 1px solid var(--line); }
.impact-item span { color: #167f96; font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.impact-item h3 { margin: .55rem 0 .6rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.12; letter-spacing: -.04em; }
.impact-item p { margin: 0; color: var(--muted); }
.giving-section { padding: clamp(5rem, 10vw, 9rem) var(--pad); color: var(--white); background: var(--ink); }
.giving-inner { max-width: var(--max); margin: 0 auto; }
.giving-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: end; margin-bottom: 3rem; }
.giving-heading h2 { max-width: 700px; }
.giving-heading p { max-width: 520px; margin: 0 0 .4rem; color: rgba(255,255,255,.68); font-size: 1.1rem; }
.giving-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.15); }
.giving-card { min-height: 330px; display: flex; flex-direction: column; align-items: flex-start; padding: clamp(2rem, 5vw, 4rem); background: #0b1e23; }
.giving-card.featured { background: var(--teal); color: var(--ink); }
.giving-card .eyebrow { color: var(--teal-bright); }
.giving-card.featured .eyebrow { color: rgba(7,19,23,.68); }
.giving-card h3 { margin: auto 0 .7rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1; letter-spacing: -.05em; }
.giving-card p { max-width: 480px; margin: 0 0 1.5rem; color: rgba(255,255,255,.68); }
.giving-card.featured p { color: rgba(7,19,23,.72); }
.supporter-note { max-width: var(--max); margin: 0 auto; padding: clamp(4rem, 8vw, 7rem) var(--pad); text-align: center; }
.supporter-note h2 { max-width: 850px; margin: 0 auto 1.5rem; }
.supporter-note p { max-width: 680px; margin: 0 auto 2rem; color: var(--muted); font-size: 1.1rem; }
.supporter-note .eyebrow { color: #167f96; }
.fundraiser-footer-link { color: var(--teal-bright) !important; }

.athletic-hero {
  min-height: 86svh;
  display: grid;
  align-items: end;
  padding: 11rem var(--pad) clamp(4.5rem, 9vw, 8rem);
  color: var(--white);
  background:
    radial-gradient(circle at 78% 18%, rgba(45,162,186,.27), transparent 30%),
    linear-gradient(145deg, #071317 0%, #10272d 60%, #0a3139 100%);
}
.athletic-hero-inner { width: 100%; max-width: var(--max); margin: 0 auto; }
.athletic-hero h1 {
  max-width: 980px;
  margin: 0;
  font-family: "Libre Franklin", sans-serif;
  font-size: clamp(3.5rem, 8.5vw, 8rem);
  line-height: .88;
  letter-spacing: -.07em;
}
.athletic-hero-copy { max-width: 720px; margin: 1.6rem 0 0; color: rgba(255,255,255,.78); font-size: clamp(1.1rem, 2vw, 1.4rem); line-height: 1.5; }
.athletic-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.center-facts { display: grid; grid-template-columns: repeat(3, 1fr); color: var(--white); background: var(--ink); border-top: 1px solid rgba(255,255,255,.14); }
.center-fact { min-height: 190px; padding: clamp(2rem, 4vw, 3.5rem) var(--pad); border-right: 1px solid rgba(255,255,255,.14); }
.center-fact:last-child { border-right: 0; }
.center-fact span { color: var(--teal-bright); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.center-fact strong { display: block; margin-top: .8rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.65rem, 3vw, 2.6rem); line-height: 1.05; letter-spacing: -.04em; }
.center-mission {
  max-width: var(--max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(3rem, 9vw, 9rem);
  align-items: start;
}
.center-mission h2 { font-size: clamp(2.8rem, 6vw, 5.7rem); }
.center-mission-copy { padding-top: 1.5rem; }
.center-mission-copy p:not(.lead) { color: var(--muted); }
.center-programs { padding: clamp(5rem, 10vw, 9rem) var(--pad); background: var(--white); }
.center-programs-inner { max-width: var(--max); margin: 0 auto; }
.center-programs-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: end; margin-bottom: 3rem; }
.center-programs-heading p { max-width: 520px; margin: 0 0 .4rem; color: var(--muted); font-size: 1.1rem; }
.center-program-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.center-program-card { min-height: 300px; display: flex; flex-direction: column; padding: clamp(2rem, 4vw, 3.2rem); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.center-program-card span { color: #167f96; font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.center-program-card h3 { margin: auto 0 .75rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.8rem, 3vw, 2.7rem); line-height: 1.05; letter-spacing: -.05em; }
.center-program-card p { margin: 0; color: var(--muted); }
.center-program-coming { background: rgba(45,162,186,.08); }
.center-program-coming span { display: inline-flex; align-self: flex-start; padding: .45rem .65rem; color: var(--ink); background: var(--teal-bright); }
.center-reserve { padding: clamp(5rem, 10vw, 9rem) var(--pad); color: var(--white); background: #0b3038; }
.center-reserve-inner { max-width: var(--max); margin: 0 auto; }
.center-reserve-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: end; margin-bottom: 3rem; }
.center-reserve-heading p { max-width: 560px; margin: 0 0 .4rem; color: rgba(255,255,255,.72); font-size: 1.1rem; }
.reservation-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255,255,255,.18); border-left: 1px solid rgba(255,255,255,.18); }
.reservation-card { min-height: 520px; display: flex; flex-direction: column; padding: clamp(2rem, 4vw, 3rem); border-right: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.reservation-number { color: var(--teal-bright); font-family: "Libre Franklin", sans-serif; font-size: .8rem; font-weight: 800; letter-spacing: .14em; }
.reservation-card h3 { margin: 2.5rem 0 .8rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(2rem, 3vw, 3rem); letter-spacing: -.05em; }
.reservation-card > p { margin: 0 0 2rem; color: rgba(255,255,255,.68); }
.reservation-links { display: grid; gap: .55rem; margin-top: auto; }
.reservation-links a { display: flex; justify-content: space-between; align-items: center; min-height: 48px; padding: .8rem 1rem; color: var(--white); background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); text-decoration: none; font-weight: 700; transition: background .2s ease, border-color .2s ease; }
.reservation-links a:hover, .reservation-links a:focus-visible { background: rgba(45,162,186,.18); border-color: var(--teal-bright); }
.reservation-note { display: flex; justify-content: space-between; gap: 2rem; align-items: center; padding: 2rem 0 0; }
.reservation-note p { max-width: 720px; margin: 0; color: rgba(255,255,255,.72); }
.reservation-note p strong { color: var(--white); }
.reservation-note > div { display: flex; flex-wrap: wrap; gap: .75rem; flex: 0 0 auto; }
.center-question { padding: clamp(5rem, 10vw, 9rem) var(--pad); background: #eef5f6; }
.center-question-inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.center-question-copy h2 { margin-bottom: 1.25rem; }
.center-question-copy p { max-width: 520px; color: var(--muted); }
.center-question-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem; padding: clamp(2rem, 4vw, 3.2rem); background: var(--white); border-top: 5px solid var(--teal); }
.form-field { display: grid; gap: .45rem; }
.form-field-full, .form-submit-row { grid-column: 1 / -1; }
.form-field label { color: var(--ink); font-size: .9rem; font-weight: 800; }
.form-field input, .form-field textarea, .form-field select { width: 100%; padding: .9rem 1rem; color: var(--ink); background: #f8fbfb; border: 1px solid #b8c9cd; border-radius: 0; font: inherit; }
.form-field textarea { resize: vertical; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { outline: 3px solid rgba(45,162,186,.25); border-color: var(--teal); }
.form-submit-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; padding-top: .4rem; }
.form-submit-row .button { cursor: pointer; font: inherit; }
.form-success { margin: 0; color: #176b48; font-weight: 700; }
.form-honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.center-impact { padding: clamp(5rem, 10vw, 9rem) var(--pad); color: var(--white); background: var(--ink); }
.center-impact-inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.center-impact h2 { max-width: 620px; }
.center-impact-copy { padding-top: 1.6rem; }
.center-impact-copy .lead { margin-top: 0; }
.center-impact-copy p { color: rgba(255,255,255,.68); }
.center-impact-copy .lead { color: var(--white); }
.center-use { max-width: var(--max); margin: 0 auto; }
.center-use-heading { max-width: 780px; margin-bottom: 3rem; }
.center-use-heading p { color: var(--muted); font-size: 1.1rem; }
.center-use-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.center-use-card { min-height: 260px; display: flex; flex-direction: column; padding: 2.2rem; background: var(--white); border-top: 4px solid var(--teal); }
.center-use-card h3 { margin: auto 0 .6rem; font-family: "Libre Franklin", sans-serif; font-size: 1.9rem; letter-spacing: -.04em; }
.center-use-card p { margin: 0; color: var(--muted); }
.center-location { padding: clamp(5rem, 9vw, 8rem) var(--pad); color: var(--white); background: #0b3038; }
.center-location-inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem, 8vw, 8rem); align-items: end; }
.center-location address { margin: 1.25rem 0 0; font-style: normal; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.7rem, 3.5vw, 3rem); line-height: 1.2; letter-spacing: -.04em; }
.center-location-copy p { color: rgba(255,255,255,.72); }
.center-location-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.center-fundraiser { padding: clamp(5rem, 9vw, 8rem) var(--pad); background: var(--teal); }
.center-fundraiser-inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: 1fr auto; gap: 3rem; align-items: end; }
.center-fundraiser h2 { max-width: 780px; }
.center-fundraiser p { max-width: 680px; color: rgba(7,19,23,.72); font-size: 1.1rem; }
.footer-email { margin: .35rem 0; color: rgba(255,255,255,.72); }

/* Athletic Center booking confirmation */
.booking-confirmation-page { background: #eef5f6; }
.booking-confirmation-hero { min-height: 520px; display: flex; align-items: flex-end; padding: 10rem var(--pad) clamp(4rem, 8vw, 7rem); color: var(--white); background: radial-gradient(circle at 82% 20%, rgba(45,162,186,.28), transparent 30%), var(--ink); }
.booking-confirmation-inner { width: 100%; max-width: var(--max); margin: 0 auto; }
.confirmation-mark { width: 64px; height: 64px; display: grid; place-items: center; margin-bottom: 1.5rem; color: var(--ink); background: var(--teal-bright); border-radius: 50%; font-family: "Libre Franklin", sans-serif; font-size: 2rem; font-weight: 800; }
.booking-confirmation-hero h1 { max-width: 920px; margin-top: .5rem; font-size: clamp(4rem, 10vw, 8rem); line-height: .9; letter-spacing: -.07em; }
.booking-confirmation-hero p { max-width: 680px; margin: 1.5rem 0 0; color: rgba(255,255,255,.76); font-size: clamp(1.1rem, 2vw, 1.4rem); }
.booking-payment { padding: clamp(5rem, 10vw, 9rem) var(--pad); }
.booking-payment-inner { max-width: var(--max); margin: 0 auto; }
.booking-details { margin-bottom: clamp(4rem, 8vw, 7rem); padding: clamp(2rem, 5vw, 4rem); color: var(--white); background: #0b3038; border-top: 5px solid var(--teal-bright); }
.booking-details-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: end; margin-bottom: 2.5rem; }
.booking-details-heading h2 { margin: 0; font-size: clamp(2.4rem, 5vw, 4.8rem); }
.booking-details-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; border-top: 1px solid rgba(255,255,255,.18); border-left: 1px solid rgba(255,255,255,.18); }
.booking-details-grid > div { min-height: 130px; padding: 1.5rem; border-right: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.booking-details-grid dt { color: var(--teal-bright); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.booking-details-grid dd { margin: .65rem 0 0; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.15rem, 2vw, 1.55rem); font-weight: 700; line-height: 1.25; }
#booking-price-row { background: rgba(50,197,215,.08); }
#booking-price { color: var(--teal-bright); }
.booking-price-guide { margin: 0 0 clamp(4rem, 8vw, 7rem); padding: clamp(2rem, 5vw, 4rem); background: #fff; border-top: 5px solid var(--teal-bright); }
.booking-price-guide-heading { max-width: 820px; margin-bottom: 2rem; }
.booking-price-guide-heading h2 { margin: .5rem 0 1rem; font-size: clamp(2rem, 4vw, 3.5rem); }
.booking-price-guide-heading p, .booking-price-note { color: var(--muted); }
.booking-rate-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.booking-rate-card { min-height: 210px; padding: clamp(1.5rem, 3vw, 2.5rem); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.booking-rate-card h3 { margin: 0 0 .75rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.3rem, 2.2vw, 1.8rem); }
.booking-rate-card p { margin: 0 0 .7rem; color: var(--muted); }
.booking-rate-card > strong { display: block; margin: .5rem 0 .75rem; color: #0d7085; font-size: 1.4rem; }
.booking-rate-card strong span { color: var(--muted); font-size: .85rem; font-weight: 600; }
.booking-rate-card b { color: var(--ink); }
.booking-rate-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: .5rem; }
.booking-rate-option { padding: .85rem .75rem .35rem; background: #f2f8f8; border: 1px solid #dce9e9; }
.booking-rate-option p { min-height: 2.4em; margin: 0; color: var(--ink); font-size: .9rem; font-weight: 700; }
.booking-session-prices { margin: .5rem 0 0; padding: 0; list-style: none; }
.booking-session-prices li { display: flex; justify-content: space-between; gap: .4rem; padding: .35rem 0; border-top: 1px solid #dce9e9; color: var(--muted); font-size: .86rem; }
.booking-session-prices li strong { margin: 0; color: #0d7085; font-size: .96rem; white-space: nowrap; }
.booking-rate-option .booking-session-prices li { font-size: .8rem; }
.booking-rate-option .booking-session-prices li strong { font-size: .88rem; }
.booking-price-note { margin: 1.2rem 0 0; }
.booking-payment-heading { max-width: 760px; margin-bottom: 3rem; }
.booking-payment-heading p { color: var(--muted); font-size: 1.1rem; }
.booking-payment-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.payment-option { min-height: 430px; display: flex; flex-direction: column; padding: clamp(2rem, 5vw, 4rem); background: var(--white); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.payment-option-featured { background: #0b3038; color: var(--white); }
.payment-label { color: #167f96; font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.payment-option-featured .payment-label { color: var(--teal-bright); }
.payment-option h3 { margin: 1.3rem 0 1rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(2.7rem, 5vw, 4.8rem); line-height: .95; letter-spacing: -.06em; }
.payment-option p { max-width: 520px; margin: 0 0 2rem; color: var(--muted); }
.payment-option-featured p { color: rgba(255,255,255,.72); }
.payment-option .button { align-self: flex-start; margin-top: auto; }
.payment-location { display: grid; gap: .45rem; margin-top: auto; padding-top: 2rem; border-top: 1px solid var(--line); }
.payment-location span { color: var(--muted); }
.release-forms-panel { margin-top: clamp(4rem, 8vw, 7rem); scroll-margin-top: 7rem; }
.release-forms-heading { max-width: 820px; margin-bottom: 2.5rem; }
.release-forms-heading p { color: var(--muted); font-size: 1.1rem; }
.release-form-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.release-form-card { min-height: 360px; display: flex; flex-direction: column; padding: clamp(2rem, 4vw, 3rem); background: var(--white); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.release-form-card > span { color: #167f96; font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.release-form-card h3 { margin: 1.4rem 0 .75rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1; letter-spacing: -.05em; }
.release-form-card p { margin: 0 0 2rem; color: var(--muted); }
.release-form-card .button { align-self: flex-start; margin-top: auto; }
.booking-policies { margin-top: clamp(4rem, 8vw, 7rem); padding: clamp(2.5rem, 6vw, 5rem); color: var(--white); background: var(--ink); }
.booking-policies-heading { display: grid; grid-template-columns: .8fr 1.2fr; gap: 2rem; align-items: end; margin-bottom: 2.5rem; }
.booking-policies-heading h2 { margin: 0; }
.booking-policy-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid rgba(255,255,255,.18); border-left: 1px solid rgba(255,255,255,.18); }
.booking-policy-card { min-height: 380px; display: flex; flex-direction: column; padding: clamp(2rem, 4vw, 3rem); border-right: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.policy-number { color: var(--teal-bright); font-size: .75rem; font-weight: 800; letter-spacing: .14em; }
.booking-policy-card h3 { margin: auto 0 1rem; font-family: "Libre Franklin", sans-serif; font-size: clamp(1.8rem, 3vw, 2.8rem); line-height: 1.05; letter-spacing: -.05em; }
.booking-policy-card p { margin: 0; color: rgba(255,255,255,.7); }
.booking-next-steps { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; margin-top: 2rem; padding: clamp(2rem, 5vw, 4rem); background: var(--teal); }
.booking-next-steps h2 { margin-bottom: .75rem; font-size: clamp(2rem, 4vw, 3.4rem); }
.booking-next-steps p { max-width: 660px; margin: 0; color: rgba(7,19,23,.72); }
.booking-next-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .75rem; }
.text-link { color: var(--ink); font-weight: 800; text-decoration: underline; text-underline-offset: .25em; }

.site-footer { display: grid; grid-template-columns: 1.2fr .8fr 1fr; gap: 4rem; padding: 4.5rem var(--pad) 2rem; color: var(--white); background: #03090b; }
.footer-brand img { width: 70px; }
.footer-brand p { margin-top: 1.3rem; font-size: 1.1rem; color: rgba(255,255,255,.66); }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; }
.footer-column h2 { margin: 0 0 1rem; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.footer-column p { margin: 0 0 .5rem; color: rgba(255,255,255,.66); }
.footer-column a { margin-bottom: .55rem; color: rgba(255,255,255,.76); text-decoration: none; }
.footer-column a:hover, .footer-column a:focus-visible { color: var(--teal-bright); }
.social-links { display: flex; gap: 1rem; margin-top: 1rem; }
.footer-bottom { grid-column: 1 / -1; display: flex; justify-content: space-between; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.12); font-size: .82rem; color: rgba(255,255,255,.5); }
.footer-bottom a { color: inherit; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .reveal { opacity: 1; transform: none; }
}

@media (max-width: 880px) {
  .site-header { min-height: 72px; background: rgba(7,19,23,.92); }
  .brand img { width: 52px; height: 56px; }
  .menu-toggle { display: grid; gap: 5px; width: 44px; height: 44px; padding: 10px; border: 0; background: transparent; }
  .menu-toggle span:not(.sr-only) { display: block; height: 2px; background: var(--white); transition: transform .2s ease, opacity .2s ease; }
  .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .main-nav { position: fixed; inset: 72px 0 0; display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 0; padding: 2rem var(--pad); background: var(--ink); transform: translateX(100%); transition: transform .25s ease; }
  .main-nav.open { transform: translateX(0); }
  .main-nav a { padding: 1rem 0; font-family: "Libre Franklin", sans-serif; font-size: 2rem; border-bottom: 1px solid rgba(255,255,255,.12); }
  .main-nav a::after { display: none; }
  .nav-give { border: 0; }
  .hero { min-height: 820px; background-position: center; padding-bottom: 3rem; }
  .hero-service-card { width: 100%; align-items: flex-start; flex-direction: column; }
  .hero-scroll { display: none; }
  .welcome, .pastors { grid-template-columns: 1fr; }
  .welcome-copy { padding-top: 0; }
  .pillars { grid-template-columns: 1fr; }
  .pillar { min-height: 300px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
  .visit { grid-template-columns: 1fr; }
  .expect-grid { grid-template-columns: 1fr; }
  .expect-card { min-height: auto; }
  .expect-card h3 { margin-top: 2rem; }
  .watch { grid-template-columns: 1fr; }
  .ministries-heading { grid-template-columns: 1fr; gap: 1.5rem; }
  .ministry-grid { grid-template-columns: repeat(2, 1fr); }
  .youth { grid-template-columns: 1fr; }
  .youth-intro { position: static; }
  .fundraiser-hero-inner, .fundraiser-impact, .giving-heading { grid-template-columns: 1fr; }
  .fundraiser-goal { width: min(100%, 420px); }
  .center-mission, .center-programs-heading, .center-reserve-heading, .center-question-inner, .center-impact-inner, .center-location-inner, .center-fundraiser-inner { grid-template-columns: 1fr; }
  .center-program-grid, .reservation-grid, .center-use-grid { grid-template-columns: 1fr; }
  .booking-details-heading, .release-form-grid, .booking-policies-heading, .booking-policy-grid, .booking-payment-grid, .booking-next-steps { grid-template-columns: 1fr; }
  .booking-rate-grid { grid-template-columns: 1fr; }
  .booking-rate-card { min-height: auto; }
  .booking-details-grid { grid-template-columns: repeat(2, 1fr); }
  .booking-next-actions { justify-content: flex-start; }
  .center-program-card { min-height: 260px; }
  .reservation-card { min-height: auto; }
  .reservation-note { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 580px) {
  .hero { min-height: 760px; background-position: 50% center; }
  .hero-message, .hero-service-card { width: 100%; }
  .hero-message h1 { font-size: clamp(2.65rem, 13vw, 4.2rem); }
  .hero-service-card strong { font-size: 3.4rem; }
  .hero-actions { width: 100%; }
  .hero-actions .button { flex: 1 1 100%; }
  .ministry-grid { grid-template-columns: 1fr; }
  .ministry-card { min-height: 240px; }
  .youth-gallery { grid-template-rows: 170px 170px; }
  .fundraiser-hero { min-height: auto; padding-top: 9rem; }
  .fundraiser-hero h1 { font-size: clamp(3.2rem, 16vw, 5rem); }
  .fundraiser-actions .button { width: 100%; }
  .giving-grid { grid-template-columns: 1fr; }
  .giving-card { min-height: 290px; }
  .athletic-hero { min-height: auto; padding-top: 9rem; }
  .athletic-hero h1 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .athletic-hero-actions .button, .center-location-actions .button, .reservation-note .button { width: 100%; }
  .center-question-form { grid-template-columns: 1fr; }
  .form-field, .form-field-full, .form-submit-row { grid-column: 1; }
  .booking-confirmation-hero { min-height: auto; padding-top: 9rem; }
  .booking-confirmation-hero h1 { font-size: clamp(3.6rem, 17vw, 5.6rem); }
  .payment-option { min-height: 380px; }
  .release-form-card, .booking-policy-card { min-height: auto; }
  .release-form-card .button { width: 100%; text-align: center; }
  .booking-details-grid { grid-template-columns: 1fr; }
  .booking-details-grid > div { min-height: auto; }
  .booking-next-actions .button, .booking-next-actions .text-link { width: 100%; text-align: center; }
  .center-facts { grid-template-columns: 1fr; }
  .center-fact { min-height: auto; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
  .site-footer { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { grid-column: 1; flex-direction: column; gap: .5rem; }
}

.form-status { margin: 0; font-weight: 700; color: #176b48; }
.form-status[data-error="true"] { color: #a32626; }
button:disabled { opacity: .65; cursor: wait; }
#contact, #question-form { scroll-margin-top: 90px; }

.athletic-center-logo { display: block; width: min(100%, 560px); height: auto; margin: 0 0 clamp(2rem, 4vw, 3rem); }