/* СТРАНИЦА: HOME — префикс hm- на всички собствени класове. */

/* СЕКЦИЯ: HERO : НАЧАЛО */

.hm-hero {
  position: relative;
  isolation: isolate;
  overflow: clip;
  background: #42525f;
}

.hm-hero__photo {
  position: absolute;
  left: -0.1042%;                 /* премитане ±1px: снимката ляга на x-2 */
  top: calc(-2 * var(--k));
  width: 100.1042%;               /* 1922 при 1920 */
  max-width: none;                /* base.css слага max-width:100% и я реже */
  height: auto;
  z-index: -1;
}

.hm-hero__inner {
  padding-left: 7.1875%;                    /* 138 / 1920 */
  padding-right: 7.1875%;
  padding-top: calc(209 * var(--k));        /* eyebrow започва на y387 в макета */
  padding-bottom: calc(86 * var(--k));
}

.hm-hero__eyebrow {
  font-family: var(--ff-head);
  font-weight: 400;
  font-size: var(--fs-eyebrow);
  line-height: 1;
  color: var(--c-white);
}

.hm-hero__title {
  margin-top: calc(14.4 * var(--k));
  margin-left: calc(-1 * var(--k));
  font-family: var(--ff-head);
  font-weight: 400;
  font-size: var(--fs-h1);
  line-height: calc(94 * var(--k));
  letter-spacing: calc(0.8 * var(--k));
  color: var(--c-white);
}

.hm-hero__lead {
  max-width: calc(775 * var(--k));
  margin-top: calc(13.5 * var(--k));
  font-size: var(--fs-lead);
  line-height: calc(33 * var(--k));
  color: var(--c-white);
}

.hm-hero__actions {
  display: flex;
  gap: calc(21 * var(--k));
  margin-top: calc(21.5 * var(--k));
}

.hm-hero__actions .btn,
.hm-about__actions .btn {
  box-shadow: 0 8px 20px rgba(1, 76, 95, .22);
}


/* --- responsive --- */

@media (max-width: 1024px) {
  .hm-hero__inner {
    width: min(var(--container), 100% - 48px);
    margin-inline: auto;
    padding: 64px 0 56px;
  }
  .hm-hero__title { margin-top: 18px; margin-left: 0; line-height: 1.16; letter-spacing: 0; }
  .hm-hero__lead { max-width: none; margin-top: 20px; line-height: 1.6; }
  .hm-hero__actions { flex-wrap: wrap; gap: 14px; margin-top: 26px; }
}

@media (max-width: 640px) {
  .hm-hero { min-height: 220px; }
  .hm-hero__photo {
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hm-hero__inner {
    display: flex;
    min-height: 220px;
    flex-direction: column;
    justify-content: center;
    padding: 30px 0 26px;
  }
  .hm-hero__eyebrow { font-size: clamp(16px, 4.4vw, 19px); }
  .hm-hero__title {
    max-width: 340px;
    margin-top: 10px;
    font-size: clamp(34px, 10.6vw, 44px);
    line-height: 1.02;
  }
  .hm-hero__lead,
  .hm-hero__actions { display: none; }
}

@media (max-width: 480px) {
  .hm-hero__actions .btn { width: 100%; }
}

@media (max-height: 480px) and (orientation: landscape) {
  .hm-hero__inner { padding-block: 36px 32px; }
}

/* СЕКЦИЯ: HERO : КРАЙ */


/* СЕКЦИЯ: ЗА ЯЗОВИРА : НАЧАЛО */

.hm-about {
  display: grid;
  grid-template-columns: 37.8125% minmax(0, 1fr);   /* 726 / 1920 */
  align-items: start;
  background: var(--c-white);
  padding-top: calc(129 * var(--k));
  padding-bottom: calc(92 * var(--k));
}

.hm-about__media { position: relative; }

.hm-about__photo {
  position: relative;
  left: calc(-1 * var(--k));      /* премитане ±1px */
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.hm-about__badge {
  position: absolute;
  right: calc(2 * var(--k));
  bottom: 0;
  width: 47.2452%;                 /* 343 / 726 */
  min-height: 29.4766%;            /* 214 / 726 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(20 * var(--k)) calc(20 * var(--k)) calc(20 * var(--k)) calc(66 * var(--k));
  background: var(--c-brand);
  border-radius: var(--r-badge);
  color: var(--c-white);
}

.hm-about__badge-num {
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: var(--fs-badge);
  line-height: 1;
}

.hm-about__badge-sub {
  margin-top: calc(19 * var(--k));
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: var(--fs-badge-sub);
  line-height: 1;
}

.hm-about__body {
  padding-left: 4.1039%;    /* 49 / 1194 — снимката свършва на 726, текстът тръгва от 775 */
  padding-right: 14.4891%;  /* точката на пренос: макетът къса реда преди Chrome */
  padding-top: calc(88 * var(--k));
}

.hm-about__intro {
  margin-top: calc(25 * var(--k));
  font-size: var(--fs-body);
  line-height: calc(27 * var(--k));
  color: var(--c-ink);
}

.hm-about__text {
  margin-top: 0;
  font-size: var(--fs-body);
  line-height: calc(26.667 * var(--k));
  color: var(--c-ink);
}

.hm-about__intro + .hm-about__text { margin-top: calc(26 * var(--k)); }

.hm-about__lead-in {
  margin-top: calc(40.5 * var(--k));
  width: fit-content;
  max-width: 100%;
  padding: calc(12 * var(--k)) calc(18 * var(--k));
  border-left: calc(4 * var(--k)) solid var(--c-brand);
  border-radius: 0 calc(10 * var(--k)) calc(10 * var(--k)) 0;
  background: linear-gradient(90deg, rgba(3, 127, 157, .11), rgba(3, 127, 157, .035));
  box-shadow: 0 8px 22px rgba(1, 76, 95, .08);
  font-family: var(--ff-head);
  font-weight: 400;
  font-size: max(15px, calc(26 * var(--k)));
  line-height: 1.2;
  color: var(--c-ink);
}

.hm-about__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(18 * var(--k));
  margin-top: calc(20 * var(--k));
  margin-right: 0;
  padding-left: 0;
}

.hm-about__list > .hm-about__col {
  min-width: 0;
  padding: calc(22 * var(--k)) calc(20 * var(--k));
  border: 1px solid rgba(3, 127, 157, .12);
  border-radius: calc(12 * var(--k));
  background: linear-gradient(145deg, var(--c-white), rgba(241, 251, 253, .92));
  box-shadow: 0 10px 26px rgba(1, 76, 95, .08);
}

.hm-about__list .hm-about__col li {
  position: relative;
  padding-left: calc(34 * var(--k));
  padding-right: 0;
  font-size: clamp(15px, calc(16.7 * var(--k)), 17px);
  line-height: 1.45;
  color: var(--c-ink);
  margin-bottom: calc(14 * var(--k));
}

.hm-about__list .hm-about__col li:last-child { margin-bottom: 0; }

.hm-about__list .hm-about__col li::before {
  content: '';
  position: absolute;
  left: 0;
  top: calc(4 * var(--k));
  width: calc(22 * var(--k));
  height: calc(11 * var(--k));
  background: var(--c-brand);
  -webkit-mask: url('/resources/yazovir-botevo/images/icons/icon-arrow.svg') left center / contain no-repeat;
          mask: url('/resources/yazovir-botevo/images/icons/icon-arrow.svg') left center / contain no-repeat;
}

.hm-about__actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: calc(22 * var(--k));
  width: calc(914 * var(--k));
  max-width: 100%;
  margin-top: calc(20 * var(--k));
  margin-left: calc(2 * var(--k));
}


