/* ----- Global Header ----- */

.navbar {
    list-style: none;
    width: 100%;
    height: 94px;
    display: flex; justify-content: space-between; align-items: center;
    position: relative;
    background-color: #D8EAF0;
    padding: 0 40px 0 94px;
    color: #111110;
    font-weight: 500;
}

.navbar p {
    display: none;
    text-align: center;
    font-size: 1rem;
    font-weight: 700;
    padding-top: 7px;
}

.navbar > li { display: contents;}

.menu {
    display: flex; gap: 40px;
    margin: 0; padding: 0;
    align-items: center;
}

.menu li, 
.menu .btn-link { font-size: 1.8rem; }
.menu a {
    display: inline-block;
    text-transform: uppercase;
    padding: 10px;
}

.menu .btn-link {
    background-color: transparent;
    border: none;
}

/* decoration nav */

.menu li a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    transition: 0.15s ease-in-out;
}

.btn-link:hover { cursor: pointer; }

/* -----  HAMBURGER MENU ----- */

#check {display: none;}

/* hamburger buttons */
.open-menu , .close-menu , .i {
    position: absolute;
    cursor: pointer;
    color: black;
    font-size: 2.25rem;
    display: none;
    background-color: transparent;
    border: none;
    width: 44px;
    height: 44px;
    cursor: pointer;
}

.open-menu { top: 20px; right: 30px; transform: none; }
.close-menu { top: 20px; right: 35px; }

.logo a {display: inline-block; line-height: 0;}
.logo img {width: 178px; margin-top: 10px; visibility: hidden; }

.mobile-logo {
    display: none;
    margin-right: auto;

    width: 108px;
    height: 108px;
}

/* ----- GLOBAL FOOTER ----- */

footer {
    width: 100%;
    padding: 20px 20px 25px; 
    font-size: 0.8rem; line-height: 18px;
    background: #224665;
    color: #FAFAFA;
}

.row {
    width: 90%; margin: auto;
    display: flex; flex-direction: column;
    gap: 8px;
    align-items: flex-start; justify-content: space-between;
}

footer form input {
    padding-left: 5px;
     color: #FAFAFA; border: none;
}

footer form input::placeholder {
    color: #FAFAFA;
    font-family: poppins;
    
}

.col img {max-width: 100%;width: 150px;}
.col h4 {display: flex; align-items: center; justify-content: center; text-align: left;} 
.col h3 {font-size: 0.9rem; margin: 20px 0 20px; position: relative;}
.col h5 {font-size: 0.8rem; margin-top: 20px;  margin: 12px 0 25px;letter-spacing: 1px;}
.col ul li {line-height: 30px; font-size: 0.9rem;}
.col li a {color: #FAFAFA;}
.col p {line-height: 25px;}

/* form */

footer form {
    display: flex; width: 270px;
    padding-bottom: 5px; margin-bottom: 15px;
    border-bottom: 1px solid #FAFAFA;
}

footer form input { width: 100%; padding: 0; background: transparent; border: 0; }

footer form button { background: transparent; border: 0; padding: 5px; font-size: 1.1rem; }

.col a:hover { font-weight: 600; }

.social-icons { display: flex; font-size: 1.15rem; gap: 6px;}