/**
Theme Name: Modulare
Author: Moio
Author URI: https://moio.io
Description: Modulare maquetas
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: modulare
Template: astra
*/

@font-face {
	font-family: 'IBM Sans';
	src: url('assets/fonts/IBMPlexSans-VariableFont_wdth,wght.woff2');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Inter';
    src: url('assets/fonts/Inter-VariableFont_opsz,wght.woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('assets/fonts/Inter-Italic-VariableFont_opsz,wght.woff2');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

/* Vars */

:root {
    --font-primary: 'Inter', sans-serif;
    --font-secondary: 'IBM Sans', sans-serif;
}

/*  Elementor + Astra fixes  */
@media (max-width: 544px) {
    .ast-separate-container #content .ast-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
body.elementor-template-full-width.ast-separate-container .site-content .ast-container {
    padding: 0;
    max-width: 100% !important;
}
body.elementor-template-full-width .site-content .ast-container {
    padding: 0;
    max-width: 100% !important;
}
body.elementor-template-full-width.ast-separate-container .site-content .ast-container .ast-article-single {
    padding: 0;
}

/* Basic */

html, body {
    font-family: 'Inter', sans-serif;
}

body {
    .elementor img,
    img {
        border-radius: 10px;
    }
}
button {
    font-weight: 700;
}

.entry-content .elementor-widget-text-editor p:not(:last-child),
.entry-content .elementor-widget-text-editor p:only-child {
    margin-bottom: 0;
}

/* ---------------------------------
   Header
----------------------------------*/


/* Mobile Menu */

.ast-mobile-popup-header {
    .menu-toggle-close {
        position: absolute;
        top: 35px;
        padding: 0 !important;
        .ahfb-svg-iconset svg {
            width: 40px;
            height: 40px;;
        }
    }
}

.ast-mobile-popup-content {
    margin-block: auto;
    .main-header-menu .menu-item {
        font-size: clamp(30px, 6vw, 50px);
        text-align: right;
        font-family: var(--font-secondary);
        font-weight: 700;
        text-transform: uppercase;
        line-height: 1.2;
        letter-spacing: 0.05em;
        &:hover {
            letter-spacing: 0.1em;
        }
    }

    aside:has(.modulare_icon) {
        position: absolute;
        top: 0;
        left: 0;
        padding: 15px 30px;
        figure {
            img {
                border-radius: 0;
            }
        }
    }
    
}

/* Header */
#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper {
    padding-inline: 24px;

    @media screen and (width >= 768px) {
        padding-inline: 30px;
    }
    @media screen and (width >= 992px) {
        padding-inline: 60px;
    }
}

.site-branding .ast-logo-svg-icon svg {height: auto;}
.modulare_logo {}

/* options to make the header work with mix-blend mode */

/* ONLY FOR TRANSPARENT VARIATION */
.ast-theme-transparent-header header {mix-blend-mode: exclusion;}
/*.ast-theme-transparent-header header .main--logo svg {
    width: 5rem;height:auto;
    @media screen and (width >= 768px) {
        width: 6.25rem;
    }
    @media screen and (width >= 992px) {
        width: 7.5rem;
    }
}*/
.ast-theme-transparent-header  header svg.modulare_logo *,
.ast-theme-transparent-header  header .header__toggle svg * {
    /* fill: var(--ast-global-color-0); */
    fill: #fff;
}

.ast-theme-transparent-header .site-header .ast-builder-menu-1 .menu-item > .menu-link {
    color: #fff;
}

body:not(.ast-theme-transparent-header) header svg.modulare_logo * {
    fill: var(--ast-global-color-0) !important;
}




/* ---------------------------------
   Footer
----------------------------------*/

footer {


    .site-above-footer-wrap[data-section="section-above-footer-builder"] .ast-builder-grid-row,
    .site-primary-footer-wrap[data-section="section-primary-footer-builder"] .ast-builder-grid-row,
    .site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
        max-width: 100%;
        padding-inline: 24px;
    }
    .site-above-footer-wrap[data-section="section-above-footer-builder"] .ast-builder-grid-row,
    .site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
        min-height: 0;
    }
    .site-above-footer-wrap[data-section="section-above-footer-builder"],
    .site-primary-footer-wrap[data-section="section-primary-footer-builder"] {
        padding-top: 60px;
        padding-bottom: 40px;
        .ast-builder-grid-row {
            gap: 2rem;
        }
    }
    /* .site-above-footer-wrap[data-section="section-above-footer-builder"], */
    .site-primary-footer-wrap[data-section="section-primary-footer-builder"],
    .site-below-footer-wrap[data-section="section-below-footer-builder"] {
        min-height: 0;
        padding-block: 15px;
    }
    p {margin: 0;}

    h2 {
        font-size: 1.94rem;
        text-transform: uppercase;
        font-weight: 700;
        font-family: var(--font-secondary);

    }

    .address_wrapper {
        container-name: direccion;
        container-type: inline-size;
    }
    address {
        display: grid;
        font-style: normal;
        gap: 2rem;
        text-align: center;
        p {margin: 0;}

        > div {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1rem;
        }
        .title {
            text-align: center;
            font-family: var(--font-secondary);
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            font-size: 1.11em;
        }
        a {
            color: var(--ast-global-color-3);
            &:hover {
                color: var(--ast-global-color-0);

            }
        }
    }
    
    @container direccion (width >= 500px) {
        address {
            > div {
                grid-template-columns: 1fr 2fr;
            }
            .title {
                text-align: right;
            }
            .content {
                text-align: left;
            }
        }
    }


    .logo_digitalizadores {
        img {
            width: min(100%, 802px);
            display: block;
            margin-inline: auto;
        }
    }

    .ast-footer-copyright {
        p {font-size: 14px;}
    }
    
    @media screen and (width >= 768px) {
        .site-above-footer-wrap[data-section="section-above-footer-builder"] .ast-builder-grid-row,
        .site-primary-footer-wrap[data-section="section-primary-footer-builder"] .ast-builder-grid-row,
        .site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
            padding-inline: 30px;
        }
    }
    @media screen and (width >= 992px) {
        .site-above-footer-wrap[data-section="section-above-footer-builder"] .ast-builder-grid-row,
        .site-primary-footer-wrap[data-section="section-primary-footer-builder"] .ast-builder-grid-row,
        .site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
            padding-inline: 60px;
        }
    }
}