/* --- responsive --- */

@media (min-width: 1025px) and (max-width: 1439px) {
  .hm-about__body { padding-right: 5%; }
  .hm-about__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hm-about__actions { width: 100%; }
}

@media (max-width: 1024px) {
  .hm-about {
    grid-template-columns: minmax(0, 1fr);
    padding-top: 0;
    padding-bottom: 48px;
  }
  .hm-about__media {
    order: 2;
    width: 100%;
    margin-top: 40px;
  }
  .hm-about__photo { left: 0; aspect-ratio: 16 / 10; }
  .hm-about__badge {
    position: static;
    width: 100%;
    min-height: 0;
    padding: 22px 24px;
    align-items: flex-start;
  }
  .hm-about__badge-sub { margin-top: 10px; }

  .hm-about__body {
    order: 1;
    width: min(var(--container), 100% - 48px);
    margin-inline: auto;
    padding: 44px 0 0;
  }
  .hm-about__intro { margin-top: 26px; line-height: 1.55; }
  .hm-about__text { margin-top: 18px; line-height: 1.6; }
  .hm-about__intro + .hm-about__text { margin-top: 18px; }
  .hm-about__lead-in {
    margin-top: 30px;
    padding: 11px 16px;
    border-left-width: 4px;
    border-radius: 0 10px 10px 0;
    font-size: 19px;
  }
  .hm-about__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 18px;
    margin-right: 0;
    padding-left: 0;
  }
  .hm-about__list > .hm-about__col { padding: 20px; border-radius: 12px; }
  .hm-about__list .hm-about__col li {
    padding-left: 32px;
    padding-right: 0;
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 14px;
  }
  .hm-about__list .hm-about__col li::before { width: 20px; height: 10px; top: 5px; }
  .hm-about__actions {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 30px;
    margin-left: 0;
  }
}

@media (max-width: 820px) {
  .hm-about__photo { aspect-ratio: 3 / 2; }
}

@media (max-width: 640px) {
  .hm-about__list { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 480px) {
  .hm-about__actions { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 360px) {
  .hm-about__badge { padding: 18px; }
}

/* СЕКЦИЯ: ЗА ЯЗОВИРА : КРАЙ */


/* СЕКЦИЯ: УСЛУГИ : НАЧАЛО */

.hm-services {
  background: var(--c-tint);
  padding-top: calc(101 * var(--k));
  padding-bottom: calc(101 * var(--k));
}

.hm-services__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap-cards);
  margin-top: calc(36 * var(--k));
}

.hm-svc {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  background: var(--c-white);
  border-radius: var(--r-card);
  padding-bottom: calc(27 * var(--k));
  /* opacity е тук, защото [data-reveal] и .hm-svc са с еднаква специфичност,
     а components.css се зарежда ПРЕДИ pages.css — без този ред картата
     изскача рязко вместо да се появи плавно. */
  transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease),
              opacity .6s var(--ease);
}

