/******************************
*   Tipografias
******************************/
@import url('all.css');
@import url('typo.css');

:root {
    --negro: 0 ,0 ,0;
    --blanco: 255, 255, 255;
    --dark: 13 ,14 ,14;
    --verde_l: 31, 103, 121;
    --verde_d: 13, 23, 26;

    --verde_n: 174, 255, 29;
    --dark_l: 31 ,31 ,31;

    /* Colores Oscuros */
    --b01: 62, 58, 57;
    --b02: 79, 65, 44;
    --b03: 124, 117, 109;

    /* Colores Medios */
    --b04: 192, 154, 119;
    --b05: 166, 157, 148;

    /* Colores Claros */
    --b06: 211, 212, 206; --b06a: 230, 194, 161;
    --b07: 235, 235, 235;
    --b08: 245, 245, 245;

    --b09: 213, 214, 206;
    --b10: 209, 208, 206;
    --b11: 78, 74, 73;

    --c01: 0, 174, 127;
    --c02: 136, 243, 210;
}
::selection {
    background: rgb(var(--b01), .5);
    color: rgb(var(---blanco), 1);
}
::-moz-selection {
    background: rgb(var(--b01), .5);
    color: rgb(var(---blanco), 1);
}
::-webkit-selection {
    background: rgb(var(--b01), .5);
    color: rgb(var(---blanco), 1);
}

/******************************
*   Reset
******************************/
*{
    border: 0px;
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
    scroll-padding: 60px;
}
body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    background: rgb(var(--blanco));
    color: rgb(var(--b01)); 
    font-family: 'HarmonyOS Sans';
    font-weight: normal;
    font-style: normal;
    line-height: 1.4;
}
figure {
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
figure img { margin: 0 auto; }
img {
    max-width: 100%;
    height: auto;
    display: block;
}
svg {
    width: 100%;
    height: auto;
}
a, a:link, a:hover, a:visited {
    text-decoration: none;
    color: inherit;
    cursor: pointer;

    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
ul,
ol {
    margin: 0;
    padding: 0;
    padding-inline-start: 20px;
}
li + li { margin-top: 20px; }
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: bold;
}
h1 { font-size: 32px; }
h2 { font-size: 28px; }
h3 { font-size: 24px; }
h4 { font-size: 20px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }
strong { font-weight: 600; }
input,
select,
textarea {
    display: block;
    width: 100%;
    padding: 10px;
    color: rgb(var(--b01));
    background: rgb(var(--b07));
    border-radius: 6px;
    -moz-appearance: none;
    -webkit-appearance: none;
}
select option {
    background: rgb(var(--blanco));
    color: rgb(var(--negro));
}
input,
select,
textarea,
label {
    
    font-weight: bold;
    font-style: normal;
}
textarea {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
}
/* Change autocomplete styles in WebKit */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: rgb(var(--b01), 1);
  -webkit-box-shadow: 0 0 0px 1000px rgb(var(--blanco), 1) inset;
  transition: background-color 5000s ease-in-out 0s;
}
input::placeholder,
textarea::placeholder { color: #565656; }
button { background: transparent; }
input:focus,
select:focus,
textarea:focus,
button:focus { outline: none; }

/* p { margin: 0; }
p + p { margin-top: 20px; } */

p { margin: 0; }
p + *,
* + p,
* + ol,
* + ul { margin-top: 20px; }
ol + *,
ul + *,
* + h2,
* + h3,
* + h4,
* + h5,
* + h6 { margin-top: 40px; }

hr {
    margin-top: 40px;
    margin-bottom: 40px;
}

/******************************
*	General
******************************/
.wrapper { opacity: 0; }
main { position: relative; }
.container {
    padding-left: 30px;
    padding-right: 30px;
}
/* Img bg */
.bg__page,
.overlay::after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.bg__page {
    overflow: hidden;
    top: -162px;
}
.bg__page figure img {
    width: 100%;
    max-width: 100%;
}
.overlay::after { content: ''; }
.over__00::after { background: linear-gradient(to top,  rgba(var(--negro), .3) 50%, rgba(var(--negro), 0) 100%); }
.over__01::after { background: linear-gradient(to bottom,  rgba(var(--negro), .5) 60%, rgba(var(--negro), 0) 100%); }
.over__02::after { background: linear-gradient(to bottom,  rgba(var(--negro), .5) 20%, rgba(var(--negro), 0) 100%); }
.over__03::after { background: linear-gradient(to bottom,  rgba(var(--negro), .8) 20%, rgba(var(--negro), 0) 100%); }
.back__02 {
    margin-top: -6%;
    -webkit-mask-image: linear-gradient(to bottom, rgba(var(--negro), 0) 0%, rgba(var(--negro), 1) 10%);
    mask-image: linear-gradient(to bottom, rgba(var(--negro), 0) 0%, rgba(var(--negro), 1) 10%);
    transform-origin: 50% 0%;
}
.back__02 img {
    -webkit-mask-image: linear-gradient(to top, rgba(var(--negro), 0) 0%, rgba(var(--negro), 1) 30%);
    mask-image: linear-gradient(to top, rgba(var(--negro), 0) 0%, rgba(var(--negro), 1) 30%);
}
.info__center {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    position: relative;
}
.section { position: relative; }
.info__center section {
    padding: 60px 0;
    position: relative;
}
.legal {
    position: relative;
    text-align: center;
    font-size: 14px;
    padding: 30px 0;
}
.legal > * { position: relative; }
.legal a {
    display: inline-block;
    padding: 15px;
    color: rgb(var(--blanco));
    background: rgb(var(--b01));
    border-radius: 6px;
    text-decoration: underline;
}

.bg__sect {
    position: absolute;
    left: 15px;
    right: 15px;
    top: 0;
    bottom: 0;
    overflow: hidden;
    border-radius: 10px;
}
.bg__sect figure {
    width: 100%;
    height: 100%;
}
.bg__sect figure img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
}
.bg__sect span {
    position: absolute;
    top: 0;
    right: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(var(--b01), .6);
    mix-blend-mode: hard-light;
}
.bg__sect + * { color: rgb(var(--blanco)); }
.bg__sect + * input,
.bg__sect + * select,
.bg__sect + * textarea { background: rgb(var(--blanco)); }


