/* Local page/menu additions for static recovery */
:root {
    --primary: #0c377f;
    --secondary: #d6b36a;
    --background: #231f20;
    --text: #ffffff;
    --muted: #d8d8d8;
    --border: rgba(255,255,255,0.24);
    --panel: rgba(14, 24, 42, 0.78);
}
* { box-sizing: border-box; }
a { color: #ffffff; }
a:hover, a:focus { color: #d6e4ff; text-decoration: none; }
.site-nav {
    width: min(1080px, 92%);
    margin: 18px auto 10px;
    padding: 14px 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: rgba(0,0,0,0.42);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    text-align: left;
}
.site-brand {
    color: var(--text);
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
}
.site-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}
.site-menu a {
    display: inline-block;
    color: var(--text);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    padding: 8px 13px;
    font-size: 14px;
    background: rgba(255,255,255,.06);
}
.site-menu a:hover,
.site-menu a:focus,
.site-menu a.active {
    background: var(--primary);
    border-color: var(--primary);
}
.page-shell {
    max-width: 960px;
    width: 86%;
    margin: 30px auto;
    padding: 36px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--panel);
    text-align: left;
    box-shadow: 0 18px 50px rgba(0,0,0,.28);
}
.page-shell h1,
.page-shell h2,
.page-shell h3 { color: var(--text); }
.page-shell h1 { font-size: clamp(3rem, 6vw, 5rem); margin-top: 0; }
.page-shell h2 { font-size: clamp(2.4rem, 4vw, 3.5rem); margin-top: 34px; }
.page-shell p,
.page-shell li { font-size: 1.65rem; line-height: 1.7; color: var(--muted); }
.page-shell ul,
.page-shell ol { padding-left: 24px; margin-bottom: 20px; }
.page-actions { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px; }
.page-note {
    border-left: 4px solid var(--secondary);
    padding: 14px 18px;
    background: rgba(255,255,255,.07);
    border-radius: 8px;
}
.footer-links {
    max-width: 960px;
    width: 86%;
    margin: 12px auto 24px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 14px;
}
.footer-links a { color: var(--muted); }
@media (max-width: 745px) {
    h1 { font-size: 3.3rem; }
    h2 { font-size: 2.4rem; }
    .container { width: 90%; }
    .site-nav { align-items: flex-start; flex-direction: column; }
    .site-menu { justify-content: flex-start; width: 100%; }
    .site-menu a { width: 100%; text-align: center; }
    .page-shell { width: 90%; padding: 24px 18px; }
    .page-actions .btn { width: 100%; }
}
