/* ===== Typography unification: one body font + one text scale everywhere =====
   Audit found FOUR different body fonts in play (TildaSans inline overrides on some
   blocks, Manrope as the sitewide default on others, and the custom contacts modal had
   no font-family at all so it fell all the way back to Times New Roman), plus font sizes
   randomly ranging 18-26px for what should be equivalent body paragraphs. */
.contacts-modal-box, .contacts-modal-subtitle, .contacts-modal-label {
  font-family: Manrope, Arial, sans-serif !important;
}
.contacts-modal-title {
  font-family: 'Shantell Sans', sans-serif !important;
}
[class*="__descr"], [class*="__text"], .t-descr, .t-text, .t531__text {
  font-family: Manrope, Arial, sans-serif !important;
}
/* Some paragraphs have font-family set inline directly on their , which normal
   external CSS can't beat by targeting the parent - only an !important rule matching
   the inline-styled element itself can override an inline (non-!important) style. */
[style*="font-family: TildaSans"], [style*="font-family:TildaSans"] {
  font-family: Manrope, Arial, sans-serif !important;
}
#rec572999640 .t486__descr,
#rec583152252 .t486__descr,
#rec2661017701 .t-text,
#rec583160182 .t531__text {
  font-size: 21px !important;
  color: #2d2d2d !important;
}
#rec571258793 .t498__col-wrapper [data-customstyle] {
  font-size: 18px !important;
}

