/**
 * AP Coming Soon — scoped styles. Depends on ap-base.css.
 */

.ap-coming {
	background: var(--ap-paper-warm);
	padding: 4rem 0;
}

.ap-coming__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	align-items: center;
}

.ap-coming__cover-wrap {
	position: relative;
	width: 12rem;
	margin-inline: auto;
}

.ap-coming__cover {
	box-shadow:
		0 18px 40px -18px rgba(17, 17, 17, 0.45),
		0 2px 6px -2px rgba(17, 17, 17, 0.2);
}

/* Real cover images (often 3D renders with their own shadow) sit flush: no card shadow or background. */
.ap-coming__cover:has(.ap-cover--image) {
	box-shadow: none;
	background: transparent;
}

.ap-coming__badge {
	position: absolute;
	top: 1.25rem;
	right: -0.75rem;
	background: var(--ap-red);
	color: var(--ap-paper) !important;
	padding: 0.25rem 0.75rem;
	font-family: var(--ap-font-body), ui-sans-serif, system-ui, sans-serif !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	box-shadow: 0 4px 6px rgba(17, 17, 17, 0.18);
}

.ap-coming .ap-coming__title {
	margin: 0.75rem 0 0 !important;
	padding: 0 !important;
	font-family: var(--ap-font-display), Georgia, serif !important;
	font-weight: 400 !important;
	letter-spacing: -0.015em !important;
	line-height: 1.1 !important;
	font-size: 1.875rem !important;
	color: var(--ap-ink) !important;
}

.ap-coming .ap-coming__subtitle {
	margin: 0.5rem 0 0 !important;
	padding: 0 !important;
	font-family: var(--ap-font-display), Georgia, serif !important;
	font-style: italic !important;
	font-size: 1.125rem !important;
	color: var(--ap-muted) !important;
}

.ap-coming .ap-coming__desc {
	margin: 1.25rem 0 0 !important;
	padding: 0 !important;
	max-width: 36rem;
	font-family: var(--ap-font-body), ui-sans-serif, system-ui, sans-serif !important;
	font-size: 1rem !important;
	line-height: 1.625 !important;
	color: var(--ap-muted) !important;
}

.ap-coming .ap-coming__notify-label {
	margin: 1.5rem 0 0.75rem !important;
	padding: 0 !important;
	font-family: var(--ap-font-body), ui-sans-serif, system-ui, sans-serif !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: var(--ap-ink) !important;
}

@media (min-width: 768px) {
	.ap-coming { padding: 6rem 0; }
	.ap-coming__grid { grid-template-columns: 240px 1fr; }
	.ap-coming__cover-wrap { width: 100%; }
	.ap-coming .ap-coming__title { font-size: 2.25rem !important; }
}

@media (min-width: 1024px) {
	.ap-coming__grid { gap: 4rem; }
	.ap-coming .ap-coming__title { font-size: 3rem !important; }
}
