.hero-city {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    height: 50vh;
    position: relative;
}

/* Desktop (default - 1024px) */
.city-boston { background-image: url('/images/boston_hero-1024.jpg'); }
.city-brockton { background-image: url('/images/brockton_hero-1024.jpg'); }
.city-cambridge { background-image: url('/images/cambridge_hero-1024.jpg'); }
.city-framingham { background-image: url('/images/framingham_hero-1024.jpg'); }
.city-lawrence { background-image: url('/images/lawrence_hero-1024.jpg'); }
.city-lowell { background-image: url('/images/lowell_hero-1024.jpg'); }
.city-lynn { background-image: url('/images/lynn_hero-1024.jpg'); }
.city-newbedford { background-image: url('/images/newbedford_hero-1024.jpg'); }
.city-newton { background-image: url('/images/newton_hero-1024.jpg'); }
.city-quincy { background-image: url('/images/quincy_hero-1024.jpg'); }
.city-springfield { background-image: url('/images/springfield_hero-1024.jpg'); }
.city-worcester { background-image: url('/images/worcester_hero-1024.jpg'); }
.city-miami { background-image: url('/images/miami_hero-1024.jpg'); }
.city-coralsprings { background-image: url('/images/coralsprings_hero-1024.jpg'); }
.city-orlando { background-image: url('/images/orlando_hero-1024.jpg'); }
.city-fortlauderdale { background-image: url('/images/ftlauderdale_hero-1024.jpg'); }
.city-tampa { background-image: url('/images/tampa_hero-1024.jpg'); }
.city-bocaraton { background-image: url('/images/bocaraton_hero-1024.jpg'); }
.city-westpalmbeach { background-image: url('/images/westpalmbeach_hero-1024.jpg'); }
.city-parkland { background-image: url('/images/parkland_hero-1024.jpg'); }
.city-coconutcreek { background-image: url('/images/coconutcreek_hero-1024.jpg'); }
.city-davie { background-image: url('/images/davie_hero-1024.jpg'); }
.city-weston { background-image: url('/images/weston_hero-1024.jpg'); }
.city-pembrokepines { background-image: url('/images/pembrokepines_hero-1024.jpg'); }
.city-hollywood { background-image: url('/images/hollywood_hero-1024.jpg'); }
.city-boyntonbeach { background-image: url('/images/boyntonbeach_hero-1024.jpg'); }
.city-pompanobeach { background-image: url('/images/pompanobeach_hero-1024.jpg'); }
.city-margate { background-image: url('/images/margate_hero-1024.jpg'); }
.city-deerfieldbeach { background-image: url('/images/deerfieldbeach_hero-1024.jpg'); }
.city-delraybeach { background-image: url('/images/delraybeach_hero-1024.jpg'); }
.city-plantation { background-image: url('/images/plantation_hero-1024.jpg'); }

/* Tablet (max-width: 768px) */
@media (max-width: 768px) {
    .hero-city { height: 38vh; }

    .city-boston { background-image: url('/images/boston_hero-768.jpg'); }
    .city-brockton { background-image: url('/images/brockton_hero-768.jpg'); }
    .city-cambridge { background-image: url('/images/cambridge_hero-768.jpg'); }
    .city-framingham { background-image: url('/images/framingham_hero-768.jpg'); }
    .city-lawrence { background-image: url('/images/lawrence_hero-768.jpg'); }
    .city-lowell { background-image: url('/images/lowell_hero-768.jpg'); }
    .city-lynn { background-image: url('/images/lynn_hero-768.jpg'); }
    .city-newbedford { background-image: url('/images/newbedford_hero-768.jpg'); }
    .city-newton { background-image: url('/images/newton_hero-768.jpg'); }
    .city-quincy { background-image: url('/images/quincy_hero-768.jpg'); }
    .city-springfield { background-image: url('/images/springfield_hero-768.jpg'); }
    .city-worcester { background-image: url('/images/worcester_hero-768.jpg'); }
    .city-miami { background-image: url('/images/miami_hero-768.jpg'); }
    .city-coralsprings { background-image: url('/images/coralsprings_hero-768.jpg'); }
    .city-orlando { background-image: url('/images/orlando_hero-768.jpg'); }
    .city-fortlauderdale { background-image: url('/images/ftlauderdale_hero-768.jpg'); }
    .city-tampa { background-image: url('/images/tampa_hero-768.jpg'); }
    .city-bocaraton { background-image: url('/images/bocaraton_hero-768.jpg'); }
    .city-westpalmbeach { background-image: url('/images/westpalmbeach_hero-768.jpg'); }
    .city-parkland { background-image: url('/images/parkland_hero-768.jpg'); }
    .city-coconutcreek { background-image: url('/images/coconutcreek_hero-768.jpg'); }
    .city-davie { background-image: url('/images/davie_hero-768.jpg'); }
    .city-weston { background-image: url('/images/weston_hero-768.jpg'); }
    .city-pembrokepines { background-image: url('/images/pembrokepines_hero-768.jpg'); }
    .city-hollywood { background-image: url('/images/hollywood_hero-768.jpg'); }
    .city-boyntonbeach { background-image: url('/images/boyntonbeach_hero-768.jpg'); }
    .city-pompanobeach { background-image: url('/images/pompanobeach_hero-768.jpg'); }
    .city-margate { background-image: url('/images/margate_hero-768.jpg'); }
    .city-deerfieldbeach { background-image: url('/images/deerfieldbeach_hero-768.jpg'); }
    .city-delraybeach { background-image: url('/images/delraybeach_hero-768.jpg'); }
    .city-plantation { background-image: url('/images/plantation_hero-768.jpg'); }
}