/* ===== Unified dark-navy palette (Perfect Favorit) ===== */
.t-btnflex.t-btnflex_type_button,
.t-btnflex.t-btnflex_type_submit{background-color:#16243d !important; border-radius:30px !important;}
.t-btnflex.t-btnflex_type_button:hover,
.t-btnflex.t-btnflex_type_submit:hover{background-color:#24395c !important;}
.t795__title,.t795__title span,.t486__title,.t486__title span,[style*="377e9b"]{color:#16243d !important;}

/* ===== Button unification: "Отправить" (form submit) rendered black/square while every other
   CTA on the site is the navy pill above - it only matched .t-btnflex_type_button, not _type_submit.
   "Оставить заявку" trigger and the modal close (×) are plain  elements with no font-family,
   so browsers fall back to their default UI font (Arial) instead of the site's Manrope. ===== */
.request-modal-trigger,
.contacts-modal-close {
  font-family: Manrope, Arial, sans-serif !important;
}
.request-modal-trigger {
  border-radius: 30px !important;
}


/* ===== Smooth transitions between sections ===== */
html{scroll-behavior:smooth;}
.r.t-rec{transition:background-color .5s ease;}

/* ===== Subtle hover micro-interactions ===== */
.t486__blockimg,.t531__blockimg{transition:transform .5s ease;}
.t486__blockimg:hover,.t531__blockimg:hover{transform:scale(1.03);}
.t-btnflex.t-btnflex_type_button{transition:background-color .3s ease, transform .2s ease;}
.t-btnflex.t-btnflex_type_button:hover{transform:translateY(-2px);}

/* ===== Wider content container on large screens ===== */
@media (min-width: 1201px) {
  .t-container { max-width: 1400px; }
}

/* ===== Hero: shift background focus toward the dog/handler, away from the empty left side =====
   Two different slide photos, two different dog positions - each needs its own focal point. */
@media (min-width: 961px) {
  #rec1049144711 .t-cover__carrier[data-content-cover-bg*="DSC04298"] { background-size: 115% auto !important; background-position: 5% 60% !important; }
  #rec1049144711 .t-cover__carrier[data-content-cover-bg*="3W4A4290"] { background-position: 46% 90% !important; }
}
@media (max-width: 960px) {
  #rec1049144711 .t-cover__carrier[data-content-cover-bg*="DSC04298"] { background-position: 50% 65% !important; }
  #rec1049144711 .t-cover__carrier[data-content-cover-bg*="3W4A4290"] { background-position: 42% 70% !important; }
}
/* ===== Empty anchor/spacer records should never add visible gap (e.g. between hero and О нас) ===== */
.r.t-rec[data-record-type="215"] { padding-top: 0 !important; padding-bottom: 0 !important; }

/* ===== Mobile: tight, gap-free section spacing ===== */
@media (max-width: 640px) {
  .r.t-rec { padding-top: 24px !important; padding-bottom: 24px !important; }

  /* Наши собаки slider: title's default 28px bottom padding + multi-line uppercase name
     reads as a big empty stripe before the meta text on narrow screens. */
  #rec2680699101 .t801__title { padding-bottom: 4px !important; line-height: 1.15 !important; }
  #rec2680699101 .t-text_md { padding-top: 2px !important; }

  /* Heading-only blocks (Наши собаки / Щенки вест хайленд вайт терьера): the title's own
     40px margin-bottom is meant for a descr that isn't present in these blocks, so it was
     just adding trailing whitespace before the next block already has its own top padding. */
  #rec2660988601 .t795__title, #rec2661016601 .t795__title { margin-bottom: 0 !important; }
  #rec2660988601, #rec2661016601 { padding-bottom: 8px !important; }

  /* О нас / Тримминг: descr had 45px padding-top + 23px margin-top (68px total) under the title */
  #rec572999640 .t486__descr, #rec583152252 .t486__descr { padding-top: 0 !important; margin-top: 8px !important; }

  /* Hero slide: title -> descr gap */
  #rec1049144711 .t734__descr { margin-top: 12px !important; }

  /* Про уход за собаками: title -> text gap */
  #rec583160182 .t531__title.t531__bottommargin_lg { margin-bottom: 8px !important; }

  /* Про уход за собаками: photo had extra 26px side margins on top of the column's own 20px
     padding, so it rendered small and indented further right than the title/text below it. */
  #rec583160182 .t531__imgwrapper { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; }

  /* Puppy gallery: only 2 photos remain (was designed for a 4-photo 2x2 grid), so the leftover
     small/large tile split crops the litter-presentation graphic badly. Stack both full-width instead. */
  #rec2661020501 .t662__row { flex-direction: column; }
  #rec2661020501 .t662__tile { min-height: 260px; width: 100% !important; margin: 0 0 20px 0 !important; }

  /* Тримминг: same 4-photo grid issue as О нас - convert to swipeable single-photo carousel */
  #rec583152252 .t486__imgcontainer { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  #rec583152252 .t486__row { display: contents; }
  #rec583152252 .t486__imgwrapper { flex: 0 0 100%; scroll-snap-align: center; height: 300px !important; position: relative; }
  #rec583152252 .t486__blockimg { height: 300px !important; }
  #rec583152252 .t486__separator { display: none; }

  /* Advantages/icons block: tighten spacing between icon and caption, and between cards */
  #rec571258793 .t498__col-wrapper { padding-bottom: 20px !important; }
  #rec571258793 .t498__img { margin-bottom: 14px !important; }

  /* Swipe hint on photo carousels (pure CSS chevron, no embedded SVG - Tilda strips inline SVG in data-URIs) */
  #rec572999640 .t486__imgcontainer, #rec583152252 .t486__imgcontainer { position: relative; }
  #rec572999640 .t486__imgcontainer::after, #rec583152252 .t486__imgcontainer::after {
    content: ""; position: absolute; right: 14px; bottom: 14px; width: 26px; height: 26px;
    background: rgba(20,30,50,0.55); border-radius: 50%;
    pointer-events: none; z-index: 20;
  }
  #rec572999640 .t486__imgcontainer::before, #rec583152252 .t486__imgcontainer::before {
    content: ""; position: absolute; right: 22px; bottom: 21px; width: 8px; height: 8px;
    border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg);
    pointer-events: none; z-index: 21;
  }

  /* Hero title: improve legibility over busy photo background */
  #rec1049144711 .t734__title { text-shadow: 0 2px 10px rgba(0,0,0,0.55), 0 1px 3px rgba(0,0,0,0.5); }
}
/* Bellatrix slider photo: source photo already crops the handler's head, leaving a stray arm/sleeve in the top-right corner. Zoom/reposition to exclude it, keep only the dog in frame. */
@media (max-width: 640px) {
  [data-original*="bellatrix"] { background-size: 145% !important; background-position: 30% 65% !important; }
}


