/* ----------------------------------------------------------------------------
 * Utilities — helpers ponctuels
 *
 * Convention : préfixe `.cn-u-*`. À utiliser avec parcimonie. Si un usage
 * devient récurrent, le promouvoir en composant ou en variable.
 * --------------------------------------------------------------------------*/

/* ===== Affichage =========================================================*/

.cn-u-hidden       { display: none !important; }
.cn-u-block        { display: block !important; }
.cn-u-inline-block { display: inline-block !important; }

/* ===== Mobile / desktop only =============================================*/

.cn-u-mobile-only { display: block; }
.cn-u-desktop-only { display: none; }

@media (min-width: 1024px) {
    .cn-u-mobile-only { display: none; }
    .cn-u-desktop-only { display: block; }
}

/* ===== Alignement texte ==================================================*/

.cn-u-text-center { text-align: center; }
.cn-u-text-right  { text-align: right; }
.cn-u-text-left   { text-align: left; }

/* ===== Spacing margin/padding rapides ====================================*/

.cn-u-mt-0 { margin-top: 0 !important; }
.cn-u-mb-0 { margin-bottom: 0 !important; }
.cn-u-mt-4 { margin-top: var(--cn-space-4); }
.cn-u-mt-8 { margin-top: var(--cn-space-8); }
.cn-u-mb-4 { margin-bottom: var(--cn-space-4); }
.cn-u-mb-8 { margin-bottom: var(--cn-space-8); }

/* ===== Couleurs de texte =================================================*/

.cn-u-text-muted { color: var(--cn-bleu-nuit-50); }
.cn-u-text-or    { color: var(--cn-or); }
.cn-u-text-white { color: var(--cn-blanc); }

/* ===== Background ========================================================*/

.cn-u-bg-ivoire { background-color: var(--cn-ivoire); }
.cn-u-bg-bleu   { background-color: var(--cn-bleu-nuit); color: var(--cn-blanc); }