/* =========================================================
   CATALOG PAGE — catalog.html
   Pixel-accurate to Figma 1920 frame
   ========================================================= */

.big_block_home--catalog {
  background: #FFFFFF;
}
/* Direct-child only so the 96px page padding does NOT leak into the
   mega-menu's internal .container (it was inheriting and creating
   ~96px visible "margins" only on the catalog page's mega-menu). */
.big_block_home--catalog > .container {
  padding: 0 96px;
  position: relative;
}

/* Mega-menu logo: keep original colors (override buy.css brightness(0) filter) */
.big_block_home--catalog header .mega-menu .logo img {
  filter: none;
}

/* Mega-menu desktop layout: no catalog-specific overrides — inherit the
   base layout from style.css so the mega-menu on the catalog page looks
   identical to the rest of the site (previous override added side borders
   and slightly different padding that the client flagged as visible
   "márgenes" only present on /comprar-propiedad/). */

body:has(.big_block_home--catalog) .wrapper {
  position: relative;
  /* Override buy.css .wrapper border-left/right — no decorative side rails */
  border: 0;
  /* Override style.css overflow:clip so .lux-select__menu dropdowns
     can extend vertically below their fields without being cut off */
  overflow-x: clip !important;
  overflow-y: visible !important;
}

/* Photos cover vertical rails when they overlap */
body:has(.big_block_home--catalog) .cat_hero__photo,
body:has(.big_block_home--catalog) .cat_listings .buy_listing__photo,
body:has(.big_block_home--catalog) .cat_cta {
  position: relative;
  z-index: 10;
}
/* Hero фото перекрывает рейлы — z-index выше .cat_hero stacking */
body:has(.big_block_home--catalog) .cat_hero__photo {
  isolation: isolate;
  z-index: 10 !important;
}
/* Button keeps original teal bg but rides above rails */
body:has(.big_block_home--catalog) .buy_listings__more {
  position: relative;
  z-index: 2;
}
/* Footer covers rails — no rails should show in footer.
   Preserve original footer bg (#41545C) from style.css — don't override. */
body:has(.big_block_home--catalog) footer {
  position: relative;
  z-index: 3;
}

/* =========================================================
   1. HERO — text first (centered), photo below
   ========================================================= */
.cat_hero {
  padding: 64px 0 0;
  color: #010101;
  position: relative;
}
.cat_hero__body {
  text-align: center;
  max-width: 1538px;
  margin: 0 auto;
  padding: 0;
}
.cat_hero__breadcrumbs {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 130%;
  letter-spacing: 0;
  color: #B9B9B9;
  text-transform: none;
  margin-bottom: 32px;
}
.cat_hero__breadcrumbs a { color: #B9B9B9; text-decoration: none; transition: color .25s; letter-spacing: 0; text-transform: none; }
.cat_hero__breadcrumbs a:hover { color: #010101; }
.cat_hero__breadcrumbs .is-active { color: #010101; text-transform: none; letter-spacing: 0; }
.cat_hero__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 700;
  font-size: 64px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  text-transform: uppercase;
  margin: 0 auto 32px;
  max-width: 1352px;
}
.cat_hero__title em {
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 64px;
  color: #010101;
}
.cat_hero__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1080px;
  height: 80px;
  padding: 0 48px;
  background: transparent;
  color: #010101;
  border: 1px solid #010101;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 150%;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-decoration: none;
  margin-bottom: 56px;
  transition: background .25s, color .25s;
}
.cat_hero__cta:hover { background: #010101; color: #FFFFFF; }
.cat_hero__photo {
  width: 100%;
  aspect-ratio: 1728 / 580;
  overflow: hidden;
}
.cat_hero__photo picture {
  display: block;
  width: 100%;
  height: 100%;
}
.cat_hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* =========================================================
   2. FILTERS — rectangular bordered fields, triangle arrows
   ========================================================= */
.cat_filters {
  padding: 80px 0 64px;
}
.cat_filters .container { max-width: 1920px; padding: 0 96px; }
.cat_filters .buy_search__form { width: 100%; }
.cat_filters .buy_search__row {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr 0.9fr 1.1fr 1.1fr 1fr 0.9fr;
  align-items: center;
  gap: 14px;
  padding: 0 0 40px;
  margin-bottom: 32px;
  border-bottom: 0;
}
/* Override buy.css separator borders inside expandable filter panel */
.cat_filters .buy_search__more-content,
.cat_filters .buy_search__more-top {
  border-bottom: 0;
}
.cat_filters .buy_search__field {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 56px;
  padding: 0 12px;
  background: #FFFFFF;
  border: 1px solid #E1E1E1;
  border-radius: 0;
  position: relative;
  transition: border-color .25s;
  min-width: 0;
}
.cat_filters .buy_search__field:hover,
.cat_filters .buy_search__field:focus-within {
  border-color: #010101;
}
.cat_filters .buy_search__field > em {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 13px;
  color: #010101;
  flex-shrink: 0;
  order: 2;
}
.cat_filters .buy_search__field--price {
  padding: 0 10px;
  gap: 4px;
}
.cat_filters .buy_search__field--price select {
  width: auto;
  min-width: 0;
  flex: 1 1 auto;
  order: 1;
}
.cat_filters .buy_search__field select {
  width: 100%;
  min-width: 0;
  height: 32px;
  padding: 0 16px 0 0;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 130%;
  color: #B9B9B9;
  background: transparent;
  border: 0;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='%23010101'><path d='M0 0 L10 0 L5 6 Z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 0 center;
  background-size: 9px 5px;
  cursor: pointer;
  text-overflow: ellipsis;
}
.cat_filters .buy_search__field:focus-within select,
.cat_filters .buy_search__field select:not([data-empty]):valid { color: #010101; }
.cat_filters .buy_search__field select option { background: #FFFFFF; color: #010101; font-weight: 400; }

.cat_filters .buy_search__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  gap: 24px;
}
.cat_filters .buy_search__more {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  background: transparent;
  border: 0;
  padding: 0;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #B9B9B9;
  cursor: pointer;
  transition: color .25s;
}
.cat_filters .buy_search__more:hover { color: #010101; }
.cat_filters .buy_search__more::after {
  content: "";
  width: 42px;
  height: 42px;
  border: 1px solid #B9B9B9;
  border-radius: 50%;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><path d='M12 4v16M4 12h16' stroke='%23B9B9B9' stroke-width='1.4' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
  flex-shrink: 0;
}
.cat_filters .buy_search__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 320px;
  height: 72px;
  padding: 0 24px;
  background: #41545C;
  color: #FFFFFF;
  border: 0;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 130%;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .25s;
}
.cat_filters .buy_search__submit:hover { background: #010101; }

/* =========================================================
   3. SECTION TITLE — with horizontal separators top & bottom
   ========================================================= */
.cat_title {
  padding: 96px 0;
  background: #FFFFFF;
  text-align: center;
  margin-top: 80px;
}
.cat_title .container {
  max-width: 1920px;
  padding: 0 96px;
}
.cat_title h2 {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 700;
  font-size: 56px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  text-transform: uppercase;
  margin: 0 auto;
  max-width: 1482px;
}

/* =========================================================
   4. LISTINGS — bigger Felidae title, REF spacing,
   pager overlaid on photo (bottom-right absolute)
   ========================================================= */
.cat_listings {
  padding: 0;
}
.cat_listings .container {
  max-width: 1920px;
  padding: 0 96px;
}
.cat_listings .buy_listing {
  margin-bottom: 0;
  padding: 80px 45px;
  border-bottom: 1px solid #E1E1E1;
}
.cat_listings .buy_listing:last-of-type { border-bottom: 0; }
.cat_listings .buy_listing--text-left { padding: 80px 45px; }
.cat_listings .buy_listing--text-right { padding: 80px 0; }

.cat_listings .buy_listing__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  text-transform: none;
  margin-bottom: 0;
}
.cat_listings .buy_listing__head {
  gap: 18px;
  margin-bottom: 40px;
}
.cat_listings .buy_listing__ref {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 0.1em;
  color: #B9B9B9;
  text-transform: uppercase;
}
.cat_listings .buy_listing__desc {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 140%;
  color: #3C3C3B;
  margin-bottom: 48px;
  max-width: 736px;
}
.cat_listings .buy_listing__specs li,
.cat_listings .buy_listing__specs li span,
.cat_listings .buy_listing__specs li b {
  font-size: 20px;
  line-height: 140%;
  color: #3C3C3B;
}
.cat_listings .buy_listing__specs li b { font-weight: 400; }
.cat_listings .buy_listing__specs { gap: 20px; }

.cat_listings .buy_listing__price {
  font-size: 40px;
}
.cat_listings .buy_listing__price em,
.cat_listings .buy_listing__price b {
  font-size: 40px;
}

.cat_listings .buy_listing__btn {
  font-size: 18px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  height: 80px;
}

/* photo container becomes a position-anchor for pager */
.cat_listings .buy_listing__photo {
  position: relative;
}

/* =========================================================
   CATALOG — Swiper carousel styled like original cat_pager
   (override buy.css's larger arrows / 44px counter)
   ========================================================= */
.cat_listings .buy_listing__controls {
  position: absolute;
  left: 32px;
  right: 32px;
  bottom: 28px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0;
  background: transparent;
}
.cat_listings .buy_listing__nav {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  flex-shrink: 0;
  position: static;
}
.cat_listings .buy_listing__nav-btn {
  width: 22px;
  height: 28px;
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  position: static;
  top: auto;
  left: auto;
  right: auto;
  cursor: pointer;
  opacity: 0.95;
  transition: opacity .25s, transform .25s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cat_listings .buy_listing__nav-btn::after,
.cat_listings .buy_listing__nav-btn.swiper-button-prev::after,
.cat_listings .buy_listing__nav-btn.swiper-button-next::after {
  content: '';
  display: block;
  width: 14px;
  height: 22px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='22' viewBox='0 0 14 22' fill='none'><path d='M11 2L3 11L11 20' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.45));
  transform: none;
  font-size: 0;
  color: transparent;
}
.cat_listings .buy_listing__nav-btn--next::after,
.cat_listings .buy_listing__nav-btn.swiper-button-next::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='22' viewBox='0 0 14 22' fill='none'><path d='M3 2L11 11L3 20' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.cat_listings .buy_listing__nav-btn--prev:hover { transform: translateX(-2px); }
.cat_listings .buy_listing__nav-btn--next:hover { transform: translateX(2px); }
.cat_listings .buy_listing__progress {
  flex: 1 1 auto;
  height: 1px;
  background: rgba(255, 255, 255, 0.65);
  margin: 0 24px;
  position: relative;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.cat_listings .buy_listing__progress-fill {
  background: #FFFFFF;
  height: 1px;
}
.cat_listings .buy_listing__counter {
  position: static;
  width: auto;
  flex-shrink: 0;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 100%;
  letter-spacing: 0.02em;
  color: #FFFFFF;
  background: transparent;
  text-shadow: 0 2px 4px rgba(0,0,0,0.35);
}

/* pager OVERLAY — chevrons at LEFT, thin line, number at RIGHT */
.cat_pager {
  position: absolute;
  left: 32px;
  right: 32px;
  bottom: 28px;
  display: flex;
  align-items: center;
  padding: 0;
  background: transparent;
  z-index: 2;
  pointer-events: none;
}
.cat_pager__nav {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  pointer-events: auto;
  flex-shrink: 0;
}
.cat_pager__line {
  flex: 1 1 auto;
  height: 1px;
  background: rgba(255, 255, 255, 0.65);
  margin: 0 24px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.cat_pager__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 28px;
  text-decoration: none;
  opacity: 0.95;
  transition: opacity .25s, transform .25s;
}
.cat_pager__arrow:hover { opacity: 1; transform: translateX(0); }
.cat_pager__arrow--prev:hover { transform: translateX(-2px); }
.cat_pager__arrow--next:hover { transform: translateX(2px); }
.cat_pager__arrow svg {
  display: block;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.45));
}
.cat_pager__num {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 100%;
  letter-spacing: 0.02em;
  color: #FFFFFF;
  display: inline-flex;
  align-items: baseline;
  gap: 0;
  text-shadow: 0 2px 4px rgba(0,0,0,0.35);
  pointer-events: auto;
}
.cat_pager__num i {
  font-style: normal;
  font-family: "Inter", sans-serif;
  font-weight: 200;
  font-size: 32px;
  color: rgba(255, 255, 255, 0.75);
  margin: 0 2px;
}

/* =========================================================
   5. NOT-FOUND CTA — full-bleed photo + centered white card
   ========================================================= */
.cat_cta {
  padding: 120px 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.cat_cta .container {
  max-width: 1920px;
  padding: 0 96px;
  position: relative;
  z-index: 1;
}
.cat_cta__card {
  background: #FAFAFA;
  color: #010101;
  padding: 128px 100px 96px;
  max-width: 1349px;
  margin: 0 auto;
  text-align: center;
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.18);
}
.cat_cta__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 700;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  text-transform: uppercase;
  margin-bottom: 40px;
}
.cat_cta__lead {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 36px;
  line-height: 110%;
  letter-spacing: 0.02em;
  color: #010101;
  margin-bottom: 88px;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}
