@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap";:root{--bg: #282C33;--primary: #C778DD;--gray: #ABB2BF;--white: #FFFFFF;--border-color: #ABB2BF}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;overflow-x:hidden}body{font-family:Fira Code,monospace;background-color:var(--bg);color:var(--gray);line-height:1.5;overflow-x:hidden}a{text-decoration:none;color:var(--gray);transition:color .2s}a:hover{color:var(--white)}ul{list-style:none}.container{max-width:1024px;margin:0 auto;padding:0 20px;width:100%}.primary{color:var(--primary)}.white{color:var(--white)}.btn{display:inline-block;padding:8px 16px;border:1px solid var(--primary);color:var(--white);background:transparent;font-family:inherit;font-size:16px;font-weight:500;cursor:pointer;transition:background .2s}.btn:hover{background:#c778dd33;color:var(--white)}.btn-gray{border-color:var(--gray);color:var(--gray)}.btn-gray:hover{background:#abb2bf33}.btn-outline{border:1px solid var(--primary);background-color:transparent}.dots{background-image:radial-gradient(var(--gray) 2px,transparent 2px);background-size:16px 16px;background-position:0 0}.fixed-socials{position:fixed;left:16px;top:0;display:flex;flex-direction:column;align-items:center;gap:8px;z-index:100}.fixed-socials:before{content:"";width:1px;height:191px;background:var(--gray);margin-bottom:8px}.fixed-socials a:hover svg path{fill:var(--primary)}.header{padding:32px 0;position:sticky;top:0;background-color:var(--bg);z-index:1000;border-bottom:1px solid transparent}.header-container{display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--white)}.logo-img{height:32px;width:auto;object-fit:contain}.nav-links{display:flex;align-items:center;gap:32px}.nav-links nav{display:flex;gap:32px;align-items:center}.nav-links a{font-size:16px}.nav-links a.active{color:var(--white);font-weight:500}.menu-toggle{display:none;cursor:pointer;color:var(--white)}.menu-close{display:none;cursor:pointer;position:absolute;top:32px;right:20px;color:var(--white);padding:8px}.hero{padding:60px 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:40px}.hero-content{flex:1;min-width:300px}.hero-title{font-size:32px;font-weight:600;color:var(--white);line-height:1.3;margin-bottom:24px}.hero-desc{font-size:16px;margin-bottom:24px;color:var(--gray);max-width:460px}.hero-visual{flex:1;min-width:300px;display:flex;flex-direction:column;align-items:center;position:relative;padding-top:30px}.hero-visual img{width:100%;max-width:450px;z-index:2;position:relative}.hero-visual .logo-outline{position:absolute;top:60px;left:20px;width:155px;height:155px;z-index:1}.hero-visual .dots-bg{position:absolute;bottom:50px;right:20px;width:84px;height:84px;z-index:3}.hero-status{margin-top:-10px;border:1px solid var(--border-color);padding:8px 12px;display:flex;align-items:center;gap:10px;color:var(--gray);font-weight:500;background:var(--bg);z-index:4;position:relative;max-width:400px;width:90%}.hero-status:before{content:"";width:16px;height:16px;background:var(--primary);display:inline-block;flex-shrink:0}.quote-section{padding:70px 0;display:flex;justify-content:center}.quote-box{position:relative;border:1px solid var(--border-color);padding:32px;display:inline-block;max-width:100%}.quote-box:before,.quote-box:after{content:'"';position:absolute;background:var(--bg);color:var(--gray);font-size:32px;line-height:1;width:30px;text-align:center;font-family:serif;font-style:italic;font-weight:700}.quote-box:before{top:-16px;left:10px}.quote-box:after{bottom:-16px;right:10px}.quote-text{font-size:24px;font-weight:500;color:var(--white);letter-spacing:.5px}.section-header{display:flex;align-items:center;gap:16px;margin-bottom:48px}.section-title{font-size:32px;font-weight:500;color:var(--white)}.section-line{height:1px;background:var(--primary);flex:1;max-width:500px}.view-all{margin-left:auto;color:var(--white);font-weight:500}.projects{padding:70px 0}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}.project-card{border:1px solid var(--border-color);display:flex;flex-direction:column}.project-img{width:100%;height:180px;border-bottom:1px solid var(--border-color)}.project-img img{width:100%;height:100%;object-fit:cover}.project-tech{padding:8px 16px;border-bottom:1px solid var(--border-color);font-size:16px;color:var(--gray)}.project-body{padding:16px;flex:1;display:flex;flex-direction:column}.project-title{font-size:24px;font-weight:500;color:var(--white);margin-bottom:16px}.project-desc{color:var(--gray);margin-bottom:16px;flex:1}.project-desc-detailed{font-size:14px;color:var(--gray);margin-bottom:16px;flex:1}.project-desc-detailed strong{color:var(--white);font-weight:500}.project-desc-detailed p{margin-bottom:8px}.project-links{display:flex;gap:16px}.skills{padding:70px 0}.skills-container{display:flex;gap:40px;flex-wrap:wrap}.skills-visual{flex:1;position:relative;min-width:300px;min-height:250px}.skills-cards{flex:2;display:flex;flex-wrap:wrap;gap:16px;align-content:flex-start;justify-content:flex-end}.skills-col{display:flex;flex-direction:column;gap:16px;flex:1;min-width:170px}.skill-card{border:1px solid var(--border-color);background:var(--bg)}.skill-title{border-bottom:1px solid var(--border-color);padding:8px;color:var(--white);font-weight:600}.skill-items{padding:8px;color:var(--gray);line-height:1.6}.skills-visual .dots-1{position:absolute;top:20px;left:20px;width:63px;height:63px}.skills-visual .dots-2{position:absolute;bottom:50px;left:100px;width:63px;height:63px}.skills-visual .square-outline{position:absolute;top:40px;right:40px;width:86px;height:86px;border:1px solid var(--primary)}.skills-visual .square-outline-sm{position:absolute;bottom:20px;right:80px;width:52px;height:52px;border:1px solid var(--border-color)}.skills-visual .shapes-group{position:absolute;top:60px;left:60px}.about{padding:70px 0}.about-container{display:flex;align-items:center;gap:40px;flex-wrap:wrap}.about-text{flex:1;min-width:300px}.about-text p{margin-bottom:24px;color:var(--gray)}.about-visual{flex:1;min-width:300px;position:relative;display:flex;justify-content:center;padding:0 40px}.about-visual img{width:100%;max-width:340px;border-bottom:2px solid var(--primary);z-index:2;position:relative}.about-visual .dots-3{position:absolute;top:50px;left:10px;width:84px;height:84px;z-index:1}.about-visual .dots-4{position:absolute;bottom:50px;right:10px;width:84px;height:84px;z-index:3}.career-objective{margin-top:24px;padding:16px;border-left:2px solid var(--primary);background:#c778dd0d}.career-objective h3{color:var(--white);margin-bottom:8px;font-size:18px}.contacts{padding:70px 0}.contacts-container{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}.contacts-text{flex:1;min-width:300px;max-width:500px;color:var(--gray)}.contacts-box{border:1px solid var(--border-color);padding:16px;align-self:flex-start}.contacts-title{color:var(--white);font-weight:600;margin-bottom:16px}.contact-line{display:flex;align-items:center;gap:8px;color:var(--gray);margin-bottom:8px;word-break:break-all}.contact-line:last-child{margin-bottom:0}.footer{border-top:1px solid var(--border-color);padding:32px 0 16px;margin-top:70px}.footer-top{display:flex;justify-content:space-between;margin-bottom:48px;flex-wrap:wrap;gap:20px}.footer-left .logo{display:inline-flex;margin-bottom:16px}.footer-email{color:var(--gray);font-weight:400;margin-left:24px}.footer-desc{color:var(--white)}.footer-right h3{color:var(--white);font-weight:500;margin-bottom:12px;font-size:24px}.social-icons{display:flex;gap:12px}.footer-bottom{text-align:center;color:var(--gray)}.page-header{padding:80px 0 40px}.page-title{font-size:32px;font-weight:600;color:var(--white);margin-bottom:16px}.page-desc{font-size:16px;color:var(--gray);margin-bottom:48px}.projects-section-title{font-size:24px;color:var(--white);margin-bottom:32px;margin-top:48px}.fun-facts{padding:70px 0}.fun-facts-container{display:flex;gap:40px;align-items:center}.facts-grid{flex:2;display:flex;flex-wrap:wrap;gap:16px}.fact-item{border:1px solid var(--border-color);padding:8px 16px;color:var(--gray);display:inline-block}.fact-item strong{color:var(--white);font-weight:500}.facts-visual{flex:1;position:relative;min-height:200px;display:flex;justify-content:center;align-items:center}.contacts-page{display:flex;gap:40px;flex-wrap:wrap}.contact-text-area{flex:1;min-width:300px}.contact-text-area p{margin-bottom:24px}.contact-boxes{flex:1;display:flex;gap:16px;flex-wrap:wrap;align-content:flex-start}.all-media{padding:70px 0}.all-media-container{display:flex;gap:32px;flex-wrap:wrap}.media-link{display:flex;align-items:center;gap:8px;font-size:16px}.media-link svg{width:24px;height:24px}.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-bottom:32px}.blog-card{display:flex;flex-direction:column;border:1px solid var(--border-color);color:var(--gray);text-decoration:none;transition:border-color .25s,transform .25s;cursor:pointer;overflow:hidden;min-width:0}.blog-card:hover{border-color:var(--primary);transform:translateY(-4px);color:var(--gray)}.blog-card-img{width:100%;height:180px;border-bottom:1px solid var(--border-color);overflow:hidden;background:#c778dd0d;display:flex;align-items:center;justify-content:center}.blog-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.blog-card:hover .blog-card-img img{transform:scale(1.05)}.blog-card-no-img{font-size:13px;color:var(--gray);letter-spacing:.5px;display:flex;gap:6px;align-items:center}.blog-card-tags{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px;border-bottom:1px solid var(--border-color)}.blog-tag{font-size:11px;padding:2px 8px;border:1px solid var(--primary);color:var(--primary);border-radius:0;letter-spacing:.5px}.blog-card-body{padding:16px;flex:1;display:flex;flex-direction:column;gap:8px}.blog-card-title{font-size:18px;font-weight:600;color:var(--white);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.blog-card-snippet{font-size:13px;color:var(--gray);line-height:1.6;flex:1;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.blog-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:8px;flex-shrink:0;gap:8px;min-width:0}.blog-card-date{font-size:12px;color:var(--gray);opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.blog-card-read{font-size:13px;color:var(--primary);font-weight:500;transition:letter-spacing .2s}.blog-card:hover .blog-card-read{letter-spacing:.5px}.blog-loading{display:flex;align-items:center;gap:12px;padding:32px 0;color:var(--gray);font-size:14px}.blog-spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.blog-error{padding:16px;border:1px solid #e06c75;color:#e06c75;font-size:14px;margin-bottom:16px}.blog-empty{color:var(--gray);font-size:14px;padding:16px 0}.blog-view-all{margin-top:8px;display:flex;justify-content:flex-end}@media(max-width:768px){.fixed-socials{display:none}.header{padding:16px 0;border-bottom:1px solid var(--border-color)}.menu-toggle,.menu-close{display:block}.nav-links{position:fixed;top:0;right:-100%;width:100%;height:100vh;background-color:var(--bg);flex-direction:column;justify-content:center;align-items:center;transition:right .3s ease;z-index:2000}.nav-links.active{right:0}.nav-links nav{flex-direction:column;align-items:center;gap:32px}.nav-links nav a{font-size:24px}.mobile-btn{margin-top:16px;padding:12px 24px}.hero,.about-container,.contacts-container{flex-direction:column}.hero-title{font-size:26px}.quote-text{font-size:18px}.skills-cards{justify-content:center;width:100%}.skills-visual{display:none}.project-grid{grid-template-columns:1fr}.footer-top{flex-direction:column;align-items:center;text-align:center}.footer-left .logo{flex-direction:column;gap:8px}.footer-email{margin-left:0}.fun-facts-container{flex-direction:column}.facts-visual{display:none}}@media(max-width:480px){.section-title{font-size:24px}.hero-visual img{margin-top:20px}}