/* ======================================================
   HP-EXAM-PRO
   Design Variables
====================================================== */

:root {

    /* Brand Colors */
    --primary: #0d6efd;
    --primary-dark: #0b5ed7;
    --secondary: #6c757d;
    --success: #198754;
    --danger: #dc3545;
    --warning: #ffc107;
    --info: #0dcaf0;

    /* Neutral Colors */
    --white: #ffffff;
    --light: #f8f9fa;
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-300: #dee2e6;
    --gray-400: #ced4da;
    --gray-500: #adb5bd;
    --gray-600: #6c757d;
    --gray-700: #495057;
    --gray-800: #343a40;
    --gray-900: #212529;
    --black: #000000;

    /* Typography */
    --font-family: "Poppins", sans-serif;

    --font-xs: .75rem;
    --font-sm: .875rem;
    --font-md: 1rem;
    --font-lg: 1.125rem;
    --font-xl: 1.5rem;
    --font-2xl: 2rem;
    --font-3xl: 2.75rem;
    --font-4xl: 3.5rem;

    /* Font Weights */
    --fw-light: 300;
    --fw-normal: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    /* Border Radius */
    --radius-sm: 6px;
    --radius: 10px;
    --radius-lg: 18px;
    --radius-xl: 25px;
    --radius-pill: 50px;

    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(0,0,0,.08);
    --shadow: 0 6px 18px rgba(0,0,0,.12);
    --shadow-lg: 0 10px 35px rgba(0,0,0,.18);

    /* Transition */
    --transition: all .3s ease;

    /* Container */
    --container-width: 1320px;

    /* Navbar */
    --navbar-height: 80px;

    /* Section */
    --section-padding: 100px;

    /* Z-index */
    --z-navbar: 999;
    --z-dropdown: 1000;
    --z-modal: 1055;

}