/**
 * Επικεφαλίδα ενότητας — template-parts/components/section-heading.php
 *
 * Eyebrow με τελεία, τίτλος, κείμενο και σύνδεσμος δεξιά: το κοινό μοτίβο των εγκεκριμένων
 * mockups της αρχικής (σημεία σώματος, προϊόντα που αξίζει να δείτε, μάρκες).
 * Μία αλλαγή εδώ περνά σε όλες τις ενότητες.
 *
 * Οι τιμές είναι tokens (--sh-*). Μια ενότητα αλλάζει μόνο ό,τι διαφέρει, π.χ.
 *   .of-brands .of-section-heading { --sh-title-size: clamp(30px, 3vw, 42px); }
 *
 * Mobile-first: κινητό = στήλη, από 768px ο σύνδεσμος πάει δεξιά (κάτω στοίχιση).
 */

.of-section-heading {
	--sh-gap: 28px;
	--sh-margin: 34px;
	--sh-copy-max: var(--container-text);

	/* Eyebrow */
	--sh-eyebrow-size: 13px;
	--sh-eyebrow-tracking: 0.08em;
	--sh-eyebrow-gap: 9px;
	--sh-eyebrow-margin: 12px;
	--sh-eyebrow-dot: 8px;
	--sh-eyebrow-color: var(--color-accent);

	/* Τίτλος & κείμενο */
	--sh-title-size: clamp(32px, 3.5vw, 44px);
	--sh-title-lh: var(--lh-heading-tight);
	--sh-title-tracking: -0.03em;
	--sh-title-margin: 12px;
	--sh-title-color: var(--color-heading);
	--sh-text-size: var(--fs-body);
	--sh-text-lh: 1.7;
	--sh-text-max: 670px;

	/* Σύνδεσμος (button component, text variant) */
	--sh-link-size: var(--fs-small);
	--sh-link-gap: 7px;
	--sh-link-hit: 13px; /* μεγαλύτερη περιοχή αφής χωρίς αλλαγή θέσης */

	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--sh-gap);
	margin-bottom: var(--sh-margin);
	line-height: normal;
}

@media (min-width: 768px) {
	.of-section-heading {
		--sh-text-size: 17px;
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
	}
}

.of-section-heading__copy {
	max-width: var(--sh-copy-max);
}

.of-section-heading__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--sh-eyebrow-gap);
	margin: 0 0 var(--sh-eyebrow-margin);
	color: var(--sh-eyebrow-color);
	font-size: var(--sh-eyebrow-size);
	font-weight: var(--fw-bold);
	letter-spacing: var(--sh-eyebrow-tracking);
	text-transform: uppercase;
}

.of-section-heading__eyebrow::before {
	content: "";
	flex-shrink: 0;
	width: var(--sh-eyebrow-dot);
	height: var(--sh-eyebrow-dot);
	border-radius: 50%;
	background-color: currentColor;
}

.of-section-heading__title {
	margin: 0 0 var(--sh-title-margin);
	color: var(--sh-title-color);
	font-size: var(--sh-title-size);
	font-weight: var(--fw-bold);
	line-height: var(--sh-title-lh);
	letter-spacing: var(--sh-title-tracking);
}

.of-section-heading__text {
	max-width: var(--sh-text-max);
	margin: 0;
	color: var(--color-text-muted);
	font-size: var(--sh-text-size);
	line-height: var(--sh-text-lh);
}

/* Σύνδεσμος δεξιά */
.of-section-heading__link,
.of-section-heading__link:visited {
	gap: var(--sh-link-gap);
	min-height: 0;
	margin-block: calc(var(--sh-link-hit) * -1);
	padding-block: var(--sh-link-hit);
	color: var(--color-primary);
	font-size: var(--sh-link-size);
	font-weight: var(--fw-bold);
	white-space: nowrap;
}

.of-section-heading__link:hover,
.of-section-heading__link:focus {
	color: var(--color-accent);
}

.of-section-heading__link .of-icon {
	--icon-size: var(--icon-xs);
}

/* Κεντραρισμένη παραλλαγή (align = center) */
.of-section-heading--center {
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.of-section-heading--center .of-section-heading__copy,
.of-section-heading--center .of-section-heading__text {
	margin-inline: auto;
}