/* Text marker animation (in-view highlight)
   Trigger: .text-marker gets .is-inview when visible (via inview-marker.js)
   Marker: ~60% of text height, behind text, left-to-right sweep, then kept */

.text-marker {
    position: relative;
    z-index: 0;
}

.text-marker::after {
    content: '';
    position: absolute;
    left: 0;
    top: 40%;
    width: 100%;
    height: 60%;
    background: var(--color-accent3);
    opacity: 0.5;
    z-index: -1;
    transform: scaleX(0);
    transform-origin: left;
}

/* 初動で溜め → 一気に伸びる: cubic-bezier(0.85, 0, 0.15, 1) */
.text-marker.is-inview::after {
    animation: text-marker-sweep 0.65s cubic-bezier(0.85, 0, 0.15, 1) forwards;
}

@keyframes text-marker-sweep {
    from {
        transform: scaleX(0);
    }
    to {
        transform: scaleX(1);
    }
}