/* Word of Life Assembly of God — built by DirecTech.net
   Register: valley-morning paper, Platypi + Fustat, calm motion (client asked for less interactivity). */
:root{
  --paper:#FAF6EE; --paper-2:#F3ECDF; --mist:#EDF1F4; --card:#FFFFFF;
  --ink:#0F2238; --ink-soft:#465264; --faint:#5F6A79;
  --flame:#AE4A0A; --flame-deep:#8F3D08; --glow:#E8862A; --gold:#D3841D;
  --ridge:#2B6390; --ridge-deep:#1D4A6E;
  --line:#E3DACA; --line-2:#D6CCBA;
  --shell:min(1220px,91vw);
  --r:20px; --r-sm:13px;
  --serif:"Platypi",Georgia,"Times New Roman",serif;
  --sans:"Fustat",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--paper)}
html.nav-open{overflow:hidden}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:clamp(16px,.45vw + 14.6px,17.5px);line-height:1.7;overflow-x:hidden}
img,video,svg{max-width:100%;display:block}
img{height:auto}
a{color:inherit}
h1,h2,h3,h4,h5{margin:0;font-weight:500;line-height:1.05}
p{margin:0 0 1.1em}
figure,blockquote,dl,dd,ul,ol{margin:0}
.shell{width:var(--shell);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
a[href^="mailto:"]{overflow-wrap:anywhere}

/* ---------- type ---------- */
.serif{font-family:var(--serif)}
.h-xl{font-family:var(--serif);font-weight:500;font-size:clamp(42px,5.1vw,82px);line-height:.98;letter-spacing:-.022em}
.h-lg{font-family:var(--serif);font-weight:500;font-size:clamp(38px,5vw,70px);line-height:1.02;letter-spacing:-.018em}
.h-md{font-family:var(--serif);font-weight:500;font-size:clamp(30px,3.6vw,50px);line-height:1.06;letter-spacing:-.012em}
.h-sm{font-family:var(--serif);font-weight:500;font-size:clamp(22px,2vw,28px);line-height:1.18}
.h-xl em,.h-lg em,.h-md em{font-style:italic;font-weight:400;color:var(--flame)}
.lead{font-size:clamp(17px,1.25vw,20px);line-height:1.68;color:var(--ink-soft);max-width:58ch}
.muted{color:var(--ink-soft)}
.kicker{display:inline-flex;align-items:center;gap:.65rem;margin:0 0 1.25rem;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--flame)}
.kicker::before{content:"";width:28px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--glow),var(--flame));
  transform-origin:left;transform:scaleX(0);transition:transform .8s var(--ease) .15s}
.kicker.in::before,.in .kicker::before{transform:scaleX(1)}
.center{text-align:center}.center .kicker{justify-content:center}

/* ---------- ambient light (calm, behind everything) ---------- */
.ambient{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ambient i{position:absolute;display:block;border-radius:50%;filter:blur(80px);opacity:.55;
  animation:drift 34s ease-in-out infinite alternate;will-change:transform}
.ambient i:nth-child(1){width:48vw;height:48vw;left:-14vw;top:-12vw;background:radial-gradient(circle,#F6D2A2,transparent 66%)}
.ambient i:nth-child(2){width:40vw;height:40vw;right:-12vw;top:30vh;background:radial-gradient(circle,#CFE0EC,transparent 66%);animation-duration:42s;animation-delay:-9s}
.ambient i:nth-child(3){width:36vw;height:36vw;left:24vw;bottom:-16vw;background:radial-gradient(circle,#F3C9A0,transparent 66%);animation-duration:47s;animation-delay:-18s;opacity:.42}
.ambient b{position:absolute;width:520px;height:520px;left:0;top:0;border-radius:50%;
  background:radial-gradient(circle,rgba(232,134,42,.13),transparent 62%);transform:translate3d(-999px,-999px,0);transition:opacity .6s}
@keyframes drift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(3vw,-3vh,0) scale(1.08)}100%{transform:translate3d(-2vw,4vh,0) scale(.95)}}
main,header,footer,.callbar{position:relative;z-index:2}

/* drifting embers: a few soft sparks rising from the logo's flame, very slow */
.embers{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.embers span{position:absolute;bottom:-12px;width:6px;height:6px;border-radius:50%;
  background:radial-gradient(circle,#F3A14B 0,rgba(232,134,42,.55) 45%,transparent 72%);
  opacity:0;animation:rise 16s linear infinite}
@keyframes rise{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:.75}70%{opacity:.4}100%{transform:translate3d(var(--dx,30px),-78vh,0);opacity:0}}

/* ---------- progress + nav ---------- */
.prog{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,var(--glow),var(--flame),var(--ridge));z-index:80}
.navbg{position:fixed;top:0;left:0;right:0;height:78px;z-index:59;background:rgba(250,246,238,.9);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);
  opacity:0;transform:translateY(-100%);transition:opacity .4s,transform .4s}
body.is-scrolled .navbg{opacity:1;transform:none}
.nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;gap:1.2rem;
  width:var(--shell);margin-inline:auto;height:78px}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;flex:0 0 auto}
.brand img{width:50px;height:50px}
.brand b{font-family:var(--serif);font-weight:500;font-size:19px;line-height:1.05;display:block}
.brand small{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--flame);font-weight:800;margin-top:4px}
.links{display:flex;align-items:center;gap:1.35rem;margin-left:auto}
.links>a,.dd>button{font:600 14.5px/1 var(--sans);color:var(--ink-soft);text-decoration:none;background:none;border:0;
  padding:15px 0;min-height:44px;cursor:pointer;position:relative;transition:color .25s;display:inline-flex;align-items:center;gap:.35rem}
.links>a::after,.dd>button::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1.5px;border-radius:2px;
  background:var(--flame);transform:scaleX(0);transform-origin:right;transition:transform .3s}
