/* Super Foods of the Bible · site styles
   Palette taken from the film's grade: lamp-lit umber, barley, olive-oil gold, pomegranate. */

:root{
  --lamp:#17110c;
  --umber:#221811;
  --umber-2:#2b1f16;
  --barley:#e9ddc2;
  --linen:#c2b497;
  --smoke:#978a75;
  --gold:#c9a04a;
  --gold-hi:#e0bb68;
  --pom:#a23b33;
  --wood:#3b291b;
  --serif:"Alegreya", Georgia, "Times New Roman", serif;
  --sans:"Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --gutter:clamp(16px, 5vw, 80px);
  --section:clamp(88px, 12vw, 176px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --rule:rgba(233,221,194,.13);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--lamp)}
[tabindex="-1"]:focus{outline:none}
body{margin:0;background:var(--lamp);color:var(--barley);font-family:var(--sans);font-size:1.125rem;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
@supports (overflow:clip){body{overflow-x:clip}}
img{display:block;max-width:100%}
picture{display:contents}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;margin:0;letter-spacing:-.01em;text-wrap:balance}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
blockquote,figure{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
cite{font-style:normal}
[hidden]{display:none!important}

.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-64px;z-index:100;background:var(--gold);color:#1a120b;padding:10px 16px;border-radius:3px;font-weight:600;text-decoration:none;transition:top .2s}
.skip:focus{top:16px}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.eyebrow{margin:0 0 1rem;font:600 .8125rem/1.2 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.lord{font-size:.8em;letter-spacing:.06em}

/* Film grain over everything, like the Vision3 stills */
body::after{content:"";position:fixed;inset:-50%;z-index:60;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.4s steps(5) infinite;will-change:transform}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-2%,5%)}80%{transform:translate(4%,-1%)}100%{transform:translate(0,0)}}
@media (prefers-reduced-motion: reduce),(max-width:700px){body::after{animation:none}}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:1em 1.7em;border:1px solid transparent;border-radius:3px;font:600 1rem/1 var(--sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;transition:background-color .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease)}
.btn--give{background:var(--gold);color:#1a120b}
.btn--give:hover{background:var(--gold-hi)}
.btn--ghost{background:rgba(23,17,12,.18);color:var(--barley);border-color:rgba(233,221,194,.5)}
.btn--ghost:hover{background:rgba(233,221,194,.1);border-color:rgba(233,221,194,.8)}
.btn--sm{min-height:40px;padding:.7em 1.2em;font-size:.9375rem}
.btn--lg{min-height:56px;padding:1.15em 2.3em;font-size:1.0625rem}
.tri{flex:none;width:0;height:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}

/* ---------- Header ---------- */
.bar{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;align-items:center;gap:24px;padding:14px var(--gutter);transition:background-color .35s var(--ease),box-shadow .35s var(--ease),transform .45s var(--ease)}
.bar.is-solid{background:rgba(23,17,12,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(233,221,194,.08)}
.bar.is-hidden{transform:translateY(-110%)}
.bar::before{content:"";position:absolute;inset:0 0 auto;height:calc(100% + 110px);z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(23,17,12,.84) 0%,rgba(23,17,12,.68) 30%,rgba(23,17,12,.4) 58%,rgba(23,17,12,.15) 80%,rgba(23,17,12,0) 100%);transition:opacity .35s var(--ease)}
.bar.is-solid::before{opacity:0}
.bar__mark{font-family:var(--serif);font-weight:500;font-size:1.25rem;line-height:1;text-decoration:none;white-space:nowrap;opacity:0;transition:opacity .35s var(--ease)}
.bar.is-solid .bar__mark,.static .bar__mark,.no-js .bar__mark{opacity:1}
.bar__nav{display:flex;gap:28px;margin-left:auto}
.bar__nav a{font-size:.9375rem;font-weight:500;color:var(--barley);text-decoration:none;text-shadow:0 1px 2px rgba(0,0,0,.5);transition:color .2s}
.bar__nav a:hover{color:var(--gold-hi)}
.bar .btn{margin-left:8px}
@media (max-width:820px){.bar__nav{display:none}.bar .btn{margin-left:auto}}

/* ---------- Opening: dawn at the house, then through the kitchen window (the film's own first shot) ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:540px;overflow:hidden;background:var(--lamp);isolation:isolate}
.hero__shot{position:absolute;inset:0;overflow:hidden}
.hero__shot img{width:100%;height:100%;object-fit:cover;will-change:transform}
.hero__shot--a{z-index:0}
.hero__shot--a img{object-position:50% 50%}
.hero__shot--b{z-index:1;opacity:0;visibility:hidden}
.hero__shot--b img{object-position:50% 30%}
.hero__scrim{position:absolute;inset:0;pointer-events:none}
.hero__scrim--a{z-index:2;background:linear-gradient(0deg,rgba(23,17,12,.88) 0%,rgba(23,17,12,.52) 30%,rgba(23,17,12,0) 60%),linear-gradient(90deg,rgba(23,17,12,.5) 0%,rgba(23,17,12,0) 50%)}
.hero__scrim--b{z-index:2;opacity:0;visibility:hidden;background:linear-gradient(0deg,rgba(23,17,12,.9) 0%,rgba(23,17,12,.6) 32%,rgba(23,17,12,0) 60%),linear-gradient(90deg,rgba(23,17,12,.5) 0%,rgba(23,17,12,0) 55%)}
.hero__wash{position:absolute;inset:0;z-index:3;background:#f3d9a8;opacity:0;visibility:hidden;pointer-events:none}
.hero__flare{position:absolute;z-index:3;left:73%;top:49%;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;border-radius:50%;background:radial-gradient(closest-side,#fff8ea 0%,rgba(255,236,198,.92) 20%,rgba(250,214,150,.45) 46%,rgba(250,214,150,0) 100%);opacity:0;visibility:hidden;pointer-events:none;transform:scale(.1)}
.hero__title{position:absolute;z-index:4;left:var(--gutter);bottom:clamp(64px,12vh,128px);max-width:min(56vw,720px)}
.hero__pre{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.1vw,1.75rem);color:var(--barley);text-shadow:0 1px 3px rgba(0,0,0,.55);margin:0 0 .35em}
.hero__h1{font-size:clamp(2.9rem,7vw,6.25rem);line-height:.98;letter-spacing:-.02em;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.hero__tag{font-weight:500;font-size:clamp(1.0625rem,1.5vw,1.25rem);letter-spacing:.02em;margin:1.3em 0 .2em}
.hero__by{color:var(--barley);font-size:1rem;text-shadow:0 1px 3px rgba(0,0,0,.55);margin:0}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:2rem}
.hero__after{position:absolute;z-index:4;left:var(--gutter);bottom:clamp(64px,12vh,128px);max-width:22ch;margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(1.75rem,3.4vw,3rem);line-height:1.15;text-shadow:0 2px 24px rgba(0,0,0,.45);opacity:0;visibility:hidden}
.hero__cue{position:absolute;z-index:4;left:50%;bottom:22px;width:1px;height:44px;background:linear-gradient(rgba(233,221,194,0),rgba(233,221,194,.7));transform-origin:top;animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);opacity:0}30%{opacity:1}100%{transform:scaleY(1);opacity:0}}
.static .hero__shot--b,.static .hero__wash,.static .hero__flare,.static .hero__scrim--b,.static .hero__after,.static .hero__cue,
.no-js .hero__shot--b,.no-js .hero__wash,.no-js .hero__flare,.no-js .hero__scrim--b,.no-js .hero__after,.no-js .hero__cue{display:none}
/* Phones: the house frames up on Chuck's window; the title sits low and centered, clear of the "Built on Wix" tag */
@media (max-width:760px){
  .hero__shot--a img{object-position:78% 50%}
  .hero__shot--b img{object-position:38% 50%}
  .hero__scrim--a{background:linear-gradient(0deg,rgba(23,17,12,.93) 0%,rgba(23,17,12,.62) 36%,rgba(23,17,12,0) 64%)}
  .hero__scrim--b{background:linear-gradient(0deg,rgba(23,17,12,.93) 0%,rgba(23,17,12,.66) 38%,rgba(23,17,12,0) 66%)}
  .hero__title{right:var(--gutter);bottom:max(10vh,84px);max-width:none;text-align:center}
  .hero__actions{justify-content:center}
  .hero__after{right:var(--gutter);max-width:none;text-align:center;bottom:max(12vh,96px)}
  .hero__cue{display:none}
}
@media (max-width:760px) and (max-height:700px){
  .hero__h1{font-size:2.5rem}
  .hero__actions{margin-top:1.25rem}
  .hero__title{bottom:78px}
}
@media (max-width:760px) and (max-height:600px){.hero__h1{font-size:2.2rem}.hero__tag{margin-top:.8em}}
/* Phones on their side: the hero fits the short screen, the title sits low left, clear of the Wix tag */
@media (max-height:500px) and (min-aspect-ratio:5/4){
  .hero{min-height:0}
  .hero__title{right:auto;bottom:18px;max-width:62vw;text-align:left}
  .hero__actions{justify-content:flex-start;margin-top:.8rem}
  .hero__pre{font-size:1rem}
  .hero__h1{font-size:2.3rem}
  .hero__tag{margin-top:.6em;font-size:1rem}
  .hero__by{font-size:.875rem}
  .hero__after{right:auto;bottom:18px;max-width:30ch;font-size:1.5rem;text-align:left}
  .hero__cue{display:none}
}

/* ---------- First look: the player ---------- */
.first{padding:var(--section) var(--gutter);background:var(--lamp)}
.first__head{max-width:56rem;margin-bottom:clamp(32px,4.5vw,64px)}
.first h2{font-size:clamp(2.25rem,5vw,4.5rem);margin-bottom:.4em}
.first__head p{max-width:46ch;color:var(--linen);font-size:clamp(1.0625rem,1.5vw,1.3125rem)}
.player{position:relative;aspect-ratio:16/9;max-width:1280px;margin:0 auto;overflow:hidden;background:#000;box-shadow:0 40px 90px rgba(0,0,0,.55)}
.player__reel{position:absolute;inset:0}
.reel__shot{position:absolute;inset:0;margin:0;overflow:hidden;opacity:0;animation:reel 30s linear infinite}
.reel__shot img{width:100%;height:100%;object-fit:cover;animation:reelpush 30s linear infinite}
.reel__shot::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 36%),radial-gradient(ellipse 80% 75% at 50% 50%,rgba(0,0,0,0) 58%,rgba(0,0,0,.4) 100%)}
.reel__shot:nth-child(2),.reel__shot:nth-child(2) img{animation-delay:6s}
.reel__shot:nth-child(3),.reel__shot:nth-child(3) img{animation-delay:12s}
.reel__shot:nth-child(4),.reel__shot:nth-child(4) img{animation-delay:18s}
.reel__shot:nth-child(5),.reel__shot:nth-child(5) img{animation-delay:24s}
@keyframes reel{0%{opacity:0}4%{opacity:1}20%{opacity:1}24%{opacity:0}100%{opacity:0}}
@keyframes reelpush{0%{transform:scale(1.02)}24%{transform:scale(1.1)}100%{transform:scale(1.1)}}
.player__reel.is-paused .reel__shot,.player__reel.is-paused .reel__shot img{animation-play-state:paused}
.reel__cap{position:absolute;z-index:1;left:clamp(16px,2.4vw,28px);bottom:clamp(14px,2.2vw,26px);margin:0;font:italic 400 clamp(1rem,1.5vw,1.25rem)/1.2 var(--serif);color:var(--barley)}
.reel__cap span{display:block;margin-bottom:.45em;font:600 .75rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.player__soon{position:absolute;z-index:3;right:clamp(14px,2.2vw,26px);bottom:clamp(14px,2.2vw,26px);margin:0;padding:.5em .9em;border:1px solid rgba(233,221,194,.35);border-radius:3px;background:rgba(10,7,5,.55);font-size:.875rem;letter-spacing:.02em}
.player__play{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;margin:0;padding:0;border:0;background:transparent;color:var(--barley);cursor:pointer;font:600 1rem/1 var(--sans);letter-spacing:.04em}
.player__icon{position:relative;width:clamp(68px,7vw,92px);height:clamp(68px,7vw,92px);border-radius:50%;border:1px solid rgba(233,221,194,.75);background:rgba(10,7,5,.45);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background-color .25s var(--ease),transform .35s var(--ease)}
.player__icon::before{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-left:clamp(18px,1.8vw,24px) solid var(--barley);border-top:clamp(11px,1.1vw,14px) solid transparent;border-bottom:clamp(11px,1.1vw,14px) solid transparent}
.player__play:hover .player__icon,.player__play:focus-visible .player__icon{background:rgba(201,160,74,.85);transform:scale(1.06)}
.player__label{text-shadow:0 1px 12px rgba(0,0,0,.7)}
.player__media{position:absolute;inset:0;z-index:4;width:100%;height:100%;border:0;background:#000}
@media (max-width:860px){.player{margin:0 calc(-1 * var(--gutter))}.reel__cap{font-size:.95rem}.player__soon{font-size:.8125rem}}
@media (max-width:480px){.reel__cap span{margin-bottom:.3em}.player__soon{top:12px;bottom:auto;right:12px}}
@media (prefers-reduced-motion: reduce){.reel__shot,.reel__shot img{animation:none}.reel__shot:first-child{opacity:1}}

/* ---------- Scenes from the films: letterboxed on wide screens, captions in the bars ---------- */
.scenes{position:relative;background:#000;--bar:max(64px, calc((100vh - 50vw) / 2))}
@supports (height:100svh){.scenes{--bar:max(64px, calc((100svh - 50vw) / 2))}}
.scenes__stage{position:relative;height:100vh;height:100svh;overflow:hidden;background:#000}
.scene{position:absolute;inset:0;margin:0;background:#000;visibility:hidden;opacity:0}
.scene--egypt{z-index:1;visibility:visible;opacity:1}
.scene--door{z-index:2}
.scene--sinai{z-index:3}
.scene__light{z-index:4}
.scene--river{z-index:5}
.scene--hall{z-index:6}
.scene__frame{position:absolute;left:0;right:0;top:var(--bar);bottom:var(--bar);overflow:hidden;background:#0a0705}
.scene__frame img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);will-change:transform}
.scene__frame::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 78% 72% at 50% 50%,rgba(0,0,0,0) 58%,rgba(0,0,0,.4) 100%)}
.scene__slug{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);top:0;height:var(--bar);display:flex;align-items:center;gap:.5em 1em;margin:0}
.scene__place{font:600 .8125rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.scene__what{font:italic 400 clamp(1rem,1.3vw,1.1875rem)/1.2 var(--serif);color:var(--linen)}
.scene__cap{position:absolute;z-index:2;left:0;right:0;bottom:0;width:min(100% - 2 * var(--gutter), 940px);height:var(--bar);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.2em .8em;margin:0 auto;text-align:center}
.scene__q{font:italic 400 clamp(1.0625rem,1.45vw,1.3125rem)/1.35 var(--serif);color:var(--barley);text-wrap:balance}
.scene__cap cite{font:600 .8125rem/1 var(--sans);letter-spacing:.06em;color:var(--gold);white-space:nowrap}
.scene__light{position:absolute;left:0;right:0;top:var(--bar);bottom:var(--bar);overflow:hidden;visibility:hidden;opacity:0;pointer-events:none}
.scene__bloom{position:absolute;left:84%;top:48%;width:130vmax;height:130vmax;margin:-65vmax 0 0 -65vmax;border-radius:50%;background:radial-gradient(closest-side,#fffaf0 0%,rgba(255,244,220,.96) 28%,rgba(255,236,200,.5) 56%,rgba(255,236,200,0) 100%);opacity:0;transform:scale(.1)}
.scene__white{position:absolute;inset:0;background:#fff8ec;opacity:0}
.scene__card{position:absolute;inset:0;z-index:7;display:flex;align-items:center;justify-content:center;margin:0;padding:0 var(--gutter);text-align:center;font:italic 400 clamp(1.6rem,3vw,2.6rem)/1.2 var(--serif);color:var(--linen);visibility:hidden;opacity:0}
.scene__end{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.75rem;padding:0 var(--gutter);text-align:center;visibility:hidden;opacity:0}
.scene__end p{max-width:20ch;margin:0;font:400 clamp(1.9rem,4vw,3.4rem)/1.15 var(--serif);text-wrap:balance}
/* Tall or short screens: full-frame pictures, captions over a soft shade */
@media (max-aspect-ratio:5/4),(max-height:559px){
  .scenes{--bar:0px}
  .scene__frame img{object-position:var(--pos-m,50% 50%)}
  .scene__frame::before{content:"";position:absolute;inset:0 0 auto 0;height:32%;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.8) 0%,rgba(0,0,0,.55) 40%,rgba(0,0,0,0) 100%)}
  .scene__frame::after{background:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.74) 30%,rgba(0,0,0,0) 56%),radial-gradient(ellipse 80% 75% at 50% 50%,rgba(0,0,0,0) 58%,rgba(0,0,0,.35) 100%)}
  .scene__place,.scene__cap cite{color:var(--gold-hi)}
  .scene__place,.scene__what,.scene__q,.scene__cap cite{text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 16px rgba(0,0,0,.5)}
  .scene__slug{top:max(20px,env(safe-area-inset-top));height:auto;flex-wrap:wrap;align-items:baseline}
  .scene__cap{bottom:max(96px,12vh);height:auto;width:calc(100% - 2 * var(--gutter))}
  .scene__q{font-size:1.1875rem}
}
@media (max-height:559px) and (min-aspect-ratio:5/4){.scene__cap{bottom:28px;width:min(100% - 2 * var(--gutter), 760px)}}
/* No motion: the scenes become a simple run of stills with their captions */
.static .scenes__stage,.no-js .scenes__stage{height:auto;overflow:visible;padding:clamp(48px,7vw,96px) 0}
.static .scene,.no-js .scene{position:relative;inset:auto;visibility:visible;opacity:1;margin:0 0 clamp(48px,7vw,88px)}
.static .scene__frame,.no-js .scene__frame{position:relative;top:auto;bottom:auto;aspect-ratio:16/9;max-width:1280px;margin:0 auto}
.static .scene__frame img,.no-js .scene__frame img{object-position:50% 50%}
.static .scene__frame::before,.no-js .scene__frame::before{display:none}
.static .scene__slug,.static .scene__cap,.no-js .scene__slug,.no-js .scene__cap{position:static;transform:none;width:auto;max-width:1280px;height:auto;margin:0 auto;padding:14px var(--gutter) 0;justify-content:flex-start;text-align:left}
.static .scene--door,.static .scene__light,.no-js .scene--door,.no-js .scene__light{display:none}
.static .scene__card,.no-js .scene__card{position:static;display:block;visibility:visible;opacity:1;margin:0 0 clamp(48px,7vw,88px)}
.static .scene__end,.no-js .scene__end{position:static;visibility:visible;opacity:1;padding:clamp(16px,3vw,32px) var(--gutter) 0}

/* ---------- The promise ---------- */
.promise{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.promise__bg{position:absolute;inset:0;z-index:-1}
.promise__bg img{width:100%;height:100%;object-fit:cover;object-position:74% 50%}
.promise__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,17,12,.92) 0%,rgba(23,17,12,.74) 46%,rgba(23,17,12,.12) 82%)}
.promise__inner{padding:var(--section) var(--gutter);max-width:62rem}
.verse p{max-width:30ch;margin:0;font-family:var(--serif);font-size:clamp(1.5rem,2.9vw,2.6rem);line-height:1.32}
.verse cite{display:block;margin-top:1.4rem;font-weight:600;font-size:1rem;color:var(--gold)}
.promise__note{margin-top:.4rem;color:var(--linen);font-size:1rem}
@media (max-width:760px){
  .promise{align-items:flex-end}
  .promise__bg::after{background:linear-gradient(180deg,rgba(23,17,12,.35) 0%,rgba(23,17,12,.88) 42%,rgba(23,17,12,.96) 100%)}
  .promise__inner{padding-top:38vh}
  .verse p{max-width:none;font-size:1.4rem}
}

