#about > div {
    display: grid;
    grid-template-columns: 1.5fr 2fr;
    height: 100%;
    margin-right: 10rem;
    gap: 5rem;
}

#profile-image-container {
    display: grid;
    place-items: center;
    overflow: clip;
    height: 100dvh;
    padding: 0 8rem;
}

#profile-image-container > figure {
    --skew_angle: 10deg;
    --image_size_increase: calc((tan(var(--skew_angle))) * 100dvh);
    width: 100%;
    height: 100dvh;
    transform: skew(calc(-1 * var(--skew_angle)));
    overflow: clip;
    border-right: var(--border-width-image) solid var(--border-color);
}

#profile-image-container > figure > img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    width: calc(100% + var(--image_size_increase));
    transform: skew(var(--skew_angle));
    margin-left: calc(-0.5 * var(--image_size_increase));
}

#about-content {
    display: grid;
    place-content: center;
    gap: 2rem;
}