/* RankPak – public site polish on top of Astra. Tokens come from functions.php. */

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

a { color: var(--hub-primary); }
a:hover, a:focus { color: color-mix(in srgb, var(--hub-primary) 80%, #000); }

:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--hub-primary) 45%, transparent);
	outline-offset: 2px;
	border-radius: 6px;
}

/* Buttons (Astra + core blocks) */
.ast-button, .button, .wp-block-button__link, button[type="submit"], input[type="submit"] {
	background: var(--hub-primary);
	color: var(--hub-primary-ink);
	border-radius: 10px;
	font-weight: 600;
	transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.ast-button:hover, .button:hover, .wp-block-button__link:hover, button[type="submit"]:hover, input[type="submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px -6px color-mix(in srgb, var(--hub-primary) 60%, transparent);
}
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--hub-primary);
	border: 2px solid var(--hub-primary);
}

/* Header: clean, sticky, subtle border */
.ast-primary-header-bar {
	border-bottom: 1px solid #e2e8f0;
	backdrop-filter: saturate(140%) blur(8px);
}
.ast-builder-menu .menu-item > .menu-link { font-weight: 500; }

/* Cards for pricing / feature blocks: add class "hub-card" to any Group block */
.hub-card {
	background: var(--hub-surface);
	border: 1px solid #e2e8f0;
	border-radius: var(--hub-radius);
	padding: clamp(20px, 3vw, 32px);
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px -12px rgba(15, 23, 42, .12);
}
.hub-card.is-featured { border: 2px solid var(--hub-primary); }

/* Pricing price line: add class "hub-price" to a Paragraph block */
.hub-price { font-size: 2.5rem; font-weight: 700; color: var(--hub-ink); letter-spacing: -.02em; }
.hub-price small { font-size: 1rem; font-weight: 500; color: var(--hub-muted); }

/* Paid Memberships Pro checkout + account pages */
.pmpro_checkout, .pmpro_section, .pmpro_card {
	border-radius: var(--hub-radius) !important;
}
.pmpro_btn, .pmpro_btn-submit-checkout {
	background: var(--hub-primary) !important;
	border-radius: 10px !important;
	font-weight: 600 !important;
}

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}