/* ── Section Promesses ───────────────────────────────────────────── */

.hp-label       { color: #f97316; }
.hp-subtitle    { color: #94a3b8; }

/* ── Promises track — scroll mobile uniquement ── */

/* Mobile only : override la grille Tailwind en scroll horizontal */
@media (max-width: 639px) {
    .hp-promises-track {
        display                    : flex !important;
        flex-wrap                  : nowrap !important;
        overflow-x                 : auto !important;
        gap                        : 1rem !important;
        padding-bottom             : 1rem;
        cursor                     : grab;
        -webkit-overflow-scrolling : touch;
        scrollbar-width            : thin;
        scrollbar-color            : #1e2d42 transparent;
    }
    .hp-promise-card {
        flex      : 0 0 80vw;
        max-width : 300px;
    }
}

/* Desktop : Tailwind gère la grille (grid-cols-2 sm / grid-cols-4 lg) */

.hp-promise-card {
    background      : #151b2a;
    border          : 1px solid rgba(255,255,255,.06);
    padding         : 2rem;
    text-decoration : none;
    display         : flex;
    flex-direction  : column;
    border-radius   : 1.5rem;
    transition      : background .3s, border-color .3s;
}
.hp-promise-card:hover {
    background   : #1c2333;
    border-color : rgba(249,115,22,.25);
}

.hp-promise-icon-wrap {
    background   : rgba(249,115,22,.15);
    width        : 3.5rem;
    height       : 3.5rem;
    border-radius: .875rem;
    display      : flex;
    align-items  : center;
    justify-content: center;
    margin-bottom: 1.5rem;
    flex-shrink  : 0;
}
.hp-promise-icon { font-size: 28px; color: #f97316; }

.hp-promise-text { color: #94a3b8; }

.hp-promise-cta       { color: #f97316; }
.hp-promise-cta-arrow { font-size: 18px; }

/* ── Bandeau CTA ─────────────────────────────────────────────────── */

.hp-cta-banner {
    background   : #151b2a;
    border       : 1px solid rgba(255,255,255,.06);
    padding      : 2.25rem 5rem;
    border-radius: 1.5rem;
    margin-top   : 1.5rem;
}

.hp-cta-icon-wrap {
    background   : rgba(249,115,22,.15);
    width        : 3.5rem;
    height       : 3.5rem;
    border-radius: .875rem;
    display      : flex;
    align-items  : center;
    justify-content: center;
    flex-shrink  : 0;
}
.hp-cta-icon  { font-size: 28px; color: #f97316; }
.hp-cta-text  { color: #94a3b8; }

.hp-cta-btn {
    background   : linear-gradient(135deg,#ea580c,#f97316);
    display      : inline-flex;
    align-items  : center;
    gap          : .5rem;
    border-radius: 1rem;
    padding      : .875rem 2rem;
    font-size    : .875rem;
    font-weight  : 900;
    color        : #fff;
    text-decoration: none;
    transition   : filter .2s;
}
.hp-cta-btn:hover  { filter: brightness(1.1); }
.hp-cta-btn-icon   { font-size: 18px; }

.hp-cta-badges        { color: #64748b; }
.hp-cta-badge-icon    { font-size: 14px; color: #22c55e; }
