.locations-hero { background: #f2f6fd; }
.locations-hero h5 { color: #05264e; font-weight: 700; margin-bottom: 0; }
.locations-hero-copy { color: #6c7a91; max-width: 1220px; margin: 0 auto; }
.locations-hero-copy p { margin: 0; line-height: 1.8; }
.locations-directory { padding: 100px 0; background: var(--body-bg, #f7f9fc); }
.locations-heading { display: flex; gap: 2rem; align-items: end; justify-content: space-between; margin-bottom: 2.5rem; }
.locations-heading > div { max-width: 720px; }
.locations-heading h2 { margin: .5rem 0 1rem; }
.locations-filter { display: flex; align-items: center; gap: .65rem; min-width: 300px; padding: .8rem 1rem; border: 1px solid #dfe5ef; border-radius: 10px; background: #fff; box-shadow: 0 8px 24px rgba(15,35,70,.06); }
.locations-filter input { width: 100%; border: 0; outline: 0; background: transparent; }
.locations-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.location-card { display: flex; flex-direction: column; padding: 0 2rem 2rem; overflow: hidden; border: 1px solid #e4e9f1; border-radius: 16px; background: #fff; box-shadow: 0 10px 35px rgba(15,35,70,.07); transition: transform .2s, box-shadow .2s; }
.location-card:hover { transform: translateY(-4px); box-shadow: 0 16px 42px rgba(15,35,70,.12); }
.location-photo { height: 210px; margin: 0 -2rem 1.5rem; overflow: hidden; background: #e9effa; }
.location-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.location-card:hover .location-photo img { transform: scale(1.035); }
.location-photo-fallback { display: grid; place-items: center; color: #3c65f5; font-size: 3rem; background: linear-gradient(135deg, #edf3ff, #dbe7ff); }
.location-card-top { display: flex; align-items: center; justify-content: space-between; }
.location-pin { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; color: #fff; background: #3c65f5; }
.location-label { color: #3c65f5; font-size: .76rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.location-card h3 { margin: 1.25rem 0 .75rem; font-size: 1.45rem; }
.location-description { color: #667085; }
.location-card address, .location-contact, .location-radius { display: flex; gap: .75rem; align-items: flex-start; color: #536174; font-style: normal; }
.location-card address i, .location-contact i, .location-radius i { color: #3c65f5; margin-top: .25rem; }
.location-contact { margin-bottom: 1rem; }
.location-radius { font-size: .9rem; }
.location-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: auto; padding-top: 1.25rem; }
.location-actions .theme-btn { padding: 12px 18px; }
.location-message { font-weight: 700; color: #192a56; }
.locations-empty, .locations-no-match { text-align: center; padding: 4rem 2rem; border-radius: 16px; background: #fff; }
.locations-empty > i { color: #3c65f5; font-size: 3rem; margin-bottom: 1rem; }
.locations-cta { padding: 55px 0; color: #fff; background: #172b4d; }
.locations-cta .container { display: flex; justify-content: space-between; align-items: center; gap: 2rem; }
.locations-cta span { color: #9fb6ff; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.locations-cta h2 { color: #fff; max-width: 750px; margin: .5rem 0 0; }
html[data-staffing-theme='dark'] .locations-directory { background: #111827; }
html[data-staffing-theme='dark'] .location-card, html[data-staffing-theme='dark'] .locations-filter, html[data-staffing-theme='dark'] .locations-empty { background: #1f2937; border-color: #374151; }
html[data-staffing-theme='dark'] .location-card h3, html[data-staffing-theme='dark'] .location-message { color: #f9fafb; }
html[data-staffing-theme='dark'] .location-card address, html[data-staffing-theme='dark'] .location-contact, html[data-staffing-theme='dark'] .location-radius, html[data-staffing-theme='dark'] .location-description { color: #cbd5e1; }
html[data-staffing-theme='dark'] .locations-filter input { color: #f9fafb; }
@media (max-width: 991px) { .locations-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .locations-heading { align-items: stretch; flex-direction: column; } .locations-filter { min-width: 0; max-width: 500px; } }
@media (max-width: 575px) { .locations-directory { padding: 70px 0; } .locations-grid { grid-template-columns: 1fr; } .location-card { padding: 0 1.5rem 1.5rem; } .location-photo { margin-right: -1.5rem; margin-left: -1.5rem; } .locations-cta .container { align-items: flex-start; flex-direction: column; } }