/* ---------- Cures and prevention ---------- */
.contrast{position:relative;overflow:hidden;isolation:isolate;padding:var(--section) var(--gutter)}
.contrast__bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.contrast__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.contrast__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,17,12,.8) 0%,rgba(23,17,12,.9) 58%,var(--lamp) 100%)}
.contrast__quote{max-width:21ch;font-size:clamp(2rem,4.6vw,4rem);line-height:1.12}
.contrast__quote span{display:block}
.contrast__quote span+span{margin-top:.4em}
.contrast__by{margin-top:1.4rem;color:var(--linen);font-size:1rem}
.contrast__facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,64px);max-width:72rem;margin-top:clamp(48px,7vw,96px)}
.contrast__facts>div{padding-top:20px;border-top:1px solid var(--rule)}
.contrast__facts p{max-width:44ch;color:var(--linen)}
.fine{margin-top:.8rem;font-size:.875rem;color:var(--smoke)}
@media (max-width:760px){.contrast__facts{grid-template-columns:1fr}}

/* ---------- The journey: Eden to heaven ---------- */
.journey{position:relative;background:var(--lamp)}
.journey__head{max-width:60rem;padding:var(--section) var(--gutter) clamp(40px,6vw,80px)}
.journey__head h2{font-size:clamp(2.25rem,5vw,4.5rem);margin-bottom:.4em}
.journey__head p{max-width:46ch;color:var(--linen);font-size:clamp(1.0625rem,1.5vw,1.3125rem)}
.journey__body{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.journey__chapters{grid-column:1;grid-row:1;padding:0 var(--gutter)}
.journey__stage{grid-column:2;grid-row:1;position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#0d0906}
.stage__layer{--p:0%;position:absolute;inset:0;overflow:hidden;clip-path:inset(0 0 0 var(--p))}
.stage__layer img{width:100%;height:100%;object-fit:cover}
.jamb{position:absolute;top:0;bottom:0;left:var(--p,0%);width:clamp(40px,7vw,110px);transform:translateX(-30%);background:linear-gradient(90deg,rgba(9,6,4,0),rgba(9,6,4,.92) 35%,rgba(9,6,4,.98) 62%,rgba(9,6,4,0));filter:blur(3px);opacity:0;pointer-events:none}
.crop-fruit img{object-position:86% 72%}
.crop-barley img{object-position:40% 55%}
.chapter{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:12vh 0}
.chapter__ref{margin:0 0 .9rem;font-weight:600;font-size:.9375rem;color:var(--gold)}
.chapter h3{max-width:16ch;margin-bottom:.6em;font-size:clamp(2rem,3.6vw,3.25rem)}
.chapter__verse{max-width:34ch;margin:0 0 1.25rem;font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.4}
.chapter__text{max-width:40ch;color:var(--linen)}
.chapter__photo{display:none}
@media (max-width:899px){
  .journey__body{display:block}
  .journey__stage{display:none}
  .chapter{min-height:0;padding:0 0 clamp(64px,12vw,120px)}
  .chapter__photo{--p:0%;display:block;position:relative;aspect-ratio:4/3;overflow:hidden;margin:0 calc(-1 * var(--gutter)) 28px;clip-path:inset(0 0 0 var(--p))}
  .chapter__photo img{width:100%;height:100%;object-fit:cover}
}
.static .journey__body,.no-js .journey__body{display:block}
.static .journey__stage,.no-js .journey__stage{display:none}
.static .chapter,.no-js .chapter{min-height:0;padding:0 0 clamp(64px,10vw,120px)}
.static .chapter__photo,.no-js .chapter__photo{display:block;position:relative;aspect-ratio:16/9;max-width:60rem;overflow:hidden;margin-bottom:28px}
.static .chapter__photo img,.no-js .chapter__photo img{width:100%;height:100%;object-fit:cover}

/* ---------- An evening ---------- */
.evening{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start;padding:var(--section) var(--gutter);background:var(--umber)}
.evening__photo{position:sticky;top:14vh;aspect-ratio:1/1;overflow:hidden}
.evening__photo img{width:100%;height:100%;object-fit:cover;object-position:72% 60%}
.evening h2{max-width:18ch;margin-bottom:.5em;font-size:clamp(2.1rem,4.2vw,3.75rem)}
.lead{max-width:44ch;margin-bottom:2.5rem;color:var(--linen);font-size:clamp(1.0625rem,1.5vw,1.3125rem)}
.parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 40px}
.parts li{padding-top:18px;border-top:1px solid var(--rule)}
.parts h3{margin-bottom:.35em;font-family:var(--sans);font-weight:600;font-size:1.125rem;line-height:1.3;letter-spacing:0}
.parts p{margin:0;color:var(--linen);font-size:1rem}
.sessions{margin-top:clamp(56px,7vw,88px)}
.sessions h3{margin-bottom:.4rem;font-size:clamp(1.6rem,2.6vw,2.2rem)}
.sessions>p{margin-bottom:1rem;color:var(--linen)}
.sessions li{padding:.6rem 0;border-bottom:1px solid var(--rule);font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,1.8vw,1.5rem)}
@media (max-width:860px){
  .evening{grid-template-columns:1fr}
  .evening__photo{position:relative;top:0;aspect-ratio:16/10;margin:0 calc(-1 * var(--gutter))}
  .parts{grid-template-columns:1fr;gap:24px}
}

