/* Added for hosting: keeps decorative glows from causing sideways scroll on phones */
html, body { overflow-x: clip; }

@media (max-width: 720px) {
  /* About hero: text and portrait stack instead of squeezing side by side */
  .r-stack { grid-template-columns: 1fr !important; }
  /* About experience rows: date, role and company stack */
  .r-exp { grid-template-columns: 1fr !important; gap: 4px !important; }
  /* Case-study badge: moves to the empty bottom-right of the hero so it no longer covers the rating box */
  .r-badge { top: auto !important; bottom: 28px !important; right: 20px !important; width: 84px !important; }
}

/* Phones and tablets have no hover, so homepage project thumbnails would stay blurred forever. Show them sharp. */
@media (hover: none) {
  .card-bg { filter: none !important; }
}