*{
 margin:0;
 padding:0;
 box-sizing:border-box;
 font-family: 'Inter', sans-serif;
}
 
.layout{
 display:flex;
 height:100vh;
 overflow:hidden;

} 

.left-side{
 width:40%;
 position:fixed;
 left:0; 
 top:0;
 height:100%;
 min-width: 256px; 
}

.left-side img{
 width:100%;
 height:100%;
 object-fit:cover;
}

.right-side{
 margin-left:40%;
 width:60%;
 padding:70px 0px;
 overflow-y:auto;
 background:#056da4;
 color:white;
 display:flex;
 flex-direction:column;
 align-items:center;
 text-align:center;
}

/* LOGO */
.logo img{
 width:150px;
 margin-bottom:20px;
}

/* HERO TEXT */
.hero-text{
 font-size:27px;
 line-height:30px;
 font-weight:600;
 margin-bottom:40px;
 max-width:100%;
 animation: fadeIn 0.6s ease-in-out;
 margin-top: 40px; 
}

/* BUTTON GRID */
.button-grid{
 display:grid;
 grid-template-columns: repeat(3, 1fr); 
 gap:30px; 
 
 width:65%;
 max-width:100%;
 margin-top:20px;
}

.btn{
 background:white;
 color:#0E5FAE;
 padding:17px 17px;
 border-radius:25px;
 text-decoration:none;
 font-size:15px;
 font-weight:600;
 transition:0.3s ease;
 text-align:center;
}

.btn:hover,
.btn.active{
 background:#003c7d;
 color:white;
}

.btn.full{
 grid-column:span 3;
 margin-top:10px;
 background:#ffb400;
 color:black;
}

.btn.full:hover{
 background:#d99a00;
 color:white;
}

/* ANIMATION */
@keyframes fadeIn{
 from{opacity:0; transform: translateY(10px);}
 to{opacity:1; transform: translateY(0);}
}

/* Page Title */
.page-title{
 font-size:32px;
 font-weight:700;
 margin:20px 0 30px;
}

/* Content Box */
.content-section{
 background:white;
 color:#0E5FAE;
 padding:30px;
 border-radius:18px;
 width:100%;
 max-width:786px;
 margin-top:30px;
 box-shadow:0 6px 18px rgba(0,0,0,0.05);
 text-align: left;
}

/* Headings inside content */
.content-section h2{
 margin-bottom:12px;
 font-size:22px;
 font-weight:700;
}

/* Bullet Style */
.clean-list{
 padding-left:18px;
 margin-bottom:30px;
}

.clean-list li{
 margin-bottom:10px;
 line-height:26px;
 font-size:15px;
}

/* Divider */
.divider{
 height:1px;
 width:100%;
 background:#d9d9d9;
 margin:25px 0;
}

/* Footer */
.footer{
 margin-top:50px;
 font-size:13px;
 opacity:0.7; 
 text-align:center;
}

.footer-logo {  
        position: absolute; 
        bottom: 50px;
        right: 182px;  
        width: 160px; 
        opacity: 0.9;
    }

    .footer-logo img { 
        width: 100%;  
        height: auto;
    }

/* MOBILE */ 
@media(max-width:900px){

 .layout{flex-direction:column;} 

 .left-side{
  width:100%;
  height:470px;
  position:relative;
 }

 .right-side{
  margin-left:0;
  width:100%; 
  padding:30px 25px;
 }

 .button-grid{
  grid-template-columns: repeat(2, 1fr);
 }

.footer-logo {
            position: relative;
            margin-top: 40px;
            right: auto;
            bottom: auto;
            width: 130px;
        }

 .btn.full{
  grid-column:span 2;
 }
}

@media(max-width:2000px){
 
 .button-grid{ 
 width:65%;
 max-width:100%;
 margin-top:20px;
}   
    
   .footer-logo {  
        position: static; 
        bottom: 50px;
        Margin-top:100px;
        right: 250px;  
        width: 160px; 
        opacity: 0.9;
    }
    
    .p-logo {
        
        width: 100%;
        margin-top: 100px;
    }
       
}

@media(max-width:1800px){
 
 .button-grid{
 width:76%;
 max-width:100%;
 margin-top:20px;
} 

.footer-logo {  
        position: static; 
        bottom: 50px;
        Margin-top:40px;
        right: 165px;  
        width: 160px; 
        opacity: 0.9;
        
    }
    
    .p-logo {
        
        width: 100%;
        margin-top: 100px;
    }

}