/* ---------- On the table: the menus ---------- */
.menus{position:relative;overflow:hidden;background:var(--lamp)}
.menus__pin{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:clamp(88px,10vw,120px) 0}
.menus__head{max-width:56rem;margin-bottom:clamp(32px,4vw,56px);padding:0 var(--gutter)}
.menus__head h2{margin-bottom:.35em;font-size:clamp(2.25rem,5vw,4.5rem)}
.menus__head p{max-width:46ch;color:var(--linen)}
.menus__track{position:relative;display:flex;gap:clamp(16px,2vw,28px);padding:4px var(--gutter) 24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(233,221,194,.25) transparent}
.night{flex:0 0 clamp(262px,24vw,330px);scroll-snap-align:start;padding:28px 28px 32px;border-top:2px solid var(--gold);background:var(--umber)}
.night h3{display:flex;align-items:baseline;gap:.3em;margin-bottom:20px;font-weight:700;font-size:clamp(3rem,5vw,4.25rem);line-height:1}
.night h3 span{font-weight:400;font-style:italic;font-size:1.25rem;color:var(--linen)}
.night li{padding:.55rem 0;border-bottom:1px solid rgba(233,221,194,.1);font-size:1.0625rem}
.night li:last-child{border-bottom:0}
.night--end{display:flex;flex-direction:column;justify-content:flex-end;background:transparent;border-top-color:rgba(233,221,194,.3)}
.night--end p{font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:1.3}
.hscroll .menus__track{overflow:visible;scroll-snap-type:none;padding-bottom:4px}
/* The supper photo across the top of each night card */
.night__dish{position:relative;margin:-28px -28px 22px;aspect-ratio:4/3;overflow:hidden;background:#120d09}
.night__dish img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 55%}
/* Desktop: the header stands beside the cards and the cards slide under its soft edge, so the
   pinned row fits a short laptop screen. Cards size from the screen height. */
