:root { font-family: system-ui, sans-serif; color: #17342b; background: #f7f8f3; line-height: 1.6; }
* { box-sizing: border-box; }
body { margin: 0; }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 1; max-width: calc(100% - 2rem); padding: .75rem 1rem; border-radius: .4rem; background: #17342b; color: white; transform: translateY(calc(-100% - 2rem)); }
.skip-link:focus { transform: translateY(0); }
header, main { max-width: 960px; margin: auto; padding: 1.5rem; }
header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #dce5da; }
.brand { font-weight: 750; color: #17342b; text-decoration: none; }
.tag { font-size: .82rem; color: #49645a; }
main { padding-top: 3rem; }
.eyebrow { color: #577b61; text-transform: uppercase; font-size: .8rem; letter-spacing: .14em; font-weight: 700; }
h1 { font-family: Georgia, serif; font-size: clamp(2.3rem, 5vw, 3.8rem); line-height: 1.1; font-weight: 400; max-width: 19ch; margin: .5rem 0 1.5rem; }
.intro { max-width: 58ch; font-size: 1.1rem; color: #486158; }
.panel { margin-top: 3rem; padding: 1.5rem; background: white; border: 1px solid #dce5da; border-radius: .8rem; max-width: 620px; }
h2 { font-size: 1.1rem; margin-top: 0; }
button { border: 0; border-radius: .4rem; background: #234f3d; color: white; padding: .75rem 1rem; font: inherit; cursor: pointer; }
button:hover { background: #173e2e; }
button:disabled { opacity: .65; cursor: wait; }
button:focus-visible, a:focus-visible { outline: 3px solid #cf8d3b; outline-offset: 3px; }
.source-action { display: inline-block; padding: .75rem 1rem; border-radius: .4rem; background: #234f3d; color: white; text-decoration: none; font-weight: 650; }
.source-action:hover { background: #173e2e; }
#status { margin-bottom: 0; color: #486158; min-height: 1.6em; }
.search-form { margin-top: 2rem; max-width: 760px; padding: 1.5rem; background: white; border: 1px solid #dce5da; border-radius: .8rem; }
.district-field small { display: block; margin-top: .4rem; }
.optional, .more-filters summary span { color: #486158; font-size: .875rem; font-weight: 400; }
.more-filters { margin: 1.25rem 0; border-top: 1px solid #dce5da; border-bottom: 1px solid #dce5da; }
.more-filters summary { padding: 1rem 0; color: #173e2e; font-weight: 650; cursor: pointer; }
.more-filters summary:focus-visible { outline: 3px solid #cf8d3b; outline-offset: 3px; }
.more-filters .filter-grid { padding-top: .25rem; }
.filter-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.filter-field label { display: block; font-weight: 650; margin-bottom: .4rem; }
.filter-field input, .filter-field select, .filter-field textarea { display: block; width: 100%; min-width: 0; border: 1px solid #aabdb0; border-radius: .4rem; padding: .75rem; font: inherit; color: inherit; background: white; }
.filter-field input:focus-visible, .filter-field select:focus-visible, .filter-field textarea:focus-visible { outline: 3px solid #cf8d3b; outline-offset: 2px; }
.filter-field small, .form-help { color: #486158; font-size: .875rem; }
.form-help { margin: 1rem 0; }
.filter-preview { color: #294d3b; font-size: .9rem; margin: 1rem 0; }
.form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; }
.form-actions a, .pagination a { color: #173e2e; }
.search-error { max-width: 760px; margin-top: 2rem; padding: 1rem; border: 1px solid #a82929; border-radius: .4rem; color: #731c1c; background: #fff2f2; }
.pagination { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.5rem; }
.results { margin-top: 3rem; }
.note { color: #486158; font-size: .9rem; }
.listing-list { padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 1rem; }
.listing { padding: 1.3rem; background: white; border: 1px solid #dce5da; border-radius: .8rem; }
.listing h3 { font-family: Georgia, serif; font-size: 1.3rem; font-weight: 400; margin: .5rem 0; }
.listing p { margin: .5rem 0; }
.listing-type { color: #577b61; font-size: .8rem; font-weight: 700; }
.price { font-weight: 700; }
@media (max-width: 520px) { .filter-grid { grid-template-columns: 1fr; } .search-form { padding: 1rem; } }
.listing h3 a, .back-link { color: #173e2e; }
.listing h3 a:hover, .back-link:hover { color: #577b61; }

.listing-image-link { display: block; border-radius: .5rem; text-decoration: none; }
.listing-image-link:focus-visible { outline: 3px solid #cf8d3b; outline-offset: 3px; }
.listing-image, .image-placeholder { width: 100%; aspect-ratio: 4 / 3; border-radius: .5rem; }
.listing-image { display: block; object-fit: cover; }
.image-placeholder { display: grid; place-items: center; background: #edf2eb; color: #486158; font-size: .9rem; }
.property-image-placeholder { max-width: 620px; aspect-ratio: 16 / 9; }
.image-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1rem; }
.image-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: .5rem; }
.publication-form .filter-field { margin-bottom: 1rem; }
header nav { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
header nav a { color: #173e2e; }

.gallery-item { display: block; border-radius: .5rem; }
.gallery-lightbox { width: min(92vw, 960px); max-width: 960px; max-height: 92vh; padding: 1rem; border: 0; border-radius: .8rem; background: #fff; color: #17342b; }
.gallery-lightbox::backdrop { background: rgba(8, 20, 14, .8); }
.gallery-toolbar, .gallery-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.gallery-toolbar p { margin: 0; }
.gallery-controls { margin-top: .75rem; }
.gallery-full-image { display: block; width: 100%; height: min(65vh, 650px); margin-top: .75rem; object-fit: contain; background: #edf2eb; }
.gallery-lightbox button:disabled { opacity: .55; cursor: default; }
@media (max-width: 520px) { .gallery-lightbox { width: 96vw; padding: .75rem; } .gallery-full-image { height: 55vh; } }

.district-field { position: relative; }
.location-suggestions { position: absolute; z-index: 3; inset-inline: 0; margin: .25rem 0 0; padding: .25rem; list-style: none; background: white; border: 1px solid #aabdb0; border-radius: .4rem; box-shadow: 0 .3rem .8rem #17342b22; max-height: 16rem; overflow-y: auto; }
.location-suggestions li { padding: .6rem .75rem; border-radius: .25rem; cursor: pointer; }
.location-suggestions li:hover, .location-suggestions li[aria-selected="true"] { background: #dceade; color: #17342b; }
.screen-reader-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

@media (max-width: 520px) { header { flex-direction: column; align-items: flex-start; gap: .75rem; } header nav { gap: .5rem 1rem; } }

.district-field .verified-district { display: flex; align-items: flex-start; gap: .5rem; margin: .8rem 0 .2rem; font-weight: 500; }
.district-field .verified-district input { width: auto; margin: .4rem 0 0; }

/* Map search */
.map-page { max-width: 1200px; margin: 0 auto; padding: 1rem; }
.live-map { height: min(58vh, 560px); min-height: 320px; width: 100%; border-radius: 12px; background: #e8efe9; }
.map-list { list-style: none; padding: 0; display: grid; gap: .75rem; }
.map-list li { padding: .8rem; border: 1px solid #cbd9d0; border-radius: .5rem; background: #fff; }
.map-list li:focus { outline: 3px solid #216c4a; outline-offset: 2px; }
.map-list p { margin: .35rem 0 0; }

.map-preview { margin: 1rem 0; padding: 1rem; border: 1px solid #abc7b4; border-radius: .75rem; background: white; }
.map-preview:focus { outline: 3px solid #216c4a; outline-offset: 2px; }
.map-preview-image { width: 100%; max-width: 360px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: .5rem; }
.map-select { margin-top: .6rem; }

/* Property breadcrumb */
.breadcrumbs { margin: .5rem 0 1rem; color: #486158; font-size: .875rem; overflow-wrap: anywhere; }
.breadcrumbs a { color: #173e2e; }
.gallery-full-image[hidden] { display: none; }
.analytics-consent {
  position: fixed;
  z-index: 1000;
  inset: auto 1rem 1rem;
  max-width: 36rem;
  padding: 1rem;
  background: white;
  color: #17212b;
  border: 1px solid #9aa7b2;
  border-radius: .75rem;
  box-shadow: 0 4px 20px #0003;
}
.analytics-consent[hidden], .analytics-preferences[hidden] { display: none; }
.analytics-consent p { margin: 0 0 .75rem; }
.analytics-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.analytics-preferences { margin: 1rem; }
