/* Progressive motion layer: content remains usable without JavaScript. */
:root{--scene-hue:95;--pointer-x:70%;--pointer-y:20%;--scroll-progress:0;--ease-out:cubic-bezier(.16,1,.3,1)}
body{isolation:isolate;background:#090e10}
.ambient-scene{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 80% 0%,#152128 0%,transparent 65%),#090e10}
.ambient-scene:before{content:"";position:absolute;inset:-20%;background:radial-gradient(ellipse at 20% 25%,hsl(var(--scene-hue) 60% 35% / .18),transparent 40%),radial-gradient(ellipse at 80% 60%,hsl(calc(var(--scene-hue) + 100) 65% 35% / .15),transparent 42%),radial-gradient(ellipse at 50% 95%,hsl(calc(var(--scene-hue) + 210) 65% 40% / .12),transparent 42%);animation:ambient-drift 22s ease-in-out infinite alternate;will-change:transform}
.ambient-scene:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#c7e5de06 1px,transparent 1px),linear-gradient(90deg,#c7e5de06 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(#0009,transparent 75%)}
.pointer-light{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(550px circle at var(--pointer-x) var(--pointer-y),#b5f7d909,transparent 70%)}
.reading-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:30;transform:scaleX(var(--scroll-progress));transform-origin:left;background:linear-gradient(90deg,#d3f59a,#80e4e1,#b39dff);box-shadow:0 0 15px #c2ffad70;pointer-events:none}
.header{position:sticky;top:0;z-index:20;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);background:#0c1310dc;padding-inline:22px;border:1px solid #d3f59a18;border-top:0;border-radius:0 0 20px 20px;box-shadow:0 10px 35px #0002;height:84px}
nav>a:not(.nav-contact){position:relative}nav>a:not(.nav-contact):after{content:"";height:1px;position:absolute;bottom:-6px;left:0;right:0;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease-out)}nav>a:hover:after,nav>a:focus-visible:after{transform:scaleX(1)}
h1 em{background:linear-gradient(100deg,#d3f59a 10%,#92eddd 45%,#c7b5ff 70%,#d3f59a 95%);background-size:230% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:title-spectrum 14s ease-in-out infinite alternate}
.hero-copy{position:relative}.hero-top{padding-top:8px}.hero h1{padding-bottom:.08em}.portrait-card{transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotate(2deg);transition:transform .55s var(--ease-out),box-shadow .55s,border-color .55s;box-shadow:20px 25px 80px #0006;border-color:#b4e7b13d}
.portrait-frame img{filter:saturate(.9);transition:filter .7s,transform 1s var(--ease-out)}.portrait-card:hover .portrait-frame img{filter:saturate(1.05);transform:scale(1.035)}.portrait-card:hover{border-color:#cef3ab90;box-shadow:15px 25px 90px #0008,0 0 45px #d3f59a0d}
.project,.enterprise-project,.skill-grid article,.cert{position:relative;isolation:isolate}
.project{background:linear-gradient(145deg,#1b2522e8,#101717ed);border-color:#8cb89830;transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .55s var(--ease-out),border-color .45s,box-shadow .45s;display:flex;flex-direction:column}
.project:hover{transform:perspective(1000px) translateY(-7px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));border-color:#b3e79280;box-shadow:0 25px 65px #0006,0 0 0 1px #d3f59a0a}
.project:before,.enterprise-project:before,.skill-grid article:before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:radial-gradient(450px circle at var(--light-x,50%) var(--light-y,0%),#c5ffbc13,transparent 65%);opacity:0;transition:opacity .5s}.project:hover:before,.enterprise-project:hover:before,.skill-grid article:hover:before{opacity:1}
.project-visual{position:relative;overflow:hidden;background:linear-gradient(130deg,#294736,#182823);height:205px}.project:nth-child(2) .project-visual{background:linear-gradient(130deg,#303850,#1b202e)}.project:nth-child(3) .project-visual{background:linear-gradient(130deg,#4a3633,#241c23)}
.project-visual:after{content:"";position:absolute;inset:-100% -70%;background:linear-gradient(115deg,transparent 43%,#fff1 50%,transparent 57%);transform:translateX(-50%);transition:transform 1.2s var(--ease-out);pointer-events:none}.project:hover .project-visual:after{transform:translateX(50%)}.project-visual strong{transition:transform .65s var(--ease-out)}.project:hover .project-visual strong{transform:translateX(7px)}
.project-body{display:flex;flex-direction:column;flex:1}.project-body>.tags{margin-top:auto}.project .text-link{padding-top:18px;border-top:1px solid #ffffff14}.text-link span,.nav-contact span,.button span,.contact-button span{display:inline-block;transition:transform .45s var(--ease-out)}.text-link:hover span,.nav-contact:hover span{transform:translate(4px,-4px)}.button:hover span{transform:translate(3px,3px)}
.button,.contact-button{position:relative;overflow:hidden;transition:transform .4s var(--ease-out),box-shadow .4s,background .4s}.button:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#fff8,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease-out)}.button:hover:before{transform:translateX(120%)}.button:hover{box-shadow:0 8px 30px #d3f59a24}.contact-button:hover span{transform:translate(6px,-6px)}
.tags span{transition:transform .3s var(--ease-out),background .3s,border-color .3s,color .3s}.tags span:hover{transform:translateY(-3px);border-color:#b9e29a80;background:#d3f59a12;color:#ecffda}
.skills-section{background:#121e19a8}.skill-grid article{padding:25px 18px 20px;border-radius:0 0 10px 10px;transition:background .4s}.skill-grid article:hover{background:#c5ffbc06}.small-index{transition:color .3s}.skill-grid article:hover .small-index{color:var(--accent)}
.timeline{border-left:1px solid #d3f59a28;padding-left:28px}.timeline article{position:relative}.timeline article:before{content:"";position:absolute;width:7px;height:7px;border:1px solid #c2eaa0;border-radius:50%;background:#142015;left:-33px;top:5px;transition:box-shadow .4s,background .4s}.timeline article:hover:before{background:var(--accent);box-shadow:0 0 0 6px #d3f59a12,0 0 20px #d3f59a60}.timeline h3{transition:color .3s}.timeline article:hover h3{color:var(--accent)}
.cert{transition:padding-left .4s var(--ease-out),background .4s}.cert:hover{padding-left:10px;background:#d3f59a05}.enterprise-project{background:linear-gradient(120deg,#1b2721e8,#111c1ded);border-color:#9ed2aa38}
.contact-section{position:relative;overflow:hidden;background:linear-gradient(115deg,#d3f59a,#b9edac 60%,#97dfc5)}.contact-section:before{content:"";position:absolute;width:500px;height:500px;border:1px solid #17361a14;border-radius:50%;right:-80px;top:-150px;box-shadow:0 0 0 55px #17361a07,0 0 0 110px #17361a04;pointer-events:none}.contact-section>.wrap{position:relative}
.motion-control{position:fixed;right:18px;bottom:18px;z-index:25;border:1px solid #a5c6b640;background:#101b17ed;backdrop-filter:blur(12px);color:#d8e8d4;border-radius:30px;padding:10px 15px;font-size:12px;line-height:1.4;cursor:pointer;box-shadow:0 6px 25px #0004}.motion-control:hover{border-color:var(--accent)}footer{padding-bottom:80px}
@keyframes ambient-drift{0%{transform:translate3d(-2%,-2%,0) scale(1)}100%{transform:translate3d(3%,3%,0) scale(1.08)}}@keyframes title-spectrum{to{background-position:100% 50%}}
.effects-paused .ambient-scene:before,.effects-paused h1 em{animation-play-state:paused}.effects-paused .pointer-light{display:none}.effects-paused .project,.effects-paused .portrait-card{--tilt-x:0deg!important;--tilt-y:0deg!important}.effects-paused *{scroll-behavior:auto!important;transition:none!important}
@media(pointer:coarse){.pointer-light{display:none}.project:hover{transform:none}.portrait-card{transform:rotate(1deg)}}
@media(max-width:700px){.header{position:sticky;height:76px;width:94%;padding-inline:16px;top:0}.header nav{top:75px;border-radius:0 0 14px 14px;background:#101b17fa}.project-visual{height:185px}.motion-control{right:12px;bottom:12px;font-size:12px}.timeline{padding-left:22px}.timeline article:before{left:-27px}.ambient-scene:before{animation-duration:28s}nav>a:not(.nav-contact):after{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.pointer-light{display:none}.project,.project:hover,.portrait-card{transform:none!important}}

.page-hidden .ambient-scene:before,.page-hidden h1 em{animation-play-state:paused}