/* 
 * Animated Underline Styles for Highlighted Text
 */

/* Basic setup for the highlighted text */
.section-tagline .has-inline-color.has-base-color {
    position: relative;
    display: inline-block;
}

/* SVG Container style - hidden by default until scrolled into view */
.animated-svg-underline {
    position: absolute;
    bottom: -11px; /* 3px lower as requested */
    left: 0;
    width: 100%;
    opacity: 0;
    transform: scaleX(0);
    transform-origin: left;
    z-index: 0;
    visibility: hidden; /* Start hidden until scrolled to */
}

/* Animation for svg container */
.animated-svg-underline.animate {
    opacity: 0.85; /* 85% opacity as requested */
    transform: scaleX(1);
    transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.4s ease;
}

/* Path animation */
.animated-svg-underline.animate svg path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    stroke: #5b96c3;
    stroke-width: 0.5px;
    animation: drawPath 1.5s forwards ease-in-out;
}

/* Maintain the original fill color */
.animated-svg-underline svg .cls-4 {
    fill: #5b96c3;
}

@keyframes drawPath {
    to {
        stroke-dashoffset: 0;
    }
}