.hm-svc:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }

.hm-svc__photo {
  width: calc(100% - 1 * var(--k));   /* картата има тънък бял кант вдясно */
  margin-right: auto;
  height: auto;
  aspect-ratio: 378 / 199;
  border-radius: calc(7 * var(--k)) calc(7 * var(--k)) 0 0;
  object-fit: cover;
}

/* премитане ±1px — стъпката на колоната в макета не е цяло число */
.hm-svc:nth-child(1) .hm-svc__photo { margin-left: calc(-1 * var(--k)); }
.hm-svc:nth-child(2) .hm-svc__photo { margin-left: calc(-1 * var(--k)); }
.hm-svc:nth-child(4) .hm-svc__photo { margin-left: calc(1 * var(--k)); }

.hm-svc__head {
  position: relative;
  width: 100%;
}

.hm-svc__badge {
  position: absolute;
  left: 50%;
  bottom: calc(-37 * var(--k));
  transform: translateX(-50%);
  margin-left: calc(-1 * var(--k));
  width: calc(86 * var(--k));
  height: calc(86 * var(--k));
}

.hm-svc__badge img { width: 100%; height: 100%; object-fit: contain; }

.hm-svc__title {
  margin-top: calc(49 * var(--k));
  margin-right: calc(2 * var(--k));
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: var(--fs-h3);
  line-height: 1;
  color: var(--c-ink);
  text-align: center;
}

.hm-svc__text {
  margin-top: calc(17 * var(--k));
  padding-inline: calc(28 * var(--k));
  font-size: var(--fs-card);
  line-height: calc(25 * var(--k));
  color: var(--c-ink);
  text-align: center;
}

.hm-svc .more { margin-top: calc(19 * var(--k)); margin-right: calc(4 * var(--k)); }


/* --- responsive --- */

@media (max-width: 1024px) {
  .hm-services { padding-top: 56px; padding-bottom: 56px; }
  .hm-services__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 32px;
  }
  .hm-svc { padding-bottom: 26px; }
  .hm-svc__photo { width: 100%; margin-left: 0; }
  .hm-svc:nth-child(2) .hm-svc__photo,
  .hm-svc:nth-child(4) .hm-svc__photo { margin-left: 0; }
  .hm-svc__badge { width: 76px; height: 76px; bottom: -32px; margin-left: 0; }
  .hm-svc__title { margin-top: 48px; margin-right: 0; }
  .hm-svc__text { margin-top: 14px; padding-inline: 20px; line-height: 1.6; }
  .hm-svc .more { margin-top: 12px; margin-right: 0; }
}

@media (max-width: 640px) {
  .hm-services__grid { grid-template-columns: minmax(0, 1fr); }
}

/* СЕКЦИЯ: УСЛУГИ : КРАЙ */


/* СЕКЦИЯ: ЗАЩО : НАЧАЛО */

.hm-why {
  display: grid;
  grid-template-columns: 55.15625% 44.84375%;   /* 1059 / 861 от 1920 */
  align-items: start;
  background: var(--c-white);
  padding-top: calc(133 * var(--k));
  padding-bottom: calc(141 * var(--k));
}

.hm-why__body {
  padding-left: 15%;         /* 159 / 1060 — клетката е 1060px при 1920 */
  padding-right: 5.66%;      /* 60 / 1060 */
  padding-top: calc(47 * var(--k));
}

.hm-why__grid {
  display: grid;
  grid-template-columns: 46.3855% minmax(0, 1fr);   /* 385 / 830 — стъпка 412 в макета */
  column-gap: 3.2530%;                              /* 27 / 830 */
  row-gap: calc(34 * var(--k));
  margin-top: calc(33 * var(--k));
  padding-left: calc(13 * var(--k));
}

.hm-feat {
  min-width: 0;
  display: grid;
  grid-template-rows: calc(68 * var(--k)) auto auto;
  align-content: start;
}

/* иконките са с различна собствена височина и лягат на общ долен ръб */
.hm-feat__icon {
  align-self: end;
  height: auto;
  object-fit: contain;
  object-position: left bottom;
}

.hm-feat__icon--sectors   { width: calc(69 * var(--k)); }
.hm-feat__icon--bungalows { width: calc(64 * var(--k)); }
.hm-feat__icon--catch     { width: calc(63 * var(--k)); }
.hm-feat__icon--family    { width: calc(69 * var(--k)); }

.hm-feat--tight .hm-feat__title { margin-top: 0; }

.hm-feat__title {
  margin-top: calc(12 * var(--k));
  font-family: var(--ff-head);
  font-weight: 300;
  font-size: var(--fs-feat);
  line-height: 1;
  color: var(--c-ink);
}

.hm-feat__text {
  margin-top: calc(11.5 * var(--k));
  font-size: var(--fs-feat-body);
  line-height: calc(20 * var(--k));
  color: var(--c-ink);
}

.hm-why__media {
  position: relative;
  margin-top: calc(-1 * var(--k));
}

.hm-why__poster {
  width: 100%;
  height: auto;
  aspect-ratio: 861 / 537;
  object-fit: cover;
}