.cat_cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 720px;
  height: 80px;
  padding: 0 32px;
  background: transparent;
  color: #010101;
  border: 1px solid #010101;
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: 25px;
  line-height: 150%;
  letter-spacing: 0.05em;
  text-transform: none;
  text-decoration: none;
  margin-bottom: 36px;
  transition: background .25s, color .25s;
}
.cat_cta__btn:hover { background: #010101; color: #FFFFFF; }
.cat_cta__micro {
  font-family: "Inter", sans-serif;
  font-weight: 300;
  font-size: 20px;
  line-height: 130%;
  color: #3C3C3B;
}

/* "Смотреть больше проектов" btn — uppercase, neat thin outline INSIDE rails */
.cat_listings .buy_listings__more {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-size: 18px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  height: 96px;
  width: calc(100% - 256px);
  max-width: 1666px;
  border: 0;
  outline: 1px solid #D0D0D0;
  outline-offset: 32px;
  margin-top: 36px;
  margin-bottom: 116px;
  position: relative;
}
.cat_listings .buy_listings__more:hover {
  outline-color: #D0D0D0;
}

/* When the mega-menu is open (body gets .noscroll from main.js burger
   handler), hide the catalog page sections so native <select> fields and
   other content cannot bleed through the mega-menu overlay. Robust
   fallback for browsers/scenarios where the :has() rule below doesn't
   match (e.g. stale cache, partial selector support). Applies at all
   viewports — safe because on desktop the menu also covers everything. */
body.noscroll .cat_title,
body.noscroll .cat_filters,
body.noscroll .cat_listings,
body.noscroll .cat_cta {
  visibility: hidden !important;
}

/* =========================================================
   ADAPTIVE — 1700 / 1440 / 1200 / 768 / 480
   ========================================================= */
/* @1700 — laptop screens: grid 760+869+54 = 1683 doesn't fit container
   (viewport 1669 → container content 1477). Switch to fluid columns
   so right-column button can't overflow past photo. */
@media (max-width: 1700px) and (min-width: 1201px) {
  .cat_listings .buy_listing,
  .cat_listings .buy_listing--text-right {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 40px;
  }
  .cat_listings .buy_listing__btn {
    max-width: 100%;
    height: 64px;
    font-size: 16px;
    letter-spacing: 0.12em;
  }
  .cat_listings .buy_listing__photo {
    aspect-ratio: 1 / 1;
  }
  /* 8-col single-row filter clips "Все подтипы" / "Все типы" / "Все зоны"
     at 1201-1700 too — wrap to 4×2 grid. */
  .cat_filters .buy_search__row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    row-gap: 14px;
  }
}
@media (max-width: 1440px) {
  .cat_hero__title { font-size: 50px; }
  .cat_hero__title em { font-size: 50px; }
  .cat_title h2 { font-size: 44px; }
  .cat_cta__title { font-size: 64px; }
  .cat_cta__lead { font-size: 30px; }
  .cat_cta__card { padding: 96px 80px 80px; max-width: 1180px; }
  .cat_listings .buy_listing__title { font-size: 32px; }
  /* 8-col grid is too tight at 1500 — "Все подтипы" gets clipped.
     Wrap to 4×2 grid so each cell has enough room. */
  .cat_filters .buy_search__row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    row-gap: 14px;
  }
}

/* Pixel-perfect to Figma 1200_Catalog (1200x4712).
   Order: Hero -> Section Title -> Filters -> Listings -> CTA
   Hero title 50px Felidae uppercase, CTA title 50px, CTA sub 28px Felidae */
