/* Home page layout fixes shared by every language: loaded by index.html and each <locale>/index.html. */
/* Pricing switcher: wrap on phones instead of widening the page (which pushed the header and menu off-screen). */
.pricing-toggle-wrap { max-width: 100%; flex-wrap: wrap; justify-content: center; }
@media (max-width: 600px) {
  .pricing-toggle-wrap { border-radius: 20px; gap: 4px; }
  .pricing-toggle-btn { padding: .55rem .9rem; font-size: .85rem; }
}

/* Floating middle / top buttons (assets/js/homepage-scroll-nav.js). Below the header so an open menu covers them. */
.pp-scroll-nav { position: fixed; inset-inline-end: max(16px, env(safe-area-inset-right)); bottom: calc(16px + var(--pp-scroll-nav-offset, 0px) + env(safe-area-inset-bottom)); z-index: 1050; display: flex; flex-direction: column; gap: 10px; transition: bottom .2s; }
.pp-scroll-nav[hidden], .pp-scroll-nav-btn[hidden] { display: none; }
.pp-scroll-nav-btn { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border-radius: 50%; border: 1px solid var(--line, #f1e4cf); background: var(--surface, #fff); color: var(--primary, #0f766e); box-shadow: 0 6px 20px #0000002e; cursor: pointer; transition: transform .15s, background .15s; }
.pp-scroll-nav-btn:hover { transform: translateY(-2px); background: var(--primary, #0f766e); color: #fff; }
.pp-scroll-nav-btn:focus-visible { outline: 3px solid var(--primary, #0f766e); outline-offset: 3px; }
.pp-scroll-nav-btn .pp-icon { position: relative; width: 22px; height: 22px; --pp-icon: url('/assets/icons/arrow-up.svg'); }
/* Bar above the arrow = top of page; bar through the arrow's tail = middle of page. */
.pp-scroll-nav-btn::before { content: ''; position: absolute; width: 16px; height: 2px; border-radius: 2px; background: currentColor; }
.pp-scroll-nav-btn { position: relative; }
.pp-scroll-nav-top::before { top: 11px; }
.pp-scroll-nav-middle .pp-icon { width: 18px; height: 18px; transform: translateY(-4px); }
.pp-scroll-nav-middle::before { bottom: 13px; }
@media (max-width: 600px) {
  .pp-scroll-nav { gap: 8px; inset-inline-end: max(12px, env(safe-area-inset-right)); }
  .pp-scroll-nav-btn { width: 44px; height: 44px; }
  .pp-scroll-nav-top::before { top: 9px; }
  .pp-scroll-nav-middle::before { bottom: 11px; }
}
/* Room under the footer so the buttons never sit on top of its last lines. */
.pp-has-scroll-nav body > footer::after { content: ''; display: block; height: 72px; }
@media (max-width: 600px) { .pp-has-scroll-nav body > footer::after { height: 120px; } }
@media print { .pp-scroll-nav { display: none !important; } }

/* Compression simulator: grid items may shrink below their longest word (long Russian/German labels). */
.simulator-grid > * { min-width: 0; }
.compression-modes, .simulator-preview { overflow-wrap: anywhere; }

/* Long compound words (German, Dutch, Russian...) must break inside headings on phones. */
h1, h2, h3 { overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; }