.hm-why__bar {
  position: absolute;
  left: .1162%;
  bottom: calc(2 * var(--k));
  width: 99.7674%;      /* 858 / 860 */
  height: auto;
}

.hm-why__play {
  position: absolute;
  left: 50.17%;
  top: 50.09%;
  transform: translate(-50%, -50%);
  width: 8.7209%;       /* 75 / 860 */
  min-width: 48px;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

.hm-why__play img { width: 100%; height: auto; }
.hm-why__play:hover { transform: translate(-50%, -50%) scale(1.07); }


/* --- responsive --- */

@media (min-width: 1025px) and (max-width: 1439px) {
  .hm-why__body { padding-left: 6%; padding-right: calc(40 * var(--k)); }
  .hm-why__grid { column-gap: calc(40 * var(--k)); }
}

@media (max-width: 1024px) {
  .hm-why {
    grid-template-columns: minmax(0, 1fr);
    padding-top: 56px;
    padding-bottom: 56px;
    row-gap: 36px;
  }
  .hm-why__body {
    width: min(var(--container), 100% - 48px);
    margin-inline: auto;
    padding: 0;
  }
  .hm-why__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
    row-gap: 32px;
    margin-top: 30px;
    padding-left: 0;
  }
  .hm-feat { grid-template-rows: 58px auto auto; }
  .hm-feat__icon--sectors, .hm-feat__icon--family { width: 60px; }
  .hm-feat__icon--bungalows, .hm-feat__icon--catch { width: 54px; }
  .hm-feat__title { margin-top: 12px; }
  .hm-feat--tight .hm-feat__title { margin-top: 12px; }
  .hm-feat__text { margin-top: 8px; line-height: 1.5; }
  .hm-why__media { margin-top: 0; }
}

@media (max-width: 640px) {
  .hm-why__grid { grid-template-columns: minmax(0, 1fr); }
}

/* СЕКЦИЯ: ЗАЩО : КРАЙ */


/* СЕКЦИЯ: ОТЗИВИ И АКТУАЛНО : НАЧАЛО */

.hm-news {
  background: var(--c-tint);
  padding-top: calc(125 * var(--k));
  padding-bottom: calc(160 * var(--k));
}

.hm-news__inner {
  display: grid;
  grid-template-columns: 718fr 768fr;
  column-gap: calc(36 * var(--k));      /* цяло число — иначе колоната пада на половин пиксел */
  padding-left: calc(72 * var(--k));    /* → x232 */
  padding-right: calc(6 * var(--k));    /* → x1754 */
}

.hm-news .section-title { color: var(--c-ink-soft); }
.hm-news .section-title::after { margin-top: calc(17 * var(--k)); }

.hm-news__col { min-width: 0; }

.hm-reviews {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: 1fr;
  row-gap: calc(35 * var(--k));
  margin-top: calc(18 * var(--k));
}

.hm-reviews > .hm-review {
  background: var(--c-white);
  border-radius: var(--r-review);
  padding: clamp(30px, calc(44 * var(--k)), 44px)
           clamp(28px, calc(42 * var(--k)), 42px)
           clamp(34px, calc(42 * var(--k)), 42px);
  border: 1px solid rgba(3, 127, 157, .08);
  box-shadow: 0 12px 32px rgba(1, 76, 95, .11);
  transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease),
              opacity .6s var(--ease);
}

.hm-reviews > .hm-review:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }

.hm-review__stars {
  display: flex;
  gap: calc(5 * var(--k));
  line-height: 0;
}

.hm-review__stars img {
  width: calc(20 * var(--k));
  height: calc(19 * var(--k));
  object-fit: contain;
}

.hm-review__title {
  margin-top: calc(15 * var(--k));
  font-weight: 500;
  font-size: clamp(15px, calc(18.42 * var(--k)), 19px);
  line-height: 1.35;
  color: var(--c-ink);
}

.hm-review__text {
  max-width: 68ch;
  margin-top: calc(10 * var(--k));
  font-size: clamp(15px, calc(16.67 * var(--k)), 17px);
  line-height: 1.65;
  color: var(--c-ink);
}

.hm-feed {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: calc(28 * var(--k));
  margin-top: calc(16 * var(--k));
  margin-left: calc(-1 * var(--k));
}

.hm-post {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: calc(333 * var(--k)) minmax(0, 1fr);
  column-gap: calc(25 * var(--k));
  align-items: start;
  min-width: 0;
}

/* Подложката е ::before, не padding — иначе при посочване лейаутът щеше да
   подскача. В покой е прозрачна, така че сравнението с макета не вижда нищо. */
.hm-post::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: calc(-14 * var(--k)) calc(-18 * var(--k));
  border-radius: calc(8 * var(--k));
  background: var(--c-white);
  box-shadow: var(--shadow-rest);
  opacity: 0;
  transition: opacity var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.hm-post:hover::before { opacity: 1; box-shadow: var(--shadow-hover); }

