* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }

 .about-container {
   background-color: black;
 }

 .orange-text {
   color: orange;
   text-align: center;
   padding: 1rem;
   font-size: clamp(1rem, 2.5vw, 1.3rem);
   background-color: black;
 }

 .quote {
   padding: 10px;
 }

.heading-container{
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      text-align: center;
      z-index: 2;
      position: relative;
    }
    
    .heading, #blackheading{
     
      font-size: clamp(2rem, 5vw, 4rem);
      color: transparent;
      -webkit-text-stroke: 1px orange;
      transition: color 0.4s ease;
      cursor: pointer;
      padding: 1rem;
      position: relative;
      text-align: center;
    }

    .heading:hover {
      color: orange;
      text-decoration: underline;
    }

    #blackheading{-webkit-text-stroke: 2px black ;}
    #blackheading:hover{
      text-decoration: underline;
      color: black;
    }




 .about-section {
   position: relative;
   padding: 4rem 2rem;
   overflow: hidden;
 }

 .blur-bg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-size: cover;
   background-position: center;
   filter: blur(0px);
   opacity: 1;
   z-index: 0;
 }

 .about-content {
   position: relative;
   z-index: 1;
   max-width: 900px;
   margin: auto;
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
 }

 .fade-para {
   opacity: 0;
   transform: translateY(30px);
   font-size: clamp(1rem, 2vw, 1.2rem);
   line-height: 1.8;
   text-align: justify;
   color: white;
 }

 @media (max-width: 768px) {
   .about-section {
     padding: 2rem 1rem;
   }

   .heading {
     padding: 1.5rem;
   }

   .fade-para {
     font-size: 1rem;
   }
 }