/* Desplegable «Compañías» del menú principal.
   Compartido por la landing (template/landing.html) y por las páginas
   editoriales (src/SeoLayout.php), para que el menú sea el mismo en todo el
   sitio. Abre con hover y también con teclado, vía :focus-within. */

.ge-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.ge-menu__trigger {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    font: inherit;
}

.ge-menu__chevron {
    transition: transform .18s ease;
    flex: none;
}

.ge-menu:hover .ge-menu__chevron,
.ge-menu:focus-within .ge-menu__chevron {
    transform: rotate(180deg);
}

.ge-menu__panel {
    position: absolute;
    top: 100%;
    left: -14px;
    margin-top: 10px;
    min-width: 290px;
    max-height: min(70vh, 460px);
    overflow-y: auto;
    background: #fff;
    border: 1px solid #e3e6e2;
    border-radius: 14px;
    box-shadow: 0 24px 48px -28px rgba(17, 20, 19, .5);
    padding: 8px;
    /* El menú de la landing va con white-space:nowrap; el panel necesita
       recuperar el salto de línea para que la descripción no se salga. */
    white-space: normal;
    display: flex;
    flex-direction: column;
    gap: 2px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .16s ease, transform .16s ease, visibility .16s;
    z-index: 40;
}

/* Puente invisible entre el enlace y el panel: sin él, el cursor pierde el
   hover al cruzar el hueco de 10px y el desplegable se cierra. */
.ge-menu__panel::before {
    content: '';
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
}

.ge-menu:hover .ge-menu__panel,
.ge-menu:focus-within .ge-menu__panel {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.ge-menu__item {
    display: block;
    padding: 10px 12px;
    border-radius: 10px;
    text-decoration: none;
    color: #111413;
}

.ge-menu__item:hover,
.ge-menu__item:focus-visible {
    background: #f4fdf8;
    opacity: 1;
}

.ge-menu__item-name { display: block; font-size: 15px; font-weight: 700; letter-spacing: -.01em; }

.ge-menu__item-claim {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
    color: #7b827d;
}

.ge-menu__empty { display: block; padding: 10px 12px; font-size: 14px; color: #7b827d; }

.ge-menu__all {
    display: block;
    margin-top: 4px;
    padding: 11px 12px;
    border-top: 1px solid #eef0ed;
    font-size: 14px;
    font-weight: 700;
    color: #0f7a53;
    text-decoration: none;
}

/* Cajón móvil de la landing: el desplegable se abre como acordeón nativo. */

.ge-submenu { border-bottom: 1px solid #eef0ed; }

.ge-submenu > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 18px;
    font-weight: 600;
    padding: 15px 4px;
    cursor: pointer;
    list-style: none;
}

.ge-submenu > summary::-webkit-details-marker { display: none; }
.ge-submenu > summary::after { content: '+'; color: #0f7a53; font-weight: 800; font-size: 20px; }
.ge-submenu[open] > summary::after { content: '−'; }

.ge-submenu__link {
    display: block;
    padding: 12px 4px 12px 16px;
    font-size: 16px;
    font-weight: 500;
    color: #4d544f;
    text-decoration: none;
    border-left: 2px solid #e3e6e2;
    margin-left: 4px;
}

.ge-submenu__link--all { font-weight: 700; color: #0f7a53; }

/* Navegacion generada desde `src/Nav.php` -------------------------------
   Las clases de abajo las emiten los renderizadores comunes a las dos
   cabeceras. Al pasar a una sola fuente de enlaces, viven aqui. */

/* Enlaces del desplegable de «Precio de la luz». */
.ge-menu__link {
    display: block;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    color: #111413;
    text-decoration: none;
    white-space: nowrap;
}

.ge-menu__link:hover { background: #f2f4f1; }

/* Cajon movil de la home: replica lo que antes iba en linea en la maqueta. */
.ge-drawer__link {
    font-size: 18px;
    font-weight: 600;
    padding: 15px 4px;
    border-bottom: 1px solid #eef0ed;
    text-decoration: none;
}

/* Pagina en curso. Se marca tambien con `aria-current`, no solo con color. */
.ge-nav__link.is-current,
.ge-menu__trigger.is-current {
    color: #111413;
    font-weight: 700;
}