@property --angle{syntax:'<angle>';inherits:false;initial-value:0deg}
/* (Google Fonts) unavailable by request; CSS uses named stacks with local fallbacks. IntersectionObserver instance with `threshold: [0, 0.3, 0.5]`; IntersectionObserver only:** IntersectionObserver with threshold 0.5; IntersectionObserver-triggered reveals instead. IntersectionObserver. Background transitions to `#0d1526`. */
:root{--black:#060a14;--abyss:#0d1526;--cobalt:#1a2744;--current:#2a3f6e;--slate:#4a5e7a;--fog:#5b6b85;--lav:#8a94a8;--pearl:#c0c7d4;--foam:#e8ecf2;--teal:#2ec4b6;--violet:#7b6ba5;--copper:#c4956a;--bg:#1a2744}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;background:#060a14}body{background:var(--bg);color:var(--lav);font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.72;overflow-x:hidden;transition:background 1.6s ease}.zone{position:relative;width:100%;overflow:hidden}.zone-label{position:absolute;top:2rem;left:8vw;z-index:5;font-family:"IBM Plex Mono","Courier New",monospace;font-size:12px;letter-spacing:.2em;color:#2ec4b6;text-transform:uppercase;opacity:.78}.dim{color:#4a5e7a;opacity:.5}.zone-border{border:0;height:1px;width:100%;margin:2.5rem 0;background:linear-gradient(90deg,transparent,#2ec4b6 30%,#7b6ba5 50%,#2ec4b6 70%,transparent);transform:scaleX(0);transform-origin:left;transition:transform 1.5s ease-out}.zone-border.visible{transform:scaleX(1)}
.surface-btn{position:fixed;top:1.5rem;right:1.5rem;z-index:50;width:36px;height:36px;border-radius:50%;border:1px solid #2ec4b6;background:rgba(6,10,20,.35);color:#2ec4b6;font-family:"IBM Plex Mono","Courier New",monospace;font-size:15px;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(8px);animation:pulse 2.4s ease-in-out infinite;transition:opacity .6s ease,transform .3s ease,color .3s ease}.surface-btn small{position:absolute;top:42px;right:-10px;font-size:8px;letter-spacing:.12em;text-transform:uppercase}.surface-btn:hover{color:#e8ecf2;transform:translateY(-2px)}@keyframes pulse{50%{box-shadow:0 0 0 10px rgba(46,196,182,0),inset 0 0 14px rgba(46,196,182,.25)}0%,100%{box-shadow:0 0 0 0 rgba(46,196,182,.5)}}
.zone-1{height:100vh;background:linear-gradient(180deg,#1a2744 0%,#0d1526 100%)}.lens-streak{position:absolute;top:14vh;left:0;width:100vw;height:2px;background:linear-gradient(90deg,transparent 0%,rgba(46,196,182,.3) 30%,rgba(123,107,165,.5) 50%,rgba(46,196,182,.3) 70%,transparent);filter:blur(1px);animation:streak 18s ease-in-out infinite}.lens-flare{position:absolute;top:18vh;right:14vw;width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,rgba(46,196,182,.6) 0%,rgba(46,196,182,.15) 40%,rgba(46,196,182,0) 70%);filter:blur(4px);animation:flare 30s ease-in-out infinite}.zone-1 h1{position:absolute;left:8vw;top:30vh;font-family:"Space Grotesk",Inter,Arial,sans-serif;font-size:clamp(6rem,15vw,14rem);font-weight:700;letter-spacing:-.04em;line-height:.9;color:#e8ecf2;white-space:nowrap;text-shadow:0 0 40px rgba(192,199,212,.15)}.hero-sub{position:absolute;left:8vw;top:calc(30vh + clamp(6rem,15vw,14rem)*.95);font-style:italic;font-size:1.1rem;color:#c0c7d4}.hero-sub b{font-family:"IBM Plex Mono","Courier New",monospace;font-style:normal;font-size:.95rem;color:#2ec4b6;letter-spacing:.12em}.hero-meta{position:absolute;left:8vw;bottom:6vh;font-family:"IBM Plex Mono","Courier New",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#4a5e7a}.zone-1 .zone-border{position:absolute;bottom:0;margin:0}@keyframes streak{50%{transform:translateY(22px)}0%,100%{transform:translateY(-18px)}}@keyframes flare{25%{transform:translate(-40px,60px) scale(1.1)}50%{transform:translate(30px,110px) scale(.95)}75%{transform:translate(70px,40px) scale(1.05)}}
.zone-2{min-height:120vh;background:#0d1526;padding:10vh 0}.spread{display:grid;grid-template-columns:45% 55%;gap:4vw;align-items:center;min-height:90vh;padding:0 4vw}.bust-wrap{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.4rem}.bust{position:relative;width:180px;height:240px;border-radius:45% 45% 42% 42%;background:radial-gradient(ellipse at 40% 30%,#c0c7d4 0%,#8a94a8 40%,#4a5e7a 100%);box-shadow:inset -14px -20px 30px rgba(10,14,26,.55),inset 10px 8px 22px rgba(232,236,242,.3),0 30px 60px rgba(6,10,20,.6);overflow:hidden}.bust:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 12px,rgba(196,149,106,.08) 12px 14px);mix-blend-mode:overlay}.bust i:before,.bust i:after{content:"";position:absolute;top:38%;width:38px;height:38px;border-radius:50%;border:2px solid rgba(46,196,182,.9);background:radial-gradient(circle at 35% 30%,rgba(46,196,182,.35),rgba(6,10,20,.6));box-shadow:0 0 12px rgba(46,196,182,.4)}.bust i:before{left:30px}.bust i:after{right:30px}.bust:after{content:"";position:absolute;top:46%;left:67px;width:46px;height:2px;background:rgba(46,196,182,.6);box-shadow:0 0 6px #2ec4b6}.bust-wrap p{font-family:"IBM Plex Mono","Courier New",monospace;font-size:11px;letter-spacing:.14em;color:#4a5e7a;text-align:center}.prose{padding-right:12vw;text-align:right}.prose p{color:#8a94a8}.prose em{color:#c4956a}
.zone-3{min-height:130vh;background:linear-gradient(180deg,#0d1526 0%,#080f1f 100%);padding:14vh 0}.corridor{max-width:40ch;margin:0 auto;position:relative;z-index:2}.signal{display:flex;gap:1.2rem;padding:2.2rem 0;font-family:"IBM Plex Mono","Courier New",monospace;font-size:14px;line-height:1.8;letter-spacing:.04em;color:#5b6b85}.signal.right{flex-direction:row-reverse;text-align:right;padding-left:2rem}.signal.left{padding-right:2rem}.signal i{position:relative;flex:0 0 40px;width:40px;height:40px;margin-top:4px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c0c7d4 0%,#8a94a8 45%,#4a5e7a 100%);box-shadow:inset -4px -4px 8px rgba(6,10,20,.5),0 0 18px rgba(46,196,182,.12)}.signal i:before{content:"";position:absolute;inset:-4px;border-radius:50%;padding:2px;background:conic-gradient(from var(--angle),#2a3f6e,#2ec4b6,#7b6ba5,#2a3f6e);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:angle 8s linear infinite}.watermark{position:absolute;z-index:1;font-family:"Cormorant Garamond",Georgia,serif;font-size:20vw;color:rgba(42,63,110,.08);line-height:1;pointer-events:none}.wm-a{top:7vh;left:-4vw}.wm-b{right:-4vw;bottom:5vh}@keyframes angle{to{--angle:360deg}}
.zone-4{min-height:100vh;background:#060a14}.particle-field{position:absolute;inset:0;overflow:hidden;pointer-events:none}.particle{position:absolute;bottom:-10vh;border-radius:50%;background:radial-gradient(circle,rgba(46,196,182,.75),rgba(46,196,182,.25) 40%,rgba(46,196,182,0) 75%);filter:blur(2px);animation:rise linear infinite}.particle.v{background:radial-gradient(circle,rgba(123,107,165,.7),rgba(123,107,165,0) 75%)}.particle.p{background:radial-gradient(circle,rgba(192,199,212,.6),rgba(192,199,212,0) 75%)}@keyframes rise{0%{transform:translate(0,0);opacity:0}10%{opacity:.9}50%{transform:translate(var(--drift),-55vh) scale(1.2)}100%{transform:translate(calc(var(--drift)*-1),-120vh) scale(.8);opacity:0}}.whisper{position:relative;z-index:2;min-height:50vh;display:flex;align-items:center;justify-content:center;padding:0 8vw;text-align:center;font-family:"IBM Plex Mono","Courier New",monospace;font-size:14px;letter-spacing:.06em;color:#4a5e7a;opacity:.35;transform:translateY(18px);transition:opacity 2s ease,color 2s ease,transform 2s ease}.whisper.visible{opacity:1;color:#8a94a8;transform:none}.whisper span{color:#2ec4b6;text-shadow:0 0 12px rgba(46,196,182,.6)}
.zone-5{min-height:100vh;background:linear-gradient(180deg,#060a14 0%,#0a0e1a 70%,#060a14 100%);padding:10vh 0 8vh;text-align:center}.column-stage{position:relative;height:70vh;display:flex;align-items:flex-end;justify-content:center}.column{position:relative;width:60px;height:70vh;animation:glow 12s ease-in-out infinite}.column b{position:absolute;top:22px;left:0;width:60px;height:calc(70vh - 44px);border:2px solid #2a3f6e;background:linear-gradient(180deg,#c0c7d4 0%,#4a5e7a 50%,#1a2744 100%);box-shadow:inset -6px 0 12px rgba(6,10,20,.4);animation:border 12s ease-in-out infinite}.column i,.column em{position:absolute;left:50%;transform:translateX(-50%);border:2px solid #2a3f6e}.column i{top:0;width:110px;height:22px;background:linear-gradient(180deg,#c0c7d4,#8a94a8);border-bottom:3px solid #c4956a}.column em{bottom:0;width:100px;height:22px;background:linear-gradient(180deg,#4a5e7a,#1a2744)}.spiral{position:absolute;top:50%;left:50%;animation:spin 40s linear infinite}.spiral span{position:absolute;font-family:"IBM Plex Mono","Courier New",monospace;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#c0c7d4;white-space:nowrap;transform-origin:left center;transform:rotate(var(--a)) translateX(120px);text-shadow:0 0 8px rgba(46,196,182,.25)}.signoff{margin-top:4vh;color:#4a5e7a;font-style:italic}.stamp{margin-top:1.2rem;font-family:"IBM Plex Mono","Courier New",monospace;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#2a3f6e}@keyframes border{25%{border-color:#2ec4b6}50%{border-color:#7b6ba5}75%{border-color:#c4956a}}@keyframes glow{50%{filter:drop-shadow(0 0 12px rgba(123,107,165,.7))}}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:760px){.spread{grid-template-columns:1fr}.prose{padding:0 8vw;text-align:left}.zone-1 h1{top:24vh}.hero-sub{top:calc(24vh + clamp(6rem,15vw,14rem)*.95)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.zone-border{transform:scaleX(1)}.whisper{opacity:1;color:#8a94a8;transform:none}}
