/* PollSlide site — phone-width fixes shared by every page (2026-10-10).
   The top nav (logo + language picker + theme button + Try Free) was ~470px wide, so 23 of
   40 pages scrolled sideways on a phone. Measured at 320/360/390px in Chromium after this
   file: no page is wider than the screen. !important because each page carries its own
   inline <style>, which may load before or after this file. */
/* ── Phone menu (2026-10-12) ──────────────────────────────────────────────────────────────
   On a phone the ribbon is: PollSlide on the left, ☰ on the right, stuck to the top of the
   screen. ☰ opens every link of the desktop ribbon as a list, with the language picker,
   Log in and Try Free. The button is added by i18n.js (every page with a ribbon loads it);
   without JavaScript the old compact ribbon below still applies. */
.nav-burger { display: none; }
@media (max-width: 760px) {
  nav:not(.toc):not(.help-nav), .has-burger { position: sticky !important; top: 0 !important; z-index: 300 !important; }
  .nav-inner { padding: 0 16px !important; flex-wrap: nowrap !important; }
  .has-burger .nav-burger { display: inline-flex !important; align-items: center; justify-content: center; width: 42px; height: 42px; margin-left: auto; flex-shrink: 0;
    background: var(--surface2, #1a1a2c); border: 1px solid var(--border2, rgba(255,255,255,.14)); border-radius: 11px; color: var(--text, #fff); cursor: pointer; padding: 0; }
  .has-burger .nav-burger svg { width: 20px; height: 20px; }
  .has-burger .nav-links { display: none !important; }
  .has-burger.nav-open .nav-links { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important;
    position: absolute; left: 0; right: 0; top: 100%; margin: 0 !important; padding: 6px 18px 18px !important; font-size: 16px !important;
    background: var(--bg, #07070f); border-bottom: 1px solid var(--border2, rgba(255,255,255,.14)); box-shadow: 0 30px 60px rgba(0,0,0,.55);
    max-height: calc(100vh - 60px); max-height: calc(100dvh - 60px); overflow-y: auto; }
  body.light .has-burger.nav-open .nav-links { background: #fff; }
  .has-burger.nav-open .nav-links > a { display: block !important; padding: 14px 4px !important; font-size: 16px !important; color: var(--text, #fff) !important;
    border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); white-space: normal; }
  /* Try Free and Log in first — they are what most people open the menu for. */
  .has-burger.nav-open .nav-links > a.btn { display: flex !important; justify-content: center; text-align: center; border-bottom: none; margin: 8px 0 4px; padding: 14px !important; order: -1; }
  .has-burger.nav-open .nav-links > a.btn-primary, .has-burger.nav-open .nav-links > a.btn:not(.btn-ghost) { order: -2; }
  .has-burger.nav-open .nav-links > a.nav-mobile-cta { display: none !important; }      /* the second "Try Free" some pages carry for phones */
  .has-burger.nav-open #langSelWrap { display: block !important; padding: 14px 0 4px; }
  .has-burger.nav-open #langSelWrap select { max-width: none !important; width: 100% !important; font-size: 16px !important; padding: 11px 12px !important; }
  .has-burger.nav-open .nav-links > button { display: inline-flex !important; align-self: flex-start; margin-top: 10px; }
  /* no JavaScript: the compact ribbon, as before */
  nav:not(.has-burger) .nav-links { gap: 8px !important; }
  nav:not(.has-burger) #langSelWrap select { max-width: 84px !important; }
  nav:not(.has-burger) .nav-links .btn { padding: 8px 13px !important; }
  nav:not(.has-burger) .nav-links .theme-btn { display: none !important; }
}
/* Decorative glows sit partly off-screen on purpose; clip (not hidden) keeps sticky navs working. */
html, body { overflow-x: clip; }
/* Nav labels never break mid-label ("Wie es / funktioniert"), at any width or language. */
.nav-links > a, .nav-links .btn { white-space: nowrap; }