:root { color-scheme: light; --brand: #b52a3b; }
body { color: #242830; }
a { text-underline-offset: 4px; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.home { background: #f5f6f8; }
.brand-accent { color: var(--brand); }
.brand-card { min-height: clamp(340px, 58svh, 680px); border-bottom: 6px solid var(--brand) !important; }
.brand-title { font-size: clamp(64px, 12vw, 160px); line-height: 1.1; letter-spacing: -0.065em; white-space: nowrap; }
.navbar-brand { letter-spacing: -0.04em; }
.nav-link:hover { text-decoration: underline; }
.doc { max-width: 720px; margin: auto; padding: 32px 24px 48px; }
.doc header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 24px; margin-bottom: 40px; padding-bottom: 20px; border-bottom: 1px solid var(--bs-border-color); }
.doc .name { margin: 0; font-weight: 700; font-size: 20px; }
.doc .name a { text-decoration: none; }
.doc nav { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.doc nav a { color: var(--bs-secondary-color); }
.doc nav a[aria-current="page"] { color: var(--brand); font-weight: 600; }
.doc h1 { font-size: clamp(32px, 6vw, 44px); letter-spacing: -0.04em; }
.doc h2 { margin: 28px 0 12px; font-size: 20px; }
.doc p, .doc li { line-height: 1.75; }
.doc .when { color: var(--bs-secondary-color); font-size: 14px; }
.doc main a, .doc footer a { color: var(--brand); }
.doc footer { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--bs-border-color); }
@media (max-width: 360px) { .brand-title { font-size: 54px; } }