@media (hover: hover) {
  .property-card:hover {
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-5px);
  }

  .button:hover {
    transform: translateY(-1px);
  }
}

@media (max-width: 960px) {
  .site-header {
    gap: 18px;
  }

  .site-navigation {
    gap: 15px;
  }

  .site-navigation a {
    font-size: 13px;
  }

  .property-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .property-gallery,
  .property-layout {
    grid-template-columns: 1fr;
  }

  .property-secondary-images {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .contact-card {
    width: min(620px, 100%);
  }
}

@media (max-width: 780px) {
  .site-header {
    grid-template-columns: auto auto 1fr;
  }

  .menu-toggle {
    display: grid;
  }

  .site-navigation {
    padding: 10px;
    position: absolute;
    top: calc(100% + 8px);
    right: 16px;
    left: 16px;
    visibility: hidden;
    display: grid;
    gap: 2px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-medium);
    background: var(--color-surface);
    box-shadow: var(--shadow-card-hover);
    opacity: 0;
    transform: translateY(-8px);
    transition:
      opacity var(--transition-fast),
      transform var(--transition-fast),
      visibility var(--transition-fast);
  }

  .site-navigation.open {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  .site-navigation a {
    padding: 12px;
    border-radius: var(--radius-small);
    font-size: 14px;
  }

  .site-navigation a:hover {
    background: #eff2f3;
  }

  .demo-return {
    justify-self: end;
  }

  .property-search {
    grid-template-columns: 1fr 1fr;
  }

  .property-search .button {
    width: 100%;
  }

  .property-features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  :root {
    --header-height: 68px;
  }

  .site-header {
    padding-inline: 14px;
    gap: 10px;
  }

  .site-logo {
    font-size: 22px;
  }

  .menu-toggle {
    width: 38px;
    height: 38px;
  }

  .demo-return {
    font-size: 11px;
  }

  .hero {
    min-height: 550px;
    padding-inline: 14px;
  }

  .hero h1 {
    font-size: 42px;
  }

  .property-search {
    grid-template-columns: 1fr;
  }

  .section-shell,
  .property-page {
    width: min(calc(100% - 28px), var(--container-width));
  }

  .section-shell {
    padding-block: 58px;
  }

  .section-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .property-grid {
    grid-template-columns: 1fr;
  }

  .listings-hero {
    padding-inline: 14px;
  }

  .property-page {
    padding-block: 30px 58px;
  }

  .property-main-image {
    height: 310px;
  }

  .property-secondary-images {
    gap: 9px;
  }

  .property-secondary-images img {
    height: 145px;
  }

  .property-features {
    gap: 8px;
  }

  .property-features div,
  .contact-card {
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}