/* Language toggle (EN | ES | FR) in the header. Loaded only by pages that have an English, Spanish or French twin. */
.lang-toggle { display: inline-flex; align-items: center; font-family: var(--font-mono); font-size: var(--text-sm); }
.lang-toggle .lang-link { display: inline-flex; align-items: center; min-width: 2.25rem; min-height: 2.25rem; justify-content: center; padding: 0 .4rem; color: var(--ink-dim); text-decoration: none; }
.lang-toggle .lang-link + .lang-link { border-left: 1px solid var(--panel-edge); }
.lang-toggle .lang-link[aria-current="true"] { color: var(--ink); font-weight: 600; text-decoration: underline; text-underline-offset: .25em; }
.lang-toggle .lang-link:hover { color: var(--accent); }
.lang-toggle .lang-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
@media (max-width: 480px) {
  .site-header .wrap { gap: .4rem; }
  .site-header .brand { gap: .4rem; min-width: 0; }
  .site-header .brand span { font-size: 1.05rem; }
  .site-nav { gap: .15rem; }
  .site-nav .btn { padding: .5rem .6rem; font-size: .8rem; white-space: nowrap; }
  .lang-toggle .lang-link { min-width: 1.9rem; padding: 0 .2rem; }
  /* Brand, three language links, the theme and accent buttons and the Get Setliner button do not fit one
     375px row (about 440px). The brand keeps its width and the button moves to a second row under the
     controls, so nothing overlaps the wordmark. */
  .site-header .brand { flex: 0 0 auto; }
  .site-header .site-nav { flex: 1 1 0; min-width: 0; flex-wrap: wrap; justify-content: flex-end; row-gap: .4rem; }
  .site-header .site-nav .btn { order: 5; }
}
/* A short notice that a page exists only in English (legal pages, FAQ). */
.lang-note { border: 1px solid var(--panel-edge); background: var(--panel); border-radius: 12px; padding: 1rem 1.25rem; color: var(--ink); line-height: 1.6; margin-block: 1rem; }
/* Small "this link goes to an English page" tag on the Spanish pages. */
.en-tag { font: .65em/1 var(--font-mono); letter-spacing: .04em; color: var(--ink-faint, var(--ink-dim)); border: 1px solid var(--panel-edge); border-radius: 4px; padding: .1em .3em; vertical-align: .1em; }
/* The single Spanish home hero picture (the English page has a gallery). */
.es-shot { margin: 0; max-width: 60rem; }
.es-shot .showcase-cap { min-height: 0; margin: .8rem 0 0; }
/* Spanish and French nav labels are longer: keep each on one line, and hide the section links until the header
   has room for them next to the three language links (measured: Spanish fits from 1201px, French from 1241px
   with the tighter gaps below; .wrap stops growing at 1240px). */
.site-nav ul a { white-space: nowrap; }
@media (max-width: 1200px) { html[lang="es"] .site-nav ul { display: none; } }
@media (max-width: 1240px) { html[lang="fr"] .site-nav ul { display: none; } }
@media (min-width: 1241px) { html[lang="fr"] .site-nav { gap: 1.25rem; } html[lang="fr"] .site-nav ul { gap: 1rem; } }