/* ==========================================================
   AMAR — REDESIGN V2
   SOLO FAQ + RELACIONADOS
   CTA ORIGINAL NO SE MODIFICA
========================================================== */


/* ==========================================================
   FAQ
========================================================== */

.amar-v2-faq {
    margin-top:
        clamp(
            2rem,
            4vw,
            3rem
        );

    padding:
        clamp(
            1.5rem,
            3vw,
            2.5rem
        );

    border:
        1px solid
        rgba(13,110,253,.12);

    border-radius: 24px;

    background:
        linear-gradient(
            180deg,
            #f6fbff,
            #eaf7ff
        );

    box-shadow:
        0 18px 44px
        rgba(15,70,125,.06);
}


.amar-v2-heading {
    max-width: 820px;

    margin-bottom: 2rem;
}


.amar-v2-kicker {
    display: inline-block;

    margin-bottom: .55rem;

    color: #0878c8;

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

    letter-spacing: .11em;

    text-transform: uppercase;
}


.amar-v2-heading h2 {
    color: #0b3267;

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

    line-height: 1.16;

    text-wrap: balance;
}


.amar-v2-heading p {
    color: #607084;

    line-height: 1.7;
}


.amar-v2-accordion {
    max-width: 900px;
}


.amar-v2-accordion
.accordion-item {
    overflow: hidden;

    margin-bottom: .8rem;

    border:
        1px solid
        rgba(13,110,253,.13);

    border-radius: 16px;

    background: #fff;

    box-shadow:
        0 8px 25px
        rgba(10,60,120,.05);
}


.amar-v2-accordion
.accordion-button {
    padding:
        1.05rem
        1.15rem;

    color: #0b3975;

    background: #fff;

    font-weight: 700;

    box-shadow: none;
}


.amar-v2-accordion
.accordion-button:not(.collapsed) {
    color: #075fa7;

    background: #e7f5ff;
}


.amar-v2-accordion
.accordion-body {
    color: #5d6e82;

    line-height: 1.75;
}


/* ==========================================================
   ARTÍCULOS RELACIONADOS
========================================================== */

.amar-v2-related {
    margin-top:
        clamp(
            2rem,
            4vw,
            3rem
        );

    padding:
        clamp(
            1.5rem,
            3vw,
            2.5rem
        );

    border-radius: 24px;

    background:
        linear-gradient(
            180deg,
            #d9f2ff,
            #eef9ff
        );
}


.amar-v2-related-card {
    height: 100%;

    padding: 0 !important;

    overflow: hidden;

    border-radius: 20px !important;

    background: #fff !important;

    box-shadow:
        0 15px 38px
        rgba(15,60,110,.08);
}


.amar-v2-related-image {
    display: block;

    overflow: hidden;

    aspect-ratio: 16 / 9;
}


.amar-v2-related-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .4s ease;
}


.amar-v2-related-content {
    padding: 1.3rem;
}


.amar-v2-related-content h3 {
    font-size: 1.15rem;
}


.amar-v2-related-content h3 a {
    color: #0c3d78;

    text-decoration: none;
}


.amar-v2-related-content p {
    color: #5d6d80;

    line-height: 1.65;
}


.amar-v2-related-link {
    display: inline-flex;

    gap: .4rem;

    align-items: center;

    color: #0874ba;

    font-weight: 800;

    text-decoration: none;
}


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

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

}


/* ==========================================================
   SEPARACIÓN DEL CTA ORIGINAL
========================================================== */

.amar-v2-related
+ .thoughts-cta {
    margin-top:
        clamp(
            2rem,
            4vw,
            3rem
        );
}


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

@media (max-width: 575.98px) {

    .amar-v2-faq,
    .amar-v2-related {
        padding: 1.15rem;

        border-radius: 17px;
    }


    .amar-v2-related-content {
        padding: 1.1rem;
    }

}