/*** Beauty, Medical, Wellness, Generales - INICIO ***/
.circuitos-personalizados,
.centro-de-belleza {
    .group-block {        
        padding:2rem 1.5rem;
        align-self:center;
        @media all and (max-width:984px) {
            order:1;
        }
        @media all and (min-width:985px) {
            padding:0 3rem;
        }
        @media all and (min-width:1650px) {
            flex-grow: 1;
        }
    }
    .image-block {
        height: 100%;
        width: 100%;
        justify-content: flex-end;
        @media all and (min-width:985px) {
            width: 50%;
        }
    }
    .image-block__image {
        aspect-ratio: 1/1;
        width: 100%;
        height: 100%;
        @media all and (max-width:984px) {
            order:0;
        }
        @media all and (min-width:1650px) {
            width: auto;
        }
    }
    .text-block {
        padding:0;
        p {
            line-height: 21px;
            font-weight: 300;
            font-size: 16px;
            padding:0 0 1rem 0;
        }
    }
    rte-formatter {
        align-items: flex-start!important;
    }
    h2 {
        font-size: 28px !important;
        padding-bottom: 1rem;
    }
    h3 {
        text-transform: none;
        text-align: left;
        margin:0;
    }
}
.centro-de-belleza {
    margin-bottom:5rem;
    .image-block {
        height: 100%;
        justify-content: flex-start;
    }
}
@media all and (max-width:984px) {
    .cgt-section {
        padding:2rem 0;
    }
}
.tratamientos-beauty-accesos {
    padding:1rem;
    max-width:1530px;
    margin:auto;
    font-family: var(--font-heading--family);
    @media all and (min-width:985px) {
        padding:3rem;
    }
    .group-block {
        position:relative;
        &::before {
            content:'';
            position:absolute;
            top:0;
            left:0;
            width:100%;
            height:100%;
            background:rgba(0,0,0,0.15);
            z-index:1;
        }
        h2 {
            position:absolute;
            margin:auto;
            text-align: center;
            bottom:0;
            right:0;
            left: 0;
            padding:2rem!important;
            color:#fff;
            z-index: 2;
        }
        .group-block-content {
            display: block;
            gap:1.5rem;
        }
        .group-block__link {
            z-index: 3;
            width:100%;
            height:100%;
        }
    }
}
.cgt-header {
    display: flex;
    text-align: center;
    max-width: 768px;
    margin:1rem auto 4rem;
    gap:1rem;
    flex-direction: column;
    h2.cgt-title {
        text-transform: none;
    }
    p.cgt-sub {
        font-weight: 300;
    }
}
/*** Beauty, Medical, Wellness, Generales - FIN ***/
/*** Nosotros - INICIO ***/
body.template-page #MainContent[data-template="page.nosotros"] {
    .hero-tarjeta {
        max-width: none;
        margin:auto;
        h4 {
            line-height: 40px;
            padding: 1rem;
        }
        p {
            padding:0 1rem;
        }
    }
    .centro-de-belleza,
    .circuitos-personalizados {
        margin-bottom:0;
        @media all and (max-width:984px) {
            h2,h3,h4,h5,h6 {
                font-size: 28px;
                line-height: 36px;
            }
        }         
        
    }
    .mision-valores-textos {
        padding:0;
        rte-formatter {
            padding:0;
        }
        h2, h3, h4, h5, h6 {
            font-size:21px;
            line-height: 24px;
            padding:2rem 0 0;
            @media all and (min-width:985px) {
                font-size:28px;
                line-height: 32px;
            }
        }
        p {
            font-weight: 300;
            font-size: 15px;
            line-height: 20px;
        }        
    }
    @media all and (max-width:984px) {
        .image-block {
            padding-right:0!important;
            padding-left:0!important;
        }
    }
}
/*** Nosotros - INICIO ***/

/*** Contacto - INICIO ***/
body.template-page #MainContent[data-template="page.contact"] {
    .contacto-centro {
        .group-block-content {
            h2 {
                padding-top:1rem;
                font-size:28px;
            }
            gap:1rem;
            p {
                font-weight: 300;
            }
        }
    }
    .links-contacto {
        margin-bottom:2rem;
        .group-block-content {
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
        }
        a:not(.button-secondary) {
            font-weight: 300;
            letter-spacing: 0.5px;
        }
    }
}
/*** Contacto - FIN ***/

