/* ==========================================================================
   КонсалтСтрой Бел — шапка («Проход 13», 14.09.2026).
   Одна парящая стеклянная планка: логотип · меню · поиск · телефон · кнопка.
   Разметка: theme-parts/header/header-style-2.php. Поведение: ks-header.js.
   Язык — тот же, что у ks-ui.css: графит, золото, IBM Plex, мерная засечка.
   ========================================================================== */

:root{
  --kh-top:        16px;                 /* отступ планки от верха окна */
  --kh-side:       3vw;                  /* и от боков */
  --kh-h:          88px;                 /* увеличенная панель — логотип читается лучше */
  --kh-radius:     22px;
  --kh-ctrl:       12px;
  --kh-ease:       cubic-bezier(.16,1,.3,1);
  --kh-glass:      rgba(255,255,255,.66);
  --kh-glass-hi:   rgba(255,255,255,.88);
  --kh-line:       rgba(255,255,255,.75);
  --kh-shadow:     0 14px 38px rgba(20,22,26,.09);
  --kh-gold-soft:  rgba(219,180,114,.16);
}

/* место под планку в потоке — сама планка fixed */
.ks-header-spacer{ height:calc(var(--kh-top) * 2 + var(--kh-h)); }

.ks-header{
  position:fixed;
  top:var(--kh-top); left:var(--kh-side); right:var(--kh-side);
  z-index:1000;
}
body.admin-bar .ks-header{ top:calc(var(--kh-top) + 32px); }

/* стекло — на самой планке; внутри нет fixed-потомков (панели absolute) */
.ks-header__bar{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:20px;
  min-height:var(--kh-h);
  padding:10px 13px 10px 23px;
  /* лёгкий градиент: слева почти белое стекло, справа тёплый золотистый тон (владелец 14.09) */
  background:
    linear-gradient(105deg, rgba(255,255,255,.62) 0%, rgba(255,255,255,.28) 42%, rgba(233,210,163,.30) 78%, rgba(219,180,114,.42) 100%),
    var(--kh-glass);
  border:1px solid var(--kh-line);
  border-radius:var(--kh-radius);
  -webkit-backdrop-filter:blur(26px) saturate(150%);
          backdrop-filter:blur(26px) saturate(150%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 0 rgba(255,255,255,.28),
    var(--kh-shadow);
  transition:background .3s ease, box-shadow .3s ease;
}
.ks-header__bar::after{
  content:""; position:absolute; left:14%; right:6%; bottom:-1px; height:1px; pointer-events:none;
  background:linear-gradient(90deg, rgba(219,180,114,0), rgba(219,180,114,.75) 60%, rgba(219,180,114,0));
}
.ks-header.is-scrolled .ks-header__bar{
  background:
    linear-gradient(105deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.4) 42%, rgba(233,210,163,.34) 78%, rgba(219,180,114,.46) 100%),
    var(--kh-glass-hi);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 1px 0 rgba(20,22,26,.06),
    0 18px 44px rgba(20,22,26,.13);
}
@media (prefers-reduced-transparency:reduce){
  .ks-header__bar{ background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }
}

/* ---------- логотип: тема оборачивает в h1/div.site-title ------------------- */
.ks-header__brand .site-title{ margin:0 !important; padding:0 !important; height:auto !important; line-height:0 !important; font-size:0; }  /* тема: height/line-height 110px */
.ks-header__brand .site-title a{
  display:inline-flex; align-items:center;
  transition:opacity .22s ease, transform .22s var(--kh-ease);
}
.ks-header__brand .site-title a:hover,
.ks-header__brand .site-title a:focus-visible{ opacity:.84; transform:translateY(-1px); }
.ks-header__brand .site-title-text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.ks-header__brand img{
  display:block; width:auto; height:52px !important; max-height:none !important;
  max-width:none !important;   /* старый style.css: .thsn-main-logo{max-width:200px/130px} — сжимал новый логотип 5,3:1 по ширине */
}
.ks-header__brand .thsn-sticky-logo, .ks-header__brand .thsn-responsive-logo{ display:none; }

