/* ==========================================================
   NUESTRO ENFOQUE V2
   pages/acerca-de.html
========================================================== */

.nuestro-enfoque-page {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    color: #3f4652;
}

.nuestro-enfoque-page * {
    min-width: 0;
}


/* HERO */

.enfoque-hero {
    position: relative;
    isolation: isolate;

    padding:
        clamp(3.25rem, 6vw, 5.25rem)
        0;

    background:
        linear-gradient(
            120deg,
            rgba(17,16,53,.93),
            rgba(77,23,90,.86)
        ),
        url("../../img/slideshow2.webp")
        center / cover
        no-repeat;

    color: #fff;
}

.enfoque-hero::after {
    content: "";

    position: absolute;
    inset: 0;
    z-index: -1;

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(255,255,255,.15),
            transparent 30%
        );

    pointer-events: none;
}


.enfoque-kicker,
.enfoque-section-kicker {
    margin: 0;

    color: #b60ca5;

    font-size: .82rem;
    font-weight: 800;

    letter-spacing: .12em;
    line-height: 1.35;

    text-transform: uppercase;
}

.enfoque-hero
.enfoque-kicker {
    color: #ffd7fa;
}


.enfoque-hero h1 {
    max-width: 760px;

    font-size:
        clamp(
            2.15rem,
            4.8vw,
            4.2rem
        );

    line-height: 1.05;

    text-wrap: balance;
}


.enfoque-hero-lead {
    max-width: 760px;

    color:
        rgba(
            255,
            255,
            255,
            .92
        );

    font-size:
        clamp(
            1rem,
            1.5vw,
            1.16rem
        );

    line-height: 1.75;
}


.enfoque-hero-actions {
    display: flex;
    flex-wrap: wrap;

    gap: .8rem;

    align-items: center;
}


.enfoque-hero-actions .btn,
.enfoque-cta-actions .btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 52px;

    line-height: 1.2;

    white-space: normal;

    text-align: center;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background-color .25s ease,
        border-color .25s ease;
}


.enfoque-hero-actions .btn:hover,
.enfoque-cta-actions .btn:hover {
    transform:
        translateY(-2px);
}


.enfoque-btn-outline {
    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .72
        );

    background:
        rgba(
            255,
            255,
            255,
            .08
        );

    color: #fff;

    backdrop-filter:
        blur(6px);
}


.enfoque-btn-outline:hover,
.enfoque-btn-outline:focus {
    border-color: #fff;

    background: #fff;

    color: #6d176f;
}


/* HERO IMAGE */

.enfoque-hero-visual {
    position: relative;

    overflow: hidden;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .22
        );

    border-radius: 26px;

    background:
        rgba(
            255,
            255,
            255,
            .08
        );

    box-shadow:
        0 28px 70px
        rgba(
            0,
            0,
            0,
            .24
        );
}


.enfoque-hero-visual img {
    display: block;

    width: 100%;

    aspect-ratio: 5 / 4;

    object-fit: cover;
}


.enfoque-hero-note {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr);

    gap: .8rem;

    align-items: center;

    padding: 1rem 1.1rem;

    background:
        rgba(
            16,
            14,
            45,
            .92
        );

    color: #fff;

    font-size: .92rem;

    line-height: 1.5;
}


.enfoque-hero-note i {
    color: #ffd0f6;

    font-size: 1.25rem;
}


/* SECCIONES */

.enfoque-section {
    padding:
        clamp(
            3rem,
            5vw,
            4.75rem
        )
        0;
}


.enfoque-intro {
    background: #fff;
}


.enfoque-copy {
    max-width: 820px;
}


.enfoque-copy > h2 {
    color: #16223d;

    font-size:
        clamp(
            2rem,
            3.4vw,
            3rem
        );

    line-height: 1.16;

    text-wrap: balance;
}


.enfoque-copy > .lead {
    color: #4c5360;

    font-size:
        clamp(
            1.03rem,
            1.35vw,
            1.16rem
        );

    line-height: 1.8;
}


.enfoque-copy > p {
    font-size: 1rem;

    line-height: 1.82;
}


/* PRINCIPIOS */

