/**
 * GP - Reseñas: contenedor de sección para el widget de Trustindex.
 * Figma 440-21518. CSS compartido editor + frontend.
 * El override visual de las tarjetas de Trustindex (clases .ti-*) NO se hace
 * aquí todavía; este bloque aporta el marco: fondo degradado, espaciados y
 * el título. El widget se incrusta como bloque hijo dentro de .gp-reviews__widget.
 *
 * El degradado va en ::before para poder difuminar sus 4 bordes con mask-image
 * sin afectar al contenido (título y reseñas quedan nítidos, en .gp-reviews__inner
 * con z-index por encima).
 */

.gp-reviews {
    /* Anchura del difuminado de cada borde del contenedor (desktop/tablet). */
    --gp-reviews-edge-fade: 16px;
    position: relative;
    padding: 64px 16px;
    background: transparent;
}

.gp-reviews::before {
    content: '';
    position: absolute;
    inset: 0;
    /* Degradado configurable desde Gutenberg (colores + ángulo). El valor por
       defecto reproduce el diseño original de Figma. */
    background: var(
        --gp-reviews-gradient,
        linear-gradient(62deg, #f2f1fa 50.01%, #fff1f5 100%)
    );
}

.gp-reviews__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
}

.gp-reviews__title {
    margin: 0 0 32px;
    font-family: 'Outfit', arial, sans-serif;
    font-weight: 700;
    font-size: 32px;
    line-height: normal;
    color: #4b419e;
    text-align: center;
}

.gp-reviews__widget {
    width: 100%;
}

/*
 * Difuminado de los bordes del contenedor (desktop/tablet): el degradado se
 * disuelve hacia el fondo en vez de cortarse en un rectángulo duro. Dos
 * gradientes (horizontal + vertical) combinados con intersect difuminan los 4
 * lados. Solo desde 769px; en móvil el degradado ocupa el borde a borde sólido.
 */
@media (min-width: 769px) {
    .gp-reviews::before {
        -webkit-mask-image:
            linear-gradient(
                to right,
                transparent 0,
                #000 var(--gp-reviews-edge-fade),
                #000 calc(100% - var(--gp-reviews-edge-fade)),
                transparent 100%
            ),
            linear-gradient(
                to bottom,
                transparent 0,
                #000 var(--gp-reviews-edge-fade),
                #000 calc(100% - var(--gp-reviews-edge-fade)),
                transparent 100%
            );
        -webkit-mask-composite: source-in;
        mask-image:
            linear-gradient(
                to right,
                transparent 0,
                #000 var(--gp-reviews-edge-fade),
                #000 calc(100% - var(--gp-reviews-edge-fade)),
                transparent 100%
            ),
            linear-gradient(
                to bottom,
                transparent 0,
                #000 var(--gp-reviews-edge-fade),
                #000 calc(100% - var(--gp-reviews-edge-fade)),
                transparent 100%
            );
        mask-composite: intersect;
    }
}

@media (max-width: 768px) {
    .gp-reviews {
        padding: 48px 16px;
    }

    .gp-reviews__title {
        font-size: 24px;
    }
}


/*# sourceMappingURL=gp_reviews.min.css.map*/