/* ============================================================
   SEO AI Pro Design System
   Canonical CSS classes use the gav- prefix; --saip-* CSS custom
   properties are also emitted inline from inc/design.php when set.
   ============================================================ */

:root {
	/* ---------- Color ---------- */
	--gav-background: #fafafa;
	--gav-foreground: #09090b;
	--gav-surface: #ffffff;
	--gav-card: #ffffff;
	--gav-primary: #2563eb;
	--gav-primary-hover: #1d4ed8;
	--gav-primary-fg: #ffffff;
	--gav-primary-soft: #eff6ff;
	--gav-muted: #f4f4f5;
	--gav-muted-fg: #71717a;
	--gav-border: #e4e4e7;
	--gav-ring: #2563eb;
	--gav-success: #16a34a;
	--gav-success-soft: #f0fdf4;
	--gav-warning: #d97706;
	--gav-warning-soft: #fffbeb;
	--gav-danger: #dc2626;

	/* SAIP aliases (canonical gav- tokens above; design.php may override inline) */
	--saip-primary: var(--gav-primary);
	--saip-primary-hover: var(--gav-primary-hover);
	--saip-primary-fg: var(--gav-primary-fg);
	--saip-background: var(--gav-background);
	--saip-foreground: var(--gav-foreground);
	--saip-surface: var(--gav-surface);
	--saip-border: var(--gav-border);
	--saip-muted: var(--gav-muted);
	--saip-muted-fg: var(--gav-muted-fg);

	/* ---------- Spacing scale ---------- */
	--s-1: 4px;
	--s-2: 8px;
	--s-3: 12px;
	--s-4: 16px;
	--s-5: 20px;
	--s-6: 24px;
	--s-8: 32px;
	--s-10: 40px;
	--s-12: 48px;
	--s-16: 64px;
	--s-20: 80px;
	--s-24: 96px;
	--s-32: 128px;

	/* Semantic spacing (homepage = all pages) */
	--space-section: var(--s-24);       /* 96 — page vertical rhythm */
	--space-section-gap: var(--s-8);    /* 32 — gap between section cards */
	--space-card-pad: var(--s-10);      /* 40 — card internal padding */
	--space-card-gap: var(--s-6);       /* 24 */
	--space-heading-gap: var(--s-6);    /* 24 */
	--space-content-gap: var(--s-8);    /* 32 */
	--space-paragraph-gap: var(--s-5);  /* 20 */
	--space-cta-gap: var(--s-10);       /* 40 */
	--page-gutter: var(--s-6);          /* 24 */

	/* ---------- Containers ---------- */
	--container-content: 1120px;
	--container-reading: 760px;
	--container-wide: 1280px;
	--container: var(--container-content);

	/* ---------- Radius (one set) ---------- */
	--r-sm: 6px;
	--r-md: 8px;
	--r-lg: 12px;
	--r-xl: 16px;
	--r-2xl: 20px;
	--r-full: 9999px;

	/* ---------- Shadows (one set) ---------- */
	--shadow-xs: 0 1px 2px rgb(9 9 11 / 4%);
	--shadow-sm: 0 1px 2px rgb(9 9 11 / 5%), 0 1px 3px rgb(9 9 11 / 6%);
	--shadow-md: 0 4px 12px rgb(9 9 11 / 6%), 0 1px 3px rgb(9 9 11 / 4%);
	--shadow-lg: 0 12px 32px rgb(9 9 11 / 8%), 0 4px 8px rgb(9 9 11 / 4%);
	--shadow-glow: 0 0 0 1px rgb(37 99 235 / 12%), 0 8px 24px rgb(37 99 235 / 18%);

	/* ---------- Typography ---------- */
	--font-display: "Geist Sans", "Geist", Inter, ui-sans-serif, system-ui, sans-serif;
	--font-body: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--leading-tight: 1.15;
	--leading-snug: 1.4;
	--leading-normal: 1.6;
	--tracking-tight: -0.03em;
	--tracking-display: -0.04em;

	--text-display: clamp(2.25rem, 4vw, 3rem);   /* H1 */
	--text-heading-l: 1.5rem;                     /* H2 */
	--text-heading-m: 1.25rem;                    /* H3 */
	--text-body-lg: 1.125rem;                     /* lede */
	--text-body: 1rem;
	--text-caption: 0.875rem;                     /* buttons, nav */
	--text-label: 0.75rem;                        /* eyebrow, table th */
	--text-button: 0.875rem;

	--btn-h: 44px;
	--btn-h-sm: 36px;
	--icon-sm: 18px;
	--topbar-h: 64px;
}

/* ============================================================
   LAYOUT LOCK (1120px) — does NOT depend on page HTML classes
   Fixes full-width content when DB pages are outdated.
   ============================================================ */

/* Skip link — visible on focus for keyboard users */
.gav-skip-link {
	background: var(--gav-primary);
	border-radius: var(--r-md);
	color: var(--gav-primary-fg);
	font-weight: 600;
	left: var(--s-4);
	padding: var(--s-3) var(--s-4);
	position: absolute;
	top: -100px;
	z-index: 100000;
}

.gav-skip-link:focus {
	clip: auto;
	clip-path: none;
	height: auto;
	outline: 2px solid var(--gav-ring);
	outline-offset: 2px;
	overflow: visible;
	top: var(--s-4);
	width: auto;
}

.gav-header-search {
	align-items: center;
	display: inline-flex;
	gap: var(--s-2);
}

.gav-header-search input[type="search"] {
	border: 1px solid var(--gav-border);
	border-radius: var(--r-md);
	font-size: var(--text-caption);
	max-width: 11rem;
	min-height: 36px;
	padding: var(--s-2) var(--s-3);
}