.enfoque-principle {
    display: grid;

    grid-template-columns:
        52px
        minmax(0, 1fr);

    gap: 1rem;

    margin-top: 1.35rem;

    padding: 1.3rem;

    border:
        1px solid
        rgba(
            47,
            54,
            81,
            .08
        );

    border-radius: 18px;

    background: #fbfbfd;

    box-shadow:
        0 12px 28px
        rgba(
            25,
            30,
            55,
            .05
        );

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}


.enfoque-principle:hover {
    transform:
        translateY(-3px);

    border-color:
        rgba(
            182,
            12,
            165,
            .18
        );

    box-shadow:
        0 18px 38px
        rgba(
            25,
            30,
            55,
            .08
        );
}


.enfoque-principle-icon {
    display: grid;

    width: 52px;
    height: 52px;

    place-items: center;

    border-radius: 15px;

    background:
        linear-gradient(
            135deg,
            #f7e7f6,
            #eef2ff
        );

    color: #8e178f;

    font-size: 1.35rem;
}


.enfoque-principle h3 {
    margin:
        0
        0
        .55rem;

    color: #1d2944;

    font-size: 1.18rem;

    line-height: 1.35;
}


.enfoque-principle p {
    margin-bottom: .75rem;

    color: #596170;

    line-height: 1.75;
}


.enfoque-principle p:last-child {
    margin-bottom: 0;
}


.enfoque-closing {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr);

    gap: .9rem;

    align-items: start;

    margin-top: 1.5rem;

    padding: 1.15rem 1.25rem;

    border-left:
        4px solid
        #9e159f;

    border-radius:
        0
        16px
        16px
        0;

    background: #f9eef8;
}


.enfoque-closing i {
    margin-top: .1rem;

    color: #9e159f;

    font-size: 1.25rem;
}


.enfoque-closing p {
    margin: 0;

    color: #4e4250;

    line-height: 1.7;
}


/* COLUMNA DERECHA */

.enfoque-aside {
    position: sticky;

    top: 1rem;

    overflow: hidden;

    border:
        1px solid
        rgba(
            49,
            55,
            82,
            .09
        );

    border-radius: 24px;

    background: #fff;

    box-shadow:
        0 22px 55px
        rgba(
            24,
            30,
            58,
            .10
        );
}


.enfoque-aside-image {
    overflow: hidden;

    background: #f2f3f8;
}


.enfoque-aside-image img {
    display: block;

    width: 100%;

    max-height: 430px;

    object-fit: cover;

    object-position: center;

    transition:
        transform
        .65s ease;
}


.enfoque-aside:hover
.enfoque-aside-image img {
    transform:
        scale(1.025);
}


.enfoque-aside-card {
    padding: 1.5rem;
}


.enfoque-aside-icon {
    display: grid;

    width: 46px;
    height: 46px;

    margin-bottom: .9rem;

    place-items: center;

    border-radius: 14px;

    background: #f5e6f5;

    color: #981399;

    font-size: 1.25rem;
}


.enfoque-aside-card h3,
.enfoque-reflection h3 {
    color: #172541;

    font-size: 1.25rem;

    line-height: 1.35;
}


.enfoque-aside-card p {
    color: #626a77;

    line-height: 1.7;
}


.enfoque-reflection {
    padding: 1.5rem;

    background:
        linear-gradient(
            135deg,
            #17244d,
            #6e236e
        );

    color: #fff;
}


.enfoque-reflection h3 {
    color: #fff;
}


.enfoque-reflection ul {
    display: grid;

    gap: .75rem;

    margin: 0;

    padding: 0;

    list-style: none;
}


.enfoque-reflection li {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr);

    gap: .65rem;

    align-items: start;

    color:
        rgba(
            255,
            255,
            255,
            .93
        );

    line-height: 1.55;
}


.enfoque-reflection li i {
    margin-top: .15rem;

    color: #ffd7fa;
}


/* PILARES */

.enfoque-pillars {
    background:
        linear-gradient(
            180deg,
            #f8f9fc,
            #f3f5fa
        );
}


.enfoque-heading {
    max-width: 780px;

    margin-bottom: 2.2rem;
}


.enfoque-heading h2 {
    margin:
        .4rem
        0
        .75rem;

    color: #182541;

    font-size:
        clamp(
            1.9rem,
            3.2vw,
            2.8rem
        );

    line-height: 1.18;

    text-wrap: balance;
}