@media (max-width: 1200px) {
  .big_block_home.big_block_home--buy.big_block_home--catalog > .container,
  .cat_filters .container,
  .cat_title .container,
  .cat_listings .container,
  .cat_cta .container { padding: 0 60px; }

  /* HERO */
  .cat_hero { padding: 40px 0 0; }
  .cat_hero__breadcrumbs { font-size: 16px; gap: 6px; margin-bottom: 24px; }
  .cat_hero__title { font-size: 50px; line-height: 110%; letter-spacing: 0.02em; max-width: 926px; margin-bottom: 24px; }
  .cat_hero__title em { font-size: 50px; line-height: 110%; }
  .cat_hero__cta { font-size: 22px; height: 56px; line-height: 140%; padding: 0 24px; max-width: 700px; margin-bottom: 40px; letter-spacing: 0.05em; }
  /* Full-bleed hero image — extends past container padding to inner wrapper edges (Figma 1200×397) */
  .cat_hero__photo {
    margin-left: -60px;
    margin-right: -60px;
    width: calc(100% + 120px);
    aspect-ratio: 1200 / 397;
  }

  /* SECTION TITLE — comes BEFORE filters at 1200 */
  .cat_title { padding: 56px 0; margin-top: 0; }
  .cat_title h2 { font-size: 35px; line-height: 110%; max-width: 100%; }

  /* FILTERS — single row with 8 fields */
  /* position:relative + high z-index ensures lux-select dropdown
     stacks ABOVE the next sibling .cat_listings (which has photos with z-index:2) */
  .cat_filters {
    padding: 40px 0 32px;
    overflow: visible;
    position: relative;
    z-index: 50;
  }
  /* 8-col single-row was truncating "Все подтипы" / "Все типы" / "Все зоны" /
     "Спальни" labels at this width — wrap to 2 rows of 4 columns instead so
     each cell gets ~220-240px and all labels fit cleanly. */
  .cat_filters .buy_search__row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 14px;
    padding: 0 0 24px;
    margin-bottom: 24px;
    row-gap: 12px;
    overflow: visible;
  }
  .cat_filters .buy_search__field {
    height: 44px;
    padding: 0 6px;
    gap: 3px;
    overflow: visible;
  }
  .cat_filters .buy_search__field--price { padding: 0 6px; gap: 2px; }
  .cat_filters .buy_search__field select {
    font-size: 10px;
    padding-right: 8px;
    height: 28px;
    background-size: 6px 4px;
    text-overflow: ellipsis;
  }
  .cat_filters .buy_search__field > em { font-size: 11px; }

  /* "Ещё параметры" expandable panel — pixel-perfect to Figma 1200 */
  .cat_filters .buy_search__more-panel {
    margin: 0 0 24px;
  }
  .cat_filters .buy_search__more-content {
    padding: 24px 0 28px;
  }
  .cat_filters .buy_search__more-top {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 32px;
    padding-bottom: 18px;
  }
  .cat_filters .buy_search__more-input { padding: 0 4px 8px; max-width: 100%; }
  .cat_filters .buy_search__more-input input { font-size: 14px; }
  .cat_filters .buy_search__more-input em { font-size: 14px; }
  .cat_filters .buy_search__more-toprow { gap: 32px; padding-bottom: 4px; }
  .cat_filters .buy_search__more-grid {
    padding-top: 18px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px 24px;
  }
  .cat_filters .buy_chip { gap: 10px; }
  .cat_filters .buy_chip__dot { width: 14px; height: 14px; }
  .cat_filters .buy_chip__dot::after { width: 8px; height: 8px; }
  .cat_filters .buy_chip__label { font-size: 13px; line-height: 130%; }

  /* When panel is open, the "Ещё параметры" button shows close icon */
  .cat_filters .buy_search__more.is-open::after {
    transform: rotate(45deg);
  }
  .cat_filters .buy_search__more { font-size: 22px; gap: 12px; }
  .cat_filters .buy_search__more::after {
    width: 30px; height: 30px; background-size: 16px 16px;
  }
  .cat_filters .buy_search__submit {
    width: 220px; height: 50px; font-size: 16px; letter-spacing: 0.1em;
  }

  /* LISTINGS — keep horizontal at 1200 */
  .cat_listings { padding: 0; }
  .cat_listings .buy_listing,
  .cat_listings .buy_listing--text-right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 48px 0;
    align-items: stretch;
    margin-bottom: 0;
  }
  .cat_listings .buy_listing__text {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .cat_listings .buy_listing__head {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 18px;
  }
  .cat_listings .buy_listing__title { font-size: 28px; line-height: 110%; }
  .cat_listings .buy_listing__ref { font-size: 14px; letter-spacing: 0.1em; }
  .cat_listings .buy_listing__desc { font-size: 16px; line-height: 130%; margin-bottom: 24px; max-width: 100%; }
  /* push foot (price + button) to bottom of column to align with photo */
  .cat_listings .buy_listing__specs {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 auto;
    padding: 0;
    border: 0;
  }
  .cat_listings .buy_listing__specs li,
  .cat_listings .buy_listing__specs li span,
  .cat_listings .buy_listing__specs li b { font-size: 14px; line-height: 140%; color: #3C3C3B; }
  .cat_listings .buy_listing__foot { gap: 24px; margin-top: 36px; }
  .cat_listings .buy_listing__price { font-size: 28px; gap: 6px; }
  .cat_listings .buy_listing__price em,
  .cat_listings .buy_listing__price b { font-size: 28px; }
  .cat_listings .buy_listing__btn { font-size: 14px; height: 50px; letter-spacing: 0.1em; }

  /* Photos fill grid cell height */
  .cat_listings .buy_listing__photo {
    aspect-ratio: auto;
    width: 100%;
    height: 100%;
    min-height: 400px;
  }
  .cat_listings .buy_listing__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Pager overlay */
  .cat_pager { left: 18px; right: 18px; bottom: 16px; }
  .cat_pager__line { margin: 0 12px; }
  .cat_pager__nav { gap: 12px; }
  .cat_pager__num { font-size: 22px; }
  .cat_pager__num i { font-size: 22px; }
  .cat_pager__arrow { width: 18px; height: 24px; }
  .cat_pager__arrow svg { width: 12px; height: 18px; }

  /* "Смотреть больше проектов" button */
  .cat_listings .buy_listings__more {
    width: calc(100% - 120px);
    height: 60px;
    font-size: 14px;
    letter-spacing: 0.1em;
    outline-offset: 16px;
    margin: 24px auto 70px;
  }

  /* CTA section */
  .cat_cta { padding: 70px 0; }
  .cat_cta__card { padding: 64px 30px; max-width: 800px; }
  .cat_cta__title { font-size: 50px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 24px; }
  .cat_cta__lead { font-size: 28px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 40px; max-width: 100%; }
  .cat_cta__btn { font-size: 22px; height: 60px; line-height: 140%; max-width: 580px; padding: 0 24px; margin-bottom: 24px; letter-spacing: 0.05em; }
  .cat_cta__micro { font-size: 16px; }
}

/* Pixel-perfect to Figma 768_Catalog (768x3177).
   Order: Hero -> Section Title -> Filters -> Listings -> CTA
   Filters keep 7 fields in single row (compact), listings stay horizontal */
@media (max-width: 768px) {
  .big_block_home.big_block_home--buy.big_block_home--catalog > .container,
  .cat_filters .container,
  .cat_title .container,
  .cat_listings .container,
  .cat_cta .container { padding: 0 20px; }

  /* HERO */
  .cat_hero { padding: 32px 0 0; }
  .cat_hero__breadcrumbs { font-size: 11px; gap: 6px; margin-bottom: 16px; }
  .cat_hero__title { font-size: 24px; line-height: 110%; letter-spacing: 0.02em; max-width: 100%; margin-bottom: 16px; }
  .cat_hero__title em { font-size: 24px; line-height: 110%; }
  .cat_hero__cta { font-size: 15px; height: 48px; line-height: 140%; padding: 0 16px; max-width: 480px; margin-bottom: 28px; letter-spacing: 0.05em; }
  .cat_hero__photo { aspect-ratio: 16 / 7; }

  /* SECTION TITLE — comes BEFORE filters at 768 */
  .cat_title { padding: 36px 0; margin-top: 0; }
  .cat_title h2 { font-size: 22px; line-height: 110%; max-width: 100%; }

  /* FILTERS — single row with 8 fields (compact) */
  .cat_filters {
    padding: 28px 0 24px;
    overflow: visible;
    position: relative;
    z-index: 50;
  }
  .cat_filters .buy_search__row {
    display: grid;
    grid-template-columns: 1fr 0.8fr 0.8fr 1fr 1fr 0.95fr 0.85fr;
    gap: 3px;
    padding: 0 0 16px;
    margin-bottom: 16px;
    row-gap: 0;
    overflow: visible;
  }
  .cat_filters .buy_search__field {
    height: 38px;
    padding: 0 5px;
    gap: 2px;
    overflow: visible;
  }
  .cat_filters .buy_search__field--price { padding: 0 5px; gap: 1px; }
  .cat_filters .buy_search__field select {
    font-size: 8.5px;
    padding-right: 7px;
    height: 24px;
    background-size: 6px 4px;
    text-overflow: ellipsis;
  }
  .cat_filters .buy_search__field > em { font-size: 9px; }
  .cat_filters .buy_search__bottom {
    flex-direction: row;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
  }
  .cat_filters .buy_search__more { font-size: 16px; gap: 8px; }
  .cat_filters .buy_search__more::after { width: 22px; height: 22px; background-size: 12px 12px; }
  .cat_filters .buy_search__submit {
    width: 160px; height: 40px; font-size: 12px; letter-spacing: 0.08em;
  }

  /* "Ещё параметры" panel at 768 */
  .cat_filters .buy_search__more-panel {
    margin: 0 0 16px;
  }
  .cat_filters .buy_search__more-content {
    padding: 16px 0 18px;
  }
  .cat_filters .buy_search__more-top {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    padding-bottom: 14px;
  }
  .cat_filters .buy_search__more-input { padding: 0 4px 6px; }
  .cat_filters .buy_search__more-input input { font-size: 12px; }
  .cat_filters .buy_search__more-input em { font-size: 12px; }
  .cat_filters .buy_search__more-toprow { gap: 16px; }
  .cat_filters .buy_search__more-grid {
    padding-top: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
  }
  .cat_filters .buy_chip { gap: 8px; }
  .cat_filters .buy_chip__dot { width: 12px; height: 12px; }
  .cat_filters .buy_chip__dot::after { width: 6px; height: 6px; }
  .cat_filters .buy_chip__label { font-size: 11px; line-height: 130%; }

  /* LISTINGS — keep horizontal at 768 */
  .cat_listings { padding: 0; }
  .cat_listings .buy_listing,
  .cat_listings .buy_listing--text-right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 28px 0;
    align-items: stretch;
    margin-bottom: 0;
  }
  .cat_listings .buy_listing--text-right .buy_listing__photo { order: 0; }
  .cat_listings .buy_listing__text {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .cat_listings .buy_listing__head {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 10px;
  }
  .cat_listings .buy_listing__title { font-size: 16px; line-height: 110%; }
  .cat_listings .buy_listing__ref { font-size: 9px; letter-spacing: 0.1em; }
  .cat_listings .buy_listing__desc { font-size: 11px; line-height: 130%; margin-bottom: 14px; max-width: 100%; }
  .cat_listings .buy_listing__specs {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0 0 auto;
    padding: 0;
    border: 0;
  }
  .cat_listings .buy_listing__specs li,
  .cat_listings .buy_listing__specs li span,
  .cat_listings .buy_listing__specs li b { font-size: 10px; line-height: 140%; color: #3C3C3B; }
  .cat_listings .buy_listing__foot { gap: 14px; margin-top: 18px; }
  .cat_listings .buy_listing__price { font-size: 16px; gap: 4px; }
  .cat_listings .buy_listing__price em,
  .cat_listings .buy_listing__price b { font-size: 16px; }
  .cat_listings .buy_listing__btn { font-size: 10px; height: 38px; letter-spacing: 0.08em; padding: 0 10px; }

  /* Photos fill grid cell height */
  .cat_listings .buy_listing__photo {
    aspect-ratio: auto;
    width: 100%;
    height: 100%;
    min-height: 240px;
  }
  .cat_listings .buy_listing__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Pager overlay */
  .cat_pager { left: 10px; right: 10px; bottom: 10px; }
  .cat_pager__line { margin: 0 8px; }
  .cat_pager__nav { gap: 8px; }
  .cat_pager__num { font-size: 14px; }
  .cat_pager__num i { font-size: 14px; }
  .cat_pager__arrow { width: 12px; height: 16px; }
  .cat_pager__arrow svg { width: 8px; height: 12px; }

  /* "Смотреть больше проектов" button */
  .cat_listings .buy_listings__more {
    width: calc(100% - 40px);
    height: 44px;
    font-size: 11px;
    letter-spacing: 0.08em;
    outline-offset: 10px;
    margin: 16px auto 40px;
  }

  /* CTA section */
  .cat_cta { padding: 50px 0; }
  .cat_cta__card { padding: 44px 24px 32px; max-width: 100%; }
  .cat_cta__title { font-size: 24px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 16px; }
  .cat_cta__lead { font-size: 14px; line-height: 130%; letter-spacing: 0.02em; margin-bottom: 28px; max-width: 100%; }
  .cat_cta__btn {
    font-size: 15px; height: 48px; line-height: 140%; max-width: 380px;
    padding: 0 16px; margin-bottom: 16px; letter-spacing: 0.05em;
  }
  .cat_cta__micro { font-size: 11px; }

  /* =========================================================
     MEGA MENU mobile layout fixes for catalog page at <=768px
     ========================================================= */
  /* Keep the LEFT burger (only menu access at <=768) but HIDE the lang-dropdown next to it
     so the top-left has only the burger icon — clean look matching the design. */
  .big_block_home--catalog header .about_block .top_header_group .menu_burger .lang-dropdown {
    display: none !important;
  }
  /* Float the burger button ABOVE the mega menu so user can see/click X to close.
     Without this, mega-menu (z-index:9999) covers the burger and there's no close button. */
  .big_block_home--catalog header .about_block .top_header_group .menu_burger {
    position: relative;
    z-index: 10001;
  }
  .big_block_home--catalog header .about_block .top_header_group .menu_burger .burger {
    position: relative;
    z-index: 10001;
  }
  /* Hide regular menu_group_main (with overlapping desktop layout) — only mob_menu shows */
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .menu_group_main:not(.mob_menu) {
    display: none !important;
  }
  /* Show mob_menu inside mega menu */
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .menu_group_main.mob_menu {
    display: block !important;
    order: 1;
    padding: 24px 0;
    border-bottom: 1px solid #E1E1E1;
    max-width: 100%;
  }
  /* bottom_menu_group: stack as mobile column with scroll */
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
  }
  /* The inner mega-menu .container inherits 0 96px padding from catalog.css base —
     at <=768 we need it narrower so the project cards have room to display. */
  .big_block_home--catalog header .about_block .mega-menu .container {
    padding: 0 20px;
  }
  /* mobile-stacked sections inside the mega menu — order, padding, no side borders */
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .our_projects {
    order: 2;
    padding: 28px 0;
    max-width: 100%;
    border: 0;
  }
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .contacts_group {
    order: 3;
    padding: 28px 0;
    max-width: 100%;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 1px solid #E1E1E1;
  }
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .top_projects {
    order: 4;
    padding: 28px 0;
    max-width: 100%;
    border: 0;
    border-top: 1px solid #E1E1E1;
  }
  /* Project cards at 768 — 2 columns */
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .our_projects .projects_group .project {
    grid-column: span 6;
    gap: 10px;
    max-width: 100%;
  }
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .contacts_group .telephone .group_number {
    flex-direction: row;
    gap: 24px;
  }
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .contacts_group .networks_group {
    margin-bottom: 24px;
  }
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .contacts_group .networks_group .networks a svg {
    width: 40px;
    height: 40px;
  }
  /* Ensure mega menu sits above page content so filter doesn't show through */
  .big_block_home--catalog header .about_block .mega-menu {
    z-index: 9999;
  }
  /* When the mega menu is OPEN, fully hide the catalog page sections so the
     filter form, listings and CTA cannot bleed through (e.g. in long-page
     screenshots or any rendering glitch where the mega menu doesn't fully
     cover the page). */
  body:has(.big_block_home--catalog .mega-menu.active) .cat_title,
  body:has(.big_block_home--catalog .mega-menu.active) .cat_filters,
  body:has(.big_block_home--catalog .mega-menu.active) .cat_listings,
  body:has(.big_block_home--catalog .mega-menu.active) .cat_cta,
  body:has(.big_block_home--catalog .mega-menu.active) footer {
    visibility: hidden !important;
  }
}

/* Pixel-perfect to Figma 360_Catalog (360x4116).
   Order: Hero -> Section Title -> Filters (2-col) -> Listings (stacked) -> CTA */
@media (max-width: 480px) {
  .big_block_home.big_block_home--buy.big_block_home--catalog > .container,
  .cat_filters .container,
  .cat_title .container,
  .cat_listings .container,
  .cat_cta .container { padding: 0 16px; }

  /* Mega menu inner container — narrower padding to fit projects/contacts at 360 */
  .big_block_home--catalog header .about_block .mega-menu .container {
    padding: 0 16px;
  }
  /* Project cards: 1 column at 360 (more room for image + text) */
  .big_block_home--catalog header .about_block .mega-menu .bottom_menu_group .our_projects .projects_group .project {
    grid-column: span 12;
    gap: 12px;
  }

  /* HERO */
  .cat_hero { padding: 24px 0 0; }
  .cat_hero__breadcrumbs { font-size: 11px; gap: 4px; margin-bottom: 14px; }
  .cat_hero__title { font-size: 26px; line-height: 110%; letter-spacing: 0.02em; max-width: 100%; margin-bottom: 16px; }
  .cat_hero__title em { font-size: 26px; line-height: 110%; }
  .cat_hero__cta {
    font-size: 13px; height: 44px; line-height: 130%;
    padding: 0 10px; max-width: 100%; margin-bottom: 24px;
    letter-spacing: 0.06em;
  }
  .cat_hero__photo { aspect-ratio: 4 / 3; }

  /* SECTION TITLE */
  .cat_title { padding: 28px 0; margin-top: 0; }
  .cat_title h2 { font-size: 20px; line-height: 115%; max-width: 100%; }

  /* FILTERS — 2 columns at 360 (8 fields → 4 rows × 2 cols) */
  .cat_filters {
    padding: 22px 0 18px;
    overflow: visible;
    position: relative;
    z-index: 50;
  }
  .cat_filters .buy_search__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 0 0 14px;
    margin-bottom: 14px;
    row-gap: 8px;
    overflow: visible;
  }
  .cat_filters .buy_search__field {
    height: 38px;
    padding: 0 10px;
    gap: 4px;
    overflow: visible;
  }
  .cat_filters .buy_search__field--price { padding: 0 10px; gap: 2px; }
  .cat_filters .buy_search__field select {
    font-size: 12px;
    padding-right: 10px;
    height: 26px;
    background-size: 7px 4px;
    text-overflow: ellipsis;
  }
  .cat_filters .buy_search__field > em { font-size: 12px; }
  .cat_filters .buy_search__bottom {
    flex-direction: column;
    gap: 14px;
    align-items: stretch;
  }
  .cat_filters .buy_search__more { font-size: 14px; gap: 8px; align-self: flex-start; }
  .cat_filters .buy_search__more::after { width: 22px; height: 22px; background-size: 12px 12px; }
  .cat_filters .buy_search__submit {
    width: 100%; height: 44px; font-size: 13px; letter-spacing: 0.08em;
  }

  /* "Ещё параметры" panel at 360 — single column chip grid */
  .cat_filters .buy_search__more-panel { margin: 0 0 14px; }
  .cat_filters .buy_search__more-content { padding: 14px 0 16px; }
  .cat_filters .buy_search__more-top {
    grid-template-columns: 1fr;
    gap: 14px;
    padding-bottom: 14px;
  }
  .cat_filters .buy_search__more-input { padding: 0 4px 6px; }
  .cat_filters .buy_search__more-input input { font-size: 12px; }
  .cat_filters .buy_search__more-input em { font-size: 12px; }
  .cat_filters .buy_search__more-toprow { gap: 12px; flex-wrap: wrap; }
  .cat_filters .buy_search__more-grid {
    padding-top: 12px;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .cat_filters .buy_chip { gap: 8px; }
  .cat_filters .buy_chip__dot { width: 12px; height: 12px; }
  .cat_filters .buy_chip__dot::after { width: 6px; height: 6px; }
  .cat_filters .buy_chip__label { font-size: 12px; line-height: 130%; }

  /* LISTINGS — stacked vertically at 360 */
  .cat_listings { padding: 0; }
  .cat_listings .buy_listing,
  .cat_listings .buy_listing--text-right {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 24px 0;
    align-items: stretch;
    margin-bottom: 0;
  }
  /* Photo on top for both layouts */
  .cat_listings .buy_listing--text-left .buy_listing__photo { order: 1; }
  .cat_listings .buy_listing--text-left .buy_listing__text { order: 2; }
  .cat_listings .buy_listing--text-right .buy_listing__photo { order: 1; }
  .cat_listings .buy_listing--text-right .buy_listing__text { order: 2; }
  .cat_listings .buy_listing__text {
    display: flex;
    flex-direction: column;
    height: auto;
  }

  .cat_listings .buy_listing__head {
    display: flex;
    flex-direction: column-reverse;
    gap: 4px;
    margin-bottom: 10px;
  }
  .cat_listings .buy_listing__title { font-size: 18px; line-height: 110%; }
  .cat_listings .buy_listing__ref { font-size: 9px; letter-spacing: 0.1em; }
  .cat_listings .buy_listing__desc { font-size: 12px; line-height: 130%; margin-bottom: 12px; max-width: 100%; }
  .cat_listings .buy_listing__specs {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0 0 12px;
    padding: 0;
    border: 0;
  }
  .cat_listings .buy_listing__specs li,
  .cat_listings .buy_listing__specs li span,
  .cat_listings .buy_listing__specs li b { font-size: 11px; line-height: 140%; color: #3C3C3B; }
  .cat_listings .buy_listing__foot { gap: 12px; margin-top: 4px; }
  .cat_listings .buy_listing__price { font-size: 18px; gap: 4px; }
  .cat_listings .buy_listing__price em,
  .cat_listings .buy_listing__price b { font-size: 18px; }
  .cat_listings .buy_listing__btn { font-size: 11px; height: 40px; letter-spacing: 0.08em; padding: 0 12px; }

  /* Photo aspect at 360 — landscape */
  .cat_listings .buy_listing__photo {
    aspect-ratio: 4 / 3;
    width: 100%;
    height: auto;
    min-height: 0;
  }
  .cat_listings .buy_listing__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Pager overlay */
  .cat_pager { left: 8px; right: 8px; bottom: 8px; }
  .cat_pager__line { margin: 0 6px; }
  .cat_pager__nav { gap: 6px; }
  .cat_pager__num { font-size: 12px; }
  .cat_pager__num i { font-size: 12px; }
  .cat_pager__arrow { width: 10px; height: 14px; }
  .cat_pager__arrow svg { width: 7px; height: 10px; }

  /* "Смотреть больше проектов" button */
  .cat_listings .buy_listings__more {
    width: calc(100% - 32px);
    height: 40px;
    font-size: 10px;
    letter-spacing: 0.06em;
    outline-offset: 8px;
    margin: 14px auto 32px;
  }

  /* CTA section */
  .cat_cta { padding: 36px 0; }
  .cat_cta__card { padding: 36px 18px 24px; max-width: 100%; }
  .cat_cta__title { font-size: 22px; line-height: 110%; letter-spacing: 0.02em; margin-bottom: 14px; }
  .cat_cta__lead { font-size: 12px; line-height: 130%; letter-spacing: 0.02em; margin-bottom: 22px; max-width: 100%; }
  .cat_cta__btn {
    font-size: 13px; height: 44px; line-height: 130%; max-width: 100%;
    padding: 0 10px; margin-bottom: 14px; letter-spacing: 0.06em;
  }
  .cat_cta__micro { font-size: 10px; }
}

/* =========================================================
   ANIMATION ENHANCEMENTS (catalog-animations.js)
   ========================================================= */

/* --- CTA parallax: fixed bg --- */
.cat_cta {
  background-attachment: fixed;
}
@supports (-webkit-touch-callout: none) {
  .cat_cta { background-attachment: scroll; }
}

/* Numbered pagination at the bottom of the listings (different from carousel cat_pager). */
.cat_pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin: 32px 0 16px;
}
.cat_pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
    text-decoration: none;
    color: #222;
    font-family: "Inter", system-ui, sans-serif;
    font-size: 14px;
    transition: background .2s, color .2s, border-color .2s;
}
.cat_pagination .page-numbers:hover {
    background: #3d4a4a;
    border-color: #3d4a4a;
    color: #fff;
}
.cat_pagination .page-numbers.current {
    background: #3d4a4a;
    border-color: #3d4a4a;
    color: #fff;
    cursor: default;
}
.cat_pagination .page-numbers.dots {
    border-color: transparent;
    cursor: default;
}
.cat_pagination .page-numbers.dots:hover {
    background: transparent;
    color: #222;
}