.hscroll .menus__pin{display:grid;grid-template-columns:clamp(300px,30vw,500px) minmax(0,1fr);align-items:center;height:100vh;height:100svh;min-height:0;padding:clamp(76px,10vh,112px) 0 clamp(16px,4vh,48px)}
.hscroll .menus__head{position:relative;z-index:2;align-self:stretch;display:flex;flex-direction:column;justify-content:center;max-width:none;margin:0;padding:0 clamp(32px,4vw,72px) 0 var(--gutter);background:linear-gradient(90deg,var(--lamp) 0,var(--lamp) calc(100% - 24px),rgba(23,17,12,0) 100%)}
.hscroll .menus__head h2{font-size:clamp(2.75rem,4vw,4rem)}
.hscroll .menus__track{padding-left:16px}
.hscroll .night{flex-basis:clamp(262px,min(24vw,46vh),380px)}
.hscroll .night h3{font-size:clamp(2.5rem,3.4vw,3.5rem);margin-bottom:14px}
.hscroll .night li{padding:.45rem 0}
@media (max-height:680px){.hscroll .night__dish{aspect-ratio:16/10}.hscroll .night{padding-bottom:22px}}

/* ---------- For churches ---------- */
.churches{position:relative;padding:var(--section) var(--gutter);background:var(--umber-2)}
.churches h2{max-width:14ch;margin-bottom:.4em;font-size:clamp(2.4rem,6vw,5.5rem)}
.kit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;max-width:60rem}
.kit li{display:flex;align-items:baseline;gap:14px;padding:.9rem 0;border-bottom:1px solid var(--rule);font-size:1.125rem}
.kit li::before{content:"";flex:0 0 14px;height:1px;background:var(--gold);transform:translateY(-.3em)}
.churches__close{max-width:30ch;margin:clamp(56px,6.5vw,96px) 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,2.3vw,1.85rem);line-height:1.3}
.churches__cta{margin-top:2.5rem}
/* How churches use it. One axis runs down the block: 7:00, where the supper table hands the evening to the prophecy seminar.
   The headline's second half, its paragraph, the seminar's stop on the line and the church names all start on that axis. */