.enfoque-heading > p:last-child {
    margin-bottom: 0;

    color: #697180;

    line-height: 1.7;
}


.enfoque-pillar-card {
    height: 100%;

    padding: 1.45rem;

    border:
        1px solid
        rgba(
            46,
            53,
            78,
            .08
        );

    border-radius: 20px;

    background: #fff;

    box-shadow:
        0 12px 30px
        rgba(
            31,
            38,
            65,
            .06
        );

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


.enfoque-pillar-card:hover {
    transform:
        translateY(-5px);

    box-shadow:
        0 20px 42px
        rgba(
            31,
            38,
            65,
            .10
        );
}


.enfoque-pillar-icon {
    display: grid;

    width: 54px;
    height: 54px;

    margin-bottom: 1rem;

    place-items: center;

    border-radius: 16px;

    background:
        linear-gradient(
            135deg,
            #f7e5f6,
            #eef2ff
        );

    color: #961397;

    font-size: 1.45rem;
}


.enfoque-pillar-card h3 {
    color: #1a2948;

    font-size: 1.15rem;

    line-height: 1.35;
}


.enfoque-pillar-card p {
    margin-bottom: 0;

    color: #687080;

    line-height: 1.68;
}


/* FAQ */

.enfoque-faq {
    background: #fff;
}


.enfoque-accordion {
    max-width: 900px;
}


.enfoque-accordion
.accordion-item {
    overflow: hidden;

    margin-bottom: .8rem;

    border:
        1px solid
        rgba(
            50,
            57,
            84,
            .10
        );

    border-radius: 16px;

    background: #fff;

    box-shadow:
        0 8px 24px
        rgba(
            30,
            36,
            64,
            .05
        );
}


.enfoque-accordion
.accordion-button {
    padding: 1.05rem 1.15rem;

    background: #fff;

    color: #1c2947;

    font-size: .98rem;

    font-weight: 700;

    line-height: 1.45;

    box-shadow: none;
}


.enfoque-accordion
.accordion-button:not(.collapsed) {
    background: #f9eef8;

    color: #7f167f;
}


.enfoque-accordion
.accordion-button:focus {
    border-color: transparent;

    box-shadow:
        0 0 0 .2rem
        rgba(
            154,
            23,
            154,
            .10
        );
}


.enfoque-accordion
.accordion-body {
    padding:
        1rem
        1.15rem
        1.2rem;

    color: #626a78;

    line-height: 1.75;
}


/* RELACIONADOS */

.enfoque-related {
    background: #f8f9fc;
}


.enfoque-related-card {
    height: 100%;

    overflow: hidden;

    border:
        1px solid
        rgba(
            46,
            53,
            78,
            .08
        );

    border-radius: 20px;

    background: #fff;

    box-shadow:
        0 12px 30px
        rgba(
            31,
            38,
            65,
            .06
        );

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


.enfoque-related-card:hover {
    transform:
        translateY(-4px);

    box-shadow:
        0 20px 42px
        rgba(
            31,
            38,
            65,
            .10
        );
}


.enfoque-related-image {
    display: block;

    overflow: hidden;

    background: #eef0f6;
}


.enfoque-related-image img {
    display: block;

    width: 100%;

    aspect-ratio: 5 / 3;

    object-fit: cover;

    transition:
        transform
        .45s ease;
}


.enfoque-related-card:hover
.enfoque-related-image img {
    transform:
        scale(1.035);
}


.enfoque-related-body {
    padding: 1.3rem;
}


.enfoque-related-body h3 {
    margin-bottom: .65rem;

    font-size: 1.12rem;

    line-height: 1.4;
}


.enfoque-related-body h3 a {
    color: #1a2948;

    text-decoration: none;
}


.enfoque-related-body h3 a:hover {
    color: #961397;
}


.enfoque-related-body p {
    margin-bottom: 1rem;

    color: #687080;

    line-height: 1.65;
}


.enfoque-related-link {
    display: inline-flex;

    gap: .4rem;

    align-items: center;

    color: #8c178e;

    font-weight: 700;

    text-decoration: none;
}


.enfoque-related-link:hover {
    color: #5f0e61;
}


/* CTA */

.enfoque-final-cta {
    padding:
        clamp(
            2.8rem,
            5vw,
            4.5rem
        )
        0;

    background:
        linear-gradient(
            135deg,
            #f8d5f5,
            #f5e4f7 48%,
            #e7edff
        );
}


.enfoque-final-cta h2 {
    margin:
        0
        0
        .7rem;

    color: #25203a;

    font-size:
        clamp(
            1.9rem,
            3vw,
            2.75rem
        );

    line-height: 1.18;

    text-wrap: balance;
}


.enfoque-final-cta p {
    max-width: 760px;

    color: #5b5667;

    line-height: 1.7;
}


.enfoque-cta-actions {
    display: grid;

    gap: .75rem;

    justify-items: stretch;
}


.enfoque-whatsapp {
    border:
        1px solid
        #188b45;

    background: #1f9f53;

    color: #fff;
}


.enfoque-whatsapp:hover,
.enfoque-whatsapp:focus {
    border-color: #15763b;

    background: #157f42;

    color: #fff;
}


/* TABLET */

@media (
    max-width: 991.98px
) {

    .enfoque-hero {
        padding:
            3.25rem
            0;
    }


    .enfoque-hero .row {
        row-gap: 1.5rem;
    }


    .enfoque-hero-visual {
        max-width: 720px;

        margin-inline: auto;
    }


    .enfoque-hero-visual img {
        max-height: 430px;
    }


    .enfoque-aside {
        position: static;

        max-width: 720px;

        margin-inline: auto;
    }


    .enfoque-aside-image img {
        max-height: 480px;
    }


    .enfoque-cta-actions {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


/* MÓVIL */

@media (
    max-width: 767.98px
) {

    .enfoque-hero {
        padding:
            2.7rem
            0;
    }


    .enfoque-hero h1 {
        margin-bottom:
            1rem !important;
    }


    .enfoque-hero-lead {
        margin-bottom:
            1.25rem !important;
    }


    .enfoque-section {
        padding:
            2.75rem
            0;
    }


    .enfoque-principle {
        grid-template-columns:
            44px
            minmax(0, 1fr);

        gap: .8rem;

        padding: 1.05rem;

        border-radius: 16px;
    }


    .enfoque-principle-icon {
        width: 44px;
        height: 44px;

        border-radius: 13px;

        font-size: 1.15rem;
    }


    .enfoque-aside-card,
    .enfoque-reflection {
        padding: 1.2rem;
    }


    .enfoque-heading {
        margin-bottom: 1.6rem;
    }


    .enfoque-cta-actions {
        grid-template-columns:
            1fr;
    }

}


@media (
    max-width: 575.98px
) {

    .enfoque-hero-actions {
        display: grid;

        grid-template-columns:
            1fr;
    }


    .enfoque-hero-actions .btn,
    .enfoque-cta-actions .btn {
        width: 100%;

        padding-left:
            1rem !important;

        padding-right:
            1rem !important;
    }


    .enfoque-hero-visual {
        border-radius: 18px;
    }


    .enfoque-hero-visual img {
        aspect-ratio: 4 / 3;

        max-height: 330px;
    }


    .enfoque-hero-note {
        padding:
            .85rem
            .9rem;

        font-size: .86rem;
    }


    .enfoque-copy > h2,
    .enfoque-heading h2,
    .enfoque-final-cta h2 {
        overflow-wrap: anywhere;
    }


    .enfoque-principle {
        grid-template-columns:
            1fr;
    }


    .enfoque-principle-icon {
        margin-bottom: .15rem;
    }


    .enfoque-closing {
        grid-template-columns:
            1fr;
    }


    .enfoque-aside {
        border-radius: 18px;
    }


    .enfoque-accordion
    .accordion-button {
        padding:
            .95rem
            1rem;

        font-size: .92rem;
    }


    .enfoque-accordion
    .accordion-body {
        padding:
            .9rem
            1rem
            1.05rem;
    }

}


@media (
    prefers-reduced-motion: reduce
) {

    .enfoque-hero-actions .btn,
    .enfoque-cta-actions .btn,
    .enfoque-hero-visual img,
    .enfoque-principle,
    .enfoque-pillar-card,
    .enfoque-related-card,
    .enfoque-related-image img {
        transition:
            none !important;
    }

}


/* ==========================================================
   NUESTRO-ENFOQUE-AJUSTE-V3

   - Hero más luminoso
   - Imagen hero circular sin marco
   - Eliminada sección artículos relacionados
========================================================== */


/* ==========================================================
   HERO — MAYOR LUMINOSIDAD
========================================================== */

.nuestro-enfoque-page
.enfoque-hero {
    background:
        linear-gradient(
            120deg,
            rgba(25, 20, 78, .72),
            rgba(108, 34, 116, .60)
        ),
        url("../../img/slideshow2.webp")
        center center / cover
        no-repeat;
}


.nuestro-enfoque-page
.enfoque-hero::after {
    background:
        radial-gradient(
            circle at 82% 20%,
            rgba(255, 255, 255, .18),
            transparent 32%
        );
}


/* ==========================================================
   IMAGEN DEL HERO — SOLO CÍRCULO
========================================================== */

.nuestro-enfoque-page
.enfoque-hero-visual {
    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    width: 100%;

    overflow: visible;

    border: 0;

    border-radius: 0;

    background: transparent;

    box-shadow: none;
}


.nuestro-enfoque-page
.enfoque-hero-visual > img {
    display: block;

    width: min(100%, 360px);
    height: auto;

    aspect-ratio: 1 / 1;

    object-fit: cover;
    object-position: center;

    margin:
        0
        auto;

    border: 0;

    border-radius: 50%;

    background: transparent;

    box-shadow:
        0 16px 38px
        rgba(0, 0, 0, .18);
}


/* La nota queda independiente debajo del círculo */

.nuestro-enfoque-page
.enfoque-hero-note {
    width: min(100%, 390px);

    margin:
        1rem
        auto
        0;

    padding:
        .9rem
        1rem;

    border:
        1px solid
        rgba(255, 255, 255, .16);

    border-radius: 15px;

    background:
        rgba(20, 17, 53, .72);

    box-shadow: none;

    backdrop-filter:
        blur(7px);
}


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

@media (max-width: 991.98px) {

    .nuestro-enfoque-page
    .enfoque-hero-visual {
        max-width: 600px;

        margin:
            0
            auto;
    }


    .nuestro-enfoque-page
    .enfoque-hero-visual > img {
        width:
            min(
                100%,
                320px
            );
    }

}


/* ==========================================================
   MÓVIL
========================================================== */

@media (max-width: 575.98px) {

    .nuestro-enfoque-page
    .enfoque-hero {
        padding:
            2.6rem
            0
            2.8rem;
    }


    .nuestro-enfoque-page
    .enfoque-hero-visual > img {
        width:
            min(
                82vw,
                270px
            );

        aspect-ratio:
            1 / 1;
    }


    .nuestro-enfoque-page
    .enfoque-hero-note {
        width: 100%;

        margin-top:
            .85rem;
    }

}


/* ==========================================================
   NUESTRO-ENFOQUE-AJUSTE-V4
   - fondo más encendido
   - imagen circular sin marco visual
========================================================== */

.nuestro-enfoque-page .enfoque-hero {
    background:
        linear-gradient(
            120deg,
            rgba(33, 22, 110, .48),
            rgba(157, 58, 176, .34)
        ),
        url("../../img/slideshow2.webp") center center / cover no-repeat;
}

/* brillo extra del fondo */
.nuestro-enfoque-page .enfoque-hero::after {
    background:
        radial-gradient(
            circle at 78% 18%,
            rgba(255, 255, 255, .20),
            transparent 30%
        ),
        radial-gradient(
            circle at 18% 30%,
            rgba(130, 215, 255, .12),
            transparent 28%
        );
}

/* contenedor del visual totalmente limpio */
.nuestro-enfoque-page .enfoque-hero-visual,
.nuestro-enfoque-page .enfoque-hero-visual::before,
.nuestro-enfoque-page .enfoque-hero-visual::after {
    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

/* si existe un wrapper interno alrededor de la imagen */
.nuestro-enfoque-page .enfoque-hero-visual > div:first-child {
    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

/* solo la imagen redonda */
.nuestro-enfoque-page .enfoque-hero-visual > img,
.nuestro-enfoque-page .enfoque-hero-visual img {
    display: block;
    margin: 0 auto;
    border-radius: 50% !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .14) !important;
    object-fit: cover;
    object-position: center;
}

/* mantener la nota inferior, pero separada de la foto */
.nuestro-enfoque-page .enfoque-hero-note {
    margin-top: 1rem;
}

@media (max-width: 991.98px) {
    .nuestro-enfoque-page .enfoque-hero {
        background:
            linear-gradient(
                120deg,
                rgba(33, 22, 110, .52),
                rgba(157, 58, 176, .38)
            ),
            url("../../img/slideshow2.webp") center center / cover no-repeat;
    }
}

@media (max-width: 575.98px) {
    .nuestro-enfoque-page .enfoque-hero {
        background:
            linear-gradient(
                120deg,
                rgba(33, 22, 110, .56),
                rgba(157, 58, 176, .42)
            ),
            url("../../img/slideshow2.webp") center center / cover no-repeat;
    }

    .nuestro-enfoque-page .enfoque-hero-visual > img,
    .nuestro-enfoque-page .enfoque-hero-visual img {
        width: min(82vw, 270px);
        aspect-ratio: 1 / 1;
    }
}



/* ==========================================================
   NUESTRO ENFOQUE — FOTO CIRCULAR LIMPIA V5
   Solo elimina aro/borde/sombra alrededor de la foto
========================================================== */

.nuestro-enfoque-page .enfoque-hero-visual {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.nuestro-enfoque-page .enfoque-hero-visual::before,
.nuestro-enfoque-page .enfoque-hero-visual::after {
    content: none !important;
    display: none !important;
}

.nuestro-enfoque-page .enfoque-hero-visual > img,
.nuestro-enfoque-page .enfoque-hero-visual img {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    filter: none !important;
    background: transparent !important;
    border-radius: 50% !important;
}

/* ENFOQUE-CLINICO-RECUPERADO-V1:START */


/* ==========================================================
   SECCIÓN
========================================================== */

.enfoque-clinico-recuperado {

    padding:
        clamp(3rem, 6vw, 5.5rem)
        0;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbf9fc 100%
        );

}


.enfoque-clinico-heading {

    max-width:
        820px;

    margin-bottom:
        2.2rem;

}


.enfoque-clinico-kicker {

    display:
        inline-block;

    margin-bottom:
        .55rem;

    color:
        #9d1a96;

    font-size:
        .73rem;

    font-weight:
        800;

    letter-spacing:
        .09em;

}


.enfoque-clinico-heading h2 {

    margin-bottom:
        .8rem;

    color:
        #172744;

    font-weight:
        800;

    line-height:
        1.16;

}


.enfoque-clinico-heading p {

    margin:
        0;

    color:
        #626a78;

    line-height:
        1.75;

}


/* ==========================================================
   TARJETAS
========================================================== */

.enfoque-clinico-grid {

    align-items:
        stretch;

}


.enfoque-clinico-card {

    position:
        relative;

    height:
        100%;

    min-height:
        238px;

    padding:
        1.35rem;

    overflow:
        hidden;

    border:
        1px solid
        rgba(39, 47, 73, .09);

    border-radius:
        20px;

    background:
        #ffffff;

    box-shadow:
        0 12px 30px
        rgba(30, 38, 65, .06);

}


.enfoque-clinico-card::before {

    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        0;

    right:
        0;

    height:
        4px;

    background:
        linear-gradient(
            90deg,
            #8f238e,
            #c84eb9,
            #7d91da
        );

}


.enfoque-clinico-icon {

    display:
        grid;

    place-items:
        center;

    width:
        48px;

    height:
        48px;

    flex:
        0 0 48px;

    margin-bottom:
        .9rem;

    border-radius:
        14px;

    background:
        linear-gradient(
            135deg,
            #f6e7f4,
            #edf1ff
        );

    color:
        #92208f;

    font-size:
        1.2rem;

}


.enfoque-clinico-card h3 {

    margin-bottom:
        .6rem;

    color:
        #192a48;

    font-size:
        1.08rem;

    font-weight:
        800;

    line-height:
        1.35;

}


.enfoque-clinico-card p {

    margin:
        0;

    color:
        #606a77;

    line-height:
        1.68;

}


/* ==========================================================
   EXPERIENCIA / MÉTODOS
========================================================== */

.enfoque-clinico-detail {

    margin-top:
        1.25rem;

    align-items:
        stretch;

}


.enfoque-clinico-large-card {

    height:
        100%;

    padding:
        clamp(1.25rem, 2.6vw, 1.8rem);

    border:
        1px solid
        rgba(39, 47, 73, .09);

    border-radius:
        22px;

    background:
        linear-gradient(
            135deg,
            #fff 0%,
            #fcf5fb 100%
        );

    box-shadow:
        0 13px 32px
        rgba(30, 38, 65, .06);

}


.enfoque-metodos {

    background:
        linear-gradient(
            135deg,
            #f3f5ff 0%,
            #ffffff 100%
        );

}


.enfoque-clinico-title-row {

    display:
        flex;

    align-items:
        flex-start;

    gap:
        .9rem;

    margin-bottom:
        .9rem;

}


.enfoque-clinico-title-row
.enfoque-clinico-icon {

    margin-bottom:
        0;

}


.enfoque-clinico-large-card h3 {

    margin:
        0;

    color:
        #192a48;

    font-size:
        1.15rem;

    font-weight:
        800;

    line-height:
        1.35;

}


.enfoque-clinico-large-card > p {

    margin:
        0;

    color:
        #596473;

    line-height:
        1.78;

}


/* ==========================================================
   MIRADA HUMANA
========================================================== */

.enfoque-clinico-human-card {

    display:
        grid;

    grid-template-columns:
        auto minmax(0, 1fr);

    gap:
        1rem;

    align-items:
        start;

    margin-top:
        1.4rem;

    padding:
        1.25rem 1.35rem;

    border:
        1px solid
        rgba(157, 26, 150, .13);

    border-left:
        4px solid
        #9d1a96;

    border-radius:
        0 18px 18px 0;

    background:
        linear-gradient(
            135deg,
            #faeff9,
            #f2f3ff
        );

}


.enfoque-human-icon {

    display:
        grid;

    place-items:
        center;

    width:
        44px;

    height:
        44px;

    border-radius:
        14px;

    background:
        #ffffff;

    color:
        #9d1a96;

    box-shadow:
        0 5px 15px
        rgba(50, 40, 80, .07);

}


.enfoque-clinico-human-card p {

    margin:
        0;

    color:
        #4e5868;

    line-height:
        1.75;

}


/* ==========================================================
   EFECTOS SOLO DISPOSITIVOS CON HOVER
========================================================== */

@media (hover:hover) and (pointer:fine) {

    .enfoque-clinico-card,
    .enfoque-clinico-large-card {

        transition:
            transform .25s ease,
            box-shadow .25s ease,
            border-color .25s ease;

    }


    .enfoque-clinico-card:hover,
    .enfoque-clinico-large-card:hover {

        transform:
            translateY(-3px);

        border-color:
            rgba(157, 26, 150, .17);

        box-shadow:
            0 17px 38px
            rgba(30, 38, 65, .085);

    }

}


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

@media (max-width:991.98px) {

    .enfoque-clinico-card {

        min-height:
            0;

    }

}


/* ==========================================================
   MÓVIL
========================================================== */

@media (max-width:575.98px) {

    .enfoque-clinico-recuperado {

        padding:
            2.6rem 0;

    }


    .enfoque-clinico-heading {

        margin-bottom:
            1.5rem;

    }


    .enfoque-clinico-card,
    .enfoque-clinico-large-card {

        padding:
            1.1rem;

        border-radius:
            17px;

    }


    .enfoque-clinico-title-row {

        gap:
            .7rem;

    }


    .enfoque-clinico-human-card {

        grid-template-columns:
            1fr;

        padding:
            1.05rem 1.1rem;

        border-radius:
            0 16px 16px 0;

    }

}


/* ==========================================================
   REDUCIR MOVIMIENTO
========================================================== */

@media (prefers-reduced-motion:reduce) {

    .enfoque-clinico-card,
    .enfoque-clinico-large-card {

        transition:
            none !important;

        transform:
            none !important;

    }

}

/* ENFOQUE-CLINICO-RECUPERADO-V1:END */
