/* A quiet photographic setting behind the continuous tree camera. */
#stage,.roots-scene #stage{background:#0b2420}
#stage:before{content:'';position:absolute;inset:-3%;z-index:0;pointer-events:none;background:linear-gradient(90deg,#0b2420 0%,#0b2420b8 28%,#0b242024 67%),url('assets/forest-background.png') center/cover no-repeat;mask-image:none;opacity:.76;filter:saturate(.78) brightness(.79);animation:forest-breathe 32s ease-in-out infinite alternate;transition:filter 2s,opacity 2s}
#stage:after{content:'';position:absolute;z-index:0;left:44%;right:3%;height:8%;bottom:10%;border-radius:50%;background:radial-gradient(ellipse,#00120cdc,transparent 70%);filter:blur(12px);opacity:.68;transition:opacity 1.6s;pointer-events:none}
body[data-scene='1'] #stage:before{filter:saturate(.86) brightness(.94);opacity:.86}
body[data-scene='4'] #stage:before{filter:saturate(.78) sepia(.15) brightness(.83)}
body[data-scene='6'] #stage:before{filter:saturate(.62) sepia(.22) brightness(.7)}
body[data-scene='1'] #stage:after,body[data-scene='2'] #stage:after,body[data-scene='3'] #stage:after,body[data-scene='4'] #stage:after{opacity:0}
#light-field,.roots-scene #light-field{background:radial-gradient(ellipse at 81% 17%,#ffdfa638,transparent 49%)!important;mix-blend-mode:screen;opacity:.65}
#light-beam{width:38vw;left:65%;top:-50%;height:150vh;background:linear-gradient(90deg,transparent,#ffe8bb,transparent);opacity:.07!important;filter:blur(55px);mix-blend-mode:screen;animation:forest-sun 24s ease-in-out infinite alternate}
#veil,.roots-scene #veil{background:linear-gradient(90deg,#0b2420f7 0%,#0b2420ee 26%,#0b2420a8 38%,transparent 54%)}
#vignette{background:radial-gradient(ellipse at 70% 39%,transparent 36%,#02110d77 100%)}#atmosphere{opacity:.38}#grain{opacity:.018}
@keyframes forest-breathe{from{transform:scale(1.02) translateX(0)}to{transform:scale(1.055) translateX(-.6%)}}
@keyframes forest-sun{from{translate:0 0;rotate:0deg}to{translate:-2vw 1vh;rotate:-3deg}}
@media(max-width:700px){#stage:before{background-position:center,65% center;opacity:.62;animation:none}#stage:after{left:7%;right:7%;bottom:55%;height:5%;filter:blur(9px)}#light-beam{left:60%;width:55vw;opacity:.045!important}#veil,.roots-scene #veil{background:linear-gradient(0deg,#0b2420 0%,#0b2420 53%,#0b2420eb 59%,transparent 73%)}#atmosphere{opacity:.25}}
@media(max-height:500px) and (orientation:landscape){#veil,.roots-scene #veil{background:linear-gradient(90deg,#0b2420 0%,#0b2420ed 38%,transparent 58%)}#stage:after{left:48%;right:3%;bottom:8%}}
@media(prefers-reduced-motion:reduce){#stage:before,#light-beam{animation:none;transition:none}#light-beam{display:none}}

.hero{z-index:3}.hero h1{font-size:clamp(42px,3.8vw,64px)}@media(max-width:700px){.hero h1{font-size:13vw}}
/* Lightly suspended photo cards; drift is independent of slide entrances. */
#memories,#memories.triptych{width:38vw;height:20vh;max-height:200px}
#memories .memory{box-shadow:0 20px 42px #00100b80,0 3px 8px #0004;border-color:#e7dfb763;animation:photo-float 7s ease-in-out infinite;animation-delay:calc(var(--slot)*-2.3s);will-change:translate}
@keyframes photo-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@media(min-width:701px) and (max-height:700px){#memories,#memories.triptych{height:17vh;bottom:12vh}}
@media(max-width:700px){#memories,#memories.triptych{width:88vw;left:6vw;height:14svh;max-height:125px}#memories .memory{animation-name:photo-float-mobile;animation-duration:8s}@keyframes photo-float-mobile{0%,100%{translate:0 0}50%{translate:0 -5px}}}
@media(max-width:700px) and (max-height:700px){#memories,#memories.triptych{height:12svh;bottom:83px}}
@media(max-height:500px) and (orientation:landscape){#memories,#memories.triptych{left:5vw;width:40vw;height:18vh;bottom:64px}}
@media(prefers-reduced-motion:reduce){#memories .memory{animation:none;translate:none}}
#section-light{position:absolute;z-index:2;inset:0;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(ellipse 24% 34% at 74% 45%,#ffe5a32c,transparent 75%);opacity:0;transition:background 1.3s}
body[data-scene='1'] #section-light{background:radial-gradient(ellipse 30% 24% at 73% 36%,#eaf6b436,transparent 76%)}
body[data-scene='2'] #section-light,body[data-scene='3'] #section-light{background:radial-gradient(ellipse 26% 28% at 74% 46%,#f5e1a030,transparent 76%)}
body[data-scene='4'] #section-light{background:radial-gradient(ellipse 17% 43% at 74% 47%,#ffdd973d,transparent 76%)}
body[data-scene='5'] #section-light{background:radial-gradient(ellipse 21% 40% at 73% 49%,#ffe2a637,transparent 76%)}
body[data-scene='6'] #section-light{background:radial-gradient(ellipse 31% 21% at 74% 64%,#eac38d38,transparent 76%)}
#skill-connection{position:absolute;left:0;top:-40px;width:100%;height:64px;z-index:5;overflow:visible;pointer-events:none;opacity:0;filter:drop-shadow(0 0 5px #ebca7370)}
#skill-connection path{fill:none;stroke:#e5d08a;stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1}#skill-connection circle{fill:#f4df9d}
.connect-skills #skill-connection{animation:connection-presence 5.5s ease both}.connect-skills #skill-connection path{animation:connection-draw 1.8s cubic-bezier(.2,.6,.3,1) .25s both}
@keyframes connection-draw{to{stroke-dashoffset:0}}@keyframes connection-presence{0%{opacity:0}12%,72%{opacity:.9}100%{opacity:0}}
@media(max-width:700px){#section-light{background:radial-gradient(ellipse 42% 23% at 53% 25%,#ffe9b02e,transparent 78%)!important}#skill-connection{top:-26px;height:45px}}
@media(prefers-reduced-motion:reduce){#section-light{transition:none}#skill-connection,.connect-skills #skill-connection{display:none;animation:none}.connect-skills #skill-connection path{animation:none}}
#tree-story{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#root-story{opacity:0;transition:opacity .4s}.root-reveal #root-story{opacity:1}
.root-trace{fill:none;stroke:#f1d38b;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 4px #ffd987)}
.root-reveal .root-trace{animation:root-descend 2.8s cubic-bezier(.3,.1,.4,1) .6s both}
.root-landing{fill:#ffe2a2;opacity:0;transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 0 9px #ffe4a4)}
.root-reveal .root-landing{animation:root-support 2.2s ease-out 3.3s both}
#final-recap ellipse{opacity:0}
@keyframes root-descend{to{stroke-dashoffset:0}}@keyframes root-support{0%{opacity:0;scale:.4}35%{opacity:.8;scale:1.15}100%{opacity:.35;scale:1}}
body.finale #stage:before,body.finale #light-beam,body.finale #memories .memory{animation-play-state:paused}body.finale #atmosphere{opacity:0}
@media(prefers-reduced-motion:reduce){#tree-story{display:none}.root-reveal .root-trace,.root-reveal .root-landing{animation:none}}
.closing-gratitude{display:flex;align-items:center;gap:15px;margin:26px 0 30px;color:#d9dfc9;font-size:clamp(15px,1.25vw,20px);letter-spacing:.08em;opacity:0}
.closing-rule{display:block;width:38px;height:1px;background:#d3c38f;transform-origin:left}
body.finale .closing-gratitude{animation:gratitude-arrive 1.2s ease 1.5s both}body.finale .closing-rule{animation:gratitude-rule 1.4s ease 1.5s both}
@keyframes gratitude-arrive{from{opacity:0;translate:0 8px}to{opacity:.85;translate:0 0}}@keyframes gratitude-rule{from{scale:0 1}to{scale:1 1}}
body.finale #stage:before{filter:saturate(.65) brightness(.55);opacity:.7}body.finale #light-field{opacity:.35}#light-field{transition:opacity 2s}
header,.presentation-controls,#slide-controls,footer{transition:opacity 1.4s}body.finale .presentation-controls,body.finale #slide-controls{opacity:.14}body.finale .presentation-controls:hover,body.finale .presentation-controls:focus-within,body.finale #slide-controls:hover,body.finale #slide-controls:focus-within{opacity:1}body.finale .brand-lockup .wordmark{opacity:.35}body.finale #replay{opacity:.3}body.finale #replay:hover,body.finale #replay:focus-visible{opacity:1}
@media(max-width:700px){.closing-gratitude{font-size:15px;margin:20px 0 22px}body.finale #slide-controls{opacity:.5}}
@media(prefers-reduced-motion:reduce){body.finale .closing-gratitude{animation:none;opacity:.85}body.finale .closing-rule{animation:none}header,.presentation-controls,#slide-controls,footer,#light-field{transition:none}}
.hero{top:23%;width:43vw}.hero h1{font-size:clamp(48px,5.2vw,88px);line-height:1.08;letter-spacing:-.035em;text-shadow:0 3px 24px #061b15,0 0 65px #061b1588}.hero .eyebrow{margin-bottom:24px}
@media(max-width:700px){.hero{top:15svh;width:86vw}.hero h1{font-size:clamp(39px,11vw,64px);line-height:1.06}.hero .eyebrow{font-size:10px;margin-bottom:17px}}
@media(max-height:500px) and (orientation:landscape){.hero{top:22vh;width:45vw}.hero h1{font-size:clamp(28px,4.9vw,44px)}.hero .eyebrow{font-size:9px;margin-bottom:12px}}