.links>a:hover,.links>a[aria-current],.dd:hover>button,.dd>button[aria-current]{color:var(--ink)}
.links>a:hover::after,.links>a[aria-current]::after,.dd>button[aria-current]::after{transform:scaleX(1);transform-origin:left}
.dd{position:relative}
.dd svg{transition:transform .3s}
.dd:hover svg,.dd.open svg{transform:rotate(180deg)}
.dd .menu{position:absolute;top:100%;left:-18px;min-width:230px;background:var(--card);border-radius:var(--r-sm);
  box-shadow:0 22px 48px -22px rgba(15,34,56,.35),0 0 0 1px var(--line);padding:.55rem;display:grid;
  opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .25s,transform .25s,visibility .25s}
.dd:hover .menu,.dd:focus-within .menu,.dd.open .menu{opacity:1;visibility:visible;transform:none}
.dd .menu a{display:block;padding:.62rem .85rem;border-radius:9px;text-decoration:none;font-size:15px;font-weight:600;color:var(--ink)}
.dd .menu a:hover{background:var(--paper)}
.dd .menu a small{display:block;font-weight:500;font-size:13px;color:var(--faint)}
.nav .btn{padding:.78rem 1.25rem;font-size:14px}
.burger{display:none;margin-left:auto;background:var(--card);border:1px solid var(--line);color:var(--ink);
  width:46px;height:46px;cursor:pointer;padding:0;border-radius:var(--r-sm);align-items:center;justify-content:center}
.burger span{display:block;width:18px;height:1.6px;background:currentColor;position:relative;transition:background .2s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:1.6px;background:currentColor;transition:transform .3s,top .3s}
.burger span::before{top:-6px}.burger span::after{top:6px}
html.nav-open .burger span{background:transparent}
html.nav-open .burger span::before{top:0;transform:rotate(45deg)}
html.nav-open .burger span::after{top:0;transform:rotate(-45deg)}
.drawer{display:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font:800 15px/1 var(--sans);
  letter-spacing:.01em;text-decoration:none;cursor:pointer;padding:1.05rem 1.7rem;border-radius:100px;border:0;min-height:48px;
  transition:transform .35s var(--ease),background .3s,box-shadow .3s,color .3s}
