/**
 * Utilities — classes utilitaires courantes
 */

/* Display */
.d-none   { display: none !important; }
.d-block  { display: block !important; }
.d-inline { display: inline-block !important; }
.d-flex   { display: flex !important; }
.d-grid   { display: grid !important; }

/* Flex */
.flex-col      { flex-direction: column; }
.items-center  { align-items: center; }
.items-start   { align-items: flex-start; }
.items-end     { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.gap-xs { gap: var(--space-xs); }
.gap-sm { gap: var(--space-sm); }
.gap-md { gap: var(--space-md); }
.gap-lg { gap: var(--space-lg); }
.gap-xl { gap: var(--space-xl); }

/* Texte */
.text-center { text-align: center; }
.text-right  { text-align: right; }
.text-muted  { color: var(--text-muted); }
.text-accent { color: var(--accent); }
.text-success { color: var(--color-success); }
.text-uppercase { text-transform: uppercase; letter-spacing: 0.08em; }
.font-display { font-family: var(--font-display); }
.font-bold    { font-weight: 700; }
.font-semibold{ font-weight: 600; }

/* Spacing */
.mt-0 { margin-top: 0; }
.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }
.mt-2xl { margin-top: var(--space-2xl); }

.mb-0 { margin-bottom: 0; }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.mb-xl { margin-bottom: var(--space-xl); }
.mb-2xl { margin-bottom: var(--space-2xl); }

/* Visually hidden (a11y) */
.sr-only {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

/* Responsive helpers */
.hidden-mobile { display: initial; }
.hidden-desktop { display: none; }

@media (max-width: 768px) {
	.hidden-mobile { display: none !important; }
	.hidden-desktop { display: initial !important; }
}

/* Lazy loading helpers */
img[loading="lazy"] { background: var(--bg-alt); }
