*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#273b49;background:#fff;font-family:Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.wrap{width:min(1180px,88%);margin:auto}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;background:#fff}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:13px;letter-spacing:.16em;color:#16486a;line-height:1.2}.brand small{display:block;font-weight:400;letter-spacing:.02em;color:#758893;font-size:10px;margin-top:4px}.brand-mark{display:grid;place-items:center;background:#1973b6;color:white;border-radius:50%;width:39px;height:39px;font-size:20px}.topbar nav{display:flex;align-items:center;gap:35px;font-size:13px;font-weight:700;color:#31536b}.nav-cta{background:#1973b6;color:white;padding:12px 19px;border-radius:5px}.nav-cta span{margin-left:12px}.hero{position:relative;min-height:650px;height:calc(100vh - 82px);max-height:850px;overflow:hidden;background:#0c3549;color:white;display:flex;align-items:center}.hero-art,.player-bg{position:absolute;inset:0;background:url('assets/joseph-landscape.png') center/cover no-repeat}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,32,48,.92) 0%,rgba(9,39,53,.8) 30%,rgba(9,39,53,.12) 100%),linear-gradient(0deg,rgba(12,38,50,.25),transparent 55%)}.hero-content{position:relative;z-index:1;width:min(1180px,88%);margin:auto}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.2em;color:#1973b6}.eyebrow.light{color:#ffda83}.eyebrow span{display:inline-block;height:1px;width:29px;background:#f9b718;margin:0 12px 4px}.hero h1,.intro h2,.section-head h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-.04em;line-height:1.03}.hero h1{font-size:clamp(72px,8vw,124px);margin:24px 0 15px}.hero h1 em,.intro h2 em{font-weight:400;color:#f9c66a}.hero-sub{font-family:Georgia,serif;font-size:25px;margin:0 0 12px}.hero-copy{max-width:400px;color:#e3edf0;font-size:16px}.actions{display:flex;gap:13px;margin:30px 0 48px}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:14px 20px;font-size:13px;font-weight:800;border-radius:5px}.gold{background:#f9b718;color:#243d47}.outline{border:1px solid #b9ced3;color:white}.hero-meta{font-size:10px;font-weight:700;letter-spacing:.16em;color:#d1e1e4}.hero-meta span{margin:0 12px;color:#f9b718}.hero-label{position:absolute;z-index:1;bottom:44px;right:6%;border-left:2px solid #f9b718;padding-left:13px;font-size:9px;letter-spacing:.2em;color:#d9e4e5}.hero-label strong{display:block;color:white;margin-top:3px}.intro{padding:110px 0;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.intro h2,.section-head h2{font-size:clamp(38px,4vw,57px);color:#163e59;margin:17px 0}.intro h2 em{color:#1973b6}.lead{font-size:16px;color:#5f727c}.text-link{font-weight:bold;font-size:13px;color:#1973b6}.path{background:#f1f8fc;padding:100px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:35px}.section-head p{max-width:350px;color:#71838c;font-size:14px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.cards a{background:white;border:1px solid #d6e4ed;padding:29px;min-height:250px;position:relative;transition:transform .2s,box-shadow .2s}.cards a:hover{transform:translateY(-4px);box-shadow:0 15px 35px #173c5015}.card-number{position:absolute;right:25px;top:25px;color:#b0c8d7;font-size:11px}.card-icon{font-size:28px;color:#1973b6}.cards h3,.guide h3{font-family:Georgia,serif;font-size:23px;color:#19435d;margin:18px 0 8px;font-weight:400}.cards p{font-size:14px;color:#71818a}.cards strong{display:block;font-size:12px;color:#1973b6;margin-top:22px}.guide{padding:100px 0}.print{background:white;border:1px solid #b9cfdd;color:#1973b6;padding:11px 16px;border-radius:4px;font-size:12px;font-weight:bold}.guide-grid{display:grid;grid-template-columns:300px 1fr;gap:70px}.guide-box{background:#eaf6ff;padding:26px}.guide-box p,.guide-grid p,.guide-grid li{font-size:14px;color:#526d7b}.guide-box a{display:block;border-top:1px solid #cddfea;padding:12px 0;font-size:12px;color:#1973b6;font-weight:bold}.verse{background:#164d70;color:white;padding:28px;margin-top:18px}.verse span,.verse strong{font-size:10px;letter-spacing:.15em;color:#ffcc62}.verse p{color:white;font-family:Georgia,serif;font-size:19px;line-height:1.5}.guide-grid ul{padding-left:20px}.guide-grid li{margin:8px 0}.reading{background:#f5f8fa;padding:15px}#scene-guide{margin-top:45px}details{border-top:1px solid #d6e4ed}details:last-child{border-bottom:1px solid #d6e4ed}summary{list-style:none;display:flex;align-items:center;gap:18px;padding:18px 0;cursor:pointer;color:#19435d}summary::-webkit-details-marker{display:none}summary span{font-size:11px;color:#1973b6;font-weight:bold}summary strong{flex:1}summary b{font-size:20px;font-weight:400}details[open] summary b{transform:rotate(45deg)}.details-content{padding:0 0 20px 30px;max-width:750px}.details-content p{white-space:normal}footer{background:#113b55;color:#d1e4ee;padding:35px 0;font-size:12px}footer .wrap{display:flex;justify-content:space-between;gap:20px}footer strong{letter-spacing:.14em;color:white}.player[hidden]{display:none}.playing{overflow:hidden}.player{position:fixed;inset:0;z-index:20;background:#0b283b;color:white;display:flex;flex-direction:column}.player-bg{transition:filter .5s,background-position .5s}.player[data-scene='2'] .player-bg{background-image:url('assets/dreams.png')}.player[data-scene='3'] .player-bg,.player[data-scene='4'] .player-bg{filter:sepia(.3) brightness(.7);background-position:70% center}.player[data-scene='5'] .player-bg,.player[data-scene='6'] .player-bg{background-position:20% center}.player-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,25,38,.92),rgba(8,34,47,.76) 48%,rgba(8,34,47,.12)),linear-gradient(0deg,rgba(4,22,33,.65),transparent 30%)}.player-top,.player-bottom,.player-body,.progress{z-index:1;position:relative}.player-top{display:flex;justify-content:space-between;align-items:center;padding:25px 5%;font-size:10px;letter-spacing:.18em;font-weight:700}.exit{letter-spacing:0;font-size:13px}.progress{height:3px;background:#ffffff36;margin:0 5%}.progress i{display:block;height:100%;background:#f9b718;transition:width .3s}.player-body{flex:1;overflow:auto;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:30px 12%;max-width:1050px}.slide-kicker{color:#ffd47c;font-size:11px;letter-spacing:.19em;font-weight:bold}.player-body h2{font:400 clamp(43px,6vw,80px)/1.05 Georgia,serif;margin:20px 0 24px}.player-body p{font-size:clamp(16px,1.5vw,22px);line-height:1.6;color:#f0f7f8;margin:0 0 16px;max-width:710px}.player-bottom{display:flex;justify-content:space-between;align-items:center;padding:24px 5% 32px}.player-bottom button{border:1px solid #ffffff80;background:#ffffff16;color:white;border-radius:4px;padding:12px 19px;font-weight:bold}.player-bottom button:last-child{background:#f9b718;color:#173b4d;border-color:#f9b718}.player-bottom button:disabled{opacity:.35;cursor:default}.player-hint{font-size:10px;letter-spacing:.15em;color:#cfdee1}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #f9b718;outline-offset:3px}@media(max-width:750px){.topbar{height:70px}.topbar nav a:not(.nav-cta){display:none}.hero{min-height:650px;height:calc(100vh - 70px)}.hero:after{background:linear-gradient(90deg,#092333e8,#09233380)}.hero h1{font-size:70px}.hero-label{display:none}.intro{grid-template-columns:1fr;gap:20px;padding:70px 0}.section-head{display:block}.cards{grid-template-columns:1fr}.path,.guide{padding:70px 0}.guide-grid{grid-template-columns:1fr;gap:35px}.player-body{padding:25px 7%;justify-content:flex-start}.player-body h2{font-size:42px}.player-top span:nth-child(2),.player-hint{display:none}.actions{flex-wrap:wrap}footer .wrap{flex-wrap:wrap}}@media print{.topbar,.hero,.intro,.path,footer,.print,.player{display:none!important}.guide{padding:0}.guide-grid{display:block}.guide-box,.verse{display:none}details{display:block}details:not([open]) .details-content{display:block}summary{break-after:avoid}.details-content{break-inside:auto}body{color:#000}}

