/* ------------------------------------------------------------------ *
 * Golbaroon — coming soon page
 *
 * Loaded by coming-soon.php only, on top of main.css: the tokens, the logo
 * and the icon row all come from there, so a recoloured theme recolours this
 * page with it.
 * ------------------------------------------------------------------ */

.gb-coming-body {
	background: var(--gb-shell);
}

.gb-coming {
	display: grid;
	place-items: center;
	/* Not 100vh: mobile browsers measure that against a toolbar that is not
	   there yet, and the first paint sits under the address bar. */
	min-height: 100svh;
	padding: var(--gb-space-7) var(--gb-gutter);
	text-align: center;
	background:
		radial-gradient(90% 70% at 15% 0%, var(--gb-lilac-wash) 0%, transparent 55%),
		radial-gradient(80% 70% at 85% 100%, var(--gb-teal-wash) 0%, transparent 60%),
		var(--gb-white);
}

.gb-coming__inner {
	width: 100%;
	max-width: 640px;
}

.gb-coming__logo {
	margin: 0 0 var(--gb-space-6);
}

.gb-coming__logo svg {
	height: 48px;
	width: auto;
}

.gb-coming__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--gb-space-2);
	margin: 0 0 var(--gb-space-4);
	padding: 0.35rem 0.9rem 0.35rem 0.7rem;
	border-radius: var(--gb-radius-pill);
	background: var(--gb-white);
	box-shadow: var(--gb-shadow-sm);
	font-size: var(--gb-text-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--gb-teal-deep);
}

.gb-coming__eyebrow .gb-icon {
	color: var(--gb-lilac);
}

.gb-coming__title {
	font-family: var(--gb-font-display);
	font-size: var(--gb-text-3xl);
	line-height: 1.15;
	margin: 0;
	text-wrap: balance;
}

.gb-coming__contact {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--gb-space-3) var(--gb-space-5);
	margin-top: var(--gb-space-7);
}

.gb-coming__contact-link {
	display: inline-flex;
	align-items: center;
	gap: var(--gb-space-2);
	font-size: var(--gb-text-sm);
	color: var(--gb-ink-soft);
	text-decoration: none;
}

.gb-coming__contact-link:hover,
.gb-coming__contact-link:focus-visible {
	color: var(--gb-teal-deep);
	text-decoration: underline;
}

.gb-coming__contact-link .gb-icon {
	color: var(--gb-teal);
}

/*
 * The icon row is drawn for the dark footer — a near-white border and inherited
 * light text, both invisible here. The header row already solves this; this is
 * the same fix for a second light background.
 */
.gb-social--coming-soon {
	justify-content: center;
	margin-top: var(--gb-space-5);
}

.gb-social--coming-soon a {
	border-color: var(--gb-line);
	color: var(--gb-ink);
}