.gav-header-search button {
	background: var(--gav-muted);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-md);
	cursor: pointer;
	font-size: var(--text-caption);
	min-height: 36px;
	padding: var(--s-2) var(--s-3);
}

.gav-header-search--mobile {
	display: flex;
	margin: var(--s-4) 0;
	width: 100%;
}

.gav-header-search--mobile input[type="search"] {
	flex: 1;
	max-width: none;
}

body.gav-theme .wp-site-blocks,
body.gav-theme .wp-site-blocks > * {
	box-sizing: border-box;
}

body.gav-theme main.wp-block-group,
body.gav-theme main.alignfull,
body.gav-theme .wp-block-post-content,
body.gav-theme .entry-content {
	box-sizing: border-box !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: var(--container-content) !important;
	padding-left: var(--page-gutter) !important;
	padding-right: var(--page-gutter) !important;
	width: 100% !important;
}

/* Avoid double gutters when content already has .gav-page shell */
body.gav-theme .wp-block-post-content > .gav-page,
body.gav-theme .wp-block-post-content > .gav-homepage,
body.gav-theme main > .gav-page,
body.gav-theme main > .gav-homepage {
	margin-left: 0;
	margin-right: 0;
	max-width: none;
	padding-left: 0;
	padding-right: 0;
	width: 100%;
}

/* Stop Gutenberg alignfull from breaking the column */
body.gav-theme .wp-block-post-content .alignfull,
body.gav-theme main .alignfull:not(main) {
	left: auto !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: 100% !important;
	position: relative !important;
	right: auto !important;
	width: 100% !important;
}

/* ---------- Base ---------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

body.gav-theme {
	margin: 0;
	background: var(--gav-background);
	color: var(--gav-foreground);
	font-family: var(--font-body);
	font-size: var(--text-body);
	font-weight: 400;
	line-height: var(--leading-normal);
	padding-top: var(--topbar-h);
	padding-bottom: 80px;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

@media (min-width: 881px) {
	body.gav-theme {
		padding-bottom: 0;
	}
}

body.gav-theme.gav-nav-open {
	overflow: hidden;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* ---------- Shared column ---------- */
.gav-shell,
.gav-page,
.gav-homepage,
.gav-footer-inner,
.gav-topbar__inner {
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	max-width: var(--container-content);
	padding-left: var(--page-gutter);
	padding-right: var(--page-gutter);
	width: 100%;
}

.gav-page,
.gav-homepage {
	color: var(--gav-foreground);
	padding-top: var(--s-8);
	padding-bottom: var(--s-24);
}

.gav-page.wp-block-group,
.gav-homepage.wp-block-group,
.gav-page .wp-block-group,
.gav-homepage .wp-block-group,
.gav-page .is-layout-constrained,
.gav-homepage .is-layout-constrained,
.gav-page.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.gav-homepage.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 100% !important;
}

.gav-page > *,
.gav-homepage > * {
	max-width: 100%;
}

.gav-prose {
	max-width: var(--container-reading);
}

.gav-wide {
	max-width: var(--container-wide);
	margin-left: auto;
	margin-right: auto;
}

/* ---------- Type (one system) ---------- */
.gav-page :where(h1, h2, h3, h4),
.gav-homepage :where(h1, h2, h3, h4) {
	color: var(--gav-foreground);
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: var(--tracking-tight);
	line-height: var(--leading-tight);
	margin: 0 0 var(--space-heading-gap);
	max-width: none;
	text-align: left;
}

.gav-page h1,
.gav-homepage h1 {
	font-size: var(--text-display);
	letter-spacing: var(--tracking-display);
	margin-bottom: var(--s-4);
}

.gav-page h2,
.gav-homepage h2 {
	font-size: var(--text-heading-l);
}

.gav-page h3,
.gav-homepage h3 {
	font-size: var(--text-heading-m);
	margin-bottom: var(--s-2);
}

.gav-page p,
.gav-homepage p,
.gav-page li,
.gav-homepage li {
	font-size: var(--text-body);
	text-align: left;
}

.gav-page p,
.gav-homepage p {
	margin: 0 0 var(--space-paragraph-gap);
}

.gav-page p:last-child,
.gav-homepage p:last-child,
.gav-section > p:last-child {
	margin-bottom: 0;
}

.gav-page a,
.gav-homepage a {
	color: var(--gav-primary);
	text-underline-offset: 0.15em;
}

.gav-eyebrow {
	color: var(--gav-success);
	font-family: var(--font-body);
	font-size: var(--text-label);
	font-weight: 600;
	letter-spacing: 0.06em;
	margin: 0 0 var(--s-3);
	text-align: left;
	text-transform: uppercase;
}

.gav-lede {
	color: var(--gav-muted-fg);
	font-size: var(--text-body-lg);
	line-height: var(--leading-snug);
	margin: 0 0 var(--space-content-gap);
	max-width: var(--container-reading);
}

/* ---------- Header ---------- */
.gav-topbar {
	background: rgb(255 255 255 / 80%);
	backdrop-filter: saturate(180%) blur(16px);
	border-bottom: 1px solid var(--gav-border);
	inset: 0 0 auto;
	position: fixed;
	z-index: 1000;
}

.gav-topbar__inner {
	align-items: center;
	display: flex;
	gap: var(--s-4);
	justify-content: space-between;
	min-height: var(--topbar-h);
}

.gav-topbar__brand {
	align-items: center;
	color: var(--gav-foreground);
	display: inline-flex;
	font-family: var(--font-display);
	font-size: var(--text-caption);
	font-weight: 600;
	gap: var(--s-2);
	letter-spacing: var(--tracking-tight);
	text-decoration: none;
}

