/* Landing-only light choreography. Other chapters keep their existing motion. */
.landing{isolation:isolate;overflow:clip;--scene-rx:0deg;--scene-ry:0deg;--scene-x:0px;--scene-y:0px;--light-x:50%;--light-y:40%;--pointer-light:0}
.landing-lightfield{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.light-wash{position:absolute;pointer-events:none;will-change:transform,opacity}
.wash-one{width:84%;height:72%;left:-12%;top:-16%;background:radial-gradient(ellipse at center,#fefeffde 0%,#e7f0ff80 39%,#c7dbfb00 72%);filter:blur(22px);transform:rotate(-28deg);animation:landing-wash 19s ease-in-out infinite alternate}
.wash-two{width:74%;height:66%;right:-23%;top:2%;background:radial-gradient(ellipse,#bfd5f650 0%,#dce9ff40 35%,transparent 70%);filter:blur(28px);animation:landing-wash-return 24s ease-in-out infinite alternate}
.landing-pointer-light{position:absolute;inset:0;background:radial-gradient(ellipse 260px 220px at var(--light-x) var(--light-y),#ffffffc2,transparent 78%);opacity:var(--pointer-light);transition:opacity 1.1s ease;mix-blend-mode:soft-light}
.landing-art{isolation:isolate;perspective:1100px;container-type:inline-size}
.landing-aura{position:absolute;inset:-8% -4% -6%;border-radius:50%;background:radial-gradient(ellipse at 50% 46%,#fafdff 0%,#e9f1ffb0 23%,#c4d8fb47 43%,transparent 70%);opacity:.88;animation:landing-aura 10s ease-in-out infinite}
.landing-aura:after{content:'';position:absolute;left:18%;right:18%;top:8%;height:60%;border-radius:50%;background:radial-gradient(ellipse,#ffffffa3,transparent 70%);filter:blur(12px);transform:rotate(-26deg)}
.landing-shadow{position:absolute;width:44%;height:13px;left:28%;bottom:11%;background:radial-gradient(ellipse,#31558b20,transparent 73%);filter:blur(8px);transform:scaleX(1.08);animation:landing-shadow 8.4s ease-in-out infinite}
.landing-parallax{position:absolute;inset:0;transform-style:preserve-3d;transform:translate3d(var(--scene-x),var(--scene-y),0) rotateX(var(--scene-rx)) rotateY(var(--scene-ry));will-change:transform}
.landing-number{z-index:1;text-shadow:none}
/* Negative tracking leaves ink beyond the text advance. Pad the gradient's paint
   box so the final 8, its antialiasing and the floating motion remain uncropped. */
.number-face{display:block;flex-shrink:0;white-space:nowrap;padding:.05em .08em;color:#4165a8;filter:drop-shadow(0 1px 0 #ffffff8c) drop-shadow(1px 13px 12px #345c9c12);animation:landing-levitate 8.4s ease-in-out infinite,landing-metal 14s ease-in-out infinite;background-image:linear-gradient(112deg,#244a8b 3%,#4168ab 21%,#98b5e5 32%,#d2e1f5 36%,#6a8cc3 42%,#345a9a 54%,#456aaa 76%,#95b1dc 87%,#30568f);background-size:230% 100%;background-position:18% 50%}
@supports (-webkit-background-clip:text) or (background-clip:text){.number-face{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}}
.landing-orbit-drawing{position:absolute;width:112%;height:112%;left:-6%;top:-4%;overflow:visible;z-index:2;pointer-events:none;transform:rotate(-1deg);animation:landing-orbit-breathe 23s ease-in-out infinite alternate}
.orbit-comet{filter:drop-shadow(0 0 4px #bcd6ff)}
.landing .orbit-moon{left:13%;top:65%;width:19px;height:19px;z-index:3;background:radial-gradient(circle at 28% 25%,#fff 0%,#f5faff 24%,#dbe8fc 52%,#8caad9 90%);box-shadow:inset -2px -2px 5px #7897c42e,2px 5px 11px #446ba52b,0 0 20px #f6fbffa8;animation:landing-pearl 11s ease-in-out infinite}
.landing .spark-one{color:#749bd4;filter:drop-shadow(0 0 5px #edf5ff);animation:landing-spark 7s ease-in-out infinite}
.landing .spark-two{color:#92b2df;animation:landing-spark 9s ease-in-out -3s infinite}
.landing .spark-three{font-size:10px;color:#a8bfe0;right:13%;bottom:20%;animation:landing-spark 11s ease-in-out -6s infinite}
.landing-motes{position:absolute;inset:0;pointer-events:none;z-index:2}
.landing-motes i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);background:#8eadd9;border-radius:50%;opacity:.4;box-shadow:0 0 7px #e8f4ff;animation:landing-mote 9s ease-in-out var(--delay) infinite}
.landing-script{z-index:3;color:#7995c1;text-shadow:0 1px 8px #f8fbff;transform:rotate(-13deg) translateZ(8px)}
.landing-copy>.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#829bbe}
.landing-copy>.eyebrow:before{content:'';width:3px;height:3px;border-radius:50%;background:#7ca1d7;box-shadow:0 0 0 3px #aac8ef21,0 0 8px #a1c1ee75;animation:landing-indicator 8s ease-in-out infinite}
.landing h1{letter-spacing:3.5px;text-shadow:0 2px 18px #fff9}
.landing h1 em{color:#456da9}
.landing .quiet-copy{color:#8096b5}
.landing-bottom{display:flex;align-items:center;gap:17px;color:#9eb1cc}
.landing-bottom:before,.landing-bottom:after{content:'';width:27px;height:1px;background:linear-gradient(90deg,transparent,#b5cae7)}
.landing-bottom:after{transform:rotate(180deg)}
/* The button is a tactile object, with hover and press states kept distinct. */
#start-journey{--button-x:50%;--button-y:35%;--magnet-x:0px;--magnet-y:0px;gap:24px;min-width:230px;min-height:56px;padding:15px 18px 15px 27px;border-radius:999px;border:1px solid #7393cb;background:radial-gradient(ellipse at var(--button-x) var(--button-y),#ffffff19,transparent 62%),linear-gradient(145deg,#567bc0,#355da9 53%,#2e5397);box-shadow:inset 0 1px 0 #c3d8fd80,inset 0 -1px 0 #193a795c,0 5px 10px #4366a317,0 15px 35px #4267a51a;transform:translate3d(var(--magnet-x),var(--magnet-y),0);transition:transform .32s var(--ease),box-shadow .4s ease,border-color .35s,filter .35s;isolation:isolate;touch-action:manipulation}
#start-journey:before{content:'';position:absolute;inset:2px;border-radius:inherit;border:1px solid #c6d9fa1f;pointer-events:none;z-index:-1}
#start-journey:after{inset:-80% -20%;width:55%;height:260%;background:linear-gradient(110deg,transparent,#eef6ff20 46%,#ffffff36 50%,#e6f1ff17 54%,transparent);transform:translateX(-180%) rotate(10deg);transition:none;animation:landing-button-sheen 9s ease-in-out 1.2s infinite;pointer-events:none;z-index:-1}
#start-journey>.button-label{font-size:12px;line-height:1.5;letter-spacing:1.5px;position:relative;z-index:2}
#start-journey>.button-arrow{height:29px;width:29px;display:grid;place-items:center;border:1px solid #d9e8ff36;border-radius:50%;background:#c7dcff0c;transition:transform .42s var(--ease),background .4s,border-color .4s;position:relative;z-index:2}
.button-arrow svg{transition:transform .45s var(--ease)}
#start-journey:focus-visible{outline:2px solid #638dce;outline-offset:5px;box-shadow:inset 0 1px 0 #d6e5ff99,0 0 0 9px #c7dafa38,0 12px 32px #4268aa26}
#start-journey.is-pressed,#start-journey:active{transform:translate3d(0,1px,0) scale(.975);box-shadow:inset 0 2px 5px #24498445,inset 0 -1px 0 #ffffff20,0 3px 8px #4267a51c;filter:brightness(1.04);transition:transform .12s ease,box-shadow .12s ease,filter .12s}
#start-journey.is-pressed .button-arrow{transform:scale(.92)}
#start-journey.is-committing .button-arrow svg{transform:translate(2px,-2px)}
#start-journey>.button-ripple{position:absolute;z-index:1;width:var(--ripple-size);height:var(--ripple-size);left:var(--ripple-x);top:var(--ripple-y);border-radius:50%;pointer-events:none;background:radial-gradient(circle,#e7f3ff30 0%,#dbeeff12 50%,transparent 70%);border:1px solid #e5f3ff45;transform:translate(-50%,-50%) scale(0);animation:landing-ripple .72s var(--ease) forwards}
@media(hover:hover) and (pointer:fine){
 #start-journey:hover:not(:disabled){background:radial-gradient(ellipse at var(--button-x) var(--button-y),#ffffff23,transparent 66%),linear-gradient(145deg,#5b81c7,#3c65b1 53%,#315ba4);border-color:#98b4e0;transform:translate3d(var(--magnet-x),calc(var(--magnet-y) - 2px),0);box-shadow:inset 0 1px 0 #e0edffa6,inset 0 -1px 0 #25477e66,0 6px 12px #355b9c1f,0 18px 40px #426bad2c,0 0 25px #a9c8f132}
 #start-journey:hover:not(:disabled):after{transform:translateX(-180%) rotate(10deg)}
 #start-journey:hover .button-arrow{background:#c7dcff20;border-color:#e0edff75;transform:translateX(2px)}
 #start-journey:hover .button-arrow svg{transform:translate(1px,-1px)}
 #start-journey.is-pressed:hover{transform:translate3d(0,1px,0) scale(.975);box-shadow:inset 0 2px 5px #24498445,0 3px 8px #4267a51c}
}
.landing.motion-paused *,.landing.motion-paused *:before,.landing.motion-paused *:after{animation-play-state:paused!important}
@keyframes landing-wash{from{transform:translate(-3%,-2%) rotate(-28deg);opacity:.65}to{transform:translate(10%,8%) rotate(-20deg);opacity:.95}}
@keyframes landing-wash-return{from{transform:translate(0,0) scale(.94);opacity:.55}to{transform:translate(-12%,8%) scale(1.1);opacity:.85}}
@keyframes landing-aura{0%,100%{transform:scale(.96);opacity:.7}50%{transform:scale(1.035);opacity:.95}}
@keyframes landing-levitate{0%,100%{transform:translate3d(0,0,10px)}50%{transform:translate3d(0,-7px,10px)}}
@keyframes landing-shadow{0%,100%{transform:scaleX(1.08);opacity:.85}50%{transform:scaleX(.94);opacity:.5}}
@keyframes landing-metal{0%,100%{background-position:18% 50%}48%{background-position:88% 50%}}
@keyframes landing-orbit-breathe{from{transform:rotate(-1deg) scale(.99)}to{transform:rotate(2deg) scale(1.015)}}
@keyframes landing-pearl{0%,100%{transform:translate3d(0,0,14px)}50%{transform:translate3d(5px,-8px,14px)}}
@keyframes landing-spark{0%,100%{opacity:.55;scale:.91}50%{opacity:.95;scale:1.06}}
@keyframes landing-mote{0%,100%{opacity:.2;transform:translateY(0)}50%{opacity:.65;transform:translateY(-8px)}}
@keyframes landing-indicator{0%,100%{opacity:.6}50%{opacity:1}}
@keyframes landing-button-sheen{0%,66%{transform:translateX(-180%) rotate(10deg);opacity:0}70%{opacity:.8}86%,100%{transform:translateX(330%) rotate(10deg);opacity:0}}
@keyframes landing-ripple{0%{opacity:.75;transform:translate(-50%,-50%) scale(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:760px){
 .landing{padding-top:12px}.landing h1{letter-spacing:2px}.landing-art{height:clamp(230px,76vw,285px);margin-top:0}.landing-number{inset:0;font-size:min(285px,72vw);letter-spacing:-.065em;transform:translateX(-.02em)}.landing-orbit-drawing{width:116%;height:108%;left:-8%;top:-2%}.landing .orbit-moon{left:8%;top:64%;width:16px;height:16px}.landing .spark-three{right:8%;bottom:21%}.landing-shadow{width:54%;left:23%;bottom:12%}.landing-aura{inset:-4% -12% 0}.wash-one{width:125%;height:64%;left:-37%;top:-4%;filter:blur(18px)}.wash-two{width:120%;right:-47%;height:55%;top:10%;filter:blur(18px)}.landing-copy>.eyebrow{gap:8px}.landing-bottom{gap:11px}.landing-bottom:before,.landing-bottom:after{width:16px}#start-journey{min-width:221px;min-height:54px;padding:13px 16px 13px 24px;gap:20px}#start-journey>.button-label{font-size:11px;letter-spacing:1.3px}#start-journey>.button-arrow{width:28px;height:28px}
 @supports(font-size:1cqw){.landing-number{font-size:min(285px,82cqw)}}
}
@media(max-width:370px){.landing h1{letter-spacing:1.5px}.landing-bottom{letter-spacing:1.5px;gap:9px}.landing-bottom:before,.landing-bottom:after{width:12px}}
@media(prefers-reduced-motion:reduce){
 .landing *,.landing *:before,.landing *:after{animation:none!important}.landing-parallax{transform:none!important;will-change:auto}.light-wash{will-change:auto}.landing-pointer-light,.orbit-comet,.button-ripple{display:none}.number-face{background-position:30% 50%}.landing #start-journey,.landing #start-journey:hover:not(:disabled){transform:none;transition:background .15s,box-shadow .15s}.landing #start-journey.is-pressed{filter:brightness(1.14);box-shadow:inset 0 2px 7px #1b3a7266}.button-arrow,.button-arrow svg{transition:none!important}
}
