:root {
  --pine:#15271e; --pine-deep:#101e17; --moss:#aeb99c;
  --gold:#f3c783; --paper:#f8f6ef; --chalk:#fdfbf5;
  --ink:#202d25; --muted:#4e5e51; --line:#d8dbce;
  --serif:"Instrument Serif", Georgia, serif; --sans:"DM Sans",system-ui,sans-serif;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth}
body {margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}
h1,h2,h3,p,figure,dl,dd {margin:0}
h1,h2 {font:400 clamp(3.3rem,7vw,6.25rem)/.94 var(--serif);letter-spacing:-.025em}
h2 {font-size:clamp(3.15rem,5.8vw,5.2rem)}
h3 {font-size:1.2rem;line-height:1.3}
a {color:inherit}
button {font:inherit}
img {max-width:100%;display:block}
img[hidden] {display:none}
:focus-visible {outline:3px solid #ba6529;outline-offset:4px}
.skip {position:fixed;top:10px;left:10px;z-index:5;background:var(--chalk);padding:.75rem;transform:translateY(-150%)}
.skip:focus {transform:none}
.frame {width:min(1200px,calc(100% - 104px));margin-inline:auto}
.header {background:var(--pine);color:var(--chalk);border-bottom:1px solid #ffffff22}
.nav {height:79px;display:flex;align-items:center;justify-content:space-between;gap:2rem;position:relative}
.logo {display:inline-flex;align-items:baseline;text-decoration:none;font-size:2.2rem;font-weight:700;letter-spacing:-.105em;line-height:1}
.logo span {color:var(--gold)}
.logo small {font-size:.64rem;margin-left:.75rem;letter-spacing:.18em;font-weight:700}
.nav nav,.footer nav {display:flex;align-items:center;gap:clamp(1rem,2.4vw,2.25rem)}
.nav nav a,.footer nav a,.back {text-decoration:none;font-size:.88rem;font-weight:600}
.nav nav a:hover,.footer nav a:hover,.back:hover {color:var(--gold)}
.menu {display:none}
.button {display:inline-flex;justify-content:center;align-items:center;gap:.7rem;padding:.78rem 1.2rem;border:1px solid transparent;border-radius:3px;text-decoration:none;font-size:.88rem;font-weight:700;min-height:45px;white-space:nowrap;transition:background-color .2s,color .2s,border-color .2s}
.nav-cta,.outline {border-color:#fdfbf561;color:var(--chalk)}
.nav-cta:hover,.outline:hover {background:#ffffff18;border-color:var(--chalk)}
.gold {background:var(--gold);color:var(--pine-deep)}
.gold:hover {background:#ffdda7}
.dark {background:var(--pine);color:var(--chalk)}
.dark:hover {background:#304c3a}
.hero {background:var(--pine);color:var(--chalk)}
.hero-grid {display:grid;grid-template-columns:1.07fr 1fr;align-items:center;gap:clamp(2rem,5vw,5rem);padding-block:clamp(3rem,5.5vw,5rem)}
.hero-copy {padding-bottom:.5rem}
.label {font-size:.73rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;line-height:1.35}
.hero .label,.about .label {color:var(--gold)}
.dot {width:.51rem;height:.51rem;background:var(--gold);border-radius:50%;display:inline-block;margin-right:.5rem;vertical-align:.09rem}
.hero h1 {margin:1.45rem 0}
.hero h1 em {color:var(--gold);font-weight:400}
.hero-intro {color:#e0e6d9;max-width:33ch;font-size:clamp(1rem,1.6vw,1.16rem)}
.actions {display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.65rem}
.hero-photo {aspect-ratio:1.16;min-width:0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 78% 23%,#7e8668 0%,#4d624d 40%,#2d4738 70%,#1e362a 100%);border-radius:3px}
.hero-photo::after {content:"";position:absolute;inset:0;background:linear-gradient(150deg,#1b33252a,transparent 55%,#131b1450);pointer-events:none}
.hero-photo img {width:100%;height:100%;object-fit:cover;object-position:50% 45%;filter:saturate(.78)}
.hero-photo figcaption {position:absolute;z-index:1;bottom:1.1rem;left:1.1rem;background:var(--gold);color:var(--pine-deep);padding:1rem 1.25rem;min-width:9.8rem;border-radius:2px}
.hero-photo figcaption span {display:block;font-size:.63rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.hero-photo figcaption strong {display:block;font:400 3.6rem/.95 var(--serif);margin-top:.2rem;white-space:nowrap}
.hero-photo figcaption small {font:700 .78rem var(--sans);letter-spacing:.07em}
.hero-bottom {display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid #ffffff32;min-height:66px;font-size:.86rem;color:#e0e6d9;font-weight:600}
.hero-bottom a {text-decoration:none}
.hero-bottom a:hover {text-decoration:underline;text-underline-offset:4px}
.section {padding-block:clamp(4rem,7.5vw,7.3rem);scroll-margin-top:1rem}
.section-head {display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2.2rem}
.section-head > p {max-width:33ch;color:var(--muted)}
.section-head h2,.about h2,.connect h2 {margin-top:.65rem}
.visit-grid {display:grid;grid-template-columns:.83fr 1.17fr;gap:clamp(1rem,3.5vw,3.4rem)}
.visit-card {background:#e5e9d9;padding:clamp(1.4rem,3.5vw,2.8rem);border-radius:3px}
.service-time {font:400 clamp(4.5rem,8vw,6.5rem)/1 var(--serif);letter-spacing:-.035em;margin:.55rem 0}
.service-time small {font:700 .96rem var(--sans);letter-spacing:.07em}
address {font-style:normal}
.visit-card .button {margin-top:1.25rem}
.schedule {align-self:center}
.schedule h3 {margin:0 0 .75rem;font-size:1.4rem}
.schedule dl {margin-bottom:1.05rem;border-top:1px solid var(--line)}
.schedule dl div {display:flex;justify-content:space-between;align-items:baseline;gap:.65rem;padding:.78rem 0;border-bottom:1px solid var(--line)}
.schedule dt {font-weight:700}
.schedule dd {color:var(--muted);text-align:right}
.schedule dd span {display:inline-block;min-width:5.7rem;font-variant-numeric:tabular-nums;color:var(--ink);font-weight:700}
.arrow-link {display:inline-flex;align-items:center;gap:.65rem;text-decoration:none;border-bottom:1px solid currentColor;font-size:.88rem;font-weight:700;padding-bottom:.12rem}
.arrow-link:hover {opacity:.8}
.visit-question {display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.15rem;margin-top:1.6rem;font-size:.9rem}
.visit-question a {font-weight:700;text-underline-offset:.2em}
.about {background:var(--pine);color:var(--chalk)}
.about-grid {display:grid;grid-template-columns:1fr .78fr;align-items:center;gap:clamp(2rem,8vw,8rem)}
.about h2 em {color:var(--gold);font-weight:400}
.about-copy > p:not(.label) {max-width:46ch;margin:1.25rem 0;color:#e0e6d9}
.about-copy .arrow-link {color:var(--gold)}
.pastor-card {border:1px solid #ffffff2d;background:#ffffff08;border-radius:3px;overflow:hidden}
.pastor-card img {width:100%;aspect-ratio:1.6;object-fit:cover;object-position:50% 35%}
.pastor-card > div {padding:1.3rem 1.5rem 1.45rem}
.pastor-card p {font-size:.93rem;color:#e0e6d9;margin-top:.45rem}
.sermons {background:var(--chalk)}
.sermon-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem,2vw,1.6rem)}
.sermon {display:block;text-decoration:none;background:var(--paper);border:1px solid var(--line);border-radius:3px;overflow:hidden}
.thumb {background:radial-gradient(ellipse at 80% 25%,#789076,#233b2c 73%);position:relative;aspect-ratio:16/9;overflow:hidden}
.thumb img {width:100%;height:100%;object-fit:cover;transition:transform .25s}
.sermon:hover img {transform:scale(1.045)}
.play {position:absolute;display:grid;place-items:center;left:.85rem;bottom:.85rem;width:2.65rem;height:2.65rem;border-radius:50%;background:var(--gold);color:var(--pine-deep);font-size:.8rem;padding-left:.12rem}
.sermon-copy {position:relative;padding:1rem 2.35rem 1.15rem 1rem}
.sermon-copy time {font-size:.75rem;color:var(--muted)}
.sermon-copy h3 {font-size:1.05rem;margin-top:.35rem}
.sermon-copy > span {position:absolute;right:1rem;top:1.06rem}
.sermon:hover h3 {text-decoration:underline;text-underline-offset:.2em}
.connect {background:#e5e9d9}
.connect-grid {display:grid;grid-template-columns:1fr .85fr;gap:2rem;align-items:center}
.connect p:not(.label) {margin-top:1rem;max-width:37ch;color:var(--muted)}
.contact-links a {display:grid;grid-template-columns:4rem 1fr auto;gap:.55rem;align-items:center;text-decoration:none;border-top:1px solid #b5bfae;padding:.9rem 0;font-weight:700}
.contact-links a:last-child {border-bottom:1px solid #b5bfae}
.contact-links a:hover {text-decoration:underline;text-underline-offset:.2em}
.contact-links span {font-size:.76rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.footer {background:var(--pine-deep);color:var(--chalk);padding-block:2.5rem}
.footer-grid {display:flex;justify-content:space-between;align-items:flex-start;gap:1.5rem}
.footer p {font-size:.8rem;color:#d0dbcc;margin-top:.7rem}
.footer nav {flex-wrap:wrap;gap:.55rem 1.25rem}
.back {white-space:nowrap}
@media (max-width:960px) {
  .frame {width:calc(100% - 64px)}
  .nav {gap:1rem}
  .hero h1 {font-size:clamp(3.4rem,8vw,5.65rem)}
}
@media (max-width:740px) {
  .frame {width:calc(100% - 36px)}
  .nav {height:64px}
  .nav-cta {display:none}
  .menu {display:flex;align-items:center;gap:.5rem;background:transparent;border:1px solid #ffffff55;border-radius:3px;color:var(--chalk);padding:.45rem .7rem;min-height:44px;cursor:pointer;font-size:.88rem;font-weight:700}
  .nav nav {display:none;position:absolute;z-index:2;top:100%;right:0;left:0;background:var(--pine-deep);padding:.5rem 1rem;border:1px solid #ffffff30;border-radius:3px}
  .menu[aria-expanded=true] + nav {display:grid;gap:0}
  .nav nav a {padding:.65rem 0}
  .hero-grid,.visit-grid,.about-grid,.connect-grid {grid-template-columns:1fr}
  .hero-grid {gap:1.65rem;padding-block:2.6rem 1.4rem}
  .hero-copy {padding:0}
  .hero h1 {font-size:clamp(3.75rem,12vw,5.6rem);margin:1rem 0}
  .hero-photo {aspect-ratio:1.55}
  .hero-photo figcaption {bottom:.7rem;left:.7rem;padding:.65rem .85rem;min-width:0}
  .hero-photo figcaption strong {font-size:2.65rem}
  .hero-bottom {flex-wrap:wrap;align-content:center;gap:.12rem 1rem;padding-block:.65rem}
  .section-head {align-items:flex-start;flex-direction:column;gap:1rem;margin-bottom:1.45rem}
  .sermon-grid {grid-template-columns:repeat(2,1fr)}
  .footer-grid {flex-wrap:wrap}
}
@media (max-width:440px) {
  .sermon-grid {grid-template-columns:1fr}
  .schedule dl div {font-size:.9rem}
  .schedule dd span {min-width:4.5rem}
  .contact-links a {grid-template-columns:3.1rem 1fr auto}
}
@media (prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after {transition:none!important}
}
