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

        body {
            font-family: 'Inter', sans-serif;
            background-color: #013DA5;
            color: #fff;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2rem 1rem;
        }

        .container {
            width: 100%;
            max-width: 1280px;
            padding: 0 1rem;
        }

a{color:#FC7F1C;
text-decoration: none;}
       

a:hover{color:#fff;

background-color: #EB6800;}


        /* Desktop Layout */
        .desktop-layout {
            display: none;
            position: relative;
            height: 600px;
        }

        .image-container {
            position: absolute;
            left: 180px;
            top: 0;
            width: 301px;
            height: 444px;
        }

        .image-wrapper {
            position: relative;
            width: 301px;
            height: 444px;
        }

        .decorative-shape-left {
            position: absolute;
            height: 374px;
            left: 22px;
            top: 25px;
            width: 178.5px;
            z-index: 10;
        }

        .decorative-shape-right {
            position: absolute;
            height: 151.5px;
            left: 183px;
            top: 143px;
            width: 80.5px;
            z-index: 10;
        }

        .main-image {
            position: absolute;
            height: 460px;
            left: 0;
            top: 0;
            width: 334px;
        }

        .main-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 50% 50%;
        }

        .content {
            position: absolute;
            left: 542px;
            top: 0px;
            width: 564px;
        }

        h1 {
            font-weight: 900;
            font-size: 40px;
            line-height: normal;
            margin-bottom: 2rem;
        }

        .text-content {
            font-weight: 500;
            font-size: 18px;
            line-height: 31px;
            margin-bottom: 2rem;
        }

        .text-content p {
            margin-bottom: 0;
        }

        .button {
            display: inline-flex;
            align-items: center;
            gap: 1rem;
            background-color: #FC7F1C;
            color: #ffffff;
            text-decoration: none;
            border-radius: 72px;
            padding: 0 1.5rem;
            height: 55px;
            font-weight: 700;
            font-size: 18px;
            transition: background-color 0.3s ease;
            white-space: nowrap;
        }

        .button:hover {
            background-color: #EB6800;
        }

        .arrow {
            width: 33px;
            height: 14px;
        }

        /* Mobile/Tablet Layout */
        .mobile-layout {
            display: flex;
            flex-direction: column;
            gap: 2rem;
            margin-top:2em;
            
        }

        .mobile-layout .image-container {
            position: relative;
            left: 0;
            display: flex;
            justify-content: center;
            width: auto!important;
        }

        .mobile-layout .content {
            position: relative;
            left: 0;
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }

        .mobile-layout h1 {
            font-size: 28px;
            margin-bottom: 0;

        }

        .mobile-layout .text-content {
            font-size: 16px;
            margin-bottom: 0;
                  line-height: 1.8em;
                 
        }

        .mobile-layout .button {
            width: 100%;
            justify-content: center;
        }

            .mobile-layout .main-image {
           height: 350px;
    width: 250px;
}
        }

       .mobile-layout .main-image img {
            width: 50%!important;
            height: 50%!important;
            
        }

        .mobile-layout .image-wrapper {
   
    
    height: 210px;
}

 .mobile-layout .image-container {
    
    height: 340px;
}


.logo {
               
                 text-align: left!important;
            }


        /* Responsive breakpoints */
        @media (min-width: 768px) {
            body {
                padding: 3rem 2rem;

            }

    
            .container {
                padding: 0rem;
            }

            .mobile-layout h1 {
                font-size: 36px;
            }

            .mobile-layout .text-content {
                font-size: 18px;

            }

            .mobile-layout .button {
                width: auto;
            }

            .logo {
                margin-bottom: 1rem;
                 
            }


        


 
}

        @media (min-width: 1024px) {
            body {
                padding: 3rem;
            }

            .container {
                padding: 0rem;
            }

            .desktop-layout {
                display: block;
            }

            .mobile-layout {
                display: none;
            }
 .logo {
                margin-bottom: 6rem;
                
            }



        }