/* Branded coming-soon page (coming-soon.php). */

.vj-soon { min-height: 100vh; background: linear-gradient(180deg, var(--peony) 0%, var(--pearl) 62%); }
.vj-soon #wpadminbar { display: none; }

.soon {
	min-height: 100vh; box-sizing: border-box;
	display: flex; flex-direction: column; align-items: center; gap: 28px;
	padding: 28px var(--gutter) 24px; text-align: center;
}
.soon__top .logo, .soon__top .custom-logo-link img { height: 34px; width: auto; mix-blend-mode: darken; }

.soon__copy { display: flex; flex-direction: column; align-items: center; gap: 16px; margin-top: auto; }
.soon h1 { font-size: clamp(3rem, 12vw, 6.6rem); line-height: 0.92; letter-spacing: -0.035em; max-width: 12ch; }
.soon__text { max-width: 48ch; font-size: 15px; line-height: 1.7; color: var(--ink-muted); }

.soon__arches { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; width: 100%; max-width: 720px; align-items: end; }
.soon__arch {
	position: relative; display: grid; place-items: center; height: 170px;
	border-radius: 999px 999px 4px 4px; background: var(--oat); overflow: hidden;
}
.soon__arch--tall { height: 220px; }
.soon__arch img { width: 70%; height: 78%; object-fit: contain; }
.soon__arch::after {
	content: ""; position: absolute; inset: auto 16% 8% 16%; height: 8px; border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(51, 35, 28, 0.28), transparent 72%);
}

.soon__follow { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.soon__follow-label { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-subtle); font-weight: 600; }
.soon__social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.soon__social a {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px;
	border: 1px solid var(--line); border-radius: 999px; background: rgba(250, 242, 239, 0.7);
	font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600;
	transition: background 0.25s, color 0.25s, border-color 0.25s;
}
.soon__social a:hover { background: var(--espresso); border-color: var(--espresso); color: var(--oat); }

.soon__legal { margin-top: auto; font-size: 11px; color: var(--ink-subtle); }

@media (min-width: 900px) {
	.soon { gap: 26px; padding-top: 32px; }
	.soon h1 { font-size: clamp(3.4rem, 6.4vw, 5.6rem); max-width: none; }
	.soon__arches { gap: 20px; max-width: 600px; }
	.soon__arch { height: 190px; }
	.soon__arch--tall { height: 240px; }
}

/* Full photos in the arches (backgrounds kept) */
.soon__arches--photo .soon__arch img { width: 100%; height: 100%; object-fit: cover; object-position: var(--focus, 50% 50%); }
.soon__arches--photo .soon__arch::after { display: none; }
/* Arches match the photos' 3:4 shape, so nothing is cropped; the middle one is a little larger. */
.soon__arches--photo { grid-template-columns: 1fr 1.18fr 1fr; max-width: 560px; }
.soon__arches--photo .soon__arch,
.soon__arches--photo .soon__arch--tall { height: auto; aspect-ratio: 3 / 4; }
.soon__arches--photo .soon__arch img { object-position: 50% 50%; }
@media (min-width: 900px) {
	.soon__arches--photo { max-width: 640px; gap: 20px; }
}