/* ==========================================
   WEBERP DESIGN SYSTEM
========================================== */

:root{

    /* Brand */

    --primary:#2563EB;
    --primary-dark:#1D4ED8;
    --primary-light:#60A5FA;

    --secondary:#0F172A;

    --accent:#06B6D4;

    /* Background */

    --background:#FFFFFF;
    --surface:#F8FAFC;
    --surface-hover:#F1F5F9;

    /* Text */

    --text:#111827;
    --text-light:#64748B;
    --text-white:#FFFFFF;

    /* Borders */

    --border:#E5E7EB;

    /* Radius */

    --radius-sm:8px;
    --radius:16px;
    --radius-lg:24px;
    --radius-xl:32px;

    /* Shadow */

    --shadow-sm:0 4px 12px rgba(15,23,42,.05);

    --shadow:
        0 10px 30px rgba(15,23,42,.08);

    --shadow-lg:
        0 20px 60px rgba(15,23,42,.12);

    /* Layout */

    --container:1280px;

    --section:120px;

    /* Typography */

    --title:'Space Grotesk',sans-serif;

    --font:'Inter',sans-serif;

    /* Transition */

    --transition:.30s ease;
}

/* ==========================================
   DARK MODE
========================================== */

html[data-theme="dark"]{

    --background:#050816;

    --surface:#0F172A;

    --surface-hover:#1E293B;

    --text:#F8FAFC;

    --text-light:#CBD5E1;

    --border:#334155;

}