*
  {
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
  }
    body
    {
      background:#0f2027;
      color:#fff;
    }

    header
    {
      position:fixed;
      top:0;
      left:0;
      width:100%;
      background:#0f2027;
      display:flex;
      justify-content:space-between;
      align-items:center;
      padding:15px 40px;
      z-index:100;
    }
    header h2
    {
      color:#00e6e6;
    }
    nav a
    {color:#fff;
      margin:0 10px;
      text-decoration:none;
      transition:.3s;
    }
    nav a:hover
    {
      color:#00e6e6;
    }

    .hero
    {
      height:100vh;
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:center;
      text-align:center;
      background:linear-gradient(135deg,#0f2027,#203a43,#2c5364);
      padding:20px;
    }
    .hero-image
    {
      width:220px;
      height:220px;
      margin-bottom:20px;
    }
    .hero-image img
    {
      width:100%;
      height:100%;
      object-fit:cover;
      border-radius:50%;
      border:5px solid #fff;
      box-shadow:0 0 25px rgba(0,255,200,.6);
      transition:.4s;
    }
    .hero-image img:hover
    {
      transform:scale(1.05);
      box-shadow:0 0 35px rgba(0,255,255,.9);
    }
    .hero h1 span
    {
      color:#00e6e6;
    }
    .btn
    {
      display:inline-block;
      margin:10px;
      padding:12px 24px;
      background:#00e6e6;
      color:#000;
      font-weight:bold;
      border-radius:30px;
      text-decoration:none;
      transition:.3s;
    }
    .btn:hover
    {
      background:#00b3b3;
      color:#fff;
    }
    .btn-outline
    {
      background:transparent;
      border:2px solid #00e6e6;
      color:#00e6e6;
    
    }
    .btn-outline:hover
    {
      background:#00e6e6;
      color:#000;
    }
    .social-icons
    {
      margin-top:20px;
    }
    .social-icons a
    {
      color:#fff;
      margin:0 10px;
      font-size:22px;
      transition:.3s;
    }
    .social-icons a:hover
    {
      color:#00e6e6;
    }

    section
    {
      padding:80px 40px;
      text-align:center;
    }
    h2
    {
      font-size:2rem;
      margin-bottom:20px;
      color:#00e6e6;
    }

    /* Skills & Education */
    .toggle-buttons
    {
      margin-bottom:20px;
    }
    .toggle-buttons button
    {
      margin:0 10px;
      padding:10px 20px;
      border:none;
      cursor:pointer;
      background:#203a43;
      color:#fff;
      border-radius:20px;
      transition:.3s;
    }
    .toggle-buttons button.active,.toggle-buttons button:hover
    {
      background:#00e6e6;
      color:#000;
    }
    .skills-icons,.education-content
    {
      display:none;
      flex-wrap:wrap;
      justify-content:center;
      gap:30px;
      margin-top:20px;
    }
    .skills-icons.active,.education-content.active
    {
      display:flex;
    }
    .skills-icons i
    {
      font-size:40px;
      transition:.3s;
    }
    .skills-icons i:hover
    {color:#00e6e6;
      transform:scale(1.2);
    }
    .education-card
    {background:#203a43;
      padding:20px;
      border-radius:15px;
      width:250px;
      box-shadow:0 0 15px rgba(0,230,230,.3);}
    .education-card h3
    {color:#00e6e6;}

    /* Projects (Swiper Slider) */
    .swiper{width:100%;max-width:900px;padding:40px 0;}
    .swiper-slide img{width:100%;border-radius:20px;box-shadow:0 0 20px rgba(0,230,230,.3);}
    
    footer{background:#0f2027;padding:20px;text-align:center;color:#aaa;}