:root {
    --accent: #b31d22;
}

/* Header */
header {
    border-bottom: 4px solid var(--accent);
}

.logo {
    color: var(--accent);
}

/* Focus accessibility */
a:focus, select:focus, input:focus {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
}

/* Cards */
.card {
    border-radius: 6px;
}

/* Course header */
.course-header {
    background-color: #FFD940;
    color: #000000;
    padding: 10px 12px;
    border-bottom: 1px solid #ddd;
}

/* Typography */
body {
    font-size: 1rem;
    line-height: 1.5;
}

/* Table readability */
table {
    font-size: 0.9rem;
}
thead tr:first-child th {
    background-color: #FFD940;
}
/* Responsive */
@media (max-width: 576px) {
    h1 {
        font-size: 1.5rem;
    }
}