/* Our Beliefs: page-local layout and motion. */
.beliefs-page { --belief-gold: #b88b4c; }
.beliefs-page .grain { animation: none; opacity: .035; }
.beliefs-page .header { background: var(--paper); }
.beliefs-page .header.menu-open { background: transparent; }
.beliefs-page :focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.b-skip { position: fixed; top: 1rem; left: 1rem; z-index: 10000; padding: .8rem 1.2rem; background: var(--ink); color: var(--paper); transform: translateY(-200%); }
.b-skip:focus { transform: none; }
.b-icon { width: 3.5rem; height: 3.5rem; flex: 0 0 auto; color: var(--blue); }
.b-eyebrow { display: flex; align-items: center; gap: .8rem; font: 500 .72rem/1.5 var(--font-body); letter-spacing: .14em; text-transform: uppercase; }
.b-eyebrow .b-icon { width: 1.7rem; height: 1.7rem; }
/* Keep the hero geometry in step with Our Vision. */
.b-hero { padding-top: clamp(8rem, 12vw, 10.5rem); }
.b-hero__grid { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: clamp(3rem, 7vw, 7rem); }
.b-hero__copy { padding-bottom: 1rem; }
.b-hero .b-eyebrow { gap: .75rem; font-size: .75rem; line-height: 1.4; letter-spacing: .16em; }
.b-hero .b-eyebrow .b-icon { width: 1.65rem; height: 1.65rem; }
.b-hero h1 { margin: 2rem 0 1.6rem; font: 400 clamp(3.3rem, 5.5vw, 5.1rem)/1.06 var(--font-display); letter-spacing: -.045em; }
.b-hero h1 em { color: var(--blue); }
.b-hero__lede { max-width: 27rem; color: var(--ink); font-family: var(--font-display); font-size: clamp(1.35rem, 2.1vw, 1.8rem); line-height: 1.5; letter-spacing: -.015em; }
.b-hero__button { margin-top: 0; }
.b-window { position: relative; padding: 0 1.2rem 0 0; margin: 0; }
.b-window::before { content: ""; position: absolute; inset: -1rem 0 3.5rem 1.2rem; border: 1px solid var(--belief-gold); border-radius: 50% 50% 0 0 / 40% 40% 0 0; }
.b-window__frame { position: relative; aspect-ratio: 4 / 5; border-radius: 50% 50% 0 0 / 40% 40% 0 0; overflow: hidden; background: var(--paper-soft); }
.b-window__frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,27,43,.17), transparent 60%); pointer-events: none; }
.b-window img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.b-window__star { position: absolute; width: clamp(4rem, 8vw, 7rem); height: auto; top: 2%; right: -1.4rem; color: var(--belief-gold); pointer-events: none; }
.b-window figcaption, .b-community figcaption { display: flex; align-items: center; gap: .6rem; margin-top: .9rem; color: var(--ink-soft); font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }
.b-window figcaption .b-icon, .b-community figcaption .b-icon { width: 1.25rem; height: 1.25rem; }
.b-window figcaption { margin-top: 1rem; font-size: .6875rem; letter-spacing: .12em; }
.b-window figcaption .b-icon { width: 1.1rem; height: 1.1rem; }
.b-index { display: flex; justify-content: space-between; gap: 1rem; margin-top: clamp(3rem, 6vw, 5rem); padding-block: 1.3rem; border-top: 1px solid var(--line); }
.b-index a { display: flex; align-items: center; gap: .75rem; min-height: 2.75rem; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; padding: .3rem 0; }
.b-index a:hover { color: var(--blue); }
.b-index .b-icon { width: 1.35rem; height: 1.35rem; }
.b-section { padding-block: clamp(4rem, 7.5vw, 7rem); }
.b-belief { scroll-margin-top: 7rem; }
.b-belief h2 { font: 400 clamp(2rem, 3vw, 2.8rem)/1.12 var(--font-display); letter-spacing: -.03em; margin-block: 1.2rem; }
.b-doctrine { font-size: .95rem; line-height: 1.9; color: var(--ink-soft); }
.b-foundation__inner { display: grid; grid-template-columns: 1fr 3fr; gap: 4rem; align-items: start; }
.b-foundation .b-eyebrow { margin-top: .45rem; color: var(--ink-soft); }
.b-belief--feature { max-width: 57rem; }
.b-belief--feature > .b-icon { display: none; }
.b-belief--feature h2 { margin-top: 0; }
.b-belief--feature .b-doctrine { font: 400 clamp(1.4rem, 2.4vw, 2rem)/1.55 var(--font-display); color: var(--ink); }
.b-god { position: relative; isolation: isolate; overflow: hidden; background: var(--dark); color: var(--paper); }
.b-god__glass { position: absolute; z-index: -2; right: 0; top: 0; width: 62%; height: 100%; object-fit: cover; opacity: .23; -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%); mask-image: linear-gradient(90deg, transparent, #000 45%); }
.b-god::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, var(--dark), rgba(8,27,43,.25)); }
.b-god::after { content: ""; position: absolute; z-index: 1; inset: 0; background: url("assets/mission-glass-grain.svg") repeat; background-size: 180px; opacity: .16; pointer-events: none; }
.b-god__inner { position: relative; z-index: 2; }
.b-lights { position: absolute; z-index: 0; inset: 0; pointer-events: none; }
.b-lights i { position: absolute; width: clamp(20rem, 44vw, 40rem); aspect-ratio: 1; background: radial-gradient(circle, rgba(var(--light), .18), rgba(var(--light), .07) 35%, transparent 70%); animation: belief-light calc(var(--cycle) / 1.1) ease-in-out infinite alternate; animation-play-state: paused; }
.b-lights i:nth-child(1) { --light: 248,176,72; --cycle: 21s; top: -20%; left: 35%; animation-delay: -4s; }
.b-lights i:nth-child(2) { --light: 48,174,235; --cycle: 24s; top: 15%; right: -10%; animation-delay: -8s; }
.b-lights i:nth-child(3) { --light: 34,201,182; --cycle: 19s; top: 35%; left: 10%; animation-delay: -5s; }
.b-lights i:nth-child(4) { --light: 111,186,78; --cycle: 26s; bottom: -10%; right: 25%; animation-delay: -10s; }
.b-lights i:nth-child(5) { --light: 221,71,64; --cycle: 23s; top: -15%; right: -15%; animation-delay: -15s; }
.b-lights i:nth-child(6) { --light: 135,101,216; --cycle: 28s; bottom: 0; left: 45%; animation-delay: -12s; }
.b-god.is-in-view .b-lights i { animation-play-state: running; }
@keyframes belief-light { 0% { transform: translate3d(-15%, -8%, 0) scale(.9); } 50% { transform: translate3d(20%, 20%, 0) scale(1.1); } 100% { transform: translate3d(-5%, 40%, 0) scale(.96); } }
.b-god .b-icon { color: #c3aa80; }
.b-belief--trinity { text-align: center; max-width: 45rem; margin-inline: auto; }
.b-belief--trinity > .b-icon { width: 4rem; height: 4rem; margin-inline: auto; }
.b-belief--trinity h2 { font-size: clamp(3.5rem, 6.5vw, 6rem); margin-block: 1.5rem; }
.b-belief--trinity .b-doctrine { color: #dedcd5; font-size: 1.05rem; line-height: 1.8; }
.b-persons { display: grid; grid-template-columns: 1fr 1.2fr 1fr; margin-top: 4rem; gap: 2.5rem; padding-top: 3rem; border-top: 1px solid var(--line-light); }
.b-persons .b-belief + .b-belief { border-left: 1px solid var(--line-light); padding-left: 2.5rem; }
.b-persons h2 { font-size: clamp(1.9rem, 2.4vw, 2.4rem); }
.b-persons .b-doctrine { color: #d0d5d9; font-size: .88rem; line-height: 1.95; }
.b-grace__grid { display: grid; grid-template-columns: 1fr 1.65fr; gap: clamp(3rem, 7vw, 7rem); }

.b-belief--salvation { padding-left: clamp(3rem, 7vw, 7rem); border-left: 1px solid var(--line); }


.b-community { background: var(--paper-soft); }
.b-community__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(3rem, 7vw, 7rem); align-items: center; }
.b-community__photo { margin: 0; }
.b-community__photo img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 43%; border-radius: 45% 45% 0 0 / 32% 32% 0 0; }
.b-community__copy .b-belief + .b-belief { margin-top: 2.3rem; padding-top: 2.3rem; border-top: 1px solid var(--line); }

.b-eternity__grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(3rem, 8vw, 8rem); }


