/* Mobile Responsive Adjustments */
@media only screen and (max-width: 768px) {
    .about-section {
        max-width: 100%; /* Takes full width on mobile */
        padding: 10px 0px !important;
        margin: 0 15px; /* Adds small side margins */
        border-radius: 8px; /* Slightly smaller radius */
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.05); /* Lighter shadow */
    }
    .image-section img {
        max-width: 600px;
        margin-bottom: 20px;
    }
    .logo img {
        height: 60px;
        margin-right: 10px;
    }
    .heading {
        font-size: 2rem !important; 
        font-weight: bold;
    }
    .pheading{
        font-size: .8rem !important;
    }

    .header-content {
        position: absolute;
        top: 50%;
        text-align: center;
        color: white;
        z-index: 2;
        left: 0% !important;
        transform: translate(-0%, -0%) !important;
    }
    .header video {
        position: absolute;
        top: 50%;
  
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: -1;
    }
    .header-content p {
        font-size: 1rem !important;
        margin-top: 10px;

    }
    a.ms-2 {
        text-align: start;
        color: inherit;
        text-decoration: none;
    }
    .logo img {
        height: 60px !important;
        margin-right: 10px;
    }
    .background-video {
        width: 100%; 
        height: 100vh;
    }
    body {
        overflow-x: hidden !important;
    }
}

/* Extra Small Devices (phones below 480px) */
@media only screen and (max-width: 480px) {
    .about-section {
        padding: 15px 20px; /* Even more compact padding */
    }
}