:root{--bg:#03060c;--surface:#080d16;--ink:#f1f6ff;--muted:#8290a6;--blue:#168bff;--line:rgba(151,177,211,.16);--pad:clamp(1.25rem,5vw,5rem)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,system-ui,sans-serif;overflow-x:hidden}body.loading{overflow:hidden}::selection{background:var(--blue);color:white}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.noise{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.cursor-glow{position:fixed;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(22,139,255,.14),transparent 68%);pointer-events:none;z-index:25;mix-blend-mode:screen;transform:translate(-50%,-50%);transition:opacity .3s}.intro{position:fixed;inset:0;background:#020409;z-index:100;display:grid;place-content:center;gap:1.5rem;animation:introExit .9s 1.65s cubic-bezier(.7,0,.2,1) forwards}.intro-mark{font-size:clamp(3rem,9vw,7rem);font-weight:800;letter-spacing:-.08em}.intro-mark span,.brand span{color:var(--blue)}.intro-line{width:180px;height:1px;background:#142236;overflow:hidden}.intro-line span{display:block;width:100%;height:100%;background:var(--blue);transform:translateX(-100%);animation:load 1.25s .15s ease forwards}@keyframes load{to{transform:none}}@keyframes introExit{to{transform:translateY(-102%);visibility:hidden}}
.nav-wrap{height:88px;position:absolute;z-index:30;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);border-bottom:1px solid var(--line)}.brand{font:700 .9rem Space Mono,monospace;letter-spacing:.08em}.nav-wrap nav{display:flex;gap:2.2rem}.nav-wrap nav a{font-size:.77rem;color:#aab6c8;transition:.2s}.nav-wrap nav a:hover{color:white}.nav-cta{font-size:.78rem;border:1px solid #283448;padding:.85rem 1.1rem;border-radius:999px}.nav-cta span{color:var(--blue);margin-left:.5rem}
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:8rem var(--pad) 4rem;isolation:isolate;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,transparent 60%),radial-gradient(circle at 72% 45%,rgba(8,76,145,.13),transparent 34%);z-index:-2}.hero-content{width:min(1180px,100%);margin:auto;position:relative;z-index:2}.eyebrow,.mono,.section-number,.photo-note,.project-disclaimer{font:400 .68rem Space Mono,monospace;letter-spacing:.16em;color:#8190a8}.eyebrow{display:flex;align-items:center;gap:.7rem}.eyebrow span{width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 12px var(--blue)}.hero h1{margin:clamp(1.6rem,4vw,3rem) 0;font-size:clamp(4rem,10.8vw,9.6rem);line-height:.82;letter-spacing:-.075em;user-select:none}.hero-line{display:block;opacity:0;transform:translateY(70px);animation:heroIn 1.1s 2.05s cubic-bezier(.16,1,.3,1) forwards}.hero-line:nth-child(2){animation-delay:2.18s}.outline{color:transparent;-webkit-text-stroke:1px rgba(227,239,255,.75)}.outline em{font-style:normal;color:var(--blue);-webkit-text-stroke:0;text-shadow:0 0 45px rgba(22,139,255,.32)}@keyframes heroIn{to{opacity:1;transform:none}}.hero-footer{display:flex;justify-content:space-between;align-items:flex-end;max-width:890px}.hero-footer>p{font-size:clamp(.95rem,1.4vw,1.15rem);line-height:1.75;color:#91a0b5;max-width:550px}.round-link{width:96px;height:96px;border:1px solid #31405a;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;transition:.3s}.round-link:hover{border-color:var(--blue);background:rgba(22,139,255,.08)}.round-link span{color:var(--blue);font-size:1.35rem}.round-link small{font:400 .55rem Space Mono}.scroll-tag{position:absolute;right:var(--pad);bottom:2rem;writing-mode:vertical-rl;font:400 .52rem Space Mono;letter-spacing:.18em;color:#5e6d83;display:flex;align-items:center;gap:.7rem}.scroll-tag span{display:block;width:1px;height:50px;background:linear-gradient(var(--blue),transparent)}
.hero-orbit{position:absolute;z-index:-1;right:-4vw;top:14%;width:min(50vw,680px);aspect-ratio:1;opacity:.65}.orbit{position:absolute;border:1px solid rgba(47,145,255,.21);border-radius:50%;inset:10%;animation:spin 18s linear infinite}.orbit:before,.orbit:after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 20px var(--blue)}.orbit:before{left:13%;top:12%}.orbit:after{right:5%;bottom:24%}.orbit-two{inset:27%;animation-direction:reverse;animation-duration:11s;border-style:dashed}.core{position:absolute;inset:41%;border-radius:50%;background:var(--blue);filter:blur(35px);opacity:.32}@keyframes spin{to{transform:rotate(360deg)}}
.section-pad{padding:clamp(6rem,12vw,11rem) var(--pad);position:relative}.section-number{padding-bottom:2rem;border-bottom:1px solid var(--line)}.statement{min-height:90vh;display:flex;flex-direction:column;justify-content:center}.statement-copy{margin:clamp(4rem,8vw,8rem) auto;width:min(1060px,100%)}.statement-copy h2,.about-copy h2,.projects-heading h2,.contact h2{font-size:clamp(2.8rem,7vw,7.4rem);line-height:1.02;letter-spacing:-.06em;margin:1rem 0}.statement-copy h2 span,.about-copy h2 span,.projects-heading h2 span,.contact h2 span{color:var(--blue)}.float-code{position:absolute;right:8%;bottom:11%;font:400 .72rem Space Mono;color:#526076;transform:rotate(-7deg)}.float-code strong{display:block;color:#168bff;font-size:1.1rem}
.about{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(340px,1fr);gap:clamp(3rem,9vw,10rem);align-items:center;background:linear-gradient(135deg,#050912,#02050a)}.photo-frame{position:relative;aspect-ratio:4/5;overflow:hidden;background:#07101d;clip-path:polygon(0 0,90% 0,100% 8%,100% 100%,10% 100%,0 92%)}.photo-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,#03060c 100%),linear-gradient(90deg,rgba(10,81,150,.18),transparent)}.photo-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.08)}.photo-scan{position:absolute;z-index:2;left:0;top:0;width:100%;height:1px;background:#2c9dff;box-shadow:0 0 16px #168bff;animation:scan 5s ease-in-out infinite}@keyframes scan{50%{top:100%}}.corner{position:absolute;z-index:3;width:22px;height:22px;border-color:#40a9ff}.c1{top:16px;left:16px;border-top:1px solid;border-left:1px solid}.c2{top:16px;right:16px;border-top:1px solid;border-right:1px solid}.c3{bottom:16px;left:16px;border-bottom:1px solid;border-left:1px solid}.c4{bottom:16px;right:16px;border-bottom:1px solid;border-right:1px solid}.photo-note{line-height:1.7;margin-top:1.2rem}.photo-note strong{color:#aab7ca;font-weight:400}.about-copy>p:not(.eyebrow){color:#95a2b5;line-height:1.85;font-size:1.05rem;max-width:630px}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:3rem;padding-top:2.2rem;gap:1rem}.stats div{display:flex;align-items:flex-start;gap:.8rem}.stats strong{font-size:2.2rem;color:white;line-height:1}.stats span{font:400 .55rem Space Mono;color:#78869b;line-height:1.5}
.skills{background:#050910}.skills-list{margin-top:2rem}.skill-row{display:grid;grid-template-columns:60px 1.2fr 1fr 40px;align-items:center;gap:1rem;padding:2.3rem 0;border-bottom:1px solid var(--line);transition:.35s}.skill-row:hover{padding-left:1.4rem;border-color:rgba(22,139,255,.5)}.skill-row>span{font:400 .65rem Space Mono;color:var(--blue)}.skill-row h3{font-size:clamp(1.55rem,3vw,3rem);letter-spacing:-.04em;margin:0}.skill-row p{color:#7e8b9e}.skill-row b{font-weight:400;font-size:1.5rem;color:#54647b;transition:.3s}.skill-row:hover b{color:var(--blue);transform:rotate(45deg)}
.projects-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:5rem}.projects-heading .section-number{align-self:flex-start;min-width:260px}.projects-heading h2{margin:0}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.project-card{display:block}.project-ui{height:clamp(350px,42vw,580px);position:relative;overflow:hidden;border:1px solid var(--line);background:#07101d;transition:.55s cubic-bezier(.16,1,.3,1)}.project-card:hover .project-ui{transform:scale(.985);border-color:rgba(22,139,255,.5)}.factory-ui{padding:12%;background:radial-gradient(circle at 50% 50%,#102b4d,#050914 70%)}.ui-top{display:flex;justify-content:space-between;font:400 .55rem Space Mono;letter-spacing:.15em;color:#7890ad}.ui-top i{width:7px;height:7px;border-radius:50%;background:#3cff9b;box-shadow:0 0 12px #3cff9b}.gauge{width:65%;aspect-ratio:1;margin:8% auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--blue) 0 84%,rgba(255,255,255,.08) 84%);position:relative;box-shadow:0 0 50px rgba(22,139,255,.18)}.gauge:before{content:"";position:absolute;inset:8px;background:#0a1424;border-radius:50%}.gauge div{z-index:1;text-align:center}.gauge strong{font-size:clamp(2rem,5vw,4.5rem);letter-spacing:-.06em}.gauge small{display:block;font:400 .55rem Space Mono;color:#66809d}.ui-stats{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.1);padding-top:1rem}.ui-stats span{font:700 1rem Space Mono}.ui-stats small{display:block;color:#5c6c80;font-size:.45rem;margin-top:.4rem}.network-ui{background:radial-gradient(circle,#09274a,#04070d 65%);display:grid;place-items:center}.network-core{width:118px;height:118px;border-radius:50%;border:1px solid #148dff;display:grid;place-content:center;text-align:center;font:700 1rem Space Mono;box-shadow:0 0 50px rgba(22,139,255,.25),inset 0 0 25px rgba(22,139,255,.15);z-index:2}.network-core span{color:#168bff;font-size:.65rem}.network-ui svg{position:absolute;width:100%;height:100%;inset:0}.network-ui path{stroke:#168bff;stroke-width:.7;fill:none;stroke-dasharray:5 7;opacity:.55}.node{position:absolute;width:13px;height:13px;border-radius:50%;background:#0b1726;border:2px solid #168bff;box-shadow:0 0 15px #168bff;z-index:2}.n1{left:17%;top:20%}.n2{right:16%;top:17%}.n3{left:20%;bottom:16%}.n4{right:13%;bottom:18%}.project-meta{display:grid;grid-template-columns:40px 1fr 30px;gap:1rem;padding:1.6rem 0;align-items:start}.project-meta>span{font:400 .6rem Space Mono;color:var(--blue)}.project-meta h3{font-size:1.35rem;margin:0 0 .4rem}.project-meta p{margin:0;color:#738198;font-size:.8rem}.project-meta b{font-weight:400;color:#6f819a;font-size:1.4rem}.project-disclaimer{text-align:right;margin-top:2rem}
.contact{min-height:100vh;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;background:#02050a}.contact-copy{text-align:center;margin:auto;position:relative;z-index:2}.contact-copy .mono{color:#8190a8}.email-link{display:inline-flex;align-items:center;gap:1rem;margin-top:2rem;padding:1rem 1.4rem;border-bottom:1px solid #304158;font:400 clamp(.9rem,1.5vw,1.1rem) Space Mono}.email-link span{color:var(--blue)}.contact-aura{position:absolute;width:65vw;height:65vw;max-width:950px;max-height:950px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-45%);background:radial-gradient(circle,rgba(14,97,183,.23),transparent 64%);filter:blur(10px)}footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:1.5rem;font:400 .58rem Space Mono;color:#69778b;position:relative;z-index:2}footer div{display:flex;gap:1.5rem}footer a:hover{color:white}
.reveal{opacity:0;transform:translateY(60px);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1)}.reveal.visible{opacity:1;transform:none}
@media (max-width:800px){.nav-wrap{height:72px}.nav-wrap nav{display:none}.nav-cta{padding:.7rem .9rem}.hero{padding-top:7rem}.hero h1{font-size:clamp(3.65rem,18vw,6.5rem);line-height:.88}.hero-orbit{width:95vw;right:-45vw;top:25%}.hero-footer{align-items:center}.hero-footer>p{max-width:75%}.round-link{width:74px;height:74px}.scroll-tag{display:none}.statement{min-height:75vh}.float-code{display:none}.about{grid-template-columns:1fr}.about-visual{max-width:520px}.stats{gap:.5rem}.stats div{display:block}.stats span{display:block;margin-top:.7rem}.skill-row{grid-template-columns:36px 1fr 25px}.skill-row p{grid-column:2;grid-row:2;margin:0}.skill-row b{grid-column:3;grid-row:1/3}.projects-heading{display:block}.projects-heading .section-number{margin-bottom:3rem}.project-grid{grid-template-columns:1fr}.project-ui{height:min(110vw,540px)}footer{align-items:flex-start;gap:1.5rem;flex-wrap:wrap}footer div{order:3;width:100%}}
@media (pointer:coarse){.cursor-glow{display:none}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.intro{display:none}.hero-line,.reveal{opacity:1;transform:none}}

/* Cinematic David Dev opening */
.cinematic-intro{position:fixed;inset:0;z-index:100;display:grid;place-items:center;overflow:hidden;background:#010207;perspective:1200px;isolation:isolate;transition:opacity .8s ease,visibility .8s,transform .9s cubic-bezier(.7,0,.2,1)}
.cinematic-intro.intro--done{opacity:0;visibility:hidden;transform:scale(1.08);pointer-events:none}
.cinema-sky{position:absolute;inset:-20%;background:radial-gradient(ellipse at 50% 48%,rgba(20,87,160,.24),transparent 34%),radial-gradient(ellipse at 50% 100%,rgba(12,76,145,.2),transparent 46%);animation:skyBreathe 4.6s ease-in-out both}
.cinema-beam{position:absolute;top:-25%;width:26%;height:120%;background:linear-gradient(90deg,transparent,rgba(78,169,255,.09),transparent);filter:blur(16px);transform-origin:50% 0;opacity:0;animation:beamReveal 2.8s 1s ease-out forwards}
.beam-left{left:8%;transform:rotate(-24deg)}.beam-right{right:8%;transform:rotate(24deg)}
.studio-scene{position:relative;z-index:2;width:min(94vw,1100px);text-align:center;transform-style:preserve-3d}
.studio-presents,.studio-signature{font:400 clamp(.5rem,1vw,.68rem) Space Mono,monospace;letter-spacing:.42em;color:#7b8ca4;opacity:0}
.studio-presents{margin:0 0 1.5rem;animation:softReveal .8s .35s ease forwards}.studio-signature{margin:2rem 0 0;animation:signatureIn 1s 3.75s ease forwards}
.studio-wordmark{display:flex;align-items:flex-end;justify-content:center;white-space:nowrap;font-size:clamp(3rem,10.8vw,9.5rem);font-weight:800;line-height:.85;letter-spacing:-.075em;color:#eaf4ff;text-shadow:0 4px 0 #536174,0 12px 30px rgba(0,0,0,.8);transform:rotateX(8deg);transform-style:preserve-3d}
.studio-wordmark>span{display:inline-block;opacity:0;transform:translateY(52px) rotateX(-60deg) scale(.84);filter:blur(10px);animation:letterRise .75s cubic-bezier(.16,1,.3,1) forwards}
.studio-wordmark>span:nth-of-type(1){animation-delay:.65s}.studio-wordmark>span:nth-of-type(2){animation-delay:.73s}.studio-wordmark>span:nth-of-type(3){animation-delay:.81s}.studio-wordmark>span:nth-of-type(4){animation-delay:.89s}.studio-wordmark>span:nth-of-type(5){animation-delay:.97s}.studio-wordmark>span:nth-of-type(6){animation-delay:1.05s}.studio-wordmark>span:nth-of-type(7){animation-delay:1.13s}.studio-wordmark>span:nth-of-type(8){animation-delay:1.21s}
.studio-wordmark>b{display:block;width:.28em}.letter-i{position:relative;color:#168bff;text-shadow:0 0 30px rgba(22,139,255,.28),0 4px 0 #0757a1}
.studio-orb{position:absolute;width:.22em;height:.22em;left:50%;top:-.18em;border-radius:50%;background:#d8efff;box-shadow:0 0 10px #fff,0 0 28px #2196ff,0 0 72px #168bff;opacity:0;transform:translate(8em,-4em) scale(.45);animation:orbJourney 1.5s 1.2s cubic-bezier(.45,.05,.2,1) forwards}
.cinema-floor{position:relative;width:min(70vw,700px);height:70px;margin:-.2rem auto 0;border-radius:50%;background:radial-gradient(ellipse,rgba(45,145,239,.2),rgba(7,29,58,.08) 38%,transparent 70%);transform:rotateX(70deg)}
.cinema-floor:before,.cinema-floor:after{content:"";position:absolute;border:1px solid rgba(54,159,255,.2);border-radius:50%;inset:17% 25%;opacity:0;animation:impactRing 1.2s 3.45s ease-out forwards}.cinema-floor:after{animation-delay:3.58s}
.cinema-floor i{position:absolute;left:50%;top:50%;width:1px;height:1px;border-radius:50%;box-shadow:0 0 65px 32px rgba(22,139,255,.24);opacity:0;animation:floorGlow 1.3s 3.3s ease-out forwards}
.skip-intro{position:absolute;right:clamp(1.1rem,3vw,2.5rem);bottom:clamp(1.1rem,3vw,2.2rem);z-index:4;border:0;border-bottom:1px solid rgba(144,169,201,.36);padding:.7rem .1rem;background:none;color:#77879d;font:400 .58rem Space Mono,monospace;letter-spacing:.16em;cursor:pointer;opacity:0;animation:softReveal .7s 1.1s ease forwards;transition:color .2s,border-color .2s}.skip-intro:hover,.skip-intro:focus-visible{color:white;border-color:var(--blue);outline:none}.skip-intro span{color:var(--blue)}
.hero-line{animation:none}.intro-complete .hero-line{animation:heroIn 1.1s .18s cubic-bezier(.16,1,.3,1) forwards}.intro-complete .hero-line:nth-child(2){animation-delay:.31s}
@keyframes letterRise{to{opacity:1;transform:translateY(0) rotateX(0) scale(1);filter:blur(0)}}
@keyframes orbJourney{0%{opacity:0;transform:translate(8em,-4em) scale(.45)}8%{opacity:1}30%{transform:translate(5.3em,-2.2em) scale(.7)}50%{transform:translate(3.1em,-3.4em) scale(.82)}68%{transform:translate(1.45em,-1.65em) scale(.9)}82%{transform:translate(-50%,-2.1em) scale(1)}88%{transform:translate(-50%,-.4em) scale(1.35)}94%{transform:translate(-50%,-.82em) scale(.92)}100%{opacity:1;transform:translate(-50%,-.68em) scale(1)}}
@keyframes impactRing{0%{opacity:.8;transform:scale(.25)}100%{opacity:0;transform:scale(2.5)}}@keyframes floorGlow{0%{opacity:0;transform:scale(.2)}30%{opacity:1}100%{opacity:.3;transform:scale(1.8)}}
@keyframes softReveal{to{opacity:1}}@keyframes signatureIn{0%{opacity:0;letter-spacing:.7em}100%{opacity:1;letter-spacing:.42em}}@keyframes beamReveal{0%{opacity:0}35%{opacity:1}100%{opacity:.35}}@keyframes skyBreathe{0%{opacity:.2;transform:scale(1.08)}65%{opacity:1}100%{opacity:.65;transform:scale(1)}}
@keyframes orbJourneyMobile{0%{opacity:0;transform:translate(4em,-5em) scale(.45)}10%{opacity:1}36%{transform:translate(2.8em,-2.2em) scale(.72)}62%{transform:translate(1.2em,-3em) scale(.85)}83%{transform:translate(-50%,-2em) scale(1)}90%{transform:translate(-50%,-.42em) scale(1.3)}100%{opacity:1;transform:translate(-50%,-.68em) scale(1)}}
@media (max-width:800px){.studio-wordmark{font-size:clamp(2.8rem,15vw,6.5rem);letter-spacing:-.09em}.studio-wordmark>b{width:.18em}.studio-orb{animation-name:orbJourneyMobile}.studio-signature{letter-spacing:.2em!important;font-size:.48rem}}
@media (prefers-reduced-motion:reduce){.cinematic-intro{display:none}.hero-line{opacity:1;transform:none;animation:none!important}}

/* Editorial portrait hero */
.hero{display:block;min-height:100svh;padding:88px var(--pad) 0;background:radial-gradient(circle at 78% 43%,rgba(22,139,255,.13),transparent 31%),linear-gradient(115deg,#03060c 0%,#040912 56%,#020409 100%)}
.hero:before{background:linear-gradient(90deg,rgba(3,6,12,.98) 0%,rgba(3,6,12,.88) 35%,rgba(3,6,12,.08) 72%),linear-gradient(0deg,#03060c 0%,transparent 28%)}
.hero-layout{position:relative;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(340px,.82fr);width:min(1320px,100%);min-height:calc(100svh - 88px);margin:0 auto}
.hero .hero-content{position:relative;z-index:4;width:auto;margin:0;align-self:center;padding:4rem 0 6rem}
.hero .eyebrow{margin-bottom:clamp(2rem,4vw,4rem)}
.hero h1{margin:0;font-size:clamp(3.7rem,7.6vw,8.5rem);line-height:.88;letter-spacing:-.075em;max-width:900px}
.hero h1 .hero-line{white-space:nowrap}.hero h1 em{font-style:normal;color:var(--blue);text-shadow:0 0 42px rgba(22,139,255,.3)}
.hero-promise{display:grid;grid-template-columns:150px 1fr;gap:clamp(1.4rem,4vw,4rem);align-items:start;margin-top:clamp(2.5rem,5vw,4.6rem);padding-top:1.5rem;border-top:1px solid rgba(132,160,195,.18);width:min(570px,78%)}
.hero-promise .mono{margin:.35rem 0 0;font-size:.57rem}.hero-promise>div{position:relative}
.hero-promise span{position:relative;display:block;padding-left:2.8rem;font-size:clamp(1.1rem,1.8vw,1.7rem);font-weight:700;line-height:1.18;letter-spacing:-.035em}.hero-promise span:before{content:"";position:absolute;left:0;top:50%;width:28px;height:1px;background:linear-gradient(90deg,var(--blue),transparent);transform:translateY(-50%)}
.hero-explore{display:inline-flex;align-items:center;gap:1.2rem;margin-top:2.6rem;font:400 .58rem Space Mono,monospace;letter-spacing:.16em;color:#8f9eb3}.hero-explore span{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(95,130,173,.38);border-radius:50%;color:var(--blue)}
.hero-portrait{position:relative;z-index:2;align-self:end;height:calc(100svh - 88px);margin:0;overflow:visible;will-change:opacity,transform;transform-origin:60% 50%}
.hero-portrait:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#03060c 0%,transparent 28%),linear-gradient(0deg,#03060c 0%,transparent 32%);pointer-events:none}
.hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;filter:grayscale(1) contrast(1.14) brightness(.92);mask-image:linear-gradient(to bottom,black 0%,black 72%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,black 0%,black 72%,transparent 100%)}
.portrait-halo{position:absolute;z-index:-1;width:115%;aspect-ratio:1;left:-5%;top:8%;border-radius:50%;background:radial-gradient(circle,rgba(26,142,255,.25),rgba(10,56,108,.08) 42%,transparent 68%);filter:blur(18px)}
.hero-portrait figcaption{position:absolute;right:0;bottom:3.8rem;z-index:3;text-align:right;font:400 .66rem Space Mono,monospace;letter-spacing:.14em;color:#91a1b8}.hero-portrait figcaption span,.hero-portrait figcaption small{display:block}.hero-portrait figcaption small{margin-top:.45rem;color:var(--blue);font-size:.54rem}
.hero-index{position:absolute;left:var(--pad);bottom:2rem;font:400 .55rem Space Mono,monospace;letter-spacing:.16em;color:#526278}
.about-visual.reveal{opacity:0;transform:translateY(90px) scale(.94);clip-path:inset(14% 0 0 0);transition:opacity 1.2s cubic-bezier(.16,1,.3,1),transform 1.2s cubic-bezier(.16,1,.3,1),clip-path 1.2s cubic-bezier(.16,1,.3,1)}
.about-visual.reveal.visible{opacity:1;transform:none;clip-path:inset(0)}
@media (max-width:800px){.hero{padding:72px var(--pad) 0}.hero-layout{display:block;min-height:calc(100svh - 72px)}.hero .hero-content{min-height:calc(100svh - 72px);display:flex;flex-direction:column;justify-content:center;padding:3.5rem 0 7rem}.hero h1{position:relative;z-index:4;font-size:clamp(3.4rem,15vw,6.4rem);line-height:.9}.hero h1 .hero-line{white-space:normal}.hero-promise{position:relative;z-index:4;width:100%;grid-template-columns:105px 1fr;margin-top:2.8rem;gap:1rem}.hero-promise span{padding-left:1.5rem}.hero-promise span:before{width:16px}.hero-explore{position:relative;z-index:4}.hero-portrait{position:absolute;z-index:1;right:-28%;bottom:0;width:105%;height:78%;opacity:.58}.hero-portrait:after{background:linear-gradient(90deg,#03060c 0%,rgba(3,6,12,.56) 44%,transparent 76%),linear-gradient(0deg,#03060c 0%,transparent 36%)}.hero-portrait figcaption{display:none}.hero-index{display:none}}
@media (prefers-reduced-motion:reduce){.about-visual.reveal{opacity:1;transform:none;clip-path:none}}
.about .photo-frame img{filter:saturate(1) contrast(1.06)}


/* Matrix wipe — about portrait */
.photo-frame{isolation:isolate}
.photo-normal{position:relative;z-index:0}
.photo-matrix{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none;clip-path:inset(0 0 100% 0);animation:matrixWipe 5s ease-in-out infinite;will-change:clip-path}
.photo-matrix>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) sepia(1) saturate(7) hue-rotate(72deg) brightness(.7) contrast(1.45)!important}
.photo-matrix:before{content:"";position:absolute;z-index:1;inset:0;background:radial-gradient(circle at 52% 35%,rgba(63,255,128,.24),transparent 37%),linear-gradient(90deg,rgba(0,255,92,.16),rgba(0,25,8,.06));mix-blend-mode:screen}
.matrix-code{position:absolute;z-index:2;inset:-25% 0 0;display:flex;justify-content:space-around;overflow:hidden;color:#6dff91;font:700 clamp(.42rem,1vw,.68rem)/1.45 Space Mono,monospace;letter-spacing:.06em;text-align:center;text-shadow:0 0 4px #00ff62,0 0 10px rgba(0,255,98,.9);mix-blend-mode:screen;opacity:.78}
.matrix-code:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.2) 4px)}
.matrix-code span{display:block;animation:matrixRain 2.4s linear infinite}
.matrix-code span:nth-child(2){animation-delay:-1.7s;opacity:.75}.matrix-code span:nth-child(3){animation-delay:-.45s}.matrix-code span:nth-child(4){animation-delay:-2.1s;opacity:.7}.matrix-code span:nth-child(5){animation-delay:-1.05s}.matrix-code span:nth-child(6){animation-delay:-.2s;opacity:.72}.matrix-code span:nth-child(7){animation-delay:-1.4s}.matrix-code span:nth-child(8){animation-delay:-2.25s;opacity:.8}
.photo-scan{z-index:4}
@keyframes matrixWipe{0%,100%{clip-path:inset(0 0 100% 0)}50%{clip-path:inset(0 0 0 0)}}
@keyframes matrixRain{from{transform:translateY(-18%)}to{transform:translateY(38%)}}
@media (prefers-reduced-motion:reduce){.photo-matrix,.photo-scan{display:none}}


/* Featured projects */
.projects{background:#070808}
.site-showcase-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:3rem;margin-bottom:clamp(3rem,5vw,5rem)}
.site-showcase-heading .section-number{border:0;padding:0;margin-bottom:2.5rem}
.site-showcase-heading h2{font-size:clamp(3.8rem,7.5vw,8.2rem);line-height:.92;letter-spacing:-.075em;margin:0;user-select:none}
.site-showcase-heading>p{justify-self:end;max-width:460px;margin:0 0 .5rem;color:#98a2ad;font-size:clamp(.85rem,1.3vw,1.12rem);line-height:1.5}
.site-carousel{display:flex;gap:1.3rem;overflow-x:auto;scrollbar-width:none;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;padding:2px 2px 1.5rem}
.site-carousel::-webkit-scrollbar{display:none}
.site-tile{flex:0 0 calc((100% - 2.6rem)/3);min-width:0;border:1px solid rgba(255,255,255,.13);background:#0a0a0a;padding:clamp(.8rem,1.1vw,1.1rem);display:flex;flex-direction:column;transition:border-color .3s,transform .3s}
a.site-tile:hover,a.site-tile:focus-visible{border-color:rgba(22,139,255,.7);transform:translateY(-4px)}
a.site-tile:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.site-preview{aspect-ratio:1.6;width:100%;display:grid;place-items:center;overflow:hidden;padding:1rem;text-align:center}
.site-preview strong{display:block;color:#fff;font-weight:800;font-size:clamp(1.9rem,3.8vw,4rem);line-height:1.05;letter-spacing:-.06em}
.site-preview small{display:block;color:#f2f2f2;margin-top:1.3rem;font:400 clamp(.48rem,.8vw,.77rem) Space Mono,monospace;letter-spacing:.16em}
.site-preview--barber{background:radial-gradient(circle at 50% 42%,#674638,#301e19 75%)}
.site-preview--portfolio{background:radial-gradient(circle at 60% 35%,#293750,#171e30 80%)}
.site-preview--portfolio strong span{color:var(--blue)}
.site-preview--future-one{background:radial-gradient(circle at 50% 42%,#7b6e55,#413a2c 85%)}
.site-preview--future-two{background:radial-gradient(circle at 50% 42%,#354453,#17212a 85%)}
.site-tile--future .site-preview strong{font-size:clamp(1.65rem,3vw,3.4rem)}
.site-tile-meta{display:flex;flex-direction:column;flex:1;padding:.95rem .45rem .3rem}
.site-tile-meta h3{font-size:clamp(1.05rem,1.65vw,1.55rem);line-height:1.15;letter-spacing:-.03em;margin:0 0 .35rem}
.site-tile-meta h3 span{color:var(--blue)}
.site-tile-meta p{font-size:.85rem;color:#929eaa;line-height:1.45;margin:0 0 1.1rem}
.site-tags{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:auto}
.site-tags span{border:1px solid rgba(255,255,255,.15);border-radius:100px;color:#aeb7c1;padding:.5rem .7rem;font:400 .68rem Manrope,system-ui,sans-serif;white-space:nowrap}
.site-carousel-control{display:flex;align-items:center;gap:2rem;margin-top:1.3rem}
.site-carousel-control label{white-space:nowrap;font:400 .58rem Space Mono,monospace;letter-spacing:.12em;color:#8c9ab0}
.site-carousel-control label span{color:var(--blue);font-size:1rem}
.site-range{flex:1;min-width:0;height:32px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}
.site-range::-webkit-slider-runnable-track{height:3px;border-radius:10px;background:linear-gradient(90deg,var(--blue) 0 var(--site-progress,0%),#293b54 var(--site-progress,0%) 100%)}
.site-range::-moz-range-track{height:3px;border-radius:10px;background:#293b54}
.site-range::-moz-range-progress{height:3px;border-radius:10px;background:var(--blue)}
.site-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:32px;height:16px;border:1px solid #8dc5ff;border-radius:20px;background:var(--blue);box-shadow:0 0 18px rgba(22,139,255,.5);margin-top:-7px}
.site-range::-moz-range-thumb{width:32px;height:16px;border:1px solid #8dc5ff;border-radius:20px;background:var(--blue);box-shadow:0 0 18px rgba(22,139,255,.5)}
.site-range:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media(max-width:960px){.site-tile{flex-basis:calc((100% - 1.3rem)/2)}.site-preview strong{font-size:clamp(2.4rem,5vw,4rem)}}
@media(max-width:650px){.site-showcase-heading{display:block;margin-bottom:2.5rem}.site-showcase-heading .section-number{margin-bottom:1.4rem}.site-showcase-heading h2{font-size:clamp(3.5rem,13vw,5rem)}.site-showcase-heading>p{max-width:370px;margin:1.5rem 0 0}.site-carousel{gap:.9rem}.site-tile{flex-basis:min(85vw,390px)}.site-preview strong{font-size:clamp(2.4rem,9vw,3.7rem)}.site-carousel-control{display:block}.site-carousel-control label{display:block;margin-bottom:.5rem}.site-range{width:100%}}