/*** Asesoramiento - INICIO ***/
body.template-page #MainContent[data-template="page.asesoramiento"],
body.template-page #MainContent[data-template="page.diagnostico"],
body.template-page #MainContent[data-template="page.circuito"],
body.template-page #MainContent[data-template="page.trabaja-con-nosotros"],
body.template-page #MainContent[data-template="page.posparto"],
body.template-page #MainContent[data-template="page.embarazo"],
body.template-page #MainContent[data-template="page.primeraconsulta"],
body.template-page #MainContent[data-template="page.novias"],
body.template-page #MainContent[data-template="page.especialidades"],
body.template-page #MainContent[data-template="page.especialidad-page"]  {
    @media all and (max-width:984px) {
        h1 {
            padding:0;
        }
    }
    .asesoramiento-contenido {
        padding:1rem;
        max-width:1360px;
        margin:auto;
        @media all and (min-width:985px) {
            padding:3rem;
        }        
        > .group-block-content {
            display: flex;
            flex-direction: column;
            gap:5rem;
            @media all and (min-width:985px) {
                flex-direction: row;
            }
            .asesoramiento-contenido-left {
                flex:50%;
                h2 {
                    max-width: none;
                    margin: 0;
                    width: 100%;
                    text-align: left;
                    font-family: var(--font-body--family);
                    font-size: 18px;
                    padding:0 0 0.5rem;
                    @media all and (min-width:985px) {
                        padding:0 0 1rem;
                    }
                }
                p {
                    width:100%;
                    max-width: none;
                    font-weight: 300;
                    padding:0.25rem 0;
                    font-size:14px;
                    line-height: 20px;
                    @media all and (min-width:985px) {
                        font-size:15px;             
                        line-height: 21px;       
                    }  
                }
                .button {
                    margin-top:1rem;
                }
            }
            .asesoramiento-contenido-right {
                background:#f9f9f9;
                flex:50%;
                accordion-custom {
                    &:first-child {
                        .details {
                            border-top:0;                        
                        }
                    }
                    &:last-child {
                        .details {
                            border-bottom:0;
                        }
                    }
                    .details__header {
                        font-size: 14px;
                        font-weight: 400;
                        letter-spacing: 1px;
                        padding: 1rem;
                        line-height: 18px;
                        gap: 1rem;
                        @media all and (min-width:985px) {
                            font-size: 16px;
                            padding: 1rem 1.5rem;
                            line-height: 21px;
                            gap: 2rem;
                        }
                        .svg-wrapper {
                            max-width: 16px;
                            height: auto;
                            width: 100%;
                        }
                    }
                    .details-content {
                        p {
                            font-size: 14px;
                            font-weight: 300;
                            padding:0 1rem 1rem;
                            margin: 0;
                            line-height: 18px;
                            max-width: none;
                            @media all and (min-width:985px) {
                                padding:0 1.5rem 1rem;
                            }
                        }
                    }
                }
            }
        }
    }
    .section-content-wrapper {
        min-height: auto;
        padding:5rem 0;
    }
    .asesoramiento-iconos {
        @media all and (max-width:984px) {
            max-width: 280px;
            margin:2rem auto;
        }
        .group-block-content {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap:5%;
            @media all and (min-width:985px) {
                flex-direction: row;
            }
            .group-block-content {
                gap:2rem;
                @media all and (max-width:984px) {
                    gap:1rem;
                }
                p {
                    font-weight: 300;
                    font-size:14px;
                    line-height: 21px;
                }
            }            
        }        
    }
}
/*** ASesoramiento - FIN ***/

