/* footer.css - v7 Mission Control redesign (Oct 2026). The footer is the
   bottom of the console: the four stripes across the top, the wordmark and
   a line about the org on the left, two link groups on the right, the
   small print underneath. Plain words, no em dashes (site rule). */

.site-footer {
    margin-top: auto;
}

.footer-container.v7-foot {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr);
    gap: 2rem clamp(2rem, 5vw, 5rem);
    padding: calc(28px + clamp(1.8rem, 4vw, 3rem)) var(--gutter) 1.3rem;
    background: var(--console);
    color: var(--console-ink-2);
    font-family: var(--font-body);
    overflow: hidden;
}

.footer-container.v7-foot::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 28px;
    background: var(--stripes-h);
}

.foot-brand p {
    margin: 0;
}

.foot-word {
    font-family: var(--font-display);
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    line-height: 1;
    text-transform: none;
    color: var(--console-ink);
}

.foot-line {
    max-width: 36ch;
    margin-top: 0.9rem !important;
    font-size: 1rem;
    color: var(--console-ink-2);
}

.foot-discord {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 1.2rem;
    padding: 0.55rem 1.1rem;
    border-radius: 999px;
    background: var(--s1);
    color: #07090C;
    font-family: var(--font-display);
    font-size: 0.68rem;
    letter-spacing: 0.04em;
    text-transform: none;
    text-decoration: none;
}

.foot-discord img {
    filter: brightness(0);
}

.foot-discord:hover {
    background: var(--accent);
    color: #07090C;
}

.footer-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 2rem;
}

.footer-group-title {
    margin: 0 0 0.8rem;
    color: var(--s1);
    font-family: var(--font-display);
    font-size: 0.66rem;
    letter-spacing: 0.04em;
    text-transform: none;
}

.footer-group ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.footer-group li {
    font-size: 0.95rem;
}

.footer-group a {
    color: var(--console-ink);
    text-decoration: none;
}

.footer-group a:hover {
    color: var(--s1);
    text-decoration: underline;
}

.footer-ref {
    margin-top: 0.3rem;
    line-height: 1.6;
}

.footer-group a.footer-item-text-refcode {
    display: inline-block;
    margin-top: 0.35rem;
    padding: 0.2rem 0.75rem;
    border: 2px dashed var(--s1);
    border-radius: 999px;
    color: var(--s1);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-decoration: none;
}

.footer-group a.footer-item-text-refcode:hover {
    background: var(--s1);
    color: #07090C;
}

.footer-legal {
    grid-column: 1 / -1;
    margin: 0;
    padding-top: 1.1rem;
    border-top: 1px solid var(--console-2);
    color: var(--console-ink-2);
    font-size: 0.85rem;
}

@media (max-width: 760px) {
    .footer-container.v7-foot {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 420px) {
    .footer-groups {
        grid-template-columns: 1fr;
    }
}

.theme-contrast .footer-container.v7-foot::before {
    background: #FFE000;
}

/* v9 Obsidian (Oct 2026): a quiet footer. */
.footer-container.v7-foot {
    padding-top: clamp(2rem, 4vw, 3rem);
    background: var(--console);
    border-top: 1px solid var(--rule);
}

.footer-container.v7-foot::before {
    display: none;
}

.foot-word {
    font-family: var(--font-body);
    font-size: clamp(1.4rem, 2.4vw, 1.8rem);
    font-weight: 650;
    letter-spacing: -0.03em;
    text-transform: none;
}

.foot-discord {
    padding: 0.5rem 1rem;
    background: var(--accent);
    color: var(--on-accent);
    font-family: var(--font-body);
    font-size: 0.92rem;
    font-weight: 550;
    letter-spacing: 0;
    text-transform: none;
}

.foot-discord:hover {
    background: var(--accent-hi);
    color: var(--on-accent);
}

.footer-group-title {
    color: var(--console-ink);
    font-family: var(--font-body);
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.footer-group a {
    color: var(--console-ink-2);
}

.footer-group a:hover {
    color: var(--console-ink);
}

.footer-group a.footer-item-text-refcode {
    border: 1px solid var(--rule);
    color: var(--ink);
    font-family: var(--font-crt);
    font-weight: 500;
}

.footer-group a.footer-item-text-refcode:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--on-accent);
}

