/* Bande de confiance de l'accueil.
   Positionnement repris de la direction mobile-first : trois colonnes egales,
   icone en tete de tuile, libelles alignes a gauche. */

.home-trust {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-block: 10px;
}

.home-trust__item {
    display: grid;
    justify-items: start;
    gap: 5px;
    padding: 10px 9px;
    border: 1px solid var(--home-line, rgba(37, 63, 45, .14));
    border-radius: 14px;
    background: var(--home-paper, #fffdf8);
    min-width: 0;
}

.home-trust__icon {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--home-green-soft, #e7efe7);
    color: var(--home-green, #244c35);
}

/* --ui-icon-sm vaut clamp(22px, 6vw, 30px) et deborderait la pastille de 26px
   entre 461px et 739px: on borne l'icone a l'interieur de son jeton. */
.home-trust__icon .ui-icon {
    width: 15px;
    height: 15px;
}

.home-trust__item b {
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.25;
    color: var(--home-ink, #1b211c);
}

.home-trust__item > span:last-child {
    font-size: .72rem;
    line-height: 1.3;
    color: var(--home-muted, #6f716b);
    text-wrap: balance;
}

/* Sur petits ecrans la bande se comprime, elle ne defile jamais:
   trois colonnes egales, densite reduite, aucun texte tronque. */
@media (max-width: 460px) {
    .home-trust {
        gap: 6px;
        margin-block: 8px;
    }

    .home-trust__item {
        gap: 4px;
        padding: 8px 7px;
        border-radius: 12px;
    }

    .home-trust__icon {
        width: 22px;
        height: 22px;
        border-radius: 7px;
    }

    .home-trust__icon .ui-icon {
        width: 13px;
        height: 13px;
    }

    .home-trust__item b {
        font-size: .74rem;
        line-height: 1.15;
    }

    .home-trust__item > span:last-child {
        font-size: .7rem;
        line-height: 1.2;
    }
}

@media (max-width: 340px) {
    .home-trust__item {
        padding: 7px 5px;
    }

    .home-trust__item b {
        font-size: .7rem;
    }
}

@media (min-width: 740px) {
    .home-trust {
        gap: 12px;
        margin-block: 14px;
    }

    .home-trust__item {
        grid-template-columns: 26px minmax(0, 1fr);
        grid-template-areas:
            "icon title"
            "icon desc";
        align-items: center;
        column-gap: 10px;
        padding: 12px 14px;
    }

    .home-trust__icon { grid-area: icon; }
    .home-trust__item b { grid-area: title; }
    .home-trust__item > span:last-child { grid-area: desc; }
}
