/* ==========================================================================
   HERO – označenie GARAN ako hlavný vizuálny prvok
   ========================================================================== */

.gt-hero {
	position: relative;
	overflow: hidden;
	padding-block: clamp(32px, 4vw, 56px) clamp(40px, 5vw, 72px);
	background:
		radial-gradient(70% 60% at 85% 20%, var(--gt-accent-soft) 0%, transparent 70%),
		linear-gradient(180deg, var(--gt-white) 0%, var(--gt-mist) 100%);
}

.gt-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(32px, 6vw, 120px);
	align-items: center;
}

.gt-hero__title {
	font-size: clamp(34px, 4.4vw, 54px);
	font-weight: var(--gt-weight-bold);
	letter-spacing: -0.035em;
	color: var(--gt-ink);
}

.gt-hero__lead {
	max-width: 560px;
	margin-top: var(--gt-space-16);
	font-size: var(--gt-fs-base);
	line-height: var(--gt-lh-base);
	color: var(--gt-body);
}

.gt-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gt-space-12);
	margin-top: var(--gt-space-24);
}

/* ---- Počítadlo ---------------------------------------------------------- */

.gt-hero__stat {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: var(--gt-space-16);
	padding: 6px 12px 6px 6px;
	border: 1px solid var(--gt-border);
	border-radius: var(--gt-radius-pill);
	background: var(--gt-white);
	font-size: var(--gt-fs-micro);
	font-weight: var(--gt-weight-medium);
	color: var(--gt-body);
}

.gt-hero__stat-num {
	padding: 2px 10px;
	border-radius: var(--gt-radius-pill);
	background: var(--gt-accent);
	font-weight: var(--gt-weight-bold);
	font-variant-numeric: tabular-nums;
	color: var(--gt-white);
}

.gt-hero__trust {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gt-space-8) var(--gt-space-24);
	margin-top: var(--gt-space-24);
	list-style: none;
	font-size: var(--gt-fs-small);
	color: var(--gt-body);
}

.gt-hero__trust li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.gt-hero__trust svg {
	flex: none;
	color: var(--gt-success);
}

.gt-hero__disclaimer {
	max-width: 520px;
	margin-top: var(--gt-space-16);
}

/* ---- Označenie ---------------------------------------------------------- */

.gt-hero__visual {
	display: flex;
	justify-content: center;
}

.gt-hero__label {
	position: relative;
	width: min(100%, 440px);
	margin: 0;
	padding: clamp(16px, 3vw, 28px);
	border: 1px solid rgba(255, 255, 255, 0.7);
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.55);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	box-shadow: var(--gt-shadow-label);
}

.gt-hero__label svg,
.gt-hero__label img {
	display: block;
	width: 100%;
	height: auto;
	background: var(--gt-white);
}

.gt-hero__label figcaption {
	margin-top: var(--gt-space-12);
	font-size: var(--gt-fs-micro);
	text-align: center;
	color: var(--gt-muted);
}

@media (max-width: 900px) {
	.gt-hero__inner {
		grid-template-columns: 1fr;
	}

	.gt-hero__visual {
		order: -1;
	}

	.gt-hero__label {
		width: min(100%, 320px);
	}
}

/* ---- Mobil: menšia ukážka, počítadlo v jednom riadku ---------------------- */

.gt-hero__stat {
	white-space: nowrap;
	max-width: 100%;
}

@media (max-width: 600px) {
	.gt-hero__label {
		width: min(100%, 230px);
		padding: 12px;
		border-radius: 16px;
	}

	.gt-hero__label figcaption {
		display: none;
	}

	.gt-hero__stat {
		gap: 8px;
		padding: 5px 12px 5px 12px;
		font-size: 12px;
	}

	.gt-hero__stat-pre {
		display: none;
	}

	.gt-hero__stat-rest {
		display: inline-block;
	}

	.gt-hero__stat-rest::first-letter {
		text-transform: uppercase;
	}
}