:root {
        --neon-cyan: #00f7ff;
        --neon-pink: #ff3bd4;
        --neon-purple: #a970ff;
        --bg-velvet: #0a0a12;
    }

    body {
        background: radial-gradient(1200px 600px at 10% 0%, rgba(255, 59, 212, .10), transparent 40%),
            radial-gradient(1000px 500px at 90% 20%, rgba(0, 247, 255, .10), transparent 40%),
            var(--bg-velvet);
    }

    .brand-logo {
        height: 48px;
        width: 48px;
        border-radius: 50%;
        object-fit: cover;
        display: inline-block;
    }

    .navbar-brand {
        font-weight: 700;
        letter-spacing: .5px;
    }

    .navbar-brand {
        font-weight: 600;
        font-size: 1.3rem;
        color: #00e5ff !important;
        text-shadow: 0 0 5px #00e5ff, 0 0 12px rgba(0, 229, 255, 0.7);
    }


    .nav-link {
        color: #bbb !important;
        margin: 0 12px;
        font-weight: 500;
        display: flex;
        align-items: center;
        gap: 6px;

        transition: all 0.3s ease;
    }

    .nav-link:hover,
    .nav-link.active {
        color: #00e5ff !important;
        text-shadow: 0 0 6px #00e5ff, 0 0 15px rgba(0, 229, 255, 0.7);
    }

    .brand-glow {
        color: var(--neon-cyan);
        text-shadow: 0 0 8px rgba(0, 247, 255, .6), 0 0 24px rgba(0, 247, 255, .35)
    }

    .hero-title {
        font-weight: 800;
        line-height: 1.05;
    }

    .hero-title .accent {
        color: var(--neon-pink);
        text-shadow: 0 0 12px rgba(255, 59, 212, .55), 0 0 30px rgba(255, 59, 212, .3)
    }

    .glass {
        backdrop-filter: blur(8px);
        background: rgba(255, 255, 255, .06);
        border: 1px solid rgba(255, 255, 255, .08)
    }

    .card {
        border: 1px solid rgba(255, 255, 255, .08)
    }

    .card:hover {
        box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 10px 40px rgba(0, 0, 0, .35), 0 0 24px rgba(169, 112, 255, .25)
    }

    .neon-thumb {
        position: relative;
        overflow: hidden;
        border-radius: .8rem
    }

    .neon-thumb::before {
        content: "";
        position: absolute;
        inset: -2px;
        background: conic-gradient(from 180deg at 50% 50%, var(--neon-cyan), var(--neon-pink), var(--neon-purple), var(--neon-cyan));
        filter: blur(18px);
        opacity: .35
    }

    .neon-thumb>div {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 800;
        font-size: clamp(1.1rem, 2.6vw, 1.6rem);
        letter-spacing: .04em;
        color: white;
        text-shadow: 0 0 10px rgba(255, 255, 255, .6), 0 0 30px rgba(255, 255, 255, .35)
    }

    .neon-chip {
        border: 1px solid rgba(255, 255, 255, .15);
        background: rgba(255, 255, 255, .05)
    }

    .filter-bar .form-control,
    .filter-bar .form-select {
        background: rgba(255, 255, 255, .07);
        border: 1px solid rgba(255, 255, 255, .12)
    }

    .price {
        font-weight: 800
    }

    .cta-shadow {
        box-shadow: 0 0 16px rgba(0, 247, 255, .35), inset 0 0 8px rgba(0, 247, 255, .25)
    }

    .badge-neon {
        background: linear-gradient(90deg, rgba(0, 247, 255, .25), rgba(255, 59, 212, .25));
        border: 1px solid rgba(255, 255, 255, .2)
    }

    footer a {
        color: #b9f;
    }


    .neon-thumb::before {
        z-index: 0;
    }

    .neon-thumb img {
        position: relative;
        z-index: 1;
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .social-card {
        transition: .2s transform, .2s box-shadow;
    }

    .social-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 30px rgba(0, 0, 0, .25), 0 0 24px rgba(169, 112, 255, .2);
    }

    .social-link {
        display: flex;
        align-items: center;
        gap: .5rem;
        font-weight: 700;
        text-decoration: none;
    }

    .social-link i {
        font-size: 1.4rem;
    }

    .social-link:hover {
        text-decoration: none;
        filter: drop-shadow(0 0 8px rgba(0, 247, 255, .45));
    }

    .social-handle {
        font-weight: 600;
    }

    .form-select.select-oscuro {
        background-color: #111827;
        color: #e5e7eb;
        border-color: #374151;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    }

    .form-select.select-oscuro:focus {
        border-color: #3b82f6;
        box-shadow: 0 0 0 .25rem rgba(59, 130, 246, .25);
        color: #fff;
    }

    .form-select.select-oscuro option[value=""] {
        color: #9ca3af;
    }

    .form-select.select-oscuro {
        background-image:
            url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'><path d='M3.2 5.5l4.8 4.8 4.8-4.8' stroke='white' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
        background-repeat: no-repeat;
        background-position: right .75rem center;
        background-size: 16px 16px;
        padding-right: 2.25rem;
    }

    #catalogo { scroll-margin-top: 100px; }
    #como-funciona { scroll-margin-top: 80px; }
    #contacto { scroll-margin-top: 80px; }
    #redes { scroll-margin-top: 80px; }