/* Jumbotron */
.jumbotron {
    padding-top: var(--jumbotron-padding);
    padding-bottom: var(--jumbotron-padding);
    margin-bottom: var(--jumbotron-padding);
    color: var(--jumbotron-color);
    background-color: var(--jumbotron-bg);

    h1, .h1 {
        color: var(--jumbotron-heading-color);
        position: relative;
        padding-top: 66px;

        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 46px;
            height: 46px;
            background-size: 46px 46px !important;
        }
    }

    p {
        margin-top: 60px;
        margin-bottom: calc(var(--jumbotron-padding) / 2);
        font-size: var(--jumbotron-font-size);
        font-weight: normal;
    }

    > hr {
        border-top-color: var(--jumbotron-bg);
    }

    .container &,
    .container-fluid & {
        border-radius: var(--bs-border-radius);
        padding-left: 15px;
        padding-right: 15px;
    }

    @media screen and (min-width: 768px) {
        & {
            padding-top: calc(var(--jumbotron-padding) * 1.6);
            padding-bottom: calc(var(--jumbotron-padding) * 1.6);
        }

        .container &,
        .container-fluid & {
            padding-left: calc(var(--jumbotron-padding) * 2);
            padding-right: calc(var(--jumbotron-padding) * 2);
        }

        h1,
        .h1 {
            font-size: var(--jumbotron-heading-font-size);
        }
    }
}
