*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
}

body{
    background-color: #ffff;
    width: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;

    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    /* letter-spacing: -0.01rem; */
    position: relative;
    
}
section{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}


section.banner{
    padding-top: 78px;
}

section .content{
    width: 100%;
    max-width: 1366px;
    box-sizing: border-box;
    
    display: flex;
    align-items: center;
    justify-content: center;
    
    /* background: red; */
    height: 600px;
    height: calc(100vh - 78px);
}

/* == COMIENZA LANDING == */
.banner .content .text{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 1280px;
    gap: 2rem;
}
.banner .content .text h1{
    letter-spacing: 0.05rem;
    /* font-size: 3.625rem; */
    /* font-size: 3rem; */
    font-size: 3.5rem;
    text-align: center;
    line-height: 1;
    
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    
    color: #fff;
    /* text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3); */
    transition: all .3s ease;
}
.banner .content .text h1:hover{
    transform: scale(1.003);
    /* text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4); */
}

.banner .content .text .leads{
    font-size: 1rem;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.banner .content .text .leads .btns{
    display: flex;
    justify-content: center;
    gap: 1rem;
    font-size: .938rem;
}
.banner .content .text .leads .btns div{
    padding: .75rem;
    border: 1px solid #fff;
    border-radius: 8px;
    transition: all .3s ease;
}
.banner .content .text .leads .btns div:hover{
    /* transform: scale(1.01); */
    cursor: pointer;

    color: #fff;
    background-color: var(--green-c);
    border: 1px solid var(--green-c);
}
.banner .content .text .leads .btns .btn.clickeable{
    display: flex;
    align-items: center;
    gap: .5rem;
}

.banner .content .text .leads .btns .btn.clickeable.conocerpropuesta {
    --svg-size: 1rem;
    --svg-gap: .5rem;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--svg-gap);

    overflow: hidden;
}

/* texto visualmente centrado */
.banner .content .text .leads .btns .btn.clickeable.conocerpropuesta span {
    transform: translateX(
        calc((var(--svg-size) + var(--svg-gap)) / 2)
    );

    transition:
        transform .45s cubic-bezier(.16, 1, .3, 1);
}

/* svg oculto pero ocupa espacio */
.banner .content .text .leads .btns .btn.clickeable.conocerpropuesta svg {
    width: var(--svg-size);
    height: var(--svg-size);
    flex: 0 0 var(--svg-size);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateX(-.4rem);

    transition:
        opacity .25s ease,
        transform .45s cubic-bezier(.16, 1, .3, 1),
        visibility 0s linear .45s;
}

/* texto vuelve a posición */
.banner .content .text .leads .btns .btn.clickeable.conocerpropuesta:hover span {
    transform: translateX(0);
}

/* flecha visible */
.banner .content .text .leads .btns .btn.clickeable.conocerpropuesta:hover svg {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    
    transition-delay: 0s;
}

section.banner.videobanner{
    position: relative;
    overflow: hidden;

    min-height: 100vh;

    /* height: 100%; */
    /* max-height: 1080px; */

    display: flex;
    align-items: center;
    justify-content: center;
}
section.banner.videobanner .banner-video {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
}
section.banner.videobanner .banner-overlay {
    position: absolute;
    inset: 0;

    background: rgba(0, 0, 0, .3);
}

section.banner.videobanner .content {
    position: relative;
    z-index: 2;
}

