html[data-language="es"]:not([data-language-ready="true"]) body {
  visibility: hidden;
}

.language-panel[hidden] {
  display: none !important;
}

.lang-switch {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 1400;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.lang-switch :is(a, button) {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 36px;
  min-height: 36px;
  padding: 8px 9px 9px;
  border: 0;
  border-radius: 4px;
  color: #6f706c;
  background: transparent;
  cursor: pointer;
  font: 700 12px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  letter-spacing: .08em;
  text-decoration: none;
}

.lang-switch :is(a, button):hover {
  color: #20211f;
  background: transparent;
}

.lang-switch :is(a, button).active,
.lang-switch a[aria-current="page"] {
  color: #20211f;
  background: transparent;
}

.lang-switch :is(a, button) + :is(a, button)::before {
  content: "";
  position: absolute;
  top: 9px;
  bottom: 9px;
  left: 0;
  width: 1px;
  background: rgba(32, 33, 31, .24);
}

.lang-switch :is(a, button).active::after,
.lang-switch a[aria-current="page"]::after {
  content: "";
  position: absolute;
  right: 9px;
  bottom: 3px;
  left: 9px;
  height: 2px;
  border-radius: 999px;
  background: #e69a22;
}

.lang-switch :is(a, button):focus-visible {
  outline: 2px solid rgba(31, 111, 120, .42);
  outline-offset: 1px;
}

@media (min-width: 1021px) {
  .lang-switch.language-switch-in-header {
    position: static;
    top: auto;
    right: auto;
    z-index: auto;
    flex: 0 0 auto;
    margin: 0;
  }

  .lang-switch.language-switch-in-header.lang-intro-pending {
    animation: none !important;
  }
}

@media (max-width: 700px) {
  .lang-switch {
    top: 17px;
    right: 9px;
  }

  .lang-switch :is(a, button) {
    min-width: 30px;
    min-height: 34px;
    padding: 7px 7px 8px;
    font-size: 11px;
  }

  .lang-switch :is(a, button) + :is(a, button)::before {
    top: 8px;
    bottom: 8px;
  }

  .lang-switch :is(a, button).active::after,
  .lang-switch a[aria-current="page"]::after {
    right: 7px;
    bottom: 2px;
    left: 7px;
  }
}

@media (max-width: 1020px) {
  .lang-switch {
    transition: transform .72s cubic-bezier(.22, 1, .36, 1), opacity .72s ease;
    will-change: transform, opacity;
  }

  .lang-switch.reader-hidden-language {
    opacity: 0;
    transform: translateY(-12px);
    pointer-events: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lang-switch,
  .lang-switch :is(a, button) {
    transition: none !important;
  }
}

/* Translation-safe navigation: expand only when translated labels no longer fit. */
@media (max-width: 1020px) {
  #readerTopBar.reader-nav-measuring .navlinks,
  #readerTopBar.reader-nav-measuring .site-nav-links {
    display: flex !important;
    flex-wrap: nowrap !important;
  }

  #readerTopBar.reader-nav-measuring .navlinks a,
  #readerTopBar.reader-nav-measuring .site-nav-links a {
    white-space: nowrap !important;
  }

  #readerTopBar.reader-nav-five-links:not(.reader-nav-expanded) .navlinks,
  #readerTopBar.reader-nav-five-links:not(.reader-nav-expanded) .site-nav-links {
    justify-content: space-between !important;
    gap: 3px !important;
  }

  #readerTopBar.reader-nav-five-links:not(.reader-nav-expanded) .navlinks a,
  #readerTopBar.reader-nav-five-links:not(.reader-nav-expanded) .site-nav-links a {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    font-size: 14px !important;
    white-space: nowrap !important;
  }

  #readerTopBar.reader-nav-expanded .navlinks,
  #readerTopBar.reader-nav-expanded .site-nav-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    gap: 6px 8px !important;
    width: 100% !important;
  }

  #readerTopBar.reader-nav-expanded .navlinks a,
  #readerTopBar.reader-nav-expanded .site-nav-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 38px;
    padding: 4px 6px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-align: center !important;
    line-height: 1.15 !important;
  }

  #readerTopBar.reader-nav-expanded .navlinks a:last-child:nth-child(odd),
  #readerTopBar.reader-nav-expanded .site-nav-links a:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  #readerTopBar.reader-nav-five-links.reader-nav-expanded .navlinks,
  #readerTopBar.reader-nav-five-links.reader-nav-expanded .site-nav-links {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  #readerTopBar.reader-nav-five-links.reader-nav-expanded .navlinks a,
  #readerTopBar.reader-nav-five-links.reader-nav-expanded .site-nav-links a {
    padding: 4px 2px !important;
    font-size: 14px !important;
    overflow-wrap: normal;
    word-break: normal;
  }

  #readerTopBar.reader-nav-five-links.reader-nav-expanded .navlinks a:nth-child(-n + 3),
  #readerTopBar.reader-nav-five-links.reader-nav-expanded .site-nav-links a:nth-child(-n + 3) {
    grid-column: span 2 !important;
  }

  #readerTopBar.reader-nav-five-links.reader-nav-expanded .navlinks a:nth-child(n + 4),
  #readerTopBar.reader-nav-five-links.reader-nav-expanded .site-nav-links a:nth-child(n + 4) {
    grid-column: span 3 !important;
  }

  html.reader-nav-expanded #readerTopBar.nav + .hero h1,
  html.reader-nav-expanded #readerTopBar.nav + .guest-hero h1 {
    max-width: 100% !important;
    font-size: clamp(38px, 11vw, 54px) !important;
    overflow-wrap: break-word;
    text-wrap: balance;
  }

  html.reader-nav-expanded #readerTopBar.nav + .hero p,
  html.reader-nav-expanded #readerTopBar.nav + .guest-hero p {
    max-width: 100%;
    overflow-wrap: break-word;
  }

  html.reader-nav-expanded #readerTopBar.nav + .hero .actions {
    width: 100%;
    gap: 12px !important;
  }

  html.reader-nav-expanded #readerTopBar.nav + .hero .actions .btn {
    flex: 1 1 132px;
    min-width: 0 !important;
    white-space: normal !important;
    text-align: center;
  }
}
