@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#090a0e;--panel:#10121a;--panel2:#171923;--red:#ff465c;--white:#f5f5f7;--muted:#a0a2b0;--border:#292b37}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}::selection{background:var(--red);color:#fff}.red{color:var(--red)}.scroll-progress{position:fixed;left:0;top:0;width:0;height:3px;background:var(--red);z-index:100}.cursor-glow{width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#ff465c12,transparent 70%);position:fixed;left:0;top:0;z-index:30;pointer-events:none}.site-header{height:78px;display:flex;justify-content:space-between;align-items:center;padding:0 6%;background:#090a0ef5;backdrop-filter:blur(12px);border-bottom:1px solid #282a35;position:sticky;top:0;z-index:40}.wordmark{font:900 29px 'Barlow Condensed',Impact,sans-serif;letter-spacing:-.02em}.wordmark span{color:var(--red)}.site-header nav{display:flex;gap:38px}.site-header nav a,.nav-contact{font-size:11px;font-weight:700;letter-spacing:.11em}.site-header nav a:hover{color:var(--red)}.nav-contact{border:1px solid #51525d;padding:12px 17px}.nav-contact span{color:var(--red);margin-left:12px}.hero{position:relative;min-height:760px;padding:52px 6% 0;overflow:hidden}.hero-watermark{font:900 33vw/.7 'Barlow Condensed',Impact,sans-serif;position:absolute;right:-2%;top:8%;color:#ffffff05;pointer-events:none}.hero-inner{display:grid;grid-template-columns:56% 44%;align-items:center;min-height:615px;position:relative}.hero-copy{position:relative;z-index:3}.eyebrow,.section-index,.micro{font-size:11px;letter-spacing:.17em;font-weight:700}.red-dot{width:8px;height:8px;background:var(--red);display:inline-block;border-radius:50%;margin-right:9px}.hero h1{font:900 clamp(105px,13vw,204px)/.72 'Barlow Condensed',Impact,sans-serif;letter-spacing:-.035em;margin:38px 0 42px}.hero h2{font:900 clamp(37px,4.2vw,65px)/.94 'Barlow Condensed',Impact,sans-serif;margin:0 0 20px}.hero h2 span{color:var(--red)}.hero-description{max-width:460px;color:#b1b3c1;font-size:14px;line-height:1.9}.hero-actions{display:flex;gap:23px;align-items:center;flex-wrap:wrap;margin:29px 0}.button-red{background:var(--red);color:#0b0b10;border:0;display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:17px 20px;font-size:11px;font-weight:900;letter-spacing:.09em;transition:background .2s,transform .2s}.button-red:hover{background:white;transform:translateY(-2px)}.button-red span{font-size:18px}.button-plain{font-size:11px;font-weight:800;letter-spacing:.1em;border-bottom:1px solid #6c6d79;padding-bottom:8px}.button-plain span{color:var(--red)}.hero-socials{display:flex;gap:28px;margin-top:45px}.hero-socials a{display:flex;gap:9px;align-items:center;font-size:10px;letter-spacing:.11em}.hero-socials svg{width:18px;height:18px}.hero-socials a:hover{color:var(--red)}.portrait-stage{height:615px;position:relative;align-self:end;isolation:isolate}.portrait-stage:before{content:'';position:absolute;inset:13% -10% 0 0;background:radial-gradient(ellipse at 55% 55%,#a021394f 0%,#54152520 38%,transparent 67%);z-index:-2}.portrait{position:absolute;bottom:0;right:-3%;height:94%;width:105%;object-fit:contain;object-position:bottom center;filter:drop-shadow(-22px 5px 30px #0009);z-index:2}.portrait-orbit{position:absolute;width:88%;aspect-ratio:1;border:1px solid #d343584d;border-radius:50%;left:8%;top:7%;transform:rotate(-30deg) scaleY(.62);z-index:-1}.orbit-two{transform:rotate(55deg) scaleY(.55);border-color:#ff465c33}.portrait-stamp{position:absolute;top:15%;right:-2%;font-size:9px;letter-spacing:.19em;writing-mode:vertical-rl;color:#f2a4ad}.portrait-bottom{position:absolute;bottom:4%;left:-4%;font-size:10px;letter-spacing:.15em;z-index:3;background:#0d0e13e0;padding:12px 15px}.portrait-bottom span{color:var(--red)}.hero-footer{border-top:1px solid #363641;display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-size:10px;letter-spacing:.13em;color:#c3c3ca}.hero-footer b{color:var(--red)}.marquee{border-top:1px solid #292b36;border-bottom:1px solid #292b36;overflow:hidden;background:#13131b;padding:17px 0}.marquee-track{display:flex;gap:28px;white-space:nowrap;width:max-content;animation:marquee 40s linear infinite;font:800 21px 'Barlow Condensed';letter-spacing:.11em}.marquee b{color:var(--red)}@keyframes marquee{to{transform:translateX(-50%)}}.section{padding:110px 6%}.section-index{color:var(--red);margin:0 0 45px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:55px;gap:30px}.section h2{font:900 clamp(72px,9vw,142px)/.8 'Barlow Condensed',Impact,sans-serif;margin:0;letter-spacing:-.015em}.section h2 em{color:var(--red);font-style:normal}.section-heading>p{max-width:275px;color:var(--muted);font-size:13px;line-height:1.8}.project{border:1px solid var(--border);background:var(--panel)}.project-meta{display:flex;justify-content:space-between;gap:20px;padding:19px 23px;border-bottom:1px solid var(--border);font-size:10px;letter-spacing:.13em;color:#a9aab6}.feature-layout{display:grid;grid-template-columns:43% 57%;min-height:540px}.feature-description{padding:55px 35px;display:flex;flex-direction:column;align-items:start}.feature-description h3{font:900 clamp(90px,9vw,150px)/.75 'Barlow Condensed',Impact,sans-serif;margin:38px 0 28px}.feature-description p{color:#b1b4c1;font-size:13px;line-height:1.85;max-width:410px}.tags{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0 30px}.tags span{font-size:9px;letter-spacing:.09em;border:1px solid #484a56;padding:8px 11px}.feature-description .button-red{margin-top:auto}.feature-browser{display:flex;flex-direction:column;background:#e9e6e3;min-width:0}.browser-toolbar{height:43px;background:#22232d;color:#ddd;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 15px;font-size:9px;letter-spacing:.08em}.traffic{color:var(--red);letter-spacing:4px}.browser-toolbar a{font-size:19px}.feature-browser iframe{width:100%;flex:1;min-height:540px;border:0;background:#fff}.project-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}.compact-project{min-width:0}.terminal{margin:24px 24px 0;height:315px;background:#080d11}.terminal-toolbar{height:43px;display:flex;justify-content:space-between;align-items:center;padding:0 15px;border-bottom:1px solid #32353d;color:#949ba6;font-size:10px;letter-spacing:.12em}.terminal-content{padding:25px}.request{font:14px monospace}.request span{color:var(--red);font-weight:bold}.terminal pre{font:13px/1.8 monospace;color:#e6e6e6;min-height:105px;white-space:pre-wrap}.terminal-button{border:1px solid var(--red);color:var(--red);background:none;padding:10px 14px;font-size:10px;letter-spacing:.1em}.terminal-button:hover{background:var(--red);color:#080d11}.disclaimer{color:#9296a3;font-size:10px}.compact-details{padding:28px 24px 35px}.compact-details h3,.ml-project h3{font:900 clamp(38px,4vw,61px)/.9 'Barlow Condensed',Impact,sans-serif;margin:0 0 18px}.compact-details p,.ml-project p{font-size:13px;line-height:1.8;color:#b3b4bf;max-width:500px}.text-arrow{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--red);display:inline-block;margin-top:15px}.text-arrow:hover{text-decoration:underline}.muted{color:#9a9baa}.lms-visual{margin:24px 24px 0;height:315px;background:radial-gradient(circle at 85% 40%,#87213a,#321420 55%,#16101b);position:relative;overflow:hidden;display:grid;place-items:center}.lms-ui{width:73%;height:250px;border:1px solid #ed9cac70;background:#15101bc9;padding:22px;transform:rotate(-4deg);box-shadow:18px 16px 0 #ff465c25}.lms-ui-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em}.lms-ui-top span{color:var(--red)}.lms-ui-title{font:900 56px/.82 'Barlow Condensed',Impact,sans-serif;margin:25px 0}.lms-ui-title span{color:var(--red)}.lms-ui-chips{display:flex;gap:5px;flex-wrap:wrap}.lms-ui-chips span{font-size:8px;border:1px solid #aa5063;padding:6px}.lms-label{position:absolute;bottom:9px;right:12px;font-size:8px;letter-spacing:.08em;color:#f0bbc5}.ml-project{margin-top:20px;padding:40px;display:grid;grid-template-columns:1fr 300px;align-items:center;min-height:360px;overflow:hidden}.ml-project .project-meta{padding:0 0 20px;margin-bottom:25px}.ml-art{height:260px;position:relative;display:grid;place-items:center}.ml-ring{position:absolute;width:210px;height:210px;border:1px solid #a9364b;border-radius:50%;transform:rotate(-30deg) scaleY(.55)}.ring-b{transform:rotate(50deg) scaleY(.7)}.ml-pulse{font:900 75px 'Barlow Condensed';color:var(--red)}.ml-pulse span{font-size:24px}.about-section{background:#11121c}.about-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:10%}.about-grid>div{padding-top:12px}.about-grid p{color:#b5b6c3;line-height:1.9;font-size:15px}.about-grid .about-lead{color:#fff;font-size:clamp(23px,2.3vw,35px);font-weight:700;line-height:1.4}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#30303b;border:1px solid #30303b}.skill{background:#11131c;min-height:160px;padding:28px;display:flex;flex-direction:column;align-items:flex-start;transition:background .25s}.skill:hover{background:#231a25}.skill-logo{font:900 40px 'Barlow Condensed',sans-serif;color:var(--red);line-height:1}.skill-logo.python{color:#e4d36a}.skill-logo.js{background:#f0d94b;color:#141414;padding:1px 6px}.skill-logo.fastapi{color:#36c5a6}.skill-logo.react{color:#75d7ed}.skill-logo.git{color:#e86454}.skill strong{font-size:13px;letter-spacing:.08em;margin-top:18px}.skill small{font-size:9px;color:#9395a2;letter-spacing:.12em;margin-top:6px}.journey-section{background:#0e0e14}.journey-section h2{margin-bottom:65px}.timeline{border-top:1px solid #353541}.timeline>div{display:grid;grid-template-columns:80px 1fr 1fr;gap:20px;align-items:center;border-bottom:1px solid #353541;padding:25px 0}.timeline b{color:var(--red);font-size:20px}.timeline strong{font:800 34px 'Barlow Condensed'}.timeline span{color:#9fa0ae;font-size:13px}.contact-section{background:#1c111a}.contact-section>p:not(.section-index){color:#bdb5be;margin:35px 0}.contact-email{display:inline-flex;gap:30px;align-items:center;background:var(--red);color:#101014;padding:19px 24px;font-size:clamp(11px,1.6vw,19px);font-weight:900;letter-spacing:.06em}.contact-email span{font-size:25px}.contact-email:hover{background:white}.contact-section footer{margin-top:130px;padding-top:25px;border-top:1px solid #53414e;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:10px;letter-spacing:.1em}.contact-section footer div{display:flex;gap:25px}.contact-section footer a:hover{color:var(--red)}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}@media(max-width:1050px){.hero-inner{grid-template-columns:60% 40%}.hero h1{font-size:clamp(92px,13vw,155px)}.portrait-stage{height:550px}.portrait{height:88%;right:-20%;width:130%}.feature-layout{grid-template-columns:1fr}.feature-description{min-height:410px}.feature-browser iframe{min-height:480px}.section-heading{align-items:start}}@media(max-width:760px){.site-header{padding:0 5%;height:67px}.site-header nav{gap:14px}.site-header nav a{font-size:9px}.nav-contact{display:none}.hero{padding:30px 5% 0;min-height:840px}.hero-inner{display:block;min-height:735px}.hero-copy{padding-top:25px}.hero h1{font-size:clamp(96px,20vw,150px);margin:34px 0}.hero h2{font-size:43px}.hero-description{max-width:360px}.portrait-stage{position:absolute;right:-10%;bottom:0;width:80%;height:470px;opacity:.72}.portrait{height:100%;right:0;width:100%}.hero-socials{margin-top:22px}.hero-footer span:nth-child(2){display:none}.section{padding:75px 5%}.section-heading{display:block}.section-heading>p{margin-top:25px}.project-pair,.about-grid{grid-template-columns:1fr}.ml-project{grid-template-columns:1fr}.ml-art{height:180px}.skills-grid{grid-template-columns:repeat(2,1fr)}.timeline>div{grid-template-columns:45px 1fr}.timeline span{grid-column:2}.contact-section footer{margin-top:90px}}@media(max-width:480px){.hero{min-height:800px}.hero-inner{min-height:700px}.hero h1{font-size:clamp(83px,21vw,115px)}.hero h2{font-size:37px}.hero-description{font-size:12px;max-width:300px}.portrait-stage{width:94%;height:395px;right:-24%;opacity:.62}.hero-actions{gap:15px}.hero-socials{gap:15px}.hero-socials a{font-size:9px}.hero-footer{font-size:9px}.section h2{font-size:clamp(68px,17vw,100px)}.feature-description{padding:35px 25px}.feature-description h3{font-size:105px}.feature-browser iframe{min-height:390px}.compact-details h3{font-size:47px}.lms-ui{width:85%}.skills-grid{grid-template-columns:repeat(2,1fr)}.skill{min-height:145px;padding:20px}.contact-email{font-size:11px;padding:14px}.contact-section footer div{gap:15px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* Reference-preserving self-assembly animation */
.replay-swarm{font:700 10px/1 Arial,sans-serif;letter-spacing:.12em;color:#ff5266;border:1px solid #6c3440;background:transparent;padding:10px 13px;cursor:pointer}.replay-swarm:hover{background:#ff5266;color:#0a0b12}.swarm-intro{position:fixed;inset:0;z-index:9999;background:#090a0e;color:#f7f7f7;overflow:hidden;font-family:Arial,sans-serif;transition:opacity .65s ease,visibility .65s ease}.swarm-intro.done{opacity:0;visibility:hidden;pointer-events:none}.swarm-grid{position:absolute;inset:0;opacity:.17;background-image:linear-gradient(#9b9ba5 1px,transparent 1px),linear-gradient(90deg,#9b9ba5 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,#000,transparent)}.swarm-top,.swarm-bottom{position:absolute;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;z-index:10;font-size:10px;letter-spacing:.19em}.swarm-top{top:5%}.swarm-bottom{bottom:5%;color:#ff5266}.swarm-top button{background:none;color:#fff;border:1px solid #6b6b76;padding:12px 18px;cursor:pointer;font-size:11px;letter-spacing:.1em}.swarm-top button:hover{border-color:#ff5266;color:#ff5266}.swarm-stage{position:absolute;inset:13% 7% 13%;overflow:hidden}.swarm-rectangle{position:absolute;left:5%;top:12%;width:0;height:0;border:1px solid #ff5266;opacity:0;transition:width .8s ease,height .8s ease,opacity .3s ease}.swarm-rectangle.active{width:90%;height:75%;opacity:1}.swarm-label{position:absolute;top:-21px;left:0;font-size:10px;color:#ff5266;white-space:nowrap}.swarm-guide{position:absolute;background:#ff526650;opacity:0;transition:opacity .4s}.swarm-guide.horizontal{top:23%;height:1px;left:0;right:0}.swarm-guide.vertical{left:11%;width:1px;top:0;bottom:0}.swarm-guide.active{opacity:1}.swarm-type{position:absolute;top:30%;left:10%;font:900 clamp(56px,10vw,165px)/.85 Impact,'Arial Narrow',sans-serif;letter-spacing:-.03em;white-space:nowrap;z-index:3;text-shadow:0 5px 25px #090a0e}.swarm-type i{display:inline-block;width:5px;height:.9em;background:#ff5266;animation:swarmBlink .7s step-end infinite;vertical-align:middle}.swarm-sub{position:absolute;top:57%;left:10%;font-size:clamp(10px,1.4vw,17px);letter-spacing:.22em;opacity:0;transition:opacity .4s;z-index:3}.swarm-sub.active{opacity:1}.swarm-portrait{position:absolute;bottom:12%;right:4%;height:0;width:35%;overflow:hidden;transition:height 1s ease;z-index:2}.swarm-portrait.active{height:75%}.swarm-portrait img{height:100%;width:100%;object-fit:contain;object-position:bottom}.swarm-cursor{position:absolute;left:0;top:0;display:flex;align-items:flex-start;gap:2px;z-index:7;transition:transform .9s cubic-bezier(.25,.7,.2,1);will-change:transform;pointer-events:none}.swarm-cursor span{padding:5px 8px;color:#0b0b12;font-size:10px;font-weight:700;letter-spacing:.08em;white-space:nowrap}.sc1{color:#ff5266}.sc1 span{background:#ff5266}.sc2{color:#f3f3f3}.sc2 span{background:#f3f3f3}.sc3{color:#ff9f7c}.sc3 span{background:#ff9f7c}@keyframes swarmBlink{50%{opacity:0}}.lms-gallery{display:flex;flex-direction:column;background:#171827;min-height:320px;position:relative;padding:12px!important}.lms-gallery-top,.lms-gallery-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:10px;letter-spacing:.1em;color:#eee;padding:8px 4px}.lms-gallery>a{display:flex;flex:1;min-height:235px;align-items:center;justify-content:center;background:#222638;overflow:hidden}.lms-gallery img{width:100%;height:280px;object-fit:contain;display:block}.lms-gallery-bottom button{background:transparent;color:#ff5266;border:1px solid #6c3440;padding:8px 10px;font-size:10px;cursor:pointer}.lms-fallback{font-size:12px;color:#ddd}.lms-fallback a{color:#ff5266}@media(max-width:680px){.replay-swarm{font-size:9px;padding:7px}.swarm-stage{inset:18% 3% 14%}.swarm-type{font-size:clamp(53px,14vw,90px);top:27%}.swarm-portrait{right:0;width:65%;bottom:4%}.swarm-sub{top:47%;font-size:10px}.swarm-cursor span{font-size:8px}.swarm-rectangle.active{height:80%}.lms-gallery img{height:220px}}@media(prefers-reduced-motion:reduce){.swarm-intro{display:none!important}.swarm-cursor,.swarm-portrait,.swarm-rectangle{transition:none!important}}

/* Actual-page construction choreography */
html{overflow-x:hidden}body{overflow-x:hidden}.build-hud{position:fixed;left:0;right:0;top:0;z-index:150;pointer-events:none;background:linear-gradient(180deg,#090a0ef0,#090a0e00);padding:18px 5% 32px;transition:opacity .55s}.build-hud-top,.build-hud-bottom{display:flex;justify-content:space-between;align-items:center;font:700 10px 'DM Sans',sans-serif;letter-spacing:.14em}.build-hud-top button{pointer-events:auto;background:#17131a;border:1px solid #ff465c;color:#fff;padding:9px 15px}.build-hud-bottom{color:#ff465c;margin-top:9px}.build-hud-progress{margin-top:12px;height:2px;background:#4b2831}.build-hud-progress>div{height:100%;width:0;background:#ff465c;transition:width .3s}.build-hud.finished{opacity:0;pointer-events:none}.build-cursor{position:fixed;top:0;left:0;display:flex;align-items:flex-start;z-index:155;pointer-events:none;opacity:0;transition:transform .85s cubic-bezier(.22,.7,.2,1),opacity .3s;filter:drop-shadow(0 4px 10px #000a)}.build-cursor span{background:#ff465c;color:#090a0e;font:800 10px Arial,sans-serif;padding:6px 9px;letter-spacing:.1em}.cursor-0{color:#ff465c}.cursor-1{color:#fff}.cursor-1 span{background:#fff}.cursor-2{color:#ffb09a}.cursor-2 span{background:#ffb09a}.build-cursor.active{opacity:1}.build-frame{position:absolute;inset:20px 5% 20px;border:1px solid #ff465c50;transform:scaleX(0);transform-origin:left;opacity:0;z-index:5;pointer-events:none}.build-frame.active{animation:drawFrame 1.3s ease forwards}.build-frame.finished{opacity:0;transition:opacity .6s}.build-part{transition:opacity .85s ease,transform .85s cubic-bezier(.2,.8,.2,1),clip-path 1.15s ease}.building .build-part:not(.built){opacity:0!important;transform:translateY(28px)!important;clip-path:inset(0 100% 0 0)}.building .build-part.built{opacity:1;transform:none;clip-path:inset(0 0 0 0)}.building .assemble-portrait:not(.built){transform:translateX(90px) scale(.9)!important;clip-path:inset(0 100% 0 0)}.building .assemble-portrait.built{transform:none}.building .assemble-name.built{animation:scanName 1.1s ease both}.assemble-portrait .portrait-orbit{animation:orbitFloat 11s linear infinite alternate}.portrait{animation:portraitFloat 5s ease-in-out infinite}.button-red{position:relative;overflow:hidden}.button-red:after{content:'';position:absolute;inset:0;background:#ffffff35;transform:translateX(-120%) skewX(-20deg);transition:transform .5s}.button-red:hover:after{transform:translateX(130%) skewX(-20deg)}.project{transition:border-color .25s,transform .35s,box-shadow .35s}.project:hover{border-color:#ff465c7d;box-shadow:0 20px 60px #0005}.menu-toggle{display:none;background:none;border:1px solid #4d4d58;color:white;padding:10px 12px;font-size:11px;font-weight:800;letter-spacing:.1em}@keyframes drawFrame{0%{opacity:0;transform:scaleX(0)}15%{opacity:1}100%{opacity:1;transform:scaleX(1)}}@keyframes scanName{from{filter:blur(7px)}to{filter:blur(0)}}@keyframes orbitFloat{to{rotate:8deg}}@keyframes portraitFloat{50%{transform:translateY(-12px)}}
@media(max-width:760px){.site-header{gap:10px}.menu-toggle{display:block;margin-left:auto}.site-header nav{display:none;position:absolute;top:100%;left:0;right:0;padding:25px 6%;background:#0d0e14;border-bottom:1px solid #ff465c;flex-direction:column;gap:22px}.site-header nav.open{display:flex}.site-header nav a{font-size:14px}.replay-swarm{white-space:nowrap}.hero{min-height:910px}.hero-inner{min-height:815px}.hero-copy{z-index:4}.hero h1{font-size:clamp(76px,17vw,125px)}.hero-description{max-width:90%;font-size:13px}.portrait-stage{right:-10%;width:90%;bottom:0;height:410px;opacity:.8}.hero-footer{position:relative;z-index:4}.feature-layout,.project-pair{grid-template-columns:1fr}.feature-browser iframe{min-height:450px}.build-hud{padding-top:12px}.build-frame{inset:18px 3%}.build-cursor span{font-size:8px}}
@media(max-width:380px){.site-header{padding:0 3%}.wordmark{font-size:24px}.replay-swarm{padding:8px;font-size:8px}.hero h1{font-size:72px}.hero h2{font-size:33px}.portrait-stage{opacity:.55}.contact-email{max-width:100%;overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.build-hud,.build-cursor,.build-frame{display:none!important}.portrait,.assemble-portrait .portrait-orbit{animation:none!important}.building .build-part{opacity:1!important;transform:none!important;clip-path:none!important}}

/* CINEMATIC V3: persistent branded motion and real DOM assembly */
.footer-social-icons{display:flex;gap:clamp(10px,2vw,28px);align-items:center;flex-wrap:wrap}.footer-social-icons a{display:inline-flex;align-items:center;gap:12px;border:1px solid #49434a;padding:15px 18px;color:#f5f5f7;transition:background .25s,border-color .25s,transform .25s}.footer-social-icons a:hover{background:#ff465c;color:#090a0e;border-color:#ff465c;transform:translateY(-5px)}.footer-social-icons svg{width:34px;height:34px;flex:none}.footer-social-icons span{font:800 12px 'DM Sans',sans-serif;letter-spacing:.1em}.contact-section footer{align-items:center;gap:22px;flex-wrap:wrap}.contact-section footer>a{white-space:nowrap}
.construction-wires{position:fixed;inset:0;width:100%;height:100%;z-index:145;pointer-events:none;opacity:0;transition:opacity .25s;overflow:visible}.building .construction-wires{opacity:1}.construction-wires path{fill:none;stroke:#ff465c;stroke-width:1.5;stroke-dasharray:6 9;filter:drop-shadow(0 0 7px #ff465c);opacity:.9}.construction-wires circle{fill:#fff;stroke:#ff465c;stroke-width:3;filter:drop-shadow(0 0 12px #ff465c)}.construction-toast{position:fixed;right:5%;bottom:7%;z-index:149;display:flex;flex-direction:column;gap:5px;border-left:3px solid #ff465c;padding:10px 17px;background:#141016e8;opacity:0;transform:translateY(12px);transition:opacity .25s,transform .25s;pointer-events:none}.construction-toast.show{opacity:1;transform:none}.construction-toast b{font-size:11px;letter-spacing:.12em}.construction-toast span{color:#ff8493;font-size:10px;letter-spacing:.1em}
.building .hero-watermark{animation:watermarkPulse 2.6s ease-in-out infinite}.building .hero{background-image:linear-gradient(#ff465c0a 1px,transparent 1px),linear-gradient(90deg,#ff465c0a 1px,transparent 1px);background-size:55px 55px;animation:gridScroll 2.5s linear infinite}.build-cursor{transition:none!important}.build-cursor svg{filter:drop-shadow(0 0 8px currentColor)}.build-cursor:after{content:'';position:absolute;left:1px;top:2px;width:12px;height:12px;border:1px solid currentColor;border-radius:50%;animation:cursorRipple 1s ease-out infinite}.building .assemble-name.built{animation:scanName .9s ease both}.hero h1{position:relative}.hero h1:after{content:'';position:absolute;bottom:-13px;left:0;width:0;height:3px;background:#ff465c;box-shadow:0 0 20px #ff465c}.building .assemble-name.built:after{animation:underlineBuild 1.2s ease forwards}.hero-socials a,.footer-social-icons a{transition:color .2s,transform .25s}.hero-socials a:hover{transform:translateY(-4px)}.project.reveal{transition:opacity .85s,transform .85s,border-color .3s,box-shadow .3s}.portrait-stage{transform-style:preserve-3d}.portrait-orbit{pointer-events:none}.build-hud{background:linear-gradient(180deg,#090a0efc,#090a0e99 70%,transparent)}
@keyframes cursorRipple{0%{transform:scale(.4);opacity:1}100%{transform:scale(2.5);opacity:0}}@keyframes underlineBuild{to{width:83%}}@keyframes gridScroll{to{background-position:55px 55px}}@keyframes watermarkPulse{50%{opacity:.4}}@media(max-width:760px){.footer-social-icons{width:100%;justify-content:flex-start}.footer-social-icons a{padding:12px}.footer-social-icons svg{width:27px;height:27px}.footer-social-icons span{font-size:10px}.construction-toast{bottom:4%;right:3%}}@media(max-width:430px){.footer-social-icons{gap:7px}.footer-social-icons a{gap:7px;padding:10px 8px}.footer-social-icons svg{width:25px;height:25px}.footer-social-icons span{font-size:9px}.build-cursor span{font-size:7px;padding:4px}.construction-toast{display:none}}@media(prefers-reduced-motion:reduce){.construction-wires,.construction-toast{display:none!important}.building .hero{animation:none!important}}

.build-spark{position:fixed;width:9px;height:9px;background:#ff465c;border:2px solid white;border-radius:50%;z-index:151;pointer-events:none;animation:sparkPop .55s ease-out forwards;box-shadow:0 0 15px #ff465c}@keyframes sparkPop{0%{opacity:1;transform:scale(.2)}55%{opacity:1;transform:scale(2)}100%{opacity:0;transform:scale(4)}}

/* DIRECTOR'S CUT: designed motion without invisible content */
#buildHUD,.build-hud,.build-cursor,#constructionWires,#constructionToast,.build-frame{display:none!important}
.build-part,.build-part.built{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;visibility:visible!important}
#directorCanvas{position:fixed;inset:0;z-index:52;pointer-events:none;width:100%;height:100%}
#directorPointer{position:fixed;left:0;top:0;display:flex;align-items:center;gap:7px;z-index:65;pointer-events:none;transform:translate3d(-200px,-200px,0);filter:drop-shadow(0 0 12px rgba(255,60,70,.65))}
#directorPointer svg{width:22px;height:28px}
#directorPointer span{font:700 9px/1 monospace;letter-spacing:.1em;background:#ef4052;color:white;padding:8px 10px;white-space:nowrap}
.director-rail{position:fixed;left:18px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:13px;z-index:51;pointer-events:none;color:#ff5360;font:700 9px/1.2 monospace;letter-spacing:.12em}
.director-rail>span:first-child{writing-mode:vertical-rl;transform:rotate(180deg)}
.director-rail-line{height:105px;width:2px;background:#ffffff25;position:relative;overflow:hidden}
.director-rail-line i{position:absolute;top:0;left:0;width:100%;height:0;background:#ff465c;box-shadow:0 0 10px #ff465c}
.director-loader{position:fixed;inset:0;background:#09090d;color:white;z-index:500;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,4vw,60px);transition:opacity .9s ease,visibility .9s ease;overflow:hidden}
.director-loader:before{content:'';position:absolute;inset:0;background:linear-gradient(#ff40500a 1px,transparent 1px),linear-gradient(90deg,#ff40500a 1px,transparent 1px);background-size:65px 65px;pointer-events:none}
.director-loader.is-done{opacity:0;visibility:hidden;pointer-events:none}
.loader-top,.loader-bottom{display:flex;justify-content:space-between;gap:20px;font:700 11px monospace;letter-spacing:.16em;position:relative;z-index:2}
.loader-top span,.loader-bottom span{color:#ff465c}
.loader-core{margin:auto;text-align:center;position:relative;z-index:2;width:min(500px,85vw)}
.loader-mark{font:900 clamp(140px,26vw,360px)/.9 Impact,'Arial Narrow',sans-serif;letter-spacing:-.07em;animation:loaderBreath 1.3s ease-in-out infinite alternate}
.loader-mark span{color:#ff465c}
.loader-core p{font:700 12px monospace;letter-spacing:.22em;margin:24px 0 15px;color:#ccc}
.loader-line{height:2px;background:#ffffff24;width:100%}.loader-line i{display:block;height:100%;width:0;background:#ff465c;box-shadow:0 0 20px #ff465c}
.loader-core strong{display:block;text-align:right;margin-top:12px;font:900 20px monospace;color:#ff465c}
@keyframes loaderBreath{to{transform:scale(1.05);filter:drop-shadow(0 0 45px #ff40504d)}}
.hero-inner{perspective:1000px}
.hero h1,.hero h2{transform-origin:bottom left}
.hero h1 .director-letter,.hero h2 .director-letter{display:inline-block;will-change:transform,opacity;white-space:pre}
.portrait-stage{transform-style:preserve-3d;will-change:transform}
.portrait-stage:after{content:'';position:absolute;inset:10% 8%;border:1px solid #ff40502d;border-radius:50%;transform:rotate(-12deg);pointer-events:none;animation:directorOrbit 12s linear infinite}
@keyframes directorOrbit{to{transform:rotate(348deg)}}
.director-stroke{position:absolute;inset:0;pointer-events:none;border:1px solid #ff465c66;z-index:4;opacity:0;transition:opacity .45s}
.director-stroke:before,.director-stroke:after{content:'';position:absolute;width:18px;height:18px;border-color:#ff465c;border-style:solid}
.director-stroke:before{top:-2px;left:-2px;border-width:2px 0 0 2px}.director-stroke:after{bottom:-2px;right:-2px;border-width:0 2px 2px 0}
.director-active>.director-stroke{opacity:1}
.project{transition:box-shadow .7s ease;transform-style:preserve-3d}
.project.director-active{box-shadow:0 0 55px #f43f5310}
.project .director-reveal{opacity:1;transform:none;filter:none}
.project .director-reveal.director-pending{opacity:.45;transform:translateY(45px);filter:blur(3px)}
.project .director-reveal{transition:transform 1.15s cubic-bezier(.16,1,.3,1),opacity 1.1s,filter 1.1s}
.project.director-active .director-reveal{opacity:1;transform:none;filter:none}
.director-scan{position:absolute;left:0;top:0;width:100%;height:2px;z-index:5;pointer-events:none;background:linear-gradient(90deg,transparent,#ff465c,transparent);opacity:0;box-shadow:0 0 18px #ff465c}
.director-active .director-scan{animation:directorScan 1.8s ease-out forwards}
@keyframes directorScan{0%{opacity:1;top:0}85%{opacity:.65}100%{opacity:0;top:100%}}
.section-heading h2,.about-grid h2,.journey-section h2,.contact-section h2{transition:transform .3s ease;will-change:transform}
@media(max-width:700px){.director-rail{left:6px;gap:7px;font-size:7px}.director-rail-line{height:55px}.loader-top,.loader-bottom{font-size:8px}#directorPointer span{font-size:7px;padding:5px}.director-loader{padding:20px}.loader-mark{font-size:160px}}
@media(prefers-reduced-motion:reduce){.director-loader{display:none!important}#directorCanvas,#directorPointer{display:none!important}.director-reveal,.director-reveal.director-pending{opacity:1!important;transform:none!important;filter:none!important}.portrait-stage:after{animation:none}}

/* GSAP + Three.js edition: real scroll-linked sequences, readable without JS */
#threeStage{position:absolute;right:0;top:0;width:55%;height:100%;z-index:0;pointer-events:none;opacity:.55;overflow:hidden}
#threeStage canvas{width:100%!important;height:100%!important;display:block}
.hero{isolation:isolate}.hero-inner,.hero-footer,.hero-watermark{position:relative;z-index:2}
.hero .portrait-stage{z-index:3}
#directorPointer{display:flex!important;opacity:0;will-change:transform}
.director-loader{display:none!important}
.gsap-line{position:absolute;pointer-events:none;height:2px;left:0;top:0;width:100%;background:linear-gradient(90deg,transparent,#ff465c,transparent);z-index:5;transform-origin:left;transform:scaleX(0)}
.project,.section{isolation:isolate}
.gsap-grid{position:absolute;inset:0;pointer-events:none;opacity:0;background-image:linear-gradient(rgba(255,70,92,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,70,92,.045) 1px,transparent 1px);background-size:48px 48px;z-index:0}
.gsap-grid~*:not(.gsap-line){position:relative;z-index:1}
.gsap-scrub{will-change:transform}
.gsap-ready .hero-copy h1{transform-origin:left center}
.gsap-ready .portrait-stage{transform-origin:center bottom}
@media(max-width:800px){#threeStage{width:100%;opacity:.18}#directorPointer{display:none!important}}
@media(prefers-reduced-motion:reduce){#threeStage{display:none!important}#directorPointer{display:none!important}}

/* Disable legacy unfinished build system, allow GSAP to own visibility. */
.real-motion-edition .build-hud,.real-motion-edition .build-cursor,.real-motion-edition .construction-wires,.real-motion-edition .construction-toast{display:none!important}
.real-motion-edition .build-part:not(.built){opacity:1;transform:none;clip-path:none}
.real-motion-edition .build-part{transition:none}
.real-motion-edition #directorPointer{display:flex!important}

/* Studio v7: content-first, no full-screen outlines or empty build frames */
.build-frame,.director-stroke,.assembly-sketch{display:none!important}
.hero{min-height:calc(100svh - 10px);isolation:isolate}
.hero-inner{position:relative;z-index:3}
.hero h1{letter-spacing:-.075em;line-height:.86}
.hero h2{letter-spacing:-.055em}
.ambient-corner{position:fixed;right:22px;bottom:18px;z-index:130;display:flex;flex-direction:column;gap:4px;pointer-events:none;text-align:right;font:700 9px/1.5 monospace;letter-spacing:.15em;color:#ff5265;mix-blend-mode:screen}
.ambient-corner span:last-child{color:#eee}
.tech-filter{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 22px}
.tech-filter button{background:#17171f;color:#eee;border:1px solid #ffffff28;padding:12px 15px;font:800 10px monospace;letter-spacing:.08em;cursor:pointer;transition:background .2s,transform .2s}
.tech-filter button:hover{transform:translateY(-3px);border-color:#ff475c}
.tech-filter button.tech-filter-active{background:#ff475c;border-color:#ff475c;color:#fff}
.skills-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:12px!important}
.tech-tile{min-height:174px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px!important;overflow:hidden;position:relative;transition:transform .3s,background .3s,border-color .3s!important}
.tech-tile:hover{transform:translateY(-7px)!important;background:#25141d!important;border-color:#ff475c!important}
.tech-icon{height:62px;width:62px;display:grid;place-items:center}
.tech-icon img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 5px 8px #0007)}
.tech-fallback{width:56px;height:56px;background:#ff475c;place-items:center;font:900 20px monospace;color:#fff}
.tech-tile strong{font-size:13px!important}.tech-tile small{font-size:9px!important;color:#aaa}
.tech-tile[hidden]{display:none!important}
.tech-note{color:#999;font:12px/1.5 monospace;margin:20px 0 0}
.project{transform-style:preserve-3d}
.project .gsap-grid,.section .gsap-grid{opacity:.15}
.studio-corner{position:absolute;pointer-events:none;width:17px;height:17px;border:2px solid #ff475c;z-index:4}
.studio-corner.tl{top:12px;left:12px;border-right:0;border-bottom:0}
.studio-corner.br{bottom:12px;right:12px;border-left:0;border-top:0}
.project:hover .studio-corner{filter:drop-shadow(0 0 8px #ff475c)}
.studio-reveal{clip-path:inset(0 100% 0 0);animation:studioReveal 1.4s cubic-bezier(.15,.9,.25,1) forwards}
@keyframes studioReveal{to{clip-path:inset(0 0 0 0)}}
@media(max-width:700px){.ambient-corner{right:9px;bottom:8px;font-size:7px}.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.tech-tile{min-height:148px!important}.tech-icon img{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){.studio-reveal{clip-path:none;animation:none}}


/* MOBILE-FIRST REPAIR: overrides desktop layout and intrusive motion */
html,body{max-width:100%;overflow-x:clip}
img,video,iframe,canvas,svg{max-width:100%}
.project,.feature-layout,.feature-description,.feature-browser,.compact-project,.section,.about-grid>div{min-width:0}
@media(max-width:900px){
 .feature-layout{grid-template-columns:minmax(0,1fr)!important;min-height:0!important}
 .feature-browser{min-height:300px}
 .feature-browser iframe{flex:auto;min-height:320px;height:390px}
 .feature-description h3{font-size:clamp(64px,15vw,112px);overflow-wrap:anywhere}
 .project-pair,.about-grid{grid-template-columns:minmax(0,1fr)!important}
 .ml-project{grid-template-columns:minmax(0,1fr)!important}
 .section-heading{flex-direction:column;align-items:start}
 .site-header nav{gap:12px}
 .portrait-stage{pointer-events:none}
}
@media(max-width:600px){
 .site-header{height:62px;padding:0 5%;gap:10px}
 .wordmark{font-size:23px;white-space:nowrap}
 .site-header nav{gap:10px;justify-content:flex-end;flex-wrap:wrap}
 .site-header nav a{font-size:9px;letter-spacing:0;white-space:nowrap}
 .nav-contact,.replay-swarm{display:none!important}
 .hero{min-height:0!important;padding:32px 6% 0!important}
 .hero-inner{display:flex!important;flex-direction:column!important;min-height:0!important;align-items:stretch!important}
 .hero-copy{padding:8px 0 0!important;z-index:4}
 .hero h1{font-size:clamp(72px,20vw,118px)!important;line-height:.8!important;margin:25px 0 26px!important;overflow-wrap:anywhere}
 .hero h2{font-size:clamp(30px,9vw,46px)!important;line-height:1!important}
 .hero-description{font-size:13px!important;max-width:100%!important}
 .hero-actions{margin:22px 0!important;gap:14px}
 .hero-socials{margin:20px 0 0!important;gap:15px;flex-wrap:wrap}
 .portrait-stage{position:relative!important;right:auto!important;bottom:auto!important;align-self:center!important;width:min(100%,400px)!important;height:340px!important;opacity:1!important;margin-top:-5px}
 .portrait{height:100%!important;right:0!important;width:100%!important;object-fit:contain!important}
 .hero-footer{flex-wrap:wrap;gap:8px;font-size:9px}
 .hero-watermark{font-size:50vw}
 .section{padding:65px 6%!important}
 .section h2{font-size:clamp(55px,15vw,92px)!important;overflow-wrap:anywhere}
 .section-heading{margin-bottom:30px!important}
 .feature-layout{display:flex!important;flex-direction:column!important}
 .feature-description{padding:28px 20px!important}
 .feature-description h3{font-size:clamp(66px,18vw,105px)!important;margin:20px 0!important}
 .feature-browser iframe{height:300px!important;min-height:300px!important}
 .project-meta{padding:13px!important;gap:10px;flex-wrap:wrap;font-size:9px}
 .project-pair{display:grid!important;grid-template-columns:minmax(0,1fr)!important}
 .terminal,.lms-visual{margin:12px 12px 0;height:240px}
 .terminal-content{padding:15px}
 .terminal pre{font-size:11px}
 .lms-ui{width:84%;height:200px;padding:16px}
 .lms-ui-title{font-size:44px}
 .ml-project{padding:24px!important}
 .about-grid{gap:20px}
 .skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .tech-tile{padding:15px 7px!important;min-height:138px!important}
 .tech-filter{gap:6px}
 .tech-filter button{padding:9px 10px;font-size:10px}
 .timeline>div{grid-template-columns:40px minmax(0,1fr);gap:8px}
 .timeline span{overflow-wrap:anywhere}
 .contact-email{font-size:clamp(10px,3vw,15px)!important;overflow-wrap:anywhere}
 .contact-section footer{flex-wrap:wrap;gap:22px}
 .footer-social-icons{flex-wrap:wrap}
 .cursor-glow,.director-rail,.ambient-corner,.construction-toast,.construction-wires{display:none!important}
 #threeStage{opacity:.18!important;pointer-events:none}
}
@media(max-width:360px){
 .site-header nav a{font-size:8px}
 .hero h1{font-size:68px!important}
 .button-red{padding:13px;gap:12px}
 .hero-socials a{font-size:9px}
 .section h2{font-size:53px!important}
}

/* v9: Poppins across the whole website, with generous, readable typography. */
html,body,body *,body *::before,body *::after{font-family:'Poppins',sans-serif!important}
body{font-weight:400;line-height:1.65}
.hero h1{font-size:clamp(60px,8.8vw,148px)!important;line-height:1.14!important;letter-spacing:-.055em!important;font-weight:900!important;margin:42px 0 55px!important;max-width:100%;overflow-wrap:normal!important}
.hero h1 .director-letter{vertical-align:baseline}
.hero h2{font-size:clamp(27px,3.2vw,51px)!important;line-height:1.28!important;letter-spacing:-.045em!important;font-weight:800!important;margin:0 0 24px!important}
.hero-copy{min-width:0}
.hero-description{line-height:1.9!important}
.section h2{font-size:clamp(47px,7vw,100px)!important;line-height:1.15!important;letter-spacing:-.05em!important;font-weight:800!important}
.feature-description h3{font-size:clamp(46px,6vw,88px)!important;line-height:1.18!important;letter-spacing:-.05em!important}
.compact-details h3,.ml-project h3{font-size:clamp(30px,3.2vw,51px)!important;line-height:1.22!important}
.wordmark{font-weight:900!important;letter-spacing:-.04em!important}
.swarm-type{font-size:clamp(43px,8vw,120px)!important;line-height:1.15!important;letter-spacing:-.06em!important}
@media(max-width:1050px){.hero h1{font-size:clamp(54px,8.7vw,98px)!important}}
@media(max-width:760px){
 .hero h1{font-size:clamp(47px,11.5vw,84px)!important;line-height:1.2!important;letter-spacing:-.06em!important;margin:32px 0 42px!important}
 .hero h2{font-size:clamp(24px,6.2vw,39px)!important;line-height:1.34!important}
 .hero-copy{width:100%}
 .section h2{font-size:clamp(41px,10vw,70px)!important;line-height:1.2!important}
 .feature-description h3{font-size:clamp(42px,11vw,76px)!important}
}
@media(max-width:400px){
 .hero h1{font-size:clamp(43px,11.2vw,57px)!important;line-height:1.23!important;margin:30px 0 38px!important}
 .hero h2{font-size:clamp(22px,6vw,30px)!important}
}

/* v10: restore the oversized CREATE background word */
.hero .hero-watermark {
  color: #353540 !important;
  opacity: .72 !important;
  visibility: visible !important;
  position: absolute !important;
  top: 7% !important;
  right: -2% !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
.hero .hero-inner, .hero .hero-footer { position: relative; z-index: 3; }
@media (max-width: 760px) {
  .hero .hero-watermark { top: 5% !important; font-size: 48vw !important; opacity: .42 !important; }
}