/* The page's opening: a big left-aligned title, a subtitle and its buttons */
.Billboard {
    --gap-base: 28px;

    box-sizing: border-box;
    width: 100%;
    max-width: calc(var(--base-content-width) + 64px);
    margin: 0 auto;
    padding: 0 32px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--gap-base);

    @media all and (max-width: 600px) {
        padding: 0 20px;
    }

    .logo {
        width: min(100px, 100%);
        aspect-ratio: 1;
        background-color: var(--color-text-strong);
        mask-image: url("../logos/hdrjpg_logo-95e2a532f23f2503324b31c7d11883ce.svg");
        mask-size: contain;
        mask-repeat: no-repeat;
        filter: drop-shadow(0 0 24px var(--color-accent-glow));
    }

    h1 {
        max-width: 14ch;

        b {
            font-weight: inherit;
            color: var(--color-emphasis);
            text-shadow: 0 0 28px var(--color-accent-glow), 0 0 2px var(--color-accent-glow);
        }
    }

    h2 {
        max-width: 640px;
        font-size: 21px;
        font-weight: 400;
        line-height: 1.5;
        letter-spacing: 0;
        color: var(--color-text-muted);

        & > .no-break {
            white-space: nowrap;
        }
    }

    &.fullScreen {
        min-height: 100vh;
    }
}