:root {
    --dark-blue: #2a466e;
    --light-blue: #2FC4FA;
    --whatsapp-green: #0dc342;
}

html {
    scroll-behavior: smooth;
}

.landing-container {
    max-width: 95vw;
    min-width: 95vw;
    margin: auto;
}

.navbar {
    background: transparent;
    box-shadow: none;
    border-bottom: 1px solid black;
    padding: 0% 2%;
    background-color: white;
}

.navbar .container-fluid {
    margin: 1% 2%;
}

.navbar-brand .logo {
    height: 30px; /* Adjust as necessary */
}

.nav-link.custom-nav-link {
    color: black !important;
    margin-right: 10px;
    transition: all 0.3s ease;
}

.nav-link.custom-nav-link:hover {
    color: white !important;
    background-color: black;
}

.nav-link.custom-nav-link.login-btn {
    background-color: var(--dark-blue);
    color: white !important;
    border: none;
}

.nav-link.custom-nav-link.login-btn:hover {
    background-color: var(--light-blue);
    color: white;
}

/* Sticky Navbar */
.sticky-top {
    top: 0px;
}

.btn-primary {
    background-color: var(--dark-blue);
    border: none;
}

.btn-secondary {
    background-color: var(--whatsapp-green);
}

.btn-primary:hover {
    background-color: var(--light-blue);
}

.btn-secondary:hover {
    color: var(--whatsapp-green);
    background-color: white;
}

/* Video Container */
.video-container {
    text-align: center;
    position: relative;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 5%;
    width: 90%;
    height: 90%;
}

.image-container {
    padding: 20px; /* Ajusta el valor según el padding deseado */
}

.centered-image {
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

.footer {
    background-color: var(--dark-blue);
    color: #6c757d;
}

.footer a {
    color: #6c757d;
    text-decoration: none;
}

.footer a:hover {
    color: white;
}

.footer .nav-link:hover {
    color: white !important;
}

.footer .footer-separator {
    margin-top: 10px;
    margin-bottom: 10px;
}

.footer .text-muted {
    color: #6c757d !important; /* Color de texto mutado */
}

.footer .nav-link:hover {
    text-decoration: underline; /* Subrayar enlaces al pasar el cursor */
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .order-md-2 {
        order: 1 !important;
    }
    .order-md-1 {
        order: 2 !important;
    }
}

@media (max-width: 992px) {
    .navbar-nav .nav-link {
        padding-right: 1rem !important;
        padding-left: 1rem !important;
    }
}