/* Theme repairs. Refined 2026-11-06: shared menu grid and uniform controls. */

.kladez-background-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.partners__wrapper { animation-play-state: paused; }
.partners.kladez-partners-visible .partners__wrapper { animation-play-state: running; }
@media (prefers-reduced-motion: reduce) {
  .partners__wrapper { animation: none !important; }
}

/* Preserve the original responsive rem scale while scrollbar-gutter changes
   how the browser resolves vw after a scroll lock. JS supplies innerWidth. */
html { font-size: calc(var(--kladez-viewport-width, 100vw) / 120); }
@media (min-width: 1920px) {
  html { font-size: 16px; }
}

/* Keep the page width stable when the menu removes the root scrollbar. */
@supports (scrollbar-gutter: stable) {
  html { scrollbar-gutter: stable; }
}
html.kladez-menu-open,
body.kladez-menu-open {
  overflow: hidden;
  overscroll-behavior: none;
}

/* The button's hit area never changes between hamburger and close states. */
.header .header-burger,
.header.fixed .header-burger {
  appearance: none;
  box-sizing: border-box;
  display: inline-flex;
  flex: 0 0 48px;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  position: relative;
  z-index: 3;
  cursor: pointer;
  touch-action: manipulation;
}
.header .header-burger__line,
.header .header-burger::before,
.header .header-burger::after {
  position: absolute;
  left: 50%;
  right: auto;
  bottom: auto;
  width: 36px;
  height: 2px;
  margin: 0;
  clip-path: none;
  transform-origin: center;
  transition: transform 180ms ease, opacity 180ms ease, background-color 180ms ease;
}
.header .header-burger__line { top: calc(50% - 8px); transform: translateX(-50%); }
.header .header-burger::before { top: 50%; transform: translateX(-50%); }
.header .header-burger::after { top: calc(50% + 8px); transform: translateX(-50%); }
.header.fixed .header-burger__line {
  top: 50%;
  width: 36px;
  transform: translateX(-50%) rotate(45deg);
}
.header.fixed .header-burger::after {
  top: 50%;
  width: 36px;
  transform: translateX(-50%) rotate(-45deg);
}
.header.fixed .header-burger::before { display: block; opacity: 0; }
.header .header-burger:focus-visible {
  outline: 2px solid #245fa9;
  outline-offset: 3px;
}
.header .header__logo,
.header .header-burger {
  transition: none;
}

/* The open header remains in the viewport. Hiding the desktop navigation with
   visibility preserves the row geometry, unlike display:none. */
