/*
 * Reuses Widget_Hero_Search's v2 dark palette (--accent/--text/--muted:
 * #ef4939/#f5f7fa/#a1abb6) for visual consistency with the hero above it,
 * redefined locally rather than cross-loading hero-search.css — same
 * "redefine, don't cross-load" reasoning latest-update.css/
 * whats-happening.css already established (against the older v1 hero
 * palette they predate; this file matches the current v2 one instead).
 *
 * Contrast checked against WCAG AA on the panel background (#071017):
 * --muted (#a1abb6) ~8.2:1, --text (#f5f7fa) ~15.5:1, eyebrow (#ff8175,
 * same value as the hero's own eyebrow) ~7.8:1, clock digits (--accent,
 * #ef4939, large/bold so only needs 3:1 — same value already checked
 * ~5.3:1 for the hero's heading highlight on a near-identical background)
 * — all comfortably at or above AA.
 */
.rusto-wipe-countdown {
	--accent: #ef4939;
	--text: #f5f7fa;
	--muted: #a1abb6;
	padding: 2.75rem clamp(1.5rem, 4vw, 3rem);
	color: var(--text);
	background: #071017;
	border: 1px solid rgba(255, 255, 255, .06);
	border-radius: 14px;
	box-shadow: 0 28px 70px rgba(0, 0, 0, .26), inset 0 1px rgba(255, 255, 255, .03);
}

.rusto-wipe-countdown__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2.5rem;
	flex-wrap: wrap;
}

.rusto-wipe-countdown__content {
	max-width: 560px;
}

.rusto-wipe-countdown__eyebrow {
	margin: 0 0 10px;
	color: #ff8175;
	font-size: .78rem;
	font-weight: 850;
	text-transform: uppercase;
	letter-spacing: .13em;
}

.rusto-wipe-countdown__heading {
	margin: 0 0 12px;
	color: var(--text);
	font-size: clamp(1.8rem, 3.2vw, 2.6rem);
	line-height: 1.05;
	font-weight: 950;
	letter-spacing: -.03em;
	text-transform: uppercase;
	text-wrap: balance;
}

.rusto-wipe-countdown__text {
	margin: 0;
	color: var(--muted);
	font-size: 1rem;
	line-height: 1.65;
}

.rusto-wipe-countdown__text time {
	color: var(--text);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.rusto-wipe-countdown__clock {
	flex: 0 0 auto;
	padding: 1.15rem 2rem;
	color: var(--accent);
	background: rgba(6, 12, 18, .6);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 14px;
	font-size: clamp(2.1rem, 4.2vw, 3.2rem);
	font-weight: 850;
	font-variant-numeric: tabular-nums;
	letter-spacing: .02em;
	white-space: nowrap;
	box-shadow: inset 0 1px rgba(255, 255, 255, .03), 0 12px 30px rgba(0, 0, 0, .12);
}

.rusto-wipe-countdown__faq {
	max-width: 780px;
	margin: 2.25rem auto 0;
	padding-top: 1.75rem;
	border-top: 1px solid rgba(255, 255, 255, .08);
}

.rusto-wipe-countdown__faq h3 {
	margin: 0 0 1rem;
	color: var(--text);
	font-size: .82rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .07em;
}

.rusto-wipe-countdown__faq-item {
	padding: .85rem 0;
	border-top: 1px solid rgba(255, 255, 255, .06);
}

.rusto-wipe-countdown__faq-item:first-of-type {
	border-top: none;
	padding-top: 0;
}

.rusto-wipe-countdown__faq-item h4 {
	margin: 0 0 .35rem;
	color: var(--text);
	font-size: .92rem;
	font-weight: 700;
}

.rusto-wipe-countdown__faq-item p {
	margin: 0;
	color: var(--muted);
	font-size: .88rem;
	line-height: 1.6;
}

@media (max-width: 700px) {
	.rusto-wipe-countdown__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 1.75rem;
	}

	.rusto-wipe-countdown__clock {
		width: 100%;
		text-align: center;
	}
}