/* Cinematic motion layer — book depth, optical glass and controlled motion. */
:root{--scene-accent:95,188,255}.header,main,footer{max-width:1640px}.hero{position:relative;grid-template-columns:minmax(300px,.82fr) minmax(0,1.8fr);gap:34px;min-height:750px;padding:50px 0 75px;isolation:isolate}.hero-copy{position:relative;z-index:3}.hero h1{font-size:clamp(45px,4.15vw,70px);letter-spacing:-2.8px}.hero-copy>p{font-size:20px}.hero-notes{flex-wrap:wrap;gap:10px 20px}.hero h1 em{background-size:220% 100%;animation:title-light 6s ease-in-out infinite alternate}.cinema-art{position:absolute;z-index:-3;inset:-50px -130px -80px -80px;background:url('assets/liquid-orbit.png') center right/cover no-repeat;opacity:.5;mix-blend-mode:screen;mask-image:linear-gradient(90deg,transparent 12%,#000 55%),linear-gradient(0deg,transparent,#000 15% 85%,transparent);mask-composite:intersect;animation:cinema-drift 16s ease-in-out infinite alternate;pointer-events:none}.light .cinema-art{mix-blend-mode:multiply;opacity:.15}.motion-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}.light-ribbon{position:absolute;border:1px solid #49c8ff50;border-radius:50%;pointer-events:none;z-index:-2;box-shadow:0 0 25px #40b9ff20,inset 0 0 25px #44c8ff10}.ribbon-a{width:80%;height:210px;right:-10%;top:24%;animation:ribbon-orbit 15s linear infinite}.ribbon-b{width:66%;height:450px;right:0;top:6%;border-color:#72ffe42a;animation:ribbon-orbit 20s linear infinite reverse}.showcase{height:580px;perspective:1400px;transform:none!important;--tilt-x:0deg;--tilt-y:0deg}.glass-back{left:0;right:300px;top:47px;bottom:110px;transform:rotate(-8deg);border-radius:48% 42% 22% 24%;border-color:#bcefff4d;background:linear-gradient(135deg,#b0eaff26,#70bcff04 45%,#48ffc71c);box-shadow:inset 2px 2px 2px #e1ffff55,inset -2px -2px 15px #4cbfff22,0 20px 90px #00a6ee15;animation:glass-breathe 7s ease-in-out infinite}.orbit{right:290px;left:-20px;top:20px;bottom:100px;animation:orbit-spin 20s linear infinite}.orbit-two{right:275px;left:0;top:80px;bottom:170px;animation-duration:15s;animation-direction:reverse}.showcase-label{left:10px;right:300px;top:3px;font-size:11px;letter-spacing:1px}.book-stage{right:290px;left:0;top:76px;bottom:127px;perspective:1200px;transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateX(var(--drag,0px)) rotateZ(var(--drag-rotate,0deg));transition:transform .45s cubic-bezier(.15,.85,.2,1);user-select:none;-webkit-user-select:none;overflow:visible;z-index:3}.book-stage.dragging{transition:none}.hero-book{top:12px;width:180px;height:266px;left:calc(50% - 90px);transition:transform 1.15s cubic-bezier(.2,.8,.16,1),filter 1s,opacity .8s;box-shadow:10px 26px 35px #0008,-3px 0 3px #a8eaffaa;transform-style:preserve-3d;will-change:transform;animation:levitate 5s ease-in-out infinite}.hero-book:nth-child(2){animation-delay:-1.7s}.hero-book:nth-child(3){animation-delay:-3.4s}.hero-book.center{transform:translateX(0) translateY(-16px) translateZ(95px) rotateY(-13deg) rotateZ(-3deg);filter:brightness(1.16);z-index:3}.hero-book.left{transform:translateX(-132px) translateY(45px) translateZ(-120px) rotateY(29deg) rotateZ(-12deg);filter:brightness(.6);z-index:1}.hero-book.right{transform:translateX(132px) translateY(43px) translateZ(-125px) rotateY(-31deg) rotateZ(11deg);filter:brightness(.65);z-index:1}.hero-book .cover{backface-visibility:hidden}.hero-book:after{width:13px;right:-12px;background:repeating-linear-gradient(0deg,#d3e2e7 0 1px,#7999af 1px 2px);box-shadow:inset -3px 0 4px #355969}.book-edge{position:absolute;left:0;top:0;bottom:0;width:7px;background:linear-gradient(90deg,#c9eeff55,#061c3680,transparent);border-radius:3px;pointer-events:none}.book-glint{position:absolute;inset:0;overflow:hidden;border-radius:4px;pointer-events:none}.book-glint:after{content:'';position:absolute;inset:-30% -90%;background:linear-gradient(110deg,transparent 43%,#dbfaff44 49%,#ffffff77 50%,transparent 56%);animation:book-gloss 5s infinite;transform:translateX(-60%)}.hero-book:not(.center) .book-glint{opacity:.25}.hero-book .book-reflection{position:absolute;top:calc(100% + 35px);height:70%;transform:scaleY(-1);opacity:.17;mask-image:linear-gradient(0deg,#000,transparent 80%);filter:blur(3px);pointer-events:none}.pedestal{left:-15px;right:285px;bottom:117px;height:79px;background:linear-gradient(180deg,#b1e9ff30,#122c4d44 50%,#1bceff21);box-shadow:inset 0 2px 3px #cff8ffc0,0 9px 0 -1px #154868,0 12px 2px -1px #8ce1ff88,0 24px 30px #0015258c,0 0 70px rgba(var(--scene-accent),.24);transition:box-shadow 1s;z-index:2}.stage-halo{position:absolute;right:285px;left:-10px;bottom:117px;height:70px;z-index:0;border-radius:50%;background:radial-gradient(ellipse,rgba(var(--scene-accent),.5),transparent 70%);filter:blur(20px);pointer-events:none}.carousel-bottom{left:20px;right:310px;bottom:31px;z-index:5}.round-button{width:42px;height:42px;background:linear-gradient(135deg,#c8efff22,#5ab6ff05);box-shadow:inset 0 1px 1px #e5faff44,0 4px 15px #0002;flex-shrink:0}.round-button:hover{box-shadow:0 0 30px rgba(var(--scene-accent),.25);transform:scale(1.1)}.slide-copy strong{font-size:12px;max-width:220px}.slide-copy small{font-size:10px}.swipe-note{left:0;right:290px;bottom:2px;font-size:10px}.dots button{width:8px;height:8px;min-height:8px}.dots button.current{width:30px}.dots button:before{content:'';display:block;position:relative;inset:-7px;width:22px;height:22px}.book-explainer{position:absolute;right:-5px;top:52px;width:265px;min-height:422px;padding:25px 23px 18px;border:1px solid #aedfff50;border-radius:24px;background:linear-gradient(140deg,#bbebff21,#81b9dd0a 60%,#4affd215);backdrop-filter:blur(25px) saturate(1.5);box-shadow:inset 1px 1px 1px #ecfaff55,inset -1px -1px 2px #60d7ff25,0 30px 60px #00112640;z-index:5;transform:perspective(900px) rotateY(-5deg);transition:border-color 1s,background .5s;animation:panel-float 7s ease-in-out infinite}.light .book-explainer{background:linear-gradient(140deg,#ffffffbb,#d3f4ff66 60%,#c5f5e977);border-color:#fff;box-shadow:inset 1px 1px 1px white,0 25px 60px #045d891a}.chapter-number{font-family:Manrope,sans-serif;font-size:40px;letter-spacing:-2px;font-weight:500;color:rgb(var(--scene-accent));display:block;margin-bottom:19px}.light .chapter-number{color:var(--blue)}.chapter-number small{font-size:13px;letter-spacing:1px;color:var(--muted)}.book-explainer .eyebrow{font-size:10px;letter-spacing:1.2px;line-height:1.6}.book-explainer h2{font-size:25px;line-height:1.22;letter-spacing:-.8px;margin:12px 0 18px}.explain-title{font-size:13px;font-weight:600;line-height:1.5;margin:0 0 10px}.explain-body{font-size:14px;color:var(--muted);line-height:1.65;margin:0 0 17px}.explain-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:19px}.explain-tags span{font-size:11px;border:1px solid var(--border);padding:5px 8px;border-radius:15px;color:var(--muted);background:var(--glass)}.explain-link{background:none;padding:0;display:flex;align-items:center;justify-content:space-between;width:100%;font-size:14px;color:var(--teal)}.explain-link span{font-size:22px}.explain-edition{display:block;font-size:11px;color:var(--muted);margin-top:10px}.reading-progress{height:2px;background:var(--border);margin:20px 0 12px;overflow:hidden}.reading-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--teal));transform-origin:left;transform:scaleX(0)}.motion-controls{display:flex;flex-direction:column;gap:7px;font-size:10px;color:var(--muted)}#motion-toggle{background:var(--glass);border:1px solid var(--border);border-radius:20px;padding:7px 10px;align-self:flex-start;color:var(--fg);font-size:12px}.swipe-flash{position:absolute;top:100px;bottom:130px;left:0;width:55%;background:linear-gradient(90deg,transparent,#6de9ff50,transparent);filter:blur(12px);opacity:0;pointer-events:none;z-index:4}.subject-bar{position:relative;z-index:2;backdrop-filter:blur(15px);background:linear-gradient(120deg,#b2e4ff0c,#70d9ff03);padding:25px 20px;border-radius:18px;border:1px solid var(--border)}.motion-reveal{opacity:0;transform:translateY(34px) rotateX(5deg);transition:opacity .85s ease var(--reveal-delay,0ms),transform .85s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms)}.motion-reveal.revealed{opacity:1;transform:translateY(0) rotateX(0)}.book-card:hover{transform:translateY(-10px) rotateX(3deg)}.card-image .cover{transition:transform .8s cubic-bezier(.16,1,.3,1);transform:perspective(600px) rotateY(-15deg) rotateZ(-6deg)}.book-card:hover .card-image .cover{transform:perspective(600px) rotateY(8deg) rotateZ(1deg) translateY(-10px);filter:drop-shadow(0 15px 15px #20bcdd33)}.primary{position:relative;overflow:hidden}.primary:before{content:'';position:absolute;inset:-100% -70%;background:linear-gradient(110deg,transparent 45%,#ffffff70 50%,transparent 55%);animation:book-gloss 6s infinite;pointer-events:none}.founder:after{content:'';position:absolute;width:250px;height:250px;right:0;top:0;background:radial-gradient(circle,#00ddcc22,transparent 70%);animation:founder-glow 9s infinite alternate;pointer-events:none}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused .book-stage{transform:none}.motion-paused .motion-reveal{opacity:1;transform:none;transition:none}.motion-paused .hero-book{transition-duration:0s}
@keyframes levitate{0%,100%{translate:0 0}50%{translate:0 -15px}}@keyframes book-gloss{0%,45%{transform:translateX(-65%)}75%,100%{transform:translateX(65%)}}@keyframes title-light{to{background-position:100% 0}}@keyframes glass-breathe{0%,100%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-12px)}}@keyframes panel-float{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes orbit-spin{from{transform:rotate(-20deg) rotateX(8deg)}to{transform:rotate(340deg) rotateX(8deg)}}@keyframes ribbon-orbit{0%{transform:perspective(1000px) rotateX(65deg) rotateZ(-25deg)}50%{transform:perspective(1000px) rotateX(45deg) rotateZ(15deg)}100%{transform:perspective(1000px) rotateX(65deg) rotateZ(-25deg)}}@keyframes cinema-drift{from{transform:scale(1) rotate(-2deg)}to{transform:scale(1.08) rotate(2deg)}}@keyframes founder-glow{to{transform:translate(-240px,60px)}}
@media(min-width:1700px){.hero{grid-template-columns:.85fr 1.9fr;min-height:810px}.showcase{height:625px}.hero-book{width:200px;height:296px;left:calc(50% - 100px)}.hero-book.left{transform:translateX(-155px) translateY(45px) translateZ(-120px) rotateY(29deg) rotateZ(-12deg)}.hero-book.right{transform:translateX(155px) translateY(43px) translateZ(-125px) rotateY(-31deg) rotateZ(11deg)}}
@media(max-width:1250px){.hero{grid-template-columns:1fr;padding-top:25px;gap:5px}.hero-copy{max-width:780px;padding-bottom:25px}.hero h1{font-size:60px;line-height:1.08;margin:18px 0}.hero h1 br{display:none}.hero-copy>p{display:inline-block;font-size:18px;vertical-align:top;margin-right:35px}.hero-copy .hero-description{font-size:15px}.hero-copy .primary{display:flex;width:fit-content}.hero-notes{margin-top:17px}.showcase{width:100%;height:570px;max-width:1000px;justify-self:center}.book-explainer{width:290px;top:16px;right:0}.book-stage{right:340px;top:42px}.glass-back,.orbit{right:335px}.pedestal,.stage-halo{right:325px}.showcase-label{right:340px}.carousel-bottom{right:355px}.swipe-note{right:335px}.hero-book{width:195px;height:288px;left:calc(50% - 97.5px)}.cinema-art{inset:20% -20% -10% -15%}}
@media(max-width:760px){.hero{display:flex;gap:16px;padding-top:25px;min-height:0;padding-bottom:40px}.hero-copy{padding-bottom:5px}.hero h1{font-size:clamp(43px,8.5vw,62px);letter-spacing:-2px}.hero h1 br{display:block}.hero-copy>p{display:block;margin-right:0}.hero-copy .hero-description{font-size:16px}.showcase{height:auto;min-height:0;display:flex;flex-direction:column;padding-top:420px;max-width:550px}.book-stage{top:48px;left:12px;right:12px;height:245px;bottom:auto}.hero-book{width:150px;height:222px;left:calc(50% - 75px);top:10px}.hero-book.center{transform:translateY(-7px) translateZ(70px) rotateY(-13deg) rotateZ(-3deg)}.hero-book.left{transform:translateX(-105px) translateY(29px) translateZ(-100px) rotateY(28deg) rotateZ(-12deg)}.hero-book.right{transform:translateX(105px) translateY(29px) translateZ(-110px) rotateY(-28deg) rotateZ(11deg)}.showcase-label{left:0;right:0;top:0;font-size:10px}.glass-back{inset:35px 0 auto;height:275px}.orbit{inset:25px 0 auto;height:275px}.orbit-two{inset:70px 20px auto;height:180px}.pedestal{left:0;right:0;top:280px;height:51px;bottom:auto}.stage-halo{left:0;right:0;top:270px;height:55px;bottom:auto}.carousel-bottom{left:14px;right:14px;top:345px;bottom:auto;height:43px}.slide-copy small{font-size:10px}.swipe-note{top:400px;bottom:auto;left:0;right:0;font-size:10px}.book-explainer{position:relative;top:auto;right:auto;width:100%;min-height:0;transform:none;padding:24px;margin-top:25px;animation:none;overflow:hidden}.chapter-number{float:right;font-size:32px;margin-left:18px;margin-bottom:8px}.book-explainer h2{font-size:25px;max-width:310px;margin-bottom:12px}.book-explainer .eyebrow{font-size:11px}.explain-body{font-size:16px;line-height:1.65}.explain-title{font-size:14px}.explain-tags span,.explain-edition{font-size:12px}.motion-controls{flex-direction:row;align-items:center;justify-content:space-between;font-size:12px}.swipe-flash{top:60px;bottom:auto;height:240px;width:90%}.hero .light-ribbon{top:32%;right:-10%;width:120%;height:250px}.cinema-art{inset:25% -40% 15% -40%;opacity:.4}.hero-notes{font-size:12px}.subject-bar{padding:20px}.motion-reveal{transform:translateY(20px)}.founder{margin-top:5px}}
@media(prefers-reduced-motion:reduce){body:not(.motion-running) .motion-reveal{opacity:1;transform:none}body:not(.motion-running) .hero-book,body:not(.motion-running) .book-stage{transition:none}body:not(.motion-running) .cinema-art,body:not(.motion-running) .light-ribbon{animation:none}} 
.book-explainer{top:30px}.chapter-number{font-size:34px;margin-bottom:10px}.book-explainer h2{font-size:24px;margin:10px 0 14px}.explain-tags{margin-bottom:14px}.explain-body{margin-bottom:14px}.reading-progress{margin-top:15px}.motion-controls{font-size:11px}@media(max-width:760px){.book-explainer{top:auto}.chapter-number{font-size:32px}.book-explainer h2{font-size:25px}}
/* Let swipe gestures start on the cover without native image dragging. */
.book-stage, .book-stage * { -webkit-user-drag: none; user-select: none; }
.book-stage { touch-action: pan-y; }