.btn-flame{background:var(--flame);color:#fff;box-shadow:0 8px 20px -10px rgba(185,80,12,.7)}
.btn-flame:hover{background:var(--flame-deep);transform:translateY(-2px);box-shadow:0 14px 28px -12px rgba(185,80,12,.75)}
.btn-line{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn-line:hover{box-shadow:inset 0 0 0 1.5px var(--flame);color:var(--flame);transform:translateY(-2px)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:#1B3557;transform:translateY(-2px)}
.btn .ar{transition:transform .3s}
.btn:hover .ar{transform:translateX(4px)}
.tlink{font-weight:800;color:var(--flame);text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 0;min-height:40px}
.tlink:hover{color:var(--flame-deep)}
.tlink:hover .ar{transform:translateX(4px)}
.tlink .ar{transition:transform .3s}

/* ---------- reveals ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}.reveal[data-d="2"]{transition-delay:.16s}.reveal[data-d="3"]{transition-delay:.24s}
.reveal[data-d="4"]{transition-delay:.32s}.reveal[data-d="5"]{transition-delay:.4s}.reveal[data-d="6"]{transition-delay:.48s}
.mask{display:block;overflow:hidden;padding:.06em .08em .14em;margin:-.06em -.08em -.14em}
.mask>span{display:block;transform:translateY(108%);transition:transform 1.15s var(--ease)}
.mask.in>span,.in .mask>span{transform:none}
.mask:nth-child(2)>span{transition-delay:.12s}.mask:nth-child(3)>span{transition-delay:.24s}

/* ---------- sections ---------- */
section{padding:clamp(3.2rem,6.5vh,5rem) 0;position:relative}
.band-mist{background:linear-gradient(180deg,rgba(237,241,244,0),var(--mist) 14%,var(--mist) 86%,rgba(237,241,244,0))}
.mid{max-width:70ch;margin-inline:auto;text-align:center}
.mid .kicker{justify-content:center}
.mid .lead{margin-inline:auto}
.headrow{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:2.4rem}
.headrow>div{max-width:40ch}

/* ridge divider — the Sequatchie Valley ridgelines from their logo */
.ridges{position:relative;height:clamp(70px,9vw,120px);margin:0;pointer-events:none;overflow:hidden}
.ridges svg{position:absolute;left:-12%;width:124%;height:100%;bottom:0}
.ridges .r3{fill:#C3D5E3;opacity:.55}.ridges .r2{fill:#D6E2EB;opacity:.8}.ridges .r1{fill:var(--to,var(--mist))}
footer .ridges{--to:var(--paper-2);background:var(--paper)}
.ridges .sun{fill:url(#sunG)}
.ridges g{transition:transform .2s linear}

/* ---------- hero ---------- */
.hero{padding:clamp(7.4rem,15vh,10rem) 0 clamp(2.4rem,5vh,4rem);overflow:visible}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.hero h1{margin-bottom:1.5rem}
.hero .lead{margin-bottom:2.1rem}
.cta{display:flex;gap:.75rem;flex-wrap:wrap}
.trust{display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:2.3rem;padding-top:1.6rem;border-top:1px solid var(--line);font-size:14.5px;color:var(--ink-soft)}
.trust span{display:flex;align-items:center;gap:.5rem}
.trust svg{color:var(--flame);flex:0 0 auto}
.panel{position:relative;will-change:transform}
.pane{position:relative;border-radius:calc(var(--r) + 6px);overflow:hidden;aspect-ratio:4/3.3;background:var(--paper-2);
  box-shadow:0 34px 70px -34px rgba(15,34,56,.45),0 0 0 1px var(--line);isolation:isolate;clip-path:inset(0 round calc(var(--r) + 6px))}
.pane img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.6s ease;
  filter:saturate(1.05) contrast(1.02)}
.pane img.on{opacity:1;animation:kb 14s ease-in-out forwards}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.1)}}
.pane::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(195deg,rgba(250,246,238,.14),transparent 40%,rgba(15,34,56,.18))}
.pane .dots{position:absolute;z-index:3;right:16px;top:16px;display:flex;gap:6px}
.pane .dots button{width:40px;height:40px;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}
.pane .dots button i{display:block;width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 0 1px rgba(15,34,56,.2);transition:background .3s,transform .3s}
.pane .dots button.on i{background:#fff;transform:scale(1.3)}
.nextcard{position:absolute;left:-26px;bottom:-26px;z-index:4;background:var(--card);border-radius:var(--r-sm);
  padding:1.1rem 1.25rem 1.15rem;box-shadow:0 22px 44px -20px rgba(15,34,56,.42),0 0 0 1px var(--line);width:min(310px,82%)}
.nextcard .lbl{display:flex;align-items:center;gap:.5rem;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--flame);font-weight:800;margin-bottom:.4rem}
.nextcard .lbl i{width:8px;height:8px;border-radius:50%;background:var(--glow);box-shadow:0 0 0 0 rgba(232,134,42,.6);animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(232,134,42,.55)}80%,100%{box-shadow:0 0 0 10px rgba(232,134,42,0)}}
.nextcard strong{display:block;font-family:var(--serif);font-weight:500;font-size:21px;line-height:1.2}
.nextcard small{display:block;color:var(--ink-soft);font-size:14px;margin-top:.15rem}
.clock{display:flex;gap:.9rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--line)}
.clock div{min-width:0}
.clock b{display:block;font-family:var(--serif);font-weight:500;font-size:26px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.clock span{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:700;margin-top:.3rem}

/* ---------- times rail ---------- */
.rail{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line);margin-top:clamp(3rem,6vh,4.5rem)}
.rail>div{padding:2rem 1.4rem;text-align:center;position:relative}
.rail>div+div::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:var(--line)}
.rail b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(36px,4vw,54px);line-height:1;color:var(--flame);font-variant-numeric:tabular-nums}
.rail b small{font-size:.5em;color:var(--ink);margin-left:.15em}
.rail span{display:block;margin-top:.6rem;font-size:13.5px;color:var(--ink-soft);line-height:1.5;white-space:nowrap}

