@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/metropolis.regular.otf');
}

@font-face {
    font-family: 'Metropolis-Medium';
    src: url('../fonts/metropolis.medium.otf');
}

@font-face {
    font-family: 'Metropolis-Semibold';
    src: url('../fonts/metropolis.semi-bold.otf');
}

.light {
    --bg-1: #FFFFFF;
    --bg-2: #1B65A7;
    --bg-3: #22262B;
    --color1: #040615;
    --color2: #1B65A7;
    --color3: #FFF6E8;
    --color4: #FFFFFF;
    --color5: #0D4C85;
    --color6: #F69300;
    --color7: #FFF6E8;
    --color8: #CAE6FF;
    --color9: #EFF7FF;
    --color10: #CD7B00;
    --color11: #FAFAFA;
    --color12: #FFEDD2;
    --color13: #737373;
    --colorerr: #F83737;
    --sh-color: #0000001a;
}

html {
    scroll-padding-top: 70px;
}

body{
    font-family: 'Metropolis' !important;
    padding-top: 60px;
    font-size: 16px;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0;
    font-weight: normal;
    line-height: inherit;
    font-size: inherit;
}

h1 {
    font-size: 44px;
    line-height: 56px;
}

h2 {
    font-size: 32px;
    line-height: 41px;
}

h3 {
    font-size: 24px;
    line-height: 31px;
}

h4 {
    font-size: 20px;
    line-height: 28px;
}

h5 {
    font-size: 16px;
    line-height: 22px;
}

h6 {
    font-size: 12px;
    line-height: 20px;
}

.f-medium {
    font-family: 'Metropolis-Medium' !important;
}

.f-semibold {
    font-family: 'Metropolis-Semibold' !important;
}

.fs-xl {
    font-size: 20px !important;
}

.fs-l {
    font-size: 18px !important;
}

.fs-m {
    font-size: 16px !important;
}

.fs-s {
    font-size: 14px !important;
}

.fs-xs {
    font-size: 13px !important;
}

.bg-1 {
    background-color: var(--bg-1) !important;
}

.bg-2 {
    background-color: var(--bg-2) !important;
}

.bg-3 {
    background-color: var(--bg-3) !important;
}

.bg-6 {
    background-color: var(--color6) !important;
}

.bg-7 {
    background-color: var(--color7) !important;
}

.bg-9 {
    background-color: var(--color9) !important;
}

.bg-11 {
    background-color: var(--color11) !important;
}

.text-2 {
    color: var(--color2) !important;
}

.text-3 {
    color: var(--color3) !important;
}

.text-4 {
    color: var(--color4) !important;
}

.text-5 {
    color: var(--color5) !important;
}

.text-10 {
    color: var(--color10) !important;
}

.text-13 {
    color: var(--color13) !important;
}

.text-err {
    color: var(--colorerr) !important;
}

.d-list-item {
    display: list-item;
}

.w-fit-content {
    width: fit-content !important;
}