/* ---------------------------------
   Gravity
----------------------------------*/
body .gform-theme[class*="gform-theme--"]{

    .gfield input[type="text"],
    .gfield input[type="email"],
    .gfield textarea {
        border-radius: 0;
        border: 0 none;
        border-bottom: 1px solid var(--ast-global-color-3);
        box-shadow: none;
        padding-inline: 0;
        padding-block: 1em;
        font-size: 25px;
        font-weight: 400;
        &:focus {
            outline-color: var(--ast-global-color-6);
            outline-offset: 6px;
        }
    }
    textarea {
        min-block-size: 6em !important;
    }
    input[type="submit"] {
        background-color: var(--ast-global-color-0) !important;
        &:hover {
            background-color: var(--ast-global-color-1) !important;
        }
    }
}



/* ---------------------------------
   Content
----------------------------------*/
.hero_home {

    .elementor-widget-slides,
    .elementor-slides-wrapper,
    .swiper-slide {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100% !important;

        .swiper-pagination-bullet {
            width: 12px;
            height: 12px;

            border: 2px solid #fff !important;
            opacity: 1;
            background-color: #ffffff00;
            &.swiper-pagination-bullet-active {
                background-color: #fff;
            }
        }

    }
    

    .swiper-slide-inner {
        text-align: left !important;
        align-items: end !important;
        justify-content: flex-start !important;
        .swiper-slide-contents {
            z-index: 9 !important;
            .elementor-slide-button {
                background-color: var(--ast-global-color-0);
                color: var(--ast-global-color-4);
                border: 0 none;
                &:hover {
                    background-color: var(--ast-global-color-1);
                    color: var(--ast-global-color-4);
                }
                .elementor-button-content-wrapper {
                    gap: 1em;
                }
            }
        }


    }

    .elementor-widget-slides .elementor-slide-heading {
        font-family: var(--font-secondary);
        text-transform: uppercase;
        font-weight: 700;
        letter-spacing: 0.05em;
        font-size: 38px;
        max-width: 30ch;
    }


    .swiper-slide {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
	.elementor-element .swiper .swiper-image-stretch .swiper-slide .swiper-slide-image {
		height: 100dvh;
		width: auto;
		object-fit: cover;
	}
    .elementor-widget-n-carousel .swiper-pagination-bullet {
        background-color: transparent !important;
        border: 1.5px solid #fff;
        width: 11px;
        height: 11px;
        &.swiper-pagination-bullet-active {
            background-color: #fff !important;
        }
    }
    h2 {
        font-family: var(--font-secondary);
        text-transform: uppercase;
        font-weight: 700;
        letter-spacing: 0.05em;
        font-size: 38px;
        max-width: 30ch;
    }

    .swiper-slide {
        position: relative;
        > div {
            /* position: relative; */
            &.swiper-slide-bg::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;

                background: linear-gradient(0deg,rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
                opacity: .5;
                /* opacity: .1; */
            }
        }
        /* Adjust gradient for Auditorium image */
        &:has(a[href*="tenerife-auditorium-section-model"]) {
            .swiper-slide-bg::before {
                opacity: 0.2 !important;
            }
        }
    }

    /* Ken Burns effect */
    .swiper-slide.swiper-slide-active {

    }
}

body:has(.contact_page--wrapper) footer {
    .site-primary-footer-wrap[data-section="section-primary-footer-builder"] {
        border-top: 0 none;
        padding-top: 0;
        padding-bottom: 100px;
        h2 {
            color: var(--ast-global-color-3);
        }
    }
}

/* ---------------------------------
   Single
----------------------------------*/
body.single.single-post {
    .elementor-divider h2 {
        margin-bottom: 0;
    }
}

body.single.single-proyecto {
    
}

.single_project--wrapper {
    .elementor-widget-image-carousel.e-widget-swiper {
        height: fit-content !important;
        padding-bottom: 60px !important;
    }
    .elementor-image-carousel-wrapper {
        /* border: 1px solid #C4C8CA; */
        border-radius: 10px;
        padding-bottom: 0 !important;
        .elementor-swiper-button.elementor-swiper-button-prev,
        .elementor-swiper-button.elementor-swiper-button-next {
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1rem;
            background: #C4C8CA;
            width: 30px;
            height: 30px;
            border-radius: 50%;
        }
        .swiper-pagination {
            position: absolute;
            bottom: 15px !important;
        }
    }

    h1 {
        color: var(--ast-global-color-3);
        font-family: var(--font-secondary);
        font-weight: 700;
        font-size: 1.667rem;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        line-height: 1.2em;
    }
    .categories_labels__wrapper {
        font-size: 0;
        display: flex !important;
        flex-wrap: wrap;
        gap: 5px;
        > span {
            font-size: 12px;
            color: var(--ast-global-color-1);
            padding: 5px 10px;
            border-radius: 5px;
            background-color: var(--ast-global-color-6);
            font-weight: 500;
            line-height: 1.2;
        }
    }

    .project_info {
        
    }
    .project_info--extra {
        .title {
            display: block;
            color: var(--ast-global-color-3);
            font-family: var(--font-secondary);
            font-weight: 700;
            font-size: 1.11rem;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            line-height: 1.2em;
            margin-bottom: 5px;
        }
        ul {
            margin: 0;
            list-style-type: none;
            a {color: var(--ast-global-color-3);&:hover{color: var(--ast-global-color-0);}}
        }
    }

}


/* a.clients-archive__wrapper {
    background: red !important;
} */
.clients-archive__wrapper {
    a& {
        text-decoration: none !important;
    }
    h3 {
        text-transform: uppercase;
        color: var(--ast-global-color-3);
        font-family: var(--font-primary);
        font-weight: 500;
        font-size: 1rem;
    }
}

.custom-clients--wrapper {
    .elementor-pagination {
        padding-top: 2rem;
        .page-numbers {
            font-size: 0;
            width: 28px;
            height: 28px;
            background-color: var(--ast-global-color-0);
            border-radius: 50%;
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            
            span& {
                background-color: #C4C8CA;
            }

            &::before {
                content: '';
                background-repeat: no-repeat;
                background-size: contain;
                background-position: center center;
                width: 0.8rem;
                height: 0.8rem;
            }
            &.prev::before {
                background-image: url("data:image/svg+xml,%3Csvg width='8' height='15' viewBox='0 0 8 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.47773 0.857147L8 2.42381L3.05533 7.52381L8 12.6238L6.47773 14.1905L0 7.52381L6.47773 0.857147Z' fill='white'/%3E%3C/svg%3E%0A");
            }
            &.next::before {
                background-image: url("data:image/svg+xml,%3Csvg width='9' height='15' viewBox='0 0 9 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.85576 0.857147L0.333496 2.42381L5.27817 7.52381L0.333496 12.6238L1.85576 14.1905L8.3335 7.52381L1.85576 0.857147Z' fill='white'/%3E%3C/svg%3E%0A");
            }
        }
        @media screen and (width >= 500px) {
            position: absolute;
            top: -2.6rem;
            right: 0;
            padding-top: 0;
        }
    }
}

/* ---------------------------------
Archive
----------------------------------*/

/* default loops */
.e-loop-item {

    border: 0 none !important;

    a.elementor-element {

        .elementor-widget-theme-post-featured-image {
            border: 1px solid var(--ast-global-color-8);
            border-radius: 10px;
            overflow: hidden;
            img {
                width: 100%;
                transition: transform .3s ease-in-out;
                aspect-ratio: 16 / 10;
                object-fit: cover;
            }
        }
        h3 {
            transition: all .2s ease-in-out;
        }
        
        &:hover {
            .elementor-widget-theme-post-featured-image {
                img {
                    transform: scale(1.2);
                }
                
            }
            h3 {
                color: var(--ast-global-color-0);
            }
        }

        .elementor-widget-theme-post-excerpt {
            p {
                margin: 0;
            }
        }
    }
}

.elementor-widget-taxonomy-filter .e-filter {
    .e-filter-item {
        box-shadow: none;
        color: var(--ast-global-color-3);
        border: 0 none;
        border-radius: 5px;
        padding: 10px 15px;
        font-family: var(--font-secondary);
        font-weight: 600;
        line-height: 1.2;
        &:not([aria-pressed=true]):hover {
            background-color: #f2f2f2;
        }
        &[aria-pressed=true] {
            background-color: var(--ast-global-color-0);
            color: var(--ast-global-color-4);
        }
    }
}


.projects_list--wrapper {
    h3 {
        color: var(--ast-global-color-3);
        font-family: var(--font-secondary);
        font-weight: 700;
        font-size: 1.11rem;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }
    .elementor-post-info__terms-list {
        font-size: 0;
        display: flex !important;
        flex-wrap: wrap;
        gap: 5px;
        > span {
            font-size: 12px;
            color: var(--ast-global-color-1);
            padding: 5px 10px;
            border-radius: 5px;
            background-color: var(--ast-global-color-6);
            font-weight: 500;
            line-height: 1.2;
        }
    }

    .elementor-pagination {
        padding-top: 2rem;
        span.page-numbers {display: none;}
        a.page-numbers {
            color: var(--ast-global-color-3);
            &:hover {
                color: var(--ast-global-color-0);
            }
        }
        .page-numbers {
            .elementor-button-content-wrapper {gap: 1em;}
            svg * {
                fill: currentColor;
            }
        }
    }
}


/* ---------------------------------
   Blog
----------------------------------*/

.blog_list--wrapper,
.blog_list--wrapper--related {

    .elementor-widget-theme-post-featured-image {
        aspect-ratio: 600 / 360;
        overflow: hidden;
        border-radius: 10px;
        img {
            border-radius: 0 !important;
            transition: transform 0.3s ease-in-out;
        }
    }
    
    a:hover {
        .elementor-widget-theme-post-featured-image {
            img {
                transform: scale(1.1);
                transform-origin: center center;
            }
        }
        .elementor-icon-wrapper svg * {transition: fill 0.2s ease-in-out;}
        .elementor-icon-wrapper svg * {
            fill: var(--ast-global-color-0) !important;
        }
    }

    h3 {
        color: var(--ast-global-color-3);
        font-family: var(--font-secondary);
        font-weight: 700;
        font-size: 1.11rem;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }
    time {
        color: var(--ast-global-color-8);
        text-transform: uppercase;
        font-size: 14px;
    }
    .elementor-widget-theme-post-excerpt {
        color: var(--ast-global-color-3);
    }
    .categories_labels__wrapper {
        font-size: 0;
        display: flex !important;
        flex-wrap: wrap;
        gap: 5px;
        > span {
            font-size: 12px;
            height: fit-content;
            color: var(--ast-global-color-1);
            padding: 5px 10px;
            border-radius: 5px;
            background-color: var(--ast-global-color-6);
            font-weight: 500;
            line-height: 1.2;
        }
    }
    .elementor-widget-container .elementor-loop-container {
        &.elementor-grid {
            --gap: 2rem;
            --gap-v: 2rem;
            display: flex !important;
            flex-flow: row;
            flex-wrap: wrap;
            gap: var(--gap) !important;
            > div.e-loop-item[data-elementor-type="loop-item"] {
                margin-bottom: 0 !important;
                padding: 0 !important;
                border: 0 none;
                position: relative;

                .elementor-icon svg {
                    width: 16px !important;
                    height: auto !important;
                }
            }
        }
    }
    .elementor-icon {
        svg * {
            fill: var(--ast-global-color-3) !important;
        }
    }

    .e-loop__load-more.elementor-button-wrapper {

    }
}

.blog_list--wrapper--related {
    .elementor-widget-container .elementor-loop-container {
        &.elementor-grid {
            @media screen and (500px <= width < 1000px) {
                div.e-loop-item[data-elementor-type="loop-item"] {
                    width: calc(50% - (var(--gap) / 2));
                    &:nth-child(odd) {
                        &::before {
                            content: '';
                            position: absolute;
                            width: 1px;
                            background-color: #B3B3B3;
                            height: 100%;
                            right: calc( -1 *  (var(--gap) / 2));
                        }
                    }
                    &:nth-child(2) {
                        width: 100%;
                    }
                }
            }
            @media screen and (width >= 1000px) {
                > div.e-loop-item[data-elementor-type="loop-item"] {
                    width: calc(33.333% - (var(--gap) * 2 / 3));

                    &:nth-child(2),
                    &:nth-child(3) {
                        &::before {
                            content: '';
                            position: absolute;
                            width: 1px;
                            background-color: #B3B3B3;
                            height: 100%;
                            right: calc( -1 *  (var(--gap) / 2));
                        }
                    }
                }
            }
        }
    }
}


.blog_list--wrapper {
    .elementor-widget-container .elementor-loop-container {
        &.elementor-grid {

            --gap: 2rem;
            --gap-v: 2rem;


            display: flex !important;
            flex-flow: row;
            flex-wrap: wrap;
            gap: var(--gap) !important;
            > div.e-loop-item[data-elementor-type="loop-item"] {
                margin-bottom: 0 !important;
                padding: 0 !important;
                border: 0 none;
                position: relative;

                .elementor-icon svg {
                    width: 28px !important;
                    height: auto !important;
                }
            }



            @media screen and (600px <= width < 1000px) {

                --gap: 3rem;

                > div.e-loop-item[data-elementor-type="loop-item"] {
                    width: calc(50% - (var(--gap) / 2));

                    &:nth-child(odd) {
                        /* background-color: red; */
                        &::before {
                            content: '';
                            position: absolute;
                            width: 1px;
                            background-color: #B3B3B3;
                            height: 100%;
                            right: calc( -1 *  (var(--gap) / 2));
                        }
                    }

                    &:nth-child(2) {
                        width: 100%;
                    }
                }
            }
            @media screen and (width >= 1000px) {

                --gap: 4rem;

                > div.e-loop-item[data-elementor-type="loop-item"] {
                    width: calc(33.333% - (var(--gap) * 2 / 3));
                    &:nth-child(2),
                    &:nth-child(3) {
                        width: calc(50% - (var(--gap) / 2));
                    }

                    &:nth-child(3n + 2),
                    &:nth-child(3n + 4) {
                        &::before {
                            content: '';
                            position: absolute;
                            width: 1px;
                            background-color: #B3B3B3;
                            height: 100%;
                            right: calc( -1 *  (var(--gap) / 2));
                        }
                    }
                }
            }
        }
    }
}

#adaptive-carousel {
    height: auto !important;
    .swiper {
        height: auto !important;
    }
    .swiper-wrapper {
        align-items: flex-start !important; 
    }
    .swiper-slide {
        height: auto !important;
    }
}