/* Comfortable reading and touch controls, without changing the desktop layout. */
.mobile-contact-bar { display: none; }
.leaflet-container.is-selecting-area .price-marker { pointer-events: none; }

@media (max-width: 991px) {
  body { font-size: 16px; }
  .container-wide { width: calc(100% - 40px); }
  .btn, .btn-sm, .icon-button, .header-login, .mobile-menu-toggle,
  .favorite-button, .view-switch button, .pagination-wrap a,
  .pagination-wrap button, .card-view-link, .circle-link {
    min-width: 44px;
    min-height: 44px;
  }
  .btn, .btn-sm { font-size: 14px; }
  .form-control, .form-select,
  .auth-form .form-control, .register-page .form-control,
  .publish-page .form-control, .publish-page .form-select,
  .contact-card .form-control, .results-toolbar .form-select,
  .filters-panel .form-control, .filters-panel .form-select {
    font-size: 16px;
    min-height: 48px;
  }
  .upload-zone input { font-size: 16px; }
  .upload-zone input::file-selector-button { font-size: 14px; min-height: 44px; padding: 10px 14px; }
  .form-control, .form-select, .field-pair > *, .field-triple > *,
  .results-panel, .results-content > *, .detail-layout > *, .auth-form-wrap,
  .agency-card-header > div, .seller-profile > div {
    min-width: 0;
  }
  .field-label, .publish-page .field-label, .contact-card .field-label {
    font-size: 13px;
    line-height: 1.5;
  }
  .eyebrow, .tiny-label, .page-heading .eyebrow, .section-heading .eyebrow,
  .map-story-copy .eyebrow, .sell-section .eyebrow {
    font-size: 11px;
    letter-spacing: 1.2px;
  }
  .text-link, .text-button, .back-link { min-height: 44px; }
  .text-link, .back-link { font-size: 14px; }
  .text-button { font-size: 13px; }
  .section-heading > .text-link { font-size: 14px; }
  .section-intro { font-size: 15px; }
  .city-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .city-card span { font-size: 10px; letter-spacing: .7px; }
  .city-card p { font-size: 13px; }
  .mobile-filter-toggle { min-height: 52px; font-size: 15px; }
  .filter-heading { font-size: 14px; }
  .filter-heading .text-button { font-size: 13px; padding-inline: 8px; }
  #filter-content { padding-inline: 20px; }
  #listing-filters > .filter-heading { margin-block: 4px; }
  .results-toolbar > p { font-size: 14px; }
  .results-toolbar .form-select { width: 190px; }
  .map-view .results-content { grid-template-columns: minmax(0, 1fr); }
  .map-view .map-panel { grid-row: 1; position: static; }
  #search-map { height: clamp(320px, 52svh, 480px); }
  .map-instructions { font-size: 13px; line-height: 1.6; }
  .map-instructions .text-button { font-size: 13px; }
  .map-footnote { font-size: 12px; padding: 12px 14px; }
  .leaflet-touch .leaflet-bar a { width: 44px; height: 44px; line-height: 44px; }
  .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polygon { background-position: -22px 6px; }
  .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-rectangle { background-position: -53px 6px; }
  .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit { background-position: -143px 6px; }
  .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove { background-position: -173px 6px; }
  .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled { background-position: -203px 6px; }
  .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled { background-position: -233px 5px; }
  .leaflet-touch .leaflet-draw-actions a { min-height: 44px; line-height: 44px; font-size: 13px; }
  .property-card h3, .search-properties .property-card h3,
  .map-view .property-card h3 { font-size: 18px; white-space: normal; line-height: 1.4; }
  .property-card-location, .search-properties .property-card-location { font-size: 13px; }
  .property-card-specs, .search-properties .property-card-specs,
  .map-view .property-card-specs { font-size: 13px; flex-wrap: wrap; gap: 10px 18px; }
  .property-card-seller, .search-properties .property-card-seller { font-size: 12px; gap: 8px; }
  .seller-mini { white-space: normal; line-height: 1.4; }
  .property-badge { font-size: 10px; letter-spacing: .35px; }
  .favorite-button { width: 44px; height: 44px; }
  .favorite-button .icon { width: 20px; height: 20px; }
  .card-view-link { flex-shrink: 0; }
  .property-description, .contact-card > p { font-size: 15px; line-height: 1.8; }
  .contact-card .btn, .seller-phone { font-size: 15px; }
  .seller-phone { min-height: 52px; }
  .contact-card .consent-check, .consent-check { font-size: 13px; line-height: 1.65; }
  .consent-check input { width: 20px; height: 20px; flex-shrink: 0; }
  .seller-profile p { font-size: 13px; }
  .seller-profile h3 { overflow-wrap: anywhere; }
  .features-grid { font-size: 14px; }
  .auth-form-wrap > p:not(.eyebrow) { font-size: 15px; }
  .account-types label span { font-size: 12px; min-height: 88px; }
  .auth-form .btn { font-size: 15px; }
  .auth-note { font-size: 13px !important; line-height: 1.6; }
  .password-toggle { top: 2px; right: 5px; min-height: 44px; min-width: 66px; font-size: 13px; }
  .password-field .form-control { padding-right: 78px; }
  .form-message { font-size: 14px; line-height: 1.6; }
  .agency-card .agency-description, .agency-cta p { font-size: 15px; }
  .agency-card-header p, .agency-contacts a { font-size: 13px; }
  .agency-contacts a { min-height: 44px; max-width: 100%; }
  .agency-card-bottom .text-link, .agency-card-bottom > span { font-size: 13px; }
  .agency-card-bottom { flex-wrap: wrap; }
  .agency-cta .btn { font-size: 14px; }
  .pagination-wrap { flex-wrap: wrap; gap: 8px; }
  .pagination-wrap a, .pagination-wrap button { font-size: 14px; }
  .footer-main > div > a:not(.brand):not(.circle-link) {
    display: flex;
    align-items: center;
    min-height: 44px;
    margin-bottom: 0;
    font-size: 13px;
  }
  .footer-heading { font-size: 13px; }
  .footer-brand-block > p { font-size: 13px; }
  .footer-bottom { font-size: 12px; line-height: 1.6; }
  .footer-bottom > a { display: inline-flex; align-items: center; min-height: 44px; }
  .app-toast { bottom: calc(18px + env(safe-area-inset-bottom, 0px)); font-size: 14px; }
  .site-footer { padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)); }
  .gallery-modal .modal-header { min-height: 58px; font-size: 14px; }
  .gallery-open { min-height: 44px; font-size: 13px; }
  .gallery-modal .btn-close { min-width: 28px; min-height: 28px; padding: 8px; }
  .gallery-modal .modal-body > img { max-height: 75svh; }
  #gallery-image { touch-action: pan-y pinch-zoom; }
  .gallery-modal .icon-button { width: 44px; height: 44px; }
  .legal-page p { font-size: 16px; }
  .empty-state p { font-size: 15px; }
  .search-guide p { font-size: 16px; }
  details > summary { min-height: 44px; line-height: 1.55; cursor: pointer; }
}

