/* ==========================================
   CSS Variables
========================================== */

:root {

    /* Brand Colors */
    --primary: #2563eb;
    --primary-dark: #1d4ed8;
    --primary-light: #60a5fa;

    --secondary: #0f172a;

    --success: #22c55e;
    --warning: #f59e0b;
    --danger: #ef4444;

    /* Background */

    --bg-main: #f4f7fb;
    --bg-card: #ffffff;
    --bg-soft: #eef4ff;

    /* Text */

    --text-dark: #0f172a;
    --text-body: #475569;
    --text-light: #64748b;

    /* Borders */

    --border: #e2e8f0;

    /* Radius */

    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 22px;
    --radius-xl: 32px;

    /* Shadows */

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

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

    --shadow-lg: 0 25px 60px rgba(37,99,235,.12);

    /* Animation */

    --transition: .3s ease;

}


/* ==========================================
   Reset
========================================== */

*,
*::before,
*::after{

    margin:0;
    padding:0;
    box-sizing:border-box;

}


/* ==========================================
   Body
========================================== */

body{

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

    background:var(--bg-main);

    color:var(--text-dark);

    line-height:1.6;

    overflow-x:hidden;

}


/* ==========================================
   Images
========================================== */

img{

    display:block;

    max-width:100%;

}


/* ==========================================
   Links
========================================== */

a{

    text-decoration:none;

    transition:var(--transition);

}


/* ==========================================
   Buttons
========================================== */

button{

    border:none;

    outline:none;

}


/* ==========================================
   Inputs
========================================== */

input{

    outline:none;

}


/* ==========================================
   Selection
========================================== */

::selection{

    background:var(--primary);

    color:#fff;

}