/* -------------------------------------------------------------------------- */
/*	Tech & Design Marquee
/* -------------------------------------------------------------------------- */

.aw-marquee {
    padding: 2rem 0;
    /* Vertical breathing room */
    background-color: var(--aw-color-dark, #1A0B0A);
    /* Dark background for contrast */
    color: var(--aw-color-light, #FEF2ED);
    overflow: hidden;
    position: relative;
    user-select: none;
    border-top: 1px solid rgba(254, 242, 237, 0.1);
    border-bottom: 1px solid rgba(254, 242, 237, 0.1);
}

.aw-marquee__wrapper {
    display: flex;
    overflow: hidden;
    width: 100%;
}

.aw-marquee__track {
    display: flex;
    align-items: center;
    white-space: nowrap;
    animation: marquee-scroll 30s linear infinite;
    will-change: transform;
}

.aw-marquee__item {
    font-family: var(--aw-font-sans, sans-serif);
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 800;
    text-transform: uppercase;
    padding: 0 1rem;
    display: inline-flex;
    align-items: center;
    /* Aesthetic: Outlined text effect */
    -webkit-text-stroke: 1px rgba(254, 242, 237, 0.3);
    color: transparent;
    transition: all 0.3s ease;
}

.aw-marquee__item:hover {
    color: var(--aw-color-primary, #FF005F);
    -webkit-text-stroke: 1px var(--aw-color-primary, #FF005F);
    cursor: default;
}

.aw-marquee__separator {
    display: inline-block;
    color: var(--aw-color-primary, #9500FF);
    /* Accent color */
    margin-left: 2rem;
    font-size: 0.5em;
    /* Smaller dot */
    vertical-align: middle;
    -webkit-text-stroke: 0;
}

@keyframes marquee-scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .aw-marquee {
        padding: 1.5rem 0;
    }

    .aw-marquee__track {
        animation-duration: 20s;
        /* Faster on smaller screens */
    }
}