/* =================================================================
   Header — logo texte Guidefacturation.com
   ================================================================= */

.site-branding {
	display: flex;
	align-items: center;
}

.main-title {
	margin: 0;
	line-height: 1;
	font-size: inherit;
	font-weight: inherit;
}

/* Lockup logo : pictogramme + wordmark, pas un lien texte */
.main-title .gf-logo,
.main-title .gf-logo:hover,
.main-title .gf-logo:focus-visible {
	display: inline-flex;
	align-items: center;
	gap: 0.85rem;
	text-decoration: none;
	color: var(--gf-ink);
	background: transparent;
	border: 0;
	box-shadow: none;
	outline: none;
	transition:
		transform var(--gf-dur) var(--gf-ease),
		opacity var(--gf-dur) var(--gf-ease);
}

.main-title .gf-logo:hover {
	opacity: 0.94;
	transform: translateY(-1px);
}

.main-title .gf-logo:focus-visible {
	outline: 3px solid var(--gf-brand);
	outline-offset: 4px;
	border-radius: var(--gf-r-sm);
}

/* Pictogramme type tampon officiel */
.gf-logo__mark {
	display: inline-grid;
	place-items: center;
	flex: 0 0 auto;
	width: 3.35rem;
	height: 3.35rem;
	border-radius: 0.7rem;
	background:
		linear-gradient(145deg, var(--gf-ink) 0%, #2a2f38 100%);
	color: var(--gf-bg);
	box-shadow:
		inset 0 1px 0 color-mix(in srgb, #fff 14%, transparent),
		0 1px 2px color-mix(in srgb, var(--gf-ink) 18%, transparent);
}

.gf-logo__icon {
	display: block;
	width: 1.75rem;
	height: 1.75rem;
}

/* Wordmark empilé */
.gf-logo__wordmark {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.2rem;
	line-height: 1;
	min-width: 0;
}

.gf-logo__kicker {
	font-family: var(--gf-font-mono);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--gf-muted);
}

.gf-logo__name {
	font-family: var(--gf-font-display);
	font-size: clamp(1.35rem, 2.6vw, 1.65rem);
	font-weight: 600;
	letter-spacing: -0.035em;
	color: var(--gf-ink);
	white-space: nowrap;
}

.gf-logo__tld {
	font-family: var(--gf-font-mono);
	font-size: 0.82em;
	font-weight: 600;
	color: var(--gf-brand);
	letter-spacing: 0.02em;
}

@media (prefers-reduced-motion: reduce) {
	.main-title .gf-logo:hover {
		transform: none;
	}
}

@media (max-width: 480px) {
	.main-title .gf-logo {
		gap: 0.7rem;
	}

	.gf-logo__kicker {
		font-size: 0.62rem;
		letter-spacing: 0.16em;
	}

	.gf-logo__name {
		font-size: 1.2rem;
	}

	.gf-logo__mark {
		width: 2.85rem;
		height: 2.85rem;
	}

	.gf-logo__icon {
		width: 1.5rem;
		height: 1.5rem;
	}
}