/* ---------- service board (times) ---------- */
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:.6rem;margin-top:2.2rem}
.day{background:var(--card);border-radius:var(--r-sm);box-shadow:0 0 0 1px var(--line);padding:1rem .8rem 1.1rem;text-align:center;min-width:0;
  transition:box-shadow .4s,transform .4s var(--ease)}
.day h3{font:800 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:.8rem}
.day.has h3{color:var(--flame)}
.day.today{box-shadow:0 0 0 2px var(--glow),0 18px 36px -22px rgba(185,80,12,.5);transform:translateY(-4px)}
.day .ev{display:block;font-size:13.5px;line-height:1.35;margin-top:.55rem;color:var(--ink)}
.day .ev b{display:block;font-family:var(--serif);font-weight:500;font-size:19px;color:var(--ink)}
.day .none{font-size:13px;color:var(--faint)}
.day .tag{display:inline-block;margin-top:.7rem;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--flame);background:rgba(232,134,42,.12);padding:.3rem .55rem;border-radius:100px}

/* ---------- photo mosaic ---------- */
.mosaic{display:grid;grid-template-columns:1.25fr .85fr .9fr;gap:1rem;align-items:stretch}
.mosaic .col{display:flex;flex-direction:column;gap:1rem;min-width:0}
.ph{position:relative;border-radius:var(--r);overflow:hidden;background:var(--paper-2);box-shadow:0 0 0 1px var(--line);margin:0}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.ph:hover img{transform:scale(1.035)}
.ph figcaption{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,.94);color:var(--ink);font-size:13px;font-weight:700;
  padding:.4rem .75rem;border-radius:100px;box-shadow:0 6px 16px -8px rgba(15,34,56,.4)}
.ph.nat img{height:auto;object-fit:contain}

/* ---------- cards ---------- */
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.tile{background:var(--card);border-radius:var(--r);padding:2rem 1.8rem;box-shadow:0 0 0 1px var(--line);min-width:0;
  transition:transform .5s var(--ease),box-shadow .5s}
.tile:hover{transform:translateY(-5px);box-shadow:0 24px 46px -26px rgba(15,34,56,.38),0 0 0 1px var(--line)}
.tile h3{margin-bottom:.6rem}
.tile p{margin:0;color:var(--ink-soft);font-size:15.5px;line-height:1.65}
.tile .num{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(232,134,42,.13);
  color:var(--flame);font-weight:800;font-size:14px;margin-bottom:1rem;font-variant-numeric:tabular-nums}
.mcard{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);overflow:hidden;box-shadow:0 0 0 1px var(--line);
  text-decoration:none;color:inherit;min-width:0;transition:transform .5s var(--ease),box-shadow .5s}
.mcard:hover{transform:translateY(-6px);box-shadow:0 26px 50px -28px rgba(15,34,56,.42),0 0 0 1px var(--line)}
.mcard .im{aspect-ratio:4/3;overflow:hidden;background:var(--paper-2)}
.mcard .im img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mcard:hover .im img{transform:scale(1.05)}
.mcard .bd{padding:1.4rem 1.5rem 1.6rem;flex:1;display:flex;flex-direction:column}
.mcard .when{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--ridge);margin-bottom:.55rem}
.mcard h3{margin-bottom:.5rem}
.mcard p{margin:0 0 1rem;color:var(--ink-soft);font-size:15.5px;line-height:1.6}
.mcard .tlink{margin-top:auto}

/* ---------- pastors ---------- */
.pgrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.portrait{border-radius:var(--r);overflow:hidden;box-shadow:0 30px 60px -32px rgba(15,34,56,.45),0 0 0 1px var(--line);background:var(--paper-2);margin:0}
.portrait img{width:100%;height:auto}
.person{display:grid;grid-template-columns:minmax(220px,.75fr) 1.25fr;gap:clamp(1.6rem,4vw,3.6rem);align-items:start;padding:clamp(2.4rem,5vh,3.6rem) 0;border-top:1px solid var(--line)}
.person:first-of-type{border-top:0}
.person .role{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:var(--flame);margin-bottom:.7rem}
.person h2{margin-bottom:1.1rem}
.person p{color:var(--ink-soft)}
.person .portrait{position:sticky;top:110px}