/* Headers de seccion */
.head__sect + * { margin-top: 60px; }
.head__sect * + * { margin-top: 20px; }
.head__sect {
    text-align: center;
    text-transform: uppercase;
}
.head__sect h3,
.head__sect h2 { font-weight: 900; }
.head__sect p {
    font-weight: bold;
    font-style: normal;
    color: rgb(var(--c02));
}

/* CTA */
.c__cta {
    text-align: center;
    margin-top: 60px;
    display: flex;
    justify-content: center;
}
.cta, 
a.cta {
    display: inline-flex;
    justify-content: center;
    align-items: baseline;
    gap: 6px;
    text-align: center;
    min-width: 150px;
    padding: 15px 20px;
    font-size: 14px;
    line-height: 1;
    color: rgb(var(--blanco));
    background: rgb(var(--c01));
    text-transform: uppercase;
    border-radius: 6px;
    font-weight: bold;
}
.cta, 
.cta > * { position: relative; }


/******************************
*   Formulario
******************************/
* + .cont__form,
.cont__form + * { margin-top: 60px; }
.form__campos {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.campo > label {
    margin: 0;
    line-height: 1.2;
}
.campo > div { position: relative; }
.campo > * + * { margin-top: 10px; }
.icon__camp {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 15px;
    pointer-events: none;
    color: rgb(var(--b01));
}
.campo select { padding-right: 40px; }
.campo.check label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'HarmonyOS Sans';
    font-weight: normal;
    font-style: normal;
    cursor: pointer;
}
.campo.check label a { text-decoration: underline; }
.cont__check { position: relative; }
.cont__check input,
.cont__check i {
    width: 20px;
    height: 20px;
}
.cont__check input {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
}
.cont__check i {
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    color: rgb(var(--b01));
    background: rgb(var(--blanco));
}
.cont__check i::before {
    content: "\f00c";
    font-weight: 900;
    font-family: "Font Awesome 6 Pro";
    opacity: 0;
    font-style: normal;
}
.cont__check input:checked + i { color: rgb(var(--b01)); }
.cont__check input:checked + i::before { opacity: 1; }
.cont__form .campo.c__cta,
.cont__form .campo.check { margin-top: 10px; }


/******************************
*   Home
******************************/
.info__center section.inicio {
    padding: 0;
    overflow: hidden;
}
.bg__master {
    width: 100%;
    padding-top: 52%;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.bg__master img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
    width: 100%;
    height: 100%;
}
/* .sistema {
    position: absolute;
    top: 30px;
    right: 15px;
    width: 200px;
    padding: 15px;
    background: rgb(var(--blanco));
} */
.auto {
    width: 100%;
    margin-top: -24%;
    margin-left: auto;
    margin-right: auto;
    -webkit-transform: translateX(8%);
    -moz-transform: translateX(8%);
    -ms-transform: translateX(8%);
    -o-transform: translateX(8%);
    transform: translateX(8%);
}
.km {
    width: 250px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -8%;
}
.km + * { margin-top: 40px; }
.txt__ini {
    text-align: center;
    text-transform: uppercase;
    font-size: 18px;
}

