:root{--bg-primary:#0e1e3f;--bg-secondary:#121a2b;--bg-card:#ffffff0f;--border-color:#ffffff1f;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--accent:#38bdf8;--accent-hover:#0ea5e9;--max-width:1100px;--shadow-soft:0 10px 30px #00000040}*{box-sizing:border-box}html,body,#root{scroll-behavior:smooth;min-height:100%;margin:0;padding:0}body{color:var(--text-primary);background:radial-gradient(circle at 0 0,#38bdf824,#0000 25%),linear-gradient(#0b1220 0%,#0f172a 100%);font-family:Inter,Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}.app-shell{flex-direction:column;min-height:100vh;display:flex}.main-content{flex:1}.container{width:min(100% - 2rem, var(--max-width));margin:0 auto}.navbar{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0a0a0fbf;border-bottom:1px solid #ffffff14;position:sticky;top:0}.navbar-container{justify-content:space-between;align-items:center;min-height:76px;display:flex}.brand{letter-spacing:.04em;font-size:1.35rem;font-weight:700}.nav-links{align-items:center;gap:1.5rem;display:flex}.nav-link{color:var(--text-secondary);font-weight:500;transition:color .2s}.nav-link:hover{color:var(--text-primary)}.active-link{color:var(--accent)}.nav-logo{color:var(--text-primary);align-items:center;gap:.75rem;font-size:1.1rem;font-weight:700;text-decoration:none;display:flex}.nav-logo-img{object-fit:contain;width:38px;height:38px}.hero-section{padding:5rem 0 4rem}.hero-container{grid-template-columns:1.3fr .9fr;align-items:start;gap:2.5rem;display:grid}.eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin-bottom:1rem;font-weight:700}.hero-text h1{max-width:700px;margin:0 0 1rem;font-size:clamp(2.2rem,4.5vw,4rem);line-height:1.08}.accent-text{color:var(--accent)}.no-wrap{white-space:nowrap}.hero-description{color:var(--text-secondary);max-width:680px;margin-bottom:2rem;font-size:1.08rem;line-height:1.8}.hero-buttons{flex-wrap:wrap;gap:1rem;display:flex}.hero-panel{justify-content:center;align-self:start;margin-top:100px;display:flex}.hero-card{background:var(--bg-card);border:1px solid var(--border-color);width:100%;max-width:420px;box-shadow:var(--shadow-soft);border-radius:22px;padding:2rem}.hero-card h2{margin-top:0;margin-bottom:1rem;font-size:1.35rem}.hero-card ul{color:var(--text-secondary);margin:0;padding-left:1.15rem;line-height:1.9}.btn{border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:.9rem 1.3rem;font-weight:600;transition:transform .2s,background-color .2s,border-color .2s,color .2s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--accent);color:#001018}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary,.btn-outline{border-color:var(--border-color);color:var(--text-primary);background:0 0}.btn-secondary:hover,.btn-outline:hover{border-color:var(--accent);color:var(--accent)}.btn-code{color:#8b5cf6;background:0 0;border-color:#8b5cf666}.btn-code:hover{color:#8b5cf6;background:#8b5cf61a;border-color:#8b5cf6}.btn-video{color:#b91010e1;background:0 0;border-color:#b91010cb}.btn-video:hover{color:#b91010e1;background:#b9101041;border-color:#b91010e1}.page-section{padding:4rem 0}.page-container h1{margin-bottom:1rem;font-size:clamp(2rem,4vw,3rem)}.section-label{color:var(--accent);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.75rem;font-weight:700}.section-intro{color:var(--text-secondary);max-width:1000px;margin-bottom:2rem;line-height:1.8}.content-card{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-soft);border-radius:22px;padding:2rem}.content-card p{color:var(--text-secondary);margin-top:0;margin-bottom:1.25rem;line-height:1.85}.content-card p:last-child{margin-bottom:0}.content-card h2{margin-top:0;margin-bottom:.75rem}.projects-grid{scroll-behavior:smooth;gap:1.5rem;margin-top:2rem;padding-bottom:1rem;display:flex;overflow:auto hidden}.projects-grid::-webkit-scrollbar{height:10px}.projects-grid::-webkit-scrollbar-track{background:#ffffff14;border-radius:999px}.projects-grid::-webkit-scrollbar-thumb{background:#38bdf88c;border-radius:999px}.projects-grid::-webkit-scrollbar-thumb:hover{background:#38bdf8cc}.project-card{background:var(--bg-card);border:1px solid var(--border-color);box-shadow:var(--shadow-soft);border-radius:22px;flex-direction:column;flex:none;min-width:360px;max-width:360px;padding:1.6rem;display:flex}.project-card h3{margin:0 0 .35rem;font-size:1.25rem}.project-status{color:var(--accent);margin:0 0 1rem;font-size:.95rem}.project-description{color:var(--text-secondary);flex-grow:1;margin-bottom:1.2rem;line-height:1.75}.tech-stack{flex-wrap:wrap;gap:.6rem;margin-bottom:1.3rem;display:flex}.tech-badge{color:#dff7ff;background:#38bdf81f;border:1px solid #38bdf838;border-radius:999px;padding:.45rem .75rem;font-size:.9rem}.project-actions{flex-wrap:wrap;gap:.85rem;margin-top:auto;display:flex}.tech-icons{gap:.75rem;margin-bottom:1.2rem;display:flex}.tech-icon{color:var(--text-secondary);cursor:pointer;font-size:1.4rem;transition:transform .2s,color .2s}.tech-icon:hover{color:var(--accent);transform:translateY(-3px)}.contact-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-top:2rem;display:grid}.contact-grid a{color:var(--accent);word-break:break-word}.footer{border-top:1px solid var(--border-color);background:#0a0a0fbf;margin-top:3rem}.footer-container{justify-content:space-between;align-items:center;gap:1rem;min-height:88px;display:flex}.footer p{color:var(--text-secondary);margin:0}.footer-links{flex-wrap:wrap;gap:1.2rem;display:flex}.footer-links a{color:var(--text-secondary)}.footer-links a:hover{color:var(--accent)}@media (width<=900px){.hero-container{grid-template-columns:1fr}.hero-section{padding-top:3.5rem}.hero-panel{justify-content:flex-start;margin-top:1.5rem}.hero-card{max-width:100%}}@media (width<=700px){.navbar-container{flex-direction:column;justify-content:center;gap:.85rem;padding:1rem 0}.nav-links{flex-wrap:wrap;justify-content:center;gap:1rem}.hero-text h1{font-size:2.4rem}.footer-container{text-align:center;flex-direction:column;justify-content:center;padding:1rem 0}}html{scroll-behavior:smooth}