/* ---------- pull quote ---------- */
.pull{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(23px,2.6vw,36px);line-height:1.38;margin:2.2rem auto;max-width:28ch;color:var(--ink)}
.pull span{color:var(--flame)}
.ref{display:block;font:800 12px/1 var(--sans);font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--ridge);margin-top:1.1rem}

/* ---------- sermons ---------- */
.watch{display:grid;grid-template-columns:1.35fr .65fr;gap:1.6rem;align-items:start}
.player{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#0F2238;box-shadow:0 30px 60px -32px rgba(15,34,56,.5)}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.player button{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:#0F2238}
.player button img{width:100%;height:100%;object-fit:cover;opacity:.92;transition:opacity .4s,transform 1.2s var(--ease)}
.player button:hover img{opacity:1;transform:scale(1.03)}
.player .play{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:rgba(255,255,255,.95);
  display:grid;place-items:center;box-shadow:0 16px 36px -10px rgba(0,0,0,.5);transition:transform .35s var(--ease)}
.player button:hover .play{transform:scale(1.08)}
.player .play::after{content:"";border-left:22px solid var(--flame);border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:6px}
.player .cap{position:absolute;left:16px;bottom:16px;right:16px;display:flex;justify-content:space-between;gap:1rem;align-items:flex-end;pointer-events:none}
.player .cap span{background:rgba(255,255,255,.95);color:var(--ink);font-weight:800;font-size:14px;padding:.45rem .85rem;border-radius:100px}
.vlist{display:grid;gap:.6rem}
.vrow{display:grid;grid-template-columns:118px 1fr;gap:1rem;align-items:center;background:var(--card);border-radius:var(--r-sm);padding:.6rem;
  text-decoration:none;color:inherit;box-shadow:0 0 0 1px var(--line);transition:transform .35s var(--ease),box-shadow .35s;min-width:0;border:0;font:inherit;text-align:left;cursor:pointer;width:100%}
.vrow:hover,.vrow.on{transform:translateX(4px);box-shadow:0 14px 30px -18px rgba(15,34,56,.38),0 0 0 1.5px var(--glow)}
.vrow .th{display:block;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:var(--paper-2)}
.vrow .th img{width:100%;height:100%;object-fit:cover}
.vrow b{display:block;font-size:15px;line-height:1.3;font-weight:800}
.vrow small{display:block;color:var(--faint);font-size:13px;margin-top:.2rem}

/* ---------- give band ---------- */
.giveband{display:grid;grid-template-columns:1.15fr .85fr;gap:0;border-radius:calc(var(--r) + 8px);overflow:hidden;background:var(--card);box-shadow:0 0 0 1px var(--line)}
.giveband .copy{padding:clamp(2.2rem,5vw,4rem)}
.giveband .ph{border-radius:0;box-shadow:none;min-height:100%}
.checks{list-style:none;padding:0;margin:1.4rem 0 2rem;display:grid;gap:.7rem}
.checks li{display:flex;gap:.7rem;align-items:flex-start;color:var(--ink-soft);font-size:16px;line-height:1.55}
.checks svg{flex:0 0 auto;color:var(--flame);margin-top:.28rem}

/* ---------- map ---------- */
.findus{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(1.8rem,4vw,3.6rem);align-items:stretch}
.mapcard{position:relative;border-radius:var(--r);overflow:hidden;background:linear-gradient(180deg,#F7EBDD 0%,#EEF1F2 55%,#E3ECF2 100%);
  box-shadow:0 0 0 1px var(--line);min-height:380px;display:flex;flex-direction:column;justify-content:flex-end}
.mapcard svg.valley{position:absolute;inset:0;width:100%;height:100%}
.mapcard .pin{position:absolute;left:52%;top:47%;transform:translate(-50%,-100%);text-align:center;z-index:2}
.mapcard .pin svg{width:44px;height:56px;margin:0 auto;filter:drop-shadow(0 10px 12px rgba(15,34,56,.35));animation:bob 4s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.mapcard .pin i{display:block;width:26px;height:8px;border-radius:50%;background:rgba(15,34,56,.18);margin:-2px auto 0;animation:shadow 4s ease-in-out infinite}
@keyframes shadow{0%,100%{transform:scale(1)}50%{transform:scale(.75)}}
.mapcard .lab{position:absolute;font:800 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ridge-deep);opacity:.75}
.mapcard .addr{position:relative;z-index:3;margin:1rem;background:rgba(255,255,255,.95);border-radius:var(--r-sm);padding:1rem 1.15rem;
  box-shadow:0 14px 30px -18px rgba(15,34,56,.4);display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.mapcard .addr b{display:block;font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.2}
.mapcard .addr span{color:var(--ink-soft);font-size:14.5px}
.facts{list-style:none;padding:0;margin:1.8rem 0 0}
.facts li{display:grid;grid-template-columns:150px 1fr;gap:1.2rem;padding:1rem 0;border-top:1px solid var(--line);font-size:16px;min-width:0}
.facts b{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--flame);font-weight:800;line-height:1.9}
.facts a{color:var(--ink);font-weight:700;text-decoration:none;min-height:40px;display:inline-flex;align-items:center}
.facts a:hover{color:var(--flame)}
.facts span{color:var(--ink-soft);min-width:0}

/* ---------- forms ---------- */
.formwrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4.5vw,4rem);align-items:stretch}
form.demo{display:grid;gap:1.05rem;align-content:start}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1.05rem}
label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--flame);font-weight:800;margin-bottom:.45rem}
input,select,textarea{width:100%;min-width:0;background:var(--card);border:1px solid var(--line-2);color:var(--ink);padding:.95rem 1rem;
  font:500 16px/1.4 var(--sans);border-radius:var(--r-sm);transition:border-color .3s,box-shadow .3s;min-height:50px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--flame);box-shadow:0 0 0 3px rgba(185,80,12,.14)}
