/* SVG Line Overlay - Desktop Only */

/* Hide on mobile and tablets - only show on desktop */
.line-overlay-wrapper {
    display: none;
}

@media(min-width: 992px) {
    /* Wrapper: Full-width container */
    .line-overlay-wrapper {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 999;
        overflow: visible;
    }

    /* Inner container: Matches page content width */
    .line-overlay {
        position: relative;
        max-width: none; /* allow full viewport width */
        width: 100%;
        margin: 0 auto;
        padding: 0; /* remove side padding so image can use full width */
        height: 100%;
    }

    /* The SVG - positioned to start AFTER hero section */
    .line-overlay img {
        position: absolute;
        /* Position to start at shipping section */
        top: calc(100vh - 990px); /* Adjust this value to move up/down */
        left: 50%;
        /* Compress vertically so the line ends nearer the footer */
        transform: translateX(-50%) scaleY(var(--line-scale-y, 0.980));
        transform-origin: top center;

        /* Narrow the line to align closer to content width */
        width: min(var(--line-max-width, 1300px), 95vw);
        max-width: none;
        height: auto;

        display: block;
        pointer-events: none;

        /* Scroll reveal animation */
        clip-path: inset(0 0 100% 0);
        transition: clip-path 0.3s ease-out;
    }

    /* Adjustments for smaller desktop screens (13-inch monitors, 1280x720) */
    @media(min-width: 992px) and (max-width: 1366px) {
        .line-overlay img {
            /* Move line down more on smaller screens */
            top: calc(100vh - 990px);
            /* Make it slightly bigger */
            width: min(var(--line-max-width, 1400px), 99vw);
            /* Less vertical compression */
            transform: translateX(-50%) scaleY(var(--line-scale-y, 1.0));
        }
    }
}

/* Make sure body is positioned for absolute children */
body {
    position: relative;
}