.churches__how{--how-pad:clamp(20px,2.4vw,32px);--how-gap:clamp(28px,3.4vw,48px);--how-cols:calc(60% - .2 * var(--how-pad) - var(--how-gap)) minmax(0,1fr);display:grid;grid-template-columns:var(--how-cols);grid-template-areas:"eye eye" "title title" "a b" "note note" "night night" "used used";column-gap:var(--how-gap);align-items:start;max-width:84rem;margin-top:clamp(64px,8vw,120px)}
.churches__how>.eyebrow{grid-area:eye}
.churches__how h3{grid-area:title;display:grid;grid-template-columns:var(--how-cols);column-gap:var(--how-gap);margin-bottom:.5em;font-size:clamp(1.9rem,3.3vw,3.25rem)}
.churches__how h3 span:first-child{display:flex;align-items:center;gap:.45em;white-space:nowrap}
.churches__how h3 span:first-child::after{content:"";flex:1 1 auto;min-width:1em;height:1px;margin-right:calc(.45em - var(--how-gap));background:var(--gold);transform:translateY(.12em)}
.churches__step{max-width:44ch;margin:0;color:var(--linen);font-size:clamp(1.125rem,1.4vw,1.25rem)}
.churches__step--a{grid-area:a}
.churches__step--b{grid-area:b}
.churches__note{grid-area:note;margin:clamp(28px,3.2vw,44px) 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.35;color:var(--barley);text-wrap:balance}
.churches__how h4{margin:0;font:500 clamp(1.4rem,2vw,1.75rem)/1.15 var(--serif);letter-spacing:-.005em}
.churches__night h4{font-weight:400;font-style:italic;font-size:clamp(1.2rem,1.6vw,1.4rem);letter-spacing:0;color:var(--linen)}
.churches__night{grid-area:night;container-type:inline-size;margin-top:clamp(44px,5vw,72px);padding:clamp(22px,2.4vw,30px) var(--how-pad) clamp(26px,2.8vw,38px);border-top:2px solid var(--gold);background:var(--umber)}
.churches__night ol{display:grid;grid-template-columns:3fr 3fr 4fr;margin-top:clamp(20px,2.2vw,30px)}
.churches__night li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;align-content:start}
.churches__night li>time{font-family:var(--serif);font-weight:700;font-size:clamp(1.7rem,8vw,2.75rem);font-size:clamp(1.7rem,11.5cqw,4rem);line-height:1;font-variant-numeric:lining-nums tabular-nums}
.churches__night small{display:flex;align-items:baseline;gap:.5rem;color:var(--linen);font-family:var(--serif);line-height:1;white-space:nowrap}
.churches__night small em{font-size:clamp(1.05rem,1.5vw,1.25rem)}
.churches__night small time{font-weight:700;font-size:1.25rem;font-size:clamp(1.7rem,11.5cqw,4rem);font-variant-numeric:lining-nums tabular-nums}
.churches__night i{--tick:transparent;position:relative;grid-column:1 / -1;display:block;height:11px;margin:.75rem 0 .65rem;margin:clamp(.6rem,2cqw,1rem) 0 clamp(.55rem,1.8cqw,.85rem);background:linear-gradient(var(--gold),var(--gold)) 0 50% / 100% 2px no-repeat,linear-gradient(var(--tick),var(--tick)) 33.333% 50% / 1px 9px no-repeat,linear-gradient(var(--tick),var(--tick)) 66.667% 50% / 1px 9px no-repeat}
.churches__night i::before,.churches__night li:last-child i::after{content:"";position:absolute;top:50%;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--umber)}
.churches__night i::before{left:0}
.churches__night li:last-child i{background:linear-gradient(rgba(233,221,194,.4),rgba(233,221,194,.4)) 0 50% / 100% 2px no-repeat,linear-gradient(var(--tick),var(--tick)) 25% 50% / 1px 9px no-repeat,linear-gradient(var(--tick),var(--tick)) 50% 50% / 1px 9px no-repeat,linear-gradient(var(--tick),var(--tick)) 75% 50% / 1px 9px no-repeat}
.churches__night li:last-child i::before{background:var(--barley)}
.churches__night li:last-child i::after{right:0;background:var(--umber);border:2px solid var(--barley)}
.churches__night li>span{grid-column:1 / -1;padding-right:.75rem;font-weight:500;font-size:1rem;font-size:clamp(.9375rem,4.6cqw,1.1875rem);line-height:1.3}
.churches__night li:last-child>span{padding-right:0}
@container (min-width:641px){.churches__night li>time,.churches__night small time{font-size:clamp(2.6rem,7.4cqw,4rem)}.churches__night i{--tick:rgba(233,221,194,.3)}}
@container (max-width:640px){.churches__night small em{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.churches__night small time{font-size:clamp(1rem,5.6cqw,1.6rem)}}
.churches__used{grid-area:used;display:grid;grid-template-columns:var(--how-cols);column-gap:var(--how-gap);align-items:start;margin-top:clamp(48px,5.5vw,80px);padding-top:clamp(20px,2.2vw,28px);border-top:1px solid var(--rule)}
.churches__used p{max-width:40ch;margin-top:.6em;color:var(--linen)}
.churches__used ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(16px,2.4vw,32px)}
.churches__used li{display:flex;flex-direction:column;gap:.15rem;padding:0 0 .95rem}
.churches__used li:nth-child(n+3){padding-top:.85rem;border-top:1px solid var(--rule)}
.churches__used li span:first-child{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.2}
.churches__used li span:last-child{color:var(--linen);font-size:.9375rem;line-height:1.3}
@media (max-width:900px){
  .churches__how{grid-template-columns:minmax(0,1fr);grid-template-areas:"eye" "title" "a" "b" "note" "night" "used"}
  .churches__how h3{display:block;font-size:clamp(1.9rem,7.4vw,2.6rem)}
  .churches__how h3 span:first-child{display:inline;white-space:normal}
  .churches__how h3 span:first-child::after{content:none}
  .churches__step--b{margin-top:1em}
  .churches__used{grid-template-columns:minmax(0,1fr)}
  .churches__used ul{margin-top:1.25rem}
}
/* The one moving part: the line through the evening draws itself once, when the panel has come into view (the script adds the classes; without them the line is simply there) */
.churches__night.will-draw i{background-size:0 2px,1px 9px,1px 9px}
.churches__night.will-draw li:last-child i{background-size:0 2px,1px 9px,1px 9px,1px 9px}
.churches__night.is-drawn i{background-size:100% 2px,1px 9px,1px 9px;transition:background-size .5s linear}
.churches__night.is-drawn li:nth-child(2) i{transition-delay:.5s}
.churches__night.is-drawn li:last-child i{background-size:100% 2px,1px 9px,1px 9px,1px 9px;transition:background-size .8s cubic-bezier(.2,.7,.2,1) 1s}
/* Our own photos of an evening of the program: the meal, the fellowship, the presentation */
.churches__photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px);max-width:84rem;margin:clamp(32px,4.5vw,64px) 0 clamp(40px,5vw,72px)}
.churches__photo{margin:0}
.churches__frame{position:relative;aspect-ratio:4/3;overflow:hidden;background:#120d09;border-top:2px solid var(--gold)}
.churches__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 55%}
.churches__photo figcaption{margin-top:14px;font-family:var(--serif);font-style:italic;font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.3;color:var(--linen)}
@media (max-width:700px){.churches__photos{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);margin-left:calc(-1 * var(--gutter));margin-right:calc(-1 * var(--gutter));padding:0 var(--gutter);scrollbar-width:none}.churches__photos::-webkit-scrollbar{display:none}.churches__photo{scroll-snap-align:start}}
.soon{display:inline-block;padding:.85em 1.3em;border:1px dashed rgba(233,221,194,.38);border-radius:3px;color:var(--linen);font-size:1rem}
@media (max-width:700px){.kit{grid-template-columns:1fr}}