.h-fit-content {
    height: fit-content !important;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23CD7B00'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23CD7B00'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Etiquetas */
a {
    text-decoration: none;
}

input, textarea {
    border: 1px solid #858E96 !important;
    border-radius: 10px !important;
    padding: 0.5rem 1rem !important;
    box-shadow: none !important;
    width: 100%;
}

input:focus-visible, textarea:focus-visible {
    outline: none;
}

input.is-invalid, textarea.is-invalid {
    border-color: var(--colorerr) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23F83737'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") !important;
}
/* Etiquetas */

/* Botones */
.btn {
    font-size: 13px;
    padding: 12px 36px;
    border-radius: 10px;
}

.btn-primary {
    color: var(--color4) !important;
    background-color: var(--color2) !important;
    border: none !important;
}

.btn-primary:hover {
    color: var(--color4) !important;
    background-color: var(--color5) !important;
    border: none !important;
}

.btn-outline-primary {
    color: var(--color2) !important;
    border: 1px solid var(--color2) !important;
}

.btn-outline-primary:hover {
    color: var(--color5) !important;
    background-color: var(--color8) !important;
    border: 1px solid var(--color5) !important;
}

.btn-outline-secondary {
    color: var(--color6) !important;
    border: 1px solid var(--color6) !important;
}

.btn-outline-secondary:hover {
    color: var(--color10) !important;
    background-color: var(--color12) !important;
    border: 1px solid var(--color10) !important;
}

/* Botones */

.rounded-20p {
    border-radius: 20px !important;
}

.rounded-20p-t {
    border-radius: 20px 20px 0 0 !important;
}

.rounded-20p-b {
    border-radius: 0 0 20px 20px !important;
}

.w-50p {
    width: 50px !important;
}

.pointer {
    cursor: pointer;
}

.special {
    margin: 0 auto;
    border-radius: 6px;
    border: 0;
    width: 135px;
    height: 4px !important;
    opacity: unset;
}

.img-web-cliente {
    box-shadow: 5px 5px 40px 2px rgba(0, 0, 0, 0.1), -5px -5px 40px 2px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    max-width: 300px;
    max-height: 170px;
}

.shadow {
    box-shadow: 4px 4px 54px -2px rgba(0, 0, 0, 0.08), -4px -4px 54px -2px rgba(0, 0, 0, 0.08) !important;
}

/* Scroll Bar */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb {
    background: #C1C1C1;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #A8A8A8;
}

::-webkit-scrollbar-track {
    background: #F1F1F1;
    border-radius: 5px;
}
/* Scroll Bar */

/* Iconos */
.ico-wp i {
    mask: url('../icons/whatsapp.svg') no-repeat center;
    -webkit-mask: url('../icons/whatsapp.svg') no-repeat center;
    display: list-item;
    background-color: var(--color1);
    width: 30px;
    height: 30px;
}

.ico-wp:hover i {
    background-color: var(--color2);
}

.ico-face {
    mask: url('../icons/facebook.svg') no-repeat center;
    -webkit-mask: url('../icons/facebook.svg') no-repeat center;
}

.ico-face:hover {
    background-color: #1877F2 !important;
}

.ico-inst {
    mask: url('../icons/instagram.svg') no-repeat center;
    -webkit-mask: url('../icons/instagram.svg') no-repeat center;
}

.ico-inst:hover {
    background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
    background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
    background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
}

.ico-twit {
    mask: url('../icons/twitter.svg') no-repeat center;
    -webkit-mask: url('../icons/twitter.svg') no-repeat center;
}

.ico-twit:hover {
    background-color: #1D9BF0 !important;
}

.ico-link {
    mask: url('../icons/linkedin.svg') no-repeat center;
    -webkit-mask: url('../icons/linkedin.svg') no-repeat center;
}

.ico-link:hover {
    background-color: #0A66C2 !important;
}

.ico-phone {
    mask: url('../icons/phone.svg') no-repeat center;
    -webkit-mask: url('../icons/phone.svg') no-repeat center;
}

.ico-mail {
    mask: url('../icons/mail.svg') no-repeat center;
    -webkit-mask: url('../icons/mail.svg') no-repeat center;
}
/* Iconos */

/* Barra de navegación */
.navbar {
    height: 70px;
    position: fixed;
    top: 0;
    z-index: 99998;
    width: 100%;
    font-size: 14px;
}

.navbar-nav {
    z-index: 0;
}

.navbar-brand {
    width: 80px;
    z-index: 99998;
}

.navbar-shadow {
    box-shadow: 0px 4px 20px 0px var(--sh-color);
}

.navbar-light .navbar-nav .nav-link {
    font-size: 15px;
    color: var(--color1);
    padding-left: 1rem;
    padding-right: 3rem;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: var(--color2) !important;
}

.navbar-light .navbar-nav .nav-link-secondary {
    color: var(--color2) !important;
}

.nav-link-active {
    color: var(--color2) !important;
}

.navbar-light .navbar-toggler {
    border: none !important;
}

.navbar-toggler > .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.88 8.99999L16.6134 3.27999C16.8644 3.02892 17.0055 2.6884 17.0055 2.33333C17.0055 1.97826 16.8644 1.63773 16.6134 1.38666C16.3623 1.13559 16.0218 0.994537 15.6667 0.994537C15.3116 0.994537 14.9711 1.13559 14.72 1.38666L9.00004 7.11999L3.28004 1.38666C3.02897 1.13559 2.68844 0.994537 2.33337 0.994537C1.97831 0.994537 1.63778 1.13559 1.38671 1.38666C1.13564 1.63773 0.994585 1.97826 0.994585 2.33333C0.994585 2.6884 1.13564 3.02892 1.38671 3.27999L7.12004 8.99999L1.38671 14.72C1.26174 14.8439 1.16254 14.9914 1.09485 15.1539C1.02716 15.3164 0.99231 15.4906 0.99231 15.6667C0.99231 15.8427 1.02716 16.017 1.09485 16.1794C1.16254 16.3419 1.26174 16.4894 1.38671 16.6133C1.51066 16.7383 1.65813 16.8375 1.8206 16.9052C1.98308 16.9729 2.15736 17.0077 2.33337 17.0077C2.50939 17.0077 2.68366 16.9729 2.84614 16.9052C3.00862 16.8375 3.15609 16.7383 3.28004 16.6133L9.00004 10.88L14.72 16.6133C14.844 16.7383 14.9915 16.8375 15.1539 16.9052C15.3164 16.9729 15.4907 17.0077 15.6667 17.0077C15.8427 17.0077 16.017 16.9729 16.1795 16.9052C16.342 16.8375 16.4894 16.7383 16.6134 16.6133C16.7383 16.4894 16.8375 16.3419 16.9052 16.1794C16.9729 16.017 17.0078 15.8427 17.0078 15.6667C17.0078 15.4906 16.9729 15.3164 16.9052 15.1539C16.8375 14.9914 16.7383 14.8439 16.6134 14.72L10.88 8.99999Z' fill='%2322262B'/%3E%3C/svg%3E");
    width: 18px;
    height: 18px;
    transition: 0.5s ease ;
}

