/* ============================================================
   base.css
   ------------------------------------------------------------
   Typography, links, code, horizontal rule, small utilities,
   footer, and the layout container that wraps page content.
   ============================================================ */

/* ---------- Inline elements ---------- */
a {
    color: var(--orange);
    text-decoration: none;
}
a:hover { text-decoration: underline; }

code {
    font-family: var(--mono);
    font-size: 0.88em;
}

hr {
    border: 0;
    border-top: 1px solid var(--gray-200);
    margin: 12px 0;
}

/* ---------- Layout container ---------- */
.main { min-height: calc(100vh - 140px); }

/* ---------- Footer ---------- */
.footer {
    background: var(--white);
    border-top: 1px solid var(--gray-200);
    padding: 24px;
    margin-top: 40px;
    flex-shrink: 0;
}
.footer-inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    font-size: 0.82rem;
    color: var(--gray-600);
    flex-wrap: wrap;
    gap: 10px;
}
.footer-meta { color: var(--gray-400); }

/* ---------- Utilities ---------- */
.muted { color: var(--gray-600); }
.small { font-size: 0.78rem; }

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}