/* ---------- Give: Pastor Chuck in his kitchen, the ask from the film ---------- */
.give{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:var(--section) var(--gutter);overflow:hidden;isolation:isolate}
.give__bg{--p:0%;position:absolute;inset:0;z-index:-1;overflow:hidden;clip-path:inset(0 0 0 var(--p))}
.give__bg img{width:100%;height:100%;object-fit:cover;object-position:28% 40%}
.give__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,17,12,.04) 0%,rgba(23,17,12,.22) 36%,rgba(23,17,12,.86) 60%,rgba(23,17,12,.94) 100%),linear-gradient(0deg,rgba(23,17,12,.5) 0%,rgba(23,17,12,0) 30%)}
.give__inner{width:min(100%,34rem);margin-left:auto}
.give h2{margin-bottom:.5em;font-size:clamp(2.6rem,5.2vw,4.75rem)}
.give__letter p{max-width:36ch;font-size:clamp(1.0625rem,1.5vw,1.25rem)}
.give__sig{font-family:var(--serif);font-style:italic;color:var(--linen)}
.give__action{margin-top:2.25rem}
@media (max-width:860px){
  .give{display:block;min-height:0;padding:0 0 var(--section)}
  .give__bg{position:relative;inset:auto;z-index:0;height:min(125vw,80vh);height:min(125vw,80svh)}
  .give__bg img{object-position:39% 30%}
  .give__bg::after{background:linear-gradient(0deg,var(--lamp) 0%,rgba(23,17,12,.55) 18%,rgba(23,17,12,0) 40%)}
  .give__inner{position:relative;width:auto;margin:-10vh var(--gutter) 0}
}

