/* ============================================================
   Pointech Design System — Colors & Type (WordPress build)
   ------------------------------------------------------------
   Source of truth: Pointech Design System handoff.
   Fonts are SELF-HOSTED (no Google Fonts CDN) for RODO/GDPR.
   Brand DNA:
   - Deep electric blue field + periwinkle "point" square
   - Engineering precision: tight rhythm, mono accents, sharp corners
   - White space carries the weight; color used decisively
   ============================================================ */

@font-face {
	font-family: 'Montserrat';
	src: url('../fonts/Montserrat-VariableFont_wght.woff2') format('woff2-variations'),
	     url('../fonts/Montserrat-VariableFont_wght.ttf') format('truetype-variations');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'JetBrains Mono';
	src: url('../fonts/JetBrainsMono-VariableFont_wght.woff2') format('woff2-variations');
	font-weight: 100 800;
	font-style: normal;
	font-display: swap;
}

:root {
	/* ── Brand / Primary ─────────────────────────────────────── */
	--pt-blue-900: #0B1180;
	--pt-blue-800: #131DA5;
	--pt-blue-700: #1B28C6;   /* PRIMARY — the logo field */
	--pt-blue-600: #2E3DD8;
	--pt-blue-500: #4655E8;
	--pt-blue-400: #5E71F9;   /* ACCENT — the "point" square */
	--pt-blue-300: #8A98FB;
	--pt-blue-200: #BCC4FD;
	--pt-blue-100: #E2E6FE;
	--pt-blue-050: #F2F4FF;

	/* ── Neutrals (cool-leaning) ─────────────────────────────── */
	--pt-ink-1000: #07091A;
	--pt-ink-900:  #0F1230;
	--pt-ink-800:  #1A1E3D;
	--pt-ink-700:  #2A2F4F;
	--pt-ink-600:  #4A506E;
	--pt-ink-500:  #6B7090;
	--pt-ink-400:  #9499B5;
	--pt-ink-300:  #C2C6D9;
	--pt-ink-200:  #DEE1EC;
	--pt-ink-100:  #ECEEF5;
	--pt-ink-050:  #F6F7FB;
	--pt-paper:    #FFFFFF;

	/* ── Semantic / status ───────────────────────────────────── */
	--pt-success:    #16A36B;
	--pt-success-bg: #E6F6EE;
	--pt-warn:       #D97706;
	--pt-warn-bg:    #FCEFDC;
	--pt-danger:     #DC2626;
	--pt-danger-bg:  #FCE7E7;
	--pt-scan:       #00C2A8;

	/* ── Semantic role tokens ────────────────────────────────── */
	--fg-1: var(--pt-ink-1000);
	--fg-2: var(--pt-ink-700);
	--fg-3: var(--pt-ink-500);
	--fg-4: var(--pt-ink-400);
	--fg-on-brand: #FFFFFF;

	--bg-1: #FFFFFF;
	--bg-2: var(--pt-ink-050);
	--bg-3: var(--pt-ink-100);
	--bg-brand: var(--pt-blue-700);
	--bg-brand-soft: var(--pt-blue-050);
	--bg-accent: var(--pt-blue-400);

	--border-1: var(--pt-ink-200);
	--border-2: var(--pt-ink-300);
	--border-strong: var(--pt-ink-700);
	--border-brand: var(--pt-blue-700);

	--link: var(--pt-blue-700);
	--link-hover: var(--pt-blue-900);

	/* ── Type families ───────────────────────────────────────── */
	--font-display: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--font-body:    'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--font-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', 'Menlo', monospace;

	/* ── Type scale ──────────────────────────────────────────── */
	--fs-display-xl: clamp(2.75rem, 1.8rem + 4.2vw, 5.5rem);
	--fs-display-lg: clamp(2.25rem, 1.6rem + 3vw, 4rem);
	--fs-display-md: clamp(1.9rem, 1.5rem + 1.8vw, 3rem);
	--fs-h1: clamp(1.9rem, 1.5rem + 1.6vw, 2.5rem);
	--fs-h2: clamp(1.6rem, 1.3rem + 1.2vw, 2rem);
	--fs-h3: 1.5rem;
	--fs-h4: 1.25rem;
	--fs-body-lg: 1.125rem;
	--fs-body:    1rem;
	--fs-body-sm: 0.875rem;
	--fs-caption: 0.75rem;
	--fs-micro:   0.6875rem;

	--lh-tight: 1.05;
	--lh-snug:  1.2;
	--lh-cozy:  1.4;
	--lh-prose: 1.55;

	--tr-eyebrow: 0.14em;
	--tr-button:  0.02em;
	--tr-display: -0.02em;

	/* ── Spacing (4px base) ──────────────────────────────────── */
	--sp-0: 0;
	--sp-1: 4px;
	--sp-2: 8px;
	--sp-3: 12px;
	--sp-4: 16px;
	--sp-5: 24px;
	--sp-6: 32px;
	--sp-7: 48px;
	--sp-8: 64px;
	--sp-9: 96px;
	--sp-10: 128px;

	/* ── Radii — restrained ──────────────────────────────────── */
	--r-0: 0;
	--r-1: 2px;
	--r-2: 4px;
	--r-3: 8px;
	--r-4: 12px;
	--r-pill: 999px;

	/* ── Borders ─────────────────────────────────────────────── */
	--bw-1: 1px;
	--bw-2: 2px;
	--bw-strong: 3px;

	/* ── Shadows (cool, engineered) ──────────────────────────── */
	--shadow-1: 0 1px 2px rgba(11,17,128,.06), 0 1px 1px rgba(11,17,128,.04);
	--shadow-2: 0 4px 12px rgba(11,17,128,.08), 0 1px 2px rgba(11,17,128,.05);
	--shadow-3: 0 12px 32px rgba(11,17,128,.12), 0 2px 6px rgba(11,17,128,.06);
	--shadow-brand: 0 10px 30px rgba(27,40,198,.25);
	--shadow-inset: inset 0 0 0 1px rgba(11,17,128,.06);

	/* ── Motion ──────────────────────────────────────────────── */
	--ease-out: cubic-bezier(.16,.84,.32,1);
	--ease-in-out: cubic-bezier(.65,.05,.36,1);
	--dur-fast: 120ms;
	--dur-base: 200ms;
	--dur-slow: 360ms;

	/* ── Layout ──────────────────────────────────────────────── */
	--pt-maxw: 1280px;
	--pt-gutter: 32px;
}

@media (max-width: 600px) {
	:root { --pt-gutter: 16px; }
}