/* =========================================================
   COMPACT property card — 1 per row, horizontal layout.
   Replaces the old alternating full-width hero design on
   the catalog page only (buy.css / invest.css still use the
   big .buy_listing--text-right / --text-left variants).
   ========================================================= */
.cat_listings .container {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 0 96px;
  margin: 32px 0 0;
}
.buy_listing--compact {
  display: grid;
  grid-template-columns: minmax(280px, 360px) 1fr;
  gap: 28px;
  align-items: stretch;
  background: #fff;
  border: 1px solid #e7e7e7;
  border-radius: 6px;
  overflow: hidden;
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.buy_listing--compact:hover {
  box-shadow: 0 6px 22px rgba(20, 30, 40, 0.08);
  border-color: #d2d2d2;
}
.buy_listing--compact .buy_listing__photo {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #f4f4f4;
}
.buy_listing--compact .buy_listing__slides {
  position: absolute;
  inset: 0;
  isolation: isolate;
}
.buy_listing--compact .buy_listing__slide {
  position: absolute;
  inset: 0;
  display: block;
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  transition: opacity .42s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
}
.buy_listing--compact .buy_listing__slide.is-active {
  opacity: 1;
  z-index: 1;
  pointer-events: auto;
}
.buy_listing--compact .buy_listing__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform .6s ease;
  backface-visibility: hidden;
  transform: translateZ(0);
}
.buy_listing--compact:hover .buy_listing__slide.is-active .buy_listing__img {
  transform: scale(1.04);
}

