:root{--color-bg:#0a0a0f;--color-bg-alt:#12121a;--color-surface:#1a1a2e;--color-surface-hover:#22223a;--color-text:#e8e8f0;--color-text-muted:#9999b0;--color-accent:#4fc3f7;--color-accent-2:#7c4dff;--color-gradient:linear-gradient(135deg, var(--color-accent), var(--color-accent-2));--font-main:"Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"Cascadia Code", "Fira Code", monospace;--nav-height:70px;--section-padding:100px;--container-width:1100px;--transition-fast:.2s ease;--transition-medium:.4s ease;--transition-slow:.8s cubic-bezier(.16, 1, .3, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-main);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.7;overflow-x:hidden}img{max-width:100%;display:block}a{color:var(--color-accent);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent-2)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.skip-link{z-index:9999;background:var(--color-accent);color:#000;border-radius:0 0 8px 8px;padding:12px 24px;font-weight:600;transition:top .2s;position:absolute;top:-100%;left:16px}.skip-link:focus{top:0}.container{max-width:var(--container-width);margin:0 auto;padding:0 24px}.section{padding:var(--section-padding) 0;position:relative}.section__title{text-align:center;background:var(--color-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:60px;font-size:clamp(2rem,5vw,3rem);font-weight:700}.nav{height:var(--nav-height);z-index:1000;transition:background var(--transition-medium), box-shadow var(--transition-medium);justify-content:space-between;align-items:center;padding:0 40px;display:flex;position:fixed;top:0;left:0;right:0}.nav--glass{-webkit-backdrop-filter:blur(16px);background:#0a0a0f99;border-bottom:1px solid #ffffff0f}.nav--scrolled{-webkit-backdrop-filter:blur(20px);background:#0a0a0fe0;border-bottom:1px solid #ffffff14;box-shadow:0 4px 30px #0006}.nav__logo{background:var(--color-gradient);-webkit-text-fill-color:transparent;letter-spacing:-1px;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:700}.nav__links{gap:32px;list-style:none;display:flex}.nav__links a{color:var(--color-text-muted);letter-spacing:.5px;text-transform:uppercase;padding:4px 0;font-size:.9rem;font-weight:500;position:relative}.nav__links a:after{content:"";background:var(--color-gradient);width:0;height:2px;transition:width var(--transition-medium);position:absolute;bottom:-2px;left:0}.nav__links a:hover,.nav__links a.active{color:var(--color-text)}.nav__links a:hover:after,.nav__links a.active:after{width:100%}.nav__toggle{cursor:pointer;z-index:1001;background:0 0;border:none;flex-direction:column;gap:5px;padding:4px;display:none}.nav__toggle span{background:var(--color-text);width:24px;height:2px;transition:transform var(--transition-fast), opacity var(--transition-fast);display:block}.nav__overlay{z-index:999;opacity:0;pointer-events:none;transition:opacity var(--transition-medium);background:#0009;position:fixed;inset:0}.nav__overlay.active{opacity:1;pointer-events:auto}.hero{justify-content:center;align-items:center;height:100vh;min-height:600px;display:flex;position:relative;overflow:hidden}.hero__parallax{z-index:0;position:absolute;inset:-20%}.hero__image{object-fit:cover;will-change:transform;width:100%;height:100%;transform:scale(1.1)}.hero__overlay{z-index:1;background:linear-gradient(#0a0a0f66 0%,#0a0a0f80 50%,#0a0a0fe6 100%);position:absolute;inset:0}.hero__content{z-index:2;text-align:center;flex-direction:column;align-items:center;padding:0 24px;display:flex;position:relative}.hero__name{letter-spacing:-2px;text-shadow:0 4px 30px #00000080,0 1px 3px #0006;opacity:0;margin-bottom:16px;font-size:clamp(3rem,10vw,6rem);font-weight:800;line-height:1.1;animation:1s cubic-bezier(.16,1,.3,1) .3s forwards fadeUp;transform:translateY(30px)}.hero__title{color:var(--color-accent);letter-spacing:3px;text-transform:uppercase;text-shadow:0 2px 20px #4fc3f74d,0 1px 2px #0000004d;opacity:0;font-size:clamp(1.1rem,3vw,1.6rem);font-weight:400;animation:1s cubic-bezier(.16,1,.3,1) .6s forwards fadeUp;transform:translateY(20px)}.hero__scroll-btn{z-index:2;color:var(--color-text-muted);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:52px;height:52px;transition:all var(--transition-medium);opacity:0;background:#ffffff14;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;animation:1s 1.2s forwards fadeIn,2.5s 2s infinite bounce;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.hero__scroll-btn:hover{color:var(--color-accent);border-color:var(--color-accent);background:#4fc3f71a;transform:translate(-50%)scale(1.1)}.hero__scroll-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.about__content{gap:60px;display:grid}.about__text{text-align:center;max-width:700px;margin:0 auto}.about__text p{color:var(--color-text-muted);margin-bottom:16px;font-size:1.05rem}.about__highlights{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}.highlight-card{background:var(--color-surface);text-align:center;transition:transform var(--transition-medium), box-shadow var(--transition-medium);border:1px solid #ffffff0d;border-radius:16px;flex:280px;max-width:340px;padding:32px}.highlight-card:hover{border-color:#4fc3f733;transform:translateY(-6px);box-shadow:0 20px 40px #0000004d}.highlight-card__icon{color:var(--color-accent);margin-bottom:16px}.highlight-card h3{margin-bottom:8px;font-size:1.1rem;font-weight:600}.highlight-card p{color:var(--color-text-muted);font-size:.9rem}.skills{background:var(--color-bg-alt)}.skills__grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;display:grid}.skill-category{background:var(--color-surface);transition:transform var(--transition-medium), box-shadow var(--transition-medium);border:1px solid #ffffff0d;border-radius:16px;padding:28px}.skill-category:hover{transform:translateY(-4px);box-shadow:0 12px 30px #0003}.skill-category--frontend{--cat-color:#4fc3f7;--cat-color-dim:#4fc3f714;--cat-gradient:linear-gradient(135deg, #4fc3f7, #29b6f6);border-top:3px solid var(--cat-color)}.skill-category--frontend .skill-item__fill{background:var(--cat-gradient);box-shadow:0 0 8px #4fc3f74d}.skill-category--backend{--cat-color:#66bb6a;--cat-color-dim:#66bb6a14;--cat-gradient:linear-gradient(135deg, #66bb6a, #43a047);border-top:3px solid var(--cat-color)}.skill-category--backend .skill-item__fill{background:var(--cat-gradient);box-shadow:0 0 8px #66bb6a4d}.skill-category--devops{--cat-color:#ffa726;--cat-color-dim:#ffa72614;--cat-gradient:linear-gradient(135deg, #ffa726, #fb8c00);border-top:3px solid var(--cat-color)}.skill-category--devops .skill-item__fill{background:var(--cat-gradient);box-shadow:0 0 8px #ffa7264d}.skill-category__title{color:var(--cat-color,var(--color-accent));text-transform:uppercase;letter-spacing:2px;margin-bottom:24px;font-size:1.1rem;font-weight:600}.skill-item{margin-bottom:20px}.skill-item:last-child{margin-bottom:0}.skill-item__header{justify-content:space-between;margin-bottom:8px;display:flex}.skill-item__name{font-size:.9rem;font-weight:500}.skill-item__percent{color:var(--color-text-muted);font-size:.85rem;font-family:var(--font-mono)}.skill-item__bar{background:#ffffff0f;border-radius:3px;height:6px;overflow:hidden}.skill-item__fill{background:var(--color-gradient);border-radius:3px;width:0;height:100%;transition:width 1.2s cubic-bezier(.16,1,.3,1);position:relative;box-shadow:0 0 8px #4fc3f74d}.skill-item__fill:after{content:"";filter:blur(4px);opacity:0;background:#ffffff4d;width:20px;height:100%;transition:opacity .3s;position:absolute;top:0;right:0}.skill-item.animated .skill-item__fill:after{opacity:1;animation:1.5s 1.2s forwards shimmer}.timeline{max-width:750px;margin:0 auto;padding-left:40px;position:relative}.timeline:before{content:"";background:linear-gradient(180deg, var(--color-accent), var(--color-accent-2), transparent);width:2px;position:absolute;top:0;bottom:0;left:8px}.timeline__item{margin-bottom:48px;position:relative}.timeline__item:last-child{margin-bottom:0}.timeline__marker{background:var(--accent-color,var(--color-accent));width:14px;height:14px;box-shadow:0 0 16px color-mix(in srgb, var(--accent-color,var(--color-accent)) 50%, transparent);border-radius:50%;position:absolute;top:6px;left:-36px}.timeline__content{background:var(--color-surface);transition:transform var(--transition-medium), box-shadow var(--transition-medium), border-color var(--transition-medium);border:1px solid #ffffff0d;border-left:3px solid color-mix(in srgb, var(--accent-color,var(--color-accent)) 40%, transparent);border-radius:12px;padding:28px}.timeline__content:hover{border-left-color:var(--accent-color,var(--color-accent));transform:translate(6px);box-shadow:0 10px 30px #0003}.timeline__header{align-items:flex-start;gap:16px;margin-bottom:16px;display:flex}.timeline__logo{border:1px solid #ffffff14;border-radius:8px;width:48px;min-width:48px;height:48px;overflow:hidden}.timeline__logo img{object-fit:cover;width:100%;height:100%}.timeline__date{color:var(--accent-color,var(--color-accent));text-transform:uppercase;letter-spacing:1px;font-size:.8rem;font-weight:600}.timeline__title{margin:4px 0 2px;font-size:1.2rem;font-weight:700}.timeline__company{color:var(--color-text-muted);font-size:.9rem;font-style:italic}.timeline__tags{flex-wrap:wrap;gap:6px;display:flex}.other-experience{background:var(--color-bg-alt)}.other-exp__grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:24px;max-width:800px;margin:0 auto;display:grid}.other-exp__card{background:var(--color-surface);transition:transform var(--transition-medium), box-shadow var(--transition-medium);border:1px solid #ffffff0d;border-top:3px solid color-mix(in srgb, var(--accent-color,var(--color-accent)) 50%, transparent);border-radius:12px;padding:24px}.other-exp__card:hover{border-top-color:var(--accent-color,var(--color-accent));transform:translateY(-4px);box-shadow:0 12px 30px #00000040}.other-exp__header{align-items:flex-start;gap:14px;margin-bottom:12px;display:flex}.other-exp__logo{border:1px solid #ffffff14;border-radius:8px;width:42px;min-width:42px;height:42px;overflow:hidden}.other-exp__logo img{object-fit:cover;width:100%;height:100%}.other-exp__title{margin-bottom:2px;font-size:1.05rem;font-weight:700}.other-exp__company{color:var(--color-text-muted);font-size:.85rem;font-style:italic}.other-exp__date{color:var(--accent-color,var(--color-accent));text-transform:uppercase;letter-spacing:.5px;font-size:.75rem;font-weight:600}.other-exp__tags{flex-wrap:wrap;gap:6px;display:flex}.education{background:var(--color-bg)}.education__grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:800px;margin:0 auto;display:grid}.education__card{background:var(--color-surface);text-align:center;transition:transform var(--transition-medium), box-shadow var(--transition-medium);border:1px solid #ffffff0d;border-radius:16px;padding:32px}.education__card:hover{border-color:#4fc3f726;transform:translateY(-4px);box-shadow:0 15px 35px #00000040}.education__icon{border:1px solid #ffffff14;border-radius:10px;width:56px;height:56px;margin:0 auto 16px;overflow:hidden}.education__icon img{object-fit:cover;width:100%;height:100%}.education__title{margin-bottom:8px;font-size:1.1rem;font-weight:700}.education__institution{color:var(--color-text-muted);margin-bottom:8px;font-size:.9rem}.education__year{color:var(--color-accent);text-transform:uppercase;letter-spacing:1px;font-size:.8rem;font-weight:600}.tag{color:var(--color-accent);background:#4fc3f714;border:1px solid #4fc3f726;border-radius:20px;padding:3px 10px;font-size:.72rem;font-weight:500}.contact{text-align:center;background:var(--color-bg-alt)}.contact__subtitle{color:var(--color-text-muted);margin-top:-40px;margin-bottom:48px;font-size:1.1rem}.contact__links{flex-wrap:wrap;justify-content:center;gap:20px;display:flex}.contact__link{background:var(--color-surface);color:var(--color-text);transition:all var(--transition-medium);border:1px solid #ffffff0d;border-radius:12px;justify-content:center;align-items:center;gap:12px;min-width:180px;padding:16px 32px;display:inline-flex}.contact__link:hover{color:var(--color-accent);border-color:#4fc3f74d;transform:translateY(-3px);box-shadow:0 10px 30px #0003}.footer{text-align:center;color:var(--color-text-muted);border-top:1px solid #ffffff0d;padding:32px 0;font-size:.85rem}.reveal{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transform:translateY(40px)}.reveal.visible{opacity:1;transform:translateY(0)}.reveal.hidden-up{opacity:0;transform:translateY(-30px)}.reveal-delay-1{transition-delay:.1s}.reveal-delay-2{transition-delay:.2s}.reveal-delay-3{transition-delay:.3s}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{to{opacity:1}}@keyframes bounce{0%,20%,50%,80%,to{transform:translate(-50%)translateY(0)}40%{transform:translate(-50%)translateY(-8px)}60%{transform:translate(-50%)translateY(-4px)}}@keyframes shimmer{to{opacity:0}}@media (width<=768px){:root{--section-padding:70px;--nav-height:60px}.nav{padding:0 20px}.nav__toggle{display:flex}.nav__links{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:280px;height:100vh;transition:right var(--transition-medium);z-index:1000;background:#0a0a0ff7;flex-direction:column;justify-content:center;align-items:center;gap:24px;position:fixed;top:0;right:-100%;box-shadow:-10px 0 30px #0000004d}.nav__links.open{right:0}.nav__links a{font-size:1.1rem}.hero__name{font-size:clamp(2.5rem,12vw,4rem)}.hero__title{letter-spacing:2px;font-size:1rem}.skills__grid{grid-template-columns:1fr}.timeline{padding-left:30px}.timeline:before{left:4px}.timeline__marker{width:10px;height:10px;left:-30px}.timeline__logo{width:40px;min-width:40px;height:40px}.other-exp__grid,.education__grid{grid-template-columns:1fr}.contact__links{flex-direction:column;align-items:center}.contact__link{min-width:unset;width:100%;max-width:280px}}@media (width<=480px){.highlight-card{padding:24px}.timeline__header{flex-direction:column;gap:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.reveal,.reveal.hidden-up,.hero__name,.hero__title,.hero__scroll-btn{opacity:1;transform:none}html{scroll-behavior:auto}}