/**
 * Tempo design SEMAS — language commun des blocs (pastilles, ambre, anthracite).
 * Source d’inspiration : section À propos.
 */

:root {
	--sb-radius-pill: 9999px;
	/* Pastilles et étiquettes : même arrondi que les boutons */
	--sb-radius-chip: 10px;
	--sb-radius-card: 1.25rem;
	--sb-radius-media: 1.5rem;
	--sb-shadow-soft: 0 14px 34px -22px color-mix(in oklab, var(--dark, #383E42) 45%, transparent);
	--sb-shadow-lift: 0 22px 44px -24px color-mix(in oklab, var(--dark, #383E42) 50%, transparent);
	--sb-surface: #fff;
	--sb-surface-soft: #f7f8f8;
	--sb-border-soft: color-mix(in oklab, var(--dark, #383E42) 12%, transparent);
}

/* Eyebrows type pastille (utilisable sur les intros de sections) */
.sb-about__eyebrow,
.sb-services__eyebrow,
.sb-works__eyebrow,
.sb-partners__title,
.sb-histoire__eyebrow,
.sb-valeurs__eyebrow,
.sb-eng__eyebrow,
.sb-form__eyebrow,
.sb-faq__eyebrow,
.sb-prod__eyebrow {
	display: flex;
	width: fit-content;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1.5rem !important;
	padding: 0.4rem 0.85rem;
	border-radius: var(--sb-radius-chip);
	background: color-mix(in oklab, var(--lisere, #f9b700) 18%, #fff);
	border: 1px solid color-mix(in oklab, var(--lisere, #f9b700) 45%, transparent);
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--dark, #383E42);
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

/* Intros : gap fiable entre pastille et titre (évite les marges écrasées) */
.sb-services__intro,
.sb-works__intro,
.sb-valeurs__intro,
.sb-eng__intro,
.sb-histoire__copy,
.sb-about__content,
.sb-faq__intro {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.sb-services__intro > .sb-services__eyebrow,
.sb-works__intro > .sb-works__eyebrow,
.sb-valeurs__intro > .sb-valeurs__eyebrow,
.sb-eng__intro > .sb-eng__eyebrow,
.sb-histoire__copy > .sb-histoire__eyebrow,
.sb-about__content > .sb-about__eyebrow,
.sb-faq__intro > .sb-faq__eyebrow {
	margin-bottom: 0 !important;
}

.sb-services__intro,
.sb-works__intro,
.sb-valeurs__intro,
.sb-eng__intro,
.sb-histoire__copy,
.sb-faq__intro {
	gap: 1.75rem;
}

/* À propos : pastille → titre seulement (le reste garde ses marges métier) */
.sb-about__content {
	gap: 0;
}

.sb-about__content > .sb-about__eyebrow {
	margin-bottom: 1.75rem !important;
}

.sb-partners .sb-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2.25rem;
}

.sb-partners__title {
	margin: 0 auto !important;
}

.sb-about__eyebrow::before,
.sb-services__eyebrow::before,
.sb-works__eyebrow::before,
.sb-histoire__eyebrow::before,
.sb-valeurs__eyebrow::before,
.sb-eng__eyebrow::before,
.sb-faq__eyebrow::before {
	content: "";
	width: 0.45rem;
	height: 0.45rem;
	flex-shrink: 0;
	border-radius: var(--sb-radius-pill);
	background: var(--lisere, #f9b700);
	box-shadow: 0 0 0 3px color-mix(in oklab, var(--lisere, #f9b700) 30%, transparent);
	animation: sb-eyebrow-pulse 1.8s ease-in-out infinite;
	transform-origin: center;
}

@keyframes sb-eyebrow-pulse {
	0%,
	100% {
		transform: scale(1);
		box-shadow: 0 0 0 3px color-mix(in oklab, var(--lisere, #f9b700) 28%, transparent);
		opacity: 1;
	}
	50% {
		transform: scale(1.15);
		box-shadow: 0 0 0 7px color-mix(in oklab, var(--lisere, #f9b700) 0%, transparent);
		opacity: 0.92;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sb-about__eyebrow::before,
	.sb-services__eyebrow::before,
	.sb-works__eyebrow::before,
	.sb-histoire__eyebrow::before,
	.sb-valeurs__eyebrow::before,
	.sb-eng__eyebrow::before,
	.sb-faq__eyebrow::before {
		animation: none;
	}
}

.sb-services__title,
.sb-works__title,
.sb-cta__title {
	font-weight: 800;
	letter-spacing: -0.03em;
	color: var(--dark, #383E42);
}

.sb-services__text,
.sb-works__intro p {
	color: color-mix(in oklab, var(--dark, #383E42) 72%, transparent);
}