/*
Theme Name: Somo Child
Template: somo
Version: 1.0.0
*/




/* BANNER DESKTOP */
sr7-module[data-alias="desktop"] {
    display: block !important;
}

sr7-module[data-alias="mobile"] {
    display: none !important;
}
.sr7-arrows{
	background:transparent !important;
}
.sr7-arrows:before{
	font-size:20px !important;
}

/* BANNER MOBILE */
@media (max-width: 800px) {
    sr7-module[data-alias="desktop"] {
        display: none !important;
    }

    sr7-module[data-alias="mobile"] {
        display: block !important;
    }
}

/*HEADER*/
.site-header{
	background-color:rgba(0,0,0,0.8) !important;
}

/*GENERAL*/
html {
    scroll-behavior: smooth;
}
.sidebar-butter{
	display:none !important;
}
.nav-arrows .prev, .nav-arrows .next{
	color:#000;
}
/*MENU*/
.menu-item a span:before{
	display:none !important;
}
.menu-item a span{
	transition:all 0.5s ease;
}
.menu-item a span:hover{
	color:#ff0000;
}
.categories-carousel{
	padding: 80px 0px 40px 0px !important;
}
.categories-carousel .swiper-slide .title{
	color:#757575 !important;
}
.text-t1{
	color:#000 !important;
}
.accordion-block .accordion-item .top{
	color:#000 !important;
	font-weight:900 !important;
}
.accordion-block .accordion-item .wrap{
	color:#000 !important;
}
.accordion-item .button{
	color:#000 !important;
}
/*CARUSEL DE INSTAGRAM*/
#sec-ig .brand-item{
	margin-right:10px !important;
}
#sec-ig .brand-item img{
	border-radius:10px;
}
#sec-ig .nav-arrows{
	margin-right:30px;
	top: -30px !important;
}


/*INTERIOR PROYECTOS*/
#page{
	background-color:#f5f1f2 !important;
}
.project-single-page h1,
.project-single-page .wp-block-paragraph,
.project-single-page .sub-h{
	color:#000 !important;
}

/*GRID PORTAFOLIO*/
.filter-buttons .wrap .button,
.filter-buttons .wrap .button.current span{
	color:#000 !important;
}
.filter-buttons .wrap .button:hover,
.filter-buttons .wrap .button span:hover{
	font-weight:900 !important;
	color:#000 !important;
}
.filter-buttons .wrap .button.current:before{
	background:#000 !important;
}

/*FOOTER*/
.site-footer{
	background:#000 !important;
}
.footer-bottom{
	display:block;
}
.m21-footer__logo{
	width:100px !important;
}

/* =========================================================
   FOOTER M21 STUDIO
========================================================= */

#contacto.site-footer {
    background: #000 !important;
    color: #fff;
    padding: 0 !important;
    margin: 0 !important;
}

#contacto.site-footer .container {
    width: 100% !important;
    max-width: none !important;
    padding: 80px 10% 50px 10% !important;
}

#contacto.site-footer .row {
    display: grid !important;
    grid-template-columns: 40% 20% 40% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================================
   COLUMNA IZQUIERDA
========================================================= */

#contacto .m21-footer__brand {
    position: relative;
    min-height: 390px;
    width: 100%;
    padding: 0 !important;
}

#contacto .m21-footer__eyebrow {
    margin: 0 0 25px !important;

    color: #ff3218;
    font-size: 16px;
    line-height: 1;
    font-weight: 400;
    letter-spacing: 8px;
}

#contacto .m21-footer__phrase {
    display: flex;
    flex-direction: column;

    margin: 0 !important;

    font-size: 30px;
    line-height: 0.94;
    font-weight: 300;
    letter-spacing: -1.5px;
}

#contacto .m21-footer__phrase span,
#contacto .m21-footer__phrase strong {
    display: block;
    margin: 0;
}

#contacto .m21-footer__phrase strong {
    color: #ff3218;
    font-weight: 500;
}