.contacts-modal-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(20,30,45,0.6); z-index:99999; align-items:center; justify-content:center; padding:20px; box-sizing:border-box; }
.contacts-modal-overlay.contacts-modal-open { display:flex; }
.contacts-modal-box { background-color:#f5f2ec; background-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2290%22%20height%3D%2290%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23b0583a%22%20fill-opacity%3D%220.08%22%20d%3D%22M226.5%2092.9c14.3%2042.9-.3%2086.2-32.6%2096.8s-70.1-15.6-84.4-58.5s.3-86.2%2032.6-96.8s70.1%2015.6%2084.4%2058.5zM100.4%20198.6c18.9%2032.4%2014.3%2070.1-10.2%2084.1s-59.7-.9-78.5-33.3S-2.7%20179.3%2021.8%20165.3s59.7%20.9%2078.5%2033.3zM69.2%20401.2C121.6%20259.9%20214.7%20224%20256%20224s134.4%2035.9%20186.8%20177.2c3.6%209.7%205.2%2020.1%205.2%2030.5l0%201.6c0%2025.8-20.9%2046.7-46.7%2046.7c-11.5%200-22.9-1.4-34-4.2l-88-22c-15.3-3.8-31.3-3.8-46.6%200l-88%2022c-11.1%202.8-22.5%204.2-34%204.2C84.9%20480%2064%20459.1%2064%20433.3l0-1.6c0-10.4%201.6-20.8%205.2-30.5zM421.8%20282.7c-24.5-14-29.1-51.7-10.2-84.1s54-47.3%2078.5-33.3s29.1%2051.7%2010.2%2084.1s-54%2047.3-78.5%2033.3zM310.1%20189.7c-32.3-10.6-46.9-53.9-32.6-96.8s52.1-69.1%2084.4-58.5s46.9%2053.9%2032.6%2096.8s-52.1%2069.1-84.4%2058.5z%22/%3E%3C/svg%3E'); background-repeat:repeat; background-size:90px 90px; border-radius:24px; padding:56px 64px 64px; width:100%; max-width:620px; position:relative; box-shadow:0 30px 80px rgba(0,0,0,0.3); text-align:center; }
.contacts-modal-title { margin:0 0 14px 0; font-family:'Shantell Sans', sans-serif; font-size:38px; font-weight:700; color:#16243d; text-align:center; }
.contacts-modal-subtitle { margin:0 0 40px 0; font-size:21px; color:#16243d; opacity:0.85; text-align:center; }
.contacts-modal-close { position:absolute; top:18px; right:20px; background:none; border:none; font-size:28px; line-height:1; cursor:pointer; color:#16243d; opacity:0.5; transition:opacity 0.15s ease; }
.contacts-modal-close:hover { opacity:1; }
.contacts-modal-grid { display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; gap:40px 36px; }
.contacts-modal-item { display:flex; flex-direction:column; align-items:center; gap:14px; width:100px; color:#16243d; text-decoration:none; }
.contacts-modal-item[href^="mailto:"], .contacts-modal-item[href^="tel:"] { width:auto; max-width:none; }
.contacts-modal-item[href^="mailto:"] .contacts-modal-label { white-space:nowrap; }
.contacts-modal-icon { width:68px; height:68px; display:flex; align-items:center; justify-content:center; transition:transform 0.2s ease, opacity 0.2s ease; }
.contacts-modal-icon svg { width:68px; height:68px; }
.contacts-modal-item:hover .contacts-modal-icon { transform:translateY(-4px); opacity:0.8; }
.contacts-modal-label { font-size:15px; font-weight:600; text-align:center; line-height:1.3; word-break:break-word; }
.contacts-modal-item[href^="tel:"] .contacts-modal-label { color:#b0583a; }
@media (max-width: 480px) {
  .contacts-modal-box { padding:52px 28px; background-size:70px 70px; }
  .contacts-modal-title { font-size:26px; }
  .contacts-modal-subtitle { font-size:16px; margin-bottom:36px; }
  .contacts-modal-grid { gap:26px 20px; }
  .contacts-modal-item { width:80px; }
  .contacts-modal-icon, .contacts-modal-icon svg { width:52px; height:52px; }
}


/* ===== О нас: mobile swipeable photo carousel (was missing - only Тримминг had it) ===== */
@media (max-width: 640px) {
  #rec572999640 .t486__imgcontainer { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  #rec572999640 .t486__row { display: contents; }
  #rec572999640 .t486__imgwrapper { flex: 0 0 100%; scroll-snap-align: center; height: 300px !important; position: relative; }
  #rec572999640 .t486__blockimg { height: 300px !important; }
  #rec572999640 .t486__separator { display: none; }

  .onas-carousel-dots { display:flex; justify-content:center; gap:8px; margin-top:10px; }
  .onas-carousel-dot { width:8px; height:8px; border-radius:50%; background:rgba(20,30,50,0.25); cursor:pointer; transition:background-color .2s ease; }
  .onas-carousel-dot.active { background:#16243d; }
}


/* ===== Round 2 UI/UX: stretch two-column blocks to fill widened 1400px container =====
   Switched from flex (grow ratios) to grid: the flex version left an unexplained ~80px dead
   strip on the left of the О нас/Тримминг image grid because the browser's flex-basis math
   didn't resolve to a clean split once the column's own 20px Tilda gutter margin was added on
   top of the flex gap - grid's explicit column tracks don't have that ambiguity. */
@media (min-width: 1201px) {
  #rec572999640 > .t486 > .t-container,
  #rec583152252 > .t486 > .t-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 60px;
  }
  #rec572999640 > .t486 > .t-container > .t-col,
  #rec583152252 > .t486 > .t-container > .t-col {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    flex: none;
    float: none !important;
  }
  /* Auto-placement kept wrapping the 2nd column onto a new implicit row for reasons that
     didn't reproduce under manual inspection - forcing explicit cell coordinates sidesteps
     whatever inherited Tilda grid/span rule was interfering, instead of chasing it further. */
  #rec572999640 > .t486 > .t-container > .t-col:first-child,
  #rec583152252 > .t486 > .t-container > .t-col:first-child {
    grid-column: 1;
    grid-row: 1;
  }
  #rec572999640 > .t486 > .t-container > .t-col:last-child,
  #rec583152252 > .t486 > .t-container > .t-col:last-child {
    grid-column: 2;
    grid-row: 1;
  }
  #rec572999640 .t486__imgcontainer,
  #rec583152252 .t486__imgcontainer {
    width: 100% !important;
  }

  /* "Про уход за собаками" sub-heading rendered at 32px vs 42px for every other main section
     title, making it look like a mismatched afterthought - bring it to the same scale. */
  #rec583160182 .t531__title {
    font-size: 42px !important;
  }

  /* Наши собаки slider: image+text columns were fixed 560px+560px inside a 1400px container -
     same grid fix as above so the row fills the full container width edge-to-edge. */
  #rec2680699101 .t-slds__item > .t-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 80px;
  }
  #rec2680699101 .t-slds__item > .t-container > .t-col:first-child {
    grid-column: 1;
    grid-row: 1;
  }
  #rec2680699101 .t-slds__item > .t-container > .t-col:last-child {
    grid-column: 2;
    grid-row: 1;
  }
  #rec2680699101 .t-slds__item > .t-container > .t-col {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    flex: none;
    float: none !important;
  }
  #rec2680699101 .t801__title { font-size: 32px !important; padding-bottom: 10px !important; }
  #rec2680699101 .t-text_md { font-size: 20px !important; padding-top: 6px !important; }

  /* Advantages block: reduce oversized vertical padding on desktop */
  #rec571258793 { padding-top: 80px !important; padding-bottom: 80px !important; }
}

