.half-mockup-block {
position: relative;
overflow: hidden;
}
.half-mockup-block .section-title {
position: relative;
}
.half-mockup-block .section-title::after {
content: "";
position: absolute;
bottom: -8px;
left: 0;
width: 60px;
height: 3px;
background: currentColor;
}
.logo-stroke {
animation: float 6s ease-in-out infinite;
}
.logo-stroke svg {
height: 100%;
width: 100%;
}
.scroll-video {
transition: none;
will-change: transform;
}
.video-frame-control {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
}
.video-loading {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 14px;
z-index: 5;
}
.scroll-progress {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 3px;
background: rgba(255, 255, 255, 0.2);
z-index: 1000;
}
.scroll-progress::after {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
background: #ef4444;
width: 0%;
transition: width 0.1s ease;
}