.signal-page-wrapper {
    min-height: 100vh;
    background: var(--background);
    color: var(--foreground);
}

.signal-site-header {
    width: min(900px, calc(100% - 50px));
    margin: 0 auto;
    padding: 65px 0 20px;
}

.signal-site-header a {
    color: var(--foreground);

    font-size: 1.65rem;
    font-weight: bold;

    letter-spacing: 0.08em;
    text-decoration: none;

    text-shadow:
        1px 0 var(--accent),
        -1px 0 var(--cyan);
}

.signal-site-header a:hover {
    color: var(--foreground);
}

.signal-page {
    width: min(900px, calc(100% - 50px));
    margin: 0 auto;
    padding: 20px 0 65px;

    font-size: var(--font-reading);
    line-height: 1.7;
}

.signal-header {
    margin-bottom: 2rem;
}

.signal-navigation {
    margin-bottom: 2rem;
}

.signal-navigation a {
    color: var(--cyan);

    font-size: var(--font-ui);
    letter-spacing: 0.08em;

    text-decoration: none;
}

.signal-navigation a:hover {
    color: var(--accent);
}

.signal-indicator {
    color: var(--cyan);

    display: inline-block;

    font-size: var(--font-system);
    letter-spacing: 0.15em;
    text-transform: uppercase;

    animation: signal-pulse 3s ease-in-out infinite;
}

@keyframes signal-pulse {
    0%,
    100% {
        opacity: 0.4;
    }

    50% {
        opacity: 1;
    }
}

.signal-page h1 {
    color: var(--foreground);

    font-size: 1.8rem;
    line-height: 1.25;

    margin-top: 2rem;
    margin-bottom: 2rem;
}

.signal-page h2 {
    color: var(--accent);

    margin-top: 2.5rem;

    font-size: 1rem;
    letter-spacing: 0.12em;
}

.signal-meta {
    margin-bottom: 2.5rem;
    line-height: 1.5;
}

.signal-source {
    color: var(--cyan);
    margin-bottom: 1.5rem;
}

.signal-page blockquote {
    color: var(--foreground);

    margin: 2rem 0;
    padding-left: 1.5rem;

    border-left: 3px solid var(--accent);

    font-size: 1.05rem;
}

.signal-copyright {
    color: var(--muted);
    font-size: 1rem;
}

.signal-page a {
    color: var(--cyan);
}

.signal-page a:hover {
    color: var(--accent);
}

.signal-received {
    color: var(--cyan);

    display: inline-block;

    margin-top: 4rem;
    margin-bottom: 3rem;

    font-size: var(--font-system);
    letter-spacing: 0.12em;
    line-height: 1.8;

    animation: signal-confirm 4s ease-in-out infinite;
}

@keyframes signal-confirm {
    0%,
    100% {
        opacity: 0.45;
    }

    50% {
        opacity: 1;
    }
}

.signal-navigation-bottom {
    margin-top: 3rem;
}


/* =========================================================
   SIGNAL · BORDCOMPUTER EINFLUG
   ========================================================= */

.signal-board-flight {
    opacity: 0;
}

.signal-board-flight-top {
    animation:
        signalBoardAppear 0.8s ease-out 0.2s forwards,
        signal-pulse 3s ease-in-out 1.0s infinite;
}

.signal-board-flight-bottom {
    animation:
        signalBoardAppear 0.8s ease-out 0.8s forwards,
        signal-confirm 4s ease-in-out 1.6s infinite;
}

@keyframes signalBoardAppear {
    from {
        opacity: 0;
        transform: translateX(-5px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.signal-legal-footer {
    margin-top: 44px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
    font-size: var(--font-micro);
    color: var(--muted);
}

.signal-legal-footer a {
    color: var(--muted);
    text-decoration: none;
}

.signal-legal-footer a:hover {
    color: var(--accent);
}

.signal-legal-footer span {
    margin: 0 8px;
}


.signal-legal-footer .signal-footer-mail {
    margin: 0;
    color: var(--muted);
    font-size: inherit;
    letter-spacing: inherit;
}