/* ═══════════════════════════════════════════════════════════════
   Motor-Oil™ — Common Styles
   Boutons standards + Navigation Header harmonisée
   Référence: Section Hero Homepage
═══════════════════════════════════════════════════════════════ */

/* ── Header Nav Links ──────────────────────────────────────── */
/* Taille unifiée pour tous les éléments du header nav */
.nav-link,
nav a.nav-link {
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 0.75rem !important;           /* 12px — harmonisé */
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    transition: color 0.2s ease !important;
}
.nav-link:hover { color: #ED2728 !important; }

/* ── Bouton Primaire Rouge ─────────────────────────────────── */
/* Référence: "Découvrir l'ADN Motor-Oil" section Manifeste homepage */
.btn-primary,
a.btn-primary,
button.btn-primary {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    background: linear-gradient(to right, #ED2728, #b81026) !important;
    color: #ffffff !important;
    padding: 1rem 2rem !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.1em !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    cursor: pointer !important;
    border: none !important;
    text-decoration: none !important;
    line-height: 1 !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
    box-shadow: 0 6px 28px rgba(237, 39, 40, 0.38) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

.btn-primary:active,
a.btn-primary:active,
button.btn-primary:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 10px rgba(237, 39, 40, 0.25) !important;
}

/* ── Bouton Secondaire Gris / Blanc ───────────────────────── */
.btn-secondary,
a.btn-secondary,
button.btn-secondary {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    background: #f2f4f5 !important;
    color: #191c1d !important;
    padding: 1rem 2rem !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.1em !important;
    border-bottom: 2px solid transparent !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    cursor: pointer !important;
    text-decoration: none !important;
    line-height: 1 !important;
}

.btn-secondary:hover,
a.btn-secondary:hover,
button.btn-secondary:hover {
    border-bottom-color: #ED2728 !important;
    background: #e6e9ea !important;
    color: #191c1d !important;
    transform: translateY(-1px) !important;
}

.btn-secondary:active,
a.btn-secondary:active,
button.btn-secondary:active {
    transform: translateY(0) !important;
}

/* ── Bouton Header B2B ─────────────────────────────────────── */
/* Même taille que les nav links pour cohérence */
nav .btn-b2b {
    font-size: 0.75rem !important;
    letter-spacing: 0.1em !important;
}