.blog-post-container {
	& h1 {
		font-size: var(--font-size-h2);
		font-weight: 400 !important;
		line-height: 1.2;
		color: var(--color-primary);
	}

	& h2 {
		font-size: var(--font-size-h4);
		font-weight: var(--font-weight-h4);
		line-height: 1.4;
		color: var(--color-primary);
		margin-block: 3rem 1rem;
	}

	& h3 {
		font-size: var(--font-size-h5);
		font-weight: var(--font-weight-h5);
		line-height: 1.4;
		color: var(--color-primary);
		margin-block: 2rem 0.75rem;
	}

	& h4,
	& h5,
	& h6 {
		font-size: var(--font-size-h6);
		font-weight: var(--font-weight-h6);
		line-height: 1.4;
		color: var(--color-primary);
		margin-block: 1.5rem 0.5rem;
	}

	& .post-thumbnail {
		& img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			border-radius: 1.25rem;
		}
	}

	& .post-content {
		& :not(h1, h2, h3, h4, h5, h6, span) {
			color: var(--color-tertiary);
		}

		& :is(strong, em, b) {
			font-weight: 700;
		}

		& p {
			font-size: 1rem;
			&:not(:last-child) {
				margin-bottom: 0.75rem;
			}
		}

		& a {
			color: var(--color-octonary);
			text-decoration: underline;
			transition: 300ms ease-in-out;

			&:hover {
				color: var(--color-secondary);
			}
		}

		& :is(ul, ol) {
			list-style: revert;
			padding: revert;
			margin: revert;
		}
	}
}

.tldr-summary[aria-label="Summary"] {
    padding: 2rem 1.5rem 2rem 1.5rem;
    margin: 3rem 0rem 3rem 0rem;
    border-width: 1px 1px 1px 1px;
    background-color: #FFFFFF;
    border-color: #052E44;
    border-radius: 1rem 1rem 1rem 1rem;
    border-style: solid;

    & .tldr-title {
        font-size: 1.75rem;
        color: #052E44;
        margin-block-start: 0 !important;
        margin-block-end: 0.5rem !important;
        font-weight: 700;
    }

    & p {
        font-size: 1rem;
        &:last-child {
            margin-bottom: 0 !important;
        }
    }
}