* {

   margin: 0;

   padding: 0;

   box-sizing: border-box;

 }

.mission-vission-main-sunita-main{

 margin: 30px 0px;

}

 .mission-vission-main-sunita {

   display: flex;

   justify-content: center;

   align-items: center;

   gap: 50px;

   margin: 30px 0px;

   flex-wrap: wrap;

  

 }



 .mission-vission-main-sunita .mission-vission-main-sunita-card {

   position: relative;

   width: 270px;

   height: 270px;

   border-radius: 50%;

   background: rgba(255, 255, 255, 0.1);

   backdrop-filter: blur(10px);

   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);

   display: flex;

   justify-content: center;

   align-items: center;

   flex-direction: column;

   text-align: center;

   padding: 25px;

   transition: 0.5s ease;

   overflow: hidden;

 }



 .mission-vission-main-sunita .mission-vission-main-sunita-card::before {

   content: "";

   position: absolute;

   width: 130%;

   height: 130%;

   top: -15%;

   left: -15%;

   background: conic-gradient(from 0deg, var(--color1), var(--color2), var(--color3));

   z-index: -1;

   animation: rotate 6s linear infinite;

   border-radius: 50%;

   opacity: 0.8;

 }



 @keyframes rotate {

   from {

     transform: rotate(0deg);

   }



   to {

     transform: rotate(360deg);

   }

 }



 .mission-vission-main-sunita .mission-vission-main-sunita-card:hover {

   transform: scale(1.08);

   box-shadow: 0 15px 40px rgba(255, 255, 255, 0.3);

 }



 .mission-vission-main-sunita .mission-vission-main-sunita-icon {

   font-size: 48px;

   margin-bottom: 15px;

   animation: bounce 2s infinite;

 }



 @keyframes bounce {



   0%,

   100% {

     transform: translateY(0);

   }



   50% {

     transform: translateY(-8px);

   }

 }



 .mission-vission-main-sunita .mission-vission-main-sunita-title {

   font-size: 22px;

   font-weight: bold;

   margin-bottom: 10px;

   text-transform: uppercase;

   letter-spacing: 1px;

   font-family: var(--font-family1);

 }



 .mission-vission-main-sunita .mission-vission-main-sunita-text {

   font-size: 14px;

   line-height: 1.6;

   color: var(--background-color1);

   font-family: var(--font-family1);

 }



 .mission-vission-main-sunita .mission {

   --color1: #ff4b2b;

   --color2: #ff6a00;

   --color3: #ffb199;

 }



 .mission-vission-main-sunita .vision {

   --color1: #00c8d7;

   --color2: #0077ff;

   --color3: #00f2ff;

 }



 .mission-vission-main-sunita .values {

   --color1: #ffb100;

   --color2: #ffcf4d;

   --color3: #ffe77a;

 }



 @media (max-width: 768px) {

   .mission-vission-main-sunita .mission-vission-main-sunita-card {

     width: 250px;

     height: 250px;

     padding: 21px;

   }

 }