/* Brand mark (logo upload / text logo) — used in header + footer */
.gav-brand {
	align-items: center;
	color: var(--gav-foreground);
	display: inline-flex;
	font-family: var(--font-display);
	font-size: var(--text-caption);
	font-weight: 700;
	gap: var(--s-2);
	letter-spacing: var(--tracking-tight);
	text-decoration: none;
}

.gav-brand__media {
	display: inline-flex;
	line-height: 0;
	position: relative;
}

.gav-brand__logo {
	display: block;
	height: var(--gav-logo-h, 36px);
	object-fit: contain;
	width: auto;
	max-width: var(--gav-logo-w, 140px);
}

.gav-brand__logo--dark,
.gav-brand__logo--mobile {
	display: none;
}

.gav-brand__text {
	line-height: 1.2;
}

body.gav-logo-image .gav-brand__text {
	display: none;
}

body.gav-logo-text .gav-brand__media {
	display: none;
}

@media (max-width: 767px) {
	.gav-brand__logo--mobile {
		display: block;
	}
	.gav-brand__media:has(.gav-brand__logo--mobile) .gav-brand__logo--light,
	.gav-brand__media:has(.gav-brand__logo--mobile) .gav-brand__logo--dark {
		display: none;
	}
}

@media (prefers-color-scheme: dark) {
	.gav-brand__logo--dark {
		display: block;
	}
	.gav-brand__media:has(.gav-brand__logo--dark) .gav-brand__logo--light {
		display: none;
	}
}

/* Header layout variants */
.gav-topbar--logo-center .gav-topbar__inner {
	flex-wrap: wrap;
	justify-content: center;
}

.gav-topbar--logo-center .gav-brand {
	order: 1;
	width: 100%;
	justify-content: center;
}

.gav-topbar--logo-center .gav-topbar__nav {
	order: 3;
	justify-content: center;
	width: 100%;
}

.gav-topbar--logo-center .gav-topbar__actions {
	order: 2;
}

.gav-topbar--logo-left-cta .gav-topbar__nav {
	margin-right: auto;
}

.gav-topbar__mark {
	background: linear-gradient(135deg, #3b82f6 0%, #2563eb 55%, #1d4ed8 100%);
	border-radius: var(--r-md);
	box-shadow: var(--shadow-glow);
	display: inline-block;
	flex: 0 0 auto;
	height: 24px;
	width: 24px;
}

.gav-topbar__nav {
	display: none;
	gap: var(--s-1);
}

.gav-topbar__nav a {
	border-radius: var(--r-md);
	color: var(--gav-muted-fg);
	font-size: var(--text-caption);
	font-weight: 500;
	padding: var(--s-2) var(--s-3);
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.gav-topbar__nav a:hover {
	background: var(--gav-muted);
	color: var(--gav-foreground);
}

.gav-topbar__actions {
	align-items: center;
	display: flex;
	gap: var(--s-2);
}

.gav-nav-toggle {
	align-items: center;
	background: var(--gav-surface);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-md);
	cursor: pointer;
	display: inline-flex;
	height: var(--btn-h-sm);
	justify-content: center;
	padding: 0;
	width: var(--btn-h-sm);
}

.gav-nav-toggle__bars,
.gav-nav-toggle__bars::before,
.gav-nav-toggle__bars::after {
	background: var(--gav-foreground);
	border-radius: var(--r-full);
	content: "";
	display: block;
	height: 1.5px;
	position: relative;
	transition: transform 0.2s ease;
	width: 16px;
}

.gav-nav-toggle__bars::before {
	position: absolute;
	top: -5px;
}

.gav-nav-toggle__bars::after {
	position: absolute;
	top: 5px;
}

.gav-nav-toggle[aria-expanded="true"] .gav-nav-toggle__bars {
	background: transparent;
}

.gav-nav-toggle[aria-expanded="true"] .gav-nav-toggle__bars::before {
	transform: translateY(5px) rotate(45deg);
}

.gav-nav-toggle[aria-expanded="true"] .gav-nav-toggle__bars::after {
	transform: translateY(-5px) rotate(-45deg);
}

.gav-mobile-nav {
	background: var(--gav-surface);
	border-bottom: 1px solid var(--gav-border);
	box-shadow: var(--shadow-md);
	padding: var(--s-4) var(--page-gutter) var(--s-6);
}

.gav-mobile-nav nav {
	display: flex;
	flex-direction: column;
	gap: var(--s-1);
	margin: 0 auto;
	max-width: var(--container-content);
}

.gav-mobile-nav a:not(.gav-dl-btn) {
	border-radius: var(--r-md);
	color: var(--gav-foreground);
	font-size: var(--text-body);
	font-weight: 500;
	padding: var(--s-3) var(--s-4);
	text-decoration: none;
}

.gav-mobile-nav a:not(.gav-dl-btn):hover {
	background: var(--gav-muted);
}

.gav-mobile-nav .gav-dl-btn {
	margin-top: var(--s-3);
}

@media (min-width: 880px) {
	.gav-topbar__nav {
		display: flex;
	}

	.gav-nav-toggle,
	.gav-mobile-nav {
		display: none !important;
	}
}

/* ---------- Buttons (one spec) ---------- */
.gav-dl-cta {
	margin: var(--space-cta-gap) 0 0;
}

.gav-dl-btn,
.gav-page .wp-block-button__link,
.gav-homepage .wp-block-button__link,
body.gav-theme .wp-block-button__link {
	align-items: center;
	background: var(--gav-primary) !important;
	border: 1px solid transparent !important;
	border-radius: var(--r-lg) !important;
	box-shadow: var(--shadow-glow);
	color: var(--gav-primary-fg) !important;
	cursor: pointer;
	display: inline-flex;
	font-family: var(--font-body);
	font-size: var(--text-button);
	font-weight: 600;
	justify-content: center;
	letter-spacing: -0.01em;
	line-height: 1.2;
	min-height: var(--btn-h);
	padding: 0 var(--s-6) !important;
	text-decoration: none !important;
	transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.gav-dl-btn:hover,
.gav-page .wp-block-button__link:hover,
.gav-homepage .wp-block-button__link:hover,
body.gav-theme .wp-block-button__link:hover {
	background: var(--gav-primary-hover) !important;
	box-shadow: 0 0 0 1px rgb(37 99 235 / 16%), 0 10px 28px rgb(37 99 235 / 24%);
	color: #fff !important;
	transform: translateY(-1px);
}

.gav-dl-btn:focus-visible,
.gav-page .wp-block-button__link:focus-visible,
.gav-homepage .wp-block-button__link:focus-visible,
.gav-topbar a:focus-visible,
.gav-nav-toggle:focus-visible,
.gav-page summary:focus-visible,
.gav-homepage summary:focus-visible {
	outline: 2px solid var(--gav-ring);
	outline-offset: 3px;
}

.gav-dl-btn--ghost,
.gav-page .wp-block-button.is-style-outline .wp-block-button__link,
.gav-homepage .wp-block-button.is-style-outline .wp-block-button__link,
body.gav-theme .wp-block-button.is-style-outline .wp-block-button__link {
	background: var(--gav-surface) !important;
	border: 1px solid var(--gav-border) !important;
	box-shadow: var(--shadow-xs) !important;
	color: var(--gav-foreground) !important;
}

.gav-dl-btn--ghost:hover,
.gav-page .wp-block-button.is-style-outline .wp-block-button__link:hover,
.gav-homepage .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--gav-muted) !important;
	border-color: #d4d4d8 !important;
	color: var(--gav-foreground) !important;
}