.hm-post__photo {
  width: 100%;
  height: auto;
  aspect-ratio: 333 / 265;
  border-radius: calc(6 * var(--k));
  object-fit: cover;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.hm-post:hover .hm-post__photo {
  transform: translateY(calc(-4 * var(--k)));
  box-shadow: var(--shadow-hover);
}

.hm-post__body {
  min-width: 0;
  padding-top: calc(52 * var(--k));
}

.hm-post__title {
  font-weight: 500;
  font-size: var(--fs-news);
  line-height: calc(30 * var(--k));
  color: var(--c-ink);
  padding-bottom: calc(7 * var(--k));
  border-bottom: 1px solid var(--c-hairline);
  transition: border-color var(--dur) var(--ease);
}

.hm-post:hover .hm-post__title { border-bottom-color: var(--c-brand); }

.hm-post__text {
  margin-top: calc(13 * var(--k));
  margin-left: calc(-2 * var(--k));
  margin-right: calc(-6 * var(--k));   /* точката на пренос: макетът побира реда, Chrome — не */
  font-size: max(13px, calc(15.6 * var(--k)));
  line-height: calc(28 * var(--k));
  color: var(--c-ink);
}

.hm-post__more {
  display: block;
  width: fit-content;
  line-height: 0;
  margin-top: calc(5 * var(--k));
  transition: transform var(--dur) var(--ease);
}

.hm-post__more img {
  width: calc(56 * var(--k));
  height: calc(13 * var(--k));
  object-fit: contain;
}

.hm-post__more:hover { transform: translateX(5px); }


/* --- responsive --- */

@media (max-width: 1024px) {
  .hm-news { padding-top: 56px; padding-bottom: 56px; }
  .hm-news__inner {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 44px;
    padding-inline: 0;
  }
  .hm-reviews { grid-auto-rows: auto; row-gap: 20px; margin-top: 24px; }
  .hm-reviews > .hm-review { padding: 26px 24px; }
  .hm-review__stars img { width: 18px; height: 17px; }
  .hm-review__title { margin-top: 14px; font-size: 17px; line-height: 1.3; }
  .hm-review__text { margin-top: 8px; font-size: 16px; line-height: 1.6; }

  .hm-feed { row-gap: 24px; margin-top: 24px; margin-left: 0; }
  .hm-post { grid-template-columns: 40% minmax(0, 1fr); column-gap: 20px; }
  .hm-post__body { padding-top: 0; }
  .hm-post__title { padding-bottom: 10px; line-height: 1.35; }
  .hm-post__text { margin-top: 10px; margin-inline: 0; font-size: 16px; line-height: 1.55; }
  .hm-post__more { margin-top: 10px; min-height: 48px; display: flex; align-items: center; }
  .hm-post__more img { width: 52px; height: 12px; }
}

@media (max-width: 640px) {
  .hm-post { grid-template-columns: minmax(0, 1fr); row-gap: 16px; }
  .hm-post__photo { aspect-ratio: 16 / 10; }
}

@media (max-width: 480px) {
  .hm-reviews > .hm-review { padding: 24px 20px 28px; }
}

/* СЕКЦИЯ: ОТЗИВИ И АКТУАЛНО : КРАЙ */


/* ================================================================
   СТРАНИЦА: CONTACTS — префикс ko- на всички собствени класове
   ================================================================ */

/* СЕКЦИЯ: HERO : НАЧАЛО */

.ko-hero {
  position: relative;
  isolation: isolate;
  overflow: clip;
  background: var(--c-tint-deep);
}

.ko-hero__photo {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  margin-top: calc(-2 * var(--k));
  margin-bottom: calc(-2 * var(--k));
}

/* --- responsive --- */

@media (max-width: 1024px) {
  .ko-hero__photo { margin-block: 0; }
}

/* СЕКЦИЯ: HERO : КРАЙ */


/* СЕКЦИЯ: КОНТАКТИ И ФОРМА : НАЧАЛО */

.ko-main {
  background: var(--c-white);
  padding-top: calc(92 * var(--k));
  padding-bottom: calc(85 * var(--k));
}

.ko-main__inner {
  display: grid;
  grid-template-columns: 51.875% minmax(0, 1fr);   /* 830 / 1600 */
  column-gap: calc(52 * var(--k));
  align-items: start;
}

/* ---------- лява колона ---------- */

.ko-info { text-align: center; }

.ko-info__photo {
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  position: relative;
  left: calc(-1 * var(--k));    /* премитане ±1px спрямо макета */
  top: calc(-2 * var(--k));
  width: 93.3735%;              /* 775 / 830 */
  max-width: 100%;
  height: auto;
  margin-inline: auto;
  aspect-ratio: 775 / 327;
  border-radius: calc(5 * var(--k));
  object-fit: cover;
}

.ko-info__photo:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
}

.ko-info__title {
  margin-top: calc(21 * var(--k));
  text-align: center;
}

.ko-info__list { margin-top: calc(28 * var(--k)); }

.ko-info__list dt {
  font-size: max(13px, calc(17.8 * var(--k)));
  line-height: calc(26 * var(--k));
  color: var(--c-ink);
}

.ko-info__list dd {
  margin: 0;
  font-weight: 500;
  font-size: max(14px, calc(19.9 * var(--k)));
  line-height: calc(27 * var(--k));
  color: var(--c-ink);
}

.ko-info__list dd + dt { margin-top: calc(16 * var(--k)); }

.ko-info__list a { transition: color var(--dur) var(--ease); }
.ko-info__list a:hover { color: var(--c-brand); }

.ko-info__social-label {
  margin-top: calc(23 * var(--k));
  font-size: max(13px, calc(17.7 * var(--k)));
  line-height: calc(26 * var(--k));
  color: var(--c-ink);
}

