/* SikerKovácsok Visszaszámláló */
.skv {
	--skv-bg1: #0b1f3a;
	--skv-bg2: #163a5f;
	--skv-accent: #d4af37;
	--skv-text: #ffffff;
	--skv-card-bg: #102b49;
	--skv-btn-text: #0b1f3a;
	--skv-radius: 8px;
	--skv-scale: 1;

	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	width: 100%;
	padding: calc(clamp(36px, 6vw, 72px) * var(--skv-scale)) clamp(16px, 4vw, 48px);
	border-radius: var(--skv-radius);
	color: var(--skv-text);
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	text-align: center;
	line-height: 1.3;
}
.skv *, .skv *::before, .skv *::after { box-sizing: border-box; }
.skv > * { position: relative; }
.skv .skv-hidden { display: none !important; }

.skv--size-sm { --skv-scale: 0.7; }
.skv--size-lg { --skv-scale: 1.25; }

/* Háttér */
.skv--bg-gradient { background: linear-gradient(145deg, var(--skv-bg1) 0%, var(--skv-bg2) 100%); }
.skv--bg-solid { background: var(--skv-bg1); }
.skv--bg-none { background: transparent; }
.skv--bg-gradient::before {
	content: "";
	position: absolute;
	top: -30%; right: -15%;
	width: 60%; height: 90%;
	background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.07) 0%, transparent 65%);
	pointer-events: none;
}

/* Szövegek */
.skv .skv-eyebrow {
	margin: 0 0 18px;
	color: var(--skv-accent);
	font-weight: 700;
	font-size: calc(14px * var(--skv-scale));
	letter-spacing: 5px;
	text-transform: uppercase;
}
.skv .skv-title {
	margin: 0 auto;
	max-width: 1000px;
	color: var(--skv-text);
	font-family: inherit;
	font-weight: 800;
	font-size: calc(clamp(30px, 5.5vw, 62px) * var(--skv-scale));
	letter-spacing: -1.5px;
	line-height: 1.05;
	overflow-wrap: anywhere;
}
.skv--upper .skv-title,
.skv--upper .skv-done-big { text-transform: uppercase; }
.skv .skv-gold { color: var(--skv-accent); }
.skv .skv-divider {
	width: 85px;
	height: 3px;
	background: var(--skv-accent);
	margin: calc(28px * var(--skv-scale)) auto 0;
}

/* Számláló */
.skv .skv-clock {
	display: flex;
	justify-content: center;
	gap: clamp(8px, 2vw, 20px);
	max-width: calc(880px * var(--skv-scale));
	margin: calc(clamp(28px, 5vw, 48px) * var(--skv-scale)) auto 0;
}
.skv .skv-unit {
	flex: 1 1 0;
	min-width: 0;
	max-width: calc(220px * var(--skv-scale));
	border-radius: var(--skv-radius);
	padding: calc(clamp(16px, 3vw, 32px) * var(--skv-scale)) 6px calc(clamp(14px, 2.4vw, 24px) * var(--skv-scale));
}
.skv--card-glass .skv-unit {
	background: rgba(255, 255, 255, 0.06);
	background: color-mix(in srgb, var(--skv-text) 6%, transparent);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border: 1px solid color-mix(in srgb, var(--skv-text) 14%, transparent);
	border-top: 3px solid var(--skv-accent);
}
.skv--card-solid .skv-unit {
	background: var(--skv-card-bg);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border: 1px solid color-mix(in srgb, var(--skv-text) 14%, transparent);
	border-top: 3px solid var(--skv-accent);
}
.skv--card-none .skv-unit { padding-left: 0; padding-right: 0; }

.skv .skv-num {
	color: var(--skv-text);
	font-weight: 800;
	font-size: calc(clamp(38px, 9vw, 104px) * var(--skv-scale));
	line-height: 1;
	letter-spacing: -2px;
	font-variant-numeric: tabular-nums;
}
.skv .skv-unit-s .skv-num { color: var(--skv-accent); }
.skv .skv-label {
	margin-top: 12px;
	color: var(--skv-text);
	opacity: 0.65;
	font-weight: 700;
	font-size: calc(clamp(10px, 1.5vw, 13px) * var(--skv-scale));
	letter-spacing: clamp(1px, 0.4vw, 3px);
	text-transform: uppercase;
}

.skv .skv-target {
	margin-top: calc(clamp(28px, 5vw, 44px) * var(--skv-scale));
	color: var(--skv-text);
	opacity: 0.85;
	font-size: calc(clamp(15px, 2vw, 20px) * var(--skv-scale));
}
.skv .skv-target strong { color: var(--skv-text); }

/* Lejárt állapot */
.skv .skv-done { display: none; margin-top: calc(clamp(28px, 5vw, 48px) * var(--skv-scale)); }
.skv .skv-done-big {
	color: var(--skv-accent);
	font-weight: 800;
	font-size: calc(clamp(40px, 9vw, 96px) * var(--skv-scale));
	letter-spacing: -2px;
	line-height: 1;
}
.skv .skv-done-sub {
	margin-top: 16px;
	color: var(--skv-text);
	font-weight: 700;
	font-size: calc(clamp(17px, 2.4vw, 24px) * var(--skv-scale));
}
.skv.is-done .skv-clock { display: none; }
.skv.is-done .skv-done { display: block; animation: skv-glow 2.4s ease-in-out infinite; }
@keyframes skv-glow { 50% { opacity: 0.7; } }

/* Gomb */
.skv .skv-cta,
.skv .skv-cta:visited {
	display: inline-block;
	margin-top: calc(32px * var(--skv-scale));
	padding: calc(16px * var(--skv-scale)) calc(28px * var(--skv-scale));
	border: 0;
	border-radius: min(var(--skv-radius), 30px);
	background: var(--skv-accent);
	color: var(--skv-btn-text);
	font-weight: 800;
	font-size: calc(16px * var(--skv-scale));
	letter-spacing: 0.4px;
	text-transform: uppercase;
	text-decoration: none;
	transition: filter .15s, transform .15s;
}
.skv .skv-cta:hover { filter: brightness(0.9); color: var(--skv-btn-text); transform: translateY(-1px); }

@media (max-width: 560px) {
	.skv .skv-clock { flex-wrap: wrap; }
	.skv .skv-unit { flex: 1 1 calc(50% - 8px); max-width: none; }
	.skv .skv-num { font-size: calc(52px * var(--skv-scale)); }
	.skv .skv-eyebrow { letter-spacing: 3px; font-size: 12px; }
}
