/**
 * .swiss_quality — "World Leading Swiss Quality" + Swiss flag
 *
 * Markup:
 *   <span class="swiss_quality">World Leading <strong>Swiss Quality</strong></span>
 *
 * Flag position (pseudo-element):
 *   default / .swiss_quality--after  → flag after text (::after)
 *   .swiss_quality--before           → flag before text (::before)
 *
 * Tone:
 *   default            → black text (light backgrounds)
 *   .swiss_quality--on-dark → muted light text (dark backgrounds)
 */

span.swiss_quality,
.spiro-hero-swiper__swiss-quality {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--spiro-font-family, "Outfit", Arial, sans-serif);
	/* PDF 05: World Leading / Swiss Quality ~16 */
	font-size: clamp(12px, 1.05vw, 16px);
	font-weight: var(--spiro-font-weight-regular, 400);
	line-height: 1;
	color: #000;
	white-space: nowrap;
	pointer-events: none;
}

span.swiss_quality strong,
.spiro-hero-swiper__swiss-quality strong {
	font-weight: var(--spiro-font-weight-bold, 700);
}

/* Flag — fixed 24×24px (design spec) */
span.swiss_quality::before,
span.swiss_quality::after,
.spiro-hero-swiper__swiss-quality::before,
.spiro-hero-swiper__swiss-quality::after {
	content: none;
	display: none;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	background: url("../images/swiss_cross.svg") center / contain no-repeat;
}

/* Default: flag after text */
span.swiss_quality::after,
span.swiss_quality--after::after,
.spiro-hero-swiper__swiss-quality::after,
.spiro-hero-swiper__swiss-quality.swiss_quality--after::after {
	content: "";
	display: block;
}

span.swiss_quality--before::before,
.spiro-hero-swiper__swiss-quality.swiss_quality--before::before {
	content: "";
	display: block;
}

span.swiss_quality--before::after,
.spiro-hero-swiper__swiss-quality.swiss_quality--before::after {
	content: none;
	display: none;
}

/* Dark surfaces (footer bar, dark hero slides, etc.) */
span.swiss_quality--on-dark,
.spiro-hero-swiper__swiss-quality.swiss_quality--on-dark {
	color: rgba(255, 255, 255, 0.55);
}

span.swiss_quality--on-dark strong,
.spiro-hero-swiper__swiss-quality.swiss_quality--on-dark strong {
	color: rgba(255, 255, 255, 0.9);
	font-weight: var(--spiro-font-weight-bold, 700);
}