.navbar-toggler.collapsed > .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%2322262B' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    width: 30px;
    height: 30px;
}

.navbar-toggler:focus {
    box-shadow: none !important;
}

.close-navbar-toggler {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 99997;
    cursor: pointer;
    background-color: #000;
    opacity: 0.5;
}

.close-navbar-toggler.collapsed {
    display: none;
}

@media(max-width: 992px) {
    .navbar-collapse {
        z-index: 99999;
    }
}
/* Barra de navegación */

/* Pie de página */
.footer-title {
    text-decoration: none;
    margin-bottom: 1.5rem;
}

.copyright {
    border-top: 1px solid #737373;
    font-size: 13px;
}
/* Pie de página */

/* Contacto */
.bg-contacto-form {
    background-image: url('../images/contacto-form.webp');
    background-position: left top;
    background-repeat: no-repeat;
    background-size: cover;
}
/* Contacto */

/* Solicitud */
.bg-request {
    background-image: url('../images/bg-form-request.svg');
    background-position: left -10px;
    background-repeat: no-repeat;
    background-size: 100%;
}
/* Solicitud */

.arrow::after {
    content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 12H22M22 12L15 5M22 12L15 19' stroke='%231B65A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    padding-left: 0.5rem;
}

@media (min-width: 768px) {
    .rounded-20p-md-l {
        border-radius: 20px 0 0 20px !important;
    }

    .rounded-20p-md-r {
        border-radius: 0 20px 20px 0 !important;
    }
}