/* Carousel arrows on the card image */
.buy_listing--compact .buy_listing__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.88);
  color: #1a1a1a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity .25s ease, background .2s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}
.buy_listing--compact:hover .buy_listing__nav,
.buy_listing--compact:focus-within .buy_listing__nav {
  opacity: 1;
}
.buy_listing--compact .buy_listing__nav:hover { background: #fff; }
.buy_listing--compact .buy_listing__nav--prev { left: 10px; }
.buy_listing--compact .buy_listing__nav--next { right: 10px; }

.buy_listing--compact .buy_listing__counter {
  position: absolute;
  left: 12px;
  bottom: 12px;
  z-index: 3;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.04em;
  pointer-events: none;
}

.buy_listing--compact .buy_listing__desc {
  margin: 2px 0 4px;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.55;
  color: #5a5a5a;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

@media (hover: none) {
  .buy_listing--compact .buy_listing__nav { opacity: 1; }
}
.buy_listing--compact .buy_listing__body {
  display: flex;
  flex-direction: column;
  padding: 22px 28px 22px 0;
  gap: 10px;
  min-width: 0;
}
.buy_listing--compact .buy_listing__title {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-weight: 400;
  font-size: clamp(20px, 1.5vw + 6px, 28px);
  line-height: 1.15;
  letter-spacing: 0.01em;
  color: #1a1a1a;
  margin: 0;
}
.buy_listing--compact .buy_listing__title a {
  color: inherit;
  text-decoration: none;
}
.buy_listing--compact .buy_listing__title a:hover {
  color: #3d4a4a;
}
.buy_listing--compact .buy_listing__ref {
  display: inline-block;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: #888;
  text-transform: uppercase;
}
.buy_listing--compact .buy_listing__specs {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 18px 28px;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 13px;
  color: #444;
}
.buy_listing--compact .buy_listing__specs li {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.buy_listing--compact .buy_listing__specs span {
  color: #8a8a8a;
  text-transform: capitalize;
}
.buy_listing--compact .buy_listing__specs b {
  color: #1a1a1a;
  font-weight: 500;
}
.buy_listing--compact .buy_listing__foot {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 14px;
  border-top: 1px solid #ececec;
}
.buy_listing--compact .buy_listing__price {
  font-family: "Felidae", "Cormorant Garamond", serif;
  font-size: clamp(22px, 1.5vw + 8px, 30px);
  color: #1a1a1a;
  line-height: 1;
}
.buy_listing--compact .buy_listing__price em {
  font-style: normal;
  margin-right: 4px;
  color: #3d4a4a;
}
.buy_listing--compact .buy_listing__btn {
  font-family: "Inter", system-ui, sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #1a1a1a;
  text-decoration: none;
  padding: 10px 22px;
  border: 1px solid #1a1a1a;
  border-radius: 2px;
  transition: background .2s, color .2s;
}
.buy_listing--compact .buy_listing__btn:hover {
  background: #1a1a1a;
  color: #fff;
}

/* Tablet */
@media (max-width: 900px) {
  .cat_listings .container { padding: 0 24px; }
  .buy_listing--compact {
    grid-template-columns: minmax(180px, 240px) 1fr;
    gap: 18px;
  }
  .buy_listing--compact .buy_listing__body {
    padding: 16px 18px 16px 0;
  }
}

/* Mobile — stack image on top, body below */
@media (max-width: 600px) {
  .cat_listings .container { padding: 0 16px; }
  .buy_listing--compact {
    grid-template-columns: 1fr;
  }
  .buy_listing--compact .buy_listing__photo { aspect-ratio: 16 / 10; }
  .buy_listing--compact .buy_listing__body {
    padding: 18px 18px 20px;
  }
}

/* =========================================================
   CATALOG — Fluid design tokens
   These scale smoothly between mobile and large desktop
   (no breakpoint "jumps"). Override locally if needed.
   ========================================================= */
:root {
    /* Container side padding: 16px on phones → 96px on 1920+ */
    --cat-pad-x: clamp(16px, 5vw, 96px);

    /* Vertical rhythm between sections */
    --cat-gap-card: clamp(12px, 1.4vw, 20px);
    --cat-gap-section: clamp(24px, 4vw, 64px);

    /* Card internal spacing */
    --cat-card-pad-y: clamp(16px, 1.8vw, 26px);
    --cat-card-pad-x: clamp(16px, 2vw, 32px);

    /* Card image side width (auto adapts but capped) */
    --cat-card-img-w: clamp(320px, 44vw, 720px);

    /* Typography */
    --cat-title:  clamp(18px, 1.2vw + 8px, 28px);
    --cat-price:  clamp(20px, 1.3vw + 10px, 30px);
    --cat-body:   clamp(12px, 0.3vw + 11px, 14px);
    --cat-micro:  clamp(10px, 0.2vw + 9px, 12px);
}

/* Apply fluid tokens to the compact card layout. */
.cat_listings .container {
    padding: 0 var(--cat-pad-x);
    gap: var(--cat-gap-card);
    margin-top: var(--cat-gap-section);
}
.buy_listing--compact {
    grid-template-columns: var(--cat-card-img-w) 1fr;
    gap: clamp(16px, 2vw, 28px);
}
.buy_listing--compact .buy_listing__body {
    padding: var(--cat-card-pad-y) var(--cat-card-pad-x) var(--cat-card-pad-y) 0;
}
.buy_listing--compact .buy_listing__title {
    font-size: var(--cat-title);
}
.buy_listing--compact .buy_listing__desc {
    font-size: var(--cat-body);
}
.buy_listing--compact .buy_listing__specs {
    font-size: var(--cat-body);
}
.buy_listing--compact .buy_listing__price {
    font-size: var(--cat-price);
}
.buy_listing--compact .buy_listing__ref,
.buy_listing--compact .buy_listing__btn {
    font-size: var(--cat-micro);
}

/* Mobile: stack image on top, full-width body below */
@media (max-width: 600px) {
    .buy_listing--compact {
        grid-template-columns: 1fr;
    }
    .buy_listing--compact .buy_listing__photo {
        aspect-ratio: 16 / 10;
    }
    .buy_listing--compact .buy_listing__body {
        padding: var(--cat-card-pad-y) var(--cat-card-pad-x);
    }
}

/* =========================================================
   Property count label + bottom pager row + mobile fixes
   ========================================================= */
.cat_count {
    font-family: "Inter", system-ui, sans-serif;
    font-size: var(--cat-body, 14px);
    color: #6b6b6b;
    letter-spacing: 0.01em;
    padding: 0 var(--cat-pad-x);
}
.cat_count--top {
    margin: 16px 0 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
}
.cat_pagination--top { margin: 0; }
.cat_pager-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    padding: 0 var(--cat-pad-x);
    margin: 32px 0 64px;
}
.cat_pager-row .cat_count__text { flex: 0 0 auto; }
.cat_pager-row .cat_pagination { margin: 0; }
.cat_quick-filters {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 18px var(--cat-pad-x) 24px;
    margin: 0;
}
.cat_quick-filters__label {
    flex: 0 0 auto;
    font-family: "Felidae", "Cormorant Garamond", serif;
    font-size: 24px;
    line-height: 1;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #010101;
    padding-top: 10px;
}
.cat_quick-filters__row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
.cat_quick-filters__chip,
.cat_quick-filters__reset {
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid #D8D8D8;
    background: #FFFFFF;
    color: #3C3C3B;
    font-family: "Inter", sans-serif;
    font-size: 13px;
    line-height: 1.2;
    letter-spacing: 0.04em;
    transition: border-color .2s ease, background .2s ease, color .2s ease;
    cursor: pointer;
}
.cat_quick-filters__chip:hover,
.cat_quick-filters__reset:hover:not(:disabled) {
    border-color: #41545C;
    color: #010101;
}
.cat_quick-filters__chip.is-active {
    background: #41545C;
    border-color: #41545C;
    color: #FFFFFF;
}
.cat_quick-filters__reset {
    color: #41545C;
}
.cat_quick-filters__reset:disabled {
    opacity: .45;
    cursor: default;
}
.cat_sort-bar {
    display: flex;
    justify-content: flex-end;
    padding: 0 var(--cat-pad-x) 8px;
    margin: 0;
}
.cat_sort__field {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: "Inter", sans-serif;
}
.cat_sort__label {
    color: #5F6A70;
    font-size: 13px;
    line-height: 1.2;
    letter-spacing: 0.04em;
}
.cat_sort__field select {
    min-width: 220px;
    min-height: 44px;
    padding: 10px 42px 10px 14px;
    border: 1px solid #D8D8D8;
    background-color: #FFFFFF;
    color: #3C3C3B;
    font-family: "Inter", sans-serif;
    font-size: 13px;
    line-height: 1.2;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'><path d='M1 1L5 5L9 1' stroke='%2341545C' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 14px center;
    cursor: pointer;
}
.cat_sort__field select:focus {
    outline: none;
    border-color: #41545C;
}

@media (max-width: 980px) {
    .cat_quick-filters {
        flex-direction: column;
        gap: 14px;
    }
    .cat_quick-filters__label {
        padding-top: 0;
    }
    .cat_sort-bar {
        justify-content: flex-start;
        padding-bottom: 4px;
    }
    .cat_sort__field {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .cat_sort__field select {
        width: 100%;
    }
}

/* Mobile (≤640px) — clean, symmetrical, no circle button */
@media (max-width: 640px) {
    .cat_count--top { margin: 8px 0 4px; }
    .cat_pager-row {
        flex-direction: column;
        gap: 10px;
        margin: 18px 0 32px;
        text-align: center;
    }
    .cat_quick-filters {
        gap: 12px;
        padding-top: 14px;
        padding-bottom: 18px;
    }
    .cat_quick-filters__label {
        font-size: 18px;
    }
    .cat_quick-filters__row {
        gap: 8px;
    }
    .cat_quick-filters__chip,
    .cat_quick-filters__reset {
        min-height: 38px;
        padding: 8px 12px;
        font-size: 11px;
    }
    .cat_sort-bar {
        padding-bottom: 0;
    }
    .cat_sort__label {
        font-size: 11px;
    }
    .cat_sort__field select {
        min-width: 0;
        min-height: 38px;
        padding: 8px 34px 8px 12px;
        font-size: 11px;
        background-position: right 12px center;
    }

    .buy_listing--compact {
        grid-template-columns: 1fr;
        gap: 0;
        border-radius: 6px;
    }
    .buy_listing--compact .buy_listing__photo {
        aspect-ratio: 16 / 10;
        border-radius: 6px 6px 0 0;
    }
    .buy_listing--compact .buy_listing__body {
        padding: 14px 16px 18px;
        gap: 6px;
        text-align: left;
    }
    .buy_listing--compact .buy_listing__title {
        text-align: left;
        font-size: clamp(17px, 4vw + 4px, 22px);
        margin-bottom: 2px;
    }
    .buy_listing--compact .buy_listing__ref {
        font-size: 10px;
    }
    .buy_listing--compact .buy_listing__desc {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 13px;
        line-height: 1.5;
        margin: 4px 0 6px;
        color: #555;
    }
    .buy_listing--compact .buy_listing__specs {
        gap: 6px 18px;
        font-size: 12px;
    }
    .buy_listing--compact .buy_listing__foot {
        margin-top: 8px;
        padding-top: 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        border-top: 1px solid #ececec;
    }
    .buy_listing--compact .buy_listing__price {
        font-size: clamp(18px, 4vw + 2px, 24px);
    }
    /* Mobile button — keep it as a proper text button, NOT a circle.
       Overrides the .buy_listings__more / global circle styles. */
    .buy_listing--compact .buy_listing__btn {
        height: auto;
        width: auto;
        min-width: 0;
        padding: 8px 16px;
        font-size: 11px;
        letter-spacing: 0.08em;
        border-radius: 2px;
        background: transparent;
        color: #1a1a1a;
        border: 1px solid #1a1a1a;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
    }
    /* Show carousel arrows on mobile too */
    .buy_listing--compact .buy_listing__nav {
        opacity: 1;
        width: 32px;
        height: 32px;
    }
    .buy_listing--compact .buy_listing__counter {
        font-size: 10px;
        padding: 3px 8px;
    }
}

/* =========================================================
   HIGH-SPECIFICITY OVERRIDES — must come last in this file.
   Wins over any later-loaded buy.css / style.css rules that
   target the legacy .buy_listing (alternating hero) layout.
   ========================================================= */
.cat_listings .buy_listing.buy_listing--compact {
    display: grid !important;
    grid-template-columns: var(--cat-card-img-w, clamp(220px, 30vw, 380px)) 1fr !important;
    grid-template-areas: "photo body" !important;
    gap: clamp(16px, 2vw, 28px) !important;
    align-items: stretch !important;
    background: #fff !important;
    border: 1px solid #e7e7e7 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    text-align: left !important;
    aspect-ratio: auto !important;
}
.cat_listings .buy_listing--compact .buy_listing__photo {
    grid-area: photo !important;
    position: relative !important;
    aspect-ratio: 16 / 10 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
}
.cat_listings .buy_listing--compact .buy_listing__body {
    grid-area: body !important;
    display: flex !important;
    flex-direction: column !important;
    padding: var(--cat-card-pad-y, 22px) var(--cat-card-pad-x, 28px) var(--cat-card-pad-y, 22px) 0 !important;
    gap: 10px !important;
    min-width: 0 !important;
    text-align: left !important;
}
.cat_listings .buy_listing--compact .buy_listing__title {
    font-family: "Felidae", "Cormorant Garamond", serif !important;
    font-weight: 400 !important;
    font-size: var(--cat-title, clamp(20px, 1.5vw + 6px, 28px)) !important;
    line-height: 1.15 !important;
    text-align: left !important;
    margin: 0 !important;
    text-transform: none !important;
}
.cat_listings .buy_listing--compact .buy_listing__title a {
    color: inherit !important;
    text-decoration: none !important;
}
.cat_listings .buy_listing--compact .buy_listing__desc {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    margin: 2px 0 4px !important;
    font-family: "Inter", system-ui, sans-serif !important;
    font-size: var(--cat-body, 13px) !important;
    line-height: 1.55 !important;
    color: #5a5a5a !important;
    text-align: left !important;
}
.cat_listings .buy_listing--compact .buy_listing__specs {
    list-style: none !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 24px !important;
    font-family: "Inter", system-ui, sans-serif !important;
    font-size: var(--cat-body, 13px) !important;
    color: #444 !important;
    border-bottom: 0 !important;
}
.cat_listings .buy_listing--compact .buy_listing__specs li {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}
.cat_listings .buy_listing--compact .buy_listing__foot {
    margin-top: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding-top: 14px !important;
    border-top: 1px solid #ececec !important;
    border-bottom: 0 !important;
}
.cat_listings .buy_listing--compact .buy_listing__btn {
    height: auto !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 10px 22px !important;
    font-family: "Inter", system-ui, sans-serif !important;
    font-size: var(--cat-micro, 12px) !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #1a1a1a !important;
    text-decoration: none !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 2px !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.cat_listings .buy_listing--compact .buy_listing__btn:hover {
    background: #1a1a1a !important;
    color: #fff !important;
}
.cat_listings .buy_listing--compact .buy_listing__nav {
    z-index: 5 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}
.cat_listings .buy_listing--compact .buy_listing__nav > * {
    pointer-events: none !important;
}

/* Mobile overrides — keep horizontal-ish but stack image on top */
@media (max-width: 640px) {
    .cat_listings .buy_listing.buy_listing--compact {
        grid-template-columns: 1fr !important;
        grid-template-areas: "photo" "body" !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__body {
        padding: 14px 16px 18px !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__nav {
        opacity: 1 !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__btn {
        padding: 8px 16px !important;
        font-size: 11px !important;
    }
    /* Specs row: 3 equidistant cells, label + value on the SAME line */
    .cat_listings .buy_listing--compact .buy_listing__specs {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 6px !important;
        margin: 12px 0 0 !important;
        padding: 12px 0 0 !important;
        border-top: 1px solid #ececec !important;
        font-size: 14px !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__specs li {
        flex: 1 1 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: baseline !important;
        justify-content: center !important;
        gap: 6px !important;
        text-align: center !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__specs li span {
        font-size: 13px !important;
        color: #8a8a8a !important;
        text-transform: capitalize !important;
        letter-spacing: 0.02em !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__specs li b {
        font-size: 15px !important;
        font-weight: 600 !important;
        color: #1a1a1a !important;
    }
    /* Foot: price pushed down, larger, more breathing room from card edge */
    .cat_listings .buy_listing--compact .buy_listing__foot {
        margin-top: auto !important;
        border-top: 0 !important;
        padding-top: 18px !important;
        padding-bottom: 6px !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__price {
        font-size: clamp(24px, 6.5vw + 2px, 32px) !important;
        line-height: 1 !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__price em {
        font-size: 0.78em !important;
        margin-right: 6px !important;
    }
    /* Extra bottom space inside the card body on mobile */
    .cat_listings .buy_listing--compact .buy_listing__body {
        padding-bottom: 22px !important;
    }
}

/* Bottom spacing: keep the catalog section away from the CTA below */
.cat_listings { padding-bottom: clamp(40px, 6vw, 96px); }
.cat_pager-row { margin-bottom: clamp(24px, 4vw, 56px) !important; }

/* Desktop: card image takes ~44% of card width, slightly taller aspect.
   On mobile we keep the 16:10 stacked-top look. */
@media (min-width: 901px) {
    .cat_listings .buy_listing--compact .buy_listing__photo {
        aspect-ratio: 4 / 3 !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__body {
        padding: clamp(20px, 2vw, 36px) clamp(24px, 2.5vw, 44px) clamp(20px, 2vw, 36px) clamp(8px, 1vw, 16px) !important;
    }
}

/* =========================================================
   FINAL UNIVERSAL OVERRIDES — apply at every viewport.
   These must be the last block in this file.
   ========================================================= */

/* Specs always in a single horizontal row, label + value inline */
.cat_listings .buy_listing--compact .buy_listing__specs,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__specs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 14px 0 0 !important;
    padding: 14px 0 0 !important;
    border-top: 1px solid #ececec !important;
    border-bottom: 0 !important;
    list-style: none !important;
}
.cat_listings .buy_listing--compact .buy_listing__specs li,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__specs li {
    flex: 1 1 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 6px !important;
    text-align: center !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    line-height: 1.2 !important;
}
.cat_listings .buy_listing--compact .buy_listing__specs li span {
    font-size: 13px !important;
    color: #8a8a8a !important;
    text-transform: capitalize !important;
    letter-spacing: 0.02em !important;
    line-height: 1 !important;
}
.cat_listings .buy_listing--compact .buy_listing__specs li b {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    line-height: 1 !important;
}

/* Price: € is small, the number is the dominant element */
.cat_listings .buy_listing--compact .buy_listing__price {
    font-family: "Felidae", "Cormorant Garamond", serif !important;
    font-size: clamp(22px, 1.4vw + 10px, 30px) !important;
    line-height: 1 !important;
    color: #1a1a1a !important;
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 4px !important;
}
.cat_listings .buy_listing--compact .buy_listing__price em {
    font-size: 0.6em !important;
    color: #3d4a4a !important;
    font-style: normal !important;
    margin: 0 0 0 2px !important;
}
.cat_listings .buy_listing--compact .buy_listing__price b {
    font-weight: 400 !important;
    font-size: inherit !important;
}

/* Carousel arrows always visible (no hover required) and clickable */
.cat_listings .buy_listing--compact .buy_listing__nav {
    opacity: 1 !important;
    z-index: 10 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    background: rgba(255, 255, 255, 0.92) !important;
}
.cat_listings .buy_listing--compact .buy_listing__nav > * {
    pointer-events: none !important;
}

/* Mobile: bigger price, larger arrow tap target */
@media (max-width: 640px) {
    .cat_listings .buy_listing--compact .buy_listing__price {
        font-size: clamp(28px, 7vw, 38px) !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__foot {
        padding-top: 22px !important;
        padding-bottom: 10px !important;
        margin-top: auto !important;
        border-top: 0 !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__body {
        padding-bottom: 24px !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__nav {
        width: 44px !important;
        height: 44px !important;
    }
}

/* Top-row count + pagination layout */
.cat_count.cat_count--top {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    text-align: center !important;
    margin: 16px 0 18px !important;
}
.cat_pagination--top { margin: 0 !important; }

/* Empty pagination nav: don't reserve space so the count sits flush. */
.cat_pagination:empty { display: none !important; }

/* Slide placeholder (lazy-load stub): fills the slide area until the user
   navigates to it, at which point JS swaps it for a real <img>. */
.buy_listing__slide-stub {
    display: block;
    width: 100%;
    height: 100%;
    background: #f4f4f4;
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* CONFLICT FIX — the legacy `.cat_listings .buy_listing__nav` rule (originally
   for a Swiper-style navigation strip) sets position:static, gap:18px and other
   layout that breaks our individual prev/next buttons. We need !important on
   every conflicting property because the legacy rule has equal specificity. */
.cat_listings .buy_listing--compact .buy_listing__nav,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__nav {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 20 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #1a1a1a !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.18) !important;
}
.cat_listings .buy_listing--compact .buy_listing__nav--prev,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__nav--prev {
    left: 10px !important;
    right: auto !important;
}
.cat_listings .buy_listing--compact .buy_listing__nav--next,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__nav--next {
    right: 10px !important;
    left: auto !important;
}
.cat_listings .buy_listing--compact .buy_listing__nav > * {
    pointer-events: none !important;
}

/* Mobile: bigger tap target + ensure pagination visible */
@media (max-width: 768px) {
    .cat_listings .buy_listing--compact .buy_listing__nav,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__nav {
        width: 44px !important;
        height: 44px !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__nav svg {
        width: 14px !important;
        height: 20px !important;
    }
    .cat_pagination,
    .cat_pagination--top {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 6px !important;
    }
    .cat_pagination .page-numbers {
        min-width: 36px !important;
        height: 36px !important;
        padding: 0 10px !important;
        font-size: 13px !important;
    }
}

/* =========================================================
   MOBILE FILTERS — override the legacy buy.css rules that
   were hiding `type` / `subtypes` / `zones` (nth-child 4-6)
   because that mobile layout was designed for the buy page,
   not the catalog. The catalog needs ALL 7 filters visible.
   ========================================================= */
@media (max-width: 767px) {
    .cat_filters .buy_search__row {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }
    .cat_filters .buy_search__row .buy_search__field,
    .cat_filters .buy_search__row .buy_search__field:nth-child(1),
    .cat_filters .buy_search__row .buy_search__field:nth-child(2),
    .cat_filters .buy_search__row .buy_search__field:nth-child(3),
    .cat_filters .buy_search__row .buy_search__field:nth-child(4),
    .cat_filters .buy_search__row .buy_search__field:nth-child(5),
    .cat_filters .buy_search__row .buy_search__field:nth-child(6),
    .cat_filters .buy_search__row .buy_search__field:nth-child(7),
    .cat_filters .buy_search__row .buy_search__field:nth-child(8) {
        display: flex !important;
        order: initial !important;
    }
    /* Restore the submit button (buy.css hides it on mobile) */
    .cat_filters .buy_search__bottom .buy_search__submit {
        display: inline-flex !important;
    }
}

/* =========================================================
   Catalog filters visual refresh.
   Aesthetic-only override for the catalog form: cleaner shell,
   more premium fields, softer chips, and stronger CTA.
   ========================================================= */
.cat_filters {
    --cf-ink: #233138;
    --cf-ink-soft: #5f6c72;
    --cf-muted: #a9afb3;
    --cf-border: rgba(35, 49, 56, 0.12);
    --cf-border-strong: rgba(65, 84, 92, 0.28);
    --cf-surface: #ffffff;
    --cf-surface-2: #ffffff;
    --cf-shadow: 0 20px 52px rgba(24, 33, 38, 0.08);
    --cf-shadow-soft: 0 10px 24px rgba(24, 33, 38, 0.05);
}

.cat_filters .buy_search__form {
    position: relative;
    width: 100%;
    padding: clamp(18px, 2.2vw, 32px);
    border: 1px solid rgba(35, 49, 56, 0.08);
    border-radius: 30px;
    background: #ffffff;
    box-shadow: var(--cf-shadow);
    overflow: visible;
}

.cat_filters .buy_search__row {
    gap: 14px;
    padding: 0 0 22px;
    margin-bottom: 22px;
}

.cat_filters .buy_search__field {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    height: 64px;
    padding: 0 18px;
    border: 1px solid var(--cf-border);
    border-radius: 18px;
    background: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.85),
        0 8px 20px rgba(24, 33, 38, 0.04);
    transition: none;
}

.cat_filters .buy_search__field:hover,
.cat_filters .buy_search__field:focus-within {
    border-color: var(--cf-border-strong);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 14px 28px rgba(24, 33, 38, 0.08);
    transform: none;
}

.cat_filters .buy_search__field--price {
    padding-right: 16px;
}

.cat_filters .buy_search__field > em {
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 15px;
    color: var(--cf-ink);
    opacity: 0.86;
}

.cat_filters .buy_search__field select,
.cat_filters .buy_search__field .lux-select,
.cat_filters .buy_search__field .lux-select__trigger {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: clamp(15px, 0.95vw, 18px);
    line-height: 1.2;
    color: var(--cf-ink);
}

.cat_filters .buy_search__field select {
    height: 100%;
    padding-right: 26px;
    color: var(--cf-muted);
    background-size: 12px 7px;
    background-position: right 2px center;
}

.cat_filters .buy_search__field:focus-within select,
.cat_filters .buy_search__field select:not([data-empty]):valid {
    color: var(--cf-ink);
}

.cat_filters .buy_search__field .lux-select {
    min-height: 100%;
    height: 100%;
}

.cat_filters .buy_search__field .lux-select__trigger {
    min-height: 100%;
    padding: 0 28px 0 0;
}

.cat_filters .buy_search__field .lux-select__value {
    color: var(--cf-ink);
}

.cat_filters .buy_search__field .lux-select__value.is-placeholder {
    color: var(--cf-muted);
}

.cat_filters .buy_search__field .lux-select__arrow {
    right: 2px;
    width: 14px;
    height: 10px;
    opacity: 0.84;
    background-size: 14px 10px;
    transition: none;
}

.cat_filters .buy_search__field .lux-select__menu {
    top: calc(100% + 10px);
    left: 0;
    width: 100%;
    min-width: 100%;
    border: 1px solid rgba(35, 49, 56, 0.1);
    border-radius: 18px;
    padding: 8px;
    background: #ffffff;
    box-shadow: 0 24px 52px rgba(24, 33, 38, 0.13);
    transition: none;
}

.cat_filters .buy_search__field .lux-select__option {
    padding: 12px 16px;
    border-radius: 12px;
    transition: none;
}

.cat_filters .buy_search__field .lux-select__option::before {
    left: 12px;
}

.cat_filters .buy_search__field .lux-select__option:hover {
    background: #f5f1ea;
}

.cat_filters .buy_search__field .lux-select__option.is-active {
    background: #eef1f2;
}

.cat_filters .buy_search__more-panel {
    margin: 0 0 24px;
    border: 1px solid rgba(35, 49, 56, 0.08);
    border-radius: 24px;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: none !important;
    will-change: auto;
}

.cat_filters .buy_search__more-content {
    padding: 22px 24px 26px;
}

.cat_filters .buy_search__more-top {
    gap: 16px 18px;
    padding-bottom: 16px;
}

.cat_filters .buy_search__more-input {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 60px;
    padding: 0 18px;
    border: 1px solid var(--cf-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.85),
        0 8px 20px rgba(24, 33, 38, 0.04);
}

.cat_filters .buy_search__more-input input {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: var(--cf-ink);
}

.cat_filters .buy_search__more-input input::placeholder {
    color: var(--cf-muted);
}

.cat_filters .buy_search__more-input em {
    font-size: 18px;
    color: var(--cf-ink);
    opacity: 0.86;
}

.cat_filters .buy_search__more-toprow {
    gap: 12px;
    flex-wrap: wrap;
}

.cat_filters .buy_search__more-toprow {
    display: none;
}

.cat_filters .buy_search__more-grid {
    padding-top: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.cat_filters .buy_chip {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 54px;
    padding: 14px 16px;
    border: 1px solid var(--cf-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: var(--cf-shadow-soft);
    opacity: 1;
    transform: none;
    transition: none;
}

.cat_filters .buy_chip:hover {
    border-color: var(--cf-border-strong);
    background: #ffffff;
    box-shadow: 0 14px 28px rgba(24, 33, 38, 0.08);
    transform: none;
}

.cat_filters .buy_chip__dot {
    width: 18px;
    height: 18px;
    border: 1px solid rgba(65, 84, 92, 0.34);
    background: #ffffff;
}

.cat_filters .buy_chip__dot::after {
    width: 8px;
    height: 8px;
    background: #41545C;
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.45);
    transition: none;
}

.cat_filters .buy_chip__input:checked ~ .buy_chip__dot {
    border-color: #41545C;
    background: rgba(65, 84, 92, 0.1);
}

.cat_filters .buy_chip__input:checked ~ .buy_chip__dot::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

.cat_filters .buy_chip__label {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.35;
    color: #2c393f;
}

.cat_filters .buy_chip__input:checked ~ .buy_chip__label {
    color: #162228;
}

.cat_filters .buy_search__more-panel.is-open .buy_chip {
    transition-delay: 0ms;
}

.cat_filters .buy_search__bottom {
    gap: 18px;
    align-items: center;
}

.cat_filters .buy_search__more {
    gap: 12px;
    font-size: 22px;
    color: var(--cf-ink-soft);
    transition: none;
}

.cat_filters .buy_search__more:hover,
.cat_filters .buy_search__more.is-open {
    color: var(--cf-ink);
}

.cat_filters .buy_search__more::after {
    width: 38px;
    height: 38px;
    border-color: rgba(65, 84, 92, 0.24);
    background-color: #ffffff;
    box-shadow: 0 10px 20px rgba(24, 33, 38, 0.08);
    transition: none;
}

.cat_filters .buy_search__more:hover::after,
.cat_filters .buy_search__more.is-open::after {
    border-color: rgba(65, 84, 92, 0.36);
    background-color: #ffffff;
    box-shadow: 0 14px 28px rgba(24, 33, 38, 0.1);
}

.cat_filters .buy_search__submit {
    width: min(100%, 280px);
    height: 60px;
    border: 1px solid rgba(35, 49, 56, 0.12);
    border-radius: 999px;
    background: linear-gradient(135deg, #42555d 0%, #2c3b42 100%);
    box-shadow:
        0 18px 34px rgba(28, 41, 48, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.14);
    font-size: 18px;
    letter-spacing: 0.18em;
    transition: none;
}

.cat_filters .buy_search__submit:hover {
    background: linear-gradient(135deg, #4d636c 0%, #32434a 100%);
    transform: none;
    box-shadow:
        0 22px 38px rgba(28, 41, 48, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.cat_filters .anim-fade-up,
.cat_filters .anim-fade-left,
.cat_filters .anim-fade-right,
.cat_filters .anim-scale,
.cat_filters .buy_search__form,
.cat_filters .buy_search__field,
.cat_filters .buy_search__more,
.cat_filters .buy_search__submit {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
}

@media (max-width: 767px) {
    /*
     * Catalogue content is already useful without entrance motion. Static
     * anim-* classes used to move the hero/filter stack after first paint and
     * produced a large mobile layout shift.
     */
    body.is-catalog-page .anim-fade-up,
    body.is-catalog-page .anim-fade-left,
    body.is-catalog-page .anim-fade-right,
    body.is-catalog-page .anim-scale,
    body.is-catalog-page .anim-wipe {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }

    .cat_filters {
        padding: 28px 0 30px;
    }

    .cat_filters .buy_search__form {
        padding: 16px;
        border-radius: 24px;
    }

    .cat_filters .buy_search__row {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
        padding-bottom: 12px;
        margin-bottom: 16px;
    }

    .cat_filters .buy_search__field {
        height: 58px;
        padding: 0 16px;
        border-radius: 16px;
    }

    .cat_filters .buy_search__field select,
    .cat_filters .buy_search__field .lux-select,
    .cat_filters .buy_search__field .lux-select__trigger {
        font-size: 16px !important;
    }

    .cat_filters .buy_search__field > em {
        font-size: 14px !important;
    }

    .cat_filters .buy_search__field .lux-select__menu {
        border-radius: 16px;
        padding: 6px;
    }

    .cat_filters .buy_search__more-panel {
        margin-bottom: 18px;
        border-radius: 20px;
    }

    .cat_filters .buy_search__more-content {
        padding: 16px;
    }

    .cat_filters .buy_search__more-top {
        grid-template-columns: 1fr;
        gap: 12px;
        padding-bottom: 12px;
    }

    .cat_filters .buy_search__more-toprow {
        gap: 10px;
        padding-bottom: 2px;
    }

    .cat_filters .buy_search__more-grid {
        grid-template-columns: 1fr;
        gap: 10px;
        padding-top: 12px;
    }

    .cat_filters .buy_search__more-input {
        min-height: 56px;
        padding: 0 16px;
        border-radius: 14px;
    }

    .cat_filters .buy_search__more-input input,
    .cat_filters .buy_search__more-input em {
        font-size: 15px;
    }

    .cat_filters .buy_chip {
        min-height: 50px;
        padding: 13px 14px;
        border-radius: 14px;
    }

    .cat_filters .buy_chip__label {
        font-size: 15px !important;
    }

    .cat_filters .buy_search__bottom {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .cat_filters .buy_search__more {
        width: 100%;
        justify-content: space-between;
        font-size: 18px;
    }

    .cat_filters .buy_search__submit {
        width: 100%;
        height: 56px;
        font-size: 16px;
    }
}

/* =========================================================
   PROPERTY CARD TEXT +20% — catalog properties only.
   Scales every text element of the compact property card
   (.buy_listing--compact) up by 20% across EVERY format:
   mobile, tablet/iPad, desktop and large screens.
   Does NOT touch the result count, filters or sort controls.
   Appended last so it wins over the tokens and the earlier
   !important overrides. Values = previous effective size ×1.2.
   ========================================================= */
.cat_listings .buy_listing--compact .buy_listing__title,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__title {
    /* was clamp(18px, 1.2vw + 8px, 28px) */
    font-size: clamp(21.6px, 1.44vw + 9.6px, 33.6px) !important;
}
.cat_listings .buy_listing--compact .buy_listing__ref,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__ref {
    /* was clamp(10px, 0.2vw + 9px, 12px) */
    font-size: clamp(12px, 0.24vw + 10.8px, 14.4px) !important;
}
.cat_listings .buy_listing--compact .buy_listing__desc,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__desc {
    /* was clamp(12px, 0.3vw + 11px, 14px) */
    font-size: clamp(14.4px, 0.36vw + 13.2px, 16.8px) !important;
}
.cat_listings .buy_listing--compact .buy_listing__specs li span,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__specs li span {
    font-size: 14.82px !important; /* +20% then −5% (13 → 15.6 → 14.82) */
}
.cat_listings .buy_listing--compact .buy_listing__specs li b,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__specs li b {
    font-size: 17.1px !important; /* +20% then −5% (15 → 18 → 17.1) */
}
.cat_listings .buy_listing--compact .buy_listing__price,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__price {
    /* was clamp(22px, 1.4vw + 10px, 30px) */
    font-size: clamp(26.4px, 1.68vw + 12px, 36px) !important;
}
.cat_listings .buy_listing--compact .buy_listing__btn,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__btn {
    /* was clamp(10px, 0.2vw + 9px, 12px) */
    font-size: clamp(12px, 0.24vw + 10.8px, 14.4px) !important;
}

/* ≤640px the price and button used different hardcoded sizes —
   scale those breakpoint-specific values up by 20% too. */
@media (max-width: 640px) {
    .cat_listings .buy_listing--compact .buy_listing__price,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__price {
        /* was clamp(28px, 7vw, 38px) */
        font-size: clamp(33.6px, 8.4vw, 45.6px) !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__btn,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__btn {
        font-size: 13.2px !important; /* was 11px */
    }
}

/* More breathing room between the specs row and the price/button below. */
.cat_listings .buy_listing--compact .buy_listing__foot,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__foot {
    padding-top: 26px !important; /* was 14px */
}

/* Price digits on a single baseline. The serif face (Felidae / Cormorant
   Garamond) defaults to OLDSTYLE figures: 0/1/2 sit on the baseline while
   3/4/5/7/9 dip below or rise above it, so the number looks like it "jumps".
   Force LINING (and tabular) figures so every digit aligns to the same
   baseline and width. */
.cat_listings .buy_listing--compact .buy_listing__price,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__price,
.cat_listings .buy_listing--compact .buy_listing__price b,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__price b,
.cat_listings .buy_listing--compact .buy_listing__price em,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__price em {
    font-variant-numeric: lining-nums tabular-nums !important;
    -moz-font-feature-settings: "lnum" 1, "tnum" 1 !important;
    font-feature-settings: "lnum" 1, "tnum" 1 !important;
}

/* Raise ONLY the zeros in the price a touch above the other digits.
   Each "0" is wrapped in .buy_listing__zero by inmolux_render_property_card().
   Tweak the translateY value to raise them more/less. */
.cat_listings .buy_listing--compact .buy_listing__price .buy_listing__zero,
.cat_listings .buy_listing.buy_listing--compact .buy_listing__price .buy_listing__zero {
    display: inline-block !important;
    font-size: 1em !important;       /* slightly smaller zeros — refined look */
    transform: none !important;
}

/* =========================================================
   PHONE + TABLET SPECS FIX — ≤1200px (covers iPad portrait
   AND landscape).
   The universal "single horizontal row, label BESIDE value"
   layout above overflows for 4-spec project cards
   (Спальни / Ванные / Объекты / Площадь). On phones the labels
   collide with their values ("Объекты 57Площадь") and "m²" gets
   clipped; on tablets the card stays horizontal (photo ~44% +
   narrow body) so the long ES labels (Dormitorios / Baños /
   Inmuebles / Superficie) overlap their neighbours entirely.
   At these widths we stack each label OVER its value (a tidy
   stat block) so all four cells fit one clean row. Fonts scale
   from 11/14px on phones up to 13/16px on large tablets.
   Appended last so it wins over the +20% font bump above. >1200px
   keeps the original label-beside-value row (body is wide enough).
   ========================================================= */
@media (max-width: 1200px) {
    .cat_listings .buy_listing--compact .buy_listing__specs,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__specs {
        gap: 4px !important;
        margin: 12px 0 0 !important;
        padding: 12px 0 0 !important;
        align-items: stretch !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__specs li,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__specs li {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 2px !important;
        white-space: nowrap !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__specs li span,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__specs li span {
        font-size: clamp(11px, 0.6vw + 8px, 13px) !important;
        line-height: 1.15 !important;
    }
    .cat_listings .buy_listing--compact .buy_listing__specs li b,
    .cat_listings .buy_listing.buy_listing--compact .buy_listing__specs li b {
        font-size: clamp(14px, 0.8vw + 10px, 16px) !important;
        line-height: 1.15 !important;
    }
}