/* City acquisition pages. Kept separate from the shared calculator styling. */
.city-page,.city-nav { --city-ink:#152c2b; --city-green:#21604e; --city-muted:#5d6d69; --city-line:#dce3dc; color:var(--city-ink); }
.city-shell { width:min(1200px,100% - 64px); margin-inline:auto; }
.city-nav { position:sticky; top:0; z-index:50; background:#fffefbf5; border-bottom:1px solid #e4e7df; backdrop-filter:blur(12px); }
.city-nav>.city-shell,.city-nav>.city-shell>div { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.city-nav>.city-shell { height:76px; }
.city-brand { display:flex; align-items:center; gap:9px; font-size:20px; font-weight:700; letter-spacing:-.6px; }
.city-nav-directory { font-size:14px; font-weight:600; }
.city-page a,.city-nav a { text-underline-offset:4px; }
.city-page :is(a,button,input,select,summary):focus-visible,.city-nav a:focus-visible { outline:3px solid #338b71; outline-offset:4px; }
.city-button { display:inline-flex; align-items:center; justify-content:center; gap:22px; padding:17px 23px; border-radius:9px; background:#21604e; color:#fff; font-size:15px; font-weight:700; line-height:1.4; text-decoration:none; transition:background .15s,transform .15s; }
.city-button:hover { background:#154a3a; transform:translateY(-1px); }
.city-button-small { padding:12px 18px; font-size:14px; }
.city-button-outline { background:transparent; color:#21604e; border:1px solid #9cafa3; }
.city-button-outline:hover { background:#eaf0e8; }
.city-hero { background:#f5f5ef; padding:27px 0 0; }
.city-breadcrumb { display:flex; gap:12px; align-items:center; font-size:12px; color:#61706a; margin-bottom:33px; }
.city-breadcrumb a:hover { text-decoration:underline; }
.city-hero-grid { display:grid; grid-template-columns:1.12fr 1fr; gap:65px; align-items:center; }
.city-hero h1 { font-size:clamp(38px,4.3vw,62px); font-weight:700; letter-spacing:-2.7px; line-height:1.06; margin:0; overflow-wrap:anywhere; }
.city-hero h1 span { color:#34765b; }
.city-lede { font-size:22px; line-height:1.4; font-weight:500; letter-spacing:-.4px; margin-top:24px; }
.city-hero-description { font-size:16px; line-height:1.75; color:#5d6d69; max-width:490px; margin-top:12px; }
.city-address-start { margin-top:30px; scroll-margin-top:105px; }
.city-address-start label { display:block; font-size:14px; font-weight:700; margin-bottom:10px; }
.city-address-start .address-wrap { max-width:none; border:1px solid #a8b8aa; box-shadow:0 5px 18px #14302508; border-radius:10px; padding:4px; }
.city-address-start .btn-locate { background:transparent; color:#426656; width:30px; margin:0; }
.city-address-start .address-wrap input { padding:13px 8px; font-size:15px; }
.city-address-start .btn-go { width:auto; height:46px; margin:0; padding:0 14px; gap:10px; font-size:13px; font-weight:700; background:#21604e; border-radius:7px; }
.city-address-start>p { font-size:12px; color:#647369; margin-top:10px; }
.city-text-link { display:inline-flex; align-items:center; gap:15px; color:#21604e; font-size:13px; font-weight:600; margin-top:22px; text-decoration:underline; }
.city-preview { border:1px solid #d6dfd4; border-radius:18px; padding:8px; background:#fff; box-shadow:0 20px 50px #203a2510; overflow:hidden; }
.city-preview-photo { height:337px; position:relative; overflow:hidden; border-radius:12px; background:#354939; }
.city-preview-photo>img { width:100%; height:100%; object-fit:cover; }
.city-preview-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#14292026 15%,#0f2518e8 100%); pointer-events:none; }
.city-photo-caption { position:absolute; z-index:1; right:16px; top:14px; color:#fff; font-size:11px; text-shadow:0 1px 5px #000; }
.city-preview-price { position:absolute; z-index:1; bottom:26px; left:26px; right:16px; color:white; }
.city-preview-price p { font-size:14px; margin-bottom:8px; }
.city-preview-price strong { display:block; font-size:46px; line-height:1.15; letter-spacing:-1.5px; }
.city-preview-price>span { display:block; font-size:11px; color:#e2e9df; margin-top:12px; }
.city-preview-price a { text-decoration:underline; }
.city-material-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; margin:12px 4px 0; }
.city-material-tabs button { min-height:42px; color:#5d6d69; border-radius:7px; font-size:13px; font-weight:600; cursor:pointer; }
.city-material-tabs button[aria-pressed=true] { background:#e7eee4; color:#24533d; }
.city-material-tabs button:hover { background:#f0f3ed; }
.city-preview-note { text-align:center; color:#687469; font-size:11px; padding:12px 4px 6px; }
.city-steps { display:grid; grid-template-columns:repeat(3,1fr); margin:44px 0 0; border-top:1px solid #d9dfd3; padding:24px 0 27px; gap:32px; }
.city-steps li { display:flex; align-items:flex-start; gap:16px; }
.city-steps li>span { font-size:23px; font-weight:400; letter-spacing:-1px; color:#76917c; line-height:1.2; }
.city-steps strong { font-size:14px; font-weight:700; }
.city-steps p { font-size:12px; color:#657369; margin-top:5px; line-height:1.5; }
.city-section-nav { border-block:1px solid #e3e7df; background:white; }
.city-section-nav .city-shell { display:flex; gap:38px; }
.city-section-nav a { display:block; padding:18px 0; font-size:13px; font-weight:600; white-space:nowrap; }
.city-section-nav a:hover { color:#21604e; text-decoration:underline; }
.city-calculator-intro { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; padding-block:46px 25px; scroll-margin-top:94px; }
.city-overline { font-size:10px; font-weight:700; letter-spacing:1.9px; color:#557561; margin-bottom:13px; }
.city-page h2 { font-size:clamp(28px,3vw,39px); font-weight:600; line-height:1.16; letter-spacing:-1.2px; }
.city-calculator-intro h2 { font-size:29px; }
.city-calculator-intro>p { max-width:350px; font-size:13px; color:#5d6d69; line-height:1.7; }
/* Keep the calculator a direct child of main so the existing PDF print layout works. */
.city-page+.calculator-section { margin-top:0; padding-bottom:52px; }
.city-page+.calculator-section>div { max-width:1264px; padding-inline:32px; }
.city-page+.calculator-section .map-container { box-shadow:0 6px 26px #173d2510; }
.city-cost-section { background:#f6f7f2; padding:68px 0 42px; scroll-margin-top:90px; }
.city-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:50px; margin-bottom:32px; }
.city-section-heading>div { max-width:670px; }
.city-section-heading>p { max-width:340px; font-size:14px; line-height:1.75; color:#5d6d69; }
.city-material-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.city-material-card { overflow:hidden; background:white; border:1px solid #dde4d9; border-radius:12px; }
.city-material-card>img { width:100%; height:156px; object-fit:cover; }
.city-material-card>div { padding:21px; }
.city-material-card h3 { font-size:20px; font-weight:700; letter-spacing:-.5px; }
.city-material-note { font-size:12px; color:#68736a; margin-top:4px; }
.city-material-range { display:block; margin-top:21px; font-size:25px; letter-spacing:-.9px; font-weight:600; }
.city-material-unit { display:block; font-size:11px; color:#68736a; margin-top:3px; }
.city-material-detail { font-size:12px; line-height:1.65; color:#627064; min-height:60px; margin-top:19px; }
.city-material-card a { display:flex; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid #e7ebe3; padding-top:16px; margin-top:17px; font-size:12px; font-weight:700; color:#21604e; }
.city-method { border-top:1px solid #dce3d7; margin-top:26px; font-size:12px; color:#637166; }
.city-method summary { cursor:pointer; padding:18px 0; font-weight:600; color:#405949; }
.city-method>div { max-width:900px; padding:0 0 18px; line-height:1.85; }
.city-method p+p { margin-top:10px; }
.city-method a { text-decoration:underline; }
.city-directory { padding-block:75px 58px; scroll-margin-top:90px; }
.city-directory-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:50px; align-items:start; }
.city-directory-title { font-size:20px; font-weight:600; letter-spacing:-.4px; }
.city-directory-stats { display:flex; flex-wrap:wrap; gap:24px; padding:17px 0 24px; font-size:12px; color:#6b796d; }
.city-directory-stats strong { color:#21604e; font-size:17px; font-weight:600; margin-right:3px; }
.city-directory-controls { display:grid; grid-template-columns:minmax(0,1fr) 140px 146px; gap:12px; padding:20px; background:#f3f5ef; border:1px solid #e3e7dd; border-radius:10px; }
.city-directory-controls label { display:block; font-size:11px; font-weight:600; margin-bottom:7px; }
.city-directory-controls :is(input,select) { width:100%; min-width:0; background:white; border:1px solid #cbd6c6; border-radius:6px; font-size:13px; padding:10px; min-height:42px; color:#2e4838; }
.city-filter-count { margin-top:18px; font-size:12px; color:#6b796d; }
.business-group-heading { font-size:12px; font-weight:600; color:#6a786c; margin:25px 0 3px; padding-bottom:9px; border-bottom:1px solid #dce3d7; }
.city-business-card { border-bottom:1px solid #e0e6db; padding:23px 0; }
.city-business-top { display:flex; justify-content:space-between; gap:20px; }
.city-business-top h5 { font-size:19px; line-height:1.35; letter-spacing:-.4px; font-weight:600; }
.city-business-category { font-size:12px; color:#457159; margin-top:5px; }
.city-rating { text-align:right; flex-shrink:0; }
.city-rating strong { display:block; font-size:17px; font-weight:600; }
.city-rating strong>span { color:#c0892d; font-size:15px; }
.city-rating>span { display:block; font-size:11px; color:#75816e; margin-top:4px; }
.city-business-address { margin-top:13px; font-size:12px; line-height:1.6; color:#65745f; }
.city-business-work { margin-top:6px; font-size:12px; color:#485e4d; }
.city-business-links { display:flex; flex-wrap:wrap; gap:12px 25px; margin-top:15px; font-size:12px; color:#21604e; font-weight:600; }
.city-business-links a { text-decoration:underline; padding-block:4px; }
#business-show-all { width:100%; margin-top:24px; cursor:pointer; }
#business-show-all[hidden],.city-page [hidden] { display:none!important; }
.city-empty { padding:30px 0; color:#61705e; font-size:14px; }
.city-routing-card { position:sticky; top:104px; background:#eaf0e3; border:1px solid #d7e2cd; padding:28px; border-radius:14px; }
.city-routing-icon { display:block; font-size:35px; line-height:1; color:#4f785b; margin-bottom:24px; }
.city-routing-card h3 { font-size:26px; line-height:1.17; font-weight:600; letter-spacing:-1px; }
.city-routing-card>p { margin-top:18px; font-size:16px; line-height:1.6; color:#4f694f; }
.city-routing-card ol { counter-reset:route; margin:25px 0; }
.city-routing-card li { counter-increment:route; display:flex; gap:11px; font-size:12px; color:#556b52; line-height:1.55; margin:13px 0; }
.city-routing-card li::before { content:counter(route) '.'; color:#21604e; font-weight:700; }
.city-routing-card .city-button { width:100%; font-size:12px; padding-inline:13px; gap:8px; }
.city-routing-card small { display:block; font-size:11px; color:#65775f; line-height:1.65; margin-top:15px; }
.city-empty-coverage { padding:36px; border:1px solid #d8e1d0; border-radius:12px; background:#f4f7ef; }
.city-empty-coverage h3 { font-size:24px; font-weight:600; }
.city-empty-coverage p { max-width:650px; font-size:15px; color:#5d6d69; line-height:1.7; margin:15px 0 24px; }
.city-empty-coverage .city-text-link { margin-left:25px; }
.city-final-section { background:#173c31; color:#f3f5eb; padding:54px 0; }
.city-final-section>.city-shell { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.city-final-section .city-overline { color:#adcaab; }
.city-final-section p:not(.city-overline) { color:#bacdbb; margin-top:16px; font-size:14px; }
.city-final-section .city-button { background:#dfebbd; color:#214430; }
@media(max-width:1100px) {
    .city-hero-grid { gap:35px; }
    .city-hero h1 { font-size:48px; }
    .city-preview-price strong { font-size:38px; }
    .city-directory-layout { grid-template-columns:minmax(0,1fr) 280px; gap:30px; }
    .city-material-grid { gap:12px; }
    .city-material-card>div { padding:16px; }
    .city-material-range { font-size:22px; }
    .city-directory-controls { grid-template-columns:1fr 1fr; }
    .city-search { grid-column:1/-1; }
}
@media(max-width:760px) {
    .city-shell { width:calc(100% - 36px); }
    .city-nav>.city-shell { height:64px; gap:10px; }
    .city-brand { font-size:15px; gap:5px; }
    .city-nav-directory { display:none; }
    .city-button-small { font-size:11px; padding:10px; gap:5px; }
    .city-hero { padding-top:18px; }
    .city-breadcrumb { margin-bottom:25px; font-size:11px; }
    .city-hero-grid { grid-template-columns:1fr; gap:28px; }
    .city-hero h1 { font-size:44px; letter-spacing:-1.9px; }
    .city-lede { font-size:19px; margin-top:19px; }
    .city-hero-description { font-size:14px; max-width:none; }
    .city-address-start { margin-top:23px; scroll-margin-top:88px; }
    .city-address-start .address-wrap { flex-wrap:wrap; }
    .city-address-start .address-wrap input { font-size:16px; }
    .city-address-start .btn-go { flex-basis:100%; width:100%; margin-top:3px; font-size:14px; }
    .city-address-start>p { text-align:center; font-size:11px; }
    .city-text-link { margin-top:18px; }
    .city-preview-photo { height:228px; }
    .city-preview-price { bottom:20px; left:20px; }
    .city-preview-price strong { font-size:38px; }
    .city-preview-price p { font-size:12px; }
    .city-preview-price>span { font-size:10px; }
    .city-steps { grid-template-columns:1fr; margin-top:29px; gap:18px; padding:23px 0; }
    .city-steps li { gap:15px; }
    .city-steps p { margin-top:2px; }
    .city-section-nav .city-shell { gap:23px; overflow-x:auto; }
    .city-section-nav a { font-size:11px; padding-block:15px; }
    .city-calculator-intro { display:block; padding-top:33px; }
    .city-calculator-intro h2 { font-size:26px; }
    .city-calculator-intro>p { margin-top:12px; max-width:none; }
    .city-page+.calculator-section>div { padding-inline:18px; }
    .city-cost-section { padding:40px 0 20px; }
    .city-section-heading { display:block; margin-bottom:24px; }
    .city-section-heading>p { max-width:none; margin-top:15px; font-size:13px; }
    .city-page h2 { font-size:29px; }
    .city-material-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
    .city-material-card>img { height:116px; }
    .city-material-card>div { padding:14px; }
    .city-material-card h3 { font-size:18px; }
    .city-material-note { font-size:11px; min-height:32px; }
    .city-material-range { font-size:20px; margin-top:13px; letter-spacing:-.8px; }
    .city-material-unit { font-size:10px; }
    .city-material-detail { min-height:82px; font-size:11px; margin-top:13px; }
    .city-material-card a { font-size:11px; align-items:flex-start; line-height:1.5; }
    .city-directory { padding-block:43px 35px; }
    .city-directory-layout { display:flex; flex-direction:column; gap:27px; }
    .city-directory-main { width:100%; }
    .city-directory-title { font-size:18px; }
    .city-directory-controls { padding:14px; }
    .city-directory-stats { gap:15px; }
    .city-business-top h5 { font-size:17px; }
    .city-business-links { gap:9px 20px; }
    .city-routing-card { position:static; width:100%; }
    .city-final-section { padding-block:38px; }
    .city-final-section>.city-shell { align-items:flex-start; flex-direction:column; }
    .city-final-section .city-button { width:100%; }
    .city-empty-coverage { padding:24px; }
    .city-empty-coverage .city-text-link { margin-left:0; }
}
@media(prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto!important; }
    .city-button { transition:none; }
}
@media print {
    .city-page,.city-nav { display:none!important; }
}
.city-review-date { font-size:11px; color:#697866; line-height:1.6; margin-top:15px; }
.city-start-card h3 { font-size:24px; font-weight:600; letter-spacing:-.7px; line-height:1.2; color:#193d30; }
.city-start-card>p { font-size:13px; line-height:1.75; color:#5c715f; margin-top:15px; }
.city-start-card ol { margin-top:24px; }
.city-start-card li { border-top:1px solid #e2e8dd; padding:15px 0; }
.city-start-card li strong { display:block; font-size:13px; color:#264d38; }
.city-start-card li span { display:block; font-size:12px; line-height:1.6; margin-top:4px; color:#697d65; }
.city-start-card>.city-start-note { font-size:11px; border-top:1px solid #e2e8dd; padding-top:17px; margin-top:0; }
.city-page+.calculator-section #btn-draw { background:#21604e; }
@media(max-width:760px) {
    .city-section-nav .city-shell { justify-content:space-between; gap:12px; }
}

/* Match the primary site palette and keep supporting text at normal reading sizes. */
.city-page,.city-nav {
    --city-ink:#0f172a;
    --city-accent:#2563eb;
    --city-muted:#475569;
    --city-line:#e2e8f0;
    color:var(--city-ink);
}
.city-nav { background:#fffffff5; border-color:#e2e8f0; }
.city-page :is(a,button,input,select,summary):focus-visible,.city-nav a:focus-visible { outline-color:#3b82f6; }
.city-button { background:#2563eb; font-size:16px; }
.city-button:hover { background:#1d4ed8; }
.city-button-small { font-size:14px; }
.city-button-outline { background:#fff; color:#2563eb; border-color:#93c5fd; }
.city-button-outline:hover { background:#eff6ff; }
.city-hero,.city-cost-section { background:#f8fafc; }
.city-breadcrumb { font-size:14px; color:#64748b; }
.city-hero h1 span,.city-text-link,.city-material-card a,.city-business-links { color:#2563eb; }
.city-hero-description { font-size:17px; color:#475569; }
.city-address-start label { font-size:15px; }
.city-address-start .address-wrap { border-color:#94a3b8; box-shadow:0 5px 18px #1e3a8a0d; }
.city-address-start .btn-locate { color:#2563eb; }
.city-address-start .address-wrap input { font-size:16px; }
.city-address-start .btn-go { background:#2563eb; font-size:15px; }
.city-address-start>p,.city-photo-caption,.city-preview-price>span,.city-preview-note { font-size:13px; }
.city-text-link { font-size:15px; }
.city-preview { border-color:#dbe3ef; box-shadow:0 20px 50px #1e3a8a14; }
.city-preview-photo { background:#1e293b; }
.city-preview-photo::after { background:linear-gradient(180deg,#0f172a1c 15%,#0f172ae8 100%); }
.city-material-tabs button { min-height:46px; color:#475569; font-size:15px; }
.city-material-tabs button[aria-pressed=true] { background:#dbeafe; color:#1d4ed8; }
.city-material-tabs button:hover { background:#eff6ff; }
.city-steps,.city-section-nav,.business-group-heading,.city-business-card,.city-method,.city-start-card li,.city-start-card>.city-start-note { border-color:#e2e8f0; }
.city-steps li>span { color:#3b82f6; }
.city-steps strong { font-size:16px; }
.city-steps p { font-size:14px; color:#64748b; }
.city-section-nav a { font-size:15px; }
.city-section-nav a:hover { color:#2563eb; }
.city-overline { font-size:12px; color:#2563eb; }
.city-calculator-intro>p,.city-section-heading>p { font-size:16px; color:#475569; }
.city-page+.calculator-section .map-container { box-shadow:0 6px 26px #1e3a8a14; }
.city-page+.calculator-section #btn-draw { background:#2563eb; }
.city-material-card { border-color:#e2e8f0; }
.city-material-note { font-size:14px; color:#64748b; }
.city-material-unit { font-size:13px; color:#64748b; }
.city-material-detail { font-size:14px; color:#475569; min-height:70px; }
.city-material-card a { font-size:14px; }
.city-method { font-size:14px; color:#475569; }
.city-method summary { color:#334155; font-size:15px; }
.city-directory-stats { font-size:14px; color:#64748b; }
.city-directory-stats strong { color:#2563eb; }
.city-directory-controls { background:#f8fafc; border-color:#e2e8f0; }
.city-directory-controls label { font-size:13px; }
.city-directory-controls :is(input,select) { border-color:#cbd5e1; color:#1e293b; font-size:15px; min-height:46px; }
.city-review-date,.city-filter-count { font-size:14px; color:#64748b; }
.business-group-heading { font-size:14px; color:#64748b; }
.city-business-card { display:grid; grid-template-columns:72px minmax(0,1fr); gap:22px; }
.city-business-identity { display:grid; place-items:center; width:72px; height:72px; border:1px solid #dbeafe; border-radius:12px; background:#eff6ff; color:#1d4ed8; font-size:24px; font-weight:600; letter-spacing:-.5px; }
.city-business-identity[data-tone="1"] { background:#f1f5f9; color:#334155; border-color:#e2e8f0; }
.city-business-identity[data-tone="2"] { background:#eef2ff; color:#4338ca; border-color:#e0e7ff; }
.city-business-identity[data-tone="3"] { background:#fafaf9; color:#57534e; border-color:#e7e5e4; }
.city-business-content { min-width:0; }
.city-business-category { font-size:14px; color:#2563eb; }
.city-rating>span { font-size:13px; color:#64748b; }
.city-business-address,.city-business-work { font-size:14px; color:#475569; }
.city-business-links { font-size:14px; }
.city-routing-card { background:#eff6ff; border-color:#bfdbfe; }
.city-routing-icon,.city-routing-card li::before { color:#2563eb; }
.city-routing-card>p,.city-routing-card li { color:#475569; }
.city-routing-card li { font-size:14px; }
.city-routing-card .city-button { font-size:14px; }
.city-routing-card small { font-size:13px; color:#64748b; }
.city-empty-coverage { background:#f8fafc; border-color:#dbeafe; }
.city-empty-coverage p { font-size:16px; color:#475569; }
.city-final-section { background:#0f172a; color:#f8fafc; }
.city-final-section .city-overline { color:#93c5fd; }
.city-final-section p:not(.city-overline) { color:#cbd5e1; font-size:16px; }
.city-final-section .city-button { background:#2563eb; color:#fff; }
.city-start-card h3,.city-start-card li strong { color:#0f172a; }
.city-start-card>p { font-size:15px; color:#475569; }
.city-start-card li span { font-size:14px; color:#64748b; }
.city-start-card>.city-start-note { font-size:13px; }

@media(max-width:760px) {
    .city-brand { font-size:17px; }
    .city-button-small { font-size:13px; }
    .city-breadcrumb { font-size:13px; }
    .city-hero-description { font-size:16px; }
    .city-address-start>p { font-size:13px; }
    .city-preview-price p { font-size:14px; }
    .city-preview-price>span { font-size:12px; }
    .city-section-nav a { font-size:14px; }
    .city-section-heading>p { font-size:15px; }
    .city-material-note { font-size:13px; min-height:38px; }
    .city-material-unit { font-size:12px; }
    .city-material-detail { min-height:104px; font-size:13px; }
    .city-material-card a { font-size:13px; }
    .city-business-card { grid-template-columns:52px minmax(0,1fr); gap:14px; padding-block:24px; }
    .city-business-identity { width:52px; height:52px; font-size:19px; border-radius:9px; }
    .city-business-top { display:block; }
    .city-rating { margin-top:8px; text-align:left; }
    .city-rating strong,.city-rating>span { display:inline; }
    .city-rating>span { margin-left:7px; }
    .city-business-links { grid-column:1/-1; }
}