/* Explain: Theme design tokens (colors, fonts) — single source of truth. - */
:root {
    color-scheme: light;

    --primary-color: #2563eb;
    --primary-hover: #1d4ed8;
    --primary-soft: #eff6ff;
    --primary-rgb: 37, 99, 235;

    --accent-color: #0f172a;
    --accent-hover: #1e293b;
    --accent-soft: #f1f5f9;
    --accent-rgb: 15, 23, 42;

    --cyan-color: #06b6d4;
    --cyan-hover: #0891b2;
    --cyan-soft: #ecfeff;

    --background-color: #ffffff;
    --surface-color: #f8fafc;
    --surface-raised: #ffffff;
    --secondary-color: #eff6ff;

    --text-color: #0f172a;
    --text-muted: #64748b;
    --text-soft: #94a3b8;
    --border-color: #e2e8f0;
    --border-strong: #cbd5e1;

    --success-color: #16a34a;
    --success-soft: #f0fdf4;
    --warning-color: #f59e0b;
    --warning-soft: #fffbeb;
    --danger-color: #dc2626;
    --danger-soft: #fef2f2;

    --font-heading: 'Poppins', 'Inter', sans-serif;
    --font-body: 'Inter', sans-serif;

    --content-width: 80rem;
    --section-padding-mobile: 4rem;
    --section-padding-desktop: 6rem;

    --radius-sm: 0.625rem;
    --radius-md: 0.875rem;
    --radius-lg: 1.125rem;
    --radius-xl: 1.5rem;

    --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
    --shadow-sm: 0 8px 22px rgba(15, 23, 42, 0.06);
    --shadow-md: 0 16px 40px rgba(15, 23, 42, 0.08);
    --shadow-focus: 0 0 0 4px rgba(37, 99, 235, 0.16);

    --ease-standard: cubic-bezier(0.2, 0, 0, 1);
}