.wx-socket-wrapper {
                background-color: #0b0d10;
                color: #888;
                font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
                font-size: 13px;
                padding: 42px 0 26px;
                border-top: 3px solid #E30613;
                position: relative;
                width: 100vw;
                margin-left: calc(-50vw + 50%);
                margin-right: calc(-50vw + 50%);
                box-sizing: border-box;
                z-index: 10;
            }

            .wx-socket-inner {
                max-width: 1400px;
                margin: 0 auto;
                padding: 0 40px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                flex-wrap: wrap;
                gap: 20px;
                position: relative;
                /* z-index más alto que el del botón "subir" (20), así el dropdown
                   (que vive dentro de este contenedor) puede superarlo sin tener
                   que quitar "position: relative" de aquí — quitarlo rompía la
                   referencia de posición de otro elemento de la página. */
                z-index: 25;
            }

            .wx-copy {
                display: flex;
                align-items: center;
                gap: 12px;
                flex-shrink: 0;
            }

            .wx-copy-logo {
                height: 26px;
                flex-shrink: 0;
                display: flex;
                align-items: center;
            }

            .wx-copy-logo img {
                display: block;
                height: 100% !important;
                width: auto !important;
            }

            .wx-copy-text strong {
                color: #fff;
                font-weight: 700;
                letter-spacing: 1px;
                text-transform: uppercase;
                font-size: 12px;
            }

            .wx-legal-menu {
                display: flex;
                gap: 28px;
                list-style: none;
                margin: 0;
                padding: 0;
                flex-wrap: wrap;
                justify-content: center;
                align-items: center;
            }

            .wx-legal-menu li {
                display: flex;
                align-items: center;
                margin: 0;
                padding: 0;
            }

            .wx-legal-menu > li > a {
                color: #666;
                text-decoration: none;
                font-size: 11px;
                text-transform: uppercase;
                font-weight: 600;
                letter-spacing: 0.5px;
                transition: color 0.25s ease;
                display: inline-flex;
                align-items: center;
                gap: 8px;
                white-space: nowrap;
            }

            .wx-legal-menu > li > a:hover {
                color: #fff;
            }

            /* ========================================
               LOGO DENTRO DEL MENÚ (patrocinador)
               Caja RECTANGULAR de altura fija (no cuadrada):
               se adapta al ancho real del logo en vez de
               forzarlo dentro de un cuadrado que lo encoge.
               Fondo blanco para contraste sobre el footer negro.
               ======================================== */
            .wx-menu-logo {
                height: 32px;
                flex-shrink: 0;
                border-radius: 5px;
                background: #fff;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 4px 8px;
                box-sizing: content-box;
            }

            .wx-menu-logo img {
                display: block;
                /* !important necesario: el tema tiene "img { max-width:100%; height:auto }"
                   y, por algún plugin de caché/optimización de CSS del sitio, esa regla
                   estaba ganando la cascada pese a que ".wx-menu-logo img" tiene más
                   especificidad. Comprobado en vivo: sin !important el logo se
                   renderizaba a su tamaño nativo (1300x422px, gigante). */
                height: 100% !important;
                width: auto !important;
                max-width: 140px !important;
                object-fit: contain;
            }

            /* ========================================
               DROPDOWN
               ======================================== */
            .wx-dropdown {
                position: relative;
            }

            .wx-dropdown-toggle {
                cursor: pointer;
            }

            .wx-dropdown-caret {
                width: 8px;
                height: 8px;
                flex-shrink: 0;
                transition: transform 0.25s ease;
            }

            .wx-dropdown.active .wx-dropdown-caret {
                transform: rotate(180deg);
            }

            .wx-dropdown-menu {
                position: absolute;
                bottom: calc(100% + 14px);
                top: auto;
                left: 50%;
                transform: translateX(-50%);
                background: #1a1d22;
                border: 1px solid #E30613;
                border-radius: 4px;
                min-width: 200px;
                list-style: none;
                margin: 0;
                padding: 6px 0;
                opacity: 0;
                visibility: hidden;
                transition: opacity 0.2s ease, visibility 0.2s ease;
                z-index: 100;
                box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.45);
                pointer-events: none;
            }

            .wx-dropdown-menu::after {
                content: '';
                position: absolute;
                top: 100%;
                left: 50%;
                transform: translateX(-50%);
                border: 6px solid transparent;
                border-top-color: #E30613;
            }

            .wx-dropdown.active > .wx-dropdown-menu {
                opacity: 1;
                visibility: visible;
                pointer-events: auto;
            }

            .wx-dropdown-menu a {
                display: block;
                padding: 10px 16px;
                color: #888;
                text-decoration: none;
                font-size: 11px;
                text-transform: uppercase;
                font-weight: 600;
                letter-spacing: 0.5px;
                white-space: nowrap;
                transition: background-color 0.2s ease, color 0.2s ease;
            }

            .wx-dropdown-menu a:hover {
                background-color: #E30613;
                color: #fff;
            }

            .wx-authority {
                font-size: 11px;
                color: #444;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 1px;
                display: flex;
                align-items: center;
                gap: 10px;
                flex-shrink: 0;
            }

            .wx-authority::before {
                content: '';
                width: 1px;
                height: 15px;
                background-color: #333;
            }

            .wx-top-btn {
                position: absolute;
                left: 50%;
                top: -22px;
                transform: translateX(-50%);
                width: 44px;
                height: 44px;
                background-color: #E30613;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                border: 4px solid #0b0d10;
                box-shadow: 0 0 15px rgba(227, 6, 19, 0.3);
                transition: all 0.25s ease;
                z-index: 20;
                padding: 0;
            }

            .wx-top-btn svg {
                width: 16px;
                height: 16px;
                stroke: #fff;
                fill: none;
                stroke-width: 2.5;
                stroke-linecap: round;
                stroke-linejoin: round;
                transition: stroke 0.25s ease;
            }

            .wx-top-btn:hover {
                background-color: #fff;
                transform: translateX(-50%) translateY(-3px);
                box-shadow: 0 0 20px rgba(255, 255, 255, 0.4);
            }

            .wx-top-btn:hover svg {
                stroke: #E30613;
            }

            @media (max-width: 900px) {
                .wx-socket-wrapper {
                    padding-top: 50px;
                }

                .wx-socket-inner {
                    flex-direction: column;
                    text-align: center;
                    gap: 22px;
                }

                .wx-legal-menu {
                    flex-direction: column;
                    gap: 16px;
                    width: 100%;
                }

                .wx-dropdown-menu {
                    position: static;
                    bottom: auto;
                    transform: none;
                    opacity: 0;
                    visibility: hidden;
                    max-height: 0;
                    overflow: hidden;
                    padding: 0;
                    border: none;
                    background: transparent;
                    box-shadow: none;
                    pointer-events: none;
                    transition: max-height 0.25s ease;
                }

                .wx-dropdown-menu::after {
                    display: none;
                }

                .wx-dropdown.active > .wx-dropdown-menu {
                    opacity: 1;
                    visibility: visible;
                    max-height: 300px;
                    padding: 8px 0 0;
                    pointer-events: auto;
                }

                .wx-top-btn {
                    position: fixed;
                    left: auto;
                    right: 18px;
                    top: auto;
                    bottom: 18px;
                    transform: none;
                    z-index: 999;
                }

                .wx-top-btn:hover {
                    transform: translateY(-4px);
                }

                .wx-authority::before {
                    display: none;
                }
            }