:root {
  color-scheme: light;
  --h-ink: #2c3835;
  --h-pine: #294942;
  --h-deep: #183a34;
  --h-cream: #fffcf7;
  --h-paper: #fffefb;
  --h-gold: #d4af37;
  --h-gold-soft: #f0d98d;
  --h-moss: #60766f;
  --h-line: #e5dcc9;
  --h-shadow: 0 18px 48px rgba(36,58,52,.11);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--h-ink);
  background: radial-gradient(circle at 82% 12%, rgba(212,188,128,.16), transparent 24rem), var(--h-cream);
  font: 18px/1.76 Georgia, "Times New Roman", serif;
}
a { color: var(--h-pine); }
a:focus-visible, button:focus-visible { outline: 3px solid #a9821b; outline-offset: 3px; }
.skip-link { position: absolute; left: -9999px; top: 1rem; z-index: 10001; padding: .75rem 1rem; background: var(--h-paper); color: var(--h-deep); }
.skip-link:focus { left: 1rem; }
.site-header {
  min-height: 230px;
  color: #fff;
  background: linear-gradient(90deg, rgba(18,50,44,.95), rgba(30,62,54,.73)), url('/assets/clear-shining-landscape.webp') center 48%/cover no-repeat;
  border-bottom: 4px solid var(--h-gold);
}
.site-nav { max-width: 1160px; margin: 0 auto; padding: 1rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid rgba(255,255,255,.25); }
.brand { display: inline-flex; align-items: center; gap: .8rem; color: #fff; text-decoration: none; font-size: .98rem; font-weight: 700; letter-spacing: .025em; }
.brand img { display: block; width: 48px; height: 48px; object-fit: contain; }
.site-links { display: flex; flex-wrap: wrap; gap: 1rem; }
.site-links a { color: #fff; text-decoration: none; font: 700 .76rem/1.2 Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.site-links a:hover { color: var(--h-gold-soft); text-decoration: underline; text-underline-offset: .25em; }
.header-note { max-width: 1160px; margin: 0 auto; padding: 2.15rem 1.25rem 2.4rem; color: #f4e5bb; font: 700 .72rem/1.3 Arial, sans-serif; letter-spacing: .19em; text-transform: uppercase; }
main { width: min(100% - 2.5rem, 870px); margin: 0 auto; }
.breadcrumbs { padding: 1.5rem 0 .6rem; color: #6c7872; font: .78rem/1.5 Arial, sans-serif; }
.breadcrumbs a { text-underline-offset: .2em; }
.hymn-article { margin: 0 auto 5rem; padding: 1.4rem clamp(0px, 3vw, 2.4rem) 3.5rem; }
.eyebrow { margin: 1rem 0 .55rem; color: #687b70; font: 700 .76rem/1.35 Arial, sans-serif; letter-spacing: .17em; text-transform: uppercase; }
h1 { max-width: 780px; margin: .15rem 0 1rem; color: var(--h-deep); font-size: clamp(2.55rem, 7vw, 4.75rem); line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
.standfirst { max-width: 740px; margin: 0 0 1.4rem; color: #40594f; font-size: clamp(1.14rem, 2.4vw, 1.5rem); line-height: 1.5; }
.hymn-note { margin: 1.4rem 0 2.2rem; padding: 1rem 1.15rem; border-left: 3px solid var(--h-gold); background: #f4eddb; color: #40534c; font: .9rem/1.6 Arial, sans-serif; }
.hymn-note a { display: inline-block; margin-top: .25rem; font-weight: 700; }
.hymn-section { margin: 2.3rem 0; }
.hymn-section h2 { margin: 0 0 .75rem; color: var(--h-pine); font-size: clamp(1.45rem, 3vw, 1.9rem); line-height: 1.2; }
.hymn-section p { margin: .7rem 0; }
.scripture-note { padding: 1.15rem 1.35rem; border-left: 3px solid var(--h-gold); background: #f5f0e4; }
.carry-note { margin: 2.5rem 0; padding: 1.35rem 0; border-top: 1px solid var(--h-line); border-bottom: 1px solid var(--h-line); color: var(--h-pine); font-size: clamp(1.25rem, 2.8vw, 1.55rem); font-style: italic; }
.reader-invitation { margin: 2.7rem 0; padding: 1.5rem; background: linear-gradient(145deg, #fffefb, #f4eddb); border-top: 3px solid var(--h-gold); }
.reader-invitation p { margin: .35rem 0; }
.button-link { display: inline-block; margin-top: .7rem; padding: .75rem 1rem; color: #fff; background: var(--h-pine); text-decoration: none; font: 700 .78rem/1.3 Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.button-link:hover { background: var(--h-deep); }
.back-link { display: inline-block; margin: 1rem 0 0; font: 700 .9rem/1.5 Arial, sans-serif; text-underline-offset: .2em; }
footer { display: flex; justify-content: space-between; gap: 1rem; max-width: 1160px; margin: 0 auto; padding: 1.8rem 1.25rem 2rem; color: #53665f; border-top: 1px solid var(--h-line); font: .82rem/1.6 Arial, sans-serif; }
footer a { color: inherit; }
.pilot-reflections { margin-top: 2.5rem; }
.pilot-intro { max-width: 690px; margin-bottom: 1.25rem; }
.pilot-intro h3 { margin: .3rem 0 .45rem; color: var(--h-pine); font-size: clamp(1.5rem, 3vw, 2rem); }
.pilot-card-link { display: inline-block; margin-top: .45rem; font: 700 .78rem/1.4 Arial, sans-serif; letter-spacing: .04em; text-underline-offset: .2em; }
@media (max-width: 620px) {
  body { font-size: 17px; }
  .site-header { min-height: 215px; }
  .site-nav { align-items: flex-start; flex-direction: column; padding: .85rem 1rem; }
  .brand img { width: 42px; height: 42px; }
  .site-links { gap: .8rem; }
  .site-links a { font-size: .69rem; }
  .header-note { padding: 1.6rem 1rem 2rem; font-size: .66rem; }
  main { width: min(100% - 1.5rem, 870px); }
  .breadcrumbs { padding-top: 1.1rem; }
  .hymn-article { padding: .9rem .15rem 2rem; }
  .hymn-note { padding: .9rem 1rem; }
  footer { flex-direction: column; padding: 1.4rem 1rem 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
.hymn-illustration{margin:1.2rem 0 2.2rem;border:1px solid var(--h-line);padding:.45rem;background:#fff;box-shadow:var(--h-shadow)}
.hymn-illustration img{display:block;width:100%;aspect-ratio:12/7;object-fit:cover}
.hymn-illustration figcaption{padding:.55rem .35rem .15rem;color:#66736e;font:italic .82rem/1.5 Georgia,serif}
.listen-note{margin:1.4rem 0;padding:1rem 1.15rem;border-left:3px solid var(--h-gold);background:#f8f4e9}