/* Additions to the original red and white design. */
img { max-width: 100%; height: auto; }
.home-main { padding: 90px 20px 32px; }
.home-intro { text-align: center; max-width: 1000px; padding: 18px 0; }
.home-intro h1 { color: #ce0002; font-size: clamp(26px, 4vw, 38px); line-height: 1.25; }
.home-intro p { margin: 12px 0; }
.home-phone { display: inline-block; background: #ce0002; color: white; padding: 12px 24px; font-size: 22px; border-radius: 4px; }
.home-phone:hover, .home-phone:focus { color: white; background: #980002; }
#select-area { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; max-width: 1140px; height: auto; margin: 26px auto 0; padding: 0; background: transparent; }
.service-card { display: flex; flex-direction: column; background: #ce0002; color: white; border-radius: 4px; overflow: hidden; }
.service-card img { width: 100%; height: 145px; object-fit: cover; }
.service-card span { padding: 18px 10px; font-size: 20px; text-align: center; line-height: 1.4; }
.service-card:hover, .service-card:focus { color: white; background: #980002; }
a:focus-visible, button:focus-visible { outline: 3px solid #222; outline-offset: 4px; }
@media (max-width: 991px) { #select-area { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { #select-area { grid-template-columns: 1fr; } .service-card { flex-direction: row; align-items: center; } .service-card img { width: 100px; height: 100px; } .service-card span { text-align: left; font-size: 19px; } .home-main { padding: 80px 16px 24px; } }

/* Original full-screen, four-column service selector on desktop. */
@media (min-width: 992px) {
    .home-main { display: flex; flex-direction: column; padding: 0; }
    .home-intro { padding: 40px 20px; }
    #select-area { order: -1; width: 100%; max-width: none; height: 100vh; margin: 0; gap: 0; }
    .service-card { display: block; position: relative; height: 100%; border-radius: 0; }
    .service-card img { width: 100%; height: 100%; object-fit: cover; filter: blur(2px); }
    .service-card:hover img { filter: blur(5px); }
    .service-card span { position: absolute; bottom: 0; left: 0; width: 100%; min-height: 60px; padding: 10px; background: rgba(206, 0, 2, 0.9); border-right: 1px solid white; font-size: 28px; font-weight: 600; line-height: 40px; }
    .service-card:focus-visible { outline-offset: -4px; z-index: 1; }
}