/*
    OPTIX page, restyled to sit with the maintenance page (css/maintenance.css).
    The panel reuses .sp-path / .sp-path-primary for its border and red top bar; these rules undo the
    2024 rules in spectron.css and size the two lines of text.
*/

/* spectron.css made this a full-viewport orange gradient band; the house style has no gradients, and its
   100vw width ignored the scrollbar and the content column. The red top bar stands in for the orange. */
.page-optix .optix-container {
    width: auto;
    height: auto;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 5rem 2rem;
    background: #fff;
    color: var(--sp-ink);
    text-align: center;
}

/* sized like the maintenance h1; the markup is a div, and the content is frozen, so it gets the look by class */
.page-optix .title {
    font-size: 3rem;
    font-weight: 700;
    line-height: 1.15;
}

.page-optix .subtitle {
    font-size: 1.4rem;
    line-height: 1.4;
    color: var(--sp-muted);
}

@media (max-width: 600px) {
    .page-optix .optix-container {
        padding: 3rem 1.25rem;
    }

    .page-optix .title {
        font-size: 2.4rem;
    }

    .page-optix .subtitle {
        font-size: 1.2rem;
    }
}