/* ---------- меню -------------------------------------------------------- */
.ks-nav{ justify-self:center; min-width:0; }
.ks-nav__list{ display:flex; align-items:center; gap:5px; margin:0; padding:0; list-style:none; }
.ks-nav__item{ margin:0; padding:0; list-style:none; }
.ks-nav__link{
  position:relative;
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 15px;
  border:0; background:transparent; cursor:pointer;
  font-family:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  font-size:16px; font-weight:500; line-height:1.2;
  color:var(--ks-text, #22252B) !important;
  text-transform:none; letter-spacing:0;   /* тема: button uppercase */
  white-space:nowrap;
  border-radius:var(--kh-ctrl);
  transition:color .18s ease, background-color .18s ease, transform .18s var(--kh-ease);
}
.ks-nav__link:hover, .ks-nav__link:focus-visible,
.ks-nav__item--mega.is-open > .ks-nav__link{
  color:var(--ks-gold-ink-2, #846026) !important;
  background:var(--kh-gold-soft);
  transform:translateY(-1px);
}
/* текущий раздел: графит + золотая засечка */
.ks-nav__link.is-current, .ks-nav__link.is-ancestor,
.ks-nav__item--mega.is-active > .ks-nav__link{ color:var(--ks-ink, #14161A) !important; font-weight:600; }
.ks-nav__link.is-current::after, .ks-nav__link.is-ancestor::after,
.ks-nav__item--mega.is-active > .ks-nav__link::after{
  content:""; position:absolute; left:13px; right:13px; bottom:5px; height:2px;
  border-radius:2px; background:var(--ks-gold, #DBB472);
}
.ks-nav__chevron{ transition:transform .22s var(--kh-ease); flex:0 0 auto; }
.ks-nav__item--mega.is-open > .ks-nav__link .ks-nav__chevron{ transform:rotate(180deg); }

/* ---------- выпадающая панель «Услуги» (настольная) ----------------------- */
.ks-mega{
  position:absolute; left:0; right:0; top:calc(100% + 10px);
  padding:22px 22px 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.62), rgba(255,255,255,.18)),
    rgba(250,250,251,.90);
  border:1px solid rgba(255,255,255,.85);
  border-radius:var(--kh-radius);
  -webkit-backdrop-filter:blur(26px) saturate(145%);
          backdrop-filter:blur(26px) saturate(145%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92), 0 24px 60px rgba(20,22,26,.16);
  visibility:hidden; opacity:0; transform:translateY(-6px);
  transition:opacity .22s var(--kh-ease), transform .26s var(--kh-ease), visibility 0s linear .26s;
}
.ks-nav__item--mega.is-open > .ks-mega{
  visibility:visible; opacity:1; transform:translateY(0);
  transition:opacity .22s var(--kh-ease), transform .26s var(--kh-ease), visibility 0s;
}
.ks-mega__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(170px,1fr));
  gap:0 26px;
}
.ks-mega__col{ min-width:0; padding:0 0 0 18px; border-left:1px solid rgba(20,22,26,.09); }
.ks-mega__col:first-child{ padding-left:0; border-left:0; }
.ks-mega__title{
  display:block; margin:0 0 10px;
  font-family:"IBM Plex Sans",sans-serif; font-size:15px; font-weight:600; line-height:1.3;
  color:var(--ks-ink, #14161A) !important;
  padding-bottom:10px; border-bottom:1px solid rgba(20,22,26,.09);
  transition:color .18s ease;
}
.ks-mega__title:hover{ color:var(--ks-gold-ink-2, #846026) !important; }
.ks-mega__title.is-current, .ks-mega__title.is-ancestor{ color:var(--ks-gold-ink-2, #846026) !important; }
.ks-mega__list, .ks-mega__sublist{ margin:0; padding:0; list-style:none; }
.ks-mega__list > li{ margin:0; padding:0; list-style:none; }
.ks-mega__sublist{ margin:2px 0 4px 14px; border-left:1px solid rgba(20,22,26,.10); padding-left:8px; }
.ks-mega__link{
  display:block; padding:7px 10px; margin:0 0 0 -10px;
  border-radius:8px;
  font-family:"IBM Plex Sans",sans-serif; font-size:14px; line-height:1.35; font-weight:400;
  color:var(--ks-text, #22252B) !important;
  transition:color .16s ease, background-color .16s ease, padding-left .2s var(--kh-ease);
}
.ks-mega__link:hover, .ks-mega__link:focus-visible{
  color:var(--ks-gold-ink-2, #846026) !important; background:var(--kh-gold-soft); padding-left:14px;
}
.ks-mega__link.is-current{ color:var(--ks-ink, #14161A) !important; font-weight:600; background:rgba(219,180,114,.22); }
.ks-mega__link--sub{ font-size:13.5px; }

/* почта и соцсети — в панели только на телефоне; на настольной эти ссылки есть в подвале */
.ks-nav__foot{ display:none; }

/* ---------- инструменты справа ------------------------------------------- */
.ks-header__tools{ display:flex; align-items:center; gap:6px; justify-self:end; }
.ks-tool a, .ks-header__phone{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:54px; padding:0 15px;
  border-radius:var(--kh-ctrl);
  color:var(--ks-ink, #14161A) !important;
  transition:color .18s ease, background-color .18s ease, transform .18s var(--kh-ease);
}
.ks-tool a{ width:54px; height:54px !important; line-height:54px !important; padding:0 !important; border:0 !important; font-size:0; }  /* тема даёт 68px и рамку */
/* тема на ≥1200px даёт кнопке поиска display:block правилом из трёх классов — оно перебивало
   наш inline-flex, и лупа уезжала в левый нижний угол кнопки. Бьём той же специфичностью. */
.ks-header .ks-tool.thsn-header-search-btn a{ display:inline-flex; }
.ks-tool a:hover, .ks-header__phone:hover{ color:var(--ks-gold-ink-2, #846026) !important; background:var(--kh-gold-soft); transform:translateY(-1px); }
.ks-header__phone-text{
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace; font-size:15px; font-weight:600; letter-spacing:.01em; white-space:nowrap;
}
.ks-header__phone svg{ flex:0 0 auto; }

/* кнопка: золотой градиент, стрелка уезжает при наведении */
.ks-btn{
  display:inline-flex; align-items:center; justify-content:space-between; gap:14px;
  min-height:58px; padding:0 20px 0 22px; margin-left:8px;
  border:0; border-radius:var(--kh-ctrl); cursor:pointer;
  font-family:"IBM Plex Sans",sans-serif; font-size:14.5px; font-weight:650; letter-spacing:.01em; white-space:nowrap;
  color:var(--ks-ink, #14161A) !important;
  background:linear-gradient(120deg, #E9D2A3 0%, #DBB472 55%, #CFA65E 100%);
  background-size:180% 100%; background-position:0 50%;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 8px 20px rgba(156,116,52,.22);
  transition:background-position .32s var(--kh-ease), box-shadow .22s ease, transform .22s var(--kh-ease);
}
.ks-btn:hover, .ks-btn:focus-visible{
  background-position:100% 50%;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 14px 30px rgba(156,116,52,.30);
  transform:translateY(-2px);
}
.ks-btn:active{ transform:translateY(0) scale(.985); box-shadow:inset 0 1px 0 rgba(255,255,255,.4); }
.ks-btn__arrow{ font-size:15px; line-height:1; transition:transform .22s var(--kh-ease); }
.ks-btn:hover .ks-btn__arrow{ transform:translate(3px,-3px); }

/* «бургер» — только на узких экранах */
.ks-burger{ display:none; }

/* ---------- фокус, движение ------------------------------------------------ */
.ks-header :focus-visible{ outline:2px solid var(--ks-gold, #DBB472); outline-offset:3px; }
@media (prefers-reduced-motion:reduce){
  .ks-header *, .ks-header *::before, .ks-header *::after{ transition:none !important; animation:none !important; }
}

/* ---------- то, что тема делала под свою трёхполосную шапку ---------------- */
.thsn-header-style-2 .thsn-title-bar-wrapper,
.thsn-header-style-2 .thsn-slider-area{ margin-top:0 !important; }
.home .site-content{ margin-top:0 !important; }
#page.site{ overflow:clip; }       /* вместо overflow:hidden: не мешает fixed/sticky */

/* ---------- узкие экраны: 1024–1279 — компактнее ---------------------------- */
@media (max-width:1399px){
  .ks-header__bar{ gap:10px; padding-left:14px; }
  .ks-nav__list{ gap:2px; }
  .ks-nav__link{ padding:10px 10px; font-size:14px; }
  .ks-header__phone-text{ display:none; }        /* телефон — иконкой */
  .ks-header__phone{ width:44px; padding:0; }
  .ks-btn{ padding:0 14px; }
}

/* ---------- телефон и планшет: панель под планкой -------------------------- */
@media (max-width:1023px){
  :root{ --kh-h:72px; --kh-top:10px; --kh-side:12px; }
  .ks-header__bar{ grid-template-columns:auto 1fr; padding:7px 7px 7px 15px; gap:8px; }
  .ks-header__brand img{ height:44px !important; }
  .ks-header__tools{ gap:4px; }
  .ks-header__cta{ display:none; }
  .ks-tool a, .ks-header__phone{ width:48px; height:48px !important; min-height:48px; }

  .ks-burger{
    display:inline-flex; align-items:center; gap:10px;
    min-height:48px; padding:0 13px 0 15px; margin-left:2px;
    color:var(--ks-ink, #14161A); cursor:pointer;
    background:rgba(255,255,255,.35);
    border:1px solid rgba(255,255,255,.7); border-radius:var(--kh-ctrl);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
    font-family:"IBM Plex Sans",sans-serif; font-size:13.5px; font-weight:600;
    transition:color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s var(--kh-ease);
  }
  .ks-burger:hover, .ks-burger[aria-expanded="true"]{ color:var(--ks-gold-ink-2, #846026); background:rgba(255,255,255,.6); border-color:rgba(219,180,114,.5); }
  .ks-burger:active{ transform:scale(.98); }
  .ks-burger__icon{ position:relative; display:block; width:18px; height:12px; }
  .ks-burger__icon i{
    position:absolute; right:0; display:block; width:18px; height:1.6px; border-radius:2px;
    background:currentColor; transition:transform .22s var(--kh-ease), top .22s var(--kh-ease);
  }
  .ks-burger__icon i:first-child{ top:2px; }
  .ks-burger__icon i:last-child{ top:9px; }
  .ks-burger[aria-expanded="true"] .ks-burger__icon i:first-child{ top:5px; transform:rotate(45deg); }
  .ks-burger[aria-expanded="true"] .ks-burger__icon i:last-child{ top:5px; transform:rotate(-45deg); }

  /* панель */
  .ks-nav{
    position:absolute; left:0; right:0; top:calc(100% + 8px);
    max-height:calc(100dvh - var(--kh-h) - var(--kh-top) * 2 - 20px);
    overflow:auto; overscroll-behavior:contain;
    padding:10px;
    background:
      linear-gradient(135deg, rgba(255,255,255,.6), rgba(255,255,255,.16)),
      rgba(250,250,251,.92);
    border:1px solid rgba(255,255,255,.85);
    border-radius:var(--kh-radius);
    -webkit-backdrop-filter:blur(26px) saturate(145%);
            backdrop-filter:blur(26px) saturate(145%);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.92), 0 22px 54px rgba(20,22,26,.18);
    visibility:hidden; opacity:0; transform:translateY(-6px);
    transition:opacity .22s var(--kh-ease), transform .26s var(--kh-ease), visibility 0s linear .26s;
  }
  .ks-nav.is-open{ visibility:visible; opacity:1; transform:translateY(0); transition:opacity .22s var(--kh-ease), transform .26s var(--kh-ease), visibility 0s; }
  .ks-nav__list{ display:grid; gap:2px; }
  .ks-nav__link{
    display:flex; width:100%; justify-content:space-between; min-height:46px; padding:0 12px;
    font-size:15px; white-space:normal; text-align:left; transform:none !important;
  }
  .ks-nav__link.is-current::after, .ks-nav__link.is-ancestor::after,
  .ks-nav__item--mega.is-active > .ks-nav__link::after{ left:12px; right:auto; width:22px; bottom:6px; }

  /* «Услуги» — аккордеон внутри панели */
  .ks-nav__item--mega{ position:static; }
  .ks-mega{
    position:static; visibility:visible; opacity:1; transform:none;
    display:none; padding:4px 0 8px 12px; margin:0;
    background:none; border:0; border-radius:0; box-shadow:none;
    -webkit-backdrop-filter:none; backdrop-filter:none; transition:none;
  }
  .ks-nav__item--mega.is-open > .ks-mega{ display:block; }
  .ks-mega__grid{ display:grid; grid-template-columns:1fr; gap:6px 0; }
  .ks-mega__col{ padding:0; border:0; }
  .ks-mega__title{ padding:8px 12px; margin:0; border:0; border-radius:8px; font-size:14.5px; }
  .ks-mega__link{ margin:0; padding:7px 12px; }
  .ks-mega__link:hover{ padding-left:12px; }
  .ks-mega__sublist{ margin-left:22px; }

  .ks-nav__foot{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    margin:8px 2px 0; padding:12px 10px 4px; border-top:1px solid rgba(20,22,26,.09);
  }
  .ks-nav__foot-link{ font-family:"IBM Plex Mono",monospace; font-size:13px; color:var(--ks-text, #22252B) !important; }
  .ks-nav__social{ display:flex; align-items:center; gap:2px; }
  .ks-nav__social a{ display:inline-flex; width:40px; height:40px; align-items:center; justify-content:center; border-radius:8px; color:var(--ks-ink, #14161A) !important; }
  .ks-nav__social a:hover{ background:var(--kh-gold-soft); color:var(--ks-gold-ink-2, #846026) !important; }
  .ks-nav__social .thsn-social-links{ margin:0; padding:0; list-style:none; display:flex; }
  .ks-nav__social .thsn-social-links li{ margin:0; padding:0; list-style:none; }
  .ks-nav__social .thsn-social-links a{ background:none; border:0; width:40px; height:40px; line-height:40px; font-size:16px; }
}

/* На узком телефоне крупный знак важнее поиска: оставляем быстрый звонок и меню. */
@media (max-width:479px){
  .ks-header__tools > .ks-tool{ display:none; }
}
@media (max-width:359px){
  :root{ --kh-side:8px; }
  .ks-header__bar{ padding:6px 5px 6px 10px; gap:6px; }
  .ks-header__brand img{ height:36px !important; }
  .ks-header__tools{ gap:2px; }
  .ks-header__phone,.ks-burger{ width:44px; height:44px !important; min-height:44px; }
  .ks-burger{ padding:0 10px; }
}
@media (max-width:479px){
  .ks-burger__label{ display:none; }
  .ks-burger{ padding:0 12px; }
}

/* ---------- лупа: тема заливает :hover коричневым — снимаем --------------- */
.ks-header .thsn-header-search-btn a:hover,
.ks-header .thsn-header-search-btn a:focus-visible{
  background:var(--kh-gold-soft) !important;
  color:var(--ks-gold-ink-2, #846026) !important;
}

/* ==========================================================================
   Всплывающее окно «Заказать звонок» / «Оставить заявку» («Проход 14»)
   Разметка — в footer.php (<dialog>), открытие — ks-header.js.
   ========================================================================== */
.ks-modal{
  padding:0; border:0; background:transparent; max-width:none; max-height:none;
  width:min(980px, calc(100vw - 32px));
  margin:auto;
  overflow:visible;
}
.ks-modal::backdrop{ background:rgba(10,12,16,.58); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.ks-modal[open]{ animation:ks-modal-in .28s var(--kh-ease) both; }
.ks-modal[open]::backdrop{ animation:ks-fade-in .28s ease both; }
@keyframes ks-modal-in{ from{ opacity:0; transform:translateY(10px) scale(.975); } to{ opacity:1; transform:none; } }
@keyframes ks-fade-in{ from{ opacity:0; } to{ opacity:1; } }

.ks-modal__box{
  position:relative;
  display:grid; grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr);
  max-height:calc(100dvh - 32px); overflow:auto;
  background:#fff;
  border:1px solid rgba(255,255,255,.8);
  border-radius:22px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 36px 120px rgba(4,8,14,.4);
}
.ks-modal__close{
  position:absolute; z-index:2; top:16px; right:16px;
  display:grid; place-items:center; width:38px; height:38px; padding:0;
  border:1px solid rgba(255,255,255,.35); border-radius:50%;
  background:rgba(255,255,255,.18); color:#fff; cursor:pointer;
  font-size:24px; line-height:1;
  transition:background .18s ease, transform .18s var(--kh-ease), color .18s ease;
}
.ks-modal__close:hover{ background:#fff; color:var(--ks-ink, #14161A); transform:rotate(6deg); }
@media (max-width:767px){ .ks-modal__close{ background:rgba(20,22,26,.06); color:var(--ks-ink, #14161A); border-color:rgba(20,22,26,.12); } }

/* левая панель — графит с чертёжной сеткой и золотым бликом (как карточка заявки) */
.ks-modal__intro{
  display:flex; flex-direction:column; justify-content:space-between; gap:36px;
  padding:clamp(30px,4vw,52px);
  color:#fff;
  background-color:var(--ks-ink, #14161A);
  background-image:
    radial-gradient(70% 90% at 0% 0%, rgba(219,180,114,.24), transparent 60%),
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:auto, 64px 64px, 64px 64px;
}
.ks-modal__kicker{
  display:block; margin-bottom:18px;
  font-family:"IBM Plex Mono",monospace; font-size:12.5px; font-weight:600; letter-spacing:.115em; text-transform:uppercase;
  color:var(--ks-gold, #DBB472);
}
.ks-modal__title{
  margin:0 0 14px !important;
  font-family:"IBM Plex Sans",sans-serif; font-size:clamp(26px,3vw,38px); font-weight:600; line-height:1.08; letter-spacing:-.018em;
  color:#fff !important;
}
.ks-modal__text{ margin:0 !important; font-size:15px; line-height:1.6; color:rgba(255,255,255,.7) !important; max-width:34ch; }
.ks-modal__contact{ display:flex; flex-direction:column; gap:4px; padding-top:18px; border-top:1px solid rgba(255,255,255,.16); }
.ks-modal__contact span{ font-size:12.5px; color:rgba(255,255,255,.5); }
.ks-modal__contact a{
  width:fit-content; font-family:"IBM Plex Mono",monospace; font-size:18px; font-weight:600; color:#fff !important;
  text-decoration:underline; text-decoration-color:rgba(255,255,255,.35); text-underline-offset:5px;
  transition:color .18s ease, text-decoration-color .18s ease;
}
.ks-modal__contact a:hover{ color:var(--ks-gold, #DBB472) !important; text-decoration-color:currentColor; }

/* правая панель — форма */
.ks-modal__form{ padding:clamp(30px,4vw,52px); display:flex; flex-direction:column; justify-content:center; }
.ks-modal__form .wpcf7-form p{ margin:0 !important; display:grid; gap:12px; }
.ks-modal__form .wpcf7-form-control-wrap{ display:block; }
.ks-modal__form .wpcf7-form br{ display:none; }
.ks-modal__form input[type=text], .ks-modal__form input[type=tel]{
  width:100% !important; min-height:54px; margin:0 !important; padding:0 16px !important;
  font-family:"IBM Plex Sans",sans-serif !important; font-size:16px !important;
  color:var(--ks-ink, #14161A) !important;
  background:#fff !important; border:1px solid rgba(20,22,26,.16) !important; border-radius:10px !important;
  box-shadow:none !important;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.ks-modal__form input[type=text]:hover, .ks-modal__form input[type=tel]:hover{ border-color:rgba(132,96,38,.45) !important; }
.ks-modal__form input[type=text]:focus, .ks-modal__form input[type=tel]:focus{ border-color:var(--ks-gold-ink, #9C7434) !important; box-shadow:0 0 0 3px rgba(219,180,114,.22) !important; outline:none; }
.ks-modal__form input::placeholder{ color:#8A909B !important; opacity:1; }
.ks-modal__form input[type=submit]{
  width:100%; min-height:54px; margin:0 !important; padding:0 22px !important;
  font-family:"IBM Plex Sans",sans-serif !important; font-size:15px !important; font-weight:650 !important; letter-spacing:.01em !important; text-transform:none !important;
  color:var(--ks-ink, #14161A) !important; cursor:pointer;
  background:linear-gradient(120deg,#E9D2A3 0%,#DBB472 55%,#CFA65E 100%) !important;
  background-size:180% 100% !important; background-position:0 50% !important;
  border:0 !important; border-radius:10px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 8px 20px rgba(156,116,52,.22) !important;
  transition:background-position .32s var(--kh-ease), box-shadow .22s ease, transform .22s var(--kh-ease) !important;
}
.ks-modal__form input[type=submit]:hover{ background-position:100% 50% !important; transform:translateY(-2px); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 14px 30px rgba(156,116,52,.3) !important; }
.ks-modal__form .wpcf7-spinner{ display:none; }
.ks-modal__form .wpcf7-not-valid-tip{ font-size:13px; color:#B4461F; margin-top:4px; }
.ks-modal__form .wpcf7-response-output{ margin:14px 0 0 !important; padding:10px 14px !important; border:1px solid rgba(20,22,26,.14) !important; border-radius:10px; font-size:14px; color:var(--ks-text, #22252B); }
.ks-modal__form .wpcf7-form.sent .wpcf7-response-output{ border-color:rgba(132,96,38,.5) !important; background:rgba(219,180,114,.12); }
/* ---- окно благодарности: одна колонка, графит, как левая панель окна заявки ---- */
.ks-thanks{ width:min(520px, calc(100vw - 32px)); }
.ks-thanks__box{
  display:block !important;   /* базовый .ks-modal__box — две колонки */
  padding:clamp(34px,5vw,48px);
  text-align:center;
  color:#fff;
  background-color:var(--ks-ink, #14161A);
  background-image:
    radial-gradient(70% 90% at 0% 0%, rgba(219,180,114,.24), transparent 60%),
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:auto, 34px 34px, 34px 34px;
  border-color:rgba(255,255,255,.14);
}
.ks-thanks__mark{
  display:grid; place-items:center; width:64px; height:64px; margin:0 auto 20px;
  border-radius:50%;
  color:var(--ks-gold, #DBB472);
  background:rgba(219,180,114,.14);
  border:1px solid rgba(219,180,114,.5);
}
.ks-thanks__title{
  margin:0 0 12px !important;
  font-size:clamp(23px,2.4vw,28px); font-weight:600; line-height:1.2; color:#fff !important;
}
.ks-thanks__text{
  margin:0 auto !important; max-width:38ch;
  font-size:15.5px; line-height:1.6; color:rgba(255,255,255,.72) !important;
}
.ks-thanks__contact{
  display:flex; flex-direction:column; gap:4px;
  margin-top:24px; padding-top:20px; border-top:1px solid rgba(255,255,255,.16);
}
.ks-thanks__contact span{ font-size:12.5px; color:rgba(255,255,255,.5); }
.ks-thanks__contact a{
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace; font-size:19px; font-weight:600;
  color:#fff !important; text-decoration:none;
}
.ks-thanks__contact a:hover{ color:var(--ks-gold, #DBB472) !important; }
.ks-thanks__ok{
  margin-top:26px; padding:13px 34px;
  border:0; border-radius:var(--kh-ctrl, 12px); cursor:pointer;
  background:var(--kh-grad-gold, linear-gradient(135deg,#F0D9A8,#DBB472));
  color:var(--ks-ink, #14161A); font-size:15px; font-weight:600; text-transform:none;
  transition:transform .18s var(--kh-ease), box-shadow .18s ease;
}
.ks-thanks__ok:hover{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(219,180,114,.3); }
/* окно открывается программно и сразу ставит фокус на кнопку; при программном фокусе
   :focus-visible не срабатывает, поэтому кольцо задаём и на :focus — иначе браузерное синее */
.ks-thanks__ok:focus, .ks-thanks__ok:focus-visible{ outline:2px solid #fff; outline-offset:3px; }
@media (prefers-reduced-motion:reduce){ .ks-thanks__ok:hover{ transform:none; } }
/* на телефоне общее правило красит крестик в тёмный (там он лежит на белой панели формы) —
   у окна благодарности панель графитовая, иначе крестик пропадает */
@media (max-width:767px){
  .ks-thanks .ks-modal__close{ background:rgba(255,255,255,.18); color:#fff; border-color:rgba(255,255,255,.35); }
}

.ks-modal__note{ margin:14px 0 0; font-size:12.5px; line-height:1.5; color:var(--ks-muted, #6A7180); }

@media (max-width:767px){
  .ks-modal{ width:calc(100vw - 20px); }
  .ks-modal__box{ grid-template-columns:1fr; }
  .ks-modal__intro{ padding:26px 22px 22px; gap:20px; }
  .ks-modal__form{ padding:22px; }
}
@media (prefers-reduced-motion:reduce){ .ks-modal[open], .ks-modal[open]::backdrop{ animation:none; } }