.baro-section{ --map-ink:#172c4d; --map-muted:#5e7088; --map-surface:#fff; --map-soft:#f5f7fb; --map-line:#dde5ef; --map-fill:#dfe7f1; --map-stroke:#fff; --map-accent:#3468af; width:min(1180px,calc(100% - 64px)); margin:0 auto; padding:72px 0 12px; color:var(--map-ink); }.baro-heading{ display:grid; grid-template-columns:1fr .65fr; gap:48px; align-items:end; margin-bottom:32px; }.baro-section .baro-eyebrow{ font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--map-muted); margin:0 0 16px; }.baro-heading h2{ font-family:Georgia,serif; font-weight:400; font-size:clamp(36px,4vw,56px); letter-spacing:-.035em; line-height:1.08; margin:0; }.baro-heading h2 span{ color:var(--map-accent); }.baro-heading>p{ font-size:15px; line-height:1.8; margin:0; color:var(--map-muted); max-width:400px; }.baro-module{ display:grid; grid-template-columns:minmax(0,1fr) 290px; border:1px solid var(--map-line); border-radius:20px; overflow:hidden; background:var(--map-surface); }.baro-map-panel{ min-width:0; position:relative; padding:20px; background:var(--map-soft); background-image:radial-gradient(var(--map-line) .8px,transparent .8px); background-size:16px 16px; display:flex; flex-direction:column; justify-content:space-between; }.baro-map-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; }.baro-map-toolbar>span{ display:flex; align-items:center; gap:8px; font-size:10px; letter-spacing:.1em; font-weight:700; }.baro-map-toolbar>span i{ width:6px; height:6px; background:var(--map-accent); border-radius:50%; }.baro-map-toolbar>div{ display:flex; gap:5px; }.baro-map-toolbar button{ min-width:38px; height:38px; padding:0 10px; border:1px solid var(--map-line); border-radius:7px; background:var(--map-surface); color:var(--map-ink); font-size:16px; cursor:pointer; }.baro-map-toolbar button:last-child{ font-size:11px; }.baro-map-toolbar button:disabled{ opacity:.4; cursor:default; }.baro-map-viewport{ width:100%; overflow:auto; margin:24px 0 14px; scrollbar-width:thin; scrollbar-color:var(--map-accent) transparent; }.baro-map-svg{ display:block; width:100%; max-width:none; height:auto; overflow:visible; }.baro-province{ cursor:pointer; outline:none; }.baro-province path{ fill:var(--map-fill); stroke:var(--map-stroke); stroke-width:1.2; vector-effect:non-scaling-stroke; transition:fill .16s ease,stroke .16s ease; stroke-linejoin:round; }.baro-province.is-special path{ fill:#8dabd4; }.baro-province:is(.is-selected,.is-hovered,:focus-visible) path{ fill:var(--map-accent); stroke:var(--map-surface); }.baro-province:focus-visible path{ stroke:var(--map-ink); stroke-width:2.5; }.baro-province text{ fill:#354f72; font-size:9px; font-weight:650; pointer-events:none; text-anchor:middle; dominant-baseline:middle; }.baro-province:is(.is-selected,.is-hovered,:focus-visible) text{ fill:#fff; }.baro-tooltip{ position:absolute; pointer-events:none; max-width:220px; padding:10px 14px; background:var(--map-ink); color:var(--map-surface); border-radius:10px; box-shadow:0 8px 24px #142c4b18; font-size:12px; line-height:1.6; z-index:4; }.baro-tooltip strong{ display:block; font-size:13px; }.baro-map-legend{ display:flex; flex-wrap:wrap; gap:12px 18px; align-items:center; font-size:10px; color:var(--map-muted); }.baro-map-legend>span{ display:flex; align-items:center; gap:6px; }.baro-map-legend i{ width:9px; height:9px; background:var(--map-fill); border:1px solid #b6c7dc; border-radius:2px; }.baro-map-legend i.legend-special{ background:var(--map-accent); border-color:var(--map-accent); }.baro-map-legend small{ margin-left:auto; font-size:10px; }.baro-detail{ border-left:1px solid var(--map-line); padding:24px; display:flex; flex-direction:column; }.baro-detail-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }.baro-plate{ width:44px; height:44px; border:1px solid var(--map-line); border-radius:10px; display:grid; place-items:center; font-size:18px; font-weight:700; }.baro-status{ font-size:8px; letter-spacing:.05em; color:var(--map-accent); font-weight:750; }.baro-detail .baro-detail-eyebrow{ margin:32px 0 8px; color:var(--map-muted); font-size:9px; letter-spacing:.12em; }.baro-detail h3{ font-size:23px; font-weight:600; letter-spacing:-.035em; line-height:1.3; margin:0 0 16px; }.baro-offer{ border-top:1px solid var(--map-line); padding-top:18px; display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; color:var(--map-accent); }.baro-offer strong{ font-size:44px; font-weight:500; letter-spacing:-.055em; line-height:1; }.baro-offer span{ font-size:14px; }.baro-offer.is-standard strong{ font-size:24px; letter-spacing:-.02em; }.baro-detail>p:not(.baro-detail-eyebrow){ font-size:13px; line-height:1.75; color:var(--map-muted); min-height:68px; margin:16px 0 24px; }.baro-city-label{ font-size:11px; font-weight:600; margin:0 0 8px; }.baro-detail select{ width:100%; min-height:44px; color:var(--map-ink); background:var(--map-soft); border:1px solid var(--map-line); border-radius:8px; padding:0 10px; font-size:14px; }.baro-contact{ margin-top:16px; padding:14px 0 0; border-top:1px solid var(--map-line); display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:44px; font-size:12px; line-height:1.6; color:var(--map-accent); }.baro-contact:hover{ text-decoration:underline; }.baro-section-foot{ display:flex; justify-content:space-between; gap:20px; font-size:11px; color:var(--map-muted); margin-top:16px; line-height:1.6; }.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:900px) {.baro-module{ grid-template-columns:minmax(0,1fr) 250px; }.baro-detail{ padding:20px; }.baro-heading{ gap:28px; }
}
@media(max-width:700px) {.baro-section{ width:calc(100% - 40px); padding-top:48px; }.baro-heading{ grid-template-columns:1fr; gap:20px; margin-bottom:24px; }.baro-heading>p{ font-size:15px; }.baro-module{ grid-template-columns:minmax(0,1fr); border-radius:16px; }.baro-map-panel{ padding:14px; }.baro-map-toolbar>span{ font-size:9px; letter-spacing:.04em; }.baro-map-toolbar button{ min-width:36px; min-height:44px; }.baro-map-viewport{ margin:24px 0; }.baro-map-legend{ gap:10px 16px; font-size:11px; }.baro-map-legend small{ flex-basis:100%; margin:0; font-size:11px; }.baro-detail{ border-left:0; border-top:1px solid var(--map-line); padding:20px; }.baro-detail .baro-detail-eyebrow{ margin-top:20px; }.baro-detail>p:not(.baro-detail-eyebrow){ min-height:0; font-size:15px; }.baro-detail select{ font-size:16px; }.baro-contact{ font-size:14px; }.baro-section-foot{ flex-direction:column; gap:4px; }
}
@media(prefers-reduced-motion:reduce) {.baro-province path{ transition:none; } }
/* Map sits directly on the page, with a shared blue palette for all provinces. */
html body.spa-body .baro-section{--map-fill:#96bbdf;--map-accent:#356a9e}
html body.spa-body .baro-module{border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;overflow:visible}
html body.spa-body .baro-map-panel{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding-inline:0}
html body.spa-body .baro-detail{background:none!important;border-radius:0!important;box-shadow:none!important}
html body.spa-body .baro-province.is-special path{fill:#4a7cae}
html body.spa-body .baro-province.is-special.is-selected path{fill:#356a9e}
html body.spa-body .baro-province text{fill:#203e60}
html body.spa-body .baro-province:is(.is-selected,.is-hovered,:focus-visible) text{fill:#fff}