/* Miracle Farm Boys Ranch only.
   Styles here load after site.css on this site and nowhere else.
   Put any look change that was asked for this site alone here, with a short note saying what it is and when it was asked for.
   Once a month we review these files and move anything all four sites should share into site.css. */

/* Homepage hero headline fits on two lines on phones without making the text smaller (Luke, 2026-11-01) */
@media (max-width: 700px) {
  .hero h1 { letter-spacing: -0.02em; text-wrap: balance; }
}

/* Homepage hero on phones matches the live site: the video or photo is a short 16:9 band, with the headline and buttons below it on navy (Luke, 2026-11-02) */
@media (max-width: 700px) {
  .hero { display: block; min-height: 0; }
  .hero::before { display: none; }
  .hero-video { position: relative; inset: auto; width: 100%; aspect-ratio: 16 / 9; z-index: 0; }
  .hero-text { padding: 26px 0 34px; }
}