section .content-noprimary{
    width: 100%;
    max-width: 1366px;
    box-sizing: border-box;
    
    display: flex;
    align-items: center;
    justify-content: center;
    
}
section.queesleybosques{
    background: var(--green-a);
}
section .content-noprimary.leybosques{
    display: flex;
    gap: 5rem;
    justify-content: start;
}
section .content-noprimary.leybosques .texto{
    /* background-color: blue; */
    color: #fff;
    display: flex;
    flex-direction: column;
    max-width: 80%;
    width: 100%;
    letter-spacing: -0.02rem;
    box-sizing: border-box;
    gap: 3rem;
}
section .content-noprimary.leybosques .texto .a{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
section .content-noprimary.leybosques .texto .a h2{
    letter-spacing: 0.05rem;
    font-size: 2.5rem;
    text-align: start;
    line-height: 1;
    
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    
    color: #fff;
    transition: all .3s ease;
}
section .content-noprimary.leybosques .ilust{
    /* background-color: yellow; */
    max-width: 100%;
    height: 30rem;
    display: flex;
    align-items: end;
    justify-content: end;
}
section .content-noprimary.leybosques .ilust img{
    height: 90%;
    width: auto;
    /* aspect-ratio: 1 / 1; */
    object-fit: cover;
    display: block;
}


section .content-noprimary.leybosques .texto .b .btn{
    display: inline-flex;
    padding: .5rem 1.5rem;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 8px;
    transition: all .3s ease;
    opacity: 0.5;
    cursor: pointer;
    transition: all .3s ease;
    font-size: .875rem;
}
section .content-noprimary.leybosques .texto .b .btn:hover{
    opacity: 1;
    border: 1px solid var(--green-c);
    background: var(--green-c);
    color: #fff;
}

section.queesotbn{
    background: #fff;
}
section.porqueserealiza{
    background: var(--gray-a);
    position: relative;
}
section.contacto{
    background: var(--gray-a);
    position: relative;
}
section .content-noprimary.otbn{
    display: flex;
    gap: 10rem;
    justify-content: center;
}
section .content-noprimary.otbn .texto{
    /* background-color: blue; */
    color: var(--black-a);
    display: flex;
    flex-direction: column;
    width: 80%;
    letter-spacing: -0.02rem;
    box-sizing: border-box;
    gap: 3rem;
    padding: 8rem 0;
}

section .content-noprimary.otbn .texto .a{
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
}
section .content-noprimary.otbn .texto .b{
    display: flex;
    flex-direction: column;
    gap: 1.325rem;
}
section .content-noprimary.otbn .texto .a h2{
    letter-spacing: 0.05rem;
    font-size: 2.5rem;
    text-align: center;
    line-height: 1;
    
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    
    color: var(--green-a);
    transition: all .3s ease;
}
section .content-noprimary.otbn .texto .a p{
    text-align: center;
}
section .content-noprimary.otbn .ilust{
    /* background-color: yellow; */
    max-width: 100%;
    height: 30rem;
    display: flex;
    align-items: end;
    justify-content: end;
}
section .content-noprimary.otbn .ilust img{
    height: 90%;
    width: auto;
    /* aspect-ratio: 1 / 1; */
    object-fit: cover;
    display: block;
}

section .content-noprimary.otbn .texto .tarjeta{
    padding: 1.5rem;
    border: 1px solid var(--green-b);
    border-radius: 8px;
    transition: all .3s ease;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    position: relative;
    gap: .5rem;
}
section .content-noprimary.otbn .texto .tarjeta.green-b:hover{
    background-color: var(--green-b);
    border: 1px solid var(--green-b);
    color: #fff;
}
section .content-noprimary.otbn .texto .tarjeta.green-b:hover span{
    color: #fff;
}

section .content-noprimary.otbn .texto .tarjeta span{
    text-transform: uppercase;
    letter-spacing: -0.01rem;
    font-size: 1.325rem;
    font-weight: 700;
    font-style: normal;
    color: var(--green-b);
    z-index: 60000;
}
section .content-noprimary.otbn .texto .tarjeta p{
    z-index: 50000;
}
section .content-noprimary.otbn .texto .tarjeta .itemfondo{
    height: 8rem;
    width: auto;
    aspect-ratio: 1 / 1;
    /* background-color: red; */
    position: absolute;
    bottom: 0;
    right: 0;

    opacity: 0.3;

    transform: translate(.75rem, .75rem);

    transition: all .3s ease;
    z-index: 40000;
}
section .content-noprimary.otbn .texto .tarjeta:hover .itemfondo{
    opacity: 0.3;
    height: 10rem;
    transform: translate(.5rem, .5rem);
}
section .content-noprimary.otbn .texto .tarjeta.green-b .itemfondo svg{
    fill: var(--green-b);
}
section .content-noprimary.otbn .texto .tarjeta:hover .itemfondo svg{
    fill: #fff;
}

section.porqueserealiza .content-noprimary.porque{
    z-index: 6000;
}

section.porqueserealiza .fondo{
    position: absolute;
    z-index: 5000;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
}

section.porqueserealiza .fondo .img.i1{
    width: 22rem;
    transform: translate(-6.5rem, -5rem);
}
section.porqueserealiza .fondo .img.i1 svg{
    width: 100%;
    height: 100%;
    fill: var(--green-f);
    opacity: .3;
}
section.porqueserealiza .fondo .img.d1{
    width: 24rem;
    transform: translate(15rem, 7rem);
}
section.porqueserealiza .fondo .img.d1 svg{
    width: 100%;
    height: 100%;
    fill: var(--green-f);
    opacity: .3;
}

section .content-noprimary.porque .texto{
    /* background-color: blue; */
    color: var(--black-a);
    display: flex;
    flex-direction: column;
    width: 80%;
    letter-spacing: -0.02rem;
    box-sizing: border-box;
    gap: 3rem;
    padding: 6rem 0;
}

section .content-noprimary.porque .texto .a{
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
}

section .content-noprimary.porque .texto .a h2{
    letter-spacing: 0.05rem;
    font-size: 2.5rem;
    text-align: center;
    line-height: 1;
    
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    
    color: var(--green-a);
    transition: all .3s ease;
}
section .content-noprimary.porque .texto .a .parrafo{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

section .content-noprimary.porque .texto .a p{
    text-align: center;
}

section .content-noprimary.porque .texto .b{
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-top: 1.5rem;
}
section .content-noprimary.porque .texto .b .titulo{
    letter-spacing: -0.02rem;
    font-size: 1rem;
    text-align: center;
    line-height: 1;
    
    /* font-family: "Tanker-Regular", sans-serif; */
    font-weight: 500;
    font-style: normal;
    
    color: var(--green-a);
    transition: all .3s ease;
}
section .content-noprimary.porque .texto .b .categorias{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}
section .content-noprimary.porque .texto .b .categorias .c{
    width: 100%;
    /* padding: 1.5rem; */
    
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    /* gap: .75rem; */
    background-color: #fff;
    transition: background-color .3s ease, color .25s ease;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.16);
    overflow: hidden;
    position: relative;

    
    /* padding-bottom: 12rem; */
    height: 40rem;
}
section .content-noprimary.porque .texto .b .categorias .c .info{
    padding: 1.5rem;
    z-index: 9000;
}

section .content-noprimary.porque .texto .b .categorias .c img{
    position: absolute;
    /* background-color: blue; */
}
section .content-noprimary.porque .texto .b .categorias .c img.rojoimg{
    height: 20rem;
    bottom: 0;
    right: 0;
    transform: translate(1rem, .1rem);
    display: none;
}
section .content-noprimary.porque .texto .b .categorias .c .rojovideo{
    position: absolute;
    
    width: 85%;
    bottom: 0;
    right: 0;

    width: 80%;
    
    width: 110%;
    object-fit: cover;
    transform: translate(0, .5rem);
}
section .content-noprimary.porque .texto .b .categorias .c img.amarilloimg{
    height: 28rem;
    bottom: 0;
    right: 0;
    transform: translate(0, 6.5rem);
    display: none;
}
section .content-noprimary.porque .texto .b .categorias .c .amarillovideo{
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    transform: translate(0, 8rem);
}
section .content-noprimary.porque .texto .b .categorias .c img.verdeimg{
    height: 25rem;
    bottom: 0;
    right: 0;
    transform: translate(14rem, .1rem);
    display: none;
}
section .content-noprimary.porque .texto .b .categorias .c .verdevideo{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    object-fit: cover;
    transform: translate(0, 1rem);
}
section .content-noprimary.porque .texto .b .categorias .c img.blancoimg{
    height: 30rem;
    bottom: 0;
    right: 0;
    transform: translate(0rem, .875rem);
    display: none;
}
section .content-noprimary.porque .texto .b .categorias .c .blancovideo{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    object-fit: cover;
    transform: translate(0rem, .1rem);
}
section .content-noprimary.porque .texto .b .categorias .c .t{
    letter-spacing: 0.04rem;
    font-family: "Tanker-Regular", sans-serif;
    font-size: 1.75rem;
    font-weight: 500;
}
section .content-noprimary.porque .texto .b .categorias .c .bd{
    font-size: .938rem;
}
section .content-noprimary.porque .texto .b .categorias .c:hover .t{
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.rojo .t{
    color: var(--red-a);
}
section .content-noprimary.porque .texto .b .categorias .c.rojo{
    background: var(--red-a);
    background: var(--red-b);
    background: var(--red-c);
    background: var(--red-d);
    /* background: -webkit-linear-gradient(130deg, rgba(234, 78, 67, 1) 0%, rgba(230, 69, 57, 1) 100%); */
    /* background: -moz-linear-gradient(130deg, rgba(234, 78, 67, 1) 0%, rgba(230, 69, 57, 1) 100%); */
    /* background: linear-gradient(130deg, rgba(234, 78, 67, 1) 0%, rgba(230, 69, 57, 1) 100%); */
    /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#EA4E43", endColorstr="#E64539", GradientType=0); */
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.rojo .t{
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.amarillo .t{
    color: var(--yellow-a);
}
section .content-noprimary.porque .texto .b .categorias .c.amarillo{
    background: var(--yellow-a);
    background: var(--yellow-b);
    background: var(--yellow-c);
    /* background: -webkit-linear-gradient(130deg, rgba(252, 185, 0, 1) 0%, rgba(235, 176, 14, 1) 100%); */
    /* background: -moz-linear-gradient(130deg, rgba(252, 185, 0, 1) 0%, rgba(235, 176, 14, 1) 100%); */
    /* background: linear-gradient(130deg, rgba(252, 185, 0, 1) 0%, rgba(235, 176, 14, 1) 100%); */
    /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FCB900", endColorstr="#EBB00E", GradientType=0); */
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.amarillo .t{
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.verde .t{
    color: var(--green-f);
}
section .content-noprimary.porque .texto .b .categorias .c.verde{
    background: var(--green-j);
    /* background: -webkit-linear-gradient(130deg, rgba(127, 183, 126, 1) 0%, rgba(112, 176, 111, 1) 100%); */
    /* background: -moz-linear-gradient(130deg, rgba(127, 183, 126, 1) 0%, rgba(112, 176, 111, 1) 100%); */
    /* background: linear-gradient(130deg, rgba(127, 183, 126, 1) 0%, rgba(112, 176, 111, 1) 100%); */
    /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7FB77E", endColorstr="#70B06F", GradientType=0); */
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.blanco{
    background: var(--gray-e);
}
section .content-noprimary.porque .texto .b .categorias .c.verde .t{
    color: #fff;
}
section .content-noprimary.porque .texto .b .categorias .c.blanco .t{
    color: var(--green-a);
}
section .content-noprimary.porque .texto .b .categorias .c.blanco .bd{
    color: var(--green-a);
}
section.contacto .banda{
    width: 100%;
    display: flex;
    align-items: end;
}
section.contacto .banda {
    transform: translate(0rem, 0.5rem);
}
section.contacto .banda svg{
    width: 100%;
    fill: var(--green-c);
}
section.contacto footer{
    width: 100%;
    background-color: var(--green-c);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 2rem
}
section.contacto footer .footer{
    width: 100%;
    /* background-color: var(--green-c); */
    /* background-color: red; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 1280px;
    gap: 2rem;
}
section.contacto footer .footer .texto-introductorio{
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

section.contacto footer .footer .texto-introductorio h2{
    letter-spacing: 0.05rem;
    font-size: 4rem;
    text-align: start;
    line-height: 1;
    
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    
    color: #fff;
    transition: all .3s ease;
}

section.contacto footer .footer .texto-introductorio .datosdecontacto{
    padding: 3rem 0;
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
section.contacto footer .footer .line{
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #fff;
    opacity: 50%;
}
section.contacto footer .footer .texto-introductorio .medioscontacto{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    padding: 1rem 0;
}
section.contacto footer .footer .texto-introductorio .medioscontacto .datocontacto{
    display: flex;
    flex-direction: row;
    gap: 1rem;
}
section.contacto footer .footer .texto-introductorio .medioscontacto .datocontacto svg {
    width: 2rem;
    fill: #fff;
}
section.contacto footer .footer .texto-introductorio .medioscontacto .datocontacto > div:last-child {
    display: flex;
    flex-direction: column;
}
section.contacto footer .footer .texto-introductorio .medioscontacto .datocontacto > div:last-child a{
    text-decoration: none;
    color: #fff;
}
section.contacto footer .footer .texto-introductorio .medioscontacto .datocontacto > div:last-child > span:first-child{
    letter-spacing: 0.05rem;
    line-height: 1;
    
    text-transform: uppercase;
    font-weight: 600;
    font-size: .825rem;
    font-style: normal;
}
section.contacto footer .footer form{
    padding-top: 2rem;
    padding-bottom: 4rem;
    width: 100%;
}
section.contacto footer .footer form .campos{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
section.contacto footer .footer form .campos .linea{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem 2rem;
}
section.contacto footer .footer form .campos .linea .campo{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
section.contacto footer .footer form .campos .linea .campo label{
    letter-spacing: 0.05rem;
    line-height: 1;
    text-transform: uppercase;
    font-weight: 500;
    font-size: .825rem;
    font-style: normal;
}
section.contacto footer .footer form .campos .linea .campo input,
section.contacto footer .footer form .campos .linea .campo textarea{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    outline: none;
    padding: .75rem;
    border: 1px solid var(--green-c);
    border-radius: 8px;
    transition: all .3s ease;
    background-color: #fff;
    resize: none;
    color: var(--green-a);
    font-size: 1rem;
}
section.contacto footer .footer form .campos .linea .campo input::placeholder,
section.contacto footer .footer form .campos .linea .campo textarea::placeholder{
    color: var(--gray-b);
    font-weight: 400;
}

section.contacto footer .footer form .campos .linea .campo.asunto {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 3rem;
}

.campo.asunto label,
.campo.asunto input {
    grid-column: span 2;
}
section.contacto footer .footer form .campos .linea .campo.mensaje {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 3rem;
}

.campo.mensaje label,
.campo.mensaje textarea {
    grid-column: span 3;
}
section.contacto footer .footer form .campos .linea .campo.checkbox {
    grid-column: 1 / -1;
}
section.contacto footer .footer form .campos .linea .campo.checkbox div{
    display: flex;
    gap: .5rem;
    
}
section.contacto footer .footer form .campos .linea .campo.checkbox label{
    text-transform: none;
    font-weight: 400;
    font-size: .938rem;
    font-style: normal;
    letter-spacing: initial;
}

section.contacto footer .footer form .campos .linea button{
    max-width: fit-content;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    outline: none;
    padding: .5rem 1.5rem;
    border: 1px solid var(--green-c);
    border-radius: 8px;
    transition: all .3s ease;
    background-color: #fff;
    resize: none;
    color: var(--green-a);
    font-size: .875rem;
    cursor: pointer;
}
section.contacto footer .footer form .campos .linea button:hover{
    border: 1px solid var(--green-f);
    background-color: var(--green-f);
    color: #fff;
}
section.contacto footer .footer form .campos .linea button:active{
    border: 1px solid var(--green-b);
    background-color: var(--green-b);
    color: #fff;
}

section.contacto footer .creditos{
    width: 100%;
    background-color: var(--green-a);
    display: flex;
    flex-direction: column;
    align-items: center;
}

section.contacto footer .creditos .elements{
    width: 100%;
    /* background-color: red; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 1280px;
    gap: 3rem;
    padding: 4rem 0;
    padding-bottom: 3rem;
}
section.contacto footer .creditos .elements .credits-grid{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* v3.1 */
    grid-template-columns: repeat(1, 1fr);
    gap: 3rem;
    /* font-size: .938rem; */
    letter-spacing: -0.02rem;
}
section.contacto footer .creditos .elements .credits-grid div{
    display: flex;
    flex-direction: column;
    align-items: center;
}
section.contacto footer .creditos .elements .credits-grid .org{
    gap: 1.5rem;
    color: #fff;
    fill: #fff;
    text-align: justify;
    /* v3.1 */
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: end;
    align-items: center;
}


section.contacto footer .creditos .elements .credits-grid .org > svg:first-child {
    width: 100%;
    /* v3.1 */
    width: 20rem;
}
section.contacto footer .creditos .elements .credits-grid .org a {
    width: 2rem;
}
section.contacto footer .creditos .elements .credits-grid .org a:hover svg {
    fill: var(--green-f);
}

section.contacto footer .creditos .elements .copy{
    font-size: .75rem;
    display: flex;
    flex-direction: column;
    gap: .25rem;
    color: #fff;
}
section.contacto footer .creditos .elements .copy a{
    color: #fff;
}
section.contacto footer .creditos .elements .copy a:hover{
    color: var(--green-f);
}
section.contacto footer .creditos .elements .copy .firma{
    color: #425056;
    color: #33444b;
    text-align: center;
}

/* == TERMINA LANDING == */

/* == COMIENZA NOSOTROS == */
section.nosotros-nombre{
    position: relative;
    overflow: hidden;
    min-height: 100dvh;
    /* height: 100%; */
    /* max-height: 1080px; */
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--green-a);
    padding-top: 78px;
    
}
section.nosotros-nombre .backingimg{
    position: absolute;
    opacity: 0.25;
    filter: blur(1px);
    transition: all .5s ease;
    pointer-events: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
section.nosotros-nombre:hover .backingimg{
    filter: blur(5px);
}
section.nosotros-nombre:hover .texto{
    transform: scale(1.01);
}
section .content-noprimary.nosotros .texto{
    /* background-color: blue; */
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 100%;
    width: 100%;
    letter-spacing: -0.02rem;
    box-sizing: border-box;
    gap: .5rem;
    transition: all .3s ease;
}
section .content-noprimary.nosotros .texto span{
    line-height: 1;
}
section .content-noprimary.nosotros .texto > span:nth-child(1){
    font-size: 5rem;
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
}
section .content-noprimary.nosotros .texto > span:nth-child(2){
    font-size: 1.25rem;
    /* font-family: "ClashDisplay-Regular", sans-serif; */
    letter-spacing: .15rem;
    font-weight: 400;
    font-style: normal;
}

section.lainstitucion{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--green-b);
    background-color: var(--gray-a);
}

section .content-noprimary.institucion {
    padding: 10rem 0rem;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}
section .content-noprimary.institucion .texto{
    color:var(--green-a);
    display: flex;
    flex-direction: column;
    max-width: 100%;
    width: 100%;
    max-width: 60%;
    letter-spacing: -0.02rem;
    box-sizing: border-box;
    gap: .75rem;
    transition: all .3s ease;
    z-index: 2000;
}
section .content-noprimary.institucion .texto > span:nth-child(1){
    line-height: 1;
    font-size: 5rem;
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: var(--green-b);
}
section .content-noprimary.institucion .ilust{
    height: 100%;
    position: absolute;
    right: 6rem;
    z-index: 1000;
}
section .content-noprimary.institucion .ilust img{
    height: 120%;
}

section .content-noprimary.actividades {
    display: flex;
    flex-direction: column;
    padding: 6rem 0;
    gap: 5rem;
}
section .content-noprimary.actividades .texto-principal{
    display: flex;
    flex-direction: column;
    max-width: 100%;
    width: 100%;
    gap: .75rem;
    align-items: center;
    justify-content: center;
}
section .content-noprimary.actividades .texto-principal h2{
    line-height: 1;
    font-size: 3rem;
    font-family: "Tanker-Regular", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: var(--brown-c);
}
section .content-noprimary.actividades .texto-principal p{
    text-align: center;
}
section .content-noprimary.actividades .lista-actividades{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
}
section .content-noprimary.actividades .lista-actividades .item-actividad{
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .7rem 1rem;
    border-radius: 6px;
    color: #fff;
    color: var(--brown-c);
    background-color: transparent;
    /* background-color: var(--brown-c); */
    
    border: 2px solid var(--brown-c);
    font-weight: 500;
}
section .content-noprimary.actividades .texto-complementario{
    text-align: center;
}
section.contacto.nosotrospage{
    background: #fff;
}



/* == TERMINA NOSOTROS == */


/* == COMIENZA MAPA-INTERACTIVO == */
.contenedor-mapa-interactivo{
    width: 100%;
    height: 100vh;
    background-color: var(--gray-j);
    padding-top: 78px;
}
/* == TERMINA MAPA-INTERACTIVO == */







/* desktop / notebook */
@media (max-width: 1366px) {


    /* == COMIENZA LANDING == */
    section:not(.contacto) {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    footer .texto-introductorio,
    footer .creditos {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    /* == TERMINA LANDING == */
    
    /* == COMIENZA NOSOTROS == */

    /* == TERMINA NOSOTROS == */

}
/* notebook pequeño / tablet horizontal */
@media (max-width: 1080px) {
    #header{
        padding: revert;
    }


    /* == COMIENZA LANDING == */
    .content-noprimary .texto{
        width: 100% !important;
        /* padding: 4rem 0; */
        text-align: justify;
    }
    /* == TERMINA LANDING == */

    /* == COMIENZA NOSOTROS == */
    section .content-noprimary.nosotros .texto > span:nth-child(1) {
        font-size: 4rem;
    }
    section .content-noprimary.institucion {
        padding: revert;
    }
    section .content-noprimary.institucion .texto {
        padding: 6rem 0;
    }
    section .content-noprimary.institucion .ilust {
        right: 2rem;
    }
    /* == TERMINA NOSOTROS == */
}

/* tablet vertical */
@media (max-width: 768px) {


    /* == COMIENZA LANDING == */
    section .content {
        margin-top: -3rem;
    }
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(1){
        font-size: 2rem;
    }
    body > section.banner.videobanner > div.content > div > div > p{
        text-align: center;
    }
    section.queesleybosques {
        position: relative;
        overflow: hidden;
    }
    section .content-noprimary.leybosques {
        gap: 0;
    }
    section .content-noprimary.leybosques .texto {
        z-index: 2000;
        padding: 5rem 0;
    }
    section .content-noprimary.leybosques .ilust {
        position: absolute;
        z-index: 1500;
        opacity: 0.5;
        top: -1.5rem;
        right: -11rem;
    }
    section .content-noprimary.otbn .texto {
        padding: 5rem 0;
    }
    section .content-noprimary.otbn .texto .a p {
        text-align: justify;
    }
    
    section .content-noprimary.porque .texto {
        padding: 5rem 0;
    }
    section .content-noprimary.porque .texto .a p {
        text-align: justify;
    }
    section .content-noprimary.porque .texto .b .categorias {
        grid-template-columns: repeat(1, 4fr);
    }
    section .content-noprimary.porque .texto .b .categorias .c {
        height: initial;
    }
    section .content-noprimary.porque .texto .b .categorias .c .info{
        padding-right: 10rem;
    }
    section .content-noprimary.porque .texto .b .categorias .c .rojovideo {
        width: 25%;
        transform: translate(0, 1.5rem);
    }
    section .content-noprimary.porque .texto .b .categorias .c .amarillovideo {
        width: 25%;
        transform: translate(34rem, 0.5rem) scaleX(-1);
    }
    section .content-noprimary.porque .texto .b .categorias .c .verdevideo {
        width: 25%;
        transform: translate(0, 1.5rem);
    }
    section .content-noprimary.porque .texto .b .categorias .c .blancovideo {
        display: none;
    }
    
    body > section.contacto > footer > div.footer > div{
        text-align: justify;
    }
    section.contacto footer .footer .texto-introductorio .medioscontacto {
        grid-template-columns: repeat(1, 1fr);
    }
    section.contacto footer .footer form .campos .linea {
        grid-template-columns: repeat(1, 1fr);
        gap: 1.5rem 2rem;
    }
    .campo.asunto label, .campo.asunto input {
        grid-column: span 3;
    }
    section.contacto footer .creditos .elements .credits-grid .org {
        font-size: .875rem;
    }
    section.contacto footer .creditos .elements .credits-grid .org > svg:first-child {
        width: 15rem;
    }
    /* == TERMINA LANDING == */

    /* == COMIENZA NOSOTROS == */
    section .content-noprimary.nosotros .texto > span:nth-child(1) {
        font-size: 3rem;
    }
    section .content-noprimary.institucion .texto {
        max-width: 100%;
    }
    section .content-noprimary.institucion .texto > span:nth-child(1) {
        font-size: 4rem;
    }
    section .content-noprimary.institucion .ilust{
        opacity: 0.2;
    }
    /* == TERMINA NOSOTROS == */

}

/* móvil grande */
@media (max-width: 600px) {


    /* == COMIENZA LANDING == */
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(1){
        font-size: 1.5rem;
    }
    section .content-noprimary.leybosques .ilust {
        top: 1.5rem;
        right: -11rem;
    }
    section .content-noprimary.porque .texto .b .categorias .c .rojovideo {
        width: 34%;
        transform: translate(0, 1.5rem);
    }
    section .content-noprimary.porque .texto .b .categorias .c .amarillovideo {
        width: 34%;
        transform: translate(23rem, 0.5rem) scaleX(-1);
    }
    section .content-noprimary.porque .texto .b .categorias .c .verdevideo {
        width: 25%;
        transform: translate(0, 1.5rem);
    }
    /* == TERMINA LANDING == */


    /* == COMIENZA NOSOTROS == */
    section .content-noprimary.nosotros .texto > span:nth-child(1) {
        font-size: 2.25rem;
    }
    section .content-noprimary.nosotros .texto > span:nth-child(2) {
        font-size:.918rem;
    }
    section .content-noprimary.institucion .texto > span:nth-child(1) {
        font-size: 3rem;
    }
    section .content-noprimary.institucion .ilust{
        opacity: 0.1;
        right: 0;
    }
    section .content-noprimary.actividades .texto-principal {    
        align-items: start;
    }
    section .content-noprimary.actividades .texto-principal h2 {
        font-size: 3rem;
    }
    section .content-noprimary.actividades .texto-principal p {
        text-align: justify;
    }
    section .content-noprimary.actividades {
        gap: 2rem;
    }
    section .content-noprimary.actividades .lista-actividades .item-actividad {
        justify-content: start;
    }
    section .content-noprimary.actividades .texto-complementario {
        text-align: justify;
    }
    /* == TERMINA NOSOTROS == */


}

/* móvil */
@media (max-width: 480px) {


    /* == COMIENZA LANDING == */
    section .content {
        margin-top: -8rem;
    }
    body > section.banner.videobanner > div.content > div > h1{
        line-height: .85;
    }
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(1){
        font-size: 1rem;
    }
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(3){
        font-size: 3rem;
    }
    section .content-noprimary.leybosques .texto {
        padding: 5rem 0;
        max-width: 100%;
    }
    section .content-noprimary.leybosques .ilust {
        opacity: 0.25;
        top: 3.5rem;
    }
    section .content-noprimary.otbn .texto .tarjeta {
        font-size: .875rem;
    }
    section .content-noprimary.otbn .texto .tarjeta span {
        font-size: 1.125rem;
    }
    section .content-noprimary.porque .texto .b .categorias .c .info {
        padding-right: 1.5rem;
    }
    section .content-noprimary.porque .texto .b .categorias .c .rojovideo {
        opacity: 0.5;
        width: 50%;
        transform: translate(0, 1.5rem);
    }
    section .content-noprimary.porque .texto .b .categorias .c .amarillovideo {
        opacity: 0.5;
        width: 50%;
        transform: translate(15rem, 0.5rem) scaleX(-1);
    }
    section .content-noprimary.porque .texto .b .categorias .c .verdevideo {
        opacity: 0.5;
        width: 50%;
        transform: translate(0, 1.5rem);
    }

    section.contacto footer .footer .texto-introductorio h2 {
        font-size: 3rem;
    }
    /* == TERMINA LANDING == */


    /* == TERMINA NOSOTROS == */
    section .content-noprimary.nosotros .texto > span:nth-child(1) {
        font-size: 3.5rem;
        text-align: center;
    }
    section .content-noprimary.nosotros .texto > span:nth-child(2) {
        font-size: .75rem;
    }
    section .content-noprimary.institucion .texto > span:nth-child(1),
    section .content-noprimary.actividades .texto-principal h2{
        font-size: 2.5rem;
    }
    /* == COMIENZA NOSOTROS == */

}

/* iphone actuales */
@media (max-width: 390px){
    html{
        font-size: 95%;
    }


    /* == COMIENZA LANDING == */
    body > section.banner.videobanner > div.content > div > h1{
        line-height: .75;
    }
    
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(1){
        font-size: 1rem;
    }
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(3){
        font-size: 2.5rem;
    }
    
    .banner .content .text .leads .btns {
        flex-direction: column;
    }
    body > section.banner.videobanner > div.content > div > div > div > div:nth-child(2){
        text-align: center;
    }
    
    section .content-noprimary.leybosques .texto h2{
        font-size: 1.875rem !important;
    }
    
    section .content-noprimary.otbn .texto h2{
        font-size: 1.875rem !important;
    }
    
    section .content-noprimary.porque .texto h2{
        font-size: 1.875rem !important;
    }
    section .content-noprimary.porque .texto .b .categorias .c .bd {
        font-size: .875rem;
    }
    section.contacto footer .footer .texto-introductorio h2 {
        font-size: 1.875rem !important;
    }
    /* == TERMINA LANDING == */

    /* == COMIENZA NOSOTROS == */
    section .content-noprimary.nosotros .texto > span:nth-child(1) {
        font-size: 3rem;
    }
    section .content-noprimary.nosotros .texto > span:nth-child(2) {
        font-size: .5rem;
    }


    /* == TERMINA NOSOTROS == */


}
/* móviles medianos */
@media (max-width: 375px){

}

/* androids */
@media (max-width: 360px){
    html{
        font-size: 90%;
    }
}
/* móviles pequeños/antiguos */
@media (max-width: 320px){
    html{
        font-size: 85%;
    }


    /* == COMIENZA LANDING == */
    body > section.banner.videobanner > div.content > div > h1 > span:nth-child(1){
        font-size: .918rem;
    }
    /* == TERMINA LANDING == */


    /* == COMIENZA NOSOTROS == */
    section .content-noprimary.nosotros .texto > span:nth-child(1) {
        font-size: 2.5rem;
    }
    section .content-noprimary.nosotros .texto > span:nth-child(2) {
        font-size: .5rem;
    }

    section .content-noprimary.institucion .texto > span:nth-child(1),
    section .content-noprimary.actividades .texto-principal h2{
        font-size: 2rem;
    }

    /* == TERMINA NOSOTROS == */



}