/* Quiet, warm motion. Everything remains readable without JavaScript. */
.title-line{display:block!important;background:none!important}.hero{position:relative;overflow:hidden;isolation:isolate}.hero:before{content:"";position:absolute;inset:-20%;background:radial-gradient(ellipse at 80% 50%,#c0874720,transparent 48%);pointer-events:none;z-index:-1}.scene{isolation:isolate}.lamp-glow{transform-origin:240px 200px}.scene-whisper{position:absolute;left:0;right:0;bottom:28%;pointer-events:none;height:36px;text-align:center}.scene-whisper span{display:inline-block;position:absolute;left:50%;white-space:nowrap;border:1px solid #cfb59070;background:#19283deb;padding:7px 16px;border-radius:24px 24px 24px 2px;color:#f3d4ac;font-size:13px;letter-spacing:.08em;opacity:0;transform:translate(-50%,10px)}.scroll-cue{display:flex;align-items:center;justify-content:center;gap:18px;font:10px/1 Arial,sans-serif;letter-spacing:.2em;color:#d8bea0;padding:10px 0 32px}.scroll-cue i{display:block;width:1px;height:35px;background:linear-gradient(#e6ad79,transparent);transform-origin:top}.reading-progress{position:fixed;inset:0 auto auto 0;width:100%;height:3px;transform:scaleX(0);transform-origin:left;background:#dca06e;z-index:50;pointer-events:none}.motion-toggle{position:fixed;bottom:18px;right:18px;border:1px solid #a6a18f;background:#f6f3edf2;color:#233144;padding:9px 15px;border-radius:22px;font:12px/1.4 sans-serif;z-index:40;cursor:pointer;box-shadow:0 2px 12px #0001}.motion-toggle:focus-visible{outline:3px solid #ce550a;outline-offset:4px}.flow-list{position:relative}.step{transition:background .35s,border-color .35s}.step.is-visible{border-color:#e6ad79}.letter-turn{position:relative}.letter-turn:after{content:"";position:absolute;bottom:-1px;left:0;height:2px;width:100%;background:#ac744a;transform:scaleX(0);transform-origin:left;transition:transform 1.2s ease}.letter-turn.is-visible:after{transform:scaleX(1)}.button{position:relative;overflow:hidden}.button:after{content:"↗";margin-left:14px;transition:transform .25s}.button:hover:after{transform:translate(3px,-3px)}.topics span{transition:background .3s,transform .3s}.topics span:hover{background:#e1d5c1;transform:translateY(-4px)}details[open]>p{animation:faq-in .35s ease both}.motion-on .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--delay,0ms)}.motion-on .reveal.is-visible{opacity:1;transform:none}.motion-on .hero .title-line{animation:title-in 1s cubic-bezier(.2,.7,.2,1) both}.motion-on .hero .title-line:nth-child(2){animation-delay:.16s}.motion-on .hero .title-line:nth-child(3){animation-delay:.32s}.motion-on .hero .lead{animation:title-in 1s .45s both}.motion-on .hero .scene{animation:scene-in 1.5s .25s both}.motion-on .scene.in-view .lamp-glow{animation:lamplight 5s ease-in-out infinite alternate}.motion-on .scene.in-view .steam{animation:steam 3.5s ease-in-out infinite}.motion-on .scene.in-view .scene-whisper span{animation:whisper 12s ease-in-out infinite}.motion-on .scene.in-view .scene-whisper span:nth-child(2){animation-delay:4s}.motion-on .scene.in-view .scene-whisper span:nth-child(3){animation-delay:8s}.motion-on .scroll-cue i{animation:scroll-hint 2.4s ease-in-out 3}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation:none!important;transition:none!important}.motion-paused .title-line,.motion-paused .hero .lead,.motion-paused .hero .scene{opacity:1!important;transform:none!important}.motion-paused .scene-whisper span{opacity:0!important}.motion-paused .reveal{opacity:1!important;transform:none!important}@keyframes title-in{from{opacity:0;transform:translateY(28px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}@keyframes scene-in{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}@keyframes lamplight{from{opacity:.4;transform:scale(.95)}to{opacity:1;transform:scale(1.06)}}@keyframes steam{0%,100%{opacity:0;transform:translateY(5px)}35%{opacity:.8}85%{opacity:0;transform:translateY(-12px)}}@keyframes whisper{0%,3%{opacity:0;transform:translate(-50%,10px)}7%,25%{opacity:1;transform:translate(-50%,0)}31%,100%{opacity:0;transform:translate(-50%,-8px)}}@keyframes scroll-hint{0%,100%{transform:scaleY(.55);opacity:.4}50%{transform:scaleY(1);opacity:1}}@keyframes faq-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}@media(max-width:620px){.step h3{grid-column:2}.step .number{grid-row:1/3}.scene-whisper{bottom:30%}.scene-whisper span{font-size:11px;padding:5px 12px}.motion-toggle{bottom:12px;right:12px;font-size:11px;padding:8px 12px}.scroll-cue{padding:5px 0 24px}.motion-on .reveal{transform:translateY(18px)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important}.reveal,.title-line,.hero .lead,.hero .scene{opacity:1!important;transform:none!important;clip-path:none!important}.scene-whisper span{opacity:0!important}}

h2,h3{text-wrap:balance}@media print{.reveal{opacity:1!important;transform:none!important}.motion-toggle,.reading-progress,.scene-whisper{display:none!important}}

/* Each heading has its own entrance; paragraph motion stays quiet. */
.dynamic-heading{perspective:900px;position:relative}
.heading-line{display:inline-block;max-width:100%;vertical-align:top;transform-origin:left center}
.motion-on .dynamic-heading.reveal{opacity:1;transform:none;transition:none}
.motion-on .dynamic-heading .heading-line{opacity:0;will-change:auto}
.motion-on .dynamic-heading.heading-arrived .heading-line{animation:heading-rise 1.15s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--line-delay,0ms)}
.motion-on [data-motion=slide].heading-arrived .heading-line{animation-name:heading-slide}
.motion-on [data-motion=zoom].heading-arrived .heading-line{animation-name:heading-zoom;transform-origin:center}
.motion-on [data-motion=curtain].heading-arrived .heading-line{animation-name:heading-curtain}
.motion-on [data-motion=tilt].heading-arrived .heading-line{animation-name:heading-tilt}
.motion-on [data-motion=spread].heading-arrived .heading-line{animation-name:heading-spread}
.motion-on .hero .title-line{animation-name:hero-dramatic;animation-duration:1.35s;transform-origin:left bottom}
@keyframes hero-dramatic{0%{opacity:0;transform:translateY(65px) rotateX(35deg);clip-path:inset(100% 0 0)}100%{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes heading-rise{0%{opacity:0;transform:translateY(65px) rotateX(55deg);clip-path:inset(100% 0 0)}100%{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes heading-slide{0%{opacity:0;transform:translateX(-65px);clip-path:inset(0 100% 0 0)}100%{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes heading-zoom{0%{opacity:0;transform:scale(.72) translateY(30px)}75%{opacity:1;transform:scale(1.025)}100%{opacity:1;transform:scale(1)}}
@keyframes heading-curtain{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateX(18px)}20%{opacity:1}100%{opacity:1;clip-path:inset(0);transform:none}}
@keyframes heading-tilt{0%{opacity:0;transform:translateY(45px) rotate(-5deg);clip-path:inset(100% 0 0)}100%{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes heading-spread{0%{opacity:0;transform:scaleX(.8) translateY(35px);clip-path:inset(0 50%)}100%{opacity:1;transform:none;clip-path:inset(0)}}
.motion-paused .heading-line{opacity:1!important;transform:none!important;clip-path:none!important}
@media(max-width:620px){.motion-on .dynamic-heading.heading-arrived .heading-line{animation-duration:1s}}
@media(prefers-reduced-motion:reduce){.heading-line{opacity:1!important;transform:none!important;clip-path:none!important}}
@media print{.heading-line{opacity:1!important;transform:none!important;clip-path:none!important}}