.home-works-filter{display:grid;gap:18px;margin:20px 0 18px;padding:20px;border:1px solid var(--color-border);border-radius:14px;background:rgba(255,255,255,.92);box-shadow:0 12px 28px rgba(0,0,0,.06)}
.home-works-filter__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end}
.home-works-filter label{display:grid;gap:7px;font-weight:700;color:var(--color-ink)}
.home-works-filter .input,.home-works-filter .select{width:100%}
.home-area-filter{margin:0;padding:0;border:0;min-width:0}
.home-area-filter__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.home-area-filter__title{font-weight:800;color:var(--color-ink)}
.home-area-filter__buttons{display:flex;flex-wrap:wrap;gap:9px}
.home-area-filter__button{--area-color:#6b7280;display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border:2px solid color-mix(in srgb,var(--area-color) 42%,#d1d5db);border-radius:999px;background:#fff;color:var(--color-ink);font:inherit;font-weight:700;cursor:pointer;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.home-area-filter__button:hover{border-color:var(--area-color);box-shadow:0 6px 16px color-mix(in srgb,var(--area-color) 22%,transparent);transform:translateY(-1px)}
.home-area-filter__button.is-active{background:color-mix(in srgb,var(--area-color) 14%,#fff);border-color:var(--area-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--area-color) 18%,transparent)}
.home-area-filter__button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.home-area-filter__dot,.home-work-card__area-dot{display:inline-block;width:12px;height:12px;flex:0 0 12px;border-radius:50%;background:var(--area-color);box-shadow:0 0 0 1px rgba(0,0,0,.14)}
.home-work-card{content-visibility:auto;contain-intrinsic-size:340px 300px;position:relative}
.home-work-card__media{background:linear-gradient(135deg,rgba(0,0,0,.04),rgba(0,0,0,.09))}
.home-work-card__image:not([src]){opacity:0}
.home-work-card__image[src]{opacity:1;transition:opacity .25s ease}
.home-work-card__area{--area-color:#9ca3af;position:absolute;left:8px;top:8px;z-index:3;display:inline-flex;align-items:center;gap:6px;max-width:calc(100% - 70px);padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.93);color:#1f2937;font-size:.78rem;font-weight:800;line-height:1.2;box-shadow:0 4px 12px rgba(0,0,0,.16);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-area-map-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.72)}
.home-area-map-modal.open{display:flex}
.home-area-map-modal__dialog{width:min(920px,100%);max-height:90vh;overflow:auto;border-radius:18px;background:#fff;box-shadow:0 26px 70px rgba(0,0,0,.32)}
.home-area-map-modal__header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid var(--color-border);background:rgba(255,255,255,.98)}
.home-area-map-modal__header h2{margin:0;font-size:1.3rem}
.home-area-map-modal__close{flex:0 0 auto}
.home-area-map-modal__body{padding:18px 20px 24px}
.home-area-map{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,240px);gap:20px;align-items:start}
.home-area-map__svg{display:block;width:100%;height:auto;min-height:320px;border:1px solid var(--color-border);border-radius:12px;background:#f8fafc}
.home-area-map__legend{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.home-area-map__legend li{display:flex;align-items:center;gap:8px;font-size:.92rem}
.home-area-map__legend-dot{display:inline-block;width:14px;height:14px;flex:0 0 14px;border-radius:4px;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
@media(max-width:760px){.home-works-filter{padding:16px}.home-works-filter__row{grid-template-columns:1fr}.home-area-filter__header{align-items:flex-start;flex-direction:column}.home-area-map{grid-template-columns:1fr}.home-area-map__svg{min-height:240px}.home-area-map-modal{padding:10px}.home-area-map-modal__dialog{max-height:94vh}.home-area-map-modal__header,.home-area-map-modal__body{padding-left:14px;padding-right:14px}}
@supports not (color:color-mix(in srgb,#000 50%,#fff)){.home-area-filter__button{border-color:#cbd5e1}.home-area-filter__button.is-active{border-color:var(--area-color);background:#f8fafc}}