/*** Diagnostico - INICIO ***/ 
body.template-page #MainContent[data-template="page.diagnostico"],
body.template-page #MainContent[data-template="page.circuito"],
body.template-page #MainContent[data-template="page.trabaja-con-nosotros"],
body.template-page #MainContent[data-template="page.posparto"],
body.template-page #MainContent[data-template="page.embarazo"],
body.template-page #MainContent[data-template="page.primeraconsulta"],
body.template-page #MainContent[data-template="page.novias"],
body.template-page #MainContent[data-template="page.especialidades"],
body.template-page #MainContent[data-template="page.especialidad-page"] {
    .section.page-width-content {
        grid-template-columns: 1rem 1fr 1rem;
        @media all and (min-width:985px) {
            grid-template-columns: 3rem 1fr 3rem;
        }
    }
    @media all and (max-width:984px) {
        h1 {
            line-height: 32px;
            padding:5rem 0 0;
        }  
        .diagnostico-tabs {
            padding:1rem;
            .group-block-content {
                flex-direction: column;
            }
        }      
    }
    .asesoramiento-contenido {
        > .group-block-content {
            align-items: center;            
            .asesoramiento-contenido-left {
                .group-block-content {
                    @media all and (max-width:984px) {
                        gap:0;
                    }
                }
                .h3 {
                    font-size:28px;
                    line-height: 36px;
                    @media all and (max-width:984px) {
                        font-size:18px;
                        line-height: 24px;
                    }
                    p {
                        font-size:28px;
                        line-height: 36px;
                        @media all and (max-width:984px) {
                            font-size:18px;
                            line-height: 24px;
                        }
                    }                    
                }
                @media all and (max-width:984px) {
                    p {
                        margin:0;
                    }
                }
                .button-secondary {
                    margin-top:1rem;
                }
            }
            .asesoramiento-contenido-right {
                background:none;
                @media all and (max-width:984px) {
                    accordion-custom {
                        .details__header {
                            padding-left:0;
                            padding-right:0;
                        }
                        .details-content {
                            p {
                                padding:0 0 1rem;
                            }
                        }
                    }                    
                }
            }
        }
    }
    .section-content-wrapper {
        padding:0;        
    }
    .custom-section-background {
        display: none;
    }
    .centro-de-belleza {
        margin:3rem auto 0;
        @media all and (max-width:984px) {
            .group-block {
                padding:0;
                h2 {
                    font-size: 24px;
                    line-height: 28px;
                    margin-bottom: 0;
                }
            }           
        }
        .section-content-wrapper {
            padding:0 3rem;
            @media all and (max-width:984px) {
                padding:0 1rem;
                .diagnostico-contenido {
                    padding: 0;
                    h2 {
                        font-size:24px;
                        line-height: 28px;
                        margin-bottom:0;
                    }
                }
            }
            h1, h2 {
                font-size: 28px;
                line-height: 32px;
                margin-bottom: 1rem;
                padding:0;
                @media all and (min-width:985px) {
                    text-align: left;
                }
            }
            .button-secondary {
                margin-top:1rem;
            }
            p {
                line-height: 18px;
            }
            ul {
                padding:0;
                li {
                    font-weight: 300;
                    line-height: 19px;
                    font-size:15px;
                    margin-bottom:1rem;
                    list-style: none;
                    position:relative;
                    padding:0 0 0 20px;
                    &::before {
                        content:'';
                        display: block;
                        position:absolute;
                        top:4px;
                        left:0;
                        width:8px;
                        height:8px;
                        border-top:1px solid #000;
                        border-right:1px solid #000;
                        transform: rotate(45deg);
                    }
                }
            }
        }
    }
    .asesoramiento-iconos {
        max-width: 1100px;
        margin: 1rem auto;
        &:first-child {
            margin-top:3rem;
        }
        &:last-child {
            margin-bottom:3rem;
        }
        @media all and (max-width:984px) {
            margin: 0 auto;
            .group-block-content {
                margin-bottom:0.5rem;
            }
        }
        .group-block-content {
            .group-block-content {
                flex-direction: row;
                p {
                    font-size:16px;
                    @media all and (max-width:984px) {
                        font-size: 14px;
                        line-height: 18px;
                    }
                }
            }
        }        
    }
}
/*** Diagnostico - FIN ***/

/*** Editorial - INICIO ***/
body.template-page #MainContent[data-template="page.editorial"] {
    .tratamientos-beauty-accesos {
        .group-block-content {
            .group-block {
                .group-block-content {
                    rte-formatter {
                        h2 {
                            top: 0;
                            display: flex;
                            align-items: center;
                            text-transform: none;
                        }
                    }
                }
            }
        }
    }
}
/*** Editorial - FIN ***/

/*** Novias - INICIO ***/
body.template-page #MainContent[data-template="page.novias"] {
    .centro-de-belleza {
        .details__header {
            font-size: 14px;
            font-weight: 400;
            letter-spacing: 1px;
            padding: 1rem 0;
            line-height: 18px;
            gap: 1rem;
            @media all and (min-width:985px) {
                font-size: 16px;
                padding: 1rem 0;
                line-height: 21px;
                gap: 2rem;
            }
            .svg-wrapper {
                max-width: 16px;
                height: auto;
                width: 100%;
            }
        }
        .details-content {
            p {
                font-size: 14px;
                font-weight: 300;
                padding:0 0 1rem;
                margin: 0;
                line-height: 18px;
                max-width: none;
                @media all and (min-width:985px) {
                    padding:0 0 1rem;
                }
            }
        }
    }
}
/*** Novias - FIN ***/

