/* Index page: full-width sections with a fixed (parallax) background image faded towards white. */
.k-parallax {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 380px;
    background-color: #fff;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

/* Flex items shrink to content, so the container needs full width for its centered text. */
.k-parallax > .mud-container {
    width: 100%;
}

.k-parallax-1 { background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), url('../img/background1.jpg'); }
.k-parallax-2 { background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), url('../img/background2.jpg'); }
.k-parallax-3 { background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), url('../img/background3.jpg'); }

/* Touch browsers (notably iOS) do not support fixed backgrounds. */
@media (hover: none) {
    .k-parallax {
        background-attachment: scroll;
    }
}

.k-counter-value {
    font-variant-numeric: tabular-nums;
}

.mud-typography.k-light {
    font-weight: 200;
}

.k-index-intro .mud-typography-body1 {
    line-height: 1.8;
}

.k-not-found {
    min-height: 60vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* FocusOnNavigate focuses the h1 programmatically on every page; the outline is noise. */
h1:focus {
    outline: none;
}

.mud-typography.k-not-found-code {
    font-size: clamp(6rem, 22vw, 12rem);
    line-height: 1;
    opacity: 0.85;
}