input::placeholder,textarea::placeholder{color:#7D8692}
textarea{resize:vertical;min-height:140px}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23AE4A0A' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.4rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.seg{display:flex;gap:.5rem;flex-wrap:wrap}
.seg label{margin:0;cursor:pointer}
.seg input{position:absolute;opacity:0;width:1px;height:1px;min-height:0}
.seg span{display:inline-flex;align-items:center;min-height:44px;padding:.6rem 1rem;border-radius:100px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2);
  color:var(--ink);font:700 14px/1 var(--sans);letter-spacing:0;text-transform:none;transition:.25s}
.seg input:checked+span{background:var(--ink);color:#fff;box-shadow:none}
.seg input:focus-visible+span{outline:2px solid var(--flame);outline-offset:2px}
.okmsg{display:none;background:rgba(232,134,42,.1);border:1px solid rgba(185,80,12,.3);border-radius:var(--r-sm);padding:1.1rem 1.2rem;font-size:15.5px}
.okmsg.show{display:block}
.okmsg b{display:block;font-family:var(--serif);font-weight:500;font-size:20px;margin-bottom:.2rem}
.note{font-size:13.5px;color:var(--faint);margin:0}
.aside{background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);overflow:hidden;display:flex;flex-direction:column}
.aside .ph{border-radius:0;box-shadow:none;flex:1;min-height:240px}
.aside .in{padding:clamp(1.6rem,3vw,2.2rem)}

/* ---------- page head ---------- */
.phead{padding:clamp(8rem,17vh,11rem) 0 clamp(2rem,4vh,3rem);position:relative}
.phead-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.phead h1{margin-bottom:1.2rem;max-width:16ch}
.phead .ph{aspect-ratio:4/3}
.crumbs{font-size:13.5px;color:var(--faint);margin-bottom:1rem}
.crumbs a{color:var(--faint);text-decoration:none}.crumbs a:hover{color:var(--flame)}

/* events */
.evlist{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.evcard{display:grid;grid-template-columns:92px 1fr;gap:1.2rem;align-items:center;background:var(--card);border-radius:var(--r);padding:1.1rem 1.2rem;
  box-shadow:0 0 0 1px var(--line);min-width:0;transition:transform .45s var(--ease),box-shadow .45s}
.evcard:hover{transform:translateY(-4px);box-shadow:0 22px 44px -26px rgba(15,34,56,.38),0 0 0 1px var(--line)}
.evdate{border-radius:var(--r-sm);background:var(--paper);box-shadow:inset 0 0 0 1px var(--line);text-align:center;padding:.7rem .3rem}
.evdate span{display:block;font:800 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--flame)}
.evdate b{display:block;font-family:var(--serif);font-weight:500;font-size:36px;line-height:1.05;margin:.15rem 0}
.evdate small{display:block;font-size:12px;color:var(--faint);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.evcard h3{font-family:var(--serif);font-weight:500;font-size:21px;line-height:1.2;margin-bottom:.25rem}
.evcard p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.5}
.evcard .soon{display:inline-block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#fff;background:var(--flame);padding:.25rem .55rem;border-radius:100px;margin-bottom:.4rem}
.filters{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.6rem}
.filters button{min-height:44px;padding:.55rem 1.1rem;border-radius:100px;border:0;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2);font:700 14px/1 var(--sans);color:var(--ink);cursor:pointer;transition:.25s}
.filters button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}

