*{margin:0;padding:0;box-sizing:border-box}
:root{--terminal-green:#ddd;--terminal-bg:#0d0d0d;--terminal-dim:#12191e;--terminal-text:#e0e0e0; --terminal-border: #dddddd47; }
body{background:var(--terminal-bg);color:var(--terminal-text);font-family:'Courier New',monospace;line-height:1.6;overflow-x:hidden}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.terminal-header{border-bottom:1px solid var(--terminal-green);padding:20px 0;margin-bottom:40px}
.terminal-nav{display:flex;gap:30px;list-style:none}
.terminal-nav a{color:var(--terminal-green);text-decoration:none;transition:opacity 0.3s}
.terminal-nav a:hover{opacity:0.7}
.hero{min-height:80vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:60px 20px}
.hero h1{font-size:3rem;color:var(--terminal-green);margin-bottom:20px;animation:slide-up 1s 0.5s both}
.hero p{font-size:1.2rem;margin-bottom:30px;animation:fade-in 1s 1s both}
.hero .command{background:var(--terminal-dim);padding:20px;border-radius:5px;margin:30px 0;text-align:left;overflow-x:auto;animation:slide-up 1s 1.5s both}
.hero .command code{color:var(--terminal-green)}
.hero .btn{display:inline-block;padding: 10px 20px;background:#143553;border:1px solid rgba(255, 255, 255, 0.1);color:var(--terminal-green);text-decoration:none;margin:10px;transition:all 0.5s;cursor:pointer}
.hero .btn:hover{background:#19446b;}
.hero .btn.trans{ background: rgba(255, 255, 255, 0.02); }
.hero .btn.trans:hover{background: rgba(255, 255, 255, 0.05);}
.scroll-indicator{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);color:var(--terminal-green);animation:bounce 2s infinite}
.section{padding:80px 0;opacity:0;transform:translateY(50px);transition:all 0.8s 0.2s}
.section.visible{opacity:1;transform:translateY(0)}
.section h2{color:var(--terminal-green);font-size:2rem;margin-bottom:40px;border-bottom:1px solid var(--terminal-border);padding-bottom:20px}
.terminal-block{background:var(--terminal-dim);padding:25px;border-radius:5px;margin:20px 0;border-left:3px solid var(--terminal-green)}
.terminal-block code{color:var(--terminal-green)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px;margin:40px 0}
.stat-item{text-align:center;padding:30px;background:var(--terminal-dim);border-radius:5px}
.stat-item .number{font-size:3rem;color:var(--terminal-green);display:block}
.stat-item .label{font-size:1rem;margin-top:10px}
.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}
.project-card{background:var(--terminal-dim);padding:0;border-radius:10px;border:1px solid var(--terminal-dim);transition:all 0.3s}
.project-card h3{color:var(--terminal-green);margin-bottom:15px; font-size: 20px;}
.project-card p{margin-bottom:15px;font-size:12px}
.project-card .tags{display:flex;flex-wrap:wrap;gap:10px}
.project-card .tag{background:var(--terminal-bg);padding:5px 10px;border-radius:3px;font-size:0.8rem;color:var(--terminal-green)}
.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}
.skill-category{background:var(--terminal-dim);padding:30px;border-radius:5px}
.skill-category h3{color:var(--terminal-green);margin-bottom:20px}
.skill-category ul{list-style:none}
.skill-category li{padding:10px 0;border-bottom:1px solid var(--terminal-border)}
.skill-category li:before{content:'$ ';color:var(--terminal-green)}
.experience-item{background:var(--terminal-dim);padding:30px;border-radius:5px;margin:20px 0;border-left:3px solid var(--terminal-green)}
.experience-item h3{color:var(--terminal-green);margin-bottom:10px}
.experience-item .company{color:var(--terminal-green);font-size:0.9rem;margin-bottom:15px}
.experience-item .date{color:#666;font-size:0.8rem;margin-bottom:15px}
.contact-section{text-align:center;padding:100px 0}
.contact-section .btn{margin:10px}
.contact-links{display:flex;justify-content:center;gap:30px;margin-top:30px}
.contact-links a{color:var(--terminal-green);text-decoration:none;font-size:1.2rem;transition:opacity 0.3s}
.contact-links a:hover{opacity:0.7}
.footer{border-top:1px solid var(--terminal-dim);padding:30px 0;text-align:center;color:#666; background: var(--terminal-dim); }
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes slide-up{from{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-10px)}}


@media(max-width:768px){.hero h1{font-size:2rem}.terminal-nav{flex-direction:column;gap:15px}.stats{grid-template-columns:1fr}}
