
        /* Global Styles */
        * {
            font-family: 'Roboto', sans-serif;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        /* Navigation Bar */
        nav ul {
            pointer-events: auto;
        }
        nav ul li a,
        .new li a {
            text-decoration: none;
            color: inherit;
            cursor: pointer;
        }
        /* List Styling */
        .portUl,
        .new {
            display: flex;
            padding: 8px;
            align-items: center;
            gap: 30px;
            font-size: large;
            list-style: none;
            height: 70px;
            justify-content: center;
        }
        .new li {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 69px;
        }
        .portUl li:hover {
            color: #fd7200;
        }
        .new li:hover {
            font-weight: bold;
            border-bottom: 10px solid #fbbd08;
        }
        /* Icons */
        .social-icon,
        .phone-icon {
            width: 25px;
            height: 25px;
            background-color: #fff;
            border-radius: 50px;
        }
        /* Top Bar */
        .top {
            background-color: #212121;
            color: #ffffff;
            height: 44px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-inline: 33px;
        }
        /* Navbar */
        .nvbr {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-inline: 33px;
        }
        /* Hero Section */
        .img {
            background: url(./public/images/bnr.jpg) center/cover no-repeat;
            height: 500px;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            color: #fff;
            text-align: center;
            gap: 30px;
        }
        .img h1 {
            font-size: 8vh;
            margin-top: 140px;
        }
        .img p {
            width: 750px;
            text-align: center;
            font-size: x-large;
        }
        /* About Section */
        .ABOUT {
            background: url(./public/images/bg.jpg) no-repeat center/cover;
            box-shadow: 0px 4px 10px rgba(29, 26, 29, 0.5);
            padding: 30px 55px;
        }
        .paras {
            display: flex;
            flex-direction: column;
            gap: 20px;
            margin-block: 20px;
        }
        .paras p {
            width: 90%;
            /* Adjusts width to be responsive */
            max-width: 500px;
            /* Prevents it from being too wide on larger screens */
        }
        .read-more {
            background-color: #fbbd08;
            color: #000;
            padding: 12px 20px;
            margin-bottom: 20px;
            width: 181px;
            border: none;
            cursor: pointer;
            font-size: 16px;
            border-radius: 4px;
        }
        /* Responsive Text */
        .responsive-text {
            display: none;
        }
        /* Menu Icon */
        .menu-icon {
            width: 100px;
            height: 40px;
        }
        /* Section Lists */
        section ul {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 30px;
        }
        section ul li {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        /* Start Project */
        .start-project {
            height: 320px;
            background: #8dc63f;
            color: #fff;
            display: flex;
            justify-content: center;
            flex-direction: column;
            align-items: center;
            gap: 20px;
            padding: 20px;
            text-align: center;
        }
        
        .start-project h1 {
            font-size: 6vh;
            margin: 0;
        }
        
        .start-project form {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: center;
        }
        
        .start-project input {
            border: none;
            border-radius: 8px;
            width: 226px;
            height: 42px;
            font-size: 16px;
            color: #dddedf;
            padding-left: 24px;
        }
        
        .start-project button {
            padding: 10px 25px;
            border: none;
            border-radius: 4px;
            box-shadow: 0px 4px 10px rgb(153, 138, 6);
            background-color: #FFC107;
            color: black;
            cursor: pointer;
            font-size: 16px;
        }
        
        .start-project p {
            width: 90%;
            max-width: 670px;
            margin: 0;
            font-size: medium;
        }
        
        /* Services */
        .ser {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 16px;
            padding: 0;
            list-style: none;
        }
        .ser li {
            display: flex;
            width: 260px;
            height: 200px;
            border-radius: 10px;
            background: #f1f2f2;
            flex-flow: column;
            justify-content: center;
            align-items: center;
        }
        .ser img {
            margin-top: -100px;
            width: 70px;
            height: 70px;
        }
        .ser div {
            display: flex;
            flex-flow: column;
            justify-content: center;
            align-items: center;
            margin-top: 15px;
            gap: 8px;
        }
        .ser h6 {
            font-size: medium;
            margin-bottom: 0px;
        }
        .ser p {
            width: 200px;
            margin: 0px;
            text-align: center;
            font-size: small;
            color: #bcbec0;
        }
        .ser a {
            color: #4fdf16;
            cursor: default;
            pointer-events: none;
            margin-top: 15px;
        }
        /* Footer */
        
        .footer {
            background: #79a32b;
            padding: 40px 20px;
        }
        
        .footer-container {
            background: #79a32b;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
            max-width: 1200px;
            margin: auto;
        }
        
        .footer-section {
            flex: 1;
            min-width: 250px;
            margin: 20px;
        }
        
        .footer-section h3 {
            font-size: 18px;
            font-weight: bold;
        }
        
        .footer-section ul {
            list-style: none;
            padding: 0;
        }
        
        .footer-section ul li {
            margin: 10px 0;
        }
        
        .footer-section ul li a {
            color: white;
            text-decoration: none;
        }
        
        .contact-list li {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        .social-icons img {
            width: 25px;
            margin-right: 10px;
        }

        /* Accessibility improvements */
        .sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

        /* Focus indicators for keyboard navigation */
        a:focus,
        button:focus,
        input:focus {
            outline: 2px solid #fbbd08;
            outline-offset: 2px;
        }

        /* Skip link for screen readers */
        .skip-link {
            position: absolute;
            top: -40px;
            left: 6px;
            background: #000;
            color: #fff;
            padding: 8px;
            text-decoration: none;
            z-index: 1000;
        }

        .skip-link:focus {
            top: 6px;
        }

        /* Media Queries */
@media (max-width: 1170px) {

            .nvbr,
            .top {
                flex-direction: column;
                align-items: center;
                text-align: center;
                padding: 1rem;
            }
            .new,
            .contact-info {
                display: none !important;
            }
        }
@media (max-width: 768px) {
    
    .contact-info {
        display: none;
    }

    .nvbr {
        flex-direction: column;
        padding-inline: 15px;
    }

    .new {
        flex-direction: column;
        gap: 15px;
    }

    .img h1 {
        font-size: 6vh;
    }

    .img p {
        width: 90%;
        font-size: large;
    }

    section>div,
    section ul {
        flex-direction: column;
        align-items: center;
    }

    section ul li {
        margin-bottom: 20px;
    }

    .menu-icon {
        width: 60px;
        height: 30px;
    }

    .ADVANTAGES {
        display: none;
    }

    .responsive-text {
        display: block;
        color: #bcbec0;
    }
    .ser {
        flex-direction: column;
        align-items: center;
    }
.four {
    width: 60%;
    max-width: 343px;
    font-size: 14px;
    margin: 0px;
        }
    .footer-container {
        flex-direction: column;
        text-align: center;
    }
    .start-project {
        height: auto;
        padding: 40px 10px;
    }

    .start-project h1 {
        font-size: 5vh;
    }

    .start-project form {
        flex-direction: column;
        align-items: center;
    }

    .start-project input {
        width: 90%;
        max-width: 300px;
    }

    .start-project button {
        width: 90%;
        max-width: 320px;
    }
}