.mm-pghd {
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    max-width: var(--alignfull-max-width, var(--viewport-width));
    width: var(--alignfull-width, var(--viewport-width));
    clear: both;
    margin-left: var(--alignfull-margin-left, calc(50% - 50vw + var(--scrollbar-width, 0px) / 2));
    margin-right: var(--alignfull-margin-right, calc(50% - 50vw + var(--scrollbar-width, 0px) / 2));
    padding-left: var(--mm-pghd-padding, 6vw);
}

.mm-pghd.service-area-details {
    padding-top: var(--spacing-lg);
    padding-bottom: var(--spacing-md);
    flex-direction: column;
}

.mm-pghd.overflow-left {
    padding-left: 0;
    padding-right: var(--mm-pghd-padding, 6vw);
}

.mm-pghd:not(.overflow-image) {
    padding-right: var(--mm-pghd-padding, 6vw);
}

.mm-pghd-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.service-area-details .mm-pghd-content {
    margin-left: var(--spacing-md);
}

.service-area-details .mm-pghd-image {
	max-width: 700px;
}

.mm-pghd-content-inner {
    max-width: 700px;
}

@media only screen and (max-width: 799px) {

    .mm-pghd-image.logo-image,
    .mm-pghd-image.overflow-image {
        margin-bottom: var(--spacing-lg);
    }

    .mm-pghd.service-area-details {
        margin-top: var(--spacing-md);
    }
}

@media only screen and (min-width: 800px) {
    .mm-pghd, .mm-pghd.service-area-details {
        flex-direction: row;
        justify-content: space-between;
        gap: var(--spacing-md);
    }

    .mm-pghd.logo-image {
        justify-content: center;
    }

    .mm-pghd-content {
        flex-basis: 100%;
    }
}

@media only screen and (min-width: 1100px) {
    .mm-pghd-content {
        max-width: 1000px;
    }
}

@media only screen and (min-width: 1300px) {
    .mm-pghd {
        --mm-pghd-padding: 14vw;
    }

    .mm-pghd.overflow-image {
        --mm-pghd-padding: 8vw;
    }
}

@media only screen and (min-width: 1800px) {
    .mm-pghd {
        --mm-pghd-padding: 17vw;
    }
}


.mm-pghd-image.trap-image {
    --mm-pghd-mask-url: url('/wp-content/themes/mrs-michael-pro/icons/mm-trapezoid.svg');
}

.mm-pghd-image.overflow-image {
    --mm-pghd-mask-url: url('/wp-content/themes/mrs-michael-pro/icons/mm-overflow.svg');
}

.mm-pghd-image.overflow-left.overflow-image {
    --mm-pghd-mask-url: url('/wp-content/themes/mrs-michael-pro/icons/mm-overflow-left.svg');
}

.mm-pghd-image.trap-image img,
.mm-pghd-image.overflow-image img {
    -webkit-mask-image: var(--mm-pghd-mask-url);
    mask-image: var(--mm-pghd-mask-url);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
}

.mm-pghd-image.circle-image img {
    border-radius: 50%;
    aspect-ratio: 1/1;
    object-fit: cover;
}

.mm-pghd-image.circle-image img,
.mm-pghd-image.logo-image img {
    max-width: 70vw;
}

.mm-pghd-image-inner {
    text-align: center;
}

@media only screen and (min-width: 800px) {

    .mm-pghd-image.circle-image,
    .mm-pghd-image.logo-image {
        flex-basis: 40%;
    }

    .mm-pghd-image.circle-image img,
    .mm-pghd-image.logo-image img {
        max-width: 100%;
    }
}

.mm-pghd-image.rounded-image img {
    border-radius: 3rem;
}

.mm-pghd-content ol li::marker {
    font-size: var(--font-size-ml);
    color: var(--mm-blue);
    font-weight: 600;
}