/*
 * Capa visual del marketplace.
 * Solo cambia tipografía, superficies, bordes y estados de las ventanas existentes.
 * No altera el orden ni el contenido de las secciones.
 */
.cs-wrap,
.top-planes-section,
#classified-products,
#section_featured_sidebar,
#section_featured {
    --market-window-bg: #101725;
    --market-window-bg-soft: #151e2e;
    --market-window-line: #29354a;
    --market-window-text: #f2f7ff;
    --market-window-muted: #91a0b7;
    --market-window-cyan: #42d9d1;
    font-family: 'Oxanium', 'Inter', sans-serif;
}

.cs-wrap .cs-cats,
.cs-wrap .hero-tech,
.cs-wrap .deal-card,
.cs-wrap .cs-step,
.cs-wrap .pricing-card,
.cs-wrap .classified-product-card,
.top-planes-section .top-planes-realtime,
#section_featured_sidebar .card,
#section_featured .card {
    border: 1px solid var(--market-window-line);
    border-radius: 10px;
    background: linear-gradient(145deg, var(--market-window-bg-soft), var(--market-window-bg));
    box-shadow: 0 18px 45px rgba(0, 0, 0, .28);
}

.cs-wrap .cs-cats,
.cs-wrap .hero-tech,
.cs-wrap .cs-step,
.cs-wrap .pricing-card {
    position: relative;
    overflow: hidden;
}

.cs-wrap .cs-cats::before,
.cs-wrap .hero-tech::after,
.cs-wrap .cs-step::before,
.cs-wrap .pricing-card::after {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--market-window-cyan), transparent);
    content: '';
    opacity: .7;
}

.cs-wrap .cs-cats:hover,
.cs-wrap .hero-tech:hover,
.cs-wrap .cs-step:hover,
.cs-wrap .pricing-card:hover,
.cs-wrap .deal-card:hover {
    border-color: rgba(66, 217, 209, .65);
    box-shadow: 0 20px 52px rgba(0, 0, 0, .38), 0 0 0 1px rgba(66, 217, 209, .08);
}

.cs-wrap .cs-chip,
.cs-wrap .cs-eyebrow,
.cs-wrap .cs-badge,
.cs-wrap .pricing-badge {
    border: 1px solid rgba(66, 217, 209, .35);
    border-radius: 5px;
    color: var(--market-window-cyan);
    background: rgba(66, 217, 209, .08);
    font-family: 'Oxanium', 'Inter', sans-serif;
    letter-spacing: .08em;
}

.cs-wrap .cs-title,
.cs-wrap .hero-title,
.cs-wrap .pricing-card h3,
.cs-wrap .cs-step h4,
.cs-wrap .deal-name,
.cs-wrap .deal-price {
    font-family: 'Oxanium', 'Inter', sans-serif;
}

.cs-wrap .cs-sub,
.cs-wrap .hero-desc,
.cs-wrap .cs-step p,
.cs-wrap .pricing-card li,
.cs-wrap .deal-name {
    color: var(--market-window-muted);
}

.cs-wrap .pricing-btn,
.cs-wrap .cs-btn,
.cs-wrap .btn-premium {
    border-radius: 6px;
    font-family: 'Oxanium', 'Inter', sans-serif;
    letter-spacing: .04em;
}

.top-planes-section .top-planes-realtime {
    overflow: hidden;
}

.top-planes-section .top-planes-header {
    border-bottom: 1px solid var(--market-window-line);
}

.top-planes-section .plan-item {
    border: 1px solid rgba(41, 53, 74, .9);
    border-radius: 8px;
    background: rgba(16, 23, 37, .78);
    font-family: 'Oxanium', 'Inter', sans-serif;
}

@media (max-width: 575.98px) {
    .cs-wrap .cs-cats,
    .cs-wrap .hero-tech,
    .cs-wrap .cs-step,
    .cs-wrap .pricing-card,
    .top-planes-section .top-planes-realtime {
        border-radius: 8px;
    }
}