.footer-legal {
    border-top: 1px solid var(--rule);
}

/* v10 Brutalist (Oct 2026): the footer is a black slab with a giant name. */
.footer-container.v7-foot {
    background: #0A0A0A;
    color: #A3A39E;
    border-top: 2px solid var(--rule);
}

.foot-word {
    font-family: var(--font-display);
    font-size: clamp(3rem, 8vw, 6.5rem);
    font-weight: 900;
    line-height: 0.85;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #F7F7F4;
}

.foot-line {
    color: #A3A39E;
    font-family: var(--font-mono);
    font-size: 0.85rem;
    text-transform: uppercase;
}

.foot-discord {
    border-radius: 0;
    border: 2px solid #F7F7F4;
    background: var(--accent);
    color: #fff;
    font-family: var(--font-mono);
    font-size: 0.82rem;
    font-weight: 500;
    text-transform: uppercase;
    box-shadow: 3px 3px 0 #F7F7F4;
}

.foot-discord img {
    filter: brightness(0) invert(1);
}

.foot-discord:hover {
    background: #F7F7F4;
    color: #0A0A0A;
}

.foot-discord:hover img {
    filter: brightness(0);
}

.footer-group-title {
    color: #4D5BFF;
    font-family: var(--font-mono);
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
}

.footer-group-title::before {
    content: "// ";
}

.footer-group a {
    color: #F7F7F4;
    font-family: var(--font-mono);
    font-size: 0.85rem;
    text-transform: uppercase;
}

.footer-group a:hover {
    color: #0A0A0A;
    background: #F7F7F4;
    text-decoration: none;
}

.footer-group li {
    color: #A3A39E;
}

.footer-group a.footer-item-text-refcode {
    border: 2px solid #F7F7F4;
    border-radius: 0;
    color: #F7F7F4;
}

.footer-legal {
    border-top: 2px solid #333;
    color: #8A8A85;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    text-transform: uppercase;
}

/* v11 Deep Space (Oct 2026): the footer as the bottom of the HUD. */
.footer-container.v7-foot {
    background: rgba(3, 8, 18, 0.85);
    border-top: 1px solid var(--rule);
    backdrop-filter: blur(10px);
}

body.theme-alt .footer-container.v7-foot {
    background: rgba(14, 3, 7, 0.85);
}

.foot-word {
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 3.6vw, 2.8rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.12em;
    color: var(--ink);
    text-shadow: 0 0 24px var(--glow-colour);
}

.foot-line {
    color: var(--ink-2);
    font-family: var(--font-body);
    font-size: 0.95rem;
    text-transform: none;
}

.foot-discord {
    border: 1px solid var(--accent);
    background: var(--accent);
    color: var(--on-accent);
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: 0.1em;
    box-shadow: 0 0 20px -4px var(--glow-colour);
    clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
}

.foot-discord img {
    filter: brightness(0);
}

.foot-discord:hover {
    background: var(--accent-hi);
    color: var(--on-accent);
}

.foot-discord:hover img {
    filter: brightness(0);
}

.footer-group-title {
    color: var(--accent);
    letter-spacing: 0.12em;
}

.footer-group-title::before {
    content: "> ";
}

.footer-group a {
    color: var(--ink-2);
    font-family: var(--font-body);
    font-size: 0.92rem;
    text-transform: none;
}

.footer-group a:hover {
    color: var(--accent-hi);
    background: none;
    text-shadow: 0 0 10px var(--glow-colour);
}

.footer-group li {
    color: var(--ink-3);
}

.footer-group a.footer-item-text-refcode {
    border: 1px solid var(--rule);
    color: var(--accent-hi);
    font-family: var(--font-mono);
}

.footer-group a.footer-item-text-refcode:hover {
    background: var(--accent);
    color: var(--on-accent);
}

.footer-legal {
    border-top: 1px solid var(--rule-soft);
    color: var(--ink-3);
    letter-spacing: 0.06em;
}

/* v12: show the Discord badge in its own colours on the button. */
.foot-discord img {
    filter: none;
}