/* ===== Unify block content width: О нас/Тримминг/Щенки/услуги/контакты each had a different
   left/right inset (leftover from old fixed-px 1200px-grid math), making the page look
   ragged when scrolling between sections. Force one consistent centered content width. ===== */
@media (min-width: 1201px) {
  #rec572999640 > .t486 > .t-container,
  #rec583152252 > .t486 > .t-container,
  #rec571258793 .t-container,
  #rec2661016601 .t-container,
  #rec2661017701 .t-container,
  #rec2661020501 .t-container,
  #rec583160182 .t-container,
  #rec2676384001 .t-container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    float: none !important;
  }
}


/* ===== Scroll-reveal: fade + slide-up as sections enter viewport ===== */
.t-rec[data-scroll-reveal] {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.t-rec[data-scroll-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .t-rec[data-scroll-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
}


/* ===== Footer: RKF + NKP VHVT organization badges flanking contacts (centered composition) ===== */
.footer-org-badge { display: block; text-decoration: none; flex: 0 0 auto; transition: transform 0.2s ease, opacity 0.2s ease; }
.footer-org-badge img { width: 100%; height: auto; display: block; }
.footer-org-badge:hover { transform: translateY(-4px); opacity: 0.85; }
@media (min-width: 961px) {
  #rec2676384001 .t-container { display: flex; align-items: center; justify-content: center; gap: 56px; }
  #rec2676384001 .t-container > .t-col { flex: 0 0 auto; width: auto; max-width: 640px; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
  .footer-org-badges-row { display: contents; }
  .footer-org-badge { width: 160px; }
  .footer-org-badge_left { order: -1; }
  .footer-org-badge_right { order: 1; width: 140px; }
}
@media (max-width: 960px) {
  .footer-org-badges-row { display: flex; justify-content: center; gap: 32px; margin-bottom: 28px; }
  .footer-org-badge { width: 96px; }
  .footer-org-badge_right { width: 84px; }
}

/* ===== Text redesign: site-wide heading font (Shantell Sans) + rust accent on highlighted phrases ===== */
@import url('https://fonts.googleapis.com/css2?family=Shantell+Sans:wght@700;800&display=swap');

[class*="__title"],
[class*="__uptitle"],
.t-name,
.t-title {
  font-family: 'Shantell Sans', sans-serif !important;
  font-weight: 700 !important;
}

.t-descr b, .t-descr strong,
.t-text b, .t-text strong,
[class*="__descr"] b, [class*="__descr"] strong {
  color: #b0583a !important;
  font-weight: 700 !important;
}

/* ===== Request modal: "Оставить заявку" button inside contacts modal + its own popup with CRM form ===== */
.request-modal-trigger {
  display: block;
  margin: 32px auto 0;
  padding: 16px 40px;
  background-color: #16243d;
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 17px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color .3s ease, transform .2s ease;
}
.request-modal-trigger:hover { background-color: #24395c; transform: translateY(-2px); }
.request-modal-box { max-width: 560px; }
.request-modal-form-slot { margin-top: 10px; text-align: left; }
#rec2901141901 { display: none; }
/* Form block's grid (t-container/t-col_8/t-prefix_2) assumes the ~1400px page container -
   inside the 560px popup that offset/width math left the fields indented and cut off ("съехавшая" layout). */
.request-modal-form-slot #rec2901141901 { padding-top: 0 !important; padding-bottom: 0 !important; }
.request-modal-form-slot #rec2901141901 .t-container { max-width: none !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; margin: 0 !important; }
.request-modal-form-slot #rec2901141901 .t-col_8.t-prefix_2 { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
.request-modal-form-slot #rec2901141901 .t-input-group_em { display: none !important; }
@media (max-width: 480px) {
  .request-modal-trigger { width: 100%; padding: 16px 20px; }
}