/*** Especialidades - INICIO ***/
body.template-page #MainContent[data-template="page.especialidades"] {
    .centro-de-belleza {
        margin:5rem auto;
        @media all and (max-width:984px) {
            .section-content-wrapper {
                > .group-block {
                    order:1;
                }                
            }            
        }
    }
    .image-block {
        img {
            aspect-ratio:2/1;
            max-height:480px;
        }                    
    }
    .diagnostico-contenido {
        height:100%;
        .group-block-content {
            justify-content: flex-start;
        }        
        .menu {
            display: block!important;
            .menu__details {
                .details-content {
                    /* Solo aplica a la lista principal, no al sublist */
                    > ul:not(.menu__sublist) {
                        flex-direction: column;
                        border: 0;
                        justify-content: flex-start;
                        align-items: flex-start;
                        gap: 0.5rem;
                        width: 100%;
                        
                        > li {
                            padding: 0 0 0.5rem 0;
                            margin-bottom: 0;
                            border-bottom: 1px solid #ddd;
                            width: 100%;
                            
                            &::before {
                                display: none;
                            }
                            
                            > a {
                                text-transform: uppercase;
                                font-size: 15px;
                                font-weight: 300;
                                letter-spacing: 1px;
                                position:relative;
                                display: flex;
                                justify-content: space-between;                                
                            }
                            &.menu__item-parent {
                                a {
                                    &:after {
                                        content:'';
                                        width:20px;
                                        height:20px;
                                        background:url(../assets/icon-chevron-right.svg) center center no-repeat;
                                        display: block;
                                        transform: rotate(90deg);
                                    }
                                }
                            }
                            &.active {
                                > a {
                                   &:after {
                                    transform: rotate(-90deg);
                                   } 
                                }
                            }
                        }
                    }
                }
            }
        }                
    }
    
    /* Sublist: preservar animación grid */
    .menu__sublist {
        display: grid !important;
        grid-template-columns: 1fr;
        grid-template-rows: 0fr;
        overflow: hidden;
        transition: grid-template-rows 0.3s ease;
        padding-inline-start: 0;
        margin-block-start: 0;
        flex-direction: unset !important;
        border: 0 !important;
        gap: 0 !important;
        width: 100% !important;
        li {
            list-style:none;
            padding-left:0!important;
            &:before {
                display: none!important;
            }
        }
    }

    .menu__sublist-inner {
        min-height: 0;
    }

    .menu__sublist--open {
        padding-top:1rem!important;
        grid-template-rows: 1fr;
    }

    .menu__sublist .menu__item--child {
        padding: 0 0.5rem 0.5rem !important;
        border-bottom: 1px solid #eee !important;
        width: 100% !important;
        margin-bottom: 0.5rem !important;
        &:last-child {
            border-bottom: 0!important;
        }
        a {
            &:after {
                display: none!important;
            }
        }
    }
}
/*** Especialidades - FIN ***/

/*** Especialidad Page - INICIO ***/
body.template-page #MainContent[data-template="page.especialidad-page"] {
    .custom-section  {
        .section-content-wrapper {
            max-width: 1180px;
            margin: auto; 
            @media all and (max-width:985px) {
                text-align: center;
                align-items: center;
                justify-content: center;
                gap:1.5rem;
                height:auto!important;
                padding:3rem 0;
                h4 {
                    font-size:24px;
                    text-align: center;
                }
                p {
                    text-align: center;
                }
            }
            p {
                font-weight: 300;
            }
        }
    }  
    .especialidad-faqs {
        padding:16% 1rem;
        max-width:985px;
        margin:auto;
        @media all and (min-width:985px) {
            padding:8% 1rem;
        }
        h3 {
            text-transform: none;
            @media all and (max-width:984px) {
                font-size:24px;
                text-align: center;
            }
        }
        .details__header {
            text-transform: uppercase;
            font-weight: 400;
            border-bottom:1px solid #ddd;
        }
        .details-content {
            p {
                margin:1rem 0;
                font-weight: 300;
                font-size:16px;
                line-height: 24px;
            }
        }
    } 
    .featured-blog-posts {
        padding:3rem 0;
        h3 {
            text-transform: none;
            padding-bottom:1rem;
        }
        .image-block {
            aspect-ratio: 2 / 1;
            margin: 0 0 1rem;
        }
        .resource-list__carousel slideshow-slides {
            gap:2rem;
        }
        .featured-blog-posts-card__content h4 {
            font-family: var(--font-body-family);
            font-weight: 400;
            font-size:16px;
            line-height: 19px;
            margin: 0;
            text-transform: uppercase;
        }
        .blog-post-card__content-text {
            font-size: 14px;
            opacity: 0.75;
            margin: 0;
            font-weight: 300;
            line-height: 18px;
            padding:0;
        }
        @media all and (min-width:985px) {
            .slideshow-control {
                display:none!important;
            }
        }
    } 
}
/*** Especialidad Page - FIN ***/

/*** Page Generica - INICIO ***/
body.template-page #MainContent[data-template="page"] {
    
}
/*** Page Generica - FIN ***/