:root{
      --primary-900: #062041;
      --primary-700: #0b3b6a;
      --accent: #00c6ff;
    }

    /* ---------- ABOUT SECTION ---------- */
    .about-section{
      padding:80px 0;
      background:#fff;
      position:relative;
      overflow:hidden;
    }
    .about-section::before{
      content:"";
      position:absolute;
      width:200px; height:200px;
      background:radial-gradient(circle, rgba(0,198,255,0.15) 0%, transparent 70%);
      top:10%; left:-80px;
      animation: float 6s ease-in-out infinite;
    }
    .about-section::after{
      content:"";
      position:absolute;
      width:250px; height:250px;
      background:radial-gradient(circle, rgba(11,59,106,0.12) 0%, transparent 70%);
      bottom:15%; right:-100px;
      animation: float 8s ease-in-out infinite reverse;
    }
    @keyframes float {
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-20px)}
    }

    .about-section h1{font-weight:700; font-size:38px; margin-bottom:20px; color:var(--primary-900)}
    .about-section p{font-size:16px; line-height:1.7; color:#555}

    .about-feature{
      background:#f7fbff;
      border:1px solid #e3edf7;
      border-radius:14px;
      padding:30px;
      transition:all .4s ease;
      height:100%;
      transform:translateY(0);
    }
    .about-feature:hover{
      transform:translateY(-10px) scale(1.02);
      box-shadow:0 15px 40px rgba(0,0,0,0.15);
      background:#ffffff;
    }
    .about-feature .icon{
      font-size:42px;
      color:var(--accent);
      margin-bottom:15px;
      display:inline-block;
      transition: transform .4s;
    }
    .about-feature:hover .icon{
      transform:rotate(10deg) scale(1.1);
    }
    .about-feature h5{
      font-weight:600;
      margin-bottom:10px;
      color:var(--primary-700);
    }
    .about-feature p{font-size:15px; color:#444}

    .picc {
      position: relative;
    }
    .about-section .picc::before {
        position: absolute;
        content: '';
        width: 90%;
        height: 100%;
        border: 2px solid #0097da;
        top: -30px;
        right: 20px;
        /* left: -30px; */
        border-radius: 20px;
    }

    .about-section .picc img {
        border-radius: 15px;
        position: relative;
        width: 90%;
        z-index: 2;
        box-shadow: rgba(0, 0, 0, 0.45) 0px 5px 15px;
    }