@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body{
    font-family: 'Poppins';
}
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

.wecareSec {
    display: flex;
    align-items: center;
}

.secondSec {
    height: 80vh; 
}

.secondSec .container-fluid {
    height: 100%; 
}

.secondSec .row {
    height: 100%; 
}

.astralLogin {
    height: 100vh;
    overflow: hidden; /* Prevent overflow */
}

.astralLogin {
    
    height: 100vh;
    
}
.wecareSec{box-shadow: 1px 4px 25px 0px rgba(0, 0, 0, 0.08); border-radius: 0px 0px 20px 20px;}
.weCarelogo img{max-width: 80%;}
.weCarelogo{position: relative;}
.weCarelogo::after{content:''; position: absolute; background: #0566B2; height: 60px; width: 2px; top: 25%; right: 5%;}
.astralLogo img{max-width: 80%;}
.ctaBtn{background-color: #0566B2; color: #fff; padding: 10px 20px; text-transform: capitalize; text-decoration: none;}
.secondSec{background: #F9F9F9; padding: 40px 0;}
.Logos img{margin-bottom: 30px; max-width: 150px;}
.product{position: relative; height: 0; padding-bottom: 60%;}
.product img{position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: contain; white-space:no-wrap;}
.subSec { position: relative;  border-right: 1px solid #0566B2; text-align: center;}
.col-md-4.subSec:last-child {
    border-right: none;
}
.col-md-4:last-of-type .subSec {border-right: none;}
.loginBtn{padding: 10px 40px; border: 1px solid #0566B2; border-radius: 25px; text-decoration: none; font-weight: 600; font-size: 0.9rem;  cursor: pointer; display: table; margin: 0 auto;}
.loginBtn img{padding-left: 5px;}
.loginBtn:hover{background: #fff;}

.titleBtn { position: relative; z-index: 1; margin-bottom: 35px;}
.titleBtn::before{content: ''; background: #0566B2; position: absolute; width: 100%; height: 1px; left:0; top: 50%; transform: translateY(-50%); z-index: -1;}

.titleBtn h2{position: relative;color: #0566B2; font-size: 1.4rem; font-weight: 700; margin-bottom: 0; display: table; background: #F9F9F9; margin:  0 auto; padding: 0 30px;}

/* LOGIN PAGE CSS */
.pipeLogin h2{position: relative;}
.pipeLogin h2::before{content: ''; background: #0566B2; position: absolute; width: 60px; height: 1px; left: 20%; top: 50%;}
.pipeLogin h2::after{content: ''; background: #0566B2; position: absolute; width: 60px; height: 1px; right: 20%; top: 50%;}
.loginPart{  background-image: url('../Images/loginBg.jpg');  background-size: cover;  background-position: center; background-repeat: no-repeat;   display: flex;justify-content: center;align-items: center; padding: 50px 0;}

.input-container { display: flex; align-items: center; border: 1px solid #0566B2; border-radius: 35px; padding: 15px 20px;  width: 400px; margin: auto;}
  
 .country-code { font-size: 16px; margin-right: 15px; position: relative; display: inline-flex; align-items: center;}
  
  .country-code::after {content: ''; background: #0566B2; height: 20px; width: 1px; margin-left: 15px; }
  
  .mobile-input { border: none; outline: none; flex: 1; font-size: 16px; background: none;}
  
  .mobile-input::placeholder { color: #aaa;}
  .loginSec h4{font-size :2.2rem; font-weight: 700; margin-bottom: 15px;}
  .signinBtn img{padding-left: 5px;}
  .loginSec p{color: rgba(0, 0, 0, 0.43);font-size: 1.1rem;font-weight: 400; margin-bottom: 25px;}
  .input-container:focus-within { border-color: #007bff;}
  .signinBtn{display: inline-block; border: 1px solid #007bff; padding: 10px 30px; border-radius: 25px; text-decoration: none; font-weight: 600; margin: 50px 0;}
  .signUp{text-decoration: none; font-weight: 600;}
  .productImg{position: relative; height: 0; padding-bottom: 65%;}
  .productImg img{position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: contain; white-space:no-wrap;}
  .leftSection{align-items: center; justify-content: center; text-align: center; background: #F9F9F9;box-shadow: 7px 3px 20px 0px rgba(0, 0, 0, 0.10); padding: 40px; }


@media(max-width:576px) {
    .weCarelogo img{max-height: 55px; width: auto;}
    .astralLogo img{max-height: 30px; width: auto;}
    .ctaBtn{padding: 10px 9px; font-size: 0.8rem;}
    .weCarelogo::after{display: none;}
    .input-container {width: 250px;}
    .signinBtn{margin: 35px 0;}
    .titleBtn h2{font-size: 1.2rem;}
    .subSec{border-right: none;}
    .secondSec{height: auto;}
    .astralLogin {height: auto;}
}