/* Contenedor principal: Limpio, sin bordes toscos, con un fondo sutil */
.pmarquee-container {
    overflow: hidden;
    width: 100%;
    display: block;
    background-color: #fcfcfc; /* Un fondo casi blanco muy elegante */
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
    padding: 12px 0;
    box-sizing: border-box;
}

/* El riel que se mueve */
.pmarquee-track {
    display: flex;
    width: max-content;
}

/* Cada bloque de contenido. IMPORTANTE: Ahora no se estira (flex-start) */
.pmarquee-content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    /* La animación se calcula en base a la velocidad del shortcode */
    animation: pmarquee-scroll var(--marquee-speed, 35s) linear infinite;
}

/* Pausa suave al pasar el mouse para facilitar el clic */
.pmarquee-container:hover .pmarquee-content {
    animation-play-state: paused;
}

/* Los enlaces de tus elementos del portafolio */
.pmarquee-item {
    font-size: 1.05rem; /* Tamaño de letra elegante, ni muy grande ni muy chica */
    font-weight: 500;   /* Peso medio, look moderno */
    color: #2c2c2c;     /* Un gris casi negro, más suave que el negro puro */
    text-decoration: none;
    white-space: nowrap;
    display: flex;
    align-items: center;
    transition: color 0.25s ease;
}

/* Efecto hover fino */
.pmarquee-item:hover {
    color: #0073aa; /* Reemplaza por el color azul/rojo de tu marca si lo deseas */
}

/* SEPARADOR INTERMEDIO: Aquí controlamos el espacio real y el buen gusto */
.pmarquee-sep {
    display: inline-block;
    font-size: 0.75rem;     /* Más pequeño que el texto para no competir */
    color: #c5c5c5;         /* Color gris claro neutral, muy fino */
    padding: 0 25px;        /* ¡AQUÍ CONTROLAS EL ESPACIO! Si lo quieres más junto, baja a 15px o 20px */
    line-height: 1;
    user-select: none;
}

/* Animación fluida por hardware */
@keyframes pmarquee-scroll {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-100%);
    }
}