@media (max-width: 767px) {
  .container-wide { width: calc(100% - 32px); }
  .site-header { height: 76px; }
  .header-inner { gap: 8px; }
  .site-header .brand { width: 170px; height: 44px; }
  .site-header .brand img { width: 170px; height: 57px; top: -6px; }
  .header-actions { gap: 4px; }
  .header-login, .mobile-menu-toggle, .header-actions > .btn {
    width: 44px;
    height: 44px;
    padding: 10px;
    flex-shrink: 0;
  }
  .header-login { border-radius: 50%; }
  .header-actions > .btn { border-radius: 11px; }
  .header-actions > .btn span, .header-login span { display: none; }
  .header-actions > .btn .icon, .header-login .icon, .mobile-menu-toggle .icon {
    width: 21px;
    height: 21px;
  }
  .mobile-nav {
    top: 76px;
    padding: 12px 24px 20px;
    max-height: calc(100svh - 76px);
    overflow-y: auto;
  }
  .mobile-nav a { font-size: 16px; padding-block: 13px; min-height: 48px; }
  .section-space { padding-top: 52px; }
  .section-heading { gap: 10px; margin-bottom: 24px; }
  .section-heading h2, .map-story-copy h2 { font-size: clamp(30px, 8.7vw, 40px); }
  .section-heading > .text-link { font-size: 14px; }
  .section-intro { font-size: 15px; line-height: 1.7; }
  .home-properties { gap: 22px; }
  .property-card-body, .search-properties .property-card-body,
  .map-view .property-card-body { padding: 20px 18px 14px; }
  .property-card-price, .search-properties .property-card-price,
  .map-view .property-card-price { font-size: 27px; }
  .property-card-location { margin-bottom: 14px; align-items: flex-start; }
  .property-card-location .icon { margin-top: 3px; }
  .property-card-specs { padding-bottom: 16px; }
  .property-card-seller { margin-top: 8px; }
  .property-badges { top: 14px; left: 14px; right: 66px; flex-wrap: wrap; gap: 5px; }
  .favorite-button { top: 12px; right: 12px; }
  .city-grid { gap: 14px; }
  .city-card { height: 265px; }
  .city-card > div { left: 15px; right: 15px; bottom: 19px; }
  .city-card span { font-size: 10px; letter-spacing: .3px; line-height: 1.5; display: block; }
  .city-card h3 { font-size: 29px; }
  .city-card p { font-size: 12px; gap: 6px; }
  .city-card .icon { width: 17px; flex-shrink: 0; }
  .map-story-copy > p:not(.eyebrow) { font-size: 16px; line-height: 1.8; }
  .map-story-copy .btn { font-size: 14px; }
  .map-art-label { font-size: 12px; }
  .sell-section { padding: 32px 24px; }
  .sell-section h2 { font-size: clamp(30px, 8vw, 37px); }
  .sell-section p:not(.eyebrow) { font-size: 15px; max-width: none; line-height: 1.7; }
  .sell-section .btn { font-size: 14px; padding-inline: 16px; }
  .footer-main { gap: 24px 20px; }
  .footer-brand-block { flex-direction: column; align-items: flex-start; gap: 12px; }
  .footer-brand-block > p { font-size: 14px; }
  .footer-heading { line-height: 1.5; margin-bottom: 10px; }
  .footer-main > div > a:not(.brand):not(.circle-link) { line-height: 1.5; }
  .footer-bottom { gap: 10px; }
  .search-page .page-heading h1,
  .search-page .page-heading:has(.search-city-intro) h1 { font-size: clamp(32px, 9vw, 40px); }
  .page-heading p:not(.eyebrow), .dashboard-page .page-heading p:not(.eyebrow),
  .publish-page .page-heading p:not(.eyebrow), .agencies-page .page-heading p:not(.eyebrow) {
    font-size: 15px;
    line-height: 1.7;
  }
  .view-switch button { font-size: 15px; padding: 10px 12px; }
  .results-toolbar { flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
  .results-toolbar > p { font-size: 14px; margin-bottom: 0; max-width: none; flex: 1 1 110px; }
  .results-toolbar .form-select { flex: 0 1 190px; width: 190px; padding: 11px 32px 11px 12px; }
  .map-view .search-properties { margin-top: 22px; }
  .map-instructions { padding: 14px; gap: 6px; }
  .map-instructions > span { display: flex; align-items: flex-start; gap: 8px; }
  .map-instructions > span .icon { margin-top: 2px; }
  .detail-heading { gap: 12px; align-items: flex-start; }
  .detail-heading > div:first-child { min-width: 0; }
  .detail-heading h1 { font-size: clamp(29px, 8vw, 36px); line-height: 1.15; }
  .detail-heading .detail-location { font-size: 14px; line-height: 1.6; }
  .detail-location .icon { width: 17px; height: 17px; margin-top: 3px; }
  .detail-actions { flex-shrink: 0; }
  .detail-actions .favorite-button { width: 44px; height: 44px; padding: 11px; }
  .detail-gallery { grid-template-rows: minmax(220px, 68vw) 125px; }
  .detail-gallery.single-image { grid-template-rows: clamp(240px, 78vw, 440px); }
  .detail-gallery.two-images { grid-template-rows: minmax(220px, 68vw) 160px; }
  .gallery-open { min-height: 44px; font-size: 13px; padding: 10px 14px; }
  .photo-disclosure { font-size: 12px; line-height: 1.65; margin-top: 10px; }
  .detail-price { font-size: 36px; }
  .detail-price small { font-size: 16px; }
  .detail-meta { flex-wrap: wrap; gap: 8px; }
  .detail-meta > span { font-size: 12px; }
  .detail-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 14px; }
  .detail-specs > div { flex-direction: row; text-align: left; gap: 12px; border: 0; }
  .detail-specs strong { font-size: 20px; }
  .detail-specs small { font-size: 10px; letter-spacing: .45px; }
  .detail-section h2 { font-size: 27px; }
  .property-description { font-size: 16px; line-height: 1.85; }
  .features-grid { font-size: 14px; gap: 14px; }
  .features-grid > span { align-items: flex-start; }
  .energy-pill { max-width: 100%; }
  .energy-pill span, .detail-address { font-size: 14px; }
  .contact-card { padding: 24px 20px; scroll-margin-top: 20px; }
  body:has(.mobile-contact-bar) { padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
  .mobile-contact-bar {
    position: fixed;
    inset: auto 0 0;
    z-index: 1040;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 78px;
    padding: 12px max(18px, env(safe-area-inset-right, 0px)) calc(12px + env(safe-area-inset-bottom, 0px)) max(18px, env(safe-area-inset-left, 0px));
    background: #fff;
    border-top: 1px solid var(--line);
    box-shadow: 0 -8px 28px #23232909;
  }
  .mobile-contact-bar > div { display: flex; flex-direction: column; min-width: 0; }
  .mobile-contact-bar small { font-size: 12px; color: var(--muted); line-height: 1.5; }
  .mobile-contact-bar strong { font-size: 22px; line-height: 1.25; letter-spacing: -.6px; }
  .mobile-contact-bar strong span { font-size: 13px; font-weight: 400; letter-spacing: 0; }
  .mobile-contact-bar .btn { min-height: 48px; padding: 12px 22px; font-size: 15px; flex-shrink: 0; }
  body:has(.mobile-contact-bar:not([hidden])) .app-toast {
    bottom: calc(94px + env(safe-area-inset-bottom, 0px));
  }
  .contact-card .field-label { font-size: 13px; }
  .contact-card .consent-check { font-size: 13px; }
  .seller-profile h3 { font-size: 19px; }
  .seller-profile p { font-size: 13px; }
  .auth-page { padding-top: 24px; gap: 26px; }
  .auth-story, .register-page .auth-story { height: 220px; }
  .auth-story h1 { font-size: clamp(31px, 9vw, 40px); }
  .auth-story .eyebrow, .auth-form-wrap > .eyebrow { font-size: 11px; letter-spacing: 1px; }
  .auth-form-wrap, .register-page .auth-form-wrap { padding-inline: 2px; }
  .auth-form-wrap h2, .register-page .auth-form-wrap h2 { font-size: 32px; }
  .account-types label span { font-size: 12px; padding: 13px 6px; gap: 8px; }
  .dashboard-page .page-heading .btn { font-size: 14px; }
  .dashboard-stats { gap: 12px; }
  .stat-card { flex-wrap: wrap; gap: 8px; padding: 16px; }
  .stat-card span { font-size: 12px; line-height: 1.5; }
  .dashboard-tabs { gap: 22px; padding-top: 4px; scrollbar-width: thin; overscroll-behavior-x: contain; }
  .dashboard-tabs button { min-height: 48px; font-size: 14px; flex-shrink: 0; }
  .dashboard-section-heading { align-items: flex-start; flex-wrap: wrap; }
  .dashboard-section-heading .btn { font-size: 13px; }
  .manage-listing { gap: 12px; }
  .manage-listing > img { width: 82px; height: 82px; flex-shrink: 0; }
  .manage-listing h3 { font-size: 16px; }
  .manage-listing p { font-size: 13px; }
  .manage-listing-actions { flex-wrap: wrap; gap: 8px; justify-content: flex-start; }
  .manage-listing-actions .btn { font-size: 13px; padding: 10px 12px; }
  .inquiry-top p, .inquiry-top time { font-size: 13px; overflow-wrap: anywhere; }
  .inquiry-message { font-size: 15px; overflow-wrap: anywhere; }
  .inquiry-reply { gap: 8px 20px; }
  .inquiry-reply a { min-height: 44px; font-size: 14px; overflow-wrap: anywhere; }
  .profile-row { flex-direction: column; align-items: flex-start; gap: 5px; font-size: 14px; }
  .profile-row strong { text-align: left; max-width: 100%; }
  .form-section { padding: 24px 18px; }
  .form-section-title h2 { font-size: 25px; }
  .form-section-title p { font-size: 14px; line-height: 1.6; }
  .form-section-title > span { font-size: 12px; }
  .publish-page .field-pair { gap: 12px; }
  .feature-checkboxes { font-size: 14px; gap: 8px 12px; }
  .feature-checkboxes label { min-height: 44px; align-items: center; }
  .feature-checkboxes input { width: 20px; height: 20px; flex-shrink: 0; }
  .publish-tip p, .publish-tip li { font-size: 14px; line-height: 1.7; }
  .publish-submit .btn { min-height: 52px; font-size: 15px; }
  .upload-zone strong { font-size: 15px; }
  .upload-zone span { font-size: 12px; line-height: 1.6; }
  .photo-previews { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .photo-preview button { min-width: 44px; min-height: 44px; }
  .agency-card { padding: 24px 20px; }
  .agency-card h2 { font-size: 26px; overflow-wrap: anywhere; }
  .agency-contacts { gap: 6px; padding-block: 12px; }
  .agency-contacts a { width: 100%; font-size: 14px; }
  .agency-cta { padding: 26px 22px; }
  .empty-state { padding: 32px 20px; }
  .legal-page h1 { font-size: 34px; }
}

@media (max-width: 359px) {
  .container-wide { width: calc(100% - 28px); }
  .site-header .brand { width: 144px; }
  .site-header .brand img { width: 144px; height: 48px; top: -1px; }
  .header-actions { gap: 0; }
  .city-grid { gap: 12px; }
  .city-card { height: 240px; }
  .city-card > div { left: 12px; right: 12px; }
  .city-card h3 { font-size: 26px; }
  .city-card p { align-items: flex-end; }
  .results-toolbar .form-select { flex-basis: 100%; width: 100%; }
  .property-card-specs, .search-properties .property-card-specs,
  .map-view .property-card-specs { gap: 10px 13px; }
  .features-grid { grid-template-columns: 1fr; }
  .publish-page .field-pair { grid-template-columns: 1fr; gap: 0; }
  .sell-section { padding-inline: 20px; }
  .sell-section .btn { gap: 8px; font-size: 13px; }
}

@media (min-width: 600px) and (max-width: 767px) {
  .site-header .brand { width: 200px; }
  .site-header .brand img { width: 200px; height: 67px; top: -11px; }
  .home-properties, .search-properties, .map-view .search-properties,
  .dashboard-pane > .property-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .property-card-body, .search-properties .property-card-body,
  .map-view .property-card-body { padding-inline: 15px; }
  .property-card-price, .search-properties .property-card-price,
  .map-view .property-card-price { font-size: 24px; }
  .property-card-specs { gap: 8px 14px; }
  .city-card { height: 310px; }
}

@media (pointer: coarse) and (max-width: 991px) {
  .property-card:hover, .btn:hover { transform: none; }
  .property-card:hover .property-card-image img, .city-card:hover > img { transform: none; }
}


/* Affiliated agencies and valuation on small screens. */
@media (max-width: 991px) {
  .affiliate-card-foot > a:not(.text-link), .affiliate-card-foot .text-link { min-height: 44px; font-size: 14px; }
  .affiliates-stats span, .affiliate-numbers dt { font-size: 12px; }
  .condition-options strong { font-size: 14px; }
  .condition-options small, .valuation-submit > span, .valuation-agency span { font-size: 13px; }
  .valuation-agency small, .agency-option-body em { font-size: 12px; }
  .valuation-comparables span { font-size: 13px; }
  .valuation-pills span { min-height: 40px; font-size: 14px; }
  .valuation-text, .valuation-card p, .valuation-card ul { font-size: 15px; }
  .valuation-alt { font-size: 15px; line-height: 1.7; }
  .valuation-alt .text-button { min-height: 44px; }
}
