.service-headline.sj-reveal{
position: relative;
display: inline-block;
color: #2b2b2b; } .service-headline.sj-reveal::after{
content: attr(data-text);
position: absolute;
inset: 0;
background: linear-gradient(to right, #FF5B23, #7373CD);
background-size: 120%;
background-position: center;
-webkit-background-clip: text;
background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
pointer-events: none;
clip-path: ellipse(0% 0% at var(--mx, 50%) var(--my, 50%));
transition: clip-path 1.6s cubic-bezier(.22,.61,.36,1), background-size 1.8s ease;
}
.service-headline.sj-reveal:hover::after{
clip-path: ellipse(140% 220% at var(--mx, 50%) var(--my, 50%));
background-size: 100%;
} .service-headline.sj-reveal::before{
content: attr(data-text);
position: absolute;
inset: 0;
color: #2b2b2b; pointer-events: none; clip-path: circle(var(--holeSize, 14px) at var(--mx, 50%) var(--my, 50%));
opacity: 0;
transition: opacity .15s ease;
}
.service-headline.sj-reveal:hover::before{
opacity: 1;
}