/* @group Zero Emision
------------------------------------ */

/* General Text
----------------------*/
h1 { font: 700 6em / 1em var(--body-font); padding-bottom: 2rem; position: relative; text-transform: none;}
h1::before { content: none; }
h2, h3, .page-template-zero-emision .project-timeline h2 { font: 700 4.4em / 1em var(--body-font); padding-bottom: 1.5rem; text-transform: uppercase; position: relative;}
p,
li { font: 400 2.4em / 1.5em var(--body-font); }
p strong { font-weight: 700 ; }
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    h1 { font-size: 3.6em; }
}


/* Nav */
@media only screen
and (min-width : 961px) {
    .page-template-zero-emision .site-nav + .secondary-hero__container, 
    .page-template-zero-emision .site-nav + section.banner-video { margin-top: 15.5rem; }
    .page-template-zero-emision .site-nav .main-menu { margin-top: 2.1rem; }
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .page-template-zero-emision .site-nav + .secondary-hero__container,
    .page-template-zero-emision .site-nav + section.banner-video { margin-top: 6.3rem; }
}


/* Reorder */

@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .reorder-container {
        display: flex;
        flex-direction: column;
    }
    .reorder-container .project-benefits__container {
        order: -1;
    }
}

/* Top section */

.has-leaves {
    position: relative;
}
@media only screen
and (min-width : 961px) {
    .page-template-zero-emision .has-leaves {
        padding-top: 8.5rem;
        padding-bottom: 8.6rem;
    }
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .page-template-zero-emision .has-leaves {
        padding-top: 3rem;
    }
}
/* Leaves on top section */

@media only screen
and (min-width : 961px) {
    .has-leaves::before {
        content: '';
        width: 17.2rem;
        height: 19.7rem;
        background-image: url('../../imgs/layout/patterns/leaves.png');
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        pointer-events: none;
    }
    .has-leaves::after {
        content: '';
        width: 17.2rem;
        height: 19.7rem;
        background-image: url('../../imgs/layout/patterns/leaves.png');
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        bottom: 0;
        right: 0;
        z-index: 1;
        pointer-events: none;
        transform: scaleX(-1) scaleY(-1);
    }
}

.has-leaves::before,
.has-leaves::after {opacity: 0;}

.has-leaves.animateActive::before,
.has-leaves.animateActive::after {animation: fade 1.6s forwards;}

.has-leaves.animateActive::before,
.has-leaves.animateActive::after {animation-delay:1.6s;}  

@media only screen and (min-width: 961px) and (max-width: 1500px) {
    .has-leaves::before, .has-leaves::after {
    width: 12.6rem;
    height: 14.3rem;
}
}

/* @end */