body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#000;color:#e4fd75;font-family:JetBrains Mono,SF Mono,Monaco,Cascadia Code,monospace}code{background-color:#1f1f1f;border-radius:4px;font-family:JetBrains Mono,SF Mono,Monaco,Consolas,monospace;padding:2px 6px}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}*{box-sizing:border-box}body{background:linear-gradient(135deg,#0f0f23,#1a1a2e 50%,#16213e);color:#f8fafc;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;margin:0;padding:0}.portfolio{height:100vh;overflow-y:scroll;scroll-behavior:smooth;scroll-snap-type:y mandatory}.portfolio>*{scroll-snap-align:center}nav{padding:2rem;position:fixed;right:5%;top:0;z-index:100}nav ul{display:flex;gap:2rem;list-style:none;margin:0;padding:0}nav ul li{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f7fafc0d;border:2px solid #f7fafc33;border-radius:25px;cursor:pointer;font-weight:500;letter-spacing:.5px;padding:.75rem 1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1)}nav ul li:hover{background:#e4fd751a;border-color:#e4fd75;box-shadow:0 8px 25px #e4fd7533;color:#e4fd75;transform:translateY(-2px)}.header{height:800px}.header-content{flex:1 1}.header section{display:flex;margin:150px}.khoa{flex-shrink:0;height:auto;padding-top:100px;width:400px}.header-text{animation:fadeInUp 1s ease-out;color:#f8fafc;font-size:100px;font-weight:700;line-height:1.1;margin-bottom:1rem;text-shadow:0 0 20px #9acd3299,0 0 40px #9acd3266,0 0 60px #9acd3233}.subtitle{animation:fadeInUp 1s ease-out .2s both;color:#e4fd75;font-size:70px;margin-bottom:0;min-height:3rem}.header p{animation:fadeInUp 1s ease-out .4s both;color:#f8fafccc;font-size:30px;line-height:1.8;margin-bottom:3rem;max-width:65%}.button-group{display:flex;flex-wrap:wrap;gap:1.5rem}.btn{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#e4fd751a;border:2px solid #e4fd754d;border-radius:50px;color:#f8fafc;cursor:pointer;display:inline-block;font-size:40px;font-weight:600;overflow:hidden;padding:1rem 2.5rem;position:relative;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1)}.btn:before{background:linear-gradient(90deg,#0000,#e4fd7533,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.btn:hover:before{left:100%}.btn:hover{background:#e4fd7533;border-color:#e4fd75;box-shadow:0 12px 30px #e4fd754d;color:#e4fd75;transform:translateY(-3px)}.section-part{margin-bottom:150px;margin-left:150px;position:relative}.section-part header{align-items:center;display:flex;gap:1rem;margin-bottom:3rem}.section-header{color:#e4fd75;cursor:pointer;font-size:clamp(2.5rem,5vw,3.5rem);font-weight:700;letter-spacing:2px;transition:all .3s ease}.section-header:hover{text-shadow:0 0 20px #e4fd7599}.text-secondary{color:#e4fd75;font-size:clamp(2rem,4vw,3rem);font-weight:300}.section-part p{color:#f8fafce6;font-size:30px;line-height:1.8;max-width:70%}.skills-section p i{color:#bfcc83;font-weight:500;text-shadow:0 0 5px #e4fd7580,0 0 10px #e4fd754d}#About>div{grid-gap:3rem;align-items:center;display:grid;gap:3rem;grid-template-columns:2fr 1fr;margin:2rem 0}.profile-image{animation:fadeInUp 1s ease-out .6s both;border:4px solid #e4fd754d;border-radius:50%;box-shadow:0 20px 40px #0000004d;max-width:280px;transition:all .3s ease;width:100%}.profile-image:hover{border-color:#e4fd75;box-shadow:0 25px 50px #e4fd7533;transform:scale(1.05)}.floating-skills{background:radial-gradient(ellipse 60% 80% at center,#e4fd750d 20%,#0000 70%);border-radius:20px;height:400px;margin-top:3rem;position:relative}.floating-icon{animation:float 6s ease-in-out infinite;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:2px solid #ffffff1a;border-radius:15px;cursor:pointer;height:70px;padding:8px;position:absolute;transition:all .3s cubic-bezier(.4,0,.2,1);width:70px}.floating-icon:hover{border-color:#e4fd75;box-shadow:0 15px 35px #e4fd7566;transform:scale(1.1);z-index:10}.floating-icon:first-child{animation-delay:0s;left:15%;top:10%}.floating-icon:nth-child(2){animation-delay:1s;left:45%;top:45%}.floating-icon:nth-child(3){animation-delay:2s;left:20%;top:75%}.floating-icon:nth-child(4){animation-delay:3s;left:65%;top:20%}.floating-icon:nth-child(5){animation-delay:4s;left:75%;top:65%}.floating-icon:nth-child(6){animation-delay:5s;left:80%;top:10%}.floating-icon:nth-child(7){animation-delay:2.5s;left:5%;top:40%}.quote{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:6rem auto;max-width:900px;padding:6rem 2rem;position:relative;text-align:center}.quote:before{background:radial-gradient(circle at center,#e4fd750d 0,#0000 70%);border-radius:30px;bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:-1}.quote h3{color:#f8fafc;cursor:pointer;font-size:clamp(2rem,5vw,3.5rem);font-weight:700;letter-spacing:2px;margin-bottom:2rem;transition:all .3s ease}.quote h3:hover{text-shadow:0 0 10px #e4fd75cc,0 0 20px #e4fd7599,0 0 30px #e4fd7566;transform:scale(1.02)}.quote p{animation:fadeInUp 1s ease-out .6s both;color:#f8fafcb3;font-size:clamp(1.2rem,2.5vw,1.8rem);font-style:italic}.project-list{display:flex;flex-direction:column}.project-list p{font-size:40px}.project-items{align-items:center;display:flex;gap:2rem;justify-content:center;padding:3rem 0}.project-info{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#e4fd750d;border:1px solid #e4fd7533;border-radius:25px;box-shadow:0 25px 50px #0003;overflow:hidden;padding:3rem 2.5rem;width:700px}.project-item{border:2px solid #e4fd7533;border-radius:15px;box-shadow:0 15px 35px #0000004d;height:auto;margin-bottom:2rem;transition:all .3s ease;width:100%}.project-item:hover{box-shadow:0 25px 50px #0006;transform:translateY(-5px)}.project-details{color:#f8fafc;text-align:center}.project-details h4{color:#e4fd75;font-size:40px;font-weight:700;margin:0 0 1.5rem;text-shadow:0 2px 4px #0000004d}.project-details p{color:#f8fafccc;font-size:20px;line-height:1.7;margin:0 0 2rem;max-width:100%}.project-links{flex-wrap:wrap;gap:1rem}.project-links,.project-navigation{display:flex;justify-content:center}.project-navigation{align-items:center;background:none;border:none;border-radius:50%;color:#e4fd7599;cursor:pointer;font-size:4rem;font-weight:300;padding:1rem;transition:all .3s cubic-bezier(.4,0,.2,1);width:80px}.project-navigation:hover{background:#e4fd751a;color:#e4fd75;transform:scale(1.1)}.project-navigation:disabled{cursor:not-allowed;opacity:.3}.project-navigation.prev:before{content:"‹"}.project-navigation.next:before{content:"›"}.project-slider{list-style:none;margin:0;padding:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.project-slider.sliding{opacity:.7;transform:scale(.95)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-15px) rotate(2deg)}50%{transform:translateY(-25px) rotate(0deg)}75%{transform:translateY(-10px) rotate(-2deg)}}.floating-icon:after{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000e6;border:1px solid #e4fd7533;border-radius:8px;bottom:-35px;color:#e4fd75;content:attr(alt);font-size:.8rem;font-weight:600;left:50%;opacity:0;padding:8px 12px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .3s ease;white-space:nowrap}.floating-icon:hover:after{opacity:1}.project-links .btn{font-size:20px}@media (max-width:1100px){.header{height:650px}nav{right:2%}nav ul{flex-direction:column;gap:1rem}ul li{font-size:15px;text-align:center}.subtitle{font-size:30px}.header p{max-width:100%;width:100%}.header section{margin:100px 50px}.khoa{align-self:center;height:auto;margin-right:15%;width:170px}.header-content p{font-size:20px}.header-content .btn{font-size:15px}.header-text{font-size:60px}.btn{min-width:200px;text-align:center;width:fit-content}.section-part{margin-left:50px}.section-header{font-size:30px}.section-part p{font-size:20px;max-width:100%}.project-details h4{font-size:30px}.project-info img{width:400px}.project-details p{font-size:20px}.project-info{margin-left:10%;text-align:center;width:80%}.project-items{gap:1rem;justify-content:space-between}}@media (max-width:768px){nav{padding:1rem;right:1rem}nav li{font-size:10px}.section-part p{font-size:15px;max-width:100%}.floating-skills{height:280px}.floating-icon{height:50px;width:50px}.floating-icon:first-child{left:5%;top:15%}.floating-icon:nth-child(2){left:35%;top:50%}.floating-icon:nth-child(3){left:10%;top:80%}.floating-icon:nth-child(4){left:60%;top:25%}.floating-icon:nth-child(5){left:70%;top:70%}.floating-icon:nth-child(6){left:80%;top:5%}.floating-icon:nth-child(7){left:10%;top:45%}.project-list{flex-direction:column;gap:1rem}.project-navigation{font-size:3rem;height:60px;width:60px}.quote{margin:4rem auto;padding:4rem 1rem}.subtitle{font-size:22px}.header p{max-width:100%;width:100%}.header section{margin:100px 50px}.khoa{align-self:center;height:auto;margin-right:0;width:150px}.header-content p{font-size:15px}.header-content .btn{font-size:10px}.header-text{font-size:40px}.project-details h4{font-size:30px}.project-info img{width:200px}.project-details p{font-size:15px}.project-info{margin-left:5px;text-align:center;width:100%}.project-items{gap:1rem;justify-content:space-between}.project-items .btn{font-size:15px;padding:.5rem 1rem}.project-links{display:flex}.project-links .btn{font-size:10px}}
/*# sourceMappingURL=main.a87a23b1.css.map*/