@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

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

.inter {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

figure,
p,
h1,
h2,
h3,
h4,
h5,
h6,
ul {
    margin: 0;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

a {
    text-decoration: none;
    color: white;
}

:root {
    --primaryWebColor: #00005c;
    --secondaryWebColor: rgb(20, 20, 122);
}


/* custom css class */
.flex-1 {
    flex: 1;
}

.text-yellow {
    color: rgb(255, 145, 0);
}

.text-justify {
    text-align: justify;
}

.my_shadow {
    box-shadow: 0px 0px 10px #6a6767;
}

.cursor-pointer{
    cursor:pointer;
}

.section-heading::after{
    content:' ';
    display: block;
    width:4%;
    height: 3px;
    background-color: rgb(255, 157, 0);
    margin:0 auto;
}


header {
    background-color: var(--primaryWebColor);
}

.inner-header a {
    text-decoration: none;
    color: white;
    font-size: 1rem;
    display: inline-block;
    padding: 5px 10px;
}



/* nav css */
.navbar-brand{
    width:45%;
}

@media(min-width:1024px){
    .navbar-brand{
        width:15% !important;
    }
}

.consultant-popup {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1050;
}

.popup-form {
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  position: relative;
}

.close-popup {
  position: absolute;
  top: 10px;
  right: 10px;
}






/* footer-css */
footer{
    background-image: url('../img/footer-img.jpg');
    width:100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

footer::before{
    content:' ';
    display:block;
    position:absolute;
    bottom: 0;
    top:0;
    left:0;
    right:0;
    background-color: black;
    opacity:0.6;
}

.inner-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
}

/* Apply this to child divs (the 4 sections inside the footer) */
.inner-footer > div {
    flex: 1 0 250px;  /* Grow, shrink, and base width */
    min-width: 220px;
}


footer .company_overview>figure {
    width: 200px;
}

.inner-footer>div>h3::before {
    content: ' ';
    display: block;
    width: 30px;
    height: 3px;
    background-color: rgb(205, 137, 1);
    position: absolute;
    bottom: 0;
}

.footer-links a:hover, .footer-services a:hover, .footer-contact a:hover{
    font-weight: bold;
    color:White;
}


.wtsap_fixed {
    width: 40px;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 50;
    filter: drop-shadow(2px 4px 6px black);
    cursor: pointer;
}

/* fixed_social_links */
.fixed_social_links {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    right: 2px;
}

.social_btn {
    padding: 5px 10px;
    border-radius: 50%;
    box-shadow: 0px 0px 10px #151414;
    color: white;
    font-size: 1.3rem;
    transition: all 0.3s ease-in-out;
}

.social_btn:hover {
    color: white;
}

.icon_facebook {
    background-color: blue;
    padding-inline: 15px;
}

.icon_facebook:hover {
    background-color: white;
    color: blue;
    transform: translateY(-5px);
}

.icon_instagram {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    padding-inline: 12px;
}

.icon_instagram:hover {
    background: white;
    color: #cc2366;
    transform: translateY(-5px);
}

.icon_youtube {
    background-color: red;
}

.icon_youtube:hover {
    background-color: white;
    color: red;
    transform: translateY(-5px);
}

.icon_whatsapp {
    background-color: #358b35;
    padding-inline: 12px;
}

.icon_whatsapp:hover {
    background-color: white;
    color: #358b35;
    transform: translateY(-5px);
}







.consultant-popup {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1055;
}

.popup-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}

.popup-form {
    position: relative;
    background: white;
    padding: 2rem;
    max-width: 400px;
    width: 90%;
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.4);
    z-index: 1;
    animation: zoomIn 0.3s ease;
}

.popup-form .close-popup {
    position: absolute;
    top: 10px;
    right: 15px;
    border: none;
    background: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #333;
}

@keyframes zoomIn {
    from {
        transform: scale(0.8);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}