/******************************
*	Legal
******************************/
.info__legal {
    margin-left: auto;
    margin-right: auto;
    max-width: 850px;
}

/******************************
*	Mobile
******************************/
/* Extra Small Devices, Phones */ 
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
@media (max-width : 649px) {
/* Home */

}
@media (min-width : 650px) {
/* Img bg */
.bg__page { top: -99px; }
.info__center { min-height: calc(100vh - 99px); }

/* Formulario */
.fomr__small {
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
}
.fomr__small .form__campos .campo { width: calc(50% - 15px); }
.fomr__large .form__campos .campo { width: calc(50% - 15px); }
.fomr__large .form__campos .c__large { width: 100%; }
.form__campos {
    flex-flow: row wrap;
    align-items: baseline;
}
.cont__form .campo.c__cta,
.cont__form .campo.check { width: 100% !important; }

/* Home */
/* .sistema { width: 250px; } */
.txt__ini { font-size: 20px; }

}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {
}
/* Small Devices, Nav */
@media (max-width : 767px) {
/* Img bg */
.bg__page .back__01 { padding-top: 220px; }

}
/* Medium Devices to Large Devices */
@media (min-width : 768px){
h1 { font-size: 36px; }
h2 { font-size: 32px; }
h3 { font-size: 28px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 16px; }

.container-fluid {
    padding-left: 30px;
    padding-right: 30px;
}

/* Home */
/* .sistema { right: 30px; } */

.bg__sect {
    left: 30px;
    right: 30px;
}

}
/* Medium Devices, Desktops */
@media (min-width : 650px) and (max-width : 991px) {
/* Img bg */
.bg__page .back__01 { padding-top: 130px; }


}
@media (min-width : 768px) and (max-width : 991px) {
/* Img bg */
.bg__page .back__01 { padding-top: 80px; }

}
@media (min-width : 768px) and (max-width : 1200px) {
}
/* Large Devices, Wide Screens */
@media (max-width : 991px) {
/* Img bg */
.bg__page .back__01 { background: linear-gradient(45deg,  rgba(156,176,195,1) 0%,rgba(85,133,174,1) 100%); }
.bg__page .back__01 img {
    -webkit-mask-image: linear-gradient(to bottom, rgba(var(--negro), 0) 0%, rgba(var(--negro), 1) 10%);
    mask-image: linear-gradient(to bottom, rgba(var(--negro), 0) 0%, rgba(var(--negro), 1) 10%);
}

}
/* Medium Devices to Large Devices */
@media (min-width : 992px) {
/* Formulario */
.fomr__large .form__campos .campo { width: calc(25% - 22.5px); }
.fomr__large .form__campos .c__large { width: calc(50% - 15px); }

/* Home */
.bg__master { padding-top: 36%; }
.auto { width: 80%; }

}
@media (min-width : 1024px) {
}
@media (min-width : 992px) and (max-width : 1200px) {
}
@media (min-width : 1200px) {
/* Home */

}

/******************************
*   Contacto módulo
******************************/
/* Extra Small Devices, Phones */ 
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {
}
/* Small Devices, Nav */
@media (max-width : 767px) {
}
/* Medium Devices to Large Devices */
@media (min-width : 768px){
.head__sect h3 span { font-size: 26px; }
.fil__info p { font-size: 26px; }
.contacto .c__contact,
.contacto .c__contact .fil__col {
    text-align: left;
    display: flex;
}
.contacto .c__contact .fil__col {
    flex-direction: column;
    justify-content: center;
}
.contacto .c__contact .fil__info {
    width: 100%;
    margin-top: 0;
    margin-left: 30px;
    padding-left: 30px;
    border-left: 1px solid rgb(var(--verde_l), 1);
}
.contacto .fil__info ul { margin: 0; }
.contacto .c__contact .fil__social { margin: 0 0 0 30px; }
}
/* Medium Devices, Desktops */
@media (min-width : 768px) and (max-width : 991px) {
.contacto .container { width: 100%; }
}
/* Large Devices, Wide Screens */
@media (min-width : 992px) and (max-width : 1200px) {
}



/* ----------- iPad Pro ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* Portrait */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {

.info__center { min-height: calc(88vh - 99px); }
/* Home */

.fomr__large .form__campos .campo { width: calc(50% - 15px); }
.fomr__large .form__campos .c__large { width: 100%; }

}

/* Landscape */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
}



header ul,
footer ul,
header ol,
footer ol {
    padding-inline-start: 0;
    list-style: none;
}
header * + ul,
header ul + *,
footer ul + *,
footer * + ul,
header li + li,
footer li + li { margin-top: 0; }

