/* Legendary Cyberpunk style.css */
:root{
  --bg-dark:#04040a;
  --neon-a:#00f5ff;
  --neon-b:#ff0078;
  --glass: rgba(255,255,255,0.03);
  --card:#0b0f17;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Vazirmatn',system-ui,-apple-system,"Segoe UI",Roboto,Arial;
  background:linear-gradient(180deg,#030313 0%, #061026 100%);
  color:#e6eef8;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* particles bg */
.particles-bg{position:fixed;inset:0;z-index:-4}

/* neon overlay */
.neon-overlay{position:fixed;inset:0;z-index:-3;background:radial-gradient(circle at 20% 20%, rgba(0,245,255,0.06), transparent 6%), radial-gradient(circle at 85% 85%, rgba(255,0,120,0.04), transparent 10%);filter:blur(60px);pointer-events:none}

/* container */
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* nav */
.nav{position:fixed;top:14px;left:0;right:0;z-index:80}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;border-radius:14px;background:linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));backdrop-filter:blur(6px);margin:0 20px;box-shadow:0 12px 40px rgba(2,6,23,0.6)}
.brand{font-weight:800;color:var(--neon-a);letter-spacing:1px}
.nav-links a{color:rgba(255,255,255,0.85);margin-left:18px;text-decoration:none;padding:6px 10px;border-radius:8px;transition:all .18s}
.nav-links a:hover{transform:translateY(-4px);background:rgba(255,255,255,0.02)}

/* intro cinematic */
.intro{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg, rgba(2,6,23,1), rgba(2,6,23,0.96));z-index:200}
.intro-inner{text-align:center;color:var(--neon-a);animation:introAnim 2s ease forwards}
.intro-title{font-size:3rem;letter-spacing:8px;margin:0;color:transparent;background:linear-gradient(90deg,var(--neon-a),var(--neon-b));-webkit-background-clip:text;background-clip:text;text-shadow:0 0 40px rgba(0,245,255,0.12)}
.intro-sub{color:rgba(255,255,255,0.6);margin-top:8px}
@keyframes introAnim{0%{opacity:0;transform:translateY(20px)}80%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-40px);visibility:hidden}}

/* hero */
.hero{padding:150px 0 80px;position:relative;z-index:20}
.hero-inner{display:flex;gap:36px;align-items:center}
.hero-left{flex:1}
.neon-title{font-size:2.2rem;margin:0;color:transparent;background:linear-gradient(90deg,var(--neon-a),var(--neon-b));-webkit-background-clip:text;background-clip:text;font-weight:800;text-shadow:0 0 20px rgba(0,245,255,0.06)}
.typed-wrap{font-size:1.1rem;color:rgba(255,255,255,0.9);margin-top:10px;min-height:30px}
.lead{color:rgba(255,255,255,0.75);max-width:620px;margin-top:12px}

/* profile */
.profile-frame{position:relative;width:230px;height:230px;border-radius:999px;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);background:linear-gradient(135deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));box-shadow:0 20px 60px rgba(2,6,23,0.7)}
.profile-img{width:180px;height:180px;border-radius:999px;object-fit:cover;border:6px solid rgba(0,0,0,0.25)}

/* glow ring */
.glow-ring{position:absolute;inset:0;border-radius:999px;box-shadow:0 0 120px 14px rgba(0,245,255,0.05);pointer-events:none;mix-blend-mode:screen}

/* buttons */
.btn{display:inline-block;padding:12px 18px;border-radius:12px;background:linear-gradient(90deg,var(--neon-a),var(--neon-b));color:#051025;text-decoration:none;font-weight:700;margin-right:8px;box-shadow:0 12px 40px rgba(124,58,237,0.08);transition:transform .18s,filter .18s}
.btn:hover{transform:translateY(-6px);filter:brightness(1.06)}
.btn-outline{background:transparent;border:1px solid rgba(255,255,255,0.04);color:rgba(255,255,255,0.9)}

/* sections */
.section{padding:80px 0}
.section h2{text-align:center;margin-bottom:24px;color:var(--neon-a)}

/* split */
.split{display:flex;gap:20px}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:18px;border-radius:12px;color:rgba(255,255,255,0.95);box-shadow:0 18px 50px rgba(2,6,23,0.7)}

/* carousel */
.carousel{position:relative;overflow:visible}
.carousel-track{display:flex;gap:18px;transform:translateX(0);transition:transform .6s cubic-bezier(.2,.9,.2,1);padding:20px 0}
.carousel-item{min-width:320px;border-radius:12px;overflow:hidden;position:relative;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));box-shadow:0 20px 60px rgba(2,6,23,0.7)}
.carousel-item img{width:100%;height:260px;object-fit:cover;display:block;transition:transform .6s}
.item-meta{position:absolute;left:18px;bottom:18px;color:#fff}

/* carousel buttons */
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:transparent;border:0;color:var(--neon-a);font-size:40px;cursor:pointer;z-index:40;padding:6px 12px}
.carousel-btn.prev{left:-10px}
.carousel-btn.next{right:-10px}

/* contact */
.contact-card form input, .contact-card form textarea{width:100%;background:transparent;border:1px solid rgba(255,255,255,0.06);padding:12px;border-radius:8px;color:var(--neon-a);outline:none}
.contact-card form button{margin-top:8px}

/* modal */
.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:linear-gradient(rgba(2,6,23,0.8),rgba(2,6,23,0.95));z-index:120}
.modal-content{background:#fff;padding:18px;border-radius:10px;max-width:1000px;width:95%;color:#051025;position:relative;box-shadow:0 40px 120px rgba(0,0,0,0.8)}
.modal img{width:100%;height:auto;border-radius:6px}
.modal-close{position:absolute;top:8px;left:10px;background:transparent;border:0;font-size:28px;cursor:pointer}

/* form message */
.form-msg{margin-top:8px;color:var(--neon-b)}

/* responsive */
@media(max-width:880px){
  .hero-inner{flex-direction:column-reverse;padding:40px 0}
  .profile-frame{width:160px;height:160px}
  .carousel-item{min-width:260px}
  .split{flex-direction:column}
  .nav-inner{margin:0 10px}
}