.header.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: auto;
  width: var(--kladez-locked-width, 100%);
}
.header.fixed > .container { position: relative; z-index: 2; }
.header.fixed .header-menu { visibility: hidden; pointer-events: none; }
.header.fixed .header__logo { z-index: 3; }
.header-menu > ul > li { padding-block: 0; }
.header-menu > ul > li > a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: clamp(13px, 0.833333vw, 16px);
}
.header-menu ul li:focus-within > ul { display: flex; }
.header-menu ul li > ul {
  top: 100%;
  width: clamp(240px, 19.75vw, 360px);
  max-width: calc(100vw - 32px);
  gap: 4px;
  padding-block: 12px;
}
.header-menu ul li > ul li,
.header-menu ul li > ul li:first-child,
.header-menu ul li > ul li:last-child { padding: 0 16px; }
.header-menu ul li > ul li a {
  display: flex;
  align-items: center;
  min-height: 44px;
  white-space: normal;
  font-size: clamp(14px, 0.833333vw, 16px);
  line-height: 1.35;
  color: #26332c !important;
}
.header-menu ul li > ul li a:hover,
.header-menu ul li > ul li a:focus-visible { color: #245fa9 !important; }
.header-content {
  z-index: 1;
  inset: 0;
  width: auto;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  padding: var(--kladez-menu-padding-top, 120px) clamp(20px, 4vw, 64px) max(24px, env(safe-area-inset-bottom));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: auto;
  background: #fff;
}
.header-content__bg {
  pointer-events: none;
  background: url("main-bg.webp") center / cover no-repeat;
}
.header-content__block,
.header-content__footer { max-width: 1280px; width: 100%; }
.header-content__block,
.header-content-menu,
.header-content-menu-ul,
.header-content-menu-li,
.header-content-menu-ul-two { min-width: 0; }
.header-content-menu-ul { position: relative; gap: clamp(12px, 1.8vw, 32px); }
.header-content-menu-li-a {
  display: inline-flex;
  align-items: center;
  max-width: 36%;
  min-height: 44px;
  padding-block: 6px;
  font-size: clamp(28px, 3.125vw, 54px);
  line-height: 1.2;
  color: #14211b;
}
.header-content-menu-ul-two {
  width: 60%;
  max-width: 760px;
  gap: clamp(8px, 1.8vw, 24px);
}
.header-content-menu-ul-two-li-a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding-block: 6px;
  font-size: clamp(16px, 1.5vw, 26px);
  line-height: 1.35;
  color: #26332c;
  overflow-wrap: anywhere;
  transition: color 180ms ease;
}
.header-content-menu-li-a:focus-visible,
.header-content-menu-ul-two-li-a:focus-visible,
.header-content__link:focus-visible {
  outline: 2px solid #245fa9;
  outline-offset: 3px;
}
.header-content-menu-ul-two-li-a:hover,
.header-content-menu-ul-two-li-a:focus-visible { color: #245fa9; }
.header-content__footer {
  flex-wrap: wrap;
  margin-top: 32px;
  gap: clamp(16px, 4vw, 64px);
}
.header-content__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: clamp(18px, 2vw, 32px);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

/* These were faded to .2 by two adjacency selectors in the base stylesheet. */
.main-services .main-services-slide { opacity: 1 !important; }
.main-services .main-services-card-info__link { min-height: 44px; }
.main-services .main-services-card:focus-within { outline: 2px solid #245fa9; outline-offset: -2px; }

/* Service CTA text must keep its inner padding when it wraps onto two lines. */
.service-motivation__button {
  height: auto;
  min-height: 56px;
  max-width: 100%;
  padding: 14px 20px;
  text-align: center;
  white-space: normal;
  line-height: 1.35;
  overflow-wrap: normal;
}

/* Text controls retain usable touch targets and avoid small-font iOS zoom. */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
  font-size: 16px;
  min-height: 44px;
}
.wpcf7-form textarea { min-height: 112px; }
.wpcf7-form input[type="text"]::placeholder,
.wpcf7-form input[type="tel"]::placeholder,
.wpcf7-form input[type="email"]::placeholder,
.wpcf7-form textarea::placeholder { font-size: 16px; }

/* Popup Maker's scrollable/overlay-disabled mode otherwise keeps the page
   scrolling behind this theme's separate fixed, scrollable form container. */
html.pum-open.pum-open-overlay-disabled,
html.pum-open.pum-open-overlay-disabled.pum-open-scrollable,
html.pum-open.pum-open-overlay-disabled body,
html.pum-open.pum-open-overlay-disabled.pum-open-scrollable body {
  overflow: hidden !important;
  overscroll-behavior: none;
}

/* Auto margins centre a fitting form, then resolve to zero when its content is
   taller than the viewport so the first fields and close control stay reachable. */
.popup {
  height: 100vh;
  height: 100dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 16px 12px;
  align-items: flex-start;
}
.popup-block {
  margin: auto;
  flex-shrink: 0;
  max-width: 100%;
}
.popup .wpcf7-submit { min-height: 44px; }

/* A flex-centred anonymous text item must not set an oversized min-content
   width for long Russian object names. Keep the text itself unchanged. */
.object-main__header { min-width: 0; }
.object-main__title {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

/* The announcement is already before <footer> in the actual document. */
.in-development {
  position: static;
  inset: auto;
  z-index: auto;
  width: 100%;
}
.in-development-block {
  padding: 14px 20px;
  font-size: 16px;
  line-height: 1.45;
}
.in-development-block p { margin: 0; }

/* Standard WordPress pages and the fallback template need the same header gap. */
.standard-page {
  padding: clamp(100px, 12vw, 180px) 0 80px;
  min-height: 65vh;
}
.standard-page > .container { padding-inline: 20px; }
.standard-page .title {
  max-width: 24ch;
  font-size: clamp(28px, 4.5vw, 64px);
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.standard-page__body {
  max-width: 78ch;
  margin-top: 24px;
  font-size: 16px;
  line-height: 1.6;
}
.standard-page__body h2 {
  font-size: clamp(20px, 2.5vw, 28px);
  line-height: 1.3;
}
.popup-close.popmake-close {
  position: sticky;
  float: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  top: 0;
  right: auto;
  margin: -4px -4px -40px auto;
  z-index: 120;
  background: #fff;
}
.popup-close.popmake-close .icon { width: 20px; height: 20px; }
.popup-close.popmake-close:focus-visible { outline: 2px solid #245fa9; outline-offset: 2px; }
.popup-header__title { padding-right: 52px; }

@media (max-width: 991.98px) {
  html { font-size: calc(var(--kladez-viewport-width, 100vw) / 48); }
  .header-content { padding-inline: max(20px, env(safe-area-inset-left)); }
  .header-content-menu-ul { gap: 12px; }
  .header-content-menu-li-a { max-width: 100%; font-size: clamp(24px, 4vw, 32px); }
  .header-content-menu-ul-two {
    position: static;
    width: 100%;
    max-width: none;
    padding: 10px 0 0 16px;
    gap: 4px;
  }
  .header-content-menu-ul-two-li-a { font-size: 16px; min-height: 44px; }
  .header-content__footer { margin-top: 24px; gap: 6px; }
  .header-content__link { margin-top: 0; font-size: clamp(18px, 3.5vw, 24px); }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  .main.main-service .title-page-one {
    font-size: 4.875rem;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 575.98px) {
  html { font-size: calc(var(--kladez-viewport-width, 100vw) / 24.375); }
  .header-content { padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  .header-content-menu-ul { gap: 8px; }
  .header-content-menu-li-a { font-size: 26px; }
  .main-services .main-services-card-info__link { min-height: 44px; }
  .service-motivation__button { width: 100%; }
  .object-main__title { font-size: clamp(28px, 8vw, 40px); }
  .main.main-service .title-page-one {
    font-size: clamp(28px, 9.5vw, 44px);
    line-height: 1.1;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .header-burger,
  .header-burger::before,
  .header-burger::after,
  .header-burger__line,
  .main-services-card__background { transition-duration: 0.01ms !important; }
}

/* Every stroke inherits the same state colour, including the middle pseudo
   element that the original header-dark rules omitted. */
.header { --kladez-burger-color: #14211b; }
.header.header-dark { --kladez-burger-color: #fff; }
.header.fixed { --kladez-burger-color: #14211b; }
.header .header-burger { color: var(--kladez-burger-color); }
.header .header-burger__line,
.header .header-burger::before,
.header .header-burger::after { background: currentColor !important; }
.header-menu a { transition: color 180ms ease, background-color 180ms ease; }

/* Header, navigation columns and contacts share one centred container.
   The submenu participates in the grid: no absolute positioning or measured
   min-height is needed to keep the contacts below all seven services. */
@media (min-width: 992px) {
  .header.fixed .header-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-inline: 24px;
    padding-bottom: max(32px, env(safe-area-inset-bottom));
  }
  .header-content__block,
  .header-content__footer {
    flex: 0 0 auto;
    width: 100%;
    max-width: var(--container-desktop);
    margin-inline: auto;
  }
  .header-content__inner {
    display: grid;
    grid-template-columns: max-content minmax(0, max-content);
    column-gap: clamp(64px, 6vw, 128px);
    row-gap: clamp(12px, 1.67vw, 24px);
    align-items: start;
    width: fit-content;
    max-width: 100%;
    margin: auto;
    flex: 0 0 auto;
  }
  .header-content__block,
  .header-content-menu,
  .header-content-menu-ul,
  .header-content-menu-li,
  .header-content__footer { display: contents; }
  .header-content-menu-li-a {
    grid-column: 1;
    align-self: start;
    width: 100%;
    max-width: 100%;
    letter-spacing: .01em;
  }
  .header-content-menu-li:nth-child(1) > a { grid-row: 1; }
  .header-content-menu-li:nth-child(2) > a { grid-row: 2; }
  .header-content-menu-li:nth-child(3) > a { grid-row: 3; }
  .header-content-menu-li:nth-child(4) > a { grid-row: 4; }
  .header-content-menu-ul-two {
    position: static;
    grid-column: 2;
    grid-row: 1 / span 4;
    width: max-content;
    max-width: 100%;
    align-self: start;
  }
  .header-content-menu-ul-two-li-a {
    letter-spacing: .01em;
    overflow-wrap: normal;
  }
  .header-content__link {
    grid-row: 5;
    width: fit-content;
    max-width: 100%;
    margin-top: clamp(16px, 1.4vw, 24px);
    overflow-wrap: normal;
  }
  .header-content__link:nth-child(1) { grid-column: 1; }
  .header-content__link:nth-child(2) { grid-column: 2; }
}
@media (max-width: 991.98px) {
  .header > .container,
  .header-content { padding-inline: max(16px, 1rem); }
}

/* Balance headings without stretching letter spacing or forcing manual line
   breaks. Paragraphs keep the site's original size and centred composition. */
main h1, main h2, .header-content-menu-li-a { text-wrap: balance; }
.about-company__text, .service-motivation__text { text-wrap: pretty; }
.about-company__title { max-width: 100%; }

/* Preserve the final desktop video composition after removing its max-width
   scroll tween. The white title and play control need the full image behind
   them, rather than the old narrow animation starting frame. */
@media (min-width: 992px) {
  .video-block__background { width: 100%; max-width: 100%; }
}
/* Optional desktop-only replacement for the display:contents menu rules.
   Append after current repairs CSS for root's browser/AX review. This candidate
   keeps boxes on the navigation, both lists and every list item. No JS geometry.
   Existing mobile rules are untouched. */
@media (min-width: 992px) {
  /* A readable one-column fallback for engines without CSS subgrid. */
  .header-content__inner {
    display: block;
    flex: 0 0 auto;
    width: max-content;
    max-width: 100%;
    margin: auto;
  }
  .header-content__block,
  .header-content-menu,
  .header-content-menu-ul,
  .header-content-menu-ul > .header-content-menu-li {
    display: block;
    width: auto;
    max-width: none;
    min-width: 0;
    margin: 0;
  }
  .header-content-menu-ul > .header-content-menu-li + .header-content-menu-li {
    margin-top: 16px;
  }
  .header-content-menu-ul-two {
    position: static;
    display: flex;
    flex-direction: column;
    width: max-content;
    max-width: 100%;
    margin: 12px 0 0 16px;
  }
  .header-content__footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
    max-width: none;
    margin: 32px 0 0;
    gap: 12px;
  }
  .header-content__footer > .header-content__link {
    margin: 0;
    max-width: 100%;
  }

  @supports (grid-template-columns: subgrid) {
    .header-content__inner {
      display: grid;
      grid-template-columns: max-content minmax(0, max-content);
      column-gap: clamp(64px, 6vw, 128px);
      row-gap: clamp(32px, 3.1vw, 48px);
      align-items: start;
      width: max-content;
      max-width: 100%;
    }
    .header-content__block,
    .header-content-menu,
    .header-content-menu-ul {
      display: grid;
      grid-column: 1 / -1;
      grid-template-columns: subgrid;
      column-gap: normal;
      min-width: 0;
      width: auto;
      max-width: none;
    }
    .header-content__block { grid-row: 1; }
    .header-content-menu-ul {
      grid-template-rows: repeat(4, auto);
      row-gap: clamp(12px, 1.67vw, 24px);
      align-items: start;
      padding: 0;
    }
    .header-content-menu-ul > .header-content-menu-li {
      display: block;
      grid-column: 1;
      align-self: start;
      min-width: 0;
      margin: 0;
    }
    .header-content-menu-ul > .header-content-menu-li:first-child {
      display: grid;
      grid-column: 1 / -1;
      grid-row: 1 / span 4;
      grid-template-columns: subgrid;
      grid-template-rows: subgrid;
      column-gap: normal;
      row-gap: normal;
    }
    .header-content-menu-ul > .header-content-menu-li + .header-content-menu-li { margin-top: 0; }
    .header-content-menu-ul > .header-content-menu-li:nth-child(2) { grid-row: 2; }
    .header-content-menu-ul > .header-content-menu-li:nth-child(3) { grid-row: 3; }
    .header-content-menu-ul > .header-content-menu-li:nth-child(4) { grid-row: 4; }
    .header-content-menu-ul > .header-content-menu-li:first-child > .header-content-menu-li-a {
      grid-column: 1;
      grid-row: 1;
      align-self: start;
    }
    .header-content-menu-ul > .header-content-menu-li:first-child > .header-content-menu-ul-two {
      grid-column: 2;
      grid-row: 1 / span 4;
      align-self: start;
      margin: 0;
      padding: 0;
    }
    .header-content__footer {
      display: grid;
      grid-column: 1 / -1;
      grid-row: 2;
      grid-template-columns: subgrid;
      column-gap: normal;
      row-gap: 0;
      align-items: start;
      width: auto;
      max-width: none;
      margin: 0;
    }
    .header-content__footer > .header-content__link {
      grid-row: 1;
      margin: 0;
    }
    .header-content__footer > .header-content__link:nth-child(1) { grid-column: 1; }
    .header-content__footer > .header-content__link:nth-child(2) { grid-column: 2; }
  }
}


/* The current service remains selected while the carousel is swiped.
   Swiper active-slide styling on the home page stays independent. */
@media (max-width: 575.98px) {
  .main.main-service .main-services-slide.swiper-slide-active { box-shadow: none; }
  .main.main-service .main-services-slide.swiper-slide-active .main-services-card:not(.active) .main-services-card__background { opacity: 0; }
}

/* Keep hovered/current text readable while its original photo is loading. */
.main-services-card__background { background-color: #14211b; }