/* Ancient Kalastra - phone-width fixes (2026-09-26, board VM43 / ISS-030).
   The site CSS is a Vite build that cannot be rebuilt on the VPS, so these small overrides load after it
   (layouts/app.blade.php). Desktop is untouched: every rule is inside a narrow-screen media query.
   Measured at 390 px before: the header actions were 296 px wide (page 408 px), and the home page's
   decorative "KALASTRA" outline text (.hero-ghost, nowrap) made the page 599 px wide. */

@media (max-width: 560px) {
  /* "Download" and "Log in" are also in the burger menu - keep only Register + the menu button */
  .header-actions > a.btn-ghost { display: none; }
  .header-inner { gap: 10px; padding-left: 14px; padding-right: 14px; }
}

@media (max-width: 720px) {
  /* decorative outline text; far wider than a phone */
  .hero-ghost { display: none; }
}

/* safety net at EVERY width: nothing may make a page scroll sideways. Measured 2026-09-26: even on a 1351 px desktop the
   home page's .hero-ghost made the page 1469 px wide (pre-existing). clip does not create a scroll container, so the
   sticky header keeps working; browsers without clip ignore it. */
html, body { overflow-x: clip; }