#locations .locs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: clamp(40px, 5vw, 60px); }
#locations .loc-card {
  background: var(--white); border-radius: var(--r); overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: transform 0.35s var(--ease), box-shadow 0.35s;
}
#locations .loc-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-card-hover); }
#locations .loc-img { height: 190px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #0d1f38, #16305a); border-bottom: 1px solid var(--hair); }
#locations .loc-img img { max-height: 96px; width: auto; }
#locations .loc-body { padding: 28px; }
#locations .loc-tag { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent-text); margin-bottom: 8px; }
#locations .loc-name { font-size: 23px; font-weight: 700; letter-spacing: -0.01em; }
#locations .loc-addr { font-size: 15px; color: var(--grey); margin-top: 8px; line-height: 1.5; }
#locations .loc-details { margin-top: 18px; display: flex; flex-direction: column; gap: 9px; }
#locations .loc-detail { font-size: 14px; color: var(--grey); display: flex; gap: 9px; align-items: baseline; }
#locations .loc-btns { display: flex; gap: 10px; margin-top: 24px; flex-wrap: wrap; }
#locations .lb { font-size: 14px; font-weight: 500; text-decoration: none; padding: 10px 20px; border-radius: 980px; transition: background 0.2s, transform 0.15s; }
#locations .lb-p { background: var(--accent); color: #fff; }
#locations .lb-p:hover { background: var(--accent-h); transform: scale(1.03); }
#locations .lb-g { background: rgba(0,0,0,0.05); color: var(--ink); }
#locations .lb-g:hover { background: rgba(0,0,0,0.09); }

.loc-card{box-shadow:0 8px 30px #0714260a;border:1px solid var(--hair)}
#locations .loc-card{display:flex;flex-direction:column}
#locations .loc-body{flex:1}
#locations .clinic-map{margin:0 28px;min-height:220px;overflow:hidden;border:1px solid var(--hair);border-radius:16px;background:var(--white)}
#locations .clinic-map .map-frame{display:block;height:220px;border-radius:0;box-shadow:none}
#locations .clinic-map .cc-ph{min-height:220px;margin:0;border:0;border-radius:0}
#locations .clinic-directions{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;margin:12px 28px 20px;color:var(--clinic-label);font-size:14px;font-weight:600;text-decoration:none}
#locations .clinic-directions:hover{text-decoration:underline}
#locations .clinic-directions:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px}
html[data-theme="dark"] #locations .clinic-directions{color:var(--clinic-label-dark)}
/* Clinic accents sourced from each practice website, 7 September 2026. */
.clinic-dbd{--clinic-brand:#3694c1;--clinic-label:#176084;--clinic-label-dark:#7fc9ed}
.clinic-pro{--clinic-brand:#31b7bc;--clinic-label:#117276;--clinic-label-dark:#6adade}
#locations .loc-card .loc-img{background:var(--clinic-brand)}
#locations .clinic-dbd .loc-img img{filter:brightness(0) invert(1)}
#locations .clinic-pro .loc-img img{filter:brightness(0)}
#locations .loc-card .loc-tag{color:var(--clinic-label)}
#locations .loc-card .lb-p{background:var(--clinic-brand);color:#101a22}
#locations .loc-card .lb-p:hover{background:var(--clinic-brand);filter:brightness(.94)}
html[data-theme="dark"] #locations .loc-card .loc-tag{color:var(--clinic-label-dark)}
#locations>.si{width:100%;max-width:1180px;margin:0 auto;padding:0 24px}
#locations .locs-grid{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;line-height:1.5;--white:#fff;--ink:#1d1d1f;--grey:#6e6e73;--hair:rgba(0,0,0,.09);--r:28px}
html[data-theme="dark"] #locations .locs-grid{--white:#1c1c1e;--ink:#f5f5f7;--grey:#a1a1a6;--hair:rgba(255,255,255,.12)}
#locations .locs-grid .loc-card{padding:0;color:var(--ink);text-align:left}
#locations .locs-grid .loc-img{flex-shrink:0}
#locations .locs-grid .loc-img img{height:auto;max-width:100%;object-fit:contain}
#locations .locs-grid .loc-name{margin:0;color:var(--ink);line-height:1.5}
#locations .locs-grid .loc-tag{padding:0;margin:0 0 8px;background:none;border:0;border-radius:0;line-height:1.5}
#locations .locs-grid .loc-addr{color:var(--grey);margin:8px 0 0}
#locations .locs-grid .clinic-map{margin:0 28px;background:var(--white);border-color:var(--hair)}
#locations .locs-grid .map-frame{width:100%;border:0}
#locations .locs-grid .clinic-directions{line-height:1.5}
#locations .loc-card[id]{scroll-margin-top:96px}
#locations .locs-grid .clinic-map{display:block;flex:0 0 222px;height:222px;position:relative}
#locations .clinic-map .cc-ph{color:var(--ink);background:var(--white);cursor:pointer}
@media(max-width:820px){#locations .locs-grid{grid-template-columns:1fr}}