:root{--color-bg-primary: #0a0a0f;--color-bg-secondary: #12121a;--color-bg-tertiary: #1a1a27;--color-bg-quaternary: rgba(255, 255, 255, .1);--color-text-primary: #ffffff;--color-text-secondary: #b4b4c8;--color-text-muted: #6e6e8f;--color-accent-purple: #a855f7;--color-light-purple: #c17fff;--color-accent-blue: #3b82f6;--color-accent-cyan: #06b6d4;--color-accent-pink: #ec4899;--color-accent-orange: #f97316;--gradient-primary: linear-gradient(135deg, #a855f7 0%, #b5a2c8 100%);--gradient-secondary: linear-gradient(135deg, #ec4899 0%, #f97316 100%);--gradient-accent: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--spacing-2xl: 4rem;--spacing-3xl: 6rem;--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--font-size-5xl: 3rem;--font-size-6xl: 4rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .6);--shadow-glow: 0 0 20px rgba(168, 85, 247, .3);--blur-sm: 8px;--blur-md: 16px;--blur-lg: 24px;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-primary);background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;overflow-x:hidden}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg)}.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-background{position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 50% 50%,#1a1a27,#0a0a0f)}.gradient-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4;animation:float 20s ease-in-out infinite}.orb-1{width:500px;height:500px;background:var(--gradient-primary);top:-10%;right:-10%;animation-delay:0s}.orb-2{width:400px;height:400px;background:var(--gradient-secondary);bottom:-10%;left:-10%;animation-delay:-7s}.orb-3{width:350px;height:350px;background:var(--gradient-accent);top:50%;left:50%;transform:translate(-50%,-50%);animation-delay:-14s}@keyframes float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-30px) scale(1.1)}66%{transform:translate(-20px,20px) scale(.9)}}.hero-content{position:relative;z-index:1;text-align:center;padding:var(--spacing-3xl) 0}.hero-title{font-family:var(--font-display);font-size:clamp(2.5rem,8vw,5rem);font-weight:800;line-height:1.1;margin-bottom:var(--spacing-md)}.greeting{display:block;font-size:clamp(1.5rem,4vw,2.5rem);font-weight:600;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--spacing-sm)}.name{display:block;background:linear-gradient(135deg,#fff,#b4b4c8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-tagline{font-size:clamp(1.25rem,3vw,1.75rem);font-weight:600;color:var(--color-text-secondary);margin-bottom:var(--spacing-lg)}.hero-description{font-size:var(--font-size-lg);color:var(--color-text-muted);max-width:600px;margin:0 auto var(--spacing-xl);line-height:1.8}.hero-cta{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.btn{padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-xl);font-size:var(--font-size-lg);font-weight:600;text-decoration:none;transition:all var(--transition-base);cursor:pointer;border:none;display:inline-flex;align-items:center;gap:var(--spacing-xs)}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 30px #a855f780}.btn-secondary{background:#ffffff0d;color:#fff;border:2px solid var(--color-bg-quaternary);-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm))}.btn-secondary:hover{background:var(--color-bg-quaternary);border-color:#fff3;transform:translateY(-2px)}.scroll-indicator{position:absolute;z-index:1;bottom:var(--spacing-xl);left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);color:var(--color-text-muted);font-size:var(--font-size-sm);animation:bounce 2s ease-in-out infinite}.scroll-arrow{width:24px;height:24px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}@keyframes bounce{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(10px)}}.projects{padding:var(--spacing-3xl) 0;background:var(--color-bg-primary);position:relative}.section-header{text-align:center;margin-bottom:var(--spacing-3xl)}.section-title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.5rem);font-weight:700;margin-bottom:var(--spacing-md);background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.section-subtitle{font-size:var(--font-size-lg);color:var(--color-text-muted);max-width:600px;margin:0 auto}.projects-grid{display:grid;gap:var(--spacing-3xl);max-width:900px;margin:0 auto}.project-card{background:#ffffff08;border:1px solid rgba(255,255,255,.05);border-radius:var(--radius-2xl);overflow:hidden;transition:all var(--transition-base);-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm));position:relative}.project-badge{position:absolute;top:var(--spacing-sm);left:var(--spacing-sm);z-index:10;background:var(--gradient-primary);color:#fff;font-size:var(--font-size-xs);font-weight:600;padding:.25rem .75rem;border-radius:9999px;box-shadow:var(--shadow-md);pointer-events:none}.project-card:hover{border-color:#a855f74d;box-shadow:var(--shadow-glow)}.project-card.expanded{background:#ffffff0d;border-color:#a855f780}.project-thumbnail{position:relative;width:100%;height:250px;overflow:hidden;cursor:pointer}.project-thumbnail img{width:100%;height:100%;background:linear-gradient(45deg,transparent,#6e6e8f);object-fit:cover;object-position:top center;transition:transform var(--transition-slow)}.project-card:hover .project-thumbnail img{transform:scale(1.05)}.project-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,15,.9) 0%,transparent 50%);display:flex;align-items:flex-end;justify-content:center;padding:var(--spacing-lg);opacity:0;transition:opacity var(--transition-base)}.project-card:hover .project-overlay{opacity:1}.expand-hint{color:#fff;font-size:var(--font-size-sm);font-weight:600;padding:var(--spacing-xs) var(--spacing-md);background:#a855f7cc;border-radius:var(--radius-md)}.project-content{padding:var(--spacing-lg)}.project-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.project-title{font-family:var(--font-display);font-size:var(--font-size-2xl);font-weight:700;color:var(--color-text-primary);flex:1}.expand-btn{background:#ffffff0d;border:1px solid var(--color-bg-quaternary);border-radius:var(--radius-md);width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-base);flex-shrink:0}.expand-btn:hover{background:var(--color-bg-quaternary);border-color:#a855f780}.expand-icon{width:20px;height:20px;transition:transform var(--transition-base)}.project-card.expanded .expand-icon{transform:rotate(180deg)}.project-short-desc{color:var(--color-text-secondary);font-size:var(--font-size-base);margin-bottom:var(--spacing-md);line-height:1.6}.project-links{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.project-link{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:#ffffff0d;border:1px solid var(--color-bg-quaternary);border-radius:var(--radius-md);color:var(--color-text-primary);text-decoration:none;font-size:var(--font-size-sm);font-weight:500;transition:all var(--transition-base)}.project-link:hover{background:var(--gradient-primary);border-color:transparent;transform:translateY(-2px)}.project-link svg{width:16px;height:16px}.project-expanded{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows var(--transition-slow)}.project-expanded-content{min-height:0;overflow:hidden}.project-card.expanded .project-expanded{grid-template-rows:1fr}.project-full-image{margin-top:var(--spacing-lg);border-radius:var(--radius-lg);overflow:hidden}.project-full-image img{width:100%;height:auto;display:block}.project-details{margin-top:var(--spacing-lg)}.project-details h4{font-family:var(--font-display);font-size:var(--font-size-xl);font-weight:600;margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.project-long-desc{white-space:pre-wrap;color:var(--color-text-secondary);line-height:1.8;margin-bottom:var(--spacing-lg)}.project-tech{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.tech-tag{padding:var(--spacing-xs) var(--spacing-md);background:#a855f71a;border:1px solid rgba(168,85,247,.3);border-radius:var(--radius-md);color:var(--color-light-purple);font-size:var(--font-size-sm);font-weight:500}.website-link{background:#a855f71a;border-color:#a855f74d}.website-link:hover{background:var(--gradient-primary);border-color:transparent}.contact{padding:var(--spacing-3xl) 0;background:var(--color-bg-secondary)}.contact-content{text-align:center;max-width:700px;margin:0 auto}.contact-title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3rem);font-weight:700;margin-bottom:var(--spacing-lg);background:var(--gradient-secondary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.contact-description{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);line-height:1.8}.contact-links{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.contact-link{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);background:#ffffff0d;border:1px solid var(--color-bg-quaternary);border-radius:var(--radius-xl);color:var(--color-text-primary);text-decoration:none;font-size:var(--font-size-base);font-weight:500;transition:all var(--transition-base);-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm))}.contact-link:hover{background:var(--color-bg-quaternary);border-color:#ec489980;transform:translateY(-2px);box-shadow:0 0 20px #ec48994d}.contact-link svg{width:20px;height:20px}.footer{padding:var(--spacing-xl) 0;background:var(--color-bg-primary);text-align:center;color:var(--color-text-muted);font-size:var(--font-size-sm);border-top:1px solid rgba(255,255,255,.05)}@media(max-width:768px){.hero-description{color:var(--color-text-secondary)}.project-overlay{opacity:1}.hero-cta{flex-direction:column;align-items:stretch}.btn{justify-content:center}.project-thumbnail{height:200px}.project-header{flex-direction:column;align-items:flex-start}.expand-btn{align-self:flex-end}.contact-links{flex-direction:column;align-items:stretch}.scroll-indicator{display:none}}@media(max-width:480px){.container{padding:0 var(--spacing-md)}.projects{padding:var(--spacing-2xl) 0}.section-header{margin-bottom:var(--spacing-2xl)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}a:focus-visible,button:focus-visible{outline:2px solid var(--color-accent-purple);outline-offset:2px}.details{padding:var(--spacing-3xl) 0;background:var(--color-bg-secondary);border-top:1px solid rgba(255,255,255,.05)}.details-content{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:var(--spacing-2xl)}.details-section{display:flex;flex-direction:column;gap:var(--spacing-md)}.details-text{color:var(--color-text-secondary);line-height:1.8;font-size:var(--font-size-lg)}.skills-list{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:var(--spacing-sm);list-style:none;padding:0}.skill-tag{padding:var(--spacing-xs) var(--spacing-md);background:var(--color-bg-quaternary);color:var(--color-text-secondary);font-size:var(--font-size-sm);border-radius:9999px;border:1px solid rgba(255,255,255,.05);transition:all var(--transition-base)}