/* Catalog page module */

.catalog-page{padding-bottom:30px}.breadcrumbs{display:flex;align-items:center;gap:9px;margin:16px 0 12px;color:#8a7668;font-size:15px;font-weight:500}.breadcrumbs{display:flex;align-items:center;gap:9px;margin:16px 0 12px;color:#8a7668;font-size:15px;font-weight:500;flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;max-width:100%;min-width:0}.breadcrumbs::-webkit-scrollbar{display:none}.breadcrumbs>*{flex:0 0 auto}.breadcrumbs a{color:#606060}.breadcrumbs a:hover{color:#ff6400}.catalog-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:center;margin-bottom:18px;padding:42px 48px;border:1px solid #f0e6db;border-radius:22px;background:radial-gradient(circle at 86% 50%,#fff1e2 0 36%,transparent 38%),linear-gradient(135deg,#fff,#fffaf5);box-shadow:0 12px 32px rgba(70,42,24,.06)}.catalog-hero:after{content:"";position:absolute;right:-72px;bottom:-90px;width:310px;height:310px;border-radius:50%;background:rgba(255,106,0,.08)}.catalog-hero__content,.catalog-hero__side{position:relative;z-index:2}.eyebrow{display:inline-flex;align-items:center;gap:9px;margin-bottom:12px;padding:8px 13px;border-radius:999px;background:#fff4ea;color:#ff6400;font-weight:900;font-size:13px}.eyebrow img{width:22px}.catalog-hero h1{max-width:680px;margin:0 0 12px;font-size:44px;line-height:1.05;letter-spacing:-.04em}.catalog-hero p{max-width:640px;margin:0;color:#5e514a;font-size:17px;line-height:1.5}.catalog-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.catalog-hero__side{display:grid;grid-template-columns:1fr;gap:12px}.catalog-stat{display:flex;align-items:center;gap:18px;min-height:92px;padding:18px 20px;border:1px solid #f0e2d8;border-radius:16px;background:rgba(255,255,255,.9);box-shadow:0 10px 26px rgba(88,52,29,.09)}.catalog-stat b{min-width:78px;color:#ff6400;font-size:36px;line-height:1}.catalog-stat span{font-weight:800;line-height:1.25}.catalog-filter{position:sticky;top:78px;z-index:20;display:grid;grid-template-columns:minmax(260px,1.3fr) minmax(180px,1fr) minmax(180px,1fr) auto;gap:10px;align-items:end;margin-bottom:20px;padding:12px;border:1px solid #f0e6db;border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 12px 30px rgba(70,42,24,.08);backdrop-filter:blur(10px)}.filter-field{display:grid;gap:6px}.filter-field label{font-size:12px;font-weight:900;color:#8a7668}.filter-field input,.filter-field select{width:100%;height:46px;border:1px solid #eee2d8;border-radius:11px;background:#fff;padding:0 14px;font:inherit;font-weight:750;color:#231f20;outline:0}.filter-field input:focus,.filter-field select:focus{border-color:#ffc49a;box-shadow:0 0 0 4px #fff4ea}.catalog-slider{position:relative}.catalog-track{display:flex;gap:14px;overflow:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 8px}.catalog-track::-webkit-scrollbar{display:none}.district-card,.kennel-card{scroll-snap-align:start;flex:0 0 210px;min-height:132px;display:grid;align-content:center;gap:7px;padding:18px;border:1px solid #eee6de;border-radius:15px;background:#fff;box-shadow:0 7px 18px rgba(68,42,25,.07);transition:.25s}.district-card:hover,.kennel-card:hover{transform:translateY(-3px);border-color:#ffc49a;box-shadow:0 14px 26px rgba(255,106,0,.13)}.district-card img{width:30px}
.district-card{font-weight:950;font-size:22px;color:#000}
.district-card:hover{color:#ff6400}
.district-card small,.kennel-card small{color:#756b65;font-size:12px;font-weight:800}.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.category-grid a{display:flex;align-items:center;min-height:58px;padding:14px 18px;border:1px solid #eee6de;border-radius:13px;background:#fff;font-weight:900;transition:.2s}.category-grid a:before{content:"";width:9px;height:9px;margin-right:10px;border-radius:50%;background:#ff8a21}.category-grid a:hover{color:#ff6400;background:#fff4ea;border-color:#ffc49a}.kennel-card{flex-basis:245px;min-height:190px}.kennel-card img{width:54px;height:54px;object-fit:contain}.kennel-card b{font-size:18px}.kennel-card span{color:#ffab19;font-weight:900}.kennel-card em{margin-top:5px;color:#ff6400;font-style:normal;font-weight:900}.breed-catalog{padding:18px;border:1px solid #f0e6db;border-radius:18px;background:#fff}.catalog-count{padding:7px 12px;border-radius:999px;background:#fff4ea;color:#ff6400;font-weight:900;font-size:13px}.alphabet{display:flex;gap:7px;flex-wrap:wrap;margin:4px 0 16px}.alphabet button{width:38px;height:36px;border:1px solid #eee2d8;border-radius:10px;background:#fff;font-weight:900;color:#8a6d5a;cursor:pointer}.alphabet button:first-child{width:auto;padding:0 14px}.alphabet button:hover,.alphabet button.is-active{color:#fff;border-color:#ff6400;background:#ff6400}.catalog-breed-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.catalog-breed-card{display:grid;justify-items:center;align-content:start;gap:6px;min-height:148px;padding:14px 8px;border:1px solid #eee6de;border-radius:14px;background:#fff;text-align:center;box-shadow:0 6px 16px rgba(68,42,25,.06);transition:.25s}.catalog-breed-card:hover{transform:translateY(-3px);border-color:#ffc49a;box-shadow:0 14px 26px rgba(255,106,0,.13)}.catalog-breed-card img{width:68px;height:68px;border-radius:50%;object-fit:cover;background:#fff4ea}.catalog-breed-card span{font-weight:950;font-size:13px;line-height:1.15}.catalog-breed-card small{color:#83756d;font-size:11px;font-weight:750}.catalog-breed-card[hidden],.district-card[hidden]{display:none}.reviews-mini{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.review-mini{min-height:150px;padding:18px;border:1px solid #eee6de;border-radius:14px;background:#fff;box-shadow:0 7px 18px rgba(68,42,25,.07);transition:.25s}.review-mini:hover{transform:translateY(-3px);border-color:#ffc49a}.review-mini b{display:block;margin-bottom:6px}.review-mini span{color:#ffab19;font-size:12px;letter-spacing:1px}.review-mini p{margin:10px 0 0;color:#554a43;font-size:13px;line-height:1.45}@media(max-width:1100px){.catalog-hero{grid-template-columns:1fr}.catalog-hero__side{grid-template-columns:repeat(3,1fr)}.catalog-filter{grid-template-columns:1fr 1fr}.catalog-filter .searchbtn{height:46px}.catalog-breed-grid{grid-template-columns:repeat(4,1fr)}.reviews-mini{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.catalog-page{width:min(100% - 24px,1280px)}.catalog-hero{padding:28px 20px;border-radius:18px}.catalog-hero h1{font-size:34px}.catalog-hero p{font-size:15px}.catalog-hero__side{grid-template-columns:1fr}.catalog-stat{min-height:76px}.catalog-filter{position:static;grid-template-columns:1fr}.category-grid,.catalog-breed-grid,.reviews-mini{grid-template-columns:repeat(2,1fr)}.catalog-breed-card{min-height:136px}.carousel-btn.prev{left:-10px}.carousel-btn.next{right:-10px}}@media(max-width:430px){.category-grid,.catalog-breed-grid,.reviews-mini{grid-template-columns:1fr}.catalog-actions .btn{width:100%;text-align:center}.district-card,.kennel-card{flex-basis:82%}}

/* Rubricator of cities (/goroda/) — same alphabet filter as breeds in /sobaki/,
   but compact textual cards (no image). Sister grid to .catalog-breed-grid. */
.catalog-city-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.catalog-city-card{display:flex;flex-direction:column;justify-content:center;gap:3px;min-height:70px;padding:13px 14px;border:1px solid #eee6de;border-radius:13px;background:#fff;box-shadow:0 6px 16px rgba(68,42,25,.06);transition:.25s;text-align:left;text-decoration:none}
.catalog-city-card:hover{transform:translateY(-3px);border-color:#ffc49a;box-shadow:0 14px 26px rgba(255,106,0,.13);color:#ff6400}
.catalog-city-card span{font-weight:900;font-size:15px;line-height:1.15;color:#231f20}
.catalog-city-card:hover span{color:#ff6400}
.catalog-city-card small{color:#8a7a72;font-size:12px;font-weight:700;line-height:1.15;margin-top:auto}
.catalog-city-card[hidden]{display:none!important}
@media(max-width:1100px){.catalog-city-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.catalog-city-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.catalog-city-card{min-height:64px}}
@media(max-width:430px){.catalog-city-grid{grid-template-columns:1fr;gap:8px}.catalog-city-card{min-height:58px;padding:11px 12px}}

/* Requested refinements */
.catalog-hero{grid-template-columns:minmax(0,1fr) auto;gap:18px;margin-bottom:12px;padding:20px 28px;border-radius:18px;align-items:center}
.catalog-hero:after{width:220px;height:220px;right:-80px;bottom:-120px}.eyebrow{margin-bottom:8px;padding:6px 11px;font-size:12px}.eyebrow img{width:18px}.catalog-hero h1{max-width:620px;margin-bottom:8px;font-size:34px;line-height:1.04}.catalog-hero p{max-width:680px;font-size:14px;line-height:1.38}.catalog-actions{margin-top:12px;gap:8px}.catalog-actions .btn{padding:10px 14px}.catalog-hero__side{grid-template-columns:repeat(3,auto);gap:8px}.catalog-stat{min-height:58px;padding:10px 12px;border-radius:13px;gap:9px}.catalog-stat b{min-width:auto;font-size:24px}.catalog-stat span{font-size:12px;line-height:1.18}
.catalog-tags{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 18px}.catalog-tags a{display:inline-flex;align-items:center;height:38px;padding:0 15px;border:1px solid #f0dfd0;border-radius:999px;background:#fff;color:#ff6400;font-weight:600;font-size:13px;box-shadow:0 6px 16px rgba(68,42,25,.05);transition:.2s}.catalog-tags a{gap:8px}.catalog-tags a svg{width:16px;height:16px;flex-shrink:0}.catalog-tags a:hover{background:#ff6400;border-color:#ff6400;color:#fff;transform:translateY(-2px)}
.catalog-filter{display:none!important}.district-card{flex-basis:176px;min-height:72px;padding:12px 14px;grid-template-columns:26px 1fr;align-items:center;align-content:center;column-gap:10px;row-gap:1px;font-size:19px}.district-card img{grid-row:1/3;width:24px}.district-card small{font-size:11px;line-height:1.1}.catalog-track{gap:10px}.category-track{display:flex;gap:10px;overflow:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 8px}.category-track::-webkit-scrollbar{display:none}.category-track a{scroll-snap-align:start;flex:0 0 220px;display:flex;align-items:center;min-height:56px;padding:13px 17px;border:1px solid #eee6de;border-radius:14px;background:#fff;font-weight:950;box-shadow:0 7px 18px rgba(68,42,25,.06);transition:.2s}.category-track a:before{content:"";width:9px;height:9px;margin-right:10px;border-radius:50%;background:#ff8a21}.category-track a:hover{color:#ff6400;background:#fff4ea;border-color:#ffc49a;transform:translateY(-2px)}.category-grid{display:none}.catalog-map{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 260px;min-height:310px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(70,42,24,.06)}.catalog-map iframe{width:100%;height:100%;min-height:310px;border:0}.map-card{display:grid;align-content:center;gap:10px;padding:26px;background:linear-gradient(135deg,#fff8f1,#fff)}.map-card b{font-size:22px;line-height:1.1}.map-card span{font-size:14px;line-height:1.45;color:#5e514a;font-weight:750}.catalog-breed-card small{padding:4px 9px;border-radius:999px;background:#fff4ea;color:#ff6400;font-weight:950;font-size:11px}.catalog-breed-card{min-height:140px}.catalog-breed-card span{min-height:30px;display:flex;align-items:center}
@media(max-width:1100px){.catalog-hero__side{grid-template-columns:repeat(3,1fr)}.catalog-map{grid-template-columns:1fr}.map-card{display:none}}
@media(max-width:760px){.catalog-hero{padding:18px 16px}.catalog-hero h1{font-size:28px}.catalog-hero__side{grid-template-columns:1fr 1fr 1fr}.catalog-stat{display:grid;text-align:center;gap:4px}.catalog-map,.catalog-map iframe{min-height:260px}.district-card{flex-basis:155px}.category-track a{flex-basis:190px}.catalog-actions .btn{width:auto}.catalog-tags a{height:36px;padding:0 12px}}
@media(max-width:430px){.catalog-hero__side{grid-template-columns:1fr}.catalog-actions .btn{width:100%}.district-card{flex-basis:78%}.category-track a{flex-basis:78%}}

/* Final catalog adjustments */
.catalog-title-block{margin:10px 0 12px;padding:0;background:none;border:0;box-shadow:none}.catalog-title-block h1{margin:0;font-size:34px;line-height:1.12;letter-spacing:-.035em;color:#000}.catalog-hero,.catalog-hero__content,.catalog-hero__side,.catalog-stat,.eyebrow,.catalog-actions{display:none!important}.catalog-tags{margin-top:6px}.map-toggle{border:0;background:transparent;cursor:pointer;font:inherit}.catalog-map[hidden]{display:none!important}.catalog-map-section .section-head{align-items:center}.catalog-breed-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.catalog-breed-card{min-height:112px;padding:10px 7px;gap:4px;border-radius:12px}.catalog-breed-card img{width:52px;height:52px}.catalog-breed-card span{min-height:24px;font-size:12px;line-height:1.1}.catalog-breed-card small{padding:0;background:transparent;color:#777;font-size:11px;line-height:1.15;font-weight:700;border-radius:0}.guide-block{padding:22px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(70,42,24,.06)}.guide-featured{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.guide-featured a{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:999px;background:#fff4ea;color:#ff6400;font-weight:950}.guide-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.guide-links a{display:flex;align-items:center;min-height:42px;padding:10px 13px;border:1px solid #eee6de;border-radius:12px;background:#fff;color:#231f20;font-weight:850;transition:.2s}.guide-links a:hover{color:#ff6400;border-color:#ffc49a;background:#fffaf5;transform:translateY(-2px)}
@media(max-width:1100px){.catalog-breed-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.guide-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.catalog-title-block h1{font-size:28px}.catalog-breed-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.catalog-breed-card{min-height:106px}.catalog-breed-card img{width:48px;height:48px}.guide-links{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-block{padding:16px}}
@media(max-width:430px){.catalog-title-block h1{font-size:25px}.catalog-breed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-links{grid-template-columns:1fr}.guide-featured a{width:100%;justify-content:center}}

/* Client revision: cleaner catalog blocks */
.catalog-slider>.section-head:first-child{display:flex!important}.catalog-slider{margin-top:10px}.district-card{min-height:64px;padding:10px 12px;border-radius:13px}.district-card img{display:none}.district-card{grid-template-columns:1fr;font-size:18px;gap:2px}.district-card small{font-size:11px;color:#8a7668}.category-block>.section-head{display:flex!important}.category-block{margin-top:14px}.category-track a{min-height:48px;padding:10px 15px;border-radius:999px}.category-track a:before{display:none}.catalog-map-section{margin-top:0px}.map-preview-head{position:relative;z-index:3;margin:0 0 -34px;padding:14px 16px;display:flex;justify-content:flex-start}.map-open-btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px;border:1px solid #ffd1ad;border-radius:999px;background:#fff;color:#ff6400;font-weight:950;font-size:14px;box-shadow:0 12px 28px rgba(255,106,0,.16);cursor:pointer;transition:.2s}.map-open-btn:after{content:'›';font-size:24px;line-height:1;transform:rotate(90deg);transition:.2s}.map-open-btn[aria-expanded="true"]:after{transform:rotate(-90deg)}.map-open-btn:hover{background:#ff6400;border-color:#ff6400;color:#fff;transform:translateY(-2px)}.catalog-map{display:grid!important;transition:max-height .35s ease, min-height .35s ease;max-height:420px}.catalog-map.is-collapsed{min-height:118px;max-height:118px}.catalog-map.is-collapsed iframe{min-height:260px;transform:translateY(-86px);filter:saturate(.92);pointer-events:none}.catalog-map.is-collapsed:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,244,234,.78));pointer-events:none}.catalog-map.is-collapsed .map-card{display:none}.catalog-breed-card{min-height:98px;padding:8px 6px;gap:3px}.catalog-breed-card img{width:44px;height:44px}.catalog-breed-card span{min-height:22px;font-size:12px}.catalog-breed-card small{display:inline-flex;align-items:center;min-height:20px;padding:2px 8px;border-radius:999px;background:#fff4ea;color:#ff6400;font-size:10.5px;font-weight:900;line-height:1}.reviews-strip .reviews{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
/* отзывы-лента (data-slider): горизонтальный скролл вместо grid-колонок */
.reviews-strip .reviews.catalog-track{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;scrollbar-width:none}
.reviews-strip .reviews.catalog-track::-webkit-scrollbar{display:none}
.reviews-strip .reviews.catalog-track .review-card{flex:0 0 320px;scroll-snap-align:start}
@media(max-width:1100px){.reviews-strip .reviews.catalog-track{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.reviews-strip .reviews.catalog-track{flex-wrap:nowrap;grid-template-columns:none}
.reviews-strip .reviews.catalog-track .review-card{flex-basis:82%}}.reviews-strip .review-card{min-height:150px}.review-mini,.reviews-mini{display:none!important}.guide-block{padding:0;border:0;background:transparent;box-shadow:none}.guide-block .popular{margin-top:0}.guide-links,.guide-featured{display:none!important}
@media(max-width:1100px){.reviews-strip .reviews{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-map{grid-template-columns:1fr}.catalog-map.is-collapsed .map-card{display:none!important}}
@media(max-width:760px){.catalog-map.is-collapsed{min-height:108px;max-height:108px}.catalog-map.is-collapsed iframe{transform:translateY(-76px)}.map-open-btn{min-height:40px;padding:0 14px}.reviews-strip .reviews{grid-template-columns:1fr}.catalog-breed-card{min-height:94px}.catalog-breed-card img{width:40px;height:40px}.category-track a{flex-basis:auto;white-space:nowrap}}


/* Updated breed section style to match index.html popular breeds */
.breeds-section,
.catalog-breeds,
.breeds-wrapper{
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    padding:0 !important;
}

/* v13 responsive spacing audit */
/* Контейнер каталога = базовый .wrap (48px полей): раньше 64px порождало
   разные отступы хедера/контента между каталожными и остальными страницами */
.catalog-page {
  max-width: 1280px !important;
  width: calc(100% - 48px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-bottom: 42px !important;
}

.catalog-page > .section,
.catalog-page > .catalog-slider,
.catalog-page > .catalog-map-section,
.catalog-page > .breed-catalog,
.catalog-page > .guide-block {
  margin-top: 24px !important;
}

.catalog-page .breadcrumbs {
  margin-top: 18px !important;
  margin-bottom: 14px !important;
}

.catalog-page .catalog-title-block {
  margin-bottom: 14px !important;
}

.catalog-page .catalog-tags {
  margin-bottom: 20px !important;
}

.catalog-page .catalog-slider {
  overflow: visible !important;
}

.catalog-page .catalog-track,
.catalog-page .category-track {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.catalog-page .catalog-slider .carousel-btn.prev {
  left: -18px !important;
}

.catalog-page .catalog-slider .carousel-btn.next {
  right: -18px !important;
}

.catalog-page .catalog-map-section {
  margin-top: 18px !important;
}

.catalog-page .breed-catalog {
  padding-top: 0 !important;
}

@media (max-width: 1024px) {
  .catalog-page {
    width: calc(100% - 48px) !important;
    padding-bottom: 36px !important;
  }

  .catalog-page .reviews-strip > .section-head {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .catalog-page .reviews-strip > .section-head .more {
    margin-left: 0 !important;
  }

  .catalog-page > .section,
  .catalog-page > .catalog-slider,
  .catalog-page > .catalog-map-section,
  .catalog-page > .breed-catalog,
  .catalog-page > .guide-block {
    margin-top: 22px !important;
  }

  .catalog-page .catalog-title-block h1 {
    max-width: 100% !important;
  }

  .catalog-page .catalog-tags {
    margin-bottom: 18px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev {
    left: -10px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next {
    right: -10px !important;
  }
}

@media (max-width: 760px) {
  .catalog-page {
    width: min(100% - 24px, 1280px) !important;
    padding-bottom: 32px !important;
  }

  .catalog-page .reviews-strip > .section-head {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .catalog-page .reviews-strip > .section-head .more {
    margin-left: 0 !important;
  }

  .catalog-page .breadcrumbs {
    margin-top: 14px !important;
    margin-bottom: 12px !important;
  }

  .catalog-page .catalog-title-block {
    margin-bottom: 12px !important;
  }

  .catalog-page .catalog-title-block h1 {
    font-size: 28px !important;
    line-height: 1.12 !important;
  }

  .catalog-page .catalog-tags {
    gap: 8px !important;
    margin-bottom: 16px !important;
  }

  .catalog-page .catalog-tags a {
    height: 36px !important;
  }

  .catalog-page > .section,
  .catalog-page > .catalog-slider,
  .catalog-page > .catalog-map-section,
  .catalog-page > .breed-catalog,
  .catalog-page > .guide-block {
    margin-top: 20px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev {
    left: -8px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next {
    right: -8px !important;
  }

  .catalog-page .map-preview-head {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (max-width: 430px) {
  .catalog-page {
    width: calc(100% - 28px) !important;
  }

  .catalog-page .catalog-title-block h1 {
    font-size: 25px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev {
    left: -6px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next {
    right: -6px !important;
  }
}

/* v16 final override: reviews link below title like index.html */
@media (max-width: 1200px) {
  body .catalog-page section.reviews-strip.catalog-slider > div.section-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  body .catalog-page section.reviews-strip.catalog-slider > div.section-head > h2 {
    margin: 0 !important;
    width: auto !important;
    flex: 0 0 auto !important;
  }

  body .catalog-page section.reviews-strip.catalog-slider > div.section-head > a.more {
    display: inline-flex !important;
    width: auto !important;
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    align-self: flex-start !important;
    text-align: left !important;
  }
}

/* Keep quick links in one row; swipe horizontally if they don't fit */
.catalog-page .catalog-tags {
  position: relative;
}

.catalog-page .catalog-tags .catalog-tags-scroll {
  display: flex;
  gap: 9px;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-top: 4px;
  padding-bottom: 4px;
}

.catalog-page .catalog-tags .catalog-tags-scroll::-webkit-scrollbar {
  display: none;
}

.catalog-page .catalog-tags a {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

.catalog-page .catalog-tags a:hover,
.catalog-page .catalog-tags a:focus-visible {
  transform: none !important;
}

.catalog-page .catalog-tags .catalog-tags-hint {
  display: none;
}

@media (max-width: 760px) {
  .catalog-page .catalog-tags {
    padding-right: 34px;
  }

  .catalog-page .catalog-tags .catalog-tags-scroll {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .catalog-page .catalog-tags .catalog-tags-hint {
    display: inline-flex;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f0dfd0;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 6px 16px rgba(68, 42, 25, .12);
    overflow: hidden;
    font-size: 0;
    color: transparent;
    z-index: 2;
    cursor: pointer;
    pointer-events: auto;
    border-color: #f0dfd0;
    transition: border-color .2s ease, background-color .2s ease, opacity .2s ease;
  }

  .catalog-page .catalog-tags .catalog-tags-hint:hover,
  .catalog-page .catalog-tags .catalog-tags-hint:focus-visible {
    border-color: #ffc49a;
    background: #fff4ea;
    outline: 0;
  }

  .catalog-page .catalog-tags .catalog-tags-hint::before {
    content: "›";
    display: inline-block;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    color: #000;
    transform: translate(1px, -1px);
  }

  .catalog-page .catalog-tags .catalog-tags-hint.is-hidden {
    opacity: 0;
    visibility: hidden;
  }
}

/* v15: reviews header mirrors index.html section-head behavior */
.catalog-page .reviews-strip > .section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
  padding: 0 !important;
}

.catalog-page .reviews-strip > .section-head .more {
  margin-left: 0 !important;
  white-space: nowrap !important;
}

@media (max-width: 1024px) {
  .catalog-page .reviews-strip > .section-head {
    align-items: flex-start !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .catalog-page .reviews-strip > .section-head h2,
  .catalog-page .reviews-strip > .section-head .more {
    width: auto !important;
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
  }
}

/* v14 reviews link: force a new left-aligned row on tablet/mobile */
@media (max-width: 1200px) {
  .catalog-page .reviews-strip > .section-head {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .catalog-page .reviews-strip > .section-head h2 {
    flex: 0 0 100% !important;
    width: 100% !important;
  }

  .catalog-page .reviews-strip > .section-head .more {
    flex: 0 0 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    text-align: left !important;
    justify-content: flex-start !important;
  }
}

.breeds-grid{
    display:grid !important;
    grid-template-columns:repeat(auto-fill,minmax(180px,1fr)) !important;
    gap:12px !important;
}

.breed-card{
    background:#fff !important;
    border:1px solid rgba(0,0,0,.06) !important;
    border-radius:16px !important;
    padding:14px 16px !important;
    min-height:auto !important;
    transition:.2s ease !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
}

.breed-card:hover{
    transform:translateY(-2px);
}

.breed-card .breed-icon{
    width:42px !important;
    height:42px !important;
    flex-shrink:0 !important;
}

.breed-card .breed-title{
    font-size:15px !important;
    font-weight:600 !important;
    line-height:1.2 !important;
}

.breed-card .breed-meta,
.breed-card .breed-count{
    display:none !important;
}


/* Breed catalog: same visual language as index.html "Популярные породы кошек" */
.breed-catalog{
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.breed-catalog .section-head{
  margin-bottom:14px !important;
}

.breed-catalog .catalog-count{
  display:none !important;
}

.breed-catalog .alphabet{
  margin:0 0 16px !important;
}

.catalog-breed-grid{
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:12px !important;
}

.catalog-breed-card{
  display:block !important;
  min-height:0 !important;
  padding:2px !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
  box-shadow:none !important;
  text-align:center !important;
  transition:.25s !important;
  color:#000 !important;
}

.catalog-breed-card:hover{
  transform:translateY(-2px) !important;
  border-color:transparent !important;
  box-shadow:none !important;
  color:#ff6400 !important;
}

.catalog-breed-card img{
  width:62px !important;
  height:62px !important;
  border-radius:50% !important;
  object-fit:cover !important;
  background:transparent !important;
  margin:0 auto 4px !important;
  display:block !important;
}

.catalog-breed-card span{
  display:block !important;
  min-height:0 !important;
  font-size:12px !important;
  line-height:1.15 !important;
  font-weight:700 !important;
  color:inherit !important;
}

.catalog-breed-card small{
  display:block !important;
  padding:0 !important;
  min-height:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#777 !important;
  font-size:11px !important;
  line-height:1.15 !important;
  font-weight:400 !important;
}

@media(max-width:1100px){
  .catalog-breed-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
}

@media(max-width:760px){
  .catalog-breed-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .catalog-breed-card img{width:56px !important;height:56px !important;}
}

@media(max-width:430px){
  .catalog-breed-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}

/* v8: breed cards match index.html and letter filter fix */
.catalog-breed-card[hidden]{
  display:none!important;
}
.breed-catalog{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.breed-catalog .section-head{
  margin-bottom:14px!important;
}
.breed-catalog .catalog-count,
.breed-catalog .section-head .catalog-count,
.breed-catalog .section-head > span:not(h2 span){
  display:none!important;
}
.catalog-breed-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:12px!important;
}
.catalog-breed-card{
  display:block!important;
  min-height:0!important;
  padding:2px!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#231f20!important;
  text-align:center!important;
  text-decoration:none!important;
  transition:.25s!important;
}
.catalog-breed-card:hover{
  color:#ff6400!important;
  transform:translateY(-3px)!important;
  box-shadow:0 14px 26px rgba(62,38,22,.13)!important;
}
.catalog-breed-card img{
  display:block!important;
  width:62px!important;
  height:62px!important;
  margin:0 auto!important;
  border-radius:50%!important;
  object-fit:cover!important;
}
.catalog-breed-card span{
  display:block!important;
  min-height:0!important;
  margin-top:0!important;
  color:inherit!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.15!important;
}
.catalog-breed-card small{
  display:block!important;
  min-height:0!important;
  padding:0!important;
  margin-top:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#777!important;
  font-size:11px!important;
  font-weight:400!important;
  line-height:1.15!important;
}
@media(max-width:1000px){
  .catalog-breed-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .catalog-breed-card span{font-size:16px!important;line-height:1.25!important;}
  .catalog-breed-card small{font-size:14px!important;line-height:1.35!important;}
}
@media(max-width:430px){
  .catalog-breed-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .catalog-breed-card span{font-size:15px!important;}
  .catalog-breed-card small{font-size:13px!important;}
}


/* More breed cards per row for tablet and desktop */
@media (min-width: 768px) {
  .breeds-grid,
  .popular-breeds-grid,
  .breed-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

@media (min-width: 1024px) {
  .breeds-grid,
  .popular-breeds-grid,
  .breed-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
}


/* 8 breed cards per row on desktop */
@media (min-width: 768px) and (max-width: 1199px) {
  .breeds-grid,
  .popular-breeds-grid,
  .breed-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}

@media (min-width: 1200px) {
  .breeds-grid,
  .popular-breeds-grid,
  .breed-grid {
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .breed-card {
    padding: 10px 8px !important;
  }

  .breed-card .breed-title {
    font-size: 13px !important;
  }

  .breed-card .breed-icon {
    width: 34px !important;
    height: 34px !important;
  }
}

  .breed-card {
    padding: 10px 8px !important;
  }

  .breed-card .breed-title {
    font-size: 13px !important;
  }

  .breed-card .breed-icon {
    width: 34px !important;
    height: 34px !important;
  }


/* FORCE 8 CARDS PER ROW FOR DESKTOP IN BREEDS SECTION */
@media (min-width: 1200px) {
  .breeds-grid,
  .breed-grid,
  .popular-breeds-grid,
  .catalog-breeds .breeds-grid,
  .catalog-breeds-grid {
    display: grid !important;
    grid-template-columns: repeat(8, 1fr) !important;
    gap: 10px !important;
  }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1199px) {
  .breeds-grid,
  .breed-grid,
  .popular-breeds-grid,
  .catalog-breeds .breeds-grid,
  .catalog-breeds-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 10px !important;
  }
}


/* v13 FIX: exact 8 cards in a row for "Найти питомник по породе кошек" on desktop */
@media screen and (min-width: 1200px) {
  #breedGrid.catalog-breed-grid {
    display: grid !important;
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    column-gap: 12px !important;
    row-gap: 14px !important;
  }

  #breedGrid .catalog-breed-card {
    width: auto !important;
    max-width: none !important;
  }
}

/* tablet keeps more compact rows */
@media screen and (min-width: 768px) and (max-width: 1199px) {
  #breedGrid.catalog-breed-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 10px !important;
    row-gap: 14px !important;
  }
}

/* Fix catalog carousel controls alignment */
.catalog-page .catalog-slider .carousel-btn{
  top:50% !important;
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  min-height:40px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:0 !important;
  line-height:1 !important;
  transform:translateY(-50%) !important;
}

.catalog-page .catalog-slider .carousel-btn::before{
  display:block;
  font-size:30px;
  font-weight:700;
  line-height:1;
  transform:translateY(-2px);
}

.catalog-page .catalog-slider .carousel-btn.prev::before{content:'‹';}
.catalog-page .catalog-slider .carousel-btn.next::before{content:'›';}

.catalog-page .catalog-slider .carousel-btn.prev{left:-20px !important;}
.catalog-page .catalog-slider .carousel-btn.next{right:-20px !important;}

@media(max-width:760px){
  .catalog-page .catalog-slider .carousel-btn{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
  }
  .catalog-page .catalog-slider .carousel-btn::before{
    font-size:28px;
    transform:translateY(-2px);
  }
  .catalog-page .catalog-slider .carousel-btn.prev{left:-10px !important;}
  .catalog-page .catalog-slider .carousel-btn.next{right:-10px !important;}
}

/* Disabled carousel controls state */
.catalog-page .catalog-slider .carousel-btn:disabled{
  opacity:.35 !important;
  cursor:default !important;
  pointer-events:none !important;
  filter:grayscale(1);
}


/* Robust disabled state for catalog carousel controls */
.catalog-page .catalog-slider .carousel-btn:disabled,
.catalog-page .catalog-slider .carousel-btn.is-disabled,
.catalog-page .catalog-slider .carousel-btn[aria-disabled="true"]{
  opacity:.35 !important;
  cursor:default !important;
  pointer-events:none !important;
  filter:grayscale(1) !important;
  box-shadow:none !important;
}


/* Improved category slider: cat type collections */
.catalog-page .category-block{
  position:relative;
  overflow:hidden;
  margin:18px 0 20px !important;
  padding:18px 18px 16px !important;
  border:1px solid #f0e6db;
  border-radius:22px;
  background:linear-gradient(135deg,#fffaf5 0%,#fff 58%,#fff4ea 100%);
  box-shadow:0 14px 34px rgba(70,42,24,.07);
}
.catalog-page .category-block::after{
  content:"";
  position:absolute;
  right:-90px;
  top:-110px;
  width:240px;
  height:240px;
  border-radius:50%;
  background:rgba(255,106,0,.08);
  pointer-events:none;
}
.catalog-page .category-block-head{
  position:relative;
  z-index:1;
  display:flex !important;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin:0 44px 14px 0;
}
.catalog-page .category-block-head h2{
  margin:0;
  font-size:24px;
  line-height:1.12;
  letter-spacing:-.025em;
  color:#231f20;
}
.catalog-page .category-block-head p{
  max-width:640px;
  margin:6px 0 0;
  color:#6d5f56;
  font-size:14px;
  line-height:1.45;
  font-weight:700;
}
.catalog-page .category-badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 13px;
  border:1px solid #ffd8bc;
  border-radius:999px;
  background:#fff;
  color:#ff6400;
  font-size:12px;
  font-weight:950;
  box-shadow:0 8px 18px rgba(255,106,0,.08);
}
.catalog-page .category-block .category-track{
  position:relative;
  z-index:1;
  gap:12px !important;
  padding:3px 2px 10px !important;
  scroll-padding-left:2px;
}
.catalog-page .category-block .category-track a{
  flex:0 0 248px !important;
  min-height:104px !important;
  align-items:flex-start !important;
  justify-content:center;
  flex-direction:column;
  gap:7px;
  padding:18px 18px 17px !important;
  border:1px solid #f0e1d4 !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.92) !important;
  color:#231f20;
  box-shadow:0 10px 24px rgba(68,42,25,.07) !important;
  white-space:normal !important;
}
.catalog-page .category-block .category-track a::before{
  display:none !important;
}
.catalog-page .category-block .category-track a b{
  display:block;
  font-size:18px;
  line-height:1.1;
  font-weight:950;
}
.catalog-page .category-block .category-track a span{
  display:block;
  color:#76685f;
  font-size:13px;
  line-height:1.28;
  font-weight:750;
}
.catalog-page .category-block .category-track a:hover{
  transform:translateY(-3px) !important;
  border-color:#ffc49a !important;
  background:#fff !important;
  color:#ff6400 !important;
  box-shadow:0 16px 30px rgba(255,106,0,.14) !important;
}
.catalog-page .category-block .category-track a:hover span{
  color:#5e514a;
}
.catalog-page .category-block .carousel-btn{
  z-index:2;
}
@media(max-width:760px){
  .catalog-page .category-block{
    padding:16px 14px 14px !important;
    border-radius:18px;
  }
  .catalog-page .category-block-head{
    display:block !important;
    margin:0 38px 12px 0;
  }
  .catalog-page .category-block-head h2{
    font-size:21px;
  }
  .catalog-page .category-block-head p{
    font-size:13px;
  }
  .catalog-page .category-badge{
    display:none;
  }
  .catalog-page .category-block .category-track a{
    flex:0 0 78% !important;
    min-height:96px !important;
    padding:16px !important;
  }
}
@media(max-width:430px){
  .catalog-page .category-block .category-track a{
    flex-basis:86% !important;
  }
}

/* Revision: make "Породы кошек по типу" slider cards match district cards */
.catalog-page .category-block{
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.catalog-page .category-block-head{
  display:none !important;
}
.catalog-page .category-block .category-track{
  gap:10px !important;
  padding:2px 2px 8px !important;
}
.catalog-page .category-block .category-track a{
  scroll-snap-align:start;
  flex:0 0 176px !important;
  min-height:64px !important;
  display:grid !important;
  align-content:center !important;
  justify-content:stretch !important;
  gap:2px !important;
  padding:10px 12px !important;
  border:1px solid #eee6de !important;
  border-radius:13px !important;
  background:#fff !important;
  color:#231f20 !important;
  box-shadow:0 7px 18px rgba(68,42,25,.07) !important;
  white-space:normal !important;
  transition:.25s !important;
}
.catalog-page .category-block .category-track a b{
  display:block;
  color:inherit !important;
  font-size:18px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
}
.catalog-page .category-block .category-track a span{
  display:block;
  color:#8a7668 !important;
  font-size:11px !important;
  line-height:1.1 !important;
  font-weight:800 !important;
}
.catalog-page .category-block .category-track a:hover{
  transform:translateY(-3px) !important;
  border-color:#ffc49a !important;
  background:#fff !important;
  color:#ff6400 !important;
  box-shadow:0 14px 26px rgba(255,106,0,.13) !important;
}
.catalog-page .category-block .category-track a:hover b{
  color:#ff6400 !important;
}
.catalog-page .category-block .category-track a:hover span{
  color:#8a7668 !important;
}
@media(max-width:760px){
  .catalog-page .category-block .category-track a{
    flex:0 0 155px !important;
    min-height:64px !important;
    padding:10px 12px !important;
  }
}
@media(max-width:430px){
  .catalog-page .category-block .category-track a{
    flex-basis:78% !important;
  }
}

/* Final polish for type slider */
.category-track a{
  background:#fff !important;
  border:1px solid #e7ddd4 !important;
  box-shadow:none !important;
}
.category-track a:hover{
  background:#fff8f2 !important;
}
.category-track a span,
.category-track a small,
.category-track a p,
.category-track small{
  color:#5f5f5f !important;
}

/* Fix carousel arrows */
.catalog-page .catalog-slider .carousel-btn{
  width:42px !important;
  height:42px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
  border:1px solid #e7ddd4 !important;
  box-shadow:none !important;
}

.catalog-page .catalog-slider .carousel-btn:disabled,
.catalog-page .catalog-slider .carousel-btn.is-disabled,
.catalog-page .catalog-slider .carousel-btn[aria-disabled="true"]{
  opacity:.45 !important;
  cursor:default !important;
  pointer-events:none !important;
  background:#f6f3f0 !important;
}

.catalog-page .catalog-slider .carousel-btn::before{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:100% !important;
  line-height:1 !important;
}

/* Final: cat type block uses the same visual pattern as the district carousel */
.catalog-page .category-block .catalog-track{
  gap:10px !important;
  padding:2px 2px 8px !important;
}
.catalog-page .category-block .district-card{
  flex:0 0 176px !important;
  min-height:64px !important;
  padding:10px 12px !important;
  border-radius:13px !important;
  grid-template-columns:1fr !important;
  gap:2px !important;
  font-size:18px !important;
  color:#ff6400 !important;
}
.catalog-page .category-block .district-card small{
  font-size:11px !important;
  line-height:1.1 !important;
  color:#8a7668 !important;
}
@media(max-width:760px){
  .catalog-page .category-block .district-card{flex-basis:155px !important;}
}
@media(max-width:430px){
  .catalog-page .category-block .district-card{flex-basis:78% !important;}
}


@media (max-width: 1024px) {
    /* Старый костыль [class*=cat] матчил подстроку в catalog-классах
       (catalog-city-card, catalog-page) и обнулял их паддинги на <1024px
       (баг страницы /goroda/) — сужено до префикса cat- */
    .district-card,
    .cat-card,
    .types-card,
    .county-card,
    [class*="district-"],
    [class*="cat-"] {
        padding: 0px!important;
    }

    .district-card h3,
    .cat-card h3,
    .types-card h3,
    .county-card h3,
    [class*="district-"] h3,
    [class*="cat-"] h3 {
        font-size: 18px !important;
        line-height: 1.3;
        color: #000 !important;
    }

    .district-card p,
    .cat-card p,
    .types-card p,
    .county-card p,
    [class*="district-"] p,
    [class*="cat-"] p {
        font-size: 14px !important;
        line-height: 1.4;
        color: #555 !important;
    }
}







/* CLEAN FINAL CARD TITLE COLORS */
.district-card .title,
.district-card h3,
.cat-card .title,
.cat-card h3,
.types-card .title,
.types-card h3,
.county-card .title,
.county-card h3,
[class*="district-"] .title,
[class*="district-"] h3,
[class*="cat-"] .title,
[class*="cat-"] h3 {
    color: #000000 !important;
    transition: color .2s ease;
}

.district-card:hover .title,
.district-card:hover h3,
.cat-card:hover .title,
.cat-card:hover h3,
.types-card:hover .title,
.types-card:hover h3,
.county-card:hover .title,
.county-card:hover h3,
[class*="district-"]:hover .title,
[class*="district-"]:hover h3,
[class*="cat-"]:hover .title,
[class*="cat-"]:hover h3 {
    color: #ff7a00 !important;
}

/* mobile/tablet readability */
@media (max-width: 1024px) {
    .district-card h3,
    .district-card .title,
    .cat-card h3,
    .cat-card .title,
    .types-card h3,
    .types-card .title,
    .county-card h3,
    .county-card .title,
    [class*="district-"] h3,
    [class*="district-"] .title,
    [class*="cat-"] h3,
    [class*="cat-"] .title {
        font-size: 18px !important;
        line-height: 1.3 !important;
    }

    .district-card p,
    .cat-card p,
    .types-card p,
    .county-card p,
    [class*="district-"] p,
    [class*="cat-"] p {
        color: #555555 !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
    }
}


/* Extracted from catalog.html */

.slider-arrow,
.carousel-arrow,
.swiper-button-prev,
.swiper-button-next,
button.prev,
button.next {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 999px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    font-size: 20px !important;
}

.slider-arrow[disabled],
.carousel-arrow[disabled],
button.prev[disabled] {
    opacity: .45 !important;
    pointer-events: none !important;
}



/* Типы пород кошек — стиль как у округов */
.breed-types-slider,
.breed-types,
.types-slider {
    background: transparent !important;
}

.breed-type-item,
.type-card,
.types-slider .swiper-slide,
.types-slider .slide-item {
    background: #fff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 999px !important;
    padding: 14px 18px !important;
    transition: all .2s ease !important;
    box-shadow: none !important;
}

.breed-type-item:hover,
.type-card:hover,
.types-slider .swiper-slide:hover,
.types-slider .slide-item:hover {
    border-color: #ff7a00 !important;
}

.breed-type-item h3,
.type-card h3,
.breed-type-item .title,
.type-card .title {
    color: #111 !important;
    font-weight: 600 !important;
}

.breed-type-item p,
.type-card p,
.breed-type-item .desc,
.type-card .desc {
    color: #555 !important;
    margin-top: 4px !important;
}

/* FINAL FIX: tablet/mobile district and cat type chips */
@media (max-width: 1024px) {
  .catalog-page .catalog-slider .catalog-track,
  .catalog-page .category-block .catalog-track,
  .catalog-page .category-track {
    padding-left: 16px !important;
    padding-right: 16px !important;
    scroll-padding-left: 16px !important;
    box-sizing: border-box !important;
  }

  .catalog-page .catalog-slider .district-card,
  .catalog-page .category-block .district-card,
  .catalog-page .category-block .category-track a {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 64px) !important;
    padding: 10px 16px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
  }

  .catalog-page .catalog-slider .district-card small,
  .catalog-page .category-block .district-card small,
  .catalog-page .category-block .category-track a span {
    display: block !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 430px) {
  .catalog-page .catalog-slider .district-card,
  .catalog-page .category-block .district-card,
  .catalog-page .category-block .category-track a {
    flex-basis: auto !important;
  }
}

.reviews-strip .reviews.catalog-track{display:flex;overflow:auto;scroll-snap-type:x mandatory;padding:2px 2px 8px}.reviews-strip .reviews.catalog-track .review-card{flex:0 0 280px;scroll-snap-align:start}


/* На главной (main.wrap без .catalog-page) .section-head в <=640px
   становится колонкой (layout.css) — align-items:center здесь центрировал
   и заголовок, и "Все отзывы →". Оставляем прижатие влево, как у
   "Все статьи →"; на каталог-страницах всё равно правят .catalog-page-правила */
@media (max-width:1024px){
  .reviews-strip .section-head{
    display:flex !important;
    justify-content:space-between;
    align-items:flex-start;
    padding:0 0 12px;
  }
  .reviews-strip .more{
    display:inline-flex !important;
  }
}

/* v8 fixes */
/* 1) Hide the "Все питомники" link in the Top 6 section if cached markup still contains it */
.catalog-page .catalog-slider .section-head:has(.dec-cat) .more[href="/koshki/"]{
  display:none !important;
}

/* 2) Tablet/mobile: align the "Последние отзывы" title to the left */
@media (max-width: 1024px){
  .catalog-page .reviews-strip > .section-head{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    justify-content:space-between !important;
    text-align:left !important;
  }
  .catalog-page .reviews-strip > .section-head h2{
    margin-left:0 !important;
    text-align:left !important;
  }
}

/* 3) Tablet/mobile: add spacing between Popular block and footer */
@media (max-width: 1024px){
  .catalog-page .guide-block{
    padding-bottom:8px !important;
  }
  .catalog-page .guide-block .popular{
    margin-bottom:18px !important;
  }
}

/* 4) Keep carousel arrow circles visible on 760-900px widths */
@media (min-width: 760px) and (max-width: 900px){
  .catalog-page .catalog-slider{
    overflow:visible !important;
    padding-left:24px !important;
    padding-right:24px !important;
  }
  .catalog-page .catalog-slider .catalog-track{
    margin-left:-24px !important;
    margin-right:-24px !important;
    padding-left:24px !important;
    padding-right:24px !important;
    scroll-padding-left:24px !important;
    scroll-padding-right:24px !important;
  }
  .catalog-page .catalog-slider .carousel-btn.prev{
    left:0 !important;
  }
  .catalog-page .catalog-slider .carousel-btn.next{
    right:0 !important;
  }
}

/* v9: catalog.html slider audit — stable paddings and arrow centering */
.catalog-page .catalog-slider{
  position:relative !important;
  overflow:visible !important;
}

.catalog-page .catalog-slider .catalog-track{
  box-sizing:border-box !important;
}

/* Base arrow style: keep circle visible and icon optically centered */
.catalog-page .catalog-slider .carousel-btn{
  position:absolute !important;
  z-index:10 !important;
  top:50% !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  padding:0 !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
  border:1px solid #e7ddd4 !important;
  box-shadow:0 8px 20px rgba(68,42,25,.12) !important;
  color:#ff6400 !important;
  font-size:0 !important;
  line-height:1 !important;
  transform:translateY(-50%) !important;
}

.catalog-page .catalog-slider .carousel-btn::before{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:100% !important;
  font-size:30px !important;
  font-weight:800 !important;
  line-height:1 !important;
  transform:translateY(-2px) !important;
}

.catalog-page .catalog-slider .carousel-btn.prev::before{content:'‹' !important;}
.catalog-page .catalog-slider .carousel-btn.next::before{content:'›' !important;}

/* Sections with a header: align arrows to the track, not to the whole section */
.catalog-page .catalog-slider:has(> .section-head) .carousel-btn{
  top:calc(50% + 24px) !important;
}

.catalog-page .catalog-slider .carousel-btn.prev{left:-21px !important;}
.catalog-page .catalog-slider .carousel-btn.next{right:-21px !important;}

.catalog-page .catalog-slider .carousel-btn:disabled,
.catalog-page .catalog-slider .carousel-btn.is-disabled,
.catalog-page .catalog-slider .carousel-btn[aria-disabled="true"]{
  opacity:.45 !important;
  cursor:default !important;
  pointer-events:none !important;
  background:#f6f3f0 !important;
  border-color:#e7ddd4 !important;
  box-shadow:0 4px 12px rgba(68,42,25,.06) !important;
}

/* Tablet and mobile: keep both circles inside the viewport and give tracks safe side gutters */
@media (max-width:1024px){
  .catalog-page .catalog-slider{
    padding-left:44px !important;
    padding-right:44px !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:-44px !important;
    margin-right:-44px !important;
    padding-left:44px !important;
    padding-right:44px !important;
    scroll-padding-left:44px !important;
    scroll-padding-right:44px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{left:2px !important;}
  .catalog-page .catalog-slider .carousel-btn.next{right:2px !important;}

  .catalog-page .catalog-slider:has(> .section-head) .carousel-btn{
    top:calc(50% + 22px) !important;
  }

  .catalog-page .catalog-slider .district-card,
  .catalog-page .catalog-slider .kennel-card,
  .catalog-page .reviews-strip .review-card{
    scroll-snap-align:start !important;
  }
}

/* 760–900px: explicit override for previously clipped arrow circles */
@media (min-width:760px) and (max-width:900px){
  .catalog-page .catalog-slider{
    padding-left:48px !important;
    padding-right:48px !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:-48px !important;
    margin-right:-48px !important;
    padding-left:48px !important;
    padding-right:48px !important;
    scroll-padding-left:48px !important;
    scroll-padding-right:48px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{left:4px !important;}
  .catalog-page .catalog-slider .carousel-btn.next{right:4px !important;}
}

@media (max-width:760px){
  .catalog-page .catalog-slider{
    padding-left:38px !important;
    padding-right:38px !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:-38px !important;
    margin-right:-38px !important;
    padding-left:38px !important;
    padding-right:38px !important;
    scroll-padding-left:38px !important;
    scroll-padding-right:38px !important;
  }

  .catalog-page .catalog-slider .carousel-btn{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
  }

  .catalog-page .catalog-slider .carousel-btn::before{
    font-size:28px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{left:0 !important;}
  .catalog-page .catalog-slider .carousel-btn.next{right:0 !important;}

  .catalog-page .catalog-slider:has(> .section-head) .carousel-btn{
    top:calc(50% + 20px) !important;
  }
}

@media (max-width:430px){
  .catalog-page .catalog-slider{
    padding-left:34px !important;
    padding-right:34px !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:-34px !important;
    margin-right:-34px !important;
    padding-left:34px !important;
    padding-right:34px !important;
    scroll-padding-left:34px !important;
    scroll-padding-right:34px !important;
  }
}

/* v10: cleaner slider gutters — cards align with content, arrows stay centered and visible */
@media (max-width:1024px){
  .catalog-page .catalog-slider{
    padding-left:0 !important;
    padding-right:0 !important;
    overflow:visible !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    padding-bottom:10px !important;
    scroll-padding-left:0 !important;
    scroll-padding-right:0 !important;
  }

  .catalog-page .catalog-slider .carousel-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    top:50% !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{
    left:-18px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next{
    right:-18px !important;
  }

  .catalog-page .catalog-slider:has(> .section-head) .carousel-btn{
    top:calc(50% + 22px) !important;
  }
}

@media (min-width:760px) and (max-width:900px){
  .catalog-page .catalog-slider{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    scroll-padding-left:0 !important;
    scroll-padding-right:0 !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{
    left:-18px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next{
    right:-18px !important;
  }
}

@media (max-width:760px){
  .catalog-page .catalog-slider{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    scroll-padding-left:0 !important;
    scroll-padding-right:0 !important;
  }

  .catalog-page .catalog-slider .carousel-btn{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{
    left:-14px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next{
    right:-14px !important;
  }

  .catalog-page .catalog-slider:has(> .section-head) .carousel-btn{
    top:calc(50% + 21px) !important;
  }
}

@media (max-width:430px){
  .catalog-page .catalog-slider{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .catalog-page .catalog-slider .catalog-track{
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    scroll-padding-left:0 !important;
    scroll-padding-right:0 !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev{
    left:-12px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next{
    right:-12px !important;
  }
}


/* v11 fixes */
@media (max-width: 1024px){
  .catalog-page .reviews-strip > .section-head{
    justify-content:flex-start !important;
    text-align:left !important;
    gap:10px;
  }
  .catalog-page .guide-block{
    padding-bottom:8px !important;
  }
}

/* v12 explicit fixes */
@media (max-width: 1024px) {
    /* 1) "Последние отзывы" — прижать заголовок влево */
    .catalog-page .reviews-strip {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .catalog-page .reviews-strip > .section-head {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        text-align: left !important;
        gap: 10px !important;
    }

    .catalog-page .reviews-strip > .section-head h2 {
        margin-left: 0 !important;
        padding-left: 0 !important;
        text-align: left !important;
    }

    .catalog-page .reviews-strip > .section-head .more {
        margin-left: auto !important;
    }

}

/* v13 final responsive spacing audit */
/* 48px — см. комментарий у первого v13-блока выше (было 64px) */
.catalog-page {
  max-width: 1280px !important;
  width: calc(100% - 48px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-bottom: 42px !important;
}

/* Мобильная полоса: те же 24px, что у базового .wrap и хедера
   (v13-правило с !important выше перебивает мобильный блок в шапке
   файла — поэтому переопределяем здесь, позже по порядку) */
@media (max-width: 760px) {
  .catalog-page {
    width: min(100% - 24px, 1280px) !important;
  }
}

.catalog-page > .section,
.catalog-page > .catalog-slider,
.catalog-page > .catalog-map-section,
.catalog-page > .breed-catalog,
.catalog-page > .guide-block {
  margin-top: 24px !important;
}

.catalog-page .breadcrumbs {
  margin-top: 18px !important;
  margin-bottom: 14px !important;
}

.catalog-page .catalog-title-block {
  margin-bottom: 14px !important;
}

.catalog-page .catalog-tags {
  margin-bottom: 20px !important;
}

.catalog-page .catalog-slider {
  overflow: visible !important;
}

.catalog-page .catalog-track,
.catalog-page .category-track {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.catalog-page .catalog-slider .carousel-btn.prev {
  left: -18px !important;
}

.catalog-page .catalog-slider .carousel-btn.next {
  right: -18px !important;
}

.catalog-page .catalog-map-section {
  margin-top: 18px !important;
}

@media (max-width: 1200px) {
  .catalog-page .reviews-strip > .section-head {
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .catalog-page .reviews-strip > .section-head .more {
    margin-left: 0 !important;
  }
}

@media (max-width: 1024px) {
  .catalog-page {
    width: calc(100% - 48px) !important;
    padding-bottom: 36px !important;
  }

  .catalog-page > .section,
  .catalog-page > .catalog-slider,
  .catalog-page > .catalog-map-section,
  .catalog-page > .breed-catalog,
  .catalog-page > .guide-block {
    margin-top: 22px !important;
  }

  .catalog-page .catalog-title-block h1 {
    max-width: 100% !important;
  }

  .catalog-page .catalog-tags {
    margin-bottom: 18px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev {
    left: -10px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next {
    right: -10px !important;
  }
}

@media (max-width: 760px) {
  .catalog-page {
    width: min(100% - 24px, 1280px) !important;
    padding-bottom: 32px !important;
  }

  .catalog-page .breadcrumbs {
    margin-top: 14px !important;
    margin-bottom: 12px !important;
  }

  .catalog-page .catalog-title-block {
    margin-bottom: 12px !important;
  }

  .catalog-page .catalog-title-block h1 {
    font-size: 28px !important;
    line-height: 1.12 !important;
  }

  .catalog-page .catalog-tags {
    gap: 8px !important;
    margin-bottom: 16px !important;
  }

  .catalog-page .catalog-tags a {
    height: 36px !important;
  }

  .catalog-page > .section,
  .catalog-page > .catalog-slider,
  .catalog-page > .catalog-map-section,
  .catalog-page > .breed-catalog,
  .catalog-page > .guide-block {
    margin-top: 20px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev {
    left: -8px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next {
    right: -8px !important;
  }

  .catalog-page .map-preview-head {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (max-width: 430px) {
  .catalog-page {
    width: calc(100% - 28px) !important;
  }

  .catalog-page .catalog-title-block h1 {
    font-size: 25px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.prev {
    left: -6px !important;
  }

  .catalog-page .catalog-slider .carousel-btn.next {
    right: -6px !important;
  }
}

/* Hotfix: district cards should not grow outside slider bounds on hover */
.catalog-page .catalog-slider .catalog-track .district-card {
  box-sizing: border-box !important;
  flex: 0 0 176px !important;
  width: 176px !important;
  min-width: 176px !important;
  max-width: 176px !important;
}

.catalog-page .catalog-slider .catalog-track .district-card:hover {
  transform: translateY(-3px) !important;
}

@media (max-width: 1024px) {
  .catalog-page .catalog-slider .catalog-track .district-card {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 64px) !important;
  }
}

/* Moved from catalog.html inline <style> */
@media (max-width: 1200px) {
  .catalog-page .reviews-strip > .section-head {
    align-items: flex-start !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .catalog-page .reviews-strip > .section-head .more {
    align-self: flex-start !important;
    margin-left: 0 !important;
    text-align: left !important;
  }
}
/* District chips: variable width by content, no text overflow */
.catalog-page .catalog-slider .catalog-track .district-card {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

.catalog-page .catalog-slider .catalog-track .district-card small {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (max-width: 1024px) {
  .catalog-page .catalog-slider .catalog-track .district-card {
    max-width: calc(100vw - 64px) !important;
  }
}

/* Align section H2 to the left in catalog */
.catalog-page .section-head {
  justify-content: flex-start !important;
  text-align: left !important;
}

.catalog-page .section-head h2 {
  margin-left: 0 !important;
  text-align: left !important;
}

/* Prevent hover-lift cards from being clipped by scroll tracks */
.catalog-page .catalog-track,
.catalog-page .category-track,
.catalog-page .reviews-strip .reviews.catalog-track {
  padding-top: 8px !important;
  padding-bottom: 10px !important;
}

/* ==========================================================================
   Stage 2 additions (PLAN.md §6)
   1) /add/ — pilотная страница нового layout (две карточки-выбора)
   2) breadcrumbs-compat — крошки старого роутера (ol.breadcrumb c
      schema.org микроразметкой) в контейнере нового дизайна
   ========================================================================== */

/* --- /add/ --- */
.add-hero {
  padding-top: 28px;
}

.add-hero h1 {
  margin: 0;
  font-size: 42px;
  line-height: 1.12;
  letter-spacing: -0.01em;
}

/* лид под h1 — как цитата: оранжевая черта слева, во всю ширину контейнера */
.add-hero-lead {
  margin: 18px 0 0;
  padding: 4px 0 4px 18px;
  border-left: 4px solid #ff8a21;
  font-size: 18px;
  line-height: 1.65;
  color: #3d3940;
}

.add-choices {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
  margin-top: 40px;
}

.add-choice {
  display: flex;
  flex-direction: column;
  padding: 32px;
  border: 1px solid #f0e6db;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(70, 42, 24, .06);
  transition: .2s;
}

.add-choice:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(70, 42, 24, .1);
}

.add-choice-icon {
  width: 78px;
  height: 78px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background: linear-gradient(135deg, #fff4ea, #ffe8d2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ff6400;
}

.add-choice-icon svg {
  width: 42px;
  height: 42px;
}

.add-choice h2 {
  margin: 0 0 10px;
  font-size: 24px;
  color: #231f20;
}

.add-choice > p {
  margin: 0 0 18px;
  color: #3d3940;
  font-size: 16px;
  line-height: 1.6;
}

.add-perks {
  list-style: none;
  margin: 0 0 24px;
  padding: 14px 16px;
  display: grid;
  gap: 10px;
  border-radius: 14px;
  background: #fff9f4;
}

.add-perks li {
  position: relative;
  padding-left: 28px;
  color: #3d3940;
  font-size: 15px;
  line-height: 1.5;
}

.add-perks li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #ffe8d2;
  color: #e05a00;
  font-size: 11px;
  font-weight: 800;
}

.add-choice .podbor-btn {
  width: 100%;
  margin-top: auto;
}

.add-choice .add-choice-note {
  margin: 22px 0 0;
  font-size: 14px;
  color: #8a7a72;
  line-height: 1.5;
}

.add-choice-note a {
  color: #ff6400;
}

/* /add/: ряд доверия внизу */
.add-trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: 40px 0 10px;
}

.add-trust-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  border: 1px solid #eee2d8;
  border-radius: 18px;
  background: #fffdfb;
  color: #ff6400;
}

.add-trust-item svg {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
}

.add-trust-item strong {
  display: block;
  margin-bottom: 5px;
  color: #231f20;
  font-size: 16px;
}

.add-trust-item span {
  display: block;
  color: #6b5c4e;
  font-size: 14px;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .add-hero {
    padding-top: 16px;
  }

  .add-hero h1 {
    font-size: 32px;
  }

  .add-trust {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .add-choices {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .add-choice {
    padding: 24px 20px;
  }
}

/* --- breadcrumbs-compat (старая микроразметка в новой обёртке).
   Формат — по макету new-ui/product.html: серые ссылки #606060 с
   оранжевым hover, 15px/500, разделители и текущий пункт #8a7668. --- */
.breadcrumbs-compat .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 15px;
}

.breadcrumbs-compat .breadcrumb-item + .breadcrumb-item::before {
  content: "›";
  color: #8a7668;
  margin-right: 9px;
}

.breadcrumbs-compat .breadcrumb-item a {
  color: #606060;
  text-decoration: none;
}

.breadcrumbs-compat .breadcrumb-item a:hover {
  color: #ff6400;
}

.breadcrumbs-compat .breadcrumb-item.active span,
.breadcrumbs-compat .breadcrumb-item[aria-current="page"] span {
  color: #8a7668;
}

.breadcrumbs-compat .breadcrumb-item meta {
  display: none;
}

/* ==========================================================================
   Stage 3b additions (каталоги: category / poroda / cat-ads / dec-list)
   Новые компоненты, отсутствовавшие в макетах new-ui:
   1) .catalog-sort — сортировка (дата/рейтинг);
   2) .catalog-pagination — адаптивная пагинация;
   3) .kennel-cards — сетка карточек питомников списка и объявлений
      (.ads-card — карточка объявления в стиле карточки питомника);
   4) .catalog-breed-card--text — порода без фото в алфавитном каталоге;
   5) .catalog-empty / .catalog-list-head / .catalog-intro.
   ========================================================================== */
.catalog-intro {
  max-width: 820px;
  margin: 10px 0 0;
  color: #777;
  line-height: 1.65;
}

/* SEO-предложение по теме в строке каталога (страницы тегов, разделы
   и «Мы нашли для вас … объявлен…» на страницах объявлений): число
   подсвечено плашкой .catalog-count; при переполнении — обрезка с «…» */
.catalog-seo-lead {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: #6b5d52;
  line-height: 1.65;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Отступ строки «Мы нашли для вас …» под h1 на страницах объявлений */
.catalog-title-block .catalog-seo-lead {
  margin-top: 10px;
}

.catalog-seo-lead .catalog-count {
  vertical-align: middle;
}

.catalog-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin: 26px 0 16px;
}

.catalog-count {
  font-size: 16px;
  font-weight: 700;
  color: #231f20;
}

.catalog-sort {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 100%
}

.catalog-sort .sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border: 1px solid #eee6de;
  border-radius: 999px;
  background: #fff;
  color: #777;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}

.catalog-sort .sort-btn:hover {
  border-color: #ffc49a;
  color: #231f20;
}

.catalog-sort .sort-btn.is-active {
  border-color: #ff8b15;
  background: #fff4ea;
  color: #ff6400;
}

/* три кнопки сортировки на узких экранах: компактнее, чтобы умещались
   (перенос строки даёт flex-wrap на .catalog-sort) */
@media (max-width: 430px) {
  .catalog-sort .sort-btn {
    padding: 7px 11px;
    font-size: 13px;
    gap: 5px
  }
}

/* --- сетка питомников --- */
.kennel-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}

/* «Таблица» из рамок самих карточек (контейнер без рамки): отрицательные
   margin схлопывают соседние линии, внешний контур идёт только по фактическим
   карточкам — при 2 питомниках рамка вокруг двух карточек, без полосы через
   всю ширину (инлайновое сжатие не подходит: фото с width:100% не позволяет
   вычислить ширину контента) */
.kennel-cards .kennel-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding: 0 14px 16px;
  border: 1px solid #eee2d8;
  margin: -1px 0 0 -1px;
  border-radius: 0;
  background: #fff;
  text-decoration: none;
  box-shadow: none;
  transition: background .18s ease;
}

.kennel-cards .kennel-card:hover {
  transform: none;
  border-color: #eee2d8;
  background: #fffaf5;
  box-shadow: none;
}

.kennel-cards .kennel-card b {
  font-size: 16px;
  color: #231f20;
  line-height: 1.3;
}

.kennel-cards .kennel-card span {
  font-size: 14px;
  font-weight: 700;
  color: #ff9a3d;
}

.kennel-cards .kennel-card small {
  color: #9b8d85;
  font-size: 13px;
}

.kennel-cards .kennel-card em {
  margin-top: auto;
  font-style: normal;
  font-size: 13px;
  font-weight: 700;
  color: #ff6400;
}

.kennel-cards-ad {
  grid-column: 1 / -1;
}

/* --- сетка объявлений --- */
/* Карточки объявлений (cat-ads / dec-list) строятся как карточка питомника:
   .kennel-card внутри .kennel-cards — та же «таблица» из рамок карточек с
   отрицательными margin, колонки 4→3→2→1 по общим брейкпоинтам сетки. */

/* Основная ссылка карточки (фото + контент) — flex-колонка как у .kennel-card */
.kennel-cards .ads-card-main {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1;
  color: inherit;
  text-decoration: none;
}

/* Ссылка на питомник объявления: нижняя плашка с разделителем в пол ширины карточки */
.kennel-cards .ads-card-pit {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: auto -14px -16px;
  padding: 10px 14px;
  border-top: 1px solid #eee2d8;
  font-size: 13px;
  font-weight: 700;
  color: #ff6400;
  text-decoration: none;
}

.kennel-cards .ads-card-pit:hover {
  color: #ff6400;
}

/* --- пагинация --- */
.catalog-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 32px 0 8px;
}

.catalog-pagination .pg-btn {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid #eee6de;
  border-radius: 12px;
  background: #fff;
  color: #231f20;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.catalog-pagination .pg-btn:hover {
  border-color: #ffc49a;
}

.catalog-pagination .pg-btn.is-disabled {
  opacity: .45;
  pointer-events: none;
}

.catalog-pagination .pg-pages {
  display: flex;
  align-items: center;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.catalog-pagination .pg-pages li a,
.catalog-pagination .pg-pages li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 8px;
  border-radius: 12px;
  border: 1px solid transparent;
  font-size: 14px;
  font-weight: 700;
  color: #231f20;
  text-decoration: none;
}

.catalog-pagination .pg-pages li a:hover {
  background: #fff4ea;
}

.catalog-pagination .pg-pages li.is-active span {
  background: linear-gradient(135deg, #ff8b15, #ff6400);
  color: #fff;
}

/* --- порода без фото в алфавитном каталоге --- */
.catalog-breed-card--text {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid #eee6de;
  border-radius: 14px;
  text-decoration: none;
}

.catalog-breed-card--text span {
  font-size: 15px;
  font-weight: 600;
  color: #231f20;
}

.catalog-breed-card--text:hover {
  border-color: #ffc49a;
  background: #fff8f1;
}

/* --- пустые разделы --- */
.catalog-empty {
  margin: 26px 0;
  padding: 24px;
  border: 1px dashed #eee6de;
  border-radius: 18px;
  background: #fffdfb;
  color: #777;
  line-height: 1.6;
}

.catalog-empty b {
  display: block;
  margin-bottom: 6px;
  font-size: 17px;
  color: #231f20;
}

.catalog-empty a {
  color: #ff6400;
}

/* Пустой каталог питомников (породы без питомников): иконка + текст по центру
   на десктопе, компактный столбик на мобильных */
.catalog-empty--kennels {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  text-align: left;
}

.catalog-empty--kennels .catalog-empty-ico {
  flex: 0 0 auto;
}

.catalog-empty--kennels .catalog-empty-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.catalog-empty--kennels b,
.catalog-empty--kennels p {
  display: block;
  margin: 0;
}

/* Питомники этой породы, когда объявлений нет (dec-list) */
.catalog-ads-related {
  margin: 22px 0 0;
}

/* Заголовки «Питомники этой породы», «Купить ... в Москве» и все h2/h3 в
   SEO-текстах — один компактный стиль (18px, серый, без иконки-лапы).
   h3 нужен: на городских страницах (@ /mo/sobaki/) контент из БД содержит
   h2 «Купить ... в Москве», который list.inc.php конвертирует в h3.
   Верхний отступ 20px — только у последующих заголовков секции: для первого
   (в т.ч. «Купить животных в питомнике Москвы» не первый на главной) верхний
   отступ задаёт layout.css (.seo-text--home h2:first-child { margin-top: 0 }). */
.section.seo-text h2,
.section.seo-text--home h2,
.section.seo-text h3,
.section.seo-text--home h3,
.catalog-ads-related h2,
.seo-text--ads .ads-seo-head {
  margin: 20px 0 16px;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #5e514a;
}

.section.seo-text h2:before,
.section.seo-text--home h2:before {
  content: none;
}

/* Старые костыли layout.css ([class*="cat-"] h3 и т.п.) раньше матчили
   .catalog-page целиком и красили все h3 каталога в чёрный, при наведении —
   в оранжевый #ff7a00. Костыли сужены до префикса cat- (см. блоки выше),
   этот фикс для заголовков SEO-блоков оставлен как страховка. */
.section.seo-text h2,
.section.seo-text--home h2,
.section.seo-text h3,
.section.seo-text--home h3,
.section.seo-text h2:hover,
.section.seo-text--home h2:hover,
.section.seo-text h3:hover,
.section.seo-text--home h3:hover {
  color: #5e514a !important;
}

/* SEO-фолбэк объявлений породы: без зелёных галочек (иконок) списка,
   обычные маркеры, как в старом дизайне */
.seo-text--ads {
  margin-bottom: 40px;
}

.seo-text--ads ul,
.seo-text--ads .seo-text-list {
  list-style: disc;
  padding-left: 20px;
}

.seo-text--ads ul li,
.seo-text--ads .seo-text-list li {
  position: static;
  padding-left: 0;
}

.seo-text--ads ul li::before,
.seo-text--ads .seo-text-list li::before {
  content: none;
}

/* Карточки блока «Питомники этой породы» используют общий «табличный» стиль
   и адаптивность .kennel-cards (рамки на самих карточках + отрицательные
   margin, колонки 4→3→2→1 по брейкпоинтам сетки) — как на страницах пород. */

/* Перебиваем mobile-fix layout.css (.section h2 { clamp(23px,6.5vw,30px) !important })
   — заголовкам SEO-текстов на мобильных нужно оставаться 18px */
@media (max-width: 640px) {
  .section.seo-text h2,
  .section.seo-text--home h2,
  .section.seo-text h3,
  .section.seo-text--home h3,
  .catalog-ads-related h2,
  .seo-text--ads .ads-seo-head {
    font-size: 18px !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em;
  }
}

@media (max-width: 600px) {
  .catalog-empty--kennels {
    flex-direction: column;
    text-align: center;
    gap: 10px;
    padding: 20px 16px;
  }

  .catalog-empty--kennels .catalog-empty-ico {
    width: 34px;
    height: 34px;
  }

  .catalog-empty--kennels b {
    font-size: 16px;
  }

  .catalog-empty--kennels p {
    font-size: 15px;
  }
}

@media (max-width: 768px) {
  .kennel-cards {
    grid-template-columns: repeat(2, 1fr);
  }

  .catalog-pagination .pg-pages {
    display: none;
  }
}

@media (max-width: 430px) {
  .kennel-cards {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   Stage 3d/3e additions: текстовые страницы, отзывы, города, контакт
   ========================================================================== */

/* --- типографика текстовых страниц (about/terms/person/poluchit-otziv/faq) --- */
.text-page {
  max-width: 860px;
  padding: 8px 0 24px;
}

/* --- широкие текстовые страницы (poluchit-otziv/terms/person/about):
   заголовок как на /faq/ + контент во всю ширину --- */
.text-page--wide {
  max-width: 100%;
  padding-top: 0; /* h1 вплотную к крошкам, как на /faq/ (без 8px обёртки) */
}

/* Цитата-карточка — те же параметры, что у .faq-page blockquote (Stage 3g).
   Самодостаточно: бордер и фон заданы здесь, а не в базовом .text-page blockquote,
   чтобы карточка одинаково выглядела вне зависимости от обёртки страницы */
.text-page.text-page--wide blockquote,
.contact-page blockquote {
  margin: 0 0 16px;
  padding: 14px 18px;
  border-left: 4px solid #ff6400;
  border-radius: 0 12px 12px 0;
  background: #fff4ea;
  color: #5e514a;
  font-size: 16px;
  line-height: 1.55;
}

.text-page .catalog-title-block h1 {
  margin: 0;
  padding: 0;
}

.text-page h1 {
  margin: 0 0 14px;
}

.text-page blockquote {
  margin: 0 0 18px;
  padding: 16px 20px;
  border-left: 4px solid #ff8b15;
  border-radius: 0 14px 14px 0;
  background: #fff4ea;
  color: #6b4a2f;
  line-height: 1.65;
}

.text-page .faq-section {
  margin: 0 0 22px;
  border: 1px solid #eee6de;
  border-radius: 20px;
  background: #fff;
  overflow: hidden;
}

.text-page .faq-section .section-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  border-bottom: 1px solid #f7ece3;
  background: #fffdfb;
}

.text-page .faq-section .section-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ff8b15, #ff6400);
  color: #fff;
  font-weight: 800;
  font-size: 15px;
}

.text-page .faq-section .section-title {
  margin: 0;
  font-size: 19px;
}

.text-page .faq-section .terms {
  padding: 14px 20px;
}

/* Пункт списка: висячий отступ через text-indent (не flex! — flex расщепляет
   inline-контент вроде <b> на отдельные колонки и ломает строку
   «Сайт (Агрегатор) – интернет-платформа …») */
.text-page .faq-section .terms p {
  margin: 0 0 10px;
  color: #555;
  line-height: 1.65;
  padding-left: 40px;
  text-indent: -40px;
}

.text-page .faq-section .terms p:last-child {
  margin-bottom: 0;
}

/* Вводные/служебные строки списка без галочки («за исключением:»,
   «Обратная связь») — тот же отступ, что у текста пунктов,
   но без висячего отступа первой строки */
.text-page .faq-section .terms p:not(:has(svg)) {
  padding-left: 40px;
  text-indent: 0;
}

/* Подвал «Дата последнего обновления» (голая секция в terms/person) —
   приглушённая служебная строка вместо сырого абзаца */
.text-page > section:not(.catalog-title-block):not(.faq-section) p {
  margin: 16px 0 0;
  color: #8a7a6e;
  font-size: 13px;
}

.text-page .faq-section .terms svg {
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}

.text-page .faq-section .terms svg path {
  fill: #7bb52d;
}

.text-page h2,
.text-page h3 {
  margin: 18px 0 10px;
  line-height: 1.35;
}

.text-page h2 { font-size: 22px; }
.text-page h3 { font-size: 18px; }

.text-page p {
  margin: 0 0 12px;
  color: #555;
  line-height: 1.7;
}

.text-page ul {
  margin: 0 0 14px;
  padding-left: 20px;
  color: #555;
  line-height: 1.7;
}

/* --- города --- */
.cities-filter {
  width: 100%;
  max-width: 420px;
  margin-bottom: 18px;
  padding: 12px 16px;
  border: 1px solid #eee6de;
  border-radius: 14px;
  font: inherit;
  font-size: 15px;
  background: #fff;
}

.cities-filter:focus {
  outline: 0;
  border-color: #ffc49a;
  box-shadow: 0 0 0 3px #fff1e6;
}

.cities-letter {
  margin: 22px 0 10px;
  padding-bottom: 6px;
  border-bottom: 2px solid #f0e6db;
  font-size: 22px;
  color: #ff6400;
}

/* Сетка городов СТРАНИЦЫ /goroda/ — скоуп под .cities-catalog, чтобы не
   конфликтовать с компонентом .cities главной (5 в строку из layout.css) */
.cities-catalog .cities {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

@media (max-width: 900px) { .cities-catalog .cities { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .cities-catalog .cities { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 430px) { .cities-catalog .cities { grid-template-columns: 1fr; } }

/* --- отзывы (страница отзывов раздела) --- */
.reviews-full-list {
  display: grid;
  gap: 16px;
}

.review-full {
  padding: 20px 22px;
  border: 1px solid #eee6de;
  border-radius: 20px;
  background: #fff;
}

.review-full-top {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.review-full-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: #fff0df;
  color: #ff6400;
  font-weight: 800;
}

.review-full-name b {
  margin-right: 8px;
}

.review-full-name small {
  color: #9b8d85;
}

.review-full-stars {
  margin-left: auto;
  color: #ffab19;
  letter-spacing: 2px;
}

.review-full-kennel {
  margin: 0 0 8px;
  color: #777;
}

.review-full-kennel a {
  color: #ff6400;
}

.review-full > p {
  margin: 0;
  color: #444;
  line-height: 1.65;
}

.review-full-answer {
  margin-top: 12px;
  padding: 12px 14px;
  border-left: 3px solid #7bb52d;
  border-radius: 0 12px 12px 0;
  background: #f6f9ee;
  color: #55663c;
  line-height: 1.6;
}

.review-full-answer b {
  display: block;
  margin-bottom: 4px;
}

/* --- контакт: капча --- */
.contact-captcha {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 12px 0 16px;
}

.contact-captcha img {
  border: 1px solid #eee6de;
  border-radius: 10px;
  background: #fff;
}

.contact-captcha input {
  max-width: 240px;
  border: 1px solid #eee6de;
  border-radius: 14px;
  padding: 12px 14px;
  font: inherit;
  font-size: 15px;
}

.contact-captcha .review-form-hint {
  width: 100%;
}

/* --- Вводный список раздела («мы нашли для вас N питомников…») —
   перенос list6b старого сайта; стиль как у SEO-списка главной --- */
.catalog-intro-list {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
}

.catalog-intro-list li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 8px;
  color: #55503f;
  line-height: 1.6;
}

.catalog-intro-list li:last-child {
  margin-bottom: 0;
}

.catalog-intro-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 21px;
  height: 21px;
  border-radius: 999px;
  background: #f0f7e6;
  color: #7bb52d;
  font-size: 12px;
  font-weight: 800;
}

/* --- Карта раздела: блёклый предпросмотр в свёрнутом виде --- */
/* Эффект макета (.catalog-map.is-collapsed iframe) распространён на наш
   div#mapList (Яндекс.Карты API вместо iframe-виджета) */
.catalog-map.is-collapsed #mapList {
  min-height: 260px;
  transform: translateY(-86px);
  filter: saturate(.92);
  pointer-events: none;
}

@media (max-width: 760px) {
  .catalog-map.is-collapsed #mapList {
    transform: translateY(-76px);
  }
}

/* Карта не «схлоптывается» при скрытии меткой (API требует размеров) */
#mapList .ymap-container,
#mapList > ymaps {
  width: 100%;
  height: 100%;
}

/* --- Карта раздела: развёрнутая — во всю высоту блока (было 420px в макете) --- */
.catalog-map-section .catalog-map:not(.is-collapsed) {
  height: 560px;
  min-height: 560px;
  max-height: none;
}

.catalog-map-section .catalog-map:not(.is-collapsed) #mapList {
  min-height: 0;
}

@media (max-width: 760px) {
  .catalog-map-section .catalog-map:not(.is-collapsed) {
    height: 420px;
    min-height: 420px;
  }
}

/* --- Карта раздела: ширина по контентному блоку (.wrap), без full-bleed --- */
/* Секция лежит внутри main.wrap и наследует его ширину — специальных правил не требуется. */

/* Развёрнутая карта — во всю ширину и высоту блока */
.catalog-map-section .catalog-map:not(.is-collapsed) {
  width: 100%;
  height: 560px;
  min-height: 560px;
  max-height: none;
  border-radius: 0;
}

/* Канва ymaps растягивается контейнером (высоту фиксирует fitToViewport) */
.catalog-map #mapList > ymaps,
.catalog-map #mapList ymaps:nth-child(1) {
  width: 100% !important;
  height: 100% !important;
}

@media (max-width: 760px) {
  .catalog-map-section .catalog-map:not(.is-collapsed) {
    height: 420px;
    min-height: 420px;
  }
}

/* --- Карта раздела — как на старом pitomniki.su/sobaki/ ---
   Полоска 100px с белым градиентом поверх карты, кнопка «Развернуть карту»
   (стиль макета), разворачивание в полный размер без сворачивания обратно.
   Раскрытие: пружинная кривая высоты + «приближение» канваса (scale),
   углубление тени и тающий blur-градиент. */
.catalog-map-section .site-map-container {
  position: relative;
  width: 100%;
  height: 110px;
  overflow: hidden;
  border-radius: 18px;
  box-shadow: 0 8px 25px rgba(35, 31, 32, .12);
  transition:
    height .7s cubic-bezier(.22, 1.12, .36, 1),
    border-radius .7s cubic-bezier(.22, 1.12, .36, 1),
    box-shadow .7s ease;
  margin: 44px 0 10px;
}

.catalog-map-section .site-map-container.expanded {
  height: 560px;
  border-radius: 14px;
  box-shadow: 0 18px 44px rgba(35, 31, 32, .17);
}

.catalog-map-section #mapList {
  width: 100%;
  height: 100%;
  /* свёрнутая карта чуть «приближена», при раскрытии плавно отъезжает */
  transform: scale(1.06);
  transition: transform .7s cubic-bezier(.22, 1.12, .36, 1);
}

.catalog-map-section .site-map-container.expanded #mapList {
  transform: scale(1);
}

.catalog-map-section .site-map-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom,
    rgba(255, 255, 255, .82) 0%,
    rgba(255, 255, 255, .62) 25%,
    rgba(255, 248, 241, .38) 55%,
    rgba(255, 253, 251, .86) 100%);
  backdrop-filter: blur(2px) saturate(.92);
  pointer-events: none;
  transition: opacity .55s ease, backdrop-filter .55s ease;
}

.catalog-map-section .site-map-overlay.hidden {
  opacity: 0;
  backdrop-filter: blur(0) saturate(1);
}

@media (max-width: 760px) {
  .catalog-map-section .site-map-container.expanded {
    height: 420px;
  }
}

/* --- Кнопка «Развернуть карту» — как на старом pitomniki.su/sobaki/:
   пилюля по центру карты (снизу), с иконкой-развернуть, скрывается после клика --- */
.catalog-map-section .show-full-map-btn {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 12px 24px;
  border: 1px solid #ffd1ad;
  border-radius: 999px;
  background: #fff;
  color: #55503f;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(35, 31, 32, .18);
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, color .25s ease, opacity .32s ease;
  z-index: 5;
}

.catalog-map-section .show-full-map-btn svg {
  color: #ff6400;
}

.catalog-map-section .show-full-map-btn:hover {
  background: #ff6400;
  border-color: #ff6400;
  color: #fff;
  transform: translateX(-50%) translateY(-2px);
  box-shadow: 0 12px 30px rgba(255, 106, 0, .28);
}

/* Уход кнопки после клика: fade + лёгкое «падение» вниз с уменьшением */
.catalog-map-section .show-full-map-btn.closing {
  opacity: 0;
  transform: translateX(-50%) translateY(10px) scale(.92);
  pointer-events: none;
}

.catalog-map-section .show-full-map-btn:hover svg {
  color: #fff;
}

.catalog-map-section .site-map-container {
  margin-top: 26px;
}

@media (max-width: 760px) {
  .catalog-map-section .show-full-map-btn {
    max-width: calc(100% - 24px);
    min-height: 40px;
    padding: 10px 16px;
    gap: 8px;
    font-size: 13px;
    white-space: nowrap;
  }
  .catalog-map-section .show-full-map-btn svg {
    flex: none;
  }
}

/* --- «Топ питомников»: фото-баннер во всю ширину карточки (вписано, крупнее) --- */
.kennel-track .kennel-card {
  flex-basis: 280px;
  min-height: 260px;
  align-content: start;
  padding: 0 0 12px;
  overflow: hidden;
}

.kennel-track .kennel-card img {
  width: 100%;
  height: 130px;
  object-fit: cover;
  border-radius: 14px 14px 0 0;
  margin-bottom: 8px;
  background: #f7ece3;
}

.kennel-track .kennel-card b,
.kennel-track .kennel-card span,
.kennel-track .kennel-card small,
.kennel-track .kennel-card em {
  padding-left: 14px;
  padding-right: 14px;
}

.kennel-track .kennel-card em {
  margin-top: auto;
}

@media (max-width: 430px) {
  .kennel-track .kennel-card { flex-basis: 82%; }
  .kennel-track .kennel-card img { height: 120px; }
}

/* --- «Путеводитель» на странице раздела: ссылки — чипами, как блок
   «Популярно:» в шаблоне (styles .chip из layout.css), независимо от
   классов в HTML ссылок из cms_link --- */
.guide-block .popular {
  margin-top: 12px;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.guide-block .popular a {
  display: inline-block;
  padding: 8px 15px;
  border: 1px solid #eee4dc;
  border-radius: 999px;
  background: #fff;
  color: #635a55;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: .2s;
}

.guide-block .popular a:hover,
.guide-block .popular a:focus-visible {
  color: #ff6400;
  border-color: #ffc49a;
  background: #fff4ea;
  box-shadow: 0 8px 18px rgba(255, 106, 0, .12);
  outline: 0;
}

/* «Популярно:» на мобильных — метка отдельной строкой, каждый тег на всю ширину */
@media (max-width: 760px) {
  .catalog-page .guide-block .popular .popular-label,
  .catalog-page .guide-block .popular a {
    flex-basis: 100%;
  }
}

/* --- Карточка питомника в списке: дизайн каталога (макет) --- */
.kennel-cards .kennel-card {
  position: relative;
}

/* Фото: выровнено с контентом (отступы даёт padding карточки, как у названия);
   бейджи поверх */
.kennel-cards .kennel-card .kennel-photo {
  position: relative;
  align-self: stretch;
  margin: 14px 0 10px;
}

.kennel-cards .kennel-card .kennel-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 12px;
  background: #f7ece3;
}

/* Счётчик фото: правый верхний угол (+ карточки объявлений на главной) */
.kennel-cards .kennel-card .kennel-photo-cnt,
.cards .card .kennel-photo-cnt {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(35, 31, 32, .72);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}

.kennel-cards .kennel-card .kennel-photo-cnt svg,
.cards .card .kennel-photo-cnt svg {
  width: 12px;
  height: 12px;
}

/* Бейджи на фото: система (слева, зелёный текст) и опыт (справа) */
.kennel-cards .kennel-card .kennel-badge {
  position: absolute;
  bottom: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  max-width: calc(100% - 20px);
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .93);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kennel-cards .kennel-card .kennel-badge-system {
  left: 10px;
  color: #2f9e44;
}

.kennel-cards .kennel-card .kennel-badge-exp {
  right: 10px;
  color: #231f20;
}

.kennel-cards .kennel-card .kennel-rating {
  font-size: 14px;
  font-weight: 700;
  color: #ff9a3d;
}

.kennel-cards .kennel-card .kennel-breeds {
  color: #8a7668;
  font-size: 13px;
  line-height: 1.35;
}

.kennel-cards .kennel-card .kennel-price {
  font-size: 16px;
  font-weight: 800;
  color: #231f20;
}

/* Инфо-строки: адрес (оранжевый пин) и метро (как в старом сайте) */
.kennel-cards .kennel-card .kennel-card-info {
  align-self: stretch;
  display: grid;
  gap: 5px;
  margin-top: 2px;
  font-size: 12.5px;
  line-height: 1.4;
}

.kennel-cards .kennel-card .kennel-line-txt {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kennel-cards .kennel-card .kennel-addr {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  color: #ff6400;
  font-weight: 600;
}

.kennel-cards .kennel-card .kennel-addr svg {
  flex: 0 0 12px;
  width: 12px;
  height: 12px;
  fill: #ff6400;
}

.kennel-cards .kennel-card .kennel-metro {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #231f20;
  font-weight: 600;
}

.kennel-cards .kennel-card .kennel-metro-dot {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9b8d85;
}

/* Дистанция до метро: пилюля как в старом сайте (.metro-m) */
.kennel-cards .kennel-card .metro-m {
  flex: 0 0 auto;
  padding: 2px 7px;
  border-radius: 999px;
  background: #cbdce9;
  color: #231f20;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}

.kennel-cards .kennel-card .kennel-sub {
  color: #9b8d85;
  font-size: 12px;
}

/* --- Слайдер пород на страницах тегов: компактные плашки --- */
.breeds-slider .district-card {
  min-height: 42px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 14.5px;
}

.breeds-slider .district-card small {
  display: none;
}

.breeds-slider .carousel-btn {
  top: 50%;
  transform: translateY(-50%);
}

/* Плашки пород: не сжимаются, шаг стрелок = ширина карточки */
.breeds-slider .district-card {
  flex: 0 0 auto;
}

/* Текущая порода на странице породы (/sobaki/siba-inu/) */
.breeds-slider .district-card.is-active {
  border-color: #ffc49a;
  background: #fff4ea;
  color: #ff6400;
}

/* --- Компактные слайдеры-плашки (округа и типы пород на /sobaki/, /koshki/;
   тот же стиль, что у слайдера пород на страницах тегов) --- */
.pills-slider .district-card,
.breeds-slider .district-card {
  min-height: 42px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 14.5px;
}

.pills-slider .district-card small,
.breeds-slider .district-card small {
  display: none;
}

.pills-slider .carousel-btn,
.breeds-slider .carousel-btn {
  top: 50%;
  transform: translateY(-50%);
}

/* --- Слайдеры и плашки: текст карточек — не жирный --- */
.catalog-page .catalog-slider .district-card,
.catalog-page .pills-slider .district-card,
.catalog-page .breeds-slider .district-card,
.catalog-page .category-block .district-card,
.catalog-page .category-track a,
.catalog-page .catalog-tags a {
  font-weight: 400;
}

/* --- Форма подписки на новые помёты (страницы пород) — из старого css/style.css --- */
.subscription-card {
    background: #ffffff;
    border: 1px solid #e8e8e8;
    border-radius: 12px;
    padding-left: 32px;
    padding-right: 32px;
    padding-top: 10px;
    padding-bottom: 10px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease;
	margin-top: 30px;
}

.subscription-card:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Шапка карточки */
.subscription-container .card-header {
    text-align: center;
	background-color: white;
	border-bottom: none;
}

.subscription-container .card-footer {
	background-color: white;
	margin: 0;
	padding: 0;
}

.subscription-container .breed-title {
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

.subscription-container .breed-subtitle {
    font-size: 14px;
    color: #666;
    font-weight: 400;
}

/* Группа ввода */
.subscription-container .input-group {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    position: relative;
}

.subscription-container .email-input {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    font-family: inherit;
    background: #fafafa;
    transition: all 0.2s ease;
    outline: none;
}

.subscription-container .email-input:focus {
    border-color: #007AFF;
    background: #ffffff;
    box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.1);
}

.subscription-container .email-input::placeholder {
    color: #999;
}

.subscription-container .card-footer p {
    color: #888;
    margin: 4px 0 4px 0;
}

.subscription-card a {
    color: #F7941D;
}

/* Кнопка отправки */
.subscription-container .submit-btn {
    padding: 12px 20px;
    background: #007AFF;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
    min-width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

@media (max-width: 480px) {
	.subscription-container .input-group {
		flex-direction: column;
	}
	.subscription-container .email-input,
	.subscription-container .submit-btn {
		width: 100%;
	}
}

.subscription-container .submit-btn:hover:not(:disabled) {
    background: #0056CC;
    transform: translateY(-1px);
}

.subscription-container .submit-btn:active:not(:disabled) {
    transform: translateY(0);
}

.subscription-container .submit-btn:disabled {
    background: #ccc;
    cursor: not-allowed;
    transform: none;
}

/* Сообщение об успехе */
.subscription-container .success-message {
    display: none;
    background: #ffffff;
    border: 1px solid #e8e8e8;
    border-radius: 12px;
    padding: 32px;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    animation: fadeIn 0.3s ease;
	margin-top: 30px;
}

.subscription-container .success-icon {
    width: 48px;
    height: 48px;
    background: #34C759;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    margin: 0 auto 16px;
}

.subscription-container .success-message h3 {
    font-size: 20px;
    font-weight: 600;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.subscription-container .success-message p {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
}

.subscription-container .close-btn {
    padding: 10px 20px;
    background: #f8f8f8;
    color: #1a1a1a;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

.subscription-container .close-btn:hover {
    background: #f0f0f0;
    border-color: #ddd;
}

#confirmedEmail {
    font-weight: 500;
    color: #1a1a1a;
}

/* Анимация появления сообщения об успехе */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Состояние отправки подписки: конверт улетает из кнопки */
.subscription-container .submit-btn .btn-loader {
    display: none;
}

.subscription-container .submit-btn.loading {
    pointer-events: none;
}

/* Кнопка остаётся синей во время отправки (не гаснет в серый disabled) */
.subscription-container .submit-btn.loading:disabled {
    background: #007AFF;
    opacity: 0.85;
}

.subscription-container .submit-btn.loading .btn-loader {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: calc(100% + 2px);
    left: 50%;
}

.subscription-container .submit-btn.loading .loader {
    font-size: 18px;
    line-height: 1;
    opacity: 0;
    animation: subscription-letter 1.3s ease-in infinite;
    transform: translateX(-50%);
}

@keyframes subscription-letter {
    0%   { transform: translateX(-50%) translateY(0) rotate(0deg); opacity: 0; }
    12%  { opacity: 1; }
    35%  { opacity: 1; }
    100% { transform: translateX(-50%) translateY(-46px) rotate(10deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .subscription-container .submit-btn.loading .loader {
        animation: none;
        opacity: 1;
    }
}

/* ==========================================================================
   Stage 3f — Подбор породы (/sobaki/podbor/, тип podbor-dog)
   Каркас: тест-карточка + сайдблок «почему стоит пройти», результаты.
   Логика (сессия/вопросы/POST) — в роутере и podbor/, здесь только вид.
   ========================================================================== */
.podbor-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}

.podbor-steps{display:flex;flex-wrap:wrap;align-items:center;gap:9px;max-width:820px;margin:10px 0 0;color:#777;line-height:1.5}
.podbor-steps span{font-weight:800}
.podbor-steps i{font-style:normal;color:#ffab19;font-weight:900}

.podbor-card{padding:24px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 12px 32px rgba(70,42,24,.06)}

.podbor-progress{height:8px;border-radius:999px;background:#f3eae1;overflow:hidden}
.podbor-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ffab19,#ff6400);transition:width .3s ease}

.podbor-step{margin:14px 0 4px;color:#8a7a72;font-size:13px;font-weight:700}
.podbor-step b{color:#ff6400}
.podbor-question{margin:0 0 18px;font-size:26px;line-height:1.2;letter-spacing:-.02em;color:#231f20}

.podbor-options{display:grid;gap:10px}
.podbor-option{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:13px 16px;border:2px solid #eee6de;border-radius:13px;background:#fff;cursor:pointer;font-weight:750;color:#231f20;transition:.2s}
.podbor-option:hover{border-color:#ffc49a;background:#fffaf5}
.podbor-option input{position:absolute;opacity:0;pointer-events:none}
.podbor-option-mark{flex:0 0 22px;width:22px;height:22px;border:2px solid #e0d2c4;border-radius:50%;background:#fff;transition:.15s}
.podbor-option input:checked ~ .podbor-option-mark{border-color:#ff6400;background:radial-gradient(circle,#ff6400 0 5px,#fff 6px)}
.podbor-option:has(input:checked){border-color:#ff6400;background:#fff4ea;box-shadow:0 8px 18px rgba(255,106,0,.12)}
.podbor-option-text{line-height:1.3}

.podbor-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}
.podbor-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 28px;border:0;border-radius:12px;background:linear-gradient(135deg,#ffab19,#ff6400);color:#fff;font-weight:900;font-size:15px;text-decoration:none;cursor:pointer;transition:.2s}
.podbor-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(255,106,0,.35)}
.podbor-btn:disabled{background:#e7ddd3;box-shadow:none;transform:none;cursor:not-allowed}
.podbor-btn--ghost{border:2px solid #ffd1ad;background:#fff;color:#ff6400}
.podbor-btn--ghost:hover{background:#fff4ea;box-shadow:none}

.podbor-result-lead{margin:0 0 16px;font-size:17px;line-height:1.5;color:#231f20}
.podbor-breeds{display:grid;gap:14px}
.podbor-breed{padding:20px;border:1px solid #eee6de;border-radius:16px;background:#fff;box-shadow:0 7px 18px rgba(68,42,25,.07);transition:.25s}
.podbor-breed:hover{transform:translateY(-2px);border-color:#ffc49a}
.podbor-breed-head{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.podbor-breed-num{display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:#ff6400;color:#fff;font-weight:900;font-size:16px}
.podbor-breed-head h2{margin:0;font-size:21px;line-height:1.2;color:#231f20}
/* Кнопка-ссылка на питомники породы: яркая CTA. ≥901px — пилюля справа
   от названия, ≤900px — во всю ширину карточки (удобный тап-таргет 46px). */
.podbor-breed-link{display:inline-flex;align-items:center;justify-content:center;gap:9px;margin-left:auto;min-height:46px;padding:11px 20px;border:0;border-radius:12px;background:linear-gradient(135deg,#ffab19,#ff6400);color:#fff;font-weight:900;font-size:14px;line-height:1.2;text-decoration:none;box-shadow:0 8px 18px rgba(255,106,0,.28);transition:.2s}
.podbor-breed-link:visited{color:#fff}
.podbor-breed-link:hover,.podbor-breed-link:focus-visible{transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,106,0,.42);color:#fff;outline:0}
.podbor-breed-link i{font-style:normal;font-weight:900;font-size:17px;line-height:1;transition:transform .2s}
.podbor-breed-link:hover i,.podbor-breed-link:focus-visible i{transform:translateX(3px)}
.podbor-breed-list{margin:0;padding:0;list-style:none;display:grid;gap:7px}
.podbor-breed-list li{position:relative;padding-left:18px;color:#554a43;line-height:1.5}
.podbor-breed-list li:before{content:"•";position:absolute;left:0;top:0;color:#ff8a21;font-weight:900}
.podbor-breed-list b{color:#231f20}

.podbor-empty{padding:22px;border:1px solid #eee6de;border-radius:16px;background:#fffaf5}
.podbor-empty h2{margin:0 0 8px;font-size:20px;color:#231f20}
.podbor-empty p{margin:0;color:#554a43;line-height:1.5}
.podbor-restart{display:flex;justify-content:center;margin-top:20px}

.podbor-aside{padding:20px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(70,42,24,.06)}
.podbor-aside h2{margin:0 0 12px;font-size:18px;line-height:1.25;color:#231f20}
.podbor-aside ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.podbor-aside li{position:relative;padding-left:28px;color:#554a43;line-height:1.45;font-size:14px}
.podbor-aside li:before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:#f2f9e6;color:#7bb52d;font-weight:900;text-align:center;line-height:20px;font-size:12px}
.podbor-aside b{color:#231f20}

.podbor-seo .podbor-seo-title{margin:0 0 10px;font-size:20px;color:#231f20}
.podbor-seo .podbor-seo-list{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.podbor-seo .podbor-seo-list li{position:relative;padding-left:24px;color:#554a43;line-height:1.55}
.podbor-seo .podbor-seo-list li:before{content:"✓";position:absolute;left:0;color:#7bb52d;font-weight:900}

@media(max-width:900px){
  .podbor-layout{grid-template-columns:1fr}
  .podbor-card{padding:18px 16px}
  .podbor-question{font-size:22px}
  .podbor-breed-link{flex-basis:100%;justify-content:space-between;padding:13px 16px;font-size:15px}
}
@media(max-width:430px){
  .podbor-nav{flex-direction:column-reverse;align-items:stretch}
  .podbor-btn{width:100%}
  .podbor-options{gap:8px}
}

/* ==========================================================================
   Stage 3g — Вопросы и ответы (/faq/, тип faq).
   Контент — общий inc/faq.content.inc.php (разметка старого сайта),
   все правила скоупом .faq-page, старый дизайн не затрагивается.
   Секции-карточки, вопросы-аккордеон (.js-acc вешает JS шаблона).
   ========================================================================== */
.faq-page blockquote{margin:0 0 16px;padding:14px 18px;border-left:4px solid #ff6400;border-radius:0 12px 12px 0;background:#fff4ea;color:#5e514a;font-size:16px;line-height:1.55}

/* Чипы-якоря по секциям (строит JS шаблона) */
.faq-nav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}
.faq-nav .chip{background:#fff}

/* Секция = карточка */
.faq-page .faq-content{display:grid;gap:16px}
.faq-page .faq-section{padding:0 22px 22px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 12px 32px rgba(70,42,24,.06);overflow:hidden}
/* Заголовок-плашка как на /poluchit-otziv/ (.text-page): фон, бордер снизу,
   градиентный номер; отрицательный маргин растягивает плашку на всю карточку */
.faq-page .section-header{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin:0 -22px;padding:18px 22px;background:#fffdfb;border-bottom:1px solid #f7ece3}
.faq-page .section-number{display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;border-radius:999px;background:linear-gradient(135deg,#ff8b15,#ff6400);color:#fff;font-weight:800;font-size:15px}
.faq-page .section-title{margin:0;font-size:20px;line-height:1.2;letter-spacing:-.01em;color:#231f20;flex:1 1 0;min-width:0}
/* Ссылка-действие секции (в контенте — .widget.tags > .tagcloud > a) */
.faq-page .section-header .widget{margin:0 0 0 auto}
.faq-page .tagcloud a{display:inline-flex;align-items:center;min-height:38px;padding:8px 16px;border:2px solid #ffd1ad;border-radius:12px;background:#fff;color:#ff6400;font-weight:900;font-size:13px;text-decoration:none;transition:.2s}
.faq-page .tagcloud a:hover{background:#fff4ea;transform:translateY(-1px)}

/* Вопрос-ответ: аккордеон */
.faq-page .faq-item{border-bottom:1px solid #f3eae1}
.faq-page .faq-item:last-child{border-bottom:0}
.faq-page .question{display:flex;align-items:center;gap:8px;padding:14px 26px 14px 2px;position:relative;font-weight:800;font-size:15.5px;line-height:1.35;color:#231f20;cursor:default}
.faq-page .faq-item.js-acc .question{cursor:pointer}
.faq-page .faq-item.js-acc .question:hover{color:#ff6400}
.faq-page .question svg{flex:0 0 22px;width:22px;height:22px;padding:0!important}
.faq-page .question svg path{fill:#7bb52d;transition:.2s}
.faq-page .faq-item.js-acc .question:hover svg path{fill:#ff6400}
/* Шеврон аккордеона */
.faq-page .faq-item.js-acc .question:after{content:"";position:absolute;right:4px;top:50%;width:9px;height:9px;border-right:2.5px solid #c9b8a9;border-bottom:2.5px solid #c9b8a9;transform:translateY(-70%) rotate(45deg);transition:.2s}
.faq-page .faq-item.is-open .question:after{transform:translateY(-30%) rotate(225deg);border-color:#ff6400}
.faq-page .answer{display:none;padding:0 30px 16px 32px;color:#554a43;font-size:15px;line-height:1.6}
.faq-page .faq-item.is-open .answer{display:block}
.faq-page .answer a{color:#ff6400;font-weight:700}
.faq-page .answer a:hover{text-decoration:underline}

@media(max-width:760px){
  .faq-page .faq-section{padding:0 14px 16px}
  .faq-page .section-header{margin:0 -14px;padding:16px 14px}
  /* Заголовок — в строку с цифрой (без переноса); кнопка-действие — во всю ширину ниже */
  .faq-page .section-title{font-size:19px}
  .faq-page .section-header .widget{flex:1 1 100%;margin:2px 0 0}
  .faq-page .section-header .widget .tagcloud a{width:100%;justify-content:center}
  .faq-page .answer{padding:0 4px 14px 32px}
}
@media(max-width:430px){
  .faq-page .question{font-size:14.5px;padding-right:22px}
  .faq-page .answer{font-size:14px}
  .faq-nav{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
  .faq-nav::-webkit-scrollbar{display:none}
  .faq-nav .chip{flex:0 0 auto}
}

/* ==========================================================================
   Stage 3h — Районы (/{cat}/rayony/, тип rayony).
   Сетка ссылок — компонент макета .category-grid (без новых правил);
   здесь только превью-список под h1 (из $HeadArr['preview'] роутера).
   ========================================================================== */
.rayony-intro{margin-top:10px}
.rayony-intro .rayony-intro-list{margin:0;padding:0;list-style:none;display:grid;gap:8px;max-width:820px}
.rayony-intro .rayony-intro-list li{position:relative;padding-left:24px;color:#5e514a;font-size:15px;line-height:1.55}
.rayony-intro .rayony-intro-list li:before{content:"✓";position:absolute;left:0;color:#7bb52d;font-weight:900}
/* Слой выше глобально прячет .category-grid (на страницах каталогов его
   заменил слайдер .category-track); на странице районов возвращаем сетку */
.breed-catalog .category-grid{display:grid}

/* ==========================================================================
   Stage 3i — статические страницы (add, contact, about, terms, person,
   poluchit-otziv): общий полиш .text-page + отдельные блоки страниц.
   ========================================================================== */
/* Карточки секций — с тенью и hover */
.text-page h1{padding-bottom:16px}
.text-page .faq-section{box-shadow:0 12px 32px rgba(70,42,24,.07);transition:.2s}
.text-page .faq-section:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(70,42,24,.1)}
.text-page .faq-section .section-header{padding:18px 22px}
.text-page .faq-section .section-title{font-size:20px;flex:1 1 0;min-width:0}
.text-page .faq-section .terms{padding:16px 22px}

/* CTA-баннер (poluchit-otziv; переиспользуется другими текстовыми) */
.text-cta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin:24px 0 8px;padding:24px;border:1px solid #ffd1ad;border-radius:18px;background:linear-gradient(135deg,#fff8f1,#fff4ea);box-shadow:0 12px 30px rgba(255,106,0,.1)}
.text-cta b{display:block;font-size:19px;line-height:1.3;color:#231f20}
.text-cta p{margin:6px 0 0;color:#5e514a;font-size:14px;line-height:1.5}
.text-cta .podbor-btn{margin-left:auto;flex:0 0 auto}

/* Контакты: форма + инфо-карточка */
.contact-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.contact-aside{padding:22px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(70,42,24,.06)}
.contact-aside h2{margin:0 0 10px;font-size:20px;color:#231f20}
.contact-aside-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #f3eae1}
.contact-aside-item:last-child{border-bottom:0;padding-bottom:0}
.contact-aside-item i{flex:0 0 40px;width:40px;height:40px;border-radius:12px;background:#fff4ea;display:inline-flex;align-items:center;justify-content:center}
.contact-aside-item i svg{width:20px;height:20px;fill:none;stroke:#ff6400;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.contact-aside-item b{display:block;font-size:17px;color:#231f20;line-height:1.3}
.contact-aside-item span{display:block;margin-top:3px;color:#5e514a;font-size:15px;line-height:1.5}
.contact-aside-item a{color:#ff6400;font-weight:700;text-decoration:none}
.contact-aside-item a:hover{text-decoration:underline}

/* Карточка формы «Написать нам» */
.contact-box{padding:22px;border:1px solid #f0e6db;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(70,42,24,.06)}
.contact-box h2{margin:0 0 10px;font-size:20px;color:#231f20}
/* Кнопка «Отправить» — прижата вправо; на мобиле — во всю ширину */
.contact-page .review-form-actions{display:flex;justify-content:flex-end}

/* Форма (.review-form) — общая для отзыва на странице питомника и /contact/.
   Перенесено из product.css: catalog.css грузится на всех типах страниц,
   а на /contact/ формы раньше оставались без стилей. Инпут email добавлен
   в селекторы — в contact-форме он type="email". */
.review-form textarea,
.review-form input[type="text"],
.review-form input[type="email"] {
  width: 100%;
  border: 1px solid #eee6de;
  border-radius: 14px;
  padding: 12px 14px;
  font: inherit;
  font-size: 15px;
  color: #231f20;
  background: #fffdfb;
}

.review-form textarea:focus,
.review-form input[type="text"]:focus,
.review-form input[type="email"]:focus {
  outline: 0;
  border-color: #ffc49a;
  box-shadow: 0 0 0 3px #fff1e6;
}

.review-form textarea {
  resize: vertical;
  min-height: 120px;
}

.review-form-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 12px 0 16px;
}

.review-form-hint {
  display: block;
  margin-top: 4px;
  color: #c0392b;
  font-size: 13px;
}

.review-form .btn {
  min-height: 46px;
  padding: 0 26px;
  border: 0;
  border-radius: 14px;
  font: inherit;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, #ff8b15, #ff6400);
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.review-form-success,
.review-form-error {
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  line-height: 1.5;
}

.review-form-success {
  background: #f0f7e6;
  color: #4a5a33;
}

.review-form-error {
  background: #fdecea;
  color: #96281b;
}

@media (max-width: 640px) {
  .review-form-cols {
    grid-template-columns: 1fr;
  }
}

/* /add/: см. консолидированный блок стилей выше */

@media(max-width:900px){
  .contact-layout{grid-template-columns:1fr}
}
/* Мобильная CTA-плашка: кнопка во всю ширину (тот же подход, что
   чипы-действия секций на /faq/) */
@media(max-width:760px){
  .text-cta{padding:18px 16px}
  .text-cta .podbor-btn{margin-left:0;width:100%}
  .contact-page .review-form-actions .btn{width:100%}
}
@media(max-width:430px){
  .add-choice{padding:20px 16px}
}

/* ===== Избранное (♡, localStorage-MVP) ===== */
/* кнопка-сердечко на карточке питомника — стиль согласован со стрелками
   галереи страницы питомника (полупрозрачный круг, hover — полный цвет) */
.kennel-fav {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.55);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  cursor: pointer;
  user-select: none;
  transition: background .2s ease, color .2s ease, transform .15s ease;
}

/* мягкое контурное сердце (SVG), вписанное в круг.
   Специфичность .kennel-cards .kennel-card нужна, чтобы перебивать
   цвет/шрифт у правил вида «.kennel-cards .kennel-card span» */
.kennel-cards .kennel-card .kennel-fav {
  color: #fff;
  font-size: 0;
}

.kennel-fav svg {
  display: block;
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linejoin: round;
  stroke-linecap: round;
  filter: drop-shadow(0 1px 2px rgba(102, 85, 68, 0.55));
}

.kennel-cards .kennel-card .kennel-fav:hover,
.kennel-cards .kennel-card .kennel-fav:focus-visible {
  background: #fff;
  color: #ff6400;
  transform: scale(1.08);
  outline: 0;
}

.kennel-fav:hover svg,
.kennel-fav:focus-visible svg {
  filter: none;
}

.kennel-cards .kennel-card .kennel-fav.is-active {
  background: #fff;
  color: #ff6400;
}

.kennel-fav.is-active svg {
  fill: currentColor;
  stroke-width: 0;
  filter: none;
}

/* страница /favorites/ */
.favorites-page .js-fav-total {
  display: inline-block;
  min-width: 30px;
  margin-left: 10px;
  padding: 4px 12px;
  border: 1px solid #ffd9b8;
  border-radius: 999px;
  background: #fff4ea;
  color: #ff5b00;
  font-size: 13px;
  font-weight: 900;
  vertical-align: middle;
}

.favorites-empty {
  padding: 48px 24px;
  border: 1px solid #f0e6db;
  border-radius: 18px;
  background: #fffdfb;
  text-align: center;
}

.favorites-empty .heart-big {
  display: block;
  margin: 0 auto 14px;
  font-size: 44px;
  color: #ffc49a;
  line-height: 1;
}

.favorites-empty p {
  margin: 0 0 18px;
  color: #8a7a6e;
  font-size: 16px;
}

/* 626–760px: контент прижат к краям (у .wrap/v13 поля всего 12px, боковой
   padding отсутствует) — добавляем боковой воздух, как на ≤625px */
@media (min-width: 626px) and (max-width: 760px) {
  .catalog-page {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* иконки в полоске district-card (округа/районы):
   компактные, слева от текста (у .district-card иконки по умолчанию сверху) */
.district-card--okrug,.district-card--rayon,.district-card--metro{grid-template-columns:auto 1fr;align-items:center}
.district-card .okrug-ico{width:16px;height:16px;color:#8a7668}
.district-card .rayon-ico{width:16px;height:16px;color:#ff6400}
.district-card .metro-ico{width:16px;height:16px;color:#e0342b}
@media(max-width:760px){
  .district-card--okrug .okrug-ico,
  .district-card--rayon .rayon-ico,
  .district-card--metro .metro-ico{width:14px;height:14px}
}

/* станция метро в рубрикаторе /{cat}/metros/ — иконка слева от названия */
.catalog-city-card--metro{flex-direction:row;align-items:center;justify-content:flex-start;gap:9px}
.catalog-city-card--metro .metro-ico{flex-shrink:0}

/* район в рубрикаторе /{cat}/rayony/ — пин слева от названия */
.catalog-city-card--rayon{flex-direction:row;align-items:center;justify-content:flex-start;gap:9px}
.catalog-city-card .rayon-ico{width:16px;height:16px;color:#ff6400;flex-shrink:0}

/* кнопка карты: «Развернуть»/«Свернуть» — переключение иконки и состояния */
.show-full-map-btn .ico-collapse{display:none}
.site-map-container.expanded .show-full-map-btn .ico-expand{display:none}
.site-map-container.expanded .show-full-map-btn .ico-collapse{display:block}
/* скрытый оверлей не должен блокировать карту в развёрнутом виде */
.site-map-overlay.hidden{pointer-events:none}

/* быстрые ссылки (/sobaki/, /koshki/) — пилюли в карусели pills-slider */
.catalog-track .quick-pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 15px;border:1px solid #f0dfd0;border-radius:999px;background:#fff;color:#ff6400;font-weight:600;font-size:13px;box-shadow:0 6px 16px rgba(68,42,25,.05);transition:.2s;white-space:nowrap;text-decoration:none}
.catalog-track .quick-pill:hover{background:#ff6400;border-color:#ff6400;color:#fff;transform:translateY(-2px)}
.catalog-track .quick-pill svg{width:16px;height:16px;flex-shrink:0}

/* полоска пород на tag-страницах — лапа слева от текста */
.district-card--breed{grid-template-columns:auto 1fr;align-items:center}
.district-card .paw-ico{width:16px;height:16px;color:#ff6400}
@media(max-width:760px){.district-card--breed .paw-ico{width:14px;height:14px}}

/* типы пород в полоске /koshki/ — тематическая иконка слева от текста */
.district-card--tag{grid-template-columns:auto 1fr;align-items:center}
.district-card .tag-ico{width:16px;height:16px;color:#ff6400;flex-shrink:0}
@media(max-width:760px){.district-card--tag .tag-ico{width:14px;height:14px}}

/* порода без фото в результатах поиска — круг-заглушка с лапой */
.catalog-breed-card .breed-ico-fallback{width:68px;height:68px;border-radius:50%;background:#fff4ea;display:grid;place-items:center;color:#ff6400}
.catalog-breed-card .breed-ico-fallback svg{width:32px;height:32px}

/* карточки городов на главной: иконка города слева от текста */
.city{gap:12px}
.city .city-ico{width:26px;height:26px;flex:0 0 auto;color:#ff6400}
/* самые узкие экраны: иконки городов не показываем — на карточке во всю
   ширину они выглядят лишними */
@media(max-width:400px){.city .city-ico{display:none}}

/* SEO-блок внизу главной: на мобиле свёрнут до ~230px с затуханием,
   раскрытие кнопкой «Читать полностью». Контент остаётся в DOM (SEO);
   на десктопе текст показывается целиком, кнопка скрыта. */
.seo-text--home .seo-text__toggle{display:none;position:relative;z-index:1;margin:16px auto 0;width:100%;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:0 26px;border:1px solid #ffd1ad;border-radius:999px;background:#fff;color:#ff6400;font-weight:800;font-size:14px;box-shadow:0 10px 24px rgba(255,106,0,.16);cursor:pointer;transition:.2s}
.seo-text--home .seo-text__toggle:after{content:'›';font-size:22px;line-height:1;transform:rotate(90deg);transition:transform .2s}
.seo-text--home.is-open .seo-text__toggle:after{transform:rotate(-90deg)}
.seo-text--home .seo-text__toggle:hover{background:#ff6400;border-color:#ff6400;color:#fff;transform:translateY(-2px);box-shadow:0 14px 30px rgba(255,106,0,.24)}
.seo-text--home .seo-text__toggle:active{transform:translateY(0);box-shadow:0 6px 16px rgba(255,106,0,.18)}
.seo-text--home .seo-text__toggle:focus-visible{outline:2px solid #ff6400;outline-offset:2px}
@media(max-width:760px){
  .seo-text--home .seo-text__body{position:relative;max-height:230px;overflow:hidden}
  .seo-text--home .seo-text__body:after{content:'';position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(180deg,rgba(255,253,251,0),#fffdfb 80%);pointer-events:none}
  .seo-text--home.is-open .seo-text__body{max-height:none}
  .seo-text--home.is-open .seo-text__body:after{display:none}
  .seo-text--home .seo-text__toggle{display:inline-flex}
}

/* Футер: крупнее шрифт на мобильных (перебивает групповые правила
   ≤640/≤390 в layout.css — те общие с карточками, поэтому задаём отдельно) */
@media(max-width:640px){
  .footer h4{font-size:17px !important}
  .footer p,.footer a,.footgrid li,.footer-bottom p{font-size:15px !important}
}
@media(max-width:390px){
  .footer h4{font-size:16px !important}
  .footer p,.footer a,.footgrid li,.footer-bottom p{font-size:14px !important}
}

/* Футер: на мобиле логотип-блок на всю ширину, колонки ссылок — парами */
@media(max-width:640px){
  .footgrid > div:first-child{grid-column:1 / -1}
}

/* Футер: кнопка «Наверх» справа от копирайта, на мобиле — под текстом */
.footer-bottom{position:relative}
.to-top{position:absolute;right:0;top:12px;display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 18px;border:1px solid #f0dfd0;border-radius:999px;background:#fff;color:#ff6400;font-weight:700;font-size:13px;transition:.2s}
.to-top:before{content:'↑';font-size:15px;line-height:1}
.to-top:hover{background:#ff6400;border-color:#ff6400;color:#fff;transform:translateY(-2px)}
@media(max-width:760px){
  .to-top{position:static;margin-top:14px;width:100%;justify-content:center}
}

/* отзывы на главной: выравнивание как у блока «Полезная информация» (заголовок слева, ссылка справа) */
.catalog-page .reviews-strip > .section-head{display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:flex-start !important;gap:8px !important}
.catalog-page .reviews-strip > .section-head .more{margin:0 !important;align-self:flex-start !important;text-align:left !important;white-space:nowrap}

/* отзывы на главной: слева на узких экранах (≤640) */
@media(max-width:640px){
  .catalog-page .reviews-strip > .section-head{align-items:flex-start !important;text-align:left !important}
  .catalog-page .reviews-strip > .section-head .more{align-self:flex-start !important;margin:0 !important;text-align:left !important}
}

/* Главная: увеличенный отступ сверху у блока "Последние отзывы".
   Секция несёт .catalog-slider (margin-top:10px) — на главной (main.wrap
   без .catalog-page) поднимаем отступ; каталог-страницы не трогаем. */
.wrap:not(.catalog-page) .reviews-strip{
  margin-top:20px;
}
@media(max-width:760px){
  .wrap:not(.catalog-page) .reviews-strip{
    margin-top:16px;
  }
}

/* ===== /stati/ — карточки статей: фото, заголовок, превью, «Читать» ===== */
.stati-card .card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px 16px;
  flex: 1;
}

.stati-card .title {
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
  color: #231f20;
  min-height: 0;
  transition: color 0.15s ease;
  /* больше текста в заголовке: 3 строки вместо общих 2 */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.stati-card:hover .title {
  color: #ff6400;
}

.stati-card .stati-excerpt {
  margin: 0;
  color: #6b5c4e;
  font-size: 13.5px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.stati-card .stati-more {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ff6400;
  font-size: 13px;
  font-weight: 800;
}

.stati-card .stati-more svg {
  width: 14px;
  height: 14px;
  transition: transform 0.15s ease;
}

.stati-card:hover .stati-more svg {
  transform: translateX(3px);
}

.stati-card {
  overflow: hidden;
  position: relative;
}

.stati-card .stati-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #6b5c4e;
  font-size: 11.5px;
  font-weight: 800;
}

.stati-card .photo {
  transition: transform 0.25s ease;
}

.stati-card:hover .photo {
  transform: scale(1.04);
}

/* фильтр «Показывать все» в заголовке каталога пород */
.breed-show-all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: 14px;
  color: #6b5c4e;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.breed-show-all input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #ff6400;
  cursor: pointer;
}

/* мобильная версия: чекбокс отдельной строкой под заголовком,
   во всю ширину с удобной зоной нажатия */
@media (max-width: 640px) {
  .section-head:has(.breed-show-all) {
    flex-wrap: wrap;
  }

  .breed-show-all {
    margin-left: 0;
    width: 100%;
    padding: 10px 2px 4px;
    border-top: 1px dashed #eee2d8;
    font-size: 14px;
  }

  .breed-show-all input {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
  }
}

/* галочка снята: породы без активных питомников скрываются */
.catalog-breed-grid.hide-inactive .catalog-breed-card[data-active="0"] {
  display: none !important;
}

/* RTB в листинге питомников: полноширинная плитка после первого ряда карточек */
.kennel-cards .kennel-ad-card {
  grid-column: 1 / -1;
  min-height: 180px;
  border: 1px solid #eee6de;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
}

.kennel-cards .kennel-ad-card > div {
  min-height: 180px;
}

/* RTB на странице категории (/sobaki/ и др.): лента после «Топ питомников» */
.kennel-ad-card.cat-ad-band {
  margin: 16px 0 0;
  min-height: 180px;
  border: 1px solid #eee6de;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
}

.kennel-ad-card.cat-ad-band > div {
  min-height: 180px;
}

/* карточка «Посмотреть все» в ленте отзывов породы — как «Все города» на главной */
.review-card.review-card--all {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  background: #fffaf5;
  border-color: #f3e4d8;
  box-shadow: 0 7px 18px rgba(98, 62, 37, 0.05);
}

/* иконка звезды в кремовом квадрате */
.review-card--all .review-all-ico {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #fff1e6;
  color: #ff6400;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease;
}

.review-card--all .review-all-ico svg {
  width: 22px;
  height: 22px;
}

.review-card--all .review-all-text {
  flex: 1 1 auto;
  color: #231f20;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
}

/* круглый бейдж-стрелка справа */
.review-card--all .review-all-arrow {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff1e6;
  color: #ff6400;
  font-size: 22px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease;
}

.review-card--all:hover .review-all-ico {
  background: #ffe9d2;
}

.review-card--all:hover .review-all-arrow {
  background: #ff6400;
  color: #fff;
}

/* постепенная загрузка фото: класс img-lazy на body ставит JS (без JS фото
   видны обычным образом). Плейсхолдер-мерцание → плавное появление.
   Статьи: .stati-card .photo; листинги питомников: .kennel-photo img */
body.img-lazy .stati-card .photo {
  opacity: 0;
  background-color: #f4ede4;
  background-image: linear-gradient(110deg, #f4ede4 30%, #faf5ee 45%, #f4ede4 65%);
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: stati-shimmer 1.4s linear infinite;
}

body.img-lazy .stati-card .photo.is-loaded {
  opacity: 1;
  animation: none;
  transition: opacity 0.4s ease;
}

body.img-lazy .kennel-card .kennel-photo img {
  opacity: 0;
  background-color: #f4ede4;
  background-image: linear-gradient(110deg, #f4ede4 30%, #faf5ee 45%, #f4ede4 65%);
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: stati-shimmer 1.4s linear infinite;
}

body.img-lazy .kennel-card .kennel-photo img.is-loaded {
  opacity: 1;
  animation: none;
  transition: opacity 0.4s ease;
}

/* иконки/фото пород на /koshki/ и /sobaki/ */
body.img-lazy .catalog-breed-card img {
  opacity: 0;
  background-color: #f4ede4;
  background-image: linear-gradient(110deg, #f4ede4 30%, #faf5ee 45%, #f4ede4 65%);
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: stati-shimmer 1.4s linear infinite;
}

body.img-lazy .catalog-breed-card img.is-loaded {
  opacity: 1;
  animation: none;
  transition: opacity 0.4s ease;
}

/* галерея страницы питомника: миниатюры и главное фото появляются плавно
   (ЛК-галерея .account-gallery исключена — там фото создаются динамически) */
body.img-lazy .product-stage-gallery:not(.account-gallery) .product-thumb img {
  opacity: 0;
  background-color: #f4ede4;
  background-image: linear-gradient(110deg, #f4ede4 30%, #faf5ee 45%, #f4ede4 65%);
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: stati-shimmer 1.4s linear infinite;
}

body.img-lazy .product-stage-gallery:not(.account-gallery) .product-thumb img.is-loaded {
  opacity: 1;
  animation: none;
  transition: opacity 0.4s ease;
}

body.img-lazy .product-stage-gallery:not(.account-gallery) [data-gallery-image] {
  opacity: 0;
  background-color: #f4ede4;
}

body.img-lazy .product-stage-gallery:not(.account-gallery) [data-gallery-image].is-loaded {
  opacity: 1;
  transition: opacity 0.35s ease;
}

@keyframes stati-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ===== страница статьи (/sobaki/{статья}/) — во весь экран ===== */
.article-screen {
  display: block;
  min-height: 60vh;
  /* отступ под фиксированную плашку cookies (~70px), как на /stati/ */
  padding-bottom: 84px;
}

/* класс catalog-page (добавлен main статьи) задаёт отступы крошек/h1
   как на /stati/, но сужает страницу 1280px+отступы — статья должна быть
   во весь экран; блок «Ищете питомник?» прижат к футеру */
.article-screen.catalog-page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
}

/* hero-шапка статьи: без фона, как у всех страниц */
.article-hero-full {
  /* padding: 14px 0 6px; */
}

/* h1 статьи — в блоке .catalog-title-block, стиль общий со всеми страницами */

/* контент: широкая колонка для комфортного чтения */
.article-content-full {
  padding: 10px 0 26px;
}

/* контент: журнальный лейаут — текст слева + sticky-сайдбар (оглавление и CTA) */
.article-content-full {
  padding: 10px 0 26px;
}

.article-content-full .article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 40px;
  align-items: start;
}

.article-content-full .article-body {
  font-size: 17px;
  line-height: 1.75;
  color: #3d3940;
}

/* якоря из оглавления: не прячутся под шапкой при переходе */
.article-body [id] {
  scroll-margin-top: 90px;
}

/* сайдбар: прилипает под шапкой при скролле */
.article-aside {
  position: sticky;
  top: 90px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* блок «Содержание» */
.article-toc {
  padding: 18px;
  border: 1px solid #ffe1c4;
  border-radius: 16px;
  background: #fff9f2;
  display: flex;
  flex-direction: column;
  gap: 2px;
  counter-reset: articletoc;
}

.article-toc-title {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 800;
  color: #231f20;
}

/* нумерация пунктов оглавления (кружки 1, 2, 3…) — как у ul.feature */
.article-toc-item {
  counter-increment: articletoc;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 8px 6px 6px;
  border-radius: 9px;
  color: #3d3940;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

.article-toc-item::before {
  content: counter(articletoc);
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff4ea;
  color: #ff6400;
  font-size: 12px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

.article-toc-item:hover {
  background: #fff4ea;
  color: #ff6400;
}

/* мини-CTA в сайдбаре */
.article-aside-cta {
  padding: 18px;
  border: 1px solid #ffe1c4;
  border-radius: 16px;
  background: linear-gradient(135deg, #fff4ea 0%, #fff9f2 100%);
}

/* похожие статьи в сайдбаре */
.article-related {
  padding: 18px;
  border: 1px solid #eee6de;
  border-radius: 16px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.article-related-title {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 800;
  color: #231f20;
}

.article-related-item {
  padding: 8px 10px;
  margin: 0 -10px;
  border-radius: 9px;
  color: #3d3940;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

.article-related-item:hover {
  background: #fff4ea;
  color: #ff6400;
}

.article-aside-cta-title {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 800;
  color: #231f20;
}

.article-aside-cta-text {
  margin: 0 0 12px;
  color: #6b5c4e;
  font-size: 13.5px;
  line-height: 1.5;
}

.article-aside-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-bottom: 8px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #ff8b15, #ff6400);
  color: #fff;
  font-size: 13.5px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.article-aside-cta-btn:last-child {
  margin-bottom: 0;
}

.article-aside-cta-btn.is-ghost {
  background: #fff;
  border: 1px solid #ffd9b8;
  color: #e05a00;
}

.article-aside-cta-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(255, 100, 0, 0.2);
}

/* на экранах ≤1000px: одна колонка, сайдбар скрыт (внизу есть CTA-лента),
   оглавление ul.feature остаётся в тексте */
@media (max-width: 1000px) {
  .article-content-full .article-layout {
    grid-template-columns: 1fr;
  }

  .article-aside {
    display: none;
  }
}

@media (min-width: 1001px) {
  /* оглавление переехало в сайдбар — в тексте не дублируем */
  .article-body ul.feature {
    display: none;
  }
}

.article-body p {
  margin: 0 0 18px;
}

.article-body h2 {
  margin: 34px 0 14px;
  font-size: 27px;
  font-weight: 800;
  line-height: 1.25;
  color: #231f20;
}

.article-body h3 {
  margin: 26px 0 12px;
  font-size: 21px;
  font-weight: 800;
  line-height: 1.3;
  color: #231f20;
}

.article-body ul,
.article-body ol {
  margin: 0 0 18px;
  padding-left: 26px;
}

.article-body li {
  margin-bottom: 9px;
}

.article-body li::marker {
  color: #ff6400;
}

.article-body a {
  color: #ff6400;
}

.article-body img {
  display: block;
  width: 100%;
  height: auto;
  /* margin: 26px auto; */
  border-radius: 18px;
}

.article-body blockquote {
  margin: 24px 0;
  padding: 14px 20px;
  border-left: 4px solid #ff6400;
  border-radius: 0 14px 14px 0;
  background: #fff4ea;
  color: #554a43;
}

/* RTB в середине статьи: лента после 2-го раздела текста */
.article-ad-band {
  margin: 26px 0;
  min-height: 180px;
  border: 1px solid #eee6de;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
}

.article-ad-band > div {
  min-height: 180px;
}

/* таблицы в статьях (cms-контент, class="table") */
.article-body .table {
  width: 100%;
  border-collapse: collapse;
  margin: 22px 0;
  font-size: 15px;
}

.article-body .table th {
  padding: 12px 14px;
  background: #fff4ea;
  color: #231f20;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-align: left;
}

.article-body .table td {
  padding: 11px 14px;
  border-top: 1px solid #f1dfd0;
  color: #3d3940;
  vertical-align: top;
}

.article-body .table tr:hover td {
  background: #fff9f2;
}

/* списки контента (cms-класс list6b): галочки вместо буллетов */
.article-body ul.list6b {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
}

.article-body ul.list6b li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 10px;
}

.article-body ul.list6b li::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0;
  color: #ff6400;
  font-weight: 800;
}

/* узкие экраны: таблица статьи складывается в карточки
   (заголовки колонок — подписями слева, данные справа) */
@media (max-width: 640px) {
  .article-body .table,
  .article-body .table tbody,
  .article-body .table tr,
  .article-body .table td {
    display: block;
    width: 100%;
  }

  .article-body .table thead,
  .article-body .table tr:first-child {
    display: none;
  }

  .article-body .table tr {
    margin: 0 0 12px;
    padding: 12px 14px;
    border: 1px solid #eee2d8;
    border-radius: 12px;
    background: #fffdfb;
  }

  .article-body .table tr:last-child {
    margin-bottom: 0;
  }

  .article-body .table td {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 0;
    border-top: 0;
  }

  .article-body .table td::before {
    content: attr(data-label);
    flex-shrink: 0;
    color: #b3a497;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: left;
  }
}

/* оглавление статьи (ul.feature из контента): нумерованный список */
.article-body ul.feature {
  list-style: none;
  margin: 0 0 22px;
  padding: 18px 20px;
  border: 1px solid #ffe1c4;
  border-radius: 16px;
  background: #fff9f2;
  counter-reset: feature;
}

.article-body ul.feature li {
  counter-increment: feature;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 10px;
}

.article-body ul.feature li:last-child {
  margin-bottom: 0;
}

.article-body ul.feature li::before {
  content: counter(feature);
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #fff4ea;
  color: #ff6400;
  font-size: 13px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

.article-body ul.feature li a {
  color: #231f20;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.15s ease;
}

.article-body ul.feature li a:hover {
  color: #ff6400;
  text-decoration: underline;
}

/* CTA-лента на всю ширину */
.article-cta-full {
  padding: 40px 0;
  border-top: 1px solid #ffe1c4;
  background: linear-gradient(135deg, #fff4ea 0%, #fff9f2 55%, #ffe9d2 100%);
}

.article-cta-full .article-cta {
  max-width: 860px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: none;
}

.article-cta-title {
  margin: 0 0 10px;
  font-size: 26px;
  font-weight: 800;
  color: #231f20;
}

.article-cta-text {
  margin: 0 0 20px;
  max-width: 620px;
  color: #6b5c4e;
  font-size: 16px;
  line-height: 1.55;
}

.article-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

/* кнопки CTA: на публичных страницах .btn из account.css не подключён */
.article-cta-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 28px;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.article-cta-actions .btn svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

.article-cta-actions .btn.primary {
  border: 0;
  background: linear-gradient(135deg, #ff8b15, #ff6400);
  color: #fff;
}

.article-cta-actions .btn.primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(255, 100, 0, 0.25);
}

.article-cta-actions .btn.ghost {
  border: 1px solid #ffd9b8;
  background: #fff;
  color: #e05a00;
}

.article-cta-actions .btn.ghost:hover {
  background: #fff4ea;
  border-color: #ffb27a;
}

@media (max-width: 640px) {
  .article-content-full {
    /* padding: 24px 0 18px; */
  }

  .article-content-full .article-body {
    font-size: 16px;
  }

  .article-body h2 {
    font-size: 22px;
  }

  .article-cta-full {
    padding: 30px 0;
  }

  .article-cta-actions {
    flex-direction: column;
    align-items: stretch;
  }
}

/* города на страницах разделов — компактная оранжевая иконка,
   счётчик питомников справа в строке с названием (минималистично).
   Теги, округа, районы, метро, породы на tag-страницах — та же
   компактная плашка. Базовый .district-card даёт gap:2px и padding 10/12 */
.district-card--city,.district-card--tag,.district-card--okrug,.district-card--rayon,.district-card--metro,.district-card--breed{grid-template-columns:auto 1fr;align-items:center;column-gap:10px;row-gap:0;min-height:46px;padding:12px 16px;border-radius:12px}
/* равная высота карточек в ряду: название в одну строку */
.district-card--city,.district-card--tag,.district-card--okrug,.district-card--rayon,.district-card--metro,.district-card--breed{white-space:nowrap;overflow:hidden}
.district-card .tag-ico,.district-card .city-chip-ico,.district-card .paw-ico,.district-card .rayon-ico,.district-card .metro-ico,.district-card .okrug-ico{flex-shrink:0}
.district-card .city-chip-ico{width:12px;height:12px;color:#ff6400;flex-shrink:0}
.district-card--city .city-chip-body,.district-card--tag .city-chip-body,.district-card--breed .city-chip-body,.district-card--okrug .city-chip-body,.district-card--rayon .city-chip-body,.district-card--metro .city-chip-body{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.district-card--city .city-chip-body b,.district-card--tag .city-chip-body b,.district-card--breed .city-chip-body b,.district-card--okrug .city-chip-body b,.district-card--rayon .city-chip-body b,.district-card--metro .city-chip-body b{flex:none;min-width:16px;color:#c9baae;font-weight:700;font-size:13px;line-height:1;text-align:right;font-variant-numeric:tabular-nums;transition:color .2s}
.district-card--city:hover .city-chip-body b,.district-card--tag:hover .city-chip-body b,.district-card--breed:hover .city-chip-body b,.district-card--okrug:hover .city-chip-body b,.district-card--rayon:hover .city-chip-body b,.district-card--metro:hover .city-chip-body b{color:#ff6400}
@media(max-width:760px){
  .district-card--city,.district-card--tag,.district-card--okrug,.district-card--rayon,.district-card--metro,.district-card--breed{min-height:42px;padding:10px 13px;column-gap:8px}
  .district-card .city-chip-ico{width:11px;height:11px}
  .district-card--city .city-chip-body b{font-size:12px}
}

/* популярные породы на гео-страницах (/moscow/sobaki/) — карточки главной
   («иконка + название + счётчик») в виде компактного горизонтального слайдера */
.catalog-track .breed{flex:0 0 104px;display:grid;justify-items:center;gap:4px;padding:11px 7px;border:1px solid #eee6de;border-radius:11px;background:#fff;box-shadow:0 5px 12px rgba(68,42,25,.05);transition:.25s;scroll-snap-align:start}
.catalog-track .breed:hover{transform:translateY(-3px);border-color:#ffc49a;box-shadow:0 14px 26px rgba(255,106,0,.13)}
.catalog-track .breed img{width:54px;height:54px;border-radius:50%;object-fit:cover;background:#fff4ea}
.catalog-track .breed b{font-size:11.5px;line-height:1.2;text-align:center}
.catalog-track .breed small{color:#83756d;font-size:10.5px;font-weight:750}
/* hidden не работает без явного display:none — display:grid выше его перебивает */
.catalog-track .breed[hidden]{display:none}
/* слайдер городов сразу после заголовка (/sobaki/ads/): плотный отступ сверху */
.catalog-title-block + .catalog-slider,
.catalog-page .catalog-title-block + .catalog-slider{margin-top:8px !important}
/* иконки в быстрых ссылках (/mo/ и др. catalog-tags) */
.catalog-tags a img{width:16px;height:16px;object-fit:contain;flex-shrink:0}
@media(max-width:760px){
  /* на мобиле карточка шире — виден длинный текст названия породы */
  .catalog-track .breed{flex:0 0 132px;padding:11px 10px}
}

/* страница /favorites/: подзаголовок, фильтр типов, пустой фильтр */
.favorites-subtitle{margin:6px 0 14px;color:#8a7668;font-size:15px;font-weight:600}
.favorites-filter{margin:0 0 16px}
.favorites-filter-empty{margin:10px 0;color:#8a7668;font-size:14px;font-weight:600}
.favorites-empty-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}

/* иконки-чипы разделов на /{region}/ — размер как сердечко «В избранное» в шапке */
.catalog-tags a.icon-chip{width:40px;height:40px;min-height:40px;padding:0;justify-content:center;border-radius:10px}
.catalog-tags a.icon-chip img{width:26px;height:26px;object-fit:contain}
.catalog-tags a.icon-chip:hover{border-color:#ffc49a;background:#fff4ea;box-shadow:0 14px 28px rgba(255,106,0,.2)}

/* подпись под кнопкой поиска в герое: мостик к объявлениям */
.search-ads-hint {
  margin: 16px 0 0 !important;
  font-size: 13px;
  color: #8a7668;
}
.search-ads-hint a {
  color: #ff6400;
  font-weight: 600;
}

/* табы «Котята | Щенки» на главной: одна карусель вместо двух */
.ads-tabs{display:flex;gap:8px;margin-bottom:14px}
.ads-tab{padding:8px 20px;border:1px solid #e3d5c8;border-radius:999px;background:#fff;font-weight:700;font-size:13px;color:#6b5d52;cursor:pointer;transition:.2s}
.ads-tab:hover{border-color:#ffc49a;background:#fff4ea}
.ads-tab.is-active{background:#ff6400;border-color:#ff6400;color:#fff}

/* панель табов объявлений: hidden не работает без явного display:none,
   т.к. .ads-carousel задает display:flex */
.cards.ads-carousel[hidden]{display:none!important}

/* счётчик питомников выбранной породы в герое */
.breed-cnt-hint{position:absolute !important;bottom:calc(100% + 10px) !important;left:50% !important;margin:0 !important;padding:8px 16px !important;background:#3d3a37 !important;color:#fff !important;font-size:13px !important;font-weight:650 !important;border:0 !important;border-radius:14px !important;white-space:nowrap !important;z-index:60 !important;box-shadow:0 12px 30px rgba(35,31,32,.28), inset 0 1px 0 rgba(255,255,255,.14) !important;display:block !important;transform:translateX(-50%) !important;animation:breedBalloonIn .28s cubic-bezier(.34,1.56,.64,1) !important;opacity:1 !important;transition:opacity .3s ease, transform .3s ease !important;cursor:default !important}
.breed-cnt-hint[hidden]{display:none !important}
.breed-cnt-hint.is-fading{opacity:0 !important;transform:translateX(-50%) translateY(-8px) !important}
.breed-cnt-hint:hover{transform:translateX(-50%) scale(1.06) !important}
@keyframes breedBalloonIn{
  from{opacity:0;transform:translateX(-50%) translateY(8px) scale(.85)}
  to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
}
.breed-cnt-hint:after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:#3d3a37}
.breed-cnt-hint:after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:#231f20}

/* меню героя: стабильная ширина вне зависимости от выбранного текста */
.search .select-menu{min-width:min(280px,90vw)}

/* герой-поиск: строка не сужается после выбора породы */
.search .select-field{min-width:230px}
.search .field b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:760px){.search .select-field{min-width:0}}

/* ===================================================================
   v75: Поисковая панель раздела (/sobaki/, /koshki/) — catalog-finder.
   Компактная белая карточка в стиле hero-поиска; поля .select-field
   переиспользуют глобальную механику (layout.css), здесь — сетка,
   чекбокс объявлений, счётчики в меню и подсказка-результат.
   =================================================================== */
.catalog-finder-form {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto minmax(0, 1.05fr) 200px;
  column-gap: 10px;
  background: #fff;
  border-radius: 13px;
  padding: 10px;
  box-shadow: 0 11px 28px rgba(75, 45, 25, .15)
}

.catalog-finder-form .field {
  height: 54px
}

/* чекбокс «Есть котята/щенки» */
.cf-ads {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 16px;
  border-right: 1px solid #f0e8e0;
  font-size: 13px;
  font-weight: 700;
  color: #3b312b;
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
  transition: .2s
}

.cf-ads input {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: #ff6400;
  cursor: pointer
}

.cf-ads:hover {
  color: #ff6400
}

/* dual (/spb/): чекбокс объявлений неактивен, пока не выбрана порода */
.cf-ads.is-disabled {
  opacity: .45;
  cursor: default
}

.cf-ads.is-disabled:hover {
  color: #3b312b
}

.cf-ads.is-disabled input {
  cursor: default
}

/* иконка животного в чекбоксе «Есть котята/щенки» */
.cf-ads-ico {
  width: 20px;
  height: 20px;
  object-fit: contain;
  flex: 0 0 auto
}

/* счётчики питомников в пунктах меню породы/города.
   :not([data-filtered-out]) обязательно: правило идёт ПОЗЖЕ общего
   `.select-menu button[data-filtered-out]{display:none}` (layout.css) при той
   же специфичности и без :not перебивало бы скрытие в «Быстром поиске» */
.catalog-finder-form .select-menu button:not([data-filtered-out]) {
  display: flex;
  align-items: center;
  gap: 8px
}

.catalog-finder-form .select-menu button i {
  margin-left: auto;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  color: #a08a7c;
  background: #f7f2ec;
  border-radius: 999px;
  padding: 2px 8px
}

.catalog-finder-form .select-menu button:hover i,
.catalog-finder-form .select-menu button.is-active i {
  background: #fff3e8;
  color: #ff6400
}

/* подсказка-счётчик под формой — тёмный баллон с хвостиком, как
   .breed-cnt-hint в hero на главной; висит поверх контента, пока выбраны
   порода и/или город; в нуле результатов внутри ссылки на соседние города */
.catalog-finder {
  position: relative
}

.cf-hint {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  left: 50% !important;
  margin: 0 !important;
  padding: 8px 16px !important;
  background: #3d3a37 !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  border-radius: 14px !important;
  text-align: center !important;
  white-space: normal !important;
  width: max-content !important;
  max-width: min(560px, calc(100vw - 40px)) !important;
  z-index: 60 !important;
  box-shadow: 0 12px 30px rgba(35, 31, 32, .28), inset 0 1px 0 rgba(255, 255, 255, .14) !important;
  transform: translateX(-50%) !important;
  animation: cfBalloonIn .28s cubic-bezier(.34, 1.56, .64, 1) !important;
  transition: opacity .3s ease, transform .3s ease !important;
  cursor: default !important
}

.cf-hint[hidden] {
  display: none !important
}

.cf-hint.is-fading {
  opacity: 0 !important;
  transform: translateX(-50%) translateY(8px) !important
}

/* хвостик вверх, к форме */
.cf-hint:after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-bottom-color: #3d3a37
}

.cf-hint b {
  color: #fff
}

.cf-hint a {
  color: #ffb27d;
  text-decoration: none;
  white-space: nowrap
}

.cf-hint a:hover {
  color: #ff8d3a;
  text-decoration: underline
}

@keyframes cfBalloonIn {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(-8px) scale(.85)
  }

  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1)
  }
}

.cf-popular {
  margin-top: 16px
}

@media (max-width: 1100px) {
  .catalog-finder-form {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    row-gap: 8px
  }

  .cf-ads {
    border-right: 0;
    padding: 0 12px
  }

  .catalog-finder-form .searchbtn {
    grid-column: 1 / -1
  }
}

@media (max-width: 640px) {
  .catalog-finder-form {
    grid-template-columns: 1fr;
    padding: 8px
  }

  .cf-ads {
    border-right: 0;
    padding: 10px 12px
  }

  .catalog-finder-form .searchbtn {
    height: 52px
  }
}

/* главная: избранное и счётчик фото на карточках объявлений — расположение
   как на страницах /{city}/{cat}/{poroda}/ads/ (ads-card): счётчик справа
   сверху, сердечко слева сверху; активное — белый круг, оранжевое сердце */
.cards .card .kennel-photo-cnt {
  top: 8px;
  right: 8px;
}

.cards .card .kennel-fav {
  top: 10px;
  left: 10px;
  right: auto;
}

.cards .card .kennel-fav:hover,
.cards .card .kennel-fav:focus-visible {
  background: #fff;
  color: #ff6400;
  transform: scale(1.08);
  outline: 0;
}

.cards .card .kennel-fav.is-active {
  background: #fff;
  color: #ff6400;
}