/**
 * AdProMax design tokens.
 *
 * Extracted from the approved Artifact pages (Landing, About, Early Access, FAQ).
 * Components read these variables — never raw hex or px.
 *
 * BRAND HUES: the indigo and pink bases are taken from the supplied logo package
 * (#4257fe / #de438d), which the owner confirmed governs over the earlier Artifact
 * values (#3D50E0 / #F06CAC), so the interface and the logo artwork match exactly.
 * The surrounding ramp steps are re-derived from those two bases.
 */

:root {
	/* ---- Brand ------------------------------------------------------- */
	--apm-brand: #4257fe;
	--apm-brand-hover: #3245d6;
	--apm-brand-strong: #2434a8;
	--apm-brand-tint: #eef0ff;
	--apm-brand-tint-border: #d9defe;
	--apm-brand-soft: #8290ff;
	--apm-brand-light: #97a5ff;
	--apm-brand-lighter: #bcc6ff;
	--apm-brand-pale: #ccd4ff;

	--apm-pink: #ea5f9f;
	--apm-pink-soft: #f2a3c8;
	--apm-pink-deep: #c22f74;
	--apm-pink-deeper: #a82763;
	--apm-pink-accent: #de438d;
	--apm-pink-error: #ff6f9f;
	--apm-pink-error-text: #ff9cbe;

	/* ---- Light surface ----------------------------------------------- */
	--apm-white: #ffffff;
	--apm-bg: #ffffff;
	--apm-bg-subtle: #fbfcfe;
	--apm-bg-muted: #f8f9fd;
	--apm-bg-section: #f4f6fc;
	--apm-bg-hero-top: #fbfbfe;
	--apm-bg-hover: #f5f7fe;

	--apm-text: #12172b;
	--apm-text-strong: #0b1020;

	/* Fixed ink for light surfaces that sit *inside* a dark section (the white-label
	   preview, light cards on dark bands). The --apm-text-* tokens are deliberately
	   remapped by .apm-section--dark, so they would turn white here. */
	--apm-ink: #0b1020;
	--apm-ink-subtle: #6b7185;
	--apm-ink-line: #e8eaf2;
	--apm-text-body: #3c4256;
	--apm-text-muted: #4a5170;
	--apm-text-subtle: #6b7185;

	--apm-border: #e8eaf2;
	--apm-border-soft: #edeff7;
	--apm-border-softer: #f2f4fa;
	--apm-border-card: #e4e7f2;
	--apm-border-strong: #d9ddea;
	--apm-border-stronger: #d3d9ee;
	--apm-border-hero: #dde2f0;

	/* ---- Dark surface ------------------------------------------------ */
	--apm-dark: #0b1020;
	--apm-dark-deep: #05070f;
	--apm-dark-deeper: #070b18;
	--apm-dark-panel: #0a0f1e;
	--apm-dark-field: #0c1120;
	--apm-dark-raised: #0e142a;
	--apm-dark-elevated: #141b32;
	--apm-dark-gradient-top: #0f1730;

	--apm-dark-border: #161e36;
	--apm-dark-border-soft: #1b2340;
	--apm-dark-border-mid: #222b49;
	--apm-dark-border-strong: #232b4c;
	--apm-dark-border-bright: #2a3560;
	--apm-dark-border-hover: #33406c;
	--apm-dark-border-focus: #5c6dea;
	--apm-dark-border-line: #1e2745;
	--apm-dark-border-outline: #2c3556;

	--apm-dark-text: #e7eaf6;
	--apm-dark-text-bright: #f2f4fe;
	--apm-dark-text-soft: #e4e7f4;
	--apm-dark-text-body: #c7cce2;
	--apm-dark-text-body-alt: #c3cae6;
	--apm-dark-text-muted: #a9b2d2;
	--apm-dark-text-subtle: #9ba3c4;
	--apm-dark-text-dim: #8891b8;
	--apm-dark-text-dimmer: #8a93b8;
	--apm-dark-text-faint: #7e88ac;
	--apm-dark-text-faintest: #6e779a;
	--apm-dark-text-placeholder: #828bb0;
	--apm-dark-text-nav: #aeb4ce;

	/* ---- Status ------------------------------------------------------ */
	--apm-success: #0b7a50;
	--apm-success-bright: #3fcf8e;
	--apm-success-soft: #8fe3be;
	--apm-success-bg: #e7f6ef;
	--apm-success-border: #1e5c43;
	--apm-warning: #8a4008;
	--apm-warning-bg: #fdf2e3;
	--apm-danger-border: #6b2340;

	/* ---- Typography -------------------------------------------------- */
	--apm-font-body: Manrope, system-ui, -apple-system, "Segoe UI", sans-serif;
	--apm-font-heading: var(--apm-font-body);
	--apm-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
	--apm-font-arabic: "IBM Plex Sans Arabic", Manrope, system-ui, sans-serif;

	--apm-size-eyebrow: 12px;
	--apm-size-micro: 11px;
	--apm-size-tiny: 12.5px;
	--apm-size-small: 13.5px;
	--apm-size-base: 15px;
	--apm-size-body: 16px;
	--apm-size-lead: clamp(15px, 1.4vw, 17px);
	--apm-size-lead-lg: clamp(16px, 1.5vw, 19px);
	--apm-size-h1: clamp(30px, 5.2vw, 56px);
	--apm-size-h1-sub: clamp(30px, 4.2vw, 46px);
	--apm-size-h2: clamp(28px, 3.6vw, 40px);
	--apm-size-h2-sm: clamp(26px, 3.2vw, 34px);
	--apm-size-h3: 19px;
	--apm-size-h4: 17px;

	--apm-lh-tight: 1.06;
	--apm-lh-heading: 1.15;
	--apm-lh-body: 1.6;
	--apm-lh-relaxed: 1.65;

	--apm-ls-tight: -0.03em;
	--apm-ls-snug: -0.02em;
	--apm-ls-wide: 0.14em;

	/* ---- Space ------------------------------------------------------- */
	--apm-space-2xs: 4px;
	--apm-space-xs: 8px;
	--apm-space-sm: 12px;
	--apm-space-md: 16px;
	--apm-space-lg: 24px;
	--apm-space-xl: 32px;
	--apm-space-2xl: 48px;
	--apm-space-3xl: 64px;
	--apm-space-4xl: 96px;

	--apm-section-block: 96px;
	--apm-section-block-sm: 64px;
	--apm-pad-inline: 24px;

	/* ---- Shape ------------------------------------------------------- */
	--apm-radius-sm: 6px;
	--apm-radius: 10px;
	--apm-radius-md: 12px;
	--apm-radius-lg: 14px;
	--apm-radius-xl: 18px;
	--apm-radius-2xl: 20px;
	--apm-radius-pill: 999px;

	--apm-shadow-card: 0 24px 60px -24px rgba(11, 16, 32, 0.28);
	--apm-shadow-panel: 0 40px 90px -40px rgba(0, 0, 0, 0.9);
	--apm-shadow-cta: 0 12px 34px -12px rgba(61, 80, 224, 0.85);
	--apm-shadow-soft: 0 30px 70px -46px rgba(11, 16, 32, 0.5);

	/* ---- Layout ------------------------------------------------------ */
	--apm-content-width: 760px;
	--apm-wide-width: 1240px;
	--apm-narrow-width: 920px;
	--apm-measure: 660px;

	/* ---- Motion ------------------------------------------------------ */
	--apm-ease: cubic-bezier(0.4, 0, 0.2, 1);
	--apm-dur-fast: 0.18s;
	--apm-dur: 0.24s;
	--apm-dur-slow: 0.34s;

	/* ---- Brand -------------------------------------------------------- */
	/* One place to tune logo scale. The lockup is 2.667:1, so width = height x 2.667. */
	--apm-logo-height: 44px;
	--apm-logo-height-footer: 40px;

	/* ---- Controls ---------------------------------------------------- */
	--apm-tap: 44px;
	--apm-control-h: 52px;
	--apm-control-h-lg: 56px;
	--apm-focus-width: 2px;
	--apm-focus-offset: 3px;
}

/* Arabic uses the Plex Arabic family for body text. Digits stay Western (0–9);
   no numeral substitution is applied anywhere in the theme. */
:root:lang(ar),
[dir="rtl"] {
	--apm-font-body: var(--apm-font-arabic);
	--apm-font-heading: var(--apm-font-arabic);
}