/* Mobile (max-width: 480px) */
@media (max-width: 480px) {
    .hero-city { height: 26vh; }

    .city-boston { background-image: url('/images/boston_hero-320.jpg'); }
    .city-brockton { background-image: url('/images/brockton_hero-320.jpg'); }
    .city-cambridge { background-image: url('/images/cambridge_hero-320.jpg'); }
    .city-framingham { background-image: url('/images/framingham_hero-320.jpg'); }
    .city-lawrence { background-image: url('/images/lawrence_hero-320.jpg'); }
    .city-lowell { background-image: url('/images/lowell_hero-320.jpg'); }
    .city-lynn { background-image: url('/images/lynn_hero-320.jpg'); }
    .city-newbedford { background-image: url('/images/newbedford_hero-320.jpg'); }
    .city-newton { background-image: url('/images/newton_hero-320.jpg'); }
    .city-quincy { background-image: url('/images/quincy_hero-320.jpg'); }
    .city-springfield { background-image: url('/images/springfield_hero-320.jpg'); }
    .city-worcester { background-image: url('/images/worcester_hero-320.jpg'); }
    .city-miami { background-image: url('/images/miami_hero-320.jpg'); }
    .city-coralsprings { background-image: url('/images/coralsprings_hero-320.jpg'); }
    .city-orlando { background-image: url('/images/orlando_hero-320.jpg'); }
    .city-fortlauderdale { background-image: url('/images/ftlauderdale_hero-320.jpg'); }
    .city-tampa { background-image: url('/images/tampa_hero-320.jpg'); }
    .city-bocaraton { background-image: url('/images/bocaraton_hero-320.jpg'); }
    .city-westpalmbeach { background-image: url('/images/westpalmbeach_hero-320.jpg'); }
    .city-parkland { background-image: url('/images/parkland_hero-320.jpg'); }
    .city-coconutcreek { background-image: url('/images/coconutcreek_hero-320.jpg'); }
    .city-davie { background-image: url('/images/davie_hero-320.jpg'); }
    .city-weston { background-image: url('/images/weston_hero-320.jpg'); }
    .city-pembrokepines { background-image: url('/images/pembrokepines_hero-320.jpg'); }
    .city-hollywood { background-image: url('/images/hollywood_hero-320.jpg'); }
    .city-boyntonbeach { background-image: url('/images/boyntonbeach_hero-320.jpg'); }
    .city-pompanobeach { background-image: url('/images/pompanobeach_hero-320.jpg'); }
    .city-margate { background-image: url('/images/margate_hero-320.jpg'); }
    .city-deerfieldbeach { background-image: url('/images/deerfieldbeach_hero-320.jpg'); }
    .city-delraybeach { background-image: url('/images/delraybeach_hero-320.jpg'); }
    .city-plantation { background-image: url('/images/plantation_hero-320.jpg'); }
}


.hero-city .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 30, 60, 0.5);
}
.city-section {
    background-color: #0077b6;
}
.sherly-img {
    width: 180px;
    height: 180px;
    object-fit: cover;
    border-radius: 50%;
    object-position: center top;
    border: 4px solid #0077b6;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.sherly-intro-section {
    background-color: #f8f9fa;
}

@media (max-width: 768px) {
    .sherly-img {
        width: 140px;
        height: 140px;
    }
}