:root{color-scheme:dark;--ink:#fff3df;--muted:#dfd3c5;--accent:#efc992;--panel-rgb:36,29,28;--scrollbar-thumb:#9b8478;--scrollbar-track:#1b2028;--scrollbar-hover:#d7a665;--scrollbar-active:#f4d9ad;--night:0;--cyber:0;--contact-reveal:0;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:8px}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-hover)}::-webkit-scrollbar-thumb:active{background:var(--scrollbar-active)}
html,body{margin:0;min-width:280px;background:#242329;color:var(--ink)}
button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:7px}button:active,a:active{opacity:.7}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sr-only:focus-within,.sr-only:focus{position:relative;width:auto;height:auto;clip:auto;white-space:normal;padding:32px;background:#142132;margin:0;outline:none}.sr-only p{max-width:650px;line-height:1.6}.sr-only a{text-decoration:underline}
.skip-link{position:fixed;top:-70px;left:24px;background:#fff5e3;color:#172231;padding:16px;z-index:20}.skip-link:focus{top:16px}
#journey{height:880svh;position:relative}.stage{height:100svh;height:100dvh;width:100%;position:sticky;top:0;overflow:hidden;isolation:isolate;background:var(--wall-bottom,#8f8075)}
.art-frame{position:absolute;inset:0;z-index:-3}#office-scene{display:block;width:100%;height:100%}
.scene-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(var(--panel-rgb),.64) 0%,transparent 24%,transparent 67%,rgba(var(--panel-rgb),.96) 100%),linear-gradient(90deg,rgba(var(--panel-rgb),.7),rgba(var(--panel-rgb),.25) 30%,transparent 64%)}
.site-header{position:absolute;top:0;left:0;right:0;padding:32px 4.5vw;display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:13px;min-height:44px}.brand svg{width:31px;height:31px;flex-shrink:0}.brand>span{font-size:15px;font-weight:600;letter-spacing:.16em}.brand small{display:block;font-size:10px;font-weight:400;letter-spacing:.24em;margin-top:7px;color:var(--muted)}.brand:hover{color:var(--accent)}
.header-note{font-size:13px;letter-spacing:.045em;padding-top:15px;color:var(--muted);position:absolute;left:50%;transform:translateX(-50%)}
.clock{text-align:right;min-width:139px}.clock-caption{font-family:monospace;font-size:10px;letter-spacing:.13em;color:var(--muted);display:flex;gap:13px;justify-content:flex-end}.clock-caption span{opacity:.72}.clock-line{display:flex;gap:12px;align-items:center;justify-content:flex-end;margin-top:7px}.clock-line svg{width:21px;height:21px;fill:none;stroke:var(--accent);stroke-width:1.2}.clock time{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:42px;font-weight:300;letter-spacing:-.06em;font-variant-numeric:tabular-nums;line-height:1.05}#phase-label{display:block;margin-top:7px;font-size:12px;color:var(--muted)}
.story-wrap{position:absolute;left:4.5vw;bottom:20%;width:min(610px,46vw)}
.story{position:relative;isolation:isolate}.story:before{content:"";position:absolute;inset:-90px -110px -70px -110px;background:radial-gradient(ellipse at 38% 59%,rgba(var(--panel-rgb),.83) 0%,rgba(var(--panel-rgb),.62) 32%,rgba(var(--panel-rgb),.3) 53%,transparent 73%);z-index:-1;pointer-events:none}
.eyebrow{display:flex;align-items:center;gap:11px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;font-weight:400;letter-spacing:.13em;color:var(--accent);margin:0 0 25px}.eyebrow:before{content:"";display:block;width:25px;height:1px;background:currentColor}
.story h1,.story h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(46px,4.7vw,76px);font-weight:400;line-height:1.035;letter-spacing:-.048em;margin:0 0 25px;text-wrap:balance}.story em{font-weight:400;color:var(--accent)}.story p{font-size:16px;font-weight:400;line-height:1.65;max-width:380px;margin:0;color:var(--muted);text-wrap:pretty}
.story-action{display:inline-flex;gap:24px;align-items:center;padding:13px 0 11px;margin-top:25px;border:0;border-bottom:1px solid #fff4df55;background:none;font-size:13px;letter-spacing:.025em;min-height:44px}.story-action span{font-size:20px;font-weight:300;transition:transform .2s}.story-action:hover{color:var(--accent);border-color:var(--accent)}.story-action:hover span{transform:translateX(4px)}
.story.reveal{animation:story-reveal .38s ease-out both}@keyframes story-reveal{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
.contact-moment{position:absolute;left:60%;top:62%;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:9px;opacity:var(--contact-reveal);transform:translate(-50%,calc(-50% + (1 - var(--contact-reveal))*14px)) scale(calc(.96 + var(--contact-reveal)*.04));pointer-events:none;filter:drop-shadow(0 16px 35px rgba(7,18,29,.28));will-change:opacity,transform}.contact-moment.is-active{pointer-events:auto}.contact-kicker{margin-left:16px;padding:6px 10px;background:rgba(var(--panel-rgb),.74);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;line-height:1;letter-spacing:.16em;color:var(--accent);backdrop-filter:blur(8px)}
.contact-cta{position:relative;display:flex;align-items:center;justify-content:space-between;gap:34px;min-width:214px;min-height:58px;padding:0 17px 0 21px;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 68%,white 8%);background:rgba(var(--panel-rgb),.78);color:var(--ink);font-family:Georgia,'Times New Roman',serif;font-size:22px;letter-spacing:-.025em;backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.045),0 0 0 1px rgba(5,16,27,.22);transition:border-color .25s,color .25s,transform .25s,background .25s}.contact-cta:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,transparent 15%,color-mix(in srgb,var(--accent) 18%,transparent) 50%,transparent 82%);transform:translateX(-110%);transition:transform .55s ease}.contact-cta svg{width:25px;height:25px;fill:none;stroke:var(--accent);stroke-width:1.3;transition:transform .25s}.contact-cta:hover{color:#fff;border-color:var(--accent);background:rgba(var(--panel-rgb),.9);transform:translateY(-2px)}.contact-cta:hover:before{transform:translateX(110%)}.contact-cta:hover svg{transform:translateX(3px)}.contact-cta:active{transform:translateY(0)}
.scene-caption{position:absolute;right:4.5vw;bottom:23%;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;letter-spacing:.025em;color:var(--muted);display:flex;align-items:center;gap:13px;text-shadow:0 1px 10px #101723}.caption-line{width:25px;height:1px;background:var(--accent)}
.journey-footer{position:absolute;bottom:0;left:0;right:0;padding:0 4.5vw max(24px,env(safe-area-inset-bottom));background:linear-gradient(0deg,rgba(var(--panel-rgb),.9),transparent);z-index:4}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}.scroll-cue{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;letter-spacing:.13em;color:var(--muted);display:flex;align-items:center;gap:12px}.scroll-cue>span{font-size:20px;color:var(--accent)}.journey-position{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;letter-spacing:.13em;color:var(--muted);position:absolute;left:50%;transform:translateX(-50%)}.motion-toggle{background:none;border:0;font-size:12px;color:var(--muted);padding:12px 0 12px 12px;min-height:44px}.motion-toggle:hover{color:var(--ink)}.motion-toggle[aria-pressed=true]{color:var(--accent)}
.timeline{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border-top:1px solid #e4dcca30}.time-stop{background:none;border:0;text-align:left;color:var(--muted);padding:16px 0 4px;position:relative;min-height:50px;display:flex;align-items:center;gap:10px;white-space:nowrap}.time-stop:before{content:"";position:absolute;top:-2px;left:0;width:3px;height:3px;background:#a59b91;border-radius:50%}.time-stop time{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;letter-spacing:.025em}.time-stop .stop-label{font-size:11px;color:var(--muted);opacity:.75}.time-stop[aria-current=step],.time-stop:hover{color:var(--accent)}.time-stop[aria-current=step]:before{background:var(--accent);width:5px;height:5px;top:-3px;box-shadow:0 0 12px var(--accent)}.time-stop[aria-current=step] .stop-label{color:var(--ink);opacity:1}.time-stop:last-child{justify-content:flex-end}.time-stop:last-child:before{left:auto;right:0}
.progress-track{position:absolute;left:0;bottom:0;width:100%;height:3px;background:#f5e8d516}.progress-track>div{height:100%;width:100%;transform-origin:left;transform:scaleX(0);background:var(--accent)}
.cable-stroke{stroke-dasharray:1;stroke-dashoffset:1}.screen-ui{opacity:var(--cyber)}#stars,#moon{opacity:var(--night)}#cyber-city,#neon-wash{opacity:var(--cyber)}.no-script{position:fixed;z-index:20;inset:auto 5% 15%;background:#17212ded;padding:30px;max-width:600px;line-height:1.6}
[data-reduced=true] .story.reveal{animation:none}[data-reduced=true] .contact-moment{transform:translate(-50%,-50%)}[data-reduced=true] *{scroll-behavior:auto!important;transition:none!important}
@media(min-width:1800px){.story-wrap{bottom:23%;width:660px}.story h1,.story h2{font-size:84px}}
@media(max-width:1100px){.story-wrap{width:47vw;bottom:23%}.story h1,.story h2{font-size:57px}.scene-caption{max-width:230px;line-height:1.5}.time-stop{display:block}.time-stop .stop-label{display:block;margin-top:7px;font-size:10px}.time-stop:last-child{text-align:right}.header-note{display:none}}
@media(max-width:700px){
 #journey{height:820svh}.site-header{padding:22px 6vw}.brand{gap:9px;align-items:center}.brand svg{width:26px;height:26px}.brand>span{font-size:12px;letter-spacing:.12em}.brand small{font-size:9px;letter-spacing:.17em;margin-top:6px}.clock{min-width:105px}.clock-caption{font-size:8px;gap:7px}.clock time{font-size:32px}.clock-line{gap:7px}.clock-line svg{width:16px;height:16px}#phase-label{font-size:10px}
 .art-frame{inset:0 0 auto;height:64%;width:100%}#office-scene{width:100%;height:100%}.scene-shade{background:linear-gradient(180deg,rgba(var(--panel-rgb),.67),transparent 18%,transparent 37%,rgba(var(--panel-rgb),.8) 57%,rgba(var(--panel-rgb),1) 67%),linear-gradient(90deg,rgba(var(--panel-rgb),.13),transparent 65%)}
 .contact-moment{left:50%;top:38.5%;gap:6px}.contact-kicker{margin-left:11px;padding:5px 8px;font-size:8px}.contact-cta{min-width:174px;min-height:48px;padding:0 13px 0 16px;gap:25px;font-size:18px}.contact-cta svg{width:21px;height:21px}
 .story-wrap{left:6vw;right:6vw;top:51%;bottom:auto;width:auto}.story:before{display:none}.eyebrow{font-size:10px;letter-spacing:.1em;margin-bottom:13px;gap:9px}.eyebrow:before{width:17px}.story h1,.story h2{font-size:clamp(34px,9.5vw,48px);line-height:1.02;letter-spacing:-.04em;margin-bottom:15px;max-width:460px}.story p{font-size:14px;line-height:1.55;max-width:380px}.story-action{margin-top:13px;font-size:12px;padding:9px 0;min-height:38px;gap:19px}.story-action span{font-size:17px}.scene-caption{display:none}
 .journey-footer{padding:0 6vw max(16px,env(safe-area-inset-bottom))}.footer-top{margin-bottom:0;gap:5px}.scroll-cue{font-size:8px;letter-spacing:.07em;gap:7px}.scroll-cue>span{font-size:16px}.journey-position{display:none}.motion-toggle{font-size:10px;padding-left:5px}.time-stop{padding-top:10px;min-height:39px}.time-stop time{font-size:9px}.time-stop .stop-label{display:none}.time-stop:last-child{text-align:right}.timeline{gap:0}
}
@media(max-width:700px) and (min-height:850px){.story-wrap{top:52%}.story h1,.story h2{font-size:clamp(38px,10vw,51px)}.story p{font-size:16px}}
@media(max-width:700px) and (max-height:710px){.art-frame{height:60%}.story-wrap{top:46%}.story h1,.story h2{font-size:34px;margin-bottom:10px}.story p{font-size:14px;line-height:1.4}.eyebrow{margin-bottom:10px}.story-action{margin-top:9px}.site-header{padding-top:16px}.clock time{font-size:29px}.footer-top{margin-bottom:-4px}.story:has(h1) h1{font-size:32px}}
@media(min-width:701px) and (max-height:660px){.site-header{padding-top:20px}.story-wrap{bottom:23%;width:490px}.story h1,.story h2{font-size:45px;margin-bottom:15px}.eyebrow{margin-bottom:14px}.story p{font-size:14px;max-width:365px}.story-action{margin-top:12px}.scene-caption{display:none}.journey-footer{padding-bottom:14px}.footer-top{margin-bottom:0}.clock time{font-size:34px}}
@media(max-width:900px) and (orientation:landscape) and (max-height:500px){.art-frame{height:100%}.scene-shade{background:linear-gradient(90deg,rgba(var(--panel-rgb),.86),rgba(var(--panel-rgb),.25) 54%,transparent),linear-gradient(0deg,rgba(var(--panel-rgb),.92),transparent 50%)}.brand small,.clock-caption,#phase-label,.story-action,.header-note,.scene-caption,.scroll-cue,.journey-position{display:none}.site-header{padding:14px 4vw}.clock time{font-size:27px}.story-wrap{left:4vw;top:auto;bottom:25%;width:48vw}.story h1,.story h2{font-size:34px;margin-bottom:12px}.story p{font-size:13px;line-height:1.45}.eyebrow{margin-bottom:10px;font-size:9px}.contact-moment{left:68%;top:48%}.contact-kicker{font-size:8px}.contact-cta{min-width:168px;min-height:44px;font-size:17px}.footer-top{justify-content:flex-end;height:28px}.motion-toggle{padding:3px;min-height:28px}.time-stop{padding-top:8px;min-height:34px}.time-stop .stop-label{display:none}.journey-footer{padding-bottom:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.story.reveal{animation:none}.story-action span{transition:none}}
@media(forced-colors:active){*{scrollbar-color:auto}.scene-shade{background:Canvas;opacity:.88}.time-stop,.story-action,.contact-cta{border:1px solid ButtonText}.contact-kicker{background:Canvas;border:1px solid CanvasText}.progress-track{border:1px solid CanvasText}.progress-track>div{background:Highlight}}
@media print{#journey{display:none}.sr-only{position:static;width:auto;height:auto;clip:auto;white-space:normal;color:#000}.skip-link{display:none}}
@media(max-width:700px) and (orientation:portrait) and (max-height:600px){.story-wrap{max-height:calc(54svh - 100px);overflow-y:auto;padding-right:10px;scrollbar-gutter:stable}.story p{font-size:14px}.story h1,.story h2{font-size:30px}}