.shapes-callout {
    --hx-uri: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'%3E%3Cpath d='M219.657 7.73372C239.894 -2.57788 262.999 -2.57787 280.343 7.73372L471.089 105.667C491.326 115.979 500 131.45 500 152.055L500 347.945C500 368.57 491.325 384.017 471.089 394.33L280.343 492.266C262.997 502.578 239.892 502.578 219.657 492.266L28.9106 394.33C11.5647 384.017 0.000534361 368.55 -3.04183e-05 347.945L-1.32931e-05 152.055C0.000410576 131.43 11.565 115.979 28.9106 105.667L219.657 7.73372Z' fill='white'/%3E%3C/svg%3E");

    /* Outer frame: hex mask + button color shows as border */
    .hx-frm {

        svg {
            width: 100%;
            height: auto;
            aspect-ratio: 1;
        }
    }

    /* Inner image: same hex mask inset 6px — exposes colored frame behind */
    
    /* Cluster container — sized to contain absolute children */
    .hx-cluster {
        aspect-ratio: 1.1;
    }

    [class*="hx-img-"] {
        position: absolute;
        aspect-ratio: 1;
    }

    .hx-img-1 {
        width: 72%;
        top: 0;
        right: 0;
    }

    .hx-img-2 {
        width: 36.8%;
        top: 14.9rem;
        left: 0;
    }

    .hx-img-3 {
        width: 26.8%;
        top: 18.2rem;
        right: 0;
    }

    .hx-clp {
        @media screen and (min-width: 1280px) {
            margin-top: -3.1rem;
        }

        @media screen and (min-width: 700px) and (max-width: 1279px) {
            max-width: 50vw;
            margin-inline: auto;
        }
    }

    /* Flair divider: circle bullet + horizontal line */
    .flr-bdr {
        display: flex;
        align-items: center;
        gap: 0.5rem;

        &::before {
            content: '';
            width: 10px;
            height: 10px;
            border-radius: 50%;
            border: 2px solid var(--buttons);
            flex-shrink: 0;
        }

        &::after {
            content: '';
            height: 2px;
            width: 80px;
            background-color: var(--primary);
            flex-shrink: 0;
        }
    }
}
