/* v3.6 About slider + history heading (draft) */
.page-head h1.history{font-size:clamp(1.6rem,4.2vw,2.6rem);line-height:1.22;max-width:44rem;margin-inline:auto}
.sl{padding:clamp(2.5rem,6vw,4.5rem) 0;background:var(--ink)}
.sl-view{overflow:hidden;width:min(64rem,calc(100% - 2*var(--gutter)));margin:0 auto}
.sl-track{display:flex;gap:0;will-change:transform}
.sl-slide{flex:0 0 100%;padding:0 .6rem;box-sizing:border-box}
@media (min-width:760px){.sl-slide{flex-basis:33.3333%}}
.sl-slide img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:18px;border:1px solid var(--line);box-shadow:0 14px 40px rgba(0,0,0,.45)}
.sl-ctl{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.4rem}
.sl-btn{width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--gold-lt);font-size:1.3rem;cursor:pointer}
.sl-btn:hover,.sl-btn:focus-visible{background:rgba(212,175,55,.12);outline:2px solid var(--gold);outline-offset:2px}
.sl-dots{display:flex;gap:.5rem}
.sl-dots button{width:.7rem;height:.7rem;padding:0;border-radius:50%;border:1px solid var(--gold);background:transparent;cursor:pointer}
.sl-dots button[aria-current="true"]{background:var(--gold)}
.sl-dots button:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
@media (prefers-reduced-motion:no-preference){.sl-track.anim{transition:transform .5s ease}}
/* v3.8: justified history heading (last line centred); wider measure on desktop so justified lines don't gap */
.page-head h1.history{text-align:justify;text-align-last:center;hyphens:auto;-webkit-hyphens:auto;text-wrap:wrap}
@media (min-width:900px){.page-head h1.history{max-width:none;width:min(48rem,calc(100vw - 4rem));margin-inline:calc(50% - min(24rem,50vw - 2rem));font-size:2.5rem}}
@media (max-width:599px){.page-head h1.history{font-size:1.32rem;line-height:1.32}}
/* v3.23: 15-photo gallery with mixed portrait/landscape - whole photo shown (no face cropping) on a dark frame */
.sl-slide img{aspect-ratio:4/3;object-fit:contain;object-position:center;background:#05070c}
/* v3.28 White Sunday slider heading */
.sl-head{text-align:center;margin-bottom:clamp(1.4rem,3vw,2rem)}
.sl-head h2{margin:.3rem 0 0}
.sl-ws+.sl-parish{padding-top:0}
/* v3.31 White Sunday heading is just the date under the gold label */
.sl-head h2{white-space:nowrap}
/* v3.31 merged Faifeʻau ma le Faletua row: names wrap only after the & */
.facts .pair .nm{white-space:nowrap}
.facts .pair dd{overflow-wrap:anywhere}
/* v3.35: every slide fills the same 4:3 frame (as the native 4:3 gallery photos 02-05 do); per-slide focal point via --op so heads aren't cut */
.sl-slide img{aspect-ratio:4/3;object-fit:cover;object-position:var(--op,50% 40%);background:#05070c}
/* v3.37: founding statement is now two paragraphs; centred (matches the centred page head), no justify word gaps, text-wrap:pretty avoids a one-word last line */
.page-head h1.history,.page-head p.history{text-align:left;text-align-last:auto;hyphens:manual;-webkit-hyphens:manual;text-wrap:pretty;font-family:var(--serif);font-weight:500;color:var(--cream);letter-spacing:.005em;font-size:clamp(1.18rem,3.4vw,1.9rem);line-height:1.36;max-width:44rem;width:auto;margin-inline:auto}
.page-head p.history-2{margin-top:1.1em}
@media (min-width:900px){.page-head h1.history,.page-head p.history{width:auto;max-width:46rem;margin-inline:auto;font-size:1.9rem}}
@media (max-width:599px){.page-head h1.history,.page-head p.history{font-size:1.18rem;line-height:1.4}}
/* v3.38: statement + gold ABOUT label left-aligned at all widths (label shares the paragraphs' column so their left edges line up) */
.page-head .kicker-history{text-align:left;max-width:44rem;margin-inline:auto}
@media (min-width:900px){.page-head .kicker-history{max-width:46rem}}
/* v3.46 pause button: on narrow screens dots get their own row above pause/prev/next (no overflow) */
@media (max-width:600px){.sl-ctl{flex-wrap:wrap;row-gap:.8rem}.sl-dots{order:-1;flex-basis:100%;justify-content:center;flex-wrap:wrap}}