.gav-dl-btn--header {
	font-size: var(--text-label);
	min-height: var(--btn-h-sm);
	padding: 0 var(--s-4) !important;
	white-space: nowrap;
}

.gav-dl-btn--sticky {
	width: 100%;
}

.gav-dl-note {
	color: var(--gav-muted-fg);
	font-size: var(--text-label);
	margin: var(--s-2) 0 0;
}

.gav-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	margin: 0 0 var(--s-4);
}

.gav-sticky-dl {
	background: rgb(255 255 255 / 92%);
	backdrop-filter: blur(12px);
	border-top: 1px solid var(--gav-border);
	bottom: 0;
	left: 0;
	padding: var(--s-3) var(--s-4) calc(var(--s-3) + env(safe-area-inset-bottom));
	position: fixed;
	right: 0;
	z-index: 999;
}

@media (min-width: 881px) {
	.gav-sticky-dl {
		display: none;
	}
}

/* ---------- Hero (one structure) ---------- */
.gav-hero {
	background: var(--gav-card);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-md);
	margin: 0 0 var(--space-section-gap);
	overflow: hidden;
	width: 100%;
}

/* Simple hero — every inner page without illustration */
.gav-hero--simple,
.gav-hero:not(:has(.gav-hero-grid)) {
	padding: var(--space-card-pad);
}

@media (min-width: 880px) {
	.gav-hero--simple,
	.gav-hero:not(:has(.gav-hero-grid)) {
		padding: var(--s-12) var(--space-card-pad);
	}
}

.gav-hero--simple .gav-actions,
.gav-hero:not(:has(.gav-hero-grid)) .gav-actions,
.gav-hero--simple .gav-dl-cta,
.gav-hero:not(:has(.gav-hero-grid)) .gav-dl-cta {
	margin-top: var(--s-2);
	margin-bottom: 0;
}

/* Split hero — home / download / safety */
.gav-hero--split,
.gav-hero:has(.gav-hero-grid) {
	padding: 0;
}

.gav-hero-grid {
	display: grid;
	grid-template-columns: 1fr;
}

@media (min-width: 900px) {
	.gav-hero-grid {
		grid-template-columns: 1.1fr 0.9fr;
	}
}

.gav-hero-copy {
	padding: var(--space-card-pad);
}

@media (min-width: 880px) {
	.gav-hero-copy {
		padding: var(--s-12) var(--space-card-pad);
	}
}

.gav-hero-copy h1 {
	max-width: 18ch;
}