/* gallery strip */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.gal .ph{aspect-ratio:3/4}
.gal .ph.wide{grid-column:span 2;aspect-ratio:auto}

/* cta band */
.ctaband{background:var(--card);border-radius:calc(var(--r) + 10px);box-shadow:0 0 0 1px var(--line);padding:clamp(2.6rem,6vw,4.8rem);text-align:center;position:relative;overflow:hidden}
.ctaband::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 120% at 50% 118%,rgba(232,134,42,.18),transparent 62%)}
.ctaband>*{position:relative}
.ctaband h2{max-width:18ch;margin:0 auto 1.1rem}
.ctaband p{max-width:52ch;margin:0 auto 2rem;color:var(--ink-soft)}
.ctaband .cta{justify-content:center}

/* ---------- footer ---------- */
footer{margin-top:0;background:var(--paper-2);border-top:1px solid var(--line);padding:0 0 2.4rem}
footer .ridges{margin-top:-1px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.6rem;padding-top:3.2rem}
.fgrid h4{font:800 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--flame);margin-bottom:1.1rem}
.fgrid a{color:var(--ink-soft);text-decoration:none;display:flex;align-items:center;min-height:40px;font-size:15.5px;transition:color .25s}
.fgrid a:hover{color:var(--flame)}
.fgrid p{color:var(--ink-soft);font-size:15.5px}
.fgrid .t{display:block;font-size:15px;color:var(--ink-soft);line-height:1.5;margin-bottom:.7rem}
.fgrid .t b{color:var(--ink);font-weight:700;display:block}
.soc{display:flex;gap:.6rem;margin-top:1rem}
.soc a{width:44px;height:44px;justify-content:center;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--card);color:var(--ink-soft)}
.soc a:hover{background:var(--flame);color:#fff;box-shadow:none}
.fbot{display:flex;justify-content:space-between;gap:1rem 2rem;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:2.6rem;padding-top:1.5rem;font-size:14px;color:var(--faint)}
.fbot a{color:var(--ink-soft);font-weight:700}
.fbot a:hover{color:var(--flame)}
.credit a{font-weight:800;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}

/* ---------- phone call bar ---------- */
.callbar{display:none}

/* ---------- responsive ---------- */
@media(max-width:1120px){
  .links{gap:1.05rem}
  .links>a,.dd>button{font-size:14px}
  .brand b{font-size:17px}
}
@media(max-width:1020px){
  .links{display:none}
  .burger{display:flex}
  .drawer{display:block;position:fixed;left:0;top:0;width:100%;height:100vh;height:100dvh;z-index:58;background:var(--paper);
    padding:96px max(4.5vw,16px) 120px;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
  html.nav-open .drawer{opacity:1;visibility:visible}
  .drawer a{display:flex;align-items:center;min-height:52px;font-family:var(--serif);font-size:27px;font-weight:500;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line)}
  .drawer a[aria-current]{color:var(--flame)}
  .drawer .sub{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem;padding:.3rem 0 .8rem;border-bottom:1px solid var(--line)}
  .drawer .sub a{font-family:var(--sans);font-size:16px;font-weight:600;min-height:46px;border:0;color:var(--ink-soft)}
  .drawer .dbtns{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:1.4rem}
  .drawer .dbtns .btn{font-family:var(--sans);font-size:15px;border:0;color:#fff;min-height:52px}
  .drawer .dbtns .btn-line{color:var(--ink)}
  .nav .btn.hide-m{display:none}
  .hero-grid,.pgrid,.findus,.formwrap,.watch,.phead-grid{grid-template-columns:1fr}
  .panel{max-width:640px;margin-inline:auto;width:100%}
  .nextcard{left:16px;bottom:-30px}
  .grid3,.grid4{grid-template-columns:repeat(2,1fr)}
  .mosaic{grid-template-columns:1fr 1fr}
  .mosaic .col:first-child{grid-column:1/-1}
  .week{grid-template-columns:repeat(4,1fr)}
  .person{grid-template-columns:1fr}
  .person .portrait{position:relative;top:0;max-width:440px}
  .giveband{grid-template-columns:1fr}
  .giveband .ph{aspect-ratio:16/10}
  .fgrid{grid-template-columns:1fr 1fr}
  .evlist{grid-template-columns:1fr}
  .gal{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  body{padding-bottom:74px}
  .callbar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.45rem;position:fixed;left:0;right:0;bottom:0;z-index:70;
    padding:.55rem max(3vw,10px) calc(.55rem + env(safe-area-inset-bottom));background:rgba(250,246,238,.96);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .callbar a{display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:50px;border-radius:14px;text-decoration:none;
    font:800 14.5px/1 var(--sans);color:var(--ink);background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2)}
  .callbar a.pri{background:var(--flame);color:#fff;box-shadow:none}
  .rail{grid-template-columns:repeat(2,1fr)}
  .rail>div:nth-child(3)::before{display:none}
  .rail>div:nth-child(n+3){border-top:1px solid var(--line)}
  .week{grid-template-columns:repeat(2,1fr)}
  .day:last-child{grid-column:1/-1}
  .grid2,.grid3,.grid4{grid-template-columns:1fr}
  .f2{grid-template-columns:1fr}
  .facts li{grid-template-columns:1fr;gap:.15rem}
  .fgrid{grid-template-columns:1fr;gap:2rem}
  .headrow{margin-bottom:1.8rem}
  .vrow{grid-template-columns:104px 1fr}
}
@media(max-width:520px){
  .brand img{width:44px;height:44px}
  .brand b{font-size:16px}
  .brand small{font-size:12px;letter-spacing:.06em}
  .nav{gap:.6rem}
  .hero{padding-top:6.4rem}
  .mosaic{grid-template-columns:1fr}
  .mosaic .col:first-child{grid-column:auto}
  .clock{gap:.7rem}
  .clock b{font-size:23px}
  .nextcard{position:relative;left:auto;bottom:auto;width:auto;margin:-34px 12px 0}
  .rail span{white-space:normal}
  .gal{gap:.6rem}
  .mapcard{min-height:340px}
  .evcard{grid-template-columns:78px 1fr;gap:1rem;padding:1rem}
  .evdate b{font-size:30px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .reveal{opacity:1 !important;transform:none !important}
  .mask>span{transform:none !important}
  .ambient,.embers{display:none}
}
legend.lg{display:block;padding:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--flame);font-weight:800;margin-bottom:.6rem}
.when-l{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--ridge);margin:1rem 0}

.h-md+.lead,.h-lg+.lead{margin-top:1rem}
.mosaic .ph{aspect-ratio:auto !important;height:clamp(300px,33vw,500px)}
@media(max-width:1020px){.mosaic .col:first-child .ph{height:clamp(260px,52vw,460px)}}
@media(max-width:520px){.mosaic .ph{height:auto}.mosaic .ph img{height:auto}}
.ridges+.band-mist,.ridges+section.band-mist{background:linear-gradient(180deg,var(--mist),var(--mist) 86%,rgba(237,241,244,0))}
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.vcard{display:block;border:0;padding:0;background:var(--card);border-radius:var(--r-sm);overflow:hidden;box-shadow:0 0 0 1px var(--line);cursor:pointer;text-align:left;font:inherit;color:inherit;transition:transform .45s var(--ease),box-shadow .45s}
.vcard:hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(15,34,56,.4),0 0 0 1.5px var(--glow)}
.vcard .th{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--paper-2)}
.vcard .th img{width:100%;height:100%;object-fit:cover}
.vcard b{display:block;padding:.85rem 1rem 0;font-size:15px;line-height:1.3}
.vcard small{display:block;padding:.2rem 1rem .95rem;color:var(--faint);font-size:13px}
@media(max-width:1020px){.vgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.vgrid{grid-template-columns:1fr}}

.ridges svg,.mapcard svg.valley{max-width:none}
.hero h1 .mask>span{white-space:nowrap}
@media(max-width:380px){.hero h1 .mask>span{white-space:normal}}
.phead .ph.nat{aspect-ratio:auto;background:none;box-shadow:none}
.phead .ph.nat img{border-radius:var(--r);box-shadow:0 24px 50px -28px rgba(15,34,56,.45)}
main>section:last-child{padding-bottom:clamp(2.5rem,6vh,4rem)}
.gal .ph.wide img{position:absolute;inset:0}
.gal .ph.wide{position:relative;min-height:240px}
@media(max-width:760px){section{padding:clamp(3rem,7vh,4.5rem) 0}}
.crumbs a{display:inline-block;padding:11px 0}
.fbot .credit a,.note a{display:inline-block;padding:10px 0}
@media(max-width:1020px){.rail span{white-space:normal}}
@media(max-width:760px){.note,.crumbs,.rail span{font-size:14px}}
