*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:16px}body{line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}ul,ol{list-style:none}a{text-decoration:none;color:inherit}button{cursor:pointer;border:none;background:none}main{position:relative}:root{--color-bg: #fafaf8;--color-surface: #FAFAF8;--color-surface-solid: #FFFFFF;--color-surface-hover: #F0F0EE;--color-text-primary: #0a0a0a;--color-text-secondary: #1E1E3E;--color-accent: #1a5fe8;--color-border: rgba(0, 0, 0, .08);--color-border-accent: rgba(26, 95, 232, .22);--dot-color: rgba(0, 0, 0, .1);--shadow-card: 0 2px 20px rgba(0, 0, 0, .06);--shadow-card-hover: 0 16px 48px rgba(26, 95, 232, .12);--font-main: "DM Sans", sans-serif;--font-display: "Poppins", sans-serif;--transition-smooth: all .4s cubic-bezier(.25, .46, .45, .94);--transition-fast: all .2s cubic-bezier(.25, .46, .45, .94);--ease-out: cubic-bezier(.25, .46, .45, .94);--section-padding: 120px 10vw;--border-radius-card: 16px;--border-radius-pill: 999px}[data-theme=dark]{--color-bg: #08080F;--color-surface: #12121E;--color-surface-solid: #12121E;--color-surface-hover: #1A1A2A;--color-text-primary: #F0F0FF;--color-text-secondary: #D4D4F0;--color-border: rgba(255, 255, 255, .07);--color-border-accent: rgba(74, 138, 244, .3);--dot-color: rgba(255, 255, 255, .055);--shadow-card: 0 2px 20px rgba(0, 0, 0, .45);--shadow-card-hover: 0 16px 48px rgba(26, 95, 232, .2)}body{background-color:var(--color-bg);color:var(--color-text-primary);font-family:var(--font-main);transition:background-color .4s ease,color .3s ease}#webgl-canvas{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:0;pointer-events:none;display:block;opacity:1;transition:opacity .4s ease-out}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes rotateBorder{0%{--border-angle: 0deg}to{--border-angle: 360deg}}@keyframes pulseDot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}}@keyframes timelineDotPop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.visible{animation:fadeUp .7s var(--ease-out) forwards}.reveal{opacity:0;transform:translateY(28px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}.reveal.revealed{opacity:1;transform:translateY(0)}.stagger-grid>*:nth-child(1){transition-delay:0ms}.stagger-grid>*:nth-child(2){transition-delay:70ms}.stagger-grid>*:nth-child(3){transition-delay:.14s}.stagger-grid>*:nth-child(4){transition-delay:.21s}.stagger-grid>*:nth-child(5){transition-delay:.28s}.stagger-grid>*:nth-child(6){transition-delay:.35s}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}.visible{animation:none;opacity:1}}body:after{content:"";position:fixed;top:-100%;left:-50%;width:300%;height:300%;pointer-events:none;z-index:9000;opacity:.18;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.80' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:180px 180px;animation:grain 8s steps(10) infinite}[data-theme=dark] body:after{opacity:.28}@keyframes grain{0%,to{transform:translate(0)}10%{transform:translate(-5%,-10%)}20%{transform:translate(-15%,5%)}30%{transform:translate(7%,-25%)}40%{transform:translate(-5%,25%)}50%{transform:translate(-15%,10%)}60%{transform:translate(15%)}70%{transform:translateY(15%)}80%{transform:translate(3%,35%)}90%{transform:translate(-10%,10%)}}.text-blend-overlay{position:fixed;z-index:2;pointer-events:none;mix-blend-mode:exclusion;color:#fff;opacity:0;margin:0;padding:0;overflow:visible}#scroll-progress{position:fixed;top:0;left:0;height:2px;width:0%;background:var(--color-accent);z-index:999;transition:width .08s linear;will-change:width}#navbar{position:fixed;top:0;left:0;width:100%;z-index:100;opacity:0;pointer-events:none;transition:opacity .5s var(--ease-out),background .3s ease;display:flex;align-items:center;justify-content:space-between;padding:16px 10vw;gap:24px;background:#fafaf8e0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(0,0,0,.07)}[data-theme=dark] #navbar{background:#08080fd1;border-bottom-color:#ffffff0f}#navbar.visible{opacity:1;pointer-events:auto}#nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--color-text-primary);letter-spacing:.02em;flex-shrink:0;position:relative}#nav-logo:after{content:"";position:absolute;top:-7px;right:-10px;bottom:-7px;left:-10px;border-radius:50%;border:1.5px solid var(--color-accent);opacity:0;transform:scale(.7);pointer-events:none}#nav-logo.logo-clicked:after{animation:logoCircle .55s var(--ease-out) forwards}@keyframes logoCircle{0%{opacity:0;transform:scale(.7)}35%{opacity:1;transform:scale(1)}65%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.15)}}#nav-links{display:flex;gap:32px;align-items:center}#nav-links a{font-family:var(--font-main);font-size:.9rem;font-weight:400;color:var(--color-text-secondary);position:relative;padding-bottom:3px;transition:color .25s ease}#nav-links a:after{content:"";position:absolute;bottom:0;left:0;width:0;height:1.5px;background:var(--color-accent);transition:width .3s var(--ease-out)}#nav-links a:hover{color:var(--color-text-primary)}#nav-links a:hover:after,#nav-links a.active:after{width:100%}#nav-links a.active{color:var(--color-accent)}#nav-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.btn-resume{font-family:var(--font-main);font-size:.85rem;font-weight:500;color:var(--color-accent);border:1.5px solid var(--color-border-accent);padding:7px 16px;border-radius:var(--border-radius-pill);transition:var(--transition-fast);white-space:nowrap}.btn-resume:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}#theme-toggle{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:1.5px solid var(--color-border);color:var(--color-text-secondary);transition:var(--transition-fast);flex-shrink:0}#theme-toggle:hover{border-color:var(--color-accent);color:var(--color-accent)}#theme-toggle svg{width:16px;height:16px}#theme-toggle .icon-sun{display:none}#theme-toggle .icon-moon,[data-theme=dark] #theme-toggle .icon-sun{display:block}[data-theme=dark] #theme-toggle .icon-moon{display:none}#hamburger{display:none;align-items:center;justify-content:center;width:34px;height:34px;color:var(--color-text-primary);flex-shrink:0}#hamburger svg{width:20px;height:20px}#hamburger .icon-close,#hamburger.open .icon-lines{display:none}#hamburger.open .icon-close{display:block}#nav-mobile-menu{display:none;position:fixed;top:57px;left:0;right:0;background:var(--color-bg);border-bottom:1px solid var(--color-border);padding:24px 6vw 32px;flex-direction:column;gap:0;z-index:99;opacity:0;transform:translateY(-8px);transition:opacity .3s var(--ease-out),transform .3s var(--ease-out);pointer-events:none}#nav-mobile-menu.open{opacity:1;transform:translateY(0);pointer-events:auto}#nav-mobile-menu a{font-family:var(--font-main);font-size:1.1rem;font-weight:500;color:var(--color-text-secondary);padding:14px 0;border-bottom:1px solid var(--color-border);transition:color .2s}#nav-mobile-menu a:last-child{border-bottom:none}#nav-mobile-menu a:hover{color:var(--color-accent)}@media (max-width: 768px){#navbar{padding:14px 6vw}#nav-links{display:none}#hamburger,#nav-mobile-menu{display:flex}}@media (max-width: 480px){.btn-resume{display:none}}#hero{position:relative;height:100vh;min-height:600px;overflow:hidden;background:transparent}#hero-text{position:absolute;top:50%;left:0;transform:translate(calc(50vw - 50%),-50%);z-index:2;white-space:nowrap;font-size:clamp(3.5rem,8vw,7rem);will-change:transform}#hero-title-blend{position:fixed;top:50%;left:0;transform:translate(calc(50vw - 50%),-50%);z-index:2;white-space:nowrap;font-family:var(--font-display);font-size:clamp(3.5rem,8vw,7rem);font-weight:700;line-height:1.1;color:#fff;mix-blend-mode:exclusion;opacity:0;pointer-events:none;letter-spacing:-.01em;will-change:transform,opacity}#hero-words{display:flex;gap:.28em;align-items:baseline;opacity:0}.hero-word{display:inline-block;font-family:var(--font-display);font-size:inherit;font-weight:700;line-height:1.1;color:transparent}#hero-left-extras{position:absolute;left:10vw;display:flex;flex-direction:column;gap:20px;opacity:0;pointer-events:none;transition:opacity .55s ease-out;z-index:2}#hero-left-extras.active{opacity:1;pointer-events:auto}#hero-tagline{font-family:var(--font-main);font-size:clamp(1rem,2vw,1.2rem);color:var(--color-text-secondary);line-height:1.65;max-width:46ch;min-height:1.8em}#hero-cta-buttons{display:flex;gap:14px;flex-wrap:wrap;align-items:center}.btn-primary,.btn-secondary{display:inline-block;padding:13px 30px;border-radius:var(--border-radius-pill);font-family:var(--font-main);font-size:1rem;font-weight:500;letter-spacing:.01em;transition:var(--transition-smooth)}.btn-primary{background:var(--color-accent);color:#fff;box-shadow:0 0 0 2.5px #ffffff8c,0 4px 20px #1a5fe84d;will-change:transform}.btn-primary:hover{box-shadow:0 0 0 2.5px #ffffff8c,0 8px 32px #1a5fe873;filter:brightness(1.08)}.btn-secondary{background:var(--color-surface-solid);color:var(--color-text-primary);border:1.5px solid rgba(0,0,0,.18);will-change:transform}[data-theme=dark] .btn-secondary{border-color:#ffffff2e}.btn-secondary:hover{border-color:var(--color-accent);color:var(--color-accent)}#hero-right{position:absolute;right:5vw;top:50%;transform:translate(60px,-50%);opacity:0;width:clamp(375px,57.5vw,825px);display:flex;flex-direction:column;align-items:center;gap:14px;transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);z-index:2;will-change:transform,opacity;contain:layout style}#hero-right.slide-in{transform:translateY(-50%);opacity:1}.hero-hl-viewport{position:relative;width:100%;overflow:hidden}.hero-hl-viewport:before,.hero-hl-viewport:after{content:"";position:absolute;top:0;bottom:0;width:11%;z-index:10;pointer-events:none}.hero-hl-viewport:before{left:0;background:linear-gradient(to right,transparent,transparent)}.hero-hl-viewport:after{right:0;background:linear-gradient(to left,transparent,transparent)}.hero-hl-track{display:flex;gap:20px;will-change:transform}.hero-hl-card{position:relative;flex:0 0 80%;aspect-ratio:16 / 10;overflow:hidden;border-radius:6px;opacity:.35;transform:scale(.97);transition:opacity .5s ease,transform .5s ease;cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0}.hero-hl-card.active{opacity:1;transform:scale(1);cursor:default}.hero-hl-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;transition:transform .6s ease}.hero-hl-card.active .hero-hl-bg{transform:scale(1.03)}.hero-hl-overlay{position:absolute;bottom:0;left:0;padding:18px 22px;z-index:2}.hero-hl-cat{display:block;font-family:var(--font-main);font-size:.65rem;font-weight:600;letter-spacing:.13em;color:#ffffffb8;margin-bottom:5px;text-transform:uppercase}.hero-hl-title{font-family:var(--font-display);font-size:clamp(1.1rem,2.2vw,1.6rem);font-weight:700;line-height:1.15;color:#fff;margin:0 0 4px}.hero-hl-sub{font-family:var(--font-main);font-size:.76rem;font-weight:500;color:#c8a96e}.hero-hl-dots{display:flex;align-items:center;justify-content:center;gap:7px}.hero-hl-dot{width:6px;height:6px;border-radius:999px;background:var(--color-text-secondary);opacity:.3;border:none;padding:0;cursor:pointer;transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s ease,background .3s ease}.hero-hl-dot.active{width:22px;opacity:1;background:var(--color-text-primary)}#hero-image-badge{display:flex;align-items:center;gap:7px;background:var(--color-surface-solid);border:1px solid var(--color-border-accent);border-radius:var(--border-radius-pill);padding:7px 16px;font-family:var(--font-main);font-size:.78rem;font-weight:500;color:var(--color-text-secondary);white-space:nowrap;box-shadow:0 4px 16px #1a5fe81a;opacity:0;transition:opacity .5s var(--ease-out)}#hero-image-badge.visible{opacity:1}.badge-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;flex-shrink:0;animation:pulseDot 2s ease-in-out infinite}@media (max-width: 900px){#hero{height:auto;min-height:100vh;overflow-y:auto;display:flex;flex-direction:column;align-items:center;padding:96px 6vw 100px;gap:28px}#hero-right{position:static!important;transform:none!important;opacity:1!important;width:100%;order:1}.hero-hl-viewport:before,.hero-hl-viewport:after{width:8%}#hero-image-badge{display:none}#hero-text{position:static!important;left:auto!important;top:auto!important;transform:none!important;font-size:clamp(2rem,7vw,3rem)!important;white-space:normal;text-align:center;width:100%;order:2}#hero-words{opacity:1!important;animation:none!important;justify-content:center;flex-wrap:wrap}#hero-left-extras{position:static!important;left:auto!important;top:auto!important;transform:none!important;opacity:1!important;pointer-events:auto!important;align-items:center;text-align:center;width:100%;order:3}#hero-tagline{max-width:100%}#hero-cta-buttons{justify-content:center}#hero-title-blend{white-space:normal;text-align:center;width:100%;left:0;transform:none}.hero-word{color:transparent}.section-nav-footer--abs{position:sticky;bottom:16px;left:auto;right:auto;order:99;padding:0;pointer-events:auto}}#about{padding:var(--section-padding);display:flex;flex-direction:column;align-items:center}#about>*{flex-shrink:0}#about-content{display:grid;grid-template-columns:1fr 320px;gap:60px;align-items:start;width:100%}#about-text{max-width:640px}.section-label{display:inline-block;font-family:var(--font-main);font-size:.75rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--color-accent);margin-bottom:16px}#about h2{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1.2;color:var(--color-text-primary);margin-bottom:24px}#about p{font-family:var(--font-main);font-size:clamp(.95rem,1.5vw,1.05rem);line-height:1.85;color:var(--color-text-secondary);max-width:62ch;margin-bottom:16px;text-align:justify}#about p:last-of-type{margin-bottom:28px}#about-highlights{display:flex;flex-wrap:wrap;gap:9px}.highlight-chip{font-family:var(--font-main);font-size:.88rem;font-weight:600;color:var(--color-text-primary);background:var(--color-surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border-accent);padding:8px 16px;border-radius:var(--border-radius-pill);transition:var(--transition-fast)}.highlight-chip:hover{background:var(--color-surface-hover);border-color:var(--color-accent);transform:translateY(-2px)}#about-sidebar{display:flex;flex-direction:column;gap:20px;padding-top:8px}.sidebar-widget{background:var(--color-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--color-border);border-radius:var(--border-radius-card);padding:20px 22px;box-shadow:var(--shadow-card);transition:var(--transition-smooth)}.sidebar-widget:hover{border-color:var(--color-border-accent);box-shadow:var(--shadow-card-hover)}.widget-label{font-family:var(--font-main);font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent);margin-bottom:14px}#currently-widget .currently-item{font-family:var(--font-main);font-size:.93rem;font-weight:500;color:var(--color-text-secondary);line-height:1.5;padding:5px 0;border-bottom:1px solid var(--color-border)}#currently-widget .currently-item:last-child{border-bottom:none}#interest-tags{display:flex;flex-wrap:wrap;gap:7px}.interest-tag{font-family:var(--font-main);font-size:.83rem;font-weight:600;color:var(--color-text-secondary);background:var(--color-bg);border:1px solid var(--color-border);padding:5px 12px;border-radius:var(--border-radius-pill);transition:var(--transition-fast)}.interest-tag:hover{border-color:var(--color-border-accent);color:var(--color-accent)}#stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:72px;width:100%;border:1px solid var(--color-border);border-radius:var(--border-radius-card);overflow:hidden;background:var(--color-border)}.stat-item{background:var(--color-surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:28px 24px;display:flex;flex-direction:column;align-items:center;gap:6px;transition:background .25s ease}.stat-item:hover{background:var(--color-surface-hover)}.stat-number{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1;color:var(--color-accent)}.stat-label{font-family:var(--font-main);font-size:.82rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary)}@media (max-width: 960px){#about-content{grid-template-columns:1fr;gap:40px}#about-sidebar{flex-direction:row;flex-wrap:wrap}.sidebar-widget{flex:1;min-width:200px}}@media (max-width: 768px){#about{padding:80px 6vw}#stats-row{grid-template-columns:repeat(2,1fr);margin-top:48px}#stats-row .stat-item:last-child{grid-column:span 2}}@media (max-width: 480px){#about-sidebar{flex-direction:column}}#timeline{padding:var(--section-padding)}#timeline .section-label{margin-bottom:16px}#timeline h2{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1.2;color:var(--color-text-primary);margin-bottom:56px;text-align:center}.timeline{position:relative;max-width:860px;margin:0 auto;padding:2rem 0}.timeline:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,transparent,var(--color-border-accent) 8%,var(--color-border-accent) 92%,transparent);transform:translate(-50%)}.timeline-item{display:flex;justify-content:flex-end;padding-right:calc(50% + 2.5rem);position:relative;margin-bottom:2.5rem}.timeline-item:nth-child(odd){justify-content:flex-start;padding-right:0;padding-left:calc(50% + 2.5rem)}.timeline-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius-card);padding:1.25rem 1.5rem;width:100%;max-width:380px;position:relative;box-shadow:var(--shadow-card);transition:box-shadow .3s ease,transform .3s ease}.timeline-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-2px)}.timeline-item:after{content:"";position:absolute;left:50%;top:1.5rem;width:12px;height:12px;background:var(--color-accent);border:2px solid var(--color-bg);border-radius:50%;transform:translate(-50%);z-index:1;box-shadow:0 0 0 2px var(--color-accent);transition:transform .2s ease}.timeline-item:hover:after{transform:translate(-50%) scale(1.3)}.timeline-date{font-family:var(--font-main);font-size:.82rem;color:var(--color-text-secondary);margin-bottom:.3rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.timeline-category{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-family:var(--font-main);padding:.15rem .55rem;border-radius:var(--border-radius-pill);border:1px solid var(--color-border-accent);color:var(--color-accent);margin-bottom:.55rem;font-weight:600}.timeline-card h3{font-family:var(--font-display);font-size:1.05rem;font-weight:700;color:var(--color-text-primary);margin-bottom:.2rem;line-height:1.3}.timeline-card .timeline-subtitle{font-family:var(--font-main);font-size:.82rem;font-weight:600;color:var(--color-accent);letter-spacing:.03em;margin-bottom:.55rem}.timeline-card p{font-family:var(--font-main);font-size:.95rem;font-weight:500;line-height:1.65;color:var(--color-text-secondary);margin-bottom:.75rem;text-align:justify}.timeline-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}.timeline-tag{font-family:var(--font-main);font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:var(--border-radius-pill);background:#1a5fe812;color:var(--color-accent);border:1px solid rgba(26,95,232,.18)}.timeline-links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}.timeline-link{font-family:var(--font-main);font-size:.8rem;font-weight:600;color:var(--color-accent);text-decoration:none;display:inline-flex;align-items:center;gap:.25rem;border:1px solid var(--color-border-accent);border-radius:var(--border-radius-pill);padding:.2rem .65rem;transition:background .2s ease}.timeline-link:hover{background:#1a5fe814}@media (max-width: 700px){.timeline:before{left:1rem;transform:none}.timeline-item,.timeline-item:nth-child(odd){justify-content:flex-start;padding-left:3rem;padding-right:0}.timeline-item:after{left:1rem;transform:none}.timeline-item:hover:after{transform:scale(1.3)}.timeline-card{max-width:100%}}#projects{padding:var(--section-padding)}#projects .section-label{margin-bottom:16px}#projects h2{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1.2;color:var(--color-text-primary);margin-bottom:48px}#projects-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-areas:"feat feat card2" "card3 card4 card5" "card6 card7 .";gap:20px}.project-card{background:var(--color-surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:var(--border-radius-card);padding:28px;border:1px solid var(--color-border);box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:14px;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease;cursor:pointer;transform-style:preserve-3d}.project-card:hover{border-color:var(--color-border-accent);box-shadow:var(--shadow-card-hover)}.project-featured{grid-area:feat;padding:36px;background:linear-gradient(135deg,#1a5fe80d,#4a8af408),var(--color-surface);position:relative;overflow:hidden}[data-theme=dark] .project-featured{background:linear-gradient(135deg,#1a5fe81a,#4a8af40d),var(--color-surface)}@property --border-angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}.project-featured:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:calc(var(--border-radius-card) + 1px);background:conic-gradient(from var(--border-angle),transparent 20%,#1a5fe8 40%,#4a8af4 60%,transparent 80%);animation:rotateBorder 4s linear infinite;z-index:-1}.project-featured:after{content:"";position:absolute;top:1px;right:1px;bottom:1px;left:1px;border-radius:calc(var(--border-radius-card) - 1px);background:var(--color-surface-solid);z-index:-1}[data-theme=dark] .project-featured:after{background:var(--color-surface-solid)}.featured-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-main);font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent);background:#1a5fe812;border:1px solid rgba(26,95,232,.2);padding:4px 12px;border-radius:var(--border-radius-pill);margin-bottom:4px;width:fit-content}.project-card[data-index="1"]{grid-area:card2}.project-card[data-index="2"]{grid-area:card3}.project-card[data-index="3"]{grid-area:card4}.project-card[data-index="4"]{grid-area:card5}.project-card[data-index="5"]{grid-area:card6}.project-card[data-index="6"]{grid-area:card7}.project-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.project-title{font-family:var(--font-display);font-size:1.2rem;font-weight:700;color:var(--color-text-primary);line-height:1.3}.project-featured .project-title{font-size:1.5rem}.project-link{color:var(--color-accent);font-size:1.15rem;line-height:1;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--color-border-accent);transition:transform .25s var(--ease-out),background .2s ease,color .2s ease;margin-top:2px}.project-link:hover{transform:rotate(45deg);background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.project-desc{font-family:var(--font-main);font-size:.97rem;font-weight:500;line-height:1.72;color:var(--color-text-secondary);flex:1;overflow:hidden;max-height:3.5em;transition:max-height .45s ease;text-align:justify}.project-card:hover .project-desc,.project-featured .project-desc{max-height:12em}.project-tags{display:flex;flex-wrap:wrap;gap:6px}.tag{font-family:var(--font-main);font-size:.75rem;font-weight:600;padding:4px 10px;border-radius:var(--border-radius-pill);background:#1a5fe812;color:var(--color-accent);border:1px solid rgba(26,95,232,.18);letter-spacing:.02em;transition:background .2s,border-color .2s}.project-card:hover .tag{background:#1a5fe81f;border-color:#1a5fe84d}.project-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}.project-link-pill{font-family:var(--font-main);font-size:.75rem;font-weight:600;color:var(--color-accent);text-decoration:none;border:1px solid var(--color-border-accent);border-radius:var(--border-radius-pill);padding:3px 10px;transition:background .2s ease;display:inline-flex;align-items:center;gap:4px}.project-link-pill:hover{background:#1a5fe814}#link-thumb-preview{position:fixed;width:220px;border-radius:10px;overflow:hidden;box-shadow:0 12px 40px #00000038;border:1px solid var(--color-border);opacity:0;pointer-events:none;transition:opacity .15s ease;z-index:9999;background:var(--color-surface-solid)}#link-thumb-preview.visible{opacity:1}#link-thumb-preview img{width:100%;height:auto;display:block}@media (max-width: 900px){#projects-grid{grid-template-columns:1fr 1fr;grid-template-areas:"feat feat" "card2 card3" "card4 card5" "card6 card7"}}@media (max-width: 640px){#projects{padding:80px 6vw}#projects-grid{grid-template-columns:1fr;grid-template-areas:"feat" "card2" "card3" "card4" "card5" "card6" "card7"}.project-desc{max-height:none}}#highlights{padding-top:max(60px,8vh);padding-bottom:max(60px,6vh);display:flex;flex-direction:column;justify-content:center;min-height:100vh;background:var(--color-bg);overflow:hidden}.hl-header{font-family:var(--font-display);font-size:clamp(2rem,3.5vw,3rem);font-weight:700;color:var(--color-text-primary);padding:0 10vw;margin-bottom:48px}.hl-viewport{position:relative;width:100%;overflow:hidden}.hl-viewport:before,.hl-viewport:after{content:"";position:absolute;top:0;bottom:0;width:18%;z-index:10;pointer-events:none}.hl-viewport:before{left:0;background:linear-gradient(to right,var(--color-bg) 0%,transparent 100%)}.hl-viewport:after{right:0;background:linear-gradient(to left,var(--color-bg) 0%,transparent 100%)}.hl-track{display:flex;gap:24px;will-change:transform}.hl-card{position:relative;flex:0 0 68vw;max-width:960px;aspect-ratio:16 / 10;overflow:hidden;border-radius:3px;opacity:.35;transform:scale(.97);transition:opacity .55s ease,transform .55s ease;cursor:pointer;-webkit-user-select:none;user-select:none}.hl-card.active{opacity:1;transform:scale(1);cursor:default}.hl-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-size:cover;background-position:center;transition:transform .6s ease}.hl-card.active .hl-bg{transform:scale(1.03)}.hl-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.45) 35%,rgba(0,0,0,.08) 65%,transparent 100%);pointer-events:none;z-index:1}.hl-overlay{position:absolute;bottom:0;left:0;padding:36px 44px;z-index:2}.hl-cat{display:block;font-family:var(--font-main);font-size:.72rem;font-weight:600;letter-spacing:.14em;color:#ffffffb8;margin-bottom:10px;text-transform:uppercase}.hl-title{font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3.5rem);font-weight:700;line-height:1.1;color:#fff;margin:0 0 10px}.hl-sub{font-family:var(--font-main);font-size:clamp(.85rem,1.4vw,1.05rem);font-weight:500;color:#c8a96e;margin-bottom:16px}.hl-desc{font-family:Courier New,Lucida Console,monospace;font-size:.9rem;font-weight:500;line-height:1.65;color:#ffffffeb;max-width:520px}.hl-dots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:32px}.hl-dot{width:8px;height:8px;border-radius:999px;background:var(--color-text-secondary);opacity:.3;border:none;padding:0;cursor:pointer;transition:width .35s cubic-bezier(.4,0,.2,1),opacity .35s ease,background .35s ease}.hl-dot.active{width:28px;opacity:1;background:var(--color-text-primary)}@media (max-width: 768px){#highlights{padding-top:70px;padding-bottom:80px}.hl-header{padding:0 6vw;margin-bottom:32px}.hl-card{flex:0 0 82vw}.hl-overlay{padding:24px 28px}.hl-desc{display:none}.hl-viewport:before,.hl-viewport:after{width:9%}}#skills{padding:max(60px,8vh) 10vw max(60px,6vh);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;overflow-y:auto}#skills .section-label{margin-bottom:16px}#skills h2{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;line-height:1.2;color:var(--color-text-primary);margin-bottom:40px;width:100%}#skills-cloud{display:flex;flex-wrap:wrap;gap:12px;align-items:center;width:100%}.skill-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-main);font-size:.95rem;font-weight:600;padding:10px 18px;color:var(--color-text-primary);background:var(--color-surface);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--border-radius-pill);box-shadow:var(--shadow-card);transition:border-color .2s ease,box-shadow .2s ease,transform .08s ease,color .2s ease;white-space:nowrap;cursor:default;transform-style:preserve-3d}.skill-tag:hover{border-color:var(--color-border-accent);box-shadow:var(--shadow-card-hover);color:var(--color-accent)}.skill-tag img,.skill-tag .skill-emoji{width:18px;height:18px;object-fit:contain;flex-shrink:0}[data-theme=dark] .skill-tag img.si{filter:invert(1)}#skills-legend{display:flex;gap:24px;margin-top:40px;flex-wrap:wrap;width:100%}.legend-item{display:flex;align-items:center;gap:8px;font-family:var(--font-main);font-size:.82rem;color:var(--color-text-secondary)}.legend-dot{width:8px;height:8px;border-radius:50%;background:var(--color-accent);flex-shrink:0}.legend-dot.proficient{opacity:.65}.legend-dot.familiar{opacity:.35}@media (max-width: 768px){#skills{padding:70px 6vw 80px}#skills-cloud{gap:9px}}#contact{padding:0 10vw;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%}#contact .section-label{margin-bottom:16px}#contact h2{font-family:var(--font-display);font-size:clamp(2.2rem,5vw,3.5rem);font-weight:700;line-height:1.2;color:var(--color-text-primary);margin-bottom:16px}#contact-sub{font-family:var(--font-main);font-size:clamp(1rem,2vw,1.2rem);color:var(--color-text-secondary);margin-bottom:52px;line-height:1.65;max-width:48ch;margin-left:auto;margin-right:auto}#contact-links{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-bottom:48px}.contact-item{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-main);font-size:1rem;font-weight:600;color:var(--color-text-secondary);background:var(--color-surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);padding:12px 24px;border-radius:var(--border-radius-pill);box-shadow:var(--shadow-card);transition:var(--transition-smooth)}.contact-item:hover{color:var(--color-accent);border-color:var(--color-border-accent);box-shadow:var(--shadow-card-hover);transform:translateY(-3px)}.contact-item svg,.contact-item img.si{width:18px;height:18px;flex-shrink:0;transition:transform .25s ease}.contact-item:hover svg,.contact-item:hover img.si{transform:scale(1.15)}[data-theme=dark] .contact-item img.si{filter:invert(1)}.contact-item--resume{color:var(--color-accent);border-color:var(--color-border-accent);background:var(--color-surface-solid);font-weight:600}.contact-item--resume:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}#footer-note{font-family:var(--font-main);font-size:.8rem;color:var(--color-text-secondary);opacity:.62;letter-spacing:.04em}@media (max-width: 768px){#contact{padding:0 6vw}#contact-links{gap:14px;margin-bottom:60px}}#airlock-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;pointer-events:none;overflow:hidden}#airlock-left,#airlock-right{position:absolute;top:0;width:50%;height:100%;background:var(--color-surface-solid);display:flex;align-items:center;will-change:transform}#airlock-left{left:0;transform:translate(-100%);justify-content:flex-end;padding-right:0}#airlock-right{right:0;transform:translate(100%);justify-content:flex-start;padding-left:0}#airlock-ya,#airlock-sh{font-family:var(--font-display, "Poppins", sans-serif);font-size:clamp(3rem,8vw,7rem);font-weight:400;color:var(--color-text-primary);line-height:1;display:block;opacity:0;transition:opacity .12s ease}#airlock-left.doors-closed #airlock-ya,#airlock-right.doors-closed #airlock-sh{opacity:1}#airlock-destination{position:absolute;top:50%;left:50%;transform:translate(-50%,3.8rem);font-family:var(--font-main, "DM Sans", sans-serif);font-size:clamp(.9rem,1.6vw,1.1rem);font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--color-text-secondary);opacity:0;white-space:nowrap;transition:opacity .12s ease;pointer-events:none}#airlock-overlay.doors-closed #airlock-destination{opacity:1}#airlock-overlay.active{pointer-events:all}html,body{overflow:hidden;height:100%}#sections-wrapper{position:relative;height:100vh;overflow:hidden}@media (max-width: 900px){#sections-wrapper{height:100dvh}}.section-nav-footer{display:flex;justify-content:center;padding:2.5rem 0 2rem}.section-nav-footer--abs{position:absolute;bottom:0;left:0;right:0;padding:2rem 0;pointer-events:none;opacity:0;transition:opacity .55s ease-out}.section-nav-footer--abs.active{opacity:1}.section-nav-footer--abs .section-next-btn{pointer-events:all}.section-next-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1.4rem;background:var(--color-surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--color-border-accent);border-radius:100px;color:var(--color-text-secondary);font-family:var(--font-main, "DM Sans", sans-serif);font-size:.75rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease;white-space:nowrap;box-shadow:0 2px 12px #00000014}.section-next-btn:hover{color:var(--color-accent);border-color:var(--color-accent);background:var(--color-surface-hover)}