.gav-hero-visual {
	align-items: center;
	background:
		radial-gradient(700px 320px at 80% 10%, #dbeafe 0%, transparent 55%),
		radial-gradient(560px 280px at 10% 90%, #dcfce7 0%, transparent 50%),
		linear-gradient(165deg, #fafafa 0%, #eff6ff 100%);
	border-top: 1px solid var(--gav-border);
	display: flex;
	justify-content: center;
	min-height: 280px;
	padding: var(--s-12);
	position: relative;
}

@media (min-width: 900px) {
	.gav-hero-visual {
		border-left: 1px solid var(--gav-border);
		border-top: 0;
		min-height: 100%;
	}
}

.gav-hero-visual::after {
	background: radial-gradient(circle at center, rgb(37 99 235 / 12%), transparent 65%);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.gav-phone {
	background: #18181b;
	border-radius: 30px;
	box-shadow: var(--shadow-lg);
	height: 368px;
	padding: 10px;
	position: relative;
	width: 188px;
	z-index: 1;
}

.gav-phone::before {
	background: #3f3f46;
	border-radius: var(--r-full);
	content: "";
	height: 6px;
	left: 50%;
	position: absolute;
	top: 14px;
	transform: translateX(-50%);
	width: 52px;
	z-index: 2;
}

.gav-phone__screen {
	background: #fff;
	border-radius: 22px;
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
	height: 100%;
	overflow: hidden;
	padding: 34px 16px 16px;
}

.gav-phone__badge {
	background: var(--gav-success-soft);
	border-radius: var(--r-full);
	color: var(--gav-success);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.04em;
	padding: 4px 8px;
	text-transform: uppercase;
	width: fit-content;
}

.gav-phone__title {
	color: var(--gav-foreground);
	font-family: var(--font-display);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: var(--tracking-tight);
	line-height: 1.2;
	margin: 0;
}

.gav-phone__meta {
	color: var(--gav-muted-fg);
	font-size: 11px;
	line-height: 1.4;
	margin: 0;
}

.gav-phone__btn {
	background: var(--gav-primary);
	border-radius: var(--r-md);
	box-shadow: var(--shadow-glow);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	margin-top: auto;
	padding: 12px;
	text-align: center;
}

.gav-phone__row {
	background: var(--gav-muted);
	border-radius: var(--r-sm);
	height: 8px;
}

.gav-phone__row--short {
	width: 58%;
}

.gav-trust-strip {
	border-top: 1px solid var(--gav-border);
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	margin-top: var(--s-8);
	padding-top: var(--s-6);
}

.gav-trust-strip p {
	color: var(--gav-muted-fg);
	flex: 1 1 140px;
	font-size: var(--text-label);
	margin: 0;
	padding: var(--s-1) var(--s-4) var(--s-1) 0;
}

.gav-trust-strip strong {
	color: var(--gav-foreground);
	display: block;
	font-size: var(--text-caption);
	font-weight: 600;
	margin-bottom: var(--s-1);
}

/* ---------- Sections = premium content cards (homepage language) ---------- */
/*
 * Every major block is a card: rounded, soft border, light shadow, 40px pad.
 * Same on Home, Download, Safety, Help, About, Ledger, etc.
 */
.gav-section:not(.gav-page-cta):not(.gav-final-cta),
.gav-panel,
.gav-answer {
	background: var(--gav-card);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	box-sizing: border-box;
	margin: 0 0 var(--space-section-gap);
	padding: var(--space-card-pad);
	width: 100%;
}

.gav-section > .wp-block-heading:first-child,
.gav-section > h2:first-child {
	margin-top: 0;
}

.gav-section .gav-dl-cta,
.gav-section .gav-actions {
	margin-top: var(--space-cta-gap);
}

.gav-section .gav-actions:first-of-type {
	margin-top: 0;
}

/* Callout variant — same card chrome, tinted surface */
.gav-section.gav-callout,
.gav-section.gav-note,
.gav-section.gav-security,
.gav-section.gav-alert,
.gav-callout,
.gav-note,
.gav-security,
.gav-alert {
	background: var(--gav-success-soft);
	border: 1px solid #bbf7d0;
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	box-sizing: border-box;
	margin: 0 0 var(--space-section-gap);
	padding: var(--space-card-pad);
	width: 100%;
}

.gav-callout--warning,
.gav-alert--warning,
.gav-section.gav-callout--warning {
	background: var(--gav-warning-soft);
	border-color: #fde68a;
}

.gav-callout :where(h2, h3, p),
.gav-note :where(h2, h3, p),
.gav-security :where(h2, h3, p),
.gav-alert :where(h2, h3, p),
.gav-section.gav-callout :where(h2, h3, p) {
	text-align: left;
}

/* Nested feature tiles inside a section card */
.gav-card-grid {
	gap: var(--space-card-gap) !important;
	margin-top: var(--space-content-gap);
}

.gav-card-grid .wp-block-column {
	background: var(--gav-background);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-xl);
	box-shadow: var(--shadow-xs);
	padding: var(--s-8);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.gav-card-grid .wp-block-column:hover {
	border-color: #d4d4d8;
	box-shadow: var(--shadow-sm);
	transform: translateY(-2px);
}

.gav-step {
	align-items: center;
	background: var(--gav-primary-soft);
	border-radius: var(--r-full);
	color: var(--gav-primary);
	display: flex;
	font-family: var(--font-display);
	font-size: var(--text-caption);
	font-weight: 600;
	height: 32px;
	justify-content: center;
	margin: 0 0 var(--s-4);
	width: 32px;
}

/* Lists */
.gav-checklist {
	list-style: none;
	margin: 0;
	max-width: none;
	padding: 0;
	width: 100%;
}

.gav-checklist li {
	margin: var(--s-3) 0;
	padding-left: 32px;
	position: relative;
}

.gav-checklist li::before {
	align-items: center;
	background: var(--gav-success-soft);
	border-radius: var(--r-full);
	color: var(--gav-success);
	content: "✓";
	display: inline-flex;
	font-size: 10px;
	font-weight: 800;
	height: var(--icon-sm);
	justify-content: center;
	left: 0;
	position: absolute;
	top: 2px;
	width: var(--icon-sm);
}

.gav-page .wp-block-list,
.gav-homepage .wp-block-list {
	margin: 0;
	padding-left: var(--s-6);
}

.gav-page .wp-block-list li,
.gav-homepage .wp-block-list li {
	margin: var(--s-2) 0;
}

/* Tables */
.gav-table {
	display: block;
	margin: var(--space-content-gap) 0 0;
	overflow-x: auto;
	width: 100%;
}

.gav-table table {
	background: var(--gav-background);
	border: 1px solid var(--gav-border);
	border-collapse: separate;
	border-radius: var(--r-xl);
	border-spacing: 0;
	overflow: hidden;
	width: 100%;
}

@media (max-width: 720px) {
	.gav-table table {
		min-width: 560px;
	}
}

.gav-table :where(th, td) {
	border-bottom: 1px solid var(--gav-border);
	border-right: 1px solid var(--gav-border);
	padding: var(--s-3) var(--s-4);
	text-align: start;
	vertical-align: top;
}

.gav-table tr :where(th, td):last-child {
	border-right: 0;
}

.gav-table tbody tr:last-child :where(th, td) {
	border-bottom: 0;
}

.gav-table th {
	background: var(--gav-muted);
	font-size: var(--text-label);
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* FAQ nested inside section cards */
.gav-section details,
.gav-page details,
.gav-homepage details {
	background: var(--gav-background);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-lg);
	box-shadow: none;
	margin: var(--s-2) 0;
	overflow: hidden;
	width: 100%;
}

.gav-section details:first-of-type {
	margin-top: var(--space-content-gap);
}

.gav-page summary,
.gav-homepage summary {
	cursor: pointer;
	font-size: var(--text-caption);
	font-weight: 600;
	list-style: none;
	padding: var(--s-4) var(--s-6);
}

.gav-page summary::-webkit-details-marker,
.gav-homepage summary::-webkit-details-marker {
	display: none;
}

.gav-page details[open] summary,
.gav-homepage details[open] summary {
	background: var(--gav-muted);
}

.gav-page details > :not(summary),
.gav-homepage details > :not(summary) {
	border-top: 1px solid var(--gav-border);
	padding: var(--s-4) var(--s-6) var(--s-6);
}

/* Page-end CTA — light card (same language as homepage sections, NOT black) */
.gav-page-cta,
.gav-final-cta,
.gav-section.gav-page-cta,
.gav-section.gav-final-cta {
	background: linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%);
	border: 1px solid #bfdbfe;
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	color: var(--gav-foreground);
	margin: var(--space-section-gap) 0 0;
	padding: var(--space-card-pad);
	text-align: center;
	width: 100%;
}

.gav-page-cta h2,
.gav-final-cta h2,
.gav-page-cta p,
.gav-final-cta p {
	color: var(--gav-foreground);
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.gav-page-cta h2,
.gav-final-cta h2 {
	font-family: var(--font-display);
	font-size: var(--text-heading-l);
	margin-bottom: var(--space-heading-gap);
}

.gav-page-cta p,
.gav-final-cta p {
	color: var(--gav-muted-fg);
	max-width: 40rem;
}

.gav-page-cta .gav-dl-note,
.gav-final-cta .gav-dl-note {
	color: var(--gav-muted-fg);
}

.gav-page-cta .gav-dl-cta,
.gav-final-cta .gav-dl-cta,
.gav-page-cta .gav-actions,
.gav-final-cta .gav-actions {
	align-items: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-top: var(--space-cta-gap);
}

.gav-page-cta .gav-actions,
.gav-final-cta .gav-actions {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

.gav-page-cta .gav-support,
.gav-final-cta .gav-support {
	color: var(--gav-muted-fg);
	font-size: var(--text-caption);
	margin-top: var(--s-6);
	text-align: center;
}

.gav-page-cta .gav-support a,
.gav-final-cta .gav-support a {
	color: var(--gav-primary);
}

/* ---------- Footer ---------- */
.gav-site-footer {
	background: var(--gav-surface);
	border-top: 1px solid var(--gav-border);
	color: var(--gav-muted-fg);
	font-size: var(--text-caption);
	margin-top: var(--s-16);
	padding: var(--s-24) 0 96px;
	width: 100%;
}

@media (min-width: 881px) {
	.gav-site-footer {
		padding-bottom: var(--s-24);
	}
}

.gav-footer-cta {
	background: linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%);
	border: 1px solid #bfdbfe;
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	margin-bottom: var(--s-16);
	padding: var(--s-12) var(--s-8);
	text-align: center;
}

.gav-footer-cta h2 {
	color: var(--gav-foreground);
	font-family: var(--font-display);
	font-size: var(--text-heading-l);
	margin: 0 0 var(--s-2);
}

.gav-footer-cta .gav-dl-cta {
	align-items: center;
	display: flex;
	flex-direction: column;
	margin-top: var(--s-6);
}

.gav-footer-grid {
	gap: var(--s-8) !important;
}

.gav-footer-grid a {
	color: var(--gav-muted-fg);
	text-decoration: none;
	transition: color 0.15s ease;
}

.gav-footer-grid a:hover {
	color: var(--gav-primary);
}

.gav-footer-fine {
	border-top: 1px solid var(--gav-border);
	font-size: var(--text-label);
	margin-top: var(--s-12);
	padding-top: var(--s-6);
}

.gav-header-spacer {
	display: none;
}

.gav-site-header {
	align-items: center;
	border-bottom: 1px solid var(--gav-border);
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-4);
	justify-content: space-between;
	padding: var(--s-4) 0;
}

.gav-site-header__logo {
	display: inline-flex;
}

.gav-site-header__logo img {
	display: block;
	height: 44px;
	width: auto;
}

.gav-primary-nav {
	font-family: var(--font-body);
}

.gav-primary-nav .wp-block-navigation-item .wp-block-navigation-item__content {
	color: var(--gav-foreground);
	font-size: var(--text-caption);
	font-weight: 500;
}

.gav-primary-nav .wp-block-navigation-item .wp-block-navigation-item__content:hover {
	color: var(--gav-primary);
}

.gav-primary-nav .wp-block-navigation__responsive-container-open {
	color: var(--gav-foreground);
}

.gav-footer-logo {
	display: block;
	height: 36px;
	margin-bottom: var(--s-3);
	width: auto;
}

/* ---------- Mobile rhythm ---------- */
@media (max-width: 879px) {
	:root {
		--space-section-gap: var(--s-6);
		--space-card-pad: var(--s-6);
		--page-gutter: var(--s-4);
	}

	.gav-page,
	.gav-homepage {
		padding-top: var(--s-6);
		padding-bottom: var(--s-16);
	}

	.gav-hero-copy,
	.gav-hero--simple,
	.gav-hero:not(:has(.gav-hero-grid)) {
		padding: var(--s-8) var(--s-6);
	}

	.gav-page-cta,
	.gav-final-cta,
	.gav-section.gav-page-cta,
	.gav-section.gav-final-cta,
	.gav-byline,
	.gav-author-box,
	.gav-toc {
		padding: var(--s-8) var(--s-6);
	}

	.gav-card-grid .wp-block-column {
		padding: var(--s-6);
	}

	.gav-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.gav-actions .gav-dl-btn {
		justify-content: center;
		text-align: center;
		width: 100%;
	}
}

@media (min-width: 880px) and (max-width: 1100px) {
	:root {
		--space-card-pad: var(--s-8);
		--page-gutter: var(--s-5);
	}
}

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

/* Real screenshot inside the existing .gav-phone mockup frame — additive only. */
.gav-phone__shot {
	border-radius: 12px;
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

/* Curated slot-game tile strip. */
.gav-game-tiles {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	margin: var(--s-4) 0;
}

.gav-game-tiles figure {
	margin: 0;
	max-width: 96px;
	text-align: center;
}

.gav-game-tiles img {
	border-radius: var(--r-md);
	box-shadow: var(--shadow-lg);
	display: block;
	height: auto;
	width: 100%;
}

.gav-game-tiles figcaption {
	color: var(--gav-muted-fg);
	font-size: 11px;
	margin-top: var(--s-2);
}

/* Captioned inline screenshot card (e.g. rewards/referral screen). */
.gav-screenshot-card {
	margin: var(--s-4) 0;
	max-width: 320px;
}

.gav-screenshot-card img {
	border-radius: var(--r-lg);
	box-shadow: var(--shadow-lg);
	display: block;
	height: auto;
	width: 100%;
}

.gav-screenshot-card figcaption {
	color: var(--gav-muted-fg);
	font-size: 12px;
	margin-top: var(--s-2);
}

/* ============================================================
   Global Shortcode Management blocks
   ============================================================ */

.gav-sc-badge {
	align-items: center;
	background: var(--gav-primary-soft);
	border: 1px solid rgb(37 99 235 / 18%);
	border-radius: var(--r-full);
	color: var(--gav-primary);
	display: inline-flex;
	font-size: 13px;
	font-weight: 600;
	gap: var(--s-2);
	line-height: 1.2;
	padding: 6px 12px;
}

.gav-sc-badge__value {
	color: var(--gav-foreground);
}

.gav-sc-stat {
	align-items: baseline;
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
	min-width: 72px;
}

.gav-sc-stat__label {
	color: var(--gav-muted-fg);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.gav-sc-stat__value {
	color: var(--gav-foreground);
	font-size: 16px;
	font-weight: 700;
}

.gav-sc-rating {
	align-items: baseline;
	display: inline-flex;
	font-weight: 700;
	gap: 4px;
}

.gav-sc-rating__value {
	color: var(--gav-foreground);
	font-size: 18px;
}

.gav-sc-rating__max,
.gav-sc-rating__count {
	color: var(--gav-muted-fg);
	font-size: 13px;
	font-weight: 500;
}

.gav-sc-notice {
	display: block;
}

.gav-sc-notice__title {
	display: block;
	font-size: 15px;
	margin-bottom: var(--s-2);
}

.gav-sc-notice__text {
	color: var(--gav-foreground);
	margin: 0;
}

.gav-sc-notice--disclaimer {
	background: var(--gav-muted);
	border-color: var(--gav-border);
}

.gav-sc-ad {
	background: var(--gav-muted);
	border: 1px dashed var(--gav-border);
	border-radius: var(--r-lg);
	margin: 0 0 var(--space-section-gap);
	padding: var(--s-4);
	text-align: center;
}

.gav-sc-ad__label {
	color: var(--gav-muted-fg);
	display: block;
	font-size: 11px;
	letter-spacing: 0.06em;
	margin-bottom: var(--s-3);
	text-transform: uppercase;
}

.gav-sc-ad__body {
	overflow: hidden;
}

.gav-sc-internal-cta {
	margin-top: var(--space-section-gap);
}

/* ============================================================
   Header / Footer settings + Gutenberg template parts
   ============================================================ */

.gav-site-header__note {
	color: var(--gav-muted-fg);
	font-size: 13px;
	margin: 0;
	padding: var(--s-3) 0;
}

.gav-social {
	align-items: center;
	display: inline-flex;
	flex-wrap: wrap;
	gap: var(--s-2);
}

.gav-social__link {
	align-items: center;
	background: var(--gav-muted);
	border-radius: var(--r-full);
	color: var(--gav-foreground);
	display: inline-flex;
	font-size: 11px;
	font-weight: 700;
	height: 28px;
	justify-content: center;
	text-decoration: none;
	width: 28px;
}

.gav-social__link:hover {
	background: var(--gav-primary-soft);
	color: var(--gav-primary);
}

.gav-copyright {
	color: var(--gav-muted-fg);
	font-size: 13px;
	margin: var(--s-6) 0 var(--s-3);
}

.gav-footer-nav__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	list-style: none;
	margin: var(--s-4) 0 0;
	padding: 0;
}

.gav-footer-nav__list a {
	color: var(--gav-muted-fg);
	font-size: 13px;
	text-decoration: none;
}

.gav-footer-nav__list a:hover {
	color: var(--gav-primary);
}

.gav-footer-widgets {
	display: none;
	margin: var(--s-6) 0;
}

body.gav-show-footer-widgets .gav-footer-widgets {
	display: block;
}

.gav-footer-widgets__hint {
	color: var(--gav-muted-fg);
	font-size: 12px;
	font-style: italic;
}

body:not(.gav-show-footer-cta) .gav-footer-cta {
	display: none;
}

body:not(.gav-show-footer-social) .gav-site-footer .gav-social {
	display: none;
}

body.gav-footer-3-col .gav-footer-grid .wp-block-column:nth-child(4) {
	display: none;
}

body.gav-footer-stacked .gav-footer-grid {
	display: block;
}

body.gav-footer-stacked .gav-footer-grid .wp-block-column {
	margin-bottom: var(--s-6);
}

.gav-site-footer .gav-brand {
	margin-bottom: var(--s-3);
}

.gav-site-footer .wp-block-list {
	margin: 0;
}

.gav-site-footer .wp-block-heading {
	font-size: 14px;
	margin: 0 0 var(--s-3);
}

/* Sticky topbar owns primary chrome — hide FSE header note on the front end */
body.gav-theme:not(.editor-styles-wrapper) .gav-site-header__note {
	display: none;
}

/* ============================================================
   Gutenberg blocks + ads + search
   ============================================================ */

.gav-feature-list {
	list-style: none;
	margin: 0 0 var(--space-section-gap);
	padding: 0;
}

.gav-feature-list li {
	background: var(--gav-surface);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-lg);
	margin: 0 0 var(--s-2);
	padding: var(--s-3) var(--s-4);
	position: relative;
	padding-left: 2.25rem;
}

.gav-feature-list li::before {
	color: var(--gav-success);
	content: "✓";
	font-weight: 700;
	left: 0.85rem;
	position: absolute;
}

.gav-faq__item {
	background: var(--gav-surface);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-lg);
	margin: 0 0 var(--s-3);
	padding: var(--s-3) var(--s-4);
}

.gav-faq__item summary {
	cursor: pointer;
	font-weight: 600;
}

.gav-faq__answer {
	margin-top: var(--s-3);
}

.gav-related__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gav-related__list li {
	border-bottom: 1px solid var(--gav-border);
	padding: var(--s-3) 0;
}

.gav-byline {
	background: var(--gav-card);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	margin: var(--space-section-gap) 0 0;
	padding: var(--space-card-pad);
}

.gav-last-updated,
.gav-byline__author,
.gav-byline__bio {
	color: var(--gav-muted-fg);
	font-size: 0.9375rem;
	margin: 0 0 var(--s-2);
}

.gav-last-updated strong,
.gav-byline__author strong {
	color: var(--gav-fg, var(--gav-foreground));
}

.gav-author-box {
	align-items: flex-start;
	background: var(--gav-card);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	display: flex;
	gap: var(--s-4);
	margin: var(--s-5) 0 0;
	padding: var(--space-card-pad);
}

.gav-author-box__image {
	border-radius: 50%;
	flex-shrink: 0;
	height: 64px;
	object-fit: cover;
	width: 64px;
}

.gav-author-box__label {
	color: var(--gav-muted-fg);
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	margin: 0 0 var(--s-1);
	text-transform: uppercase;
}

.gav-author-box__name {
	font-size: 1.05rem;
	font-weight: 700;
	margin: 0 0 var(--s-2);
}

.gav-author-box__bio {
	color: var(--gav-muted-fg);
	font-size: 0.9375rem;
	margin: 0;
}

/* Quick answers / takeaways tint — keep section card chrome */
.gav-section.gav-quick-answers,
.gav-quick-answers.gav-section {
	background: var(--gav-primary-soft);
	border-color: #bfdbfe;
}

.gav-quick-answers .wp-block-list {
	margin: var(--s-3) 0 0;
}

.gav-toc {
	background: var(--gav-card);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-2xl);
	box-shadow: var(--shadow-sm);
	margin: 0 0 var(--space-section-gap);
	padding: var(--space-card-pad);
}

.gav-toc__title {
	display: block;
	font-size: 0.95rem;
	letter-spacing: 0.02em;
	margin: 0;
}

.gav-toc__list {
	margin: var(--s-3) 0 0;
	padding-left: 1.25rem;
}

.gav-toc__item--h3 {
	margin-left: 0.75rem;
}

.gav-breadcrumbs {
	font-size: 0.875rem;
	margin: 0 0 var(--s-5);
}

.gav-breadcrumbs ol {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.gav-breadcrumbs li {
	align-items: center;
	color: var(--gav-muted-fg);
	display: inline-flex;
}

.gav-breadcrumbs li:not(:last-child)::after {
	content: "/";
	margin-left: 0.5rem;
	opacity: 0.55;
}

.gav-breadcrumbs a {
	color: var(--gav-link, var(--gav-primary));
	text-decoration: none;
}

.gav-breadcrumbs a:hover {
	text-decoration: underline;
}

.gav-breadcrumbs [aria-current="page"] {
	color: var(--gav-foreground);
	font-weight: 600;
}

/* Explicit Gutenberg details class (same as native details styling) */
.wp-block-details {
	background: var(--gav-background);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-lg);
	margin: var(--s-2) 0;
	overflow: hidden;
	width: 100%;
}

.gav-ad-slot {
	background: var(--gav-muted);
	border: 1px dashed var(--gav-border);
	border-radius: var(--r-lg);
	margin: var(--s-4) 0;
	padding: var(--s-4);
	text-align: center;
}

.gav-ad-slot__label {
	color: var(--gav-muted-fg);
	display: block;
	font-size: 11px;
	letter-spacing: 0.06em;
	margin-bottom: var(--s-3);
	text-transform: uppercase;
}

.gav-search-card {
	background: var(--gav-surface);
	border: 1px solid var(--gav-border);
	border-radius: var(--r-xl);
	margin: 0 0 var(--s-4);
	padding: var(--s-5);
}

.gav-box__title {
	display: block;
	margin-bottom: var(--s-2);
}

.gav-widget {
	margin-bottom: var(--s-6);
}