:root{--ink: #04100e;--teal-deep: #06201d;--teal: #0c352f;--teal-lift: #15514794;--key: #f4c98a;--paper: #f3ece1;--cream: #efe7da;--muted: #8aa39c;--accent: #ff5b4a;--line: #ffffff1a;--serif: "Fraunces", Georgia, serif;--sans: "Schibsted Grotesk", system-ui, sans-serif;--mono: "JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--sans);color:var(--cream);background:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}::selection{background:var(--accent);color:#1a0c0a}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}.stage{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;background:radial-gradient(120% 80% at 50% 8%,#0e3b34,#08231f 38%,#04100e 78%),var(--ink)}.stage:before{content:"";position:absolute;left:50%;top:46%;width:95vw;max-width:1100px;aspect-ratio:1.5 / 1;transform:translate(-50%,-50%);background:radial-gradient(50% 50% at 50% 50%,#ffd79a55 0%,#f4c98a22 38%,transparent 70%);filter:blur(10px);z-index:0;pointer-events:none}.stage:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(130% 110% at 50% 42%,transparent 52%,#020a09 100%);z-index:6;pointer-events:none}.grain{position:fixed;top:0;right:0;bottom:0;left:0;z-index:7;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.frame{position:absolute;width:var(--w);transform:translate(-50%,-50%) translate(calc(var(--mx) * var(--d) * -26px),calc(var(--my) * var(--d) * -26px)) rotate(var(--rot));transition:transform .5s cubic-bezier(.2,.8,.2,1);opacity:0;animation:frameIn 1.4s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--delay);filter:saturate(.82) brightness(.62) contrast(1.02)}.frame-slides{position:relative;width:100%;aspect-ratio:3 / 2;border-radius:3px;overflow:hidden;box-shadow:0 2px #ffffff0e inset,0 30px 60px -20px #000a,0 8px 20px -10px #000c}.frame-slides img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.1s ease}.frame-slides img.on{opacity:1}.frame:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3px;background:linear-gradient(180deg,#06201d22,#06201d66 70%,#06201daa);mix-blend-mode:multiply}.frame .tag{position:absolute;left:8px;bottom:8px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#fff;opacity:.7;text-shadow:0 1px 6px #000}.frame.empty{aspect-ratio:3/2;filter:none}.frame.empty .ph{width:100%;aspect-ratio:3/2;border-radius:3px;border:1px solid var(--line);background:repeating-linear-gradient(45deg,#0c352f 0,#0c352f 12px,#0a2c27 12px,#0a2c27 24px);display:grid;place-items:center;box-shadow:0 30px 60px -20px #000a}.frame.empty .ph span{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}@keyframes frameIn{0%{opacity:0}to{opacity:1}}.topbar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:26px clamp(20px,5vw,64px);opacity:0;animation:dropIn .9s ease forwards .2s}.monogram{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:.04em;display:flex;align-items:center;gap:10px}.monogram b{color:var(--accent)}.topnav{display:flex;gap:26px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.topnav a,.topnav .navlink{transition:color .25s;color:var(--muted);font:inherit;letter-spacing:inherit;text-transform:inherit;padding:0}.topnav a:hover,.topnav .navlink:hover{color:var(--cream)}.topnav .navlink.on{color:var(--accent)}.hero{position:relative;z-index:4;text-align:center;padding:clamp(18px,4vh,48px) 20px 0}.hero .eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);opacity:0;animation:dropIn .9s ease forwards .35s}.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(48px,11vw,150px);line-height:.92;letter-spacing:-.02em;margin:8px 0 0}.hero h1 .word{display:inline-block;opacity:0;animation:titleIn 1s cubic-bezier(.2,.85,.2,1) forwards}.hero h1 .word:nth-child(1){animation-delay:.45s}.hero h1 .word:nth-child(2){animation-delay:.58s;font-style:italic;font-weight:400}.hero h1 .word b{color:var(--accent);font-weight:inherit}.hero .sub{margin-top:14px;font-family:var(--mono);font-size:clamp(11px,1.4vw,13px);letter-spacing:.28em;text-transform:uppercase;color:var(--cream);opacity:0;animation:dropIn .9s ease forwards .8s}.machine-wrap{position:relative;z-index:4;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:clamp(16px,3vh,40px) 16px 0;min-height:0}.laptop{position:relative;width:min(880px,90vw);perspective:1600px;opacity:0;transform:translateY(40px) scale(.98);animation:machineIn 1.2s cubic-bezier(.2,.85,.2,1) forwards .7s}.laptop .lid{transform-origin:50% 100%;transition:transform .72s cubic-bezier(.45,0,.15,1)}.laptop.closed .lid{transform:scaleX(1.04) scaleY(.03);box-shadow:0 0 0 1px #ffffff10 inset,0 18px 26px -16px #000c}.laptop.closed .lid:after{opacity:0;transition:opacity .3s}.laptop.closed .base{transform:translateY(-8px);border-radius:1px 1px 6px 6px;box-shadow:0 22px 30px -16px #000c;transition:box-shadow .4s,border-radius .4s}.laptop .screen{transition:opacity .3s ease}.laptop.closed .screen{opacity:0}.laptop .lid{position:relative;background:linear-gradient(160deg,#2a2d31,#14161a);border-radius:16px 16px 6px 6px;padding:12px 12px 14px;box-shadow:0 0 0 1px #ffffff14 inset,0 1px #fff2 inset,0 40px 80px -30px #000e,0 18px 40px -20px #000c}.laptop .cam{position:absolute;top:6px;left:50%;transform:translate(-50%);width:5px;height:5px;border-radius:50%;background:#0c0d0f;box-shadow:0 0 0 1.5px #ffffff10}.screen{position:relative;aspect-ratio:16 / 10;border-radius:6px;overflow:hidden;background:var(--paper);box-shadow:0 0 0 1px #000 inset,0 2px 30px #000a inset}.laptop .lid:after{content:"";position:absolute;top:12px;right:12px;bottom:14px;left:12px;border-radius:6px;pointer-events:none;background:linear-gradient(125deg,#ffffff14 0%,transparent 30%);z-index:3}.laptop .base{position:relative;height:14px;margin:0 auto;width:104%;left:-2%;background:linear-gradient(180deg,#303338,#16181c);border-radius:3px 3px 12px 12px;box-shadow:0 22px 30px -16px #000c,0 1px #fff2 inset}.laptop .base:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:90px;height:5px;border-radius:0 0 7px 7px;background:#0c0d0f}.desk{position:relative;z-index:3;width:100%;height:clamp(40px,9vh,90px);margin-top:-2px;background:linear-gradient(180deg,#0a2a25,#061b18 60%,#04110f);box-shadow:0 -1px #ffffff12}.desk:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:min(700px,80vw);height:100%;background:radial-gradient(60% 120% at 50% 0,#ffd79a26,transparent 70%)}.browser{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:var(--paper)}.chrome{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:0 12px;height:clamp(28px,4.4%,40px);background:#e7ddcd;border-bottom:1px solid #00000014;color:#3a352c}.dots{display:flex;gap:6px}.dots i{width:9px;height:9px;border-radius:50%;display:block}.dots i:nth-child(1){background:#ff5f57}.dots i:nth-child(2){background:#febc2e}.dots i:nth-child(3){background:#28c840}.urlbar{flex:1;display:flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:4px 12px;font-family:var(--mono);font-size:clamp(9px,1.3vw,12px);color:#5a5346;max-width:460px;margin:0 auto;box-shadow:0 1px #00000010 inset}.urlbar .lock{color:#2faa55;font-size:.9em}.urlbar .u{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewport{position:relative;flex:1;overflow:hidden;background:#efe7da}.rail{display:flex;height:100%;transition:transform .7s cubic-bezier(.7,0,.2,1);will-change:transform}.slide{position:relative;flex:0 0 100%;height:100%;overflow:hidden}.live-shell{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.live-shell iframe{position:absolute;top:0;left:0;border:0;background:#fff}.live-loading{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background:var(--paper)}.live-loading img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.live-loading .ll-text{position:absolute;left:50%;bottom:14px;transform:translate(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#fff;background:#0009;padding:5px 12px;border-radius:999px}.live-loading.gone{opacity:0;pointer-events:none;transition:opacity .6s ease}.shot{position:absolute;top:0;right:0;bottom:0;left:0}.shot img{width:100%;height:100%;object-fit:cover}.shot-ph{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:8%;background:radial-gradient(120% 120% at 50% 0,var(--pa, #ff5b4a)22,transparent 60%),linear-gradient(160deg,#1b1f24,#0e1013);color:var(--paper)}.shot-ph .pt{font-family:var(--serif);font-weight:600;font-size:clamp(22px,4.2vw,46px);line-height:1}.shot-ph .pmeta{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#fff9}.shot-ph .pbadge{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:5px 12px;border-radius:999px;border:1px solid #ffffff2e;color:#fff}.slide-open{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:flex;align-items:flex-end;justify-content:flex-end;padding:14px;opacity:0;transition:opacity .3s;background:linear-gradient(0deg,#00000055,transparent 35%)}.slide:hover .slide-open{opacity:1}.slide-open .pill{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:var(--paper);color:#16181c;padding:8px 14px;border-radius:999px;display:flex;align-items:center;gap:7px;box-shadow:0 8px 20px -8px #000a}.controls{position:relative;z-index:5;display:flex;align-items:center;justify-content:center;gap:18px;padding:6px 16px;opacity:0;animation:dropIn .9s ease forwards 1.1s}.controls .nav{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#ffffff08;display:grid;place-items:center;color:var(--cream);transition:background .25s,transform .25s,border-color .25s}.controls .nav:hover{background:var(--accent);border-color:var(--accent);color:#1a0c0a;transform:translateY(-2px)}.controls .meta{text-align:center;min-width:190px}.controls .meta .name{font-family:var(--serif);font-size:20px}.controls .meta .idx{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--muted)}.dotnav{display:flex;gap:8px;justify-content:center;margin-top:4px}.dotnav button{width:7px;height:7px;border-radius:50%;background:#ffffff2e;transition:all .25s}.dotnav button.on{background:var(--accent);width:20px;border-radius:4px}.controls.hide{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease}.lid-close{position:absolute;top:0;left:0;right:0;height:12px;z-index:5;cursor:pointer;display:flex;align-items:center;justify-content:center;border:0;border-radius:16px 16px 0 0;background:transparent;transition:background .25s}.lid-close:hover{background:#ffffff16}.lid-close-hint{font-family:var(--mono);font-size:9px;line-height:1;color:var(--cream);opacity:0;transition:opacity .25s}.lid-close:hover .lid-close-hint{opacity:.85}.laptop.closed .lid-close{opacity:0;pointer-events:none;transition:opacity .2s}.about{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:0 24px clamp(90px,18vh,180px);opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease,visibility 0s linear .6s;pointer-events:none}.machine-wrap.is-closed .about{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .7s ease .35s,transform .7s ease .35s}.about-inner{max-width:640px;text-align:center}.about-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent)}.about-inner p{font-family:var(--serif);font-weight:400;font-size:clamp(17px,2.3vw,23px);line-height:1.5;color:var(--cream);margin-top:16px}.socials{display:flex;flex-wrap:wrap;gap:10px 12px;justify-content:center;margin-top:28px}.socials a{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:9px 16px;color:var(--cream);transition:background .25s,border-color .25s,color .25s,transform .25s}.socials a:hover{background:var(--accent);border-color:var(--accent);color:#1a0c0a;transform:translateY(-2px)}.socials .arr{opacity:.55}.lid-open{margin-top:34px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);background:#ffffff0a;border:1px solid var(--line);border-radius:999px;padding:11px 22px;transition:background .25s,border-color .25s,transform .25s}.lid-open:hover{background:var(--accent);border-color:var(--accent);color:#1a0c0a;transform:translateY(-2px)}.contact{position:relative;z-index:5;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 22px;padding:26px 20px 30px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.contact a{transition:color .25s}.contact a:hover{color:var(--accent)}.contact .sep{opacity:.4}@keyframes dropIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes titleIn{0%{opacity:0;transform:translateY(28px) skewY(2deg)}to{opacity:1;transform:none}}@keyframes machineIn{0%{opacity:0;transform:translateY(40px) scale(.98)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*{animation-duration:1ms!important;transition-duration:1ms!important}}@media(max-width:760px){.topnav{display:none}.backdrop .frame:nth-child(n+3){display:none}.frame{--w: 150px !important}.controls .meta{min-width:130px}.controls .meta .name{font-size:16px}}