.pages {
    --page-width:  210mm;
    --page-height: calc(var(--page-width) * sqrt(2));

    width: var(--page-width);
    margin: 2em auto;

    font-size: 12pt;
    color: #222;

    display: grid;
    gap: 2em;

    & * {
        box-sizing: border-box;
    }

    & > * {
        position: relative;

        width:   var(--page-width);
        height:  var(--page-height);
        padding: 15mm;

        background-image: url('../assets/background.png');
        background-size:  cover;

        box-shadow: -10px 0 20px rgba(0, 0, 0, 0.3), 10px 0 20px rgba(0, 0, 0, 0.3);

        display: grid;
        gap: 10mm;

        &:has(> :last-child:nth-child(1)) {
            grid-template-columns: 1fr;
        }

        &:has(> :last-child:nth-child(2)) {
            grid-template-columns: repeat(2, 1fr);
        }

        & > * > :first-child {
            margin-top: 0;
        }

        & blockquote {
            margin: 1em 0;
            padding: 1em;

            background-color: #e0e5c1;
            border-image: url('../assets/note-wrap.png') 11 / auto / 9px 0;

            box-shadow: 1px 4px 14px #888;
        }

        & table {
            width: 100%;

            & td, th {
                border: 1pt solid #ccc;
            }
        }

        &::after {
            position: absolute;
            bottom: 0;

            width:  100%;
            height: 42pt;

            content: "";
            background-image: url('../assets/footer_even.png');
            background-size: cover;
        }
    }

    @media print {
        margin: 0;
    }
}

/* Überschriften und Absätze */
.phb h1,
.phb h2,
.phb h3,
.phb h4 {
    margin-top: .2em;
    margin-bottom: .2em;
    font-family: 'Times New Roman';
    font-weight: 800;
    color: #58180D;
}

.phb h1 {
    column-span: all;
    font-size: 1.6;
    -webkit-column-span: all;
    -moz-column-span: all;
}

.phb h2 {
    font-size: 1.4em;
}

.phb h3 {
    font-size: 1.2em;
    border-bottom: 2px solid #c9ad6a;
}

.phb h4 {
    margin-bottom: 0;
    font-size: 1em;
}

.phb h5 {
    margin-bottom: .2em;
    font-family: 'Times New Roman';
    font-size: .8em;
    font-weight: 900;
}
