.region-hint{font-size:15px;color:var(--muted);margin:14px 0 0}
.regions-interactive .regions-overview{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);grid-template-rows:auto auto;gap:24px 36px;align-items:start;padding:30px;border:1px solid var(--line);border-radius:18px;background:#f4f7f5}
.regions-interactive .regions-overview>figure{grid-column:1;grid-row:1}
.regions-interactive .regions-overview svg{max-height:300px;overflow:visible}
.regions-interactive .regions-key{grid-column:1;grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:10px;align-self:end}
.regions-interactive .regions-key li+li{border:0}
.regions-key button{display:flex;align-items:center;gap:10px;width:100%;height:100%;min-height:82px;text-align:left;font:inherit;color:var(--ink);padding:12px;background:white;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.regions-key button strong{font-size:16px;line-height:1.3;display:block}
.regions-key button small{font-size:14px;line-height:1.4;margin-top:4px}
.regions-key button .region-number{width:28px;height:28px;font-size:14px}
.regions-key button[aria-pressed=true]{border-color:var(--region-accent);background:#fff;box-shadow:inset 0 -3px var(--region-accent)}
.regions-key button:hover{transform:translateY(-2px)}
.regions-interactive .regions-grid{grid-column:2;grid-row:1 / span 2;display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-self:stretch}
.regions-interactive .region-card{grid-area:1/1;visibility:hidden;pointer-events:none;min-width:0;border:1px solid var(--line);border-radius:12px;background:white;overflow:hidden;align-self:start}
.regions-interactive .region-card.is-active{visibility:visible;pointer-events:auto}
.regions-interactive .region-photo{aspect-ratio:4/3;object-fit:cover}
.regions-interactive .region-copy{padding:22px 24px}
.regions-interactive .region-copy h4{margin:10px 0}
.region-marker{cursor:pointer;outline:none}
.region-marker .marker-halo{opacity:0;transform:scale(.7);transform-box:fill-box;transform-origin:center;transition:opacity .3s,transform .4s}
.region-marker[aria-pressed=true] .marker-halo,.region-marker:hover .marker-halo{opacity:.75;transform:scale(1)}
.region-marker:focus-visible .marker-halo{opacity:1;stroke:#152a22;stroke-width:4;stroke-dasharray:4 3;transform:scale(1.12)}
@media(max-width:1000px){.regions-interactive .regions-overview{gap:22px;padding:22px}.regions-interactive .regions-key{grid-template-columns:1fr}.regions-key button{min-height:62px}.regions-interactive .region-photo{aspect-ratio:1}}
@media(max-width:700px){.regions-interactive .regions-overview{display:flex;flex-direction:column;padding:18px;gap:20px}.regions-interactive .regions-overview>figure,.regions-interactive .regions-key,.regions-interactive .regions-grid{width:100%}.regions-interactive .regions-overview svg{max-height:250px}.regions-interactive .regions-key{grid-template-columns:1fr 1fr}.regions-key button{padding:10px;gap:8px;min-height:88px}.regions-key button strong{font-size:15px}.regions-interactive .region-photo{aspect-ratio:16/10}.regions-interactive .region-copy{padding:20px}.regions-interactive .regions-grid{align-self:auto}}
@media(max-width:360px){.regions-interactive .regions-key{grid-template-columns:1fr}.regions-key button{min-height:60px}}
@media(prefers-reduced-motion:reduce){.region-marker .marker-halo,.regions-key button{transition:none}.regions-key button:hover{transform:none}}
