:root {
    color: #1f2933;
    font-family: Arial, Helvetica, sans-serif;
}

* {
    box-sizing: border-box;
}

body {
    background: #f5f7f9;
    margin: 0;
}

.site-header {
    background: #12344d;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    padding: 0.7rem clamp(1rem, 3vw, 2.5rem);
}

.site-brand {
    align-items: center;
    color: #fff;
    display: inline-flex;
    gap: 0.75rem;
    text-decoration: none;
}

.site-brand-mark {
    align-items: center;
    background: #c99700;
    border-radius: 50%;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 700;
    height: 2.25rem;
    justify-content: center;
    width: 2.25rem;
}

.site-brand strong,
.site-brand small {
    display: block;
}

.site-brand small {
    color: #d8e5ed;
    font-size: 0.75rem;
    margin-top: 0.1rem;
}

.site-main {
    padding: 1rem clamp(1rem, 3vw, 2.5rem);
}

.site-footer {
    color: #52616b;
    font-size: 0.8rem;
    padding: 0 1rem 1rem;
    text-align: center;
}