main {
    & h1 {
        text-wrap: balance;
        font-size: calc(64px / 1.5);
        font-weight: 400;
        margin-top: 64px;
        margin-bottom: 16px;

        @media (max-width: 640px) {
            font-size: calc(48px / 1.5);
            font-weight: 500;
        }
    }

    & h2 {
        text-wrap: balance;
        font-size: calc(36px / 1.5);
        font-weight: 500;
        margin-top: 32px;
        margin-bottom: 16px;
    }

    & h3 {
        text-wrap: balance;
        font-size: calc(28px / 1.5);
        font-weight: 500;
        margin-top: 24px;
        margin-bottom: 16px;
    }

    & p {
        margin-top: 16px;
        margin-bottom: 16px;
    }

    & ul, & ol {
        margin-top: 16px;
        margin-bottom: 16px;
    }

    & li {
        margin-top: 8px;
        margin-bottom: 8px;
    }

    & a {
        color: oklch(0.5 0.13 150);

        &:hover {
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-decoration-skip-ink: none;
        }
    }

    & section {
        padding: 16px;

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

        & > *:last-child {
            margin-bottom: 0;
        }
    }

    & figure {
        position: relative;
        width: 100%;
        aspect-ratio: 16 / 9;
        min-height: 270px;

        & video {
            position: absolute;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        & figcaption {
            position: absolute;
            background: oklch(0.2 0.01 150 / 0.3);
            color: oklch(1 0 150);
            font-weight: 500;
            padding: 16px;
            left: 0;
            bottom: 0;
            right: 0;
        }
    }
}