.ko-social {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: calc(15 * var(--k));
  margin-top: calc(10 * var(--k));
}

.ko-social__link {
  display: block;
  background-color: var(--c-brand);
  transition: background-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.ko-social__link:hover { background-color: var(--c-brand-dark); transform: translateY(-2px); }

.ko-social__link--fb {
  width: calc(11 * var(--k));
  height: calc(20 * var(--k));
  -webkit-mask: url('/resources/images/icons/icon-facebook.svg') center / contain no-repeat;
          mask: url('/resources/images/icons/icon-facebook.svg') center / contain no-repeat;
}
.ko-social__link--ig {
  width: calc(21 * var(--k));
  height: calc(21 * var(--k));
  -webkit-mask: url('/resources/images/icons/icon-instagram.svg') center / contain no-repeat;
          mask: url('/resources/images/icons/icon-instagram.svg') center / contain no-repeat;
}
.ko-social__link--pin {
  width: calc(16 * var(--k));
  height: calc(20 * var(--k));
  -webkit-mask: url('/resources/images/icons/icon-pinterest.svg') center / contain no-repeat;
          mask: url('/resources/images/icons/icon-pinterest.svg') center / contain no-repeat;
}
.ko-social__link--yt {
  width: calc(27 * var(--k));
  height: calc(19 * var(--k));
  -webkit-mask: url('/resources/images/icons/icon-youtube.svg') center / contain no-repeat;
          mask: url('/resources/images/icons/icon-youtube.svg') center / contain no-repeat;
}

/* ---------- формата ---------- */

.ko-form {
  background: var(--c-panel);
  border-radius: var(--r-panel);
  padding: calc(49 * var(--k)) calc(73 * var(--k)) calc(39 * var(--k)) calc(72 * var(--k));
}

.ko-form__title { text-align: center; }

.ko-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: calc(11 * var(--k));
  row-gap: calc(12 * var(--k));
  margin-top: calc(35 * var(--k));
}

.ko-field { min-width: 0; }
.ko-field--wide { grid-column: 1 / -1; margin-top: calc(6 * var(--k)); }