/* ---------- About ---------- */
.about{max-width:60rem;padding:var(--section) var(--gutter) clamp(64px,8vw,112px)}
.about h2{margin-bottom:.6em;font-size:clamp(1.8rem,3vw,2.5rem)}
.about p{max-width:52ch;color:var(--linen)}

/* ---------- Footer: the house in the morning, the film's last shot ---------- */
.foot{position:relative;background:var(--lamp)}
.foot__scene{position:relative;min-height:88vh;min-height:88svh;display:flex;align-items:flex-end;padding:var(--section) var(--gutter) clamp(48px,7vw,96px);overflow:hidden;isolation:isolate}
.foot__bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.foot__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;will-change:transform}
.foot__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--lamp) 0%,rgba(23,17,12,.74) 22%,rgba(23,17,12,.22) 50%,rgba(23,17,12,0) 70%),linear-gradient(90deg,rgba(23,17,12,.55) 0%,rgba(23,17,12,0) 55%)}
.foot__verse p{max-width:28ch;margin-bottom:.6rem;font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.8vw,2.4rem);line-height:1.3;text-shadow:0 2px 20px rgba(0,0,0,.4)}
.foot__verse cite{font-weight:600;font-size:.9375rem;color:var(--gold)}
.foot__base{padding:28px var(--gutter) 40px;border-top:1px solid rgba(233,221,194,.1)}
.foot__note{max-width:62ch;margin:0 0 .6rem;color:var(--smoke);font-size:.875rem}
.foot__copy{margin:0;color:var(--smoke);font-size:.875rem}
@media (max-width:760px){.foot__bg img{object-position:65% 50%}.foot__scene{min-height:80vh;min-height:80svh}.foot__base{padding-bottom:84px}}
