html {
    font-size: 16px;
    /* Root size (1rem = 16px) */
    font-family: "Inter", "Roboto", "Segoe UI", Arial, sans-serif;
    color: #ffffff;
    /* Default white text for dark UI */
}

body {
    font-size: 1rem;
    /* 16px */
    line-height: 1.6;
}

/* ========== HEADINGS ========== */
/* Strong, clean hierarchy (industry standard) */
h1 {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
}

/* 32px */
h2 {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.3;
}

/* 28px */
h3 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.3;
}

/* 24px */
h4 {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.35;
}

/* 20px */
h5 {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.35;
}

/* 18px */
h6 {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
}

/* 16px */

/* ========== TEXT ELEMENTS ========== */
p {
    font-size: 1rem;
    /* 16px */
    font-weight: 400;
    margin: 0 0 0.8rem;
}

a {
    font-size: 1rem;
    color: #4ea3ff;
    text-decoration: none;
    font-weight: 500;
}

a:hover {
    text-decoration: none;
}

/* span inherits parent styles */
span {
    font-size: inherit;
    font-weight: inherit;
}

/* ========== LABELS FOR FORMS ========== */
label {
    font-size: 0.875rem;
    /* 14px */
    font-weight: 500;
    color: #dcdcdc;
    display: block;
    margin-bottom: 6px;
}

/* ========== GENERAL DIV STYLE ========== */
div {
    font-size: 1rem;
    /* 16px */
    font-weight: 400;
}

/* ========== SMALL TEXT ========== */
.small,
small {
    font-size: 0.8125rem;
    /* 13px */
    color: #b5b5b5;
}

th {
    font-size: 16px;
    font-weight: 600;

}

td {
    font-size: 15px;
    font-weight: 500;
}

.fontstyle {
    font-family: "Arial", sans-serif;
    font-size: 13px;
    font-weight: 100;
}