*{margin:0;padding:0;box-sizing:border-box}:root{--bg-color:#0f172a;--text-primary:#e2e8f0;--text-secondary:#94a3b8;--accent-color:#5eead4;--accent-hover:#7dd3c0;--card-bg:#1e293b}body{font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(45deg,var(--bg-color),#1a2b4a);color:var(--text-secondary);line-height:1.6;overflow-x:hidden}.container{max-width:1400px;margin:0 auto;padding:0 50px}.grid-layout{display:grid;grid-template-columns:1fr 1fr;gap:100px;min-height:100vh;padding:100px 0}.left-column{position:sticky;top:100px;height:fit-content}@media(max-width:1024px){.grid-layout{grid-template-columns:1fr;gap:50px;padding:50px 0}.left-column{position:relative;top:0;height:auto;margin-bottom:40px}.container{padding:0 25px}section{margin-bottom:60px;scroll-margin-top:60px}h1{font-size:2.5rem}}h1{font-size:3rem;font-weight:700;color:var(--text-primary);margin-bottom:10px;letter-spacing:-.02em}h2{font-size:1.3rem;font-weight:500;color:var(--text-primary);margin-bottom:20px}.tagline{font-size:1.1rem;color:var(--text-secondary);margin-bottom:50px;max-width:300px}.nav-menu{list-style:none;margin-bottom:50px}.nav-menu li{margin-bottom:15px}.nav-menu a{text-decoration:none;color:var(--text-secondary);text-transform:uppercase;font-size:.8rem;font-weight:600;letter-spacing:.1em;display:flex;align-items:center;transition:all .3s ease}.nav-menu a::before{content:'';display:inline-block;width:30px;height:1px;background:var(--text-secondary);margin-right:15px;transition:all .3s ease}.nav-menu a:hover{color:var(--text-primary)}.nav-menu a:hover::before{width:60px;background:var(--text-primary)}.social-links{display:flex;gap:20px}.social-links a{color:var(--text-secondary);font-size:1.5rem;transition:all .3s ease}.social-links a:hover{color:var(--accent-color);transform:translateY(-3px)}.right-column{padding-bottom:100px}section{margin-bottom:100px;scroll-margin-top:100px}.section-heading{top:0;padding:20px 0;margin-bottom:30px;z-index:10;text-transform:uppercase;font-size:.9rem;letter-spacing:.1em;font-weight:700;color:var(--text-primary)}.about-text{color:var(--text-secondary);margin-bottom:20px;font-size:1rem}.about-text a{color:var(--accent-color);text-decoration:none;transition:color .3s ease}.about-text a:hover{color:var(--accent-hover)}.experience-item,.project-item{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:20px;border-radius:8px;margin-bottom:30px;transition:all .3s ease;cursor:pointer}.experience-item:hover,.project-item:hover{background-color:rgba(148,163,184,5%);box-shadow:0 4px 20px rgba(0,0,0,.1)}.date{font-size:.8rem;text-transform:uppercase;color:var(--text-secondary);font-weight:600;letter-spacing:.05em;padding-top:5px}.experience-content h3,.project-content h3{color:var(--text-primary);font-size:1.1rem;margin-bottom:10px;transition:color .3s ease}.experience-item:hover h3,.project-item:hover h3{color:var(--accent-color)}.company{color:var(--text-secondary);font-size:.9rem;margin-bottom:15px}.description{color:var(--text-secondary);margin-bottom:15px;font-size:.95rem}.tags{display:flex;flex-wrap:wrap;margin-top:10px;gap:10px}.tag{background-color:rgba(94,234,212,.1);color:var(--accent-color);padding:5px 12px;border-radius:20px;font-size:.8rem;font-weight:500}.project-item{grid-template-columns:1fr}.project-image{width:100%;height:200px;background:var(--card-bg);border-radius:8px;margin-bottom:15px;overflow:hidden}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.project-item:hover .project-image img{transform:scale(1.05)}.view-archive{color:var(--text-primary);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;transition:all .3s ease}.view-archive:hover{.nav-menu a.active { color: var(--text-primary); } .nav-menu a.active::before { width: 60px; background: var(--text-primary); } @keyframes fadeInOut { 0%, 100% { opacity: 0; } 50% { opacity: 0.1; } } body::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: radial-gradient(circle at 0px 0px, rgba(255,255,255,0) 14px, #5eead4 15px, rgba(255,255,255,0) 16px), radial-gradient(circle at 25px 43px, rgba(255,255,255,0) 14px, #5eead4 15px, rgba(255,255,255,0) 16px); background-size: 50px 86.6px; opacity: 0; animation: fadeInOut 15s infinite; z-index: -1; }}