.player[data-scene='5'] .player-bg,.player[data-scene='6'] .player-bg,.player[data-scene='7'] .player-bg{background-image:url('assets/wheat.png')}.choices{display:flex;flex-wrap:wrap;gap:10px;max-width:800px}.choices button{background:#ffffff1f;border:1px solid #ffffffa0;color:#fff;border-radius:5px;padding:12px 17px;text-align:left;font-weight:700}.choices button:hover{background:#ffffff40}.feedback{margin-top:16px!important;color:#ffda83!important;font-weight:bold}

.player-body{justify-content:safe center}

/* Immersive story player: art fills the screen, copy stays in a calm bottom caption. */
.player{min-height:100svh;min-height:100dvh;isolation:isolate}
.player-bg{background-position:center center;background-size:cover;filter:none!important;transform:scale(1.005)}
.player-shade{background:linear-gradient(180deg,rgba(4,19,32,.34) 0%,transparent 22%,transparent 38%,rgba(4,19,32,.35) 59%,rgba(4,19,32,.91) 100%)}
.player-top{padding:clamp(16px,2.4vh,25px) 4%;text-shadow:0 1px 8px #092333}
.progress{margin:0 4%;height:2px}
.player-body{width:100%;max-width:none;min-height:0;flex:1;justify-content:flex-end;align-items:flex-start;padding:30px 8% 6px;overflow-y:auto;scrollbar-width:thin}
.slide-kicker{font:700 10px/1.4 Arial,sans-serif;letter-spacing:.19em;color:#ffda83}
.player-body h2{font:700 clamp(28px,3vw,42px)/1.13 "MVB Dovetail",Georgia,serif;letter-spacing:-.025em;margin:8px 0 10px;max-width:900px;text-shadow:0 2px 10px #071c2b}
.player-body p{font:400 clamp(18px,2vw,29px)/1.4 "MVB Solitaire",Arial,sans-serif;color:#fff;margin:0;max-width:960px;text-wrap:pretty;text-shadow:0 2px 10px #071c2b}
#slide-question{width:min(100%,960px)}
#slide-question>p:not(.feedback){margin-top:4px}
.choices{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;max-width:900px}
.choices button{border:1px solid #ffffffb5;border-radius:5px;background:#102d43e8;color:#fff;padding:9px 14px;font-size:clamp(13px,1.2vw,17px);line-height:1.3;text-align:left;font-weight:700}
.choices button:hover{background:#1973b6}
.feedback{display:flex;align-items:center;height:36px;min-height:36px;margin:5px 0 0!important;font-size:16px!important;line-height:1.2!important;opacity:0;transform:translateY(5px);transition:opacity .25s ease,transform .25s ease}
.feedback.visible{opacity:1;transform:translateY(0)}
.feedback.correct{color:#ffda83!important;animation:feedbackCelebrate .5s ease}
.feedback.wrong{color:#fff!important}
@keyframes feedbackCelebrate{0%{transform:scale(.92)}48%{transform:scale(1.08)}100%{transform:scale(1)}}
.player-bottom{flex:none;padding:12px 4% max(16px,env(safe-area-inset-bottom));gap:12px}
.player-bottom button{border-radius:6px;padding:9px 14px;font-size:13px;min-width:96px}
.player-hint{font-size:9px}
@media(max-width:750px){
  .player-top{padding:16px 5%;font-size:9px}
  .progress{margin:0 5%}
  .player-body{padding:20px 6% 4px}
  .player-body h2{font-size:clamp(26px,7vw,38px);margin:7px 0}
  .player-body p{font-size:clamp(17px,4.6vw,23px);line-height:1.35}
  .choices{gap:6px}
  .choices button{font-size:13px;padding:8px 10px}
  .feedback{height:32px;min-height:32px;font-size:14px!important}
  .player-bottom{padding:9px 5% max(12px,env(safe-area-inset-bottom))}
  .player-bottom button{padding:9px 10px;min-width:78px}
  .player-hint{display:none}
}
@media(max-height:620px){
  .player-body{padding-top:12px}
  .player-body h2{font-size:clamp(24px,4.4vh,33px)}
  .player-body p{font-size:clamp(16px,3.2vh,23px)}
  .choices button{padding:5px 9px}
}
@media(prefers-reduced-motion:reduce){
  .player-bg,.progress i,.feedback{transition:none!important}
  .feedback.correct{animation:none}
}

.hero:after{background:linear-gradient(90deg,rgba(9,32,48,.87) 0%,rgba(9,39,53,.68) 27%,rgba(9,39,53,.05) 68%),linear-gradient(0deg,rgba(12,38,50,.15),transparent 55%)}@media(max-width:750px){.hero:after{background:linear-gradient(90deg,rgba(9,35,51,.87),rgba(9,35,51,.35))}}
