/* #region Details banner */
.details-banner {
    padding-block: 6rem;
}

.details-banner__header {
    margin-bottom: 4.5rem;
}

.details-banner .cards-row {
    display: grid;
    grid-template-columns: 1fr;
}

.details-banner .cards-row .card {
    padding: 3rem;
}

.details-banner .cards-row .card:first-child {
    border-radius: 2rem 2rem 0 0;
}

.details-banner .cards-row .card-title {
    color: var(--header-2);
    font-size: 2.4rem;
    font-weight: 600;
    letter-spacing: -.08em;
    line-height: 1.2em;
    margin: 0 0 1rem;
}

.details-banner .cards-row .card-description p,
.details-banner .cards-row p.card-description {
    color: var(--paragraph);
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.6rem;
    margin: 0;
}

.details-banner .cards-row .card-description p+p {
    margin-top: 2rem;
}

.details-banner .cards-row .card-description strong {
    align-items: baseline;
    color: var(--paragraph);
    display: inline-flex;
    font-weight: 500;
    gap: .5rem;
}

.details-banner .cards-row .card-description a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: .2rem;
}

.details-banner .cards-row .detail-link {
    align-self: flex-start;
    color: var(--gray);
    --_color-text-hover: var(--red);
    margin-top: auto;
    padding-top: 2rem;
    text-decoration: none;
}

.details-banner .cards-row .detail-link:hover,
.details-banner .cards-row .detail-link:focus-visible {
    color: var(--red);
}

/* Correccion espaciados entre modulos */
.checklist-banner + .details-banner {
    padding-top: 0;
}

@media only screen and (min-width: 769px) {

    .details-banner {
        --_lg-x: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(226, 230, 235) 10%, rgb(226, 230, 235) 90%, rgb(255, 255, 255) 100%);
        --_lg-y: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(226, 230, 235) 10%, rgb(226, 230, 235) 90%, rgb(255, 255, 255) 100%);
    }

    .details-banner {
        padding-block: 8rem;
    }

    .details-banner__header {
        margin-bottom: 6.8rem;
    }

    .details-banner .cards-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .details-banner--3-columns .cards-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .details-banner .cards-row .card {
        border-width: 1px 0 1px 1px;
        margin: 0;
        padding: 5rem 3rem 3rem;
    }

    .details-banner .cards-row .card:first-child {
        border-radius: 2rem 0 0 0;
    }

    .details-banner .cards-row .card:last-child {
        border-right-width: 1px;
        border-radius: 0 2rem 0 0;
    }
}

@media only screen and (max-width: 768px) {

    .details-banner .cards-row .detail-link .icon-arrow-right,
    .details-banner .cards-row .card-description strong .icon-arrow-right {
        transform: translateY(-.1rem);
    }

    .details-banner__header,
    .details-banner .cards-row {
        margin-left: 0;
        max-width: 100%;
    }
}

/* #endregion */