.b-eternity .b-belief:last-child { border-left: 1px solid var(--line); padding-left: clamp(3rem, 6vw, 6rem); }
/* A compact invitation using the site's standard pill buttons. */
.b-invitation { border-top: 1px solid var(--line); padding-block: 2.75rem; background: var(--paper-soft); }
.b-invitation__inner { display: flex; justify-content: space-between; align-items: center; gap: 2rem; }
.b-invitation .b-eyebrow { color: var(--ink-soft); }
.b-invitation h2 { margin-top: .5rem; font: 400 clamp(2.5rem, 4vw, 3.5rem)/1.12 var(--font-display); letter-spacing: -.03em; }
.b-invitation h2 em { color: var(--blue); }
.b-invitation__actions { display: flex; flex-wrap: wrap; gap: .75rem; }
/* Only enhance after observers are installed; no-JS reading remains intact. */
.beliefs-motion .b-reveal { opacity: 0; transform: translateY(var(--reveal-dist)); transition: opacity var(--reveal-dur) var(--ease-out), transform var(--reveal-dur) var(--ease-out); transition-delay: var(--b-delay, 0ms); }
.beliefs-motion .b-reveal.is-revealed { opacity: 1; transform: none; }
.b-belief > .b-icon { transform-origin: center; }
.b-belief.is-animating > .b-icon { animation: belief-mark 1.8s ease-in-out; }
#father.is-animating > .b-icon, #humanity.is-animating > .b-icon { animation: none; }
.b-rays { opacity: 0; }
.b-belief.is-animating .b-rays { animation: belief-rays 1.8s ease-in-out; }
@keyframes belief-mark { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.055); } }
.b-father-rays { transform-origin: 32px 42px; }
#father.is-animating .b-father-rays { animation: belief-father-rays 1.8s ease-in-out; }
@keyframes belief-father-rays { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.15); } }
.b-humanity-companions { opacity: 0; }
.b-humanity-front { fill: var(--paper); }
#humanity.is-animating .b-humanity-companions { animation: belief-companions 1.8s ease-in-out; }
@keyframes belief-companions { 0%, 100% { opacity: 0; } 35%, 65% { opacity: .8; } }
@keyframes belief-rays { 0%, 100% { opacity: 0; } 35%, 65% { opacity: 1; } }
@media (max-width: 1000px) {
  .b-persons { gap: 1.5rem; }
  .b-persons .b-belief + .b-belief { padding-left: 1.5rem; }
  .b-foundation__inner { grid-template-columns: 1fr 3fr; gap: 2rem; }
}
@media (max-width: 700px) {
  .beliefs-page .section__inner, .beliefs-page .footer__inner { width: calc(100% - 2.5rem); }
  .b-section { padding-block: 3rem; }
  .b-belief h2, .b-persons h2, .b-belief--trinity h2 { font-size: 2rem; margin-block: 1rem; }
  .b-belief .b-doctrine { font: 400 .95rem/1.8 var(--font-body); }
  .b-belief > .b-icon { width: 3rem; height: 3rem; }
  .b-foundation__inner { grid-template-columns: 1fr; gap: 1.5rem; }
  .b-belief--feature .b-doctrine { color: var(--ink-soft); }
  .b-persons { grid-template-columns: 1fr; margin-top: 2.5rem; gap: 2.25rem; padding-top: 2.25rem; }
  .b-persons .b-belief + .b-belief { border-left: 0; padding-left: 0; border-top: 1px solid var(--line-light); padding-top: 2.25rem; }
  .b-god__glass { width: 100%; height: 65%; opacity: .23; -webkit-mask-image: linear-gradient(#000, transparent); mask-image: linear-gradient(#000, transparent); }
  .b-lights i { width: 27rem; }
  .b-grace__grid, .b-community__grid, .b-eternity__grid { grid-template-columns: 1fr; gap: 2.75rem; }
  .b-belief--salvation, .b-eternity .b-belief:last-child { padding-left: 0; border-left: 0; padding-top: 2.75rem; border-top: 1px solid var(--line); }
  .b-community__photo img { aspect-ratio: 4/5; }
  .b-invitation { padding-block: 2rem; }
  .b-invitation__inner { flex-direction: column; align-items: flex-start; gap: 1.25rem; }
  .b-invitation h2 { font-size: 2.5rem; }
  .b-invitation .b-eyebrow { font-size: .65rem; letter-spacing: .1em; }
}
@media (min-width: 1600px) {
  .b-hero__grid { gap: 7rem; }
}
@media (max-width: 900px) {
  .b-hero__grid { gap: 2.5rem; }
  .b-hero h1 { font-size: clamp(3rem, 6.2vw, 4rem); }
  .b-window__frame { aspect-ratio: 3 / 4; }
}
@media (min-width: 641px) and (max-width: 700px) {
  .beliefs-page .b-hero .section__inner { width: var(--container); }
}
@media (max-width: 640px) {
  .beliefs-page .header__inner { width: calc(100% - 2.5rem); }
  .b-hero { padding-top: 7.5rem; }
  .b-hero__grid { grid-template-columns: 1fr; gap: 3rem; }
  .b-hero__lede { max-width: 24rem; font-size: 1.5rem; }
  .b-hero h1 { font-size: clamp(2.5rem, 10.5vw, 4.4rem); }
  .b-window { width: 92%; margin-inline: auto; }
  .b-window__frame { aspect-ratio: 4 / 4.5; }
  .b-window__star { width: 4.5rem; right: -1rem; }
  .b-window figcaption { letter-spacing: .03em; line-height: 1.5; align-items: flex-start; }
  .b-index { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .5rem; padding-block: .65rem; }
  .b-index a { grid-column: span 2; }
  .b-index a:nth-child(4) { grid-column: 2 / span 2; }
  .b-index a { flex-direction: column; justify-content: flex-start; min-height: 3.75rem; font-size: .6875rem; line-height: 1.4; letter-spacing: .01em; gap: .4rem; text-align: center; }
  .b-index .b-icon { width: 1.15rem; height: 1.15rem; }
}
@media (max-width: 360px) {
  .beliefs-page .header__inner { gap: .5rem; }
  .beliefs-page .header__logo { gap: .4rem; }
  .beliefs-page .logo-text { font-size: .85rem; letter-spacing: 0; }
  .beliefs-page .header__actions { gap: .4rem; }
}
@media (max-width: 359px) {
  .b-index { gap: .5rem; }
  .b-index a { font-size: .6875rem; }
}
@media (prefers-reduced-motion: reduce) {
  .beliefs-motion .b-reveal { opacity: 1; transform: none; transition: none; }
  .b-lights i, .b-belief.is-animating > .b-icon, .b-belief.is-animating .b-rays { animation: none; }
  #father.is-animating .b-father-rays, #humanity.is-animating .b-humanity-companions { animation: none; }
}