/* =========================================================
   VetConnect — Location page refresh
   Matches the centered visual language of Services while
   keeping location content practical and easy to scan.
   ========================================================= */
.location-page { --loc-navy:#1295D3; --loc-text:#45556C; --loc-page:#F5FAFD; --loc-line:#DFEEF8; --loc-green:#8DC63F; --loc-green-deep:#679E27; }
.location-page main { background:var(--loc-page); }
.loc-container { width:100%; max-width:1264px; margin:0 auto; padding:0 clamp(16px,2.6vw,32px); }
.loc-hero { text-align:center; padding:26px 0 0; }
.loc-eyebrow { display:inline-flex; align-items:center; gap:7px; color:var(--loc-green-deep); background:#EFF8DF; border:1px solid #CDEBD9; border-radius:999px; padding:5px 12px 5px 9px; font:600 .7rem/1.3 'Plus Jakarta Sans',var(--font-body); }
.loc-hero h1 { font:800 clamp(1.9rem,3.2vw,2.5rem)/1.15 'Plus Jakarta Sans',var(--font-body); letter-spacing:-.015em; color:var(--loc-navy); margin:14px 0 0; }
.loc-lede { max-width:580px; margin:10px auto 0; color:var(--loc-text); font-size:1.03rem; line-height:1.6; }
.loc-main-section { padding:50px 0 62px; }
.loc-layout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:25px; align-items:stretch; }
.loc-info-card { background:#fff; border:1px solid var(--loc-line); border-radius:24px; box-shadow:0 10px 28px rgba(10,37,64,.06); padding:28px; display:flex; flex-direction:column; }
.loc-card-heading { display:flex; align-items:center; gap:13px; margin-bottom:24px; }
.loc-card-icon { width:44px; height:44px; border-radius:13px; background:#F5FAFD; border:1px solid #DCEEF0; color:var(--color-blue); display:grid; place-items:center; flex-shrink:0; }
.loc-card-icon svg { width:23px; height:23px; }
.loc-kicker { display:block; color:var(--loc-green-deep); font:700 .72rem/1.3 'Plus Jakarta Sans',var(--font-body); letter-spacing:.02em; }
.loc-card-heading h2 { font:800 1.28rem/1.2 'Plus Jakarta Sans',var(--font-body); color:var(--loc-navy); margin:4px 0 0; }
.loc-details { display:grid; gap:17px; }
.loc-detail { display:flex; gap:13px; align-items:flex-start; color:var(--loc-text); font-size:.94rem; }
.loc-detail > svg { width:20px; height:20px; color:var(--color-blue); flex-shrink:0; margin-top:2px; }
.loc-detail strong { display:block; color:var(--color-blue-deep); font:700 .78rem/1.3 'Plus Jakarta Sans',var(--font-body); margin-bottom:3px; }
.loc-detail span { display:block; line-height:1.5; }
.loc-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:auto; padding-top:26px; }
.loc-actions .btn { min-height:43px; justify-content:center; }
.loc-map { min-height:390px; position:relative; overflow:hidden; border:1px solid #D5E8F3; border-radius:24px; background:#DCEEF8; box-shadow:0 10px 28px rgba(10,37,64,.06); }
.loc-map-grid { position:absolute; inset:-10%; transform:rotate(-4deg) scale(1.08); background:#EAF5FA; }
.loc-map-grid .street { position:absolute; background:#fff; border:1px solid #D6E8EF; border-radius:8px; opacity:.95; }
.street-a { width:120%; height:18px; left:-10%; top:25%; transform:rotate(12deg); }
.street-b { width:120%; height:24px; left:-10%; top:62%; transform:rotate(-9deg); }
.street-c { width:18px; height:120%; left:27%; top:-10%; transform:rotate(8deg); }
.street-d { width:22px; height:120%; left:69%; top:-10%; transform:rotate(-13deg); }
.street-e { width:90%; height:14px; left:2%; top:45%; transform:rotate(27deg); }
.street-f { width:85%; height:16px; left:9%; top:76%; transform:rotate(23deg); }
.loc-map-grid .block { position:absolute; background:#D5EAD7; border:1px solid #C7DFC9; border-radius:10px; opacity:.65; }
.block-a { width:22%; height:24%; left:6%; top:8%; }.block-b { width:25%; height:20%; left:45%; top:7%; }.block-c { width:24%; height:24%; left:68%; top:45%; }.block-d { width:22%; height:20%; left:12%; top:57%; }
.loc-map-overlay { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; width:min(84%,360px); }
.loc-pin { width:58px; height:58px; border-radius:50%; display:grid; place-items:center; color:#fff; background:var(--color-blue); border:6px solid rgba(255,255,255,.88); box-shadow:0 8px 22px rgba(10,108,163,.28); }
.loc-pin svg { width:25px; height:25px; }
.loc-map-label { background:#fff; border:1px solid #E0EBF1; border-radius:14px; box-shadow:0 8px 22px rgba(10,37,64,.10); padding:12px 16px; }
.loc-map-label strong { display:block; color:var(--loc-navy); font:800 .86rem/1.3 'Plus Jakarta Sans',var(--font-body); }
.loc-map-label span { display:block; color:var(--loc-text); font-size:.78rem; margin-top:3px; }
.loc-map-note { position:absolute; left:16px; bottom:14px; color:#5C7180; background:rgba(255,255,255,.9); border-radius:8px; padding:6px 9px; font-size:.7rem; }
.loc-expect { padding:0 0 70px; }
.loc-section-heading { text-align:center; margin:0 auto 30px; max-width:620px; }
.loc-section-heading h2 { font:800 clamp(1.55rem,2.4vw,2rem)/1.2 'Plus Jakarta Sans',var(--font-body); color:var(--loc-navy); margin:8px 0 8px; }
.loc-section-heading p { color:var(--loc-text); margin:0 auto; font-size:.96rem; }
.loc-feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.loc-feature-card { background:#fff; border:1px solid var(--loc-line); border-radius:18px; padding:24px; box-shadow:0 8px 22px rgba(10,37,64,.045); }
.loc-feature-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:#F4FAF6; border:1px solid #D5E9DF; color:var(--loc-green-deep); font-weight:800; margin-bottom:15px; }
.loc-feature-card h3 { font:800 1rem/1.2 'Plus Jakarta Sans',var(--font-body); color:var(--loc-navy); margin:0 0 8px; }
.loc-feature-card p { color:var(--loc-text); font-size:.86rem; line-height:1.6; margin:0; }
.loc-cta { padding:0 0 72px; }
.loc-cta-card { display:flex; align-items:center; justify-content:space-between; gap:24px; background:#EAF6FD; border:1px solid #D4EAF6; border-radius:22px; padding:28px 32px; }
.loc-cta-card h2 { font:800 1.45rem/1.2 'Plus Jakarta Sans',var(--font-body); color:var(--loc-navy); margin:5px 0 6px; }
.loc-cta-card p { color:var(--loc-text); margin:0; font-size:.9rem; }
@media (max-width:900px){.loc-layout{grid-template-columns:1fr}.loc-map{min-height:330px}.loc-feature-grid{grid-template-columns:1fr 1fr}.loc-cta-card{align-items:flex-start;flex-direction:column}}
@media (max-width:600px){.loc-feature-grid{grid-template-columns:1fr}.loc-info-card{padding:22px}.loc-actions{flex-direction:column}.loc-actions .btn{width:100%}.loc-map{min-height:300px}.loc-cta-card{padding:24px}.loc-map-note{display:none}}

/* Interactive Google Maps embed */
.loc-map { display:flex; flex-direction:column; }
.loc-map > iframe { display:block; width:100%; flex:1 1 auto; min-height:330px; border:0; }
.loc-map-footer { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 14px; background:#fff; border-top:1px solid #D5E8F3; color:#5C7180; font-size:.76rem; }
.loc-map-footer a { color:var(--color-blue); font-weight:700; text-decoration:none; white-space:nowrap; }
.loc-map-footer a:hover { text-decoration:underline; }
@media (max-width:600px){ .loc-map-footer { align-items:flex-start; flex-direction:column; gap:6px; } .loc-map-footer a { white-space:normal; } }