/* =========================================================
   LINEA
========================================================= */

#contacto .m21-footer__separator {
    width: 345px;
    max-width: 100%;
    height: 1px;

    margin: 19px 0 18px !important;

    background: #3d3d3d;
}


/* =========================================================
   CTA
========================================================= */

#contacto .m21-footer__cta {
    display: flex;
    flex-direction: column;

    margin: 0 !important;

    font-size: 48px;
    line-height: 0.93;
    font-weight: 200;
    letter-spacing: -2.5px;
}

#contacto .m21-footer__cta span,
#contacto .m21-footer__cta strong {
    margin: 0;
    padding: 0;
}

#contacto .m21-footer__cta strong {
    font-weight: 800;
}


/* =========================================================
   REDES
========================================================= */

#contacto .m21-footer__social {
    position: absolute;

    left: 405px;
    bottom: 10px;

    display: flex;
    align-items: center;
    gap: 28px;

    margin: 0 !important;
}

#contacto .m21-footer__social a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    margin: 0;
    padding: 0;

    color: #fff;
    text-decoration: none;
}

#contacto .m21-footer__social svg {
    display: block;

    width: 28px;
    height: 28px;

    fill: none;
    stroke: currentColor;
    stroke-width: 2.5;
}

#contacto .m21-footer__social a:last-child svg {
    fill: currentColor;
    stroke: none;
}


/* =========================================================
   COLUMNA DERECHA
========================================================= */

#contacto .m21-footer__contact {
    width: 100%;
    padding: 0 0 0 0 !important;
    margin: 0 !important;
}

#contacto .m21-footer__contact-title {
    height: 40px;

    padding: 0 0 18px !important;
    margin: 0 !important;

    color: #fff;
    font-size: 20px;
    line-height: 1;
    font-weight: 300;

    border-bottom: 1px solid #3d3d3d;
}

#contacto .m21-footer__contact-row {
    min-height: 92px;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    margin: 0 !important;
    padding: 0 6px !important;

    border-bottom: 1px solid #3d3d3d;

    font-size: 19px;
    line-height: 1;
}

#contacto .m21-footer__contact-row span {
    color: #686868;
    font-weight: 400;
}

#contacto .m21-footer__contact-row a {
    color: #686868;
    font-weight: 400;
    text-decoration: none;
}

#contacto .m21-footer__contact-row a:hover {
    color: #fff;
}


/* =========================================================
   FOOTER BOTTOM
========================================================= */

#contacto .footer-bottom {
    margin: 60px 0 0 !important;
    padding: 0 !important;
}

#contacto .footer-bottom .left-text {
    color: #aaaaaa;
    font-size: 13px;
	margin-top:10px;
}


/* =========================================================
   BACK TO TOP
========================================================= */

#contacto .scroll-to-top-button {
    /* mantenemos el comportamiento de Somo */
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    #contacto.site-footer .row {
        grid-template-columns: 1fr !important;
        gap: 70px;
    }

    #contacto .m21-footer__brand {
        min-height: auto;
    }

    #contacto .m21-footer__social {
        position: static;
        margin-top: 40px !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    #contacto.site-footer .container {
        padding: 50px 25px 45px !important;
    }

    #contacto.site-footer .row {
        gap: 55px;
    }

    #contacto .m21-footer__eyebrow {
        font-size: 12px;
        letter-spacing: 5px;
        margin-bottom: 22px !important;
    }

    #contacto .m21-footer__phrase {
        font-size: 25px;
    }

    #contacto .m21-footer__separator {
        width: 100%;
    }

    #contacto .m21-footer__cta {
        font-size: 38px;
    }

    #contacto .m21-footer__contact-title {
        font-size: 18px;
    }

    #contacto .m21-footer__contact-row {
        min-height: 75px;
        padding: 0 3px !important;
        font-size: 15px;
    }

    #contacto .m21-footer__contact-row a {
        text-align: right;
    }

    #contacto .footer-bottom {
        margin-top: 40px !important;
    }

}