/******************************
*   Header
******************************/
.header {
    position: relative;
    z-index: 1000;
}
.cont__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px;
    gap: 20px;
}
.cont__head > * {
    position: relative;
    overflow: hidden;
    margin: 0;
}
.cont__head span {
    position: absolute;
    top: -100%;
    left: -100%;
    opacity: 0;
}
.logo { width: 250px; }
.logo__auto { width: 290px; }


/************** Mobile **************/
/* Extra Small Devices, Phones */ 
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
@media (max-width : 649px) {
}
@media (min-width : 650px) {


.cont__head {
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
}
.logo__auto { width: 380px; }


}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {
}
/* Small Devices, Nav */
@media (max-width : 767px) {
}
/* Medium Devices to Large Devices */
@media (min-width : 768px){
}
/* Medium Devices, Desktops */
@media (min-width : 650px) and (max-width : 991px) {
}
@media (min-width : 768px) and (max-width : 991px) {
}
@media (min-width : 768px) and (max-width : 1200px) {
}
/* Large Devices, Wide Screens */
@media (max-width : 991px) {
}
/* Medium Devices to Large Devices */
@media (min-width : 992px) {
}
@media (min-width : 1024px) {
}
@media (min-width : 992px) and (max-width : 1200px) {
}
@media (min-width : 1200px) {
}


/******************************
*   Footer
******************************/
.footer {
    background: rgb(var(--b07));
    padding: 60px 0 30px;
    line-height: 1.4;
}
.foo__fil + .foo__fil {
    border-top: 1px solid rgba(var(--b01), .3);
    margin-top: 30px;
    padding-top: 30px;
}
.foo__top {
    display: flex;
    flex-direction: column;
    gap: 50px;
}
.nav__footer {
    display: flex;
    flex-direction: column;
    gap: 50px;
    text-transform: uppercase;
}
.nav__footer li {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.nav__footer li a:hover { color: rgb(var(--b04)); }
.nav__footer li span { font-weight: bold; }
.nav__footer li ul li + li { margin-top: 12px; }
.top__01 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}
.logo__footer { width: 280px; }
.social__media {
    list-style: none;
    display: flex;
    gap: 20px;
}
.social__media li a {
    display: flex;
    font-size: 22px;
    color: rgb(var(--b04));
}
.icon__grill {
    width: 80%;
    opacity: .4;
}
.foo__bot {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 30px 60px;
    text-align: center;
    font-size: 14px;
    line-height: 1.8;
}
.foo__bot a { font-weight: bold }
.foo__bot .bot__02 {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.foo__bot .bot__02 p span:last-of-type { display: none; }
.logo__grupo {
    max-width: 350px;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin: 0 auto;
}
.logo__grupo a {
    display: flex;
    position: relative;
}
.logo__grupo a + a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -15px;
    height: 100%;
    border-left: 1px solid currentcolor;
}
.logo__grupo a figure { height: 15.5px; }
.logo__grupo a figure img {
    object-fit: contain;
    object-position: center;
    width: 100%;
    height: 100%;
}
.txt__legal { color: rgb(var(--b02)); }
.txt__refe { opacity: .5; }


/* Extra Small Devices, Phones */ 
@media (max-width : 479px) {
}
@media (min-width : 480px) {
}
/* Small Devices, Tablets */
@media (min-width : 480px) and (max-width : 767px) {
}
@media (max-width : 679px) {
}
@media (min-width : 680px) {
.footer { font-size: 12px; }
.nav__footer {
    flex-direction: row;
    justify-content: space-around;
}

}
@media (min-width : 680px) and (max-width : 767px) {
}
/* Small Devices, Nav */
@media (max-width : 767px) {
}
/* Medium Devices to Large Devices */
@media (min-width : 768px) {
.footer .container { width: 95%; }
.foo__top {
    flex-direction: row-reverse;
    justify-content: space-between;
}
.top__01 { align-items: flex-end; }
.icon__grill { width: 300px; }
.foo__bot {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    line-height: 1.2;
    font-size: 12px;
}
.logo__grupo { min-width: 300px; }
.foo__bot .bot__02 {
    text-align: right;
    gap: 12px;
}

}
/* Medium Devices, Desktops */
@media (min-width : 768px) and (max-width : 991px) {
}
@media (max-width : 991px) {
}
@media (min-width : 992px) {
}
/* Large Devices, Wide Screens */
@media (min-width : 992px) and (max-width : 1200px) {
}
@media (max-width : 1199px) {
}
@media (min-width : 1200px) {
}