*{box-sizing:border-box;margin:0;padding:0}
    body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:#f8f9fa}

    /* ===== Header (desktop defaults) ===== */
    .gyt-header{background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.08);position:relative;z-index:200}
    .gyt-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1300px;margin:0 auto;padding:15px 20px}
    .gyt-logo{font-size:28px;font-weight:700;color:#000}
    .gyt-mobile-toggle{display:none;background:none;border:0;font-size:28px;cursor:pointer}

    .gyt-nav-list{display:flex;list-style:none;gap:8px;align-items:center}
    .gyt-nav-link{display:block;padding:14px 16px;color:#000;text-decoration:none;font-weight:500;transition:color .15s}
    .gyt-nav-link:hover,.gyt-nav-link.active{color:#2c5aa0;border-bottom:2px solid #3182ce}

    .gyt-subnav{background:#f7fafc;border-top:1px solid #e2e8f0}
    .gyt-subnav-content{max-width:1200px;margin:0 auto;padding:8px 20px}
    .gyt-subnav-list{display:flex;gap:18px;list-style:none}

    /* ===== Responsive: móvil (con animación) ===== */
    @media (max-width:768px){
      .gyt-mobile-toggle{display:block}

      /* En móvil el nav se maneja como panel colapsable animado.
         Evitamos usar display:none para poder animar max-height y opacity. */
      .gyt-main-nav{
        /* estado cerrado */
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transform: translateY(-6px);
        transition: max-height 320ms cubic-bezier(.2,.9,.2,1), opacity 200ms ease, transform 260ms ease;
        background: #fff;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        box-shadow: 0 8px 30px rgba(0,0,0,.08);
        z-index: 999;
        border-top: none;
      }

      /* Cuando está abierto: max-height grande suficiente para todos los items */
      .gyt-main-nav.open{
        max-height: 520px; /* ajusta si tienes más links */
        opacity: 1;
        transform: translateY(0);
      }

      .gyt-nav-list{flex-direction:column;padding:8px 0}
      .gyt-nav-link{padding:14px 20px;border-bottom:1px solid #eee}

      .gyt-subnav{display:none}
    }

    /* ===== prefers-reduced-motion ===== */
    @media (prefers-reduced-motion: reduce){
      .gyt-main-nav,
      .gyt-main-nav.open{
        transition: none !important;
      }
    }
    /* Quitar líneas negras (outline) en botones y enlaces */
.gyt-mobile-toggle:focus,
.gyt-mobile-toggle:active,
.gyt-nav-link:focus,
.gyt-nav-link:active {
  outline: none;
  box-shadow: none;
}

/* Agregar un foco accesible pero estético (para teclado) */
.gyt-mobile-toggle:focus-visible,
.gyt-nav-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(49, 130, 206, 0.4);
  border-radius: 6px;
}