/* ksui.css — keys.ua chrome: header, contact bar, CTA, trust row, readability (night 2026-09-28, UI agent).
   Existing tokens only: green #195917 / #14470f, red #7a0000, dark #252b33 / #212832, text #262a2e.
   Scope: header, menu bar, banner, footer, template text outside .ksx. Nothing inside .ksx is touched. */

/* ---------- Language switch: RU / UA / EN in caps, 40px tap zone ---------- */
.switch-lang a { text-transform: uppercase; letter-spacing: .04em; }

/* ---------- Empty notice strip on EN (no EN twin of the notice) ---------- */
.banner-benef.ks-bb-en { display: none; }

/* ---------- Desktop: contact cluster inside the sticky green menu bar ---------- */
.ks-navc { display: none; }
@media (min-width: 992px) {
  .ks-navc { display: flex; align-items: center; gap: 6px; float: right; height: 65px; margin-right: 64px; }
  .ks-navc a { display: inline-flex; align-items: center; justify-content: center; height: 40px; color: #fff;
    text-decoration: none; border-radius: 3px; transition: background-color .18s ease; }
  .ks-navc a:hover, .ks-navc a:focus { background: rgba(255,255,255,.14); color: #fff; text-decoration: none; }
  .ks-navc a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
  .ks-navc svg { width: 18px; height: 18px; fill: currentColor; display: block; }
  /* three 40px icons: the menu row of inner pages is ~690px wide, a number here wrapped the bar to 2 rows (i3) */
  .ks-navc__tel, .ks-navc__ic { width: 40px; }
  .ks-navc__tel span { display: none; }
}

/* ---------- Service/section H1 on phones: 4 lines of 40px pushed content down ---------- */
@media (max-width: 767px) {
  .banner_info_about h1 { font-size: 28px !important; line-height: 1.2 !important; margin: 12px 0 8px !important; }
}

/* ---------- Mobile header: one row per job ---------- */
@media (max-width: 767px) {
  .top_header > .container { display: flex; align-items: center; justify-content: space-between; padding: 0 4px; }
  .top_header > .container::before, .top_header > .container::after { display: none; }
  .top_header .switch-lang { float: none !important; width: auto !important; height: 44px; margin: 0; display: flex; align-items: center; }
  .top_header .switch-lang li { display: block; margin: 0 !important; padding: 0 !important; }
  .top_header .switch-lang a { display: flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 6px; margin: 0; }
  .top_header .float_right { float: none !important; width: auto !important; margin: 0; }
  .top_header .float_right ul { margin: 0; display: flex; align-items: center; }
  .top_header .float_right li { margin: 0; }
  .top_header .float_right li a { display: flex; align-items: center; justify-content: center; width: 40px; height: 44px; }

  header .bottom_header { padding: 8px 0 !important; }
  header .bottom_header > .container { display: flex; align-items: center; justify-content: space-between; }
  header .bottom_header > .container::before, header .bottom_header > .container::after { display: none; }
  header .bottom_header .logo { float: none !important; width: auto !important; padding: 0 !important; margin: 0 !important; text-align: left; }
  header .bottom_header .logo { line-height: 0 !important; }
  header .bottom_header .logo a { display: block; height: 52px !important; margin: 0 !important; line-height: 0; }
  header .bottom_header .logo img { height: 52px !important; max-height: none !important; width: auto; margin: 0 !important; }
  header .bottom_header .address { float: none !important; width: auto !important; margin: 0 !important; }
  header .bottom_header .address .top-info:nth-of-type(2) { display: flex !important; align-items: center; border: 0 !important; padding: 0 !important; margin: 0 !important; }
  header .bottom_header .address .top-info:nth-of-type(2) .icon-box { display: none; }
  header .bottom_header .address .top-info:nth-of-type(2) .content-box { padding: 0 !important; margin: 0 !important; }
  header .bottom_header .address .top-info:nth-of-type(2) a[href^="tel:"] { display: inline-flex !important; align-items: center; min-height: 44px; line-height: 1.2 !important;
    padding: 0 14px; border: 2px solid #195917; border-radius: 3px; color: #195917 !important; font-weight: 700; font-size: 15px; white-space: nowrap; text-decoration: none; }
}
@media (max-width: 359px) {
  header .bottom_header .logo a, header .bottom_header .logo img { height: 44px !important; }
  header .bottom_header .address .top-info:nth-of-type(2) a[href^="tel:"] { padding: 0 8px; font-size: 13px; }
}

/* ---------- Mobile/tablet contact bar (replaces the floating circles); <992 the menu bar has no contact cluster ---------- */
.ks-cbar { display: none; }
@media (max-width: 991px) {
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px)); }
  .ks-cbar { display: grid; grid-template-columns: 1.25fr 1fr 1fr 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 990;
    height: calc(60px + env(safe-area-inset-bottom, 0px)); padding: 0 4px env(safe-area-inset-bottom, 0px) 66px;
    background: #212832; border-top: 1px solid rgba(255,255,255,.12); box-shadow: 0 -2px 10px rgba(0,0,0,.18); }
  .ks-cbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; margin: 6px 2px;
    border-radius: 4px; color: #fff; font-size: 11px; line-height: 1.1; font-weight: 600; text-decoration: none; letter-spacing: .01em; }
  .ks-cbar a:hover, .ks-cbar a:focus { color: #fff; text-decoration: none; background: rgba(255,255,255,.08); }
  .ks-cbar a:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
  .ks-cbar svg { width: 22px; height: 22px; fill: currentColor; display: block; }
  .ks-cbar .ks-cbar__call { background: #195917; }
  .ks-cbar .ks-cbar__call:hover, .ks-cbar .ks-cbar__call:focus { background: #14470f; }
  /* bug-report pill lives in the bar's left slot, so it no longer covers text */
  .ks-bug { left: 8px !important; bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important; z-index: 9998; }
  /* cookie notice sits above the bar instead of hiding it */
  #cookie-banner { bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important; }
  /* old floating circles (if cached HTML still has them) */
  .ks-msg-float { display: none !important; }
}

/* ---------- Targets of in-page CTA anchors clear the sticky menu ---------- */
#ks-form { scroll-margin-top: 150px; }  /* menu turns fixed on scroll and removes 65px from flow */

/* ---------- Footer trust row: requisites, register, address, hours ---------- */
.ks-trust { margin: 26px 0 0; padding: 18px 0 0; border-top: 1px solid rgba(255,255,255,.12); color: #c9ced6; font-size: 13px; line-height: 1.6; text-align: left; }
.ks-trust p { margin: 0 0 4px; color: #c9ced6 !important; font-size: 13px; line-height: 1.6; }
.ks-trust strong { color: #fff; font-weight: 600; }
.ks-trust .ks-trust__sep { color: #7d8794; padding: 0 6px; }
@media (max-width: 767px) { .ks-trust { text-align: center; } .ks-trust .ks-trust__sep { display: none; } .ks-trust .ks-trust__it { display: block; } }

/* ---------- Contacts page: messengers + hours in the address column ---------- */
.ks-cq { margin: 26px 0 0; }
.contact_us_container .address { height: auto !important; min-height: 428px; padding-bottom: 30px; }
.contact_us_container .address_holder { color: #4f555c; }
.ks-cq__h { font-weight: 700; color: #262a2e; margin: 0 0 10px; font-size: 15px; }
.ks-cq__row { display: flex; flex-wrap: wrap; gap: 8px; }
.ks-cq__row a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 3px; background: #195917; color: #fff;
  font-weight: 700; font-size: 14px; text-decoration: none; transition: background-color .18s ease; }
.ks-cq__row a:hover, .ks-cq__row a:focus { background: #14470f; color: #fff; text-decoration: none; }
.ks-cq__row svg { width: 18px; height: 18px; fill: currentColor; }
.ks-cq__hours { margin: 14px 0 0; color: #444; font-size: 14px; line-height: 1.6; }

/* ---------- Readability outside .ksx (old service texts, articles, home) ---------- */
.services-article .article > p, .services-article .article > ul > li, .services-article .article > ol > li,
.single-page-content article.content > p, .single-page-content article.content > ul > li, .single-page-content article.content > ol > li {
  font-size: 16px; line-height: 1.65; color: #262a2e; text-align: left; }
@media (max-width: 767px) {
  .services-article .article > p, .services-article .article > ul > li, .services-article .article > ol > li,
  .single-page-content article.content > p, .single-page-content article.content > ul > li, .single-page-content article.content > ol > li { font-size: 16px; }
}

/* ---------- Home: intro text beside the hero was all-bold ---------- */
.we_are_deatails p { font-weight: 400 !important; font-size: 15px; line-height: 1.65; text-align: left; }
.we_are_deatails p strong, .we_are_deatails p b { font-weight: 700; }

/* ---------- Notice strip on phones: less padding ---------- */
@media (max-width: 767px) { .banner-benef .text { padding: 8px 12px !important; } }

/* ---------- Home article text + bug pill clearance on desktop ---------- */
.mainpage_content .article > p, .mainpage_content .article > ul > li { font-size: 16px; line-height: 1.65; text-align: left; }
@media (min-width: 768px) { .bottom_footer { padding-bottom: 56px; } }

/* ---------- Article body links: theme sets a{color:#fff}, links in news text were invisible (28.09 wave 2) ---------- */
.single-page-content article.content > p a, .single-page-content article.content > ul > li a, .single-page-content article.content > ol > li a,
.services-article .article > p a, .services-article .article > ul > li a, .services-article .article > ol > li a {
  color: #195917; text-decoration: underline; text-underline-offset: 2px;
}
.single-page-content article.content > p a:hover, .services-article .article > p a:hover { color: #7a0000; }