/* NETSEMTEC - DELIVERY*/

/* Contenedor texto + camión */
.company-container.hero {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Wrapper donde va la pista y el camión */
.delivery-wrapper {
    position: relative;
    width: 70px;
    height: 32px;
}

/* Pista / carretera */
.delivery-road {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4px;
    background-color: #333;
    border-radius: 999px;
    overflow: hidden;

    /* línea central animada */
    background-image: linear-gradient(
        to right,
        transparent 0,
        transparent 6px,
        #ffffff 6px,
        #ffffff 12px
    );
    background-size: 18px 100%;
    animation: roadMove 0.5s linear infinite;
}

/* Camión encima de la pista */
.delivery-truck {
    position: absolute;
    bottom: 6px; /* justo encima de la pista */
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    pointer-events: none;
}

/* Imagen original del camión */
.delivery-truck__img {
    width: 32px;
    height: auto;
    display: block;
    filter: drop-shadow(0 0 2px rgba(0,0,0,0.4));
    animation: truckBounce 0.6s ease-in-out infinite;
}


/* ===== ANIMACIONES ===== */

/* La carretera se mueve hacia la izquierda */
@keyframes roadMove {
    0% {
        background-position-x: 0;
    }
    100% {
        background-position-x: -18px;
    }
}

/* Camión con ligero rebote, como si estuviera rodando */
@keyframes truckBounce {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-2px);
    }
    100% {
        transform: translateY(0);
    }
}

/* Llantas girando */
@keyframes wheelSpin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Ajustes pequeños para pantallas muy chicas */
@media (max-width: 480px) {
    .delivery-wrapper {
        width: 60px;
        height: 28px;
    }

    .delivery-truck__img {
        width: 28px;
    }

    .delivery-wheel {
        width: 8px;
        height: 8px;
    }

    .delivery-wheel--back {
        left: 12px;
    }

    .delivery-wheel--front {
        right: 8px;
    }
}

/* NETSEMTEC - FABRICANTES*/

/* Texto + icono fábrica en línea */
.company-container {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Contenedor del icono de fábrica */
.factory-wrapper {
    position: relative;
    width: 26px;
    height: 26px;
}

/* Icono original */
.factory-icon {
    width: 100%;
    height: auto;
    display: block;
}

/* “Burbujas” de humo */
.factory-smoke {
    position: absolute;
    right: 4px;                 /* ajústalo según dónde esté la chimenea */
    bottom: 55%;                /* punto de salida del humo */
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);  /* humo blanco */
    opacity: 0;
    pointer-events: none;
    animation: smokeUp 2.2s linear infinite;
}

/* Diferentes tiempos y ligeros desplazamientos para que no sean iguales */
.smoke-1 {
    animation-delay: 0s;
}

.smoke-2 {
    animation-delay: 0.5s;
    right: 6px;
}

.smoke-3 {
    animation-delay: 1s;
    right: 2px;
}

/* Animación del humo hacia arriba */
@keyframes smokeUp {
    0% {
        transform: translateY(0) scale(0.5);
        opacity: 0;
    }
    20% {
        opacity: 0.9;
    }
    60% {
        transform: translateY(-10px) scale(1);
        opacity: 0.5;
    }
    100% {
        transform: translateY(-18px) scale(1.3);
        opacity: 0;
    }
}