/* Smart Portfolio — Modern Professional Theme */
:root{
  --green:#27ae60;
  --blue:#1e90ff;
  --purple:#7d3cff;
  --white:#ffffff;
  --ink:#0b1021;
  --muted:#a9b3d2;
  --bg:#0f1533;
  --card:#11183d;
  --gradient-1:linear-gradient(135deg, rgba(39,174,96,.25), rgba(30,144,255,.25) 45%, rgba(125,60,255,.25));
  --gradient-2:linear-gradient(135deg, var(--green), var(--blue) 45%, var(--purple));
  --radius:20px;
  --shadow:0 10px 25px rgba(0,0,0,.25);
}

html,body{height:100%}
body{
  font-family:"Poppins",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(125,60,255,.15), transparent 50%),
    radial-gradient(1200px 800px at 110% 10%, rgba(30,144,255,.12), transparent 50%),
    radial-gradient(1200px 800px at 50% 120%, rgba(39,174,96,.10), transparent 55%),
    var(--bg);
  color:var(--white);
  scroll-behavior:smooth;
}

/* Navbar */
.navbar{backdrop-filter:saturate(180%) blur(10px); background:rgba(17,24,61,.7); border-bottom:1px solid rgba(255,255,255,.06)}
.navbar .nav-link{color:#e6ecff; opacity:.92}
.navbar .nav-link:hover,.nav-link.active{color:#fff}
.brand-dot{width:.85rem;height:.85rem;border-radius:50%;display:inline-block;background:var(--gradient-2);box-shadow:0 0 0 4px rgba(125,60,255,.15),0 8px 18px rgba(125,60,255,.35)}

/* Hero */
.hero{padding:7rem 0 5rem;position:relative}
.hero-card{background:var(--gradient-1);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);box-shadow:var(--shadow)}
.badge-gradient{background:var(--gradient-2);border:none;color:#fff}
.btn-gradient{background:var(--gradient-2);border:none;color:#fff;box-shadow:0 8px 20px rgba(30,144,255,.35)}
.btn-gradient:hover{filter:brightness(1.05)}
.grad-text{background:var(--gradient-2);-webkit-background-clip:text;background-clip:text;color:transparent}

.section-title{font-weight:700;letter-spacing:.4px}
.subtitle{color:var(--muted)}

/* Cards */
.glass-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.glass-card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(0,0,0,.35);border-color:rgba(255,255,255,.16)}

/* Skill bars */
.skill{height:10px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden}
.skill>span{display:block;height:100%;background:var(--gradient-2)}

/* Timeline */
.timeline{position:relative;padding-left:2rem;border-left:2px dashed rgba(255,255,255,.2)}
.timeline .dot{position:absolute;left:-9px;top:.4rem;width:14px;height:14px;border-radius:50%;background:var(--gradient-2);box-shadow:0 0 0 4px rgba(125,60,255,.18)}

/* Footer */
footer{border-top:1px solid rgba(255,255,255,.08)}

/* Reveal on Scroll */
.reveal{opacity:0;transform:translateY(16px);transition:all .6s ease}
.reveal.visible{opacity:1;transform:none}

/* Back To Top */
#backToTop{position:fixed;right:1rem;bottom:1rem;z-index:1031;display:none}

/* Avatars */
.avatar{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid rgba(255,255,255,.18)}

/* Links */
a.link-underline{text-decoration:none;border-bottom:1px dashed rgba(255,255,255,.35)}
a.link-underline:hover{border-bottom-style:solid}

/* Forms */
.form-control,.form-select{background:#0d1330;border-color:#24306f;color:#eaf0ff}
.form-control:focus,.form-select:focus{border-color:#6a8fff;box-shadow:0 0 0 .25rem rgba(106,143,255,.15)}

/* Responsive */
@media (max-width: 991.98px){
  .hero{padding-top:6rem}
}
