/* Remove default text-shadow from h1 with blur effect */
h1[data-blur-processed] {
    text-shadow: none;
}

/* Container for the H1 blur effect */
.h1-blur-container {
    position: relative;
    display: inline-block;
    width: fit-content;
    max-width: 100%;
}

/* Base layer: Sharp bright text on top */
.h1-layer-sharp {
    position: relative;
    z-index: 2;
    display: block;
    color: #ffffff;
}

/* Blur layer: Behind sharp text, visible at edges */
.h1-layer-blur {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    display: block;
    /* Soft blur - visible only around edges */
    filter: blur(2px);
    opacity: 0.5;
}