.ko-field input,
.ko-field textarea {
  display: block;
  width: 100%;
  height: calc(64 * var(--k));
  padding: 0 calc(20 * var(--k));
  background: var(--c-white);
  border: 1px solid var(--c-field-line);
  border-radius: var(--r-field);
  color: var(--c-ink);
  font-family: var(--ff-body);
  font-weight: 300;
  font-size: max(16px, calc(17.9 * var(--k)));
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.ko-field textarea {
  height: calc(153 * var(--k));
  padding: calc(18 * var(--k)) calc(20 * var(--k));
  resize: vertical;
}

.ko-field input::placeholder,
.ko-field textarea::placeholder { color: var(--c-ink); opacity: 1; }

.ko-field input:focus,
.ko-field textarea:focus {
  border-color: var(--c-brand);
  box-shadow: 0 0 0 2px rgba(3, 127, 157, .14);
  outline: none;
}

.ko-consent {
  display: grid;
  grid-template-columns: 3.652% minmax(0, 80.35%);   /* 21 и 462 от 575 */
  column-gap: calc(5 * var(--k));
  align-items: start;
  margin-top: calc(37 * var(--k));
}

.ko-consent input {
  width: calc(21 * var(--k));
  height: calc(21 * var(--k));
  margin: 0;
  accent-color: var(--c-brand);
}

.ko-consent label {
  font-size: max(13px, calc(15.27 * var(--k)));
  line-height: calc(15 * var(--k));
  color: var(--c-ink);
  cursor: pointer;
}

.ko-form__bottom {
  display: grid;
  grid-template-columns: calc(130 * var(--k)) minmax(0, 1fr) calc(248 * var(--k));
  column-gap: calc(11 * var(--k));
  row-gap: calc(14 * var(--k));
  align-items: center;
  margin-top: calc(28 * var(--k));
}

.ko-captcha {
  width: calc(130 * var(--k));
  height: calc(53 * var(--k));
  border-radius: calc(3 * var(--k));
  object-fit: cover;
}

.ko-field--code { margin: 0; }
.ko-field--code input { height: calc(55 * var(--k)); }

.ko-submit {
  min-width: 0;
  width: 100%;
  height: calc(55 * var(--k));
  border: 0;
  cursor: pointer;
}

/* --- responsive --- */

@media (min-width: 1025px) and (max-width: 1439px) {
  .ko-form { padding-inline: calc(48 * var(--k)); }
}

@media (max-width: 1024px) {
  .ko-main { padding-top: 48px; padding-bottom: 48px; }
  .ko-main__inner {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 40px;
    column-gap: 0;
  }
  .ko-info__photo { width: 100%; aspect-ratio: 16 / 9; }
  .ko-info__title { margin-top: 22px; }
  .ko-info__list { margin-top: 18px; }
  .ko-info__list dt { font-size: 16px; line-height: 1.5; }
  .ko-info__list dd { font-size: 18px; line-height: 1.4; }
  .ko-info__list dd + dt { margin-top: 14px; }
  .ko-info__list a { display: inline-block; min-height: 48px; line-height: 48px; }
  .ko-info__social-label { margin-top: 24px; font-size: 16px; line-height: 1.5; }
  .ko-social { gap: 8px; margin-top: 6px; }
  .ko-social__link { -webkit-mask-size: 22px; mask-size: 22px; }
  .ko-social__link--fb  { width: 48px; height: 48px; }
  .ko-social__link--ig  { width: 48px; height: 48px; }
  .ko-social__link--pin { width: 48px; height: 48px; }
  .ko-social__link--yt  { width: 48px; height: 48px; }

  .ko-form { padding: 28px 24px; }
  .ko-form__grid { margin-top: 24px; column-gap: 16px; row-gap: 16px; }
  .ko-field--wide { margin-top: 0; }
  .ko-field input, .ko-field textarea { height: 52px; padding-inline: 16px; font-size: max(16px, 1rem); }
  .ko-field textarea { height: 140px; padding-block: 14px; }
  .ko-consent { margin-top: 24px; grid-template-columns: 44px minmax(0, 1fr); column-gap: 10px; align-items: center; }
  .ko-consent input { width: 44px; height: 44px; }   /* цел за докосване — одитът иска 44 */
  .ko-consent label { font-size: 14px; line-height: 1.45; }
  .ko-form__bottom {
    grid-template-columns: 130px minmax(0, 1fr) 180px;
    column-gap: 12px;
    margin-top: 24px;
  }
  .ko-captcha { width: 130px; height: 53px; }
  .ko-field--code input { height: 52px; }
  .ko-submit { height: auto; min-height: 52px; }
}

@media (max-width: 640px) {
  .ko-form__grid { grid-template-columns: minmax(0, 1fr); }
  .ko-form__bottom { grid-template-columns: 130px minmax(0, 1fr); }
  .ko-submit { grid-column: 1 / -1; }
}

@media (max-width: 380px) {
  .ko-form { padding: 22px 16px; }
  .ko-form__bottom { grid-template-columns: minmax(0, 1fr); }
}

/* СЕКЦИЯ: КОНТАКТИ И ФОРМА : КРАЙ */


/* СЕКЦИЯ: КАРТА : НАЧАЛО */

.ko-map {
  background: var(--c-white);
  padding-bottom: calc(69 * var(--k));
}

.ko-map__img {
  display: block;
  width: 100.25%;               /* 1604 / 1600 — картата излиза на 2px от двете страни */
  max-width: none;
  height: auto;
  margin-inline: auto;
  aspect-ratio: 1604 / 490;
  object-fit: cover;
}

/* --- responsive --- */

@media (max-width: 1024px) {
  .ko-map { padding-bottom: 40px; }
  .ko-map__img { width: 100%; }
}

/* СЕКЦИЯ: КАРТА : КРАЙ */


/* ================================================================
   СТРАНИЦА: ЗА ЯЗОВИРА — префикс za- на всички собствени класове.
   Секциите „УСЛУГИ“ и „ЗАЩО“ са същите като на началната и се
   преизползват без нито един нов ред стил.
   ================================================================ */

/* СЕКЦИЯ: HERO : НАЧАЛО */

.za-hero {
  position: relative;
  isolation: isolate;
  overflow: clip;
  background: var(--c-tint-deep);
}

.za-hero__photo {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  margin-top: calc(-2 * var(--k));
  margin-bottom: calc(-2 * var(--k));
}

.page-cover {
  position: relative;
  width: 100%;
  max-height: 320px;
  aspect-ratio: 6 / 1;
  overflow: hidden;
  background: var(--c-tint-deep);
}

.page-cover__photo {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover;
  object-position: center;
}

/* --- responsive --- */

@media (max-width: 1024px) {
  .za-hero__photo { margin-block: 0; }
}

/* СЕКЦИЯ: HERO : КРАЙ */


/* СЕКЦИЯ: ПРЕДСТАВЯНЕ : НАЧАЛО */

.za-intro {
  background: var(--c-white);
  padding-top: calc(74.5 * var(--k));
  padding-bottom: calc(53.3 * var(--k));
}

.za-intro__title {
  font-family: var(--ff-head);
  font-weight: 400;
  font-size: clamp(30px, 2.7125vw, 52.08px);
  line-height: 1;
  color: var(--c-ink-soft);
  text-align: center;
}

.page-family__heading {
  padding-top: calc(74.5 * var(--k));
  background: var(--c-white);
}

.page-family__content > .za-intro { padding-top: 0; }
.page-family__content > .info-page { padding-top: clamp(36px, 4vw, 64px); }

/* Кутията на блоковете НЕ е центрирана в макета: 207.7 отляво, 175 отдясно.
   Затова е с изричен ляв отстъп, а не с .container. */
.za-intro__inner {
  display: grid;
  row-gap: calc(69 * var(--k));
  width: 80.0573%;             /* 1537 / 1920 */
  margin-left: 10.8177%;       /* 207.7 / 1920 */
  margin-top: calc(63 * var(--k));
}

.za-block {
  --za-lead: clamp(20px, 1.2865vw, 24.7px);
  display: grid;
  grid-template-columns: minmax(0, 632fr) minmax(0, 840fr);
  column-gap: 4.2290%;         /* 65 / 1537 */
  align-items: center;
}

.za-block--flip {
  --za-lead: clamp(23px, 1.5104vw, 29px);
  grid-template-columns: minmax(0, 849fr) minmax(0, 632fr);
  column-gap: 3.6435%;         /* 56 / 1537 */
  align-items: start;
}

.za-block__photo {
  width: 100%;
  max-width: none;
  height: auto;
  aspect-ratio: 632 / 488;
  object-fit: cover;
  border-radius: calc(5 * var(--k));
}

/* Всяка от четирите снимки е премитана поотделно срещу макета (търсене по
   най-малко разминаване): собствен размер, собствено ляво и горно отместване. */
.za-block__photo { margin-left: calc(-1 * var(--k)); }
.za-block--flip .za-block__photo { margin-left: 0; }
.za-block:nth-child(2) .za-block__photo { margin-top: calc(1 * var(--k)); }
.za-block:nth-child(3) .za-block__photo { width: calc(100% - 1 * var(--k)); aspect-ratio: 631 / 489; margin-left: 0; }
.za-block:nth-child(4) .za-block__photo { width: calc(100% - 1 * var(--k)); aspect-ratio: 631 / 489; margin-left: calc(1 * var(--k)); margin-top: calc(-1 * var(--k)); }
.za-block:nth-child(4) .za-block__body { padding-top: calc(76.9 * var(--k)); }

.za-block--flip .za-block__body { padding-top: calc(77.9 * var(--k)); }

/* дясната колона е с 5px по-тясна от улея — иначе „за“ се качва на първия ред */
.za-block__body { padding-right: calc(5 * var(--k)); }
.za-block--flip .za-block__body { padding-right: 0; }

.za-block__title {
  font-family: var(--ff-head);
  font-weight: 350;
  font-size: var(--fs-h3);
  line-height: 1;
  color: var(--c-ink);
}

.za-block__title::after {
  content: '';
  display: block;
  width: calc(100 * var(--k));
  height: calc(2 * var(--k));
  margin-top: calc(32.2 * var(--k));
  background: var(--c-brand);
  opacity: .55;
}

.za-actions {
  display: flex;
  justify-content: center;
  gap: calc(21 * var(--k));
  margin-top: calc(58.2 * var(--k));
}

.za-action {
  min-width: 0;
  width: calc(213.5 * var(--k));
  height: calc(69 * var(--k));
  font-size: max(13px, calc(17 * var(--k)));
}

/* „ЗАЩО“ е същата секция като на началната, но макетът я дава с 1px по-нагоре
   съдържание и 6px повече отдолу. Тези два реда са ЕДИНСТВЕНАТА разлика —
   .hm-why не се пипа, за да не мръдне началната. */
.za-why { padding-top: calc(132 * var(--k)); padding-bottom: calc(147 * var(--k)); }
.za-why__body { padding-top: calc(46.5 * var(--k)); }

.za-block__text {
  font-size: clamp(14px, 0.875vw, 16.8px);
  line-height: var(--za-lead);
  color: var(--c-ink);
}

.za-block__title + .za-block__text { margin-top: calc(23 * var(--k)); }
.za-block--flip .za-block__title + .za-block__text { margin-top: calc(19 * var(--k)); }
.za-block__text + .za-block__text { margin-top: var(--za-lead); }


/* --- responsive --- */

@media (max-width: 1024px) {
  .page-cover {
    height: clamp(104px, 32vw, 160px);
    max-height: none;
    aspect-ratio: auto;
  }
  .page-family__heading { padding-top: 36px; }
  .za-intro { padding-top: 40px; padding-bottom: 56px; }
  .za-why { padding-top: 56px; padding-bottom: 56px; }
  .za-intro__inner {
    width: min(var(--container), 100% - 48px);
    margin-left: auto;
    margin-right: auto;
    margin-top: 32px;
    row-gap: 44px;
  }
  .za-block { grid-template-columns: minmax(0, 1fr); }
  .za-block--flip { grid-template-columns: minmax(0, 1fr); }
  .za-block,
  .za-block--flip {
    --za-lead: 1.6;
    column-gap: 0;
    row-gap: 20px;
    align-items: start;
  }
  .za-block--flip .za-block__photo { order: -1; }
  .za-block--flip .za-block__body { padding-top: 0; }
  .za-block__photo { border-radius: 6px; margin-left: 0; }
  .za-block:nth-child(2) .za-block__photo, .za-block:nth-child(3) .za-block__photo, .za-block:nth-child(4) .za-block__photo { width: 100%; margin: 0; aspect-ratio: 632 / 488; }
  .za-block:nth-child(4) .za-block__body { padding-top: 0; }
  .za-why__body { padding-top: 0; }
  .za-block__title::after { margin-top: 18px; }
  .za-block__body { padding-right: 0; }
  .za-actions { flex-wrap: wrap; gap: 16px; margin-top: 40px; }
  .za-action { width: calc(50% - 8px); height: 52px; font-size: 15px; }
  .za-block__title + .za-block__text { margin-top: 16px; }
  .za-block--flip .za-block__title + .za-block__text { margin-top: 16px; }
  .za-block__text + .za-block__text { margin-top: 14px; }
  .za-block__text { font-size: 16px; }
}

/* СЕКЦИЯ: ПРЕДСТАВЯНЕ : КРАЙ */