:root {
  --ui-page: #f3f4f4;
  --ui-surface: #ffffff;
  --ui-fg: #16191c;
  --ui-subtle: #545b62;
  --ui-brand: #22272c;
  --ui-flare: #6b737a;
  --ui-lnk: #22272c;
  --ui-on-brand: #f3f4f4;
  --ui-ff-title: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --ui-ff-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --ui-scale-h1: clamp(33.2px, 1.006vw + 29.43px, 41.5px);
  --ui-scale-h2: clamp(26.6px, 0.800vw + 23.60px, 33.2px);
  --ui-scale-h3: clamp(21.3px, 0.642vw + 18.89px, 26.6px);
  --ui-scale-h4: clamp(19px, 0.279vw + 17.95px, 21.3px);
  --ui-corner: 8px;
  --bs-body-bg: var(--ui-page);
  --bs-body-bg-rgb: 243, 244, 244;
  --bs-body-color: var(--ui-fg);
  --bs-body-color-rgb: 22, 25, 28;
  --bs-body-font-family: var(--ui-ff-body);
  --bs-body-font-size: 1.0625rem;
  --bs-body-line-height: 1.6;
  --bs-emphasis-color: var(--ui-fg);
  --bs-emphasis-color-rgb: 22, 25, 28;
  --bs-heading-color: inherit;
  --bs-secondary-color: var(--ui-subtle);
  --bs-secondary-rgb: 84, 91, 98;
  --bs-tertiary-color: var(--ui-subtle);
  --bs-secondary-bg: var(--ui-surface);
  --bs-secondary-bg-rgb: 255, 255, 255;
  --bs-tertiary-bg: var(--ui-surface);
  --bs-tertiary-bg-rgb: 255, 255, 255;
  --bs-primary: var(--ui-brand);
  --bs-primary-rgb: 34, 39, 44;
  --bs-link-color: var(--ui-lnk);
  --bs-link-color-rgb: 34, 39, 44;
  --bs-link-hover-color: var(--ui-fg);
  --bs-link-hover-color-rgb: 22, 25, 28;
  --bs-light-rgb: 255, 255, 255;
  --bs-dark-rgb: 22, 25, 28;
  --bs-border-color: color-mix(in srgb, var(--ui-fg) 16%, var(--ui-page));
  --bs-border-radius: var(--ui-corner);
  --bs-border-radius-sm: calc(var(--ui-corner) * .6);
  --bs-border-radius-lg: calc(var(--ui-corner) * 1.4);
  --bs-border-radius-xl: calc(var(--ui-corner) * 1.8);
  --bs-focus-ring-color: color-mix(in srgb, var(--ui-brand) 40%, transparent);
}

html {
  color-scheme: light;
}

body {
  background: var(--ui-page);
  color: var(--ui-fg);
  font-family: var(--ui-ff-body);
  font-size: 1.0625rem;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--ui-ff-title);
  font-weight: 700;
  line-height: 1.15;
  color: inherit;
}

h1, .h1 { font-size: var(--ui-scale-h1); }
h2, .h2 { font-size: var(--ui-scale-h2); }
h3, .h3 { font-size: var(--ui-scale-h3); }
h4, .h4 { font-size: var(--ui-scale-h4); }

.btn-primary {
  --bs-btn-color: var(--ui-on-brand);
  --bs-btn-bg: var(--ui-brand);
  --bs-btn-border-color: var(--ui-brand);
  --bs-btn-hover-color: var(--ui-on-brand);
  --bs-btn-hover-bg: color-mix(in srgb, var(--ui-brand) 88%, #000000);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--ui-brand) 88%, #000000);
  --bs-btn-active-color: var(--ui-on-brand);
  --bs-btn-active-bg: color-mix(in srgb, var(--ui-brand) 80%, #000000);
  --bs-btn-active-border-color: color-mix(in srgb, var(--ui-brand) 80%, #000000);
  --bs-btn-disabled-color: var(--ui-on-brand);
  --bs-btn-disabled-bg: var(--ui-brand);
  --bs-btn-disabled-border-color: var(--ui-brand);
}

.btn-outline-primary {
  --bs-btn-color: var(--ui-lnk);
  --bs-btn-border-color: var(--ui-brand);
  --bs-btn-hover-color: var(--ui-on-brand);
  --bs-btn-hover-bg: var(--ui-brand);
  --bs-btn-hover-border-color: var(--ui-brand);
  --bs-btn-active-color: var(--ui-on-brand);
  --bs-btn-active-bg: var(--ui-brand);
  --bs-btn-active-border-color: var(--ui-brand);
}

/* Bootstrap красит .bg-* только фоном, а текст наследуется: на .bg-primary
   выходил основной текст (до 1.2:1), на тёмной основе .bg-light — светлый
   текст на светлом (1:1). Здесь у каждой заливки своя пара из гарантированных,
   и ссылки со вторичным текстом внутри .bg-primary тоже берут onPrimary */
.bg-primary {
  color: var(--ui-on-brand);
  --bs-body-color-rgb: 243, 244, 244;
  --bs-emphasis-color-rgb: 243, 244, 244;
  --bs-secondary-color: var(--ui-on-brand);
  --bs-secondary-rgb: 243, 244, 244;
  --bs-link-color: var(--ui-on-brand);
  --bs-link-color-rgb: 243, 244, 244;
  --bs-link-hover-color: var(--ui-on-brand);
  --bs-link-hover-color-rgb: 243, 244, 244;
}

.bg-primary .btn-outline-primary {
  --bs-btn-color: var(--ui-on-brand);
  --bs-btn-border-color: var(--ui-on-brand);
  --bs-btn-hover-color: var(--ui-brand);
  --bs-btn-hover-bg: var(--ui-on-brand);
  --bs-btn-hover-border-color: var(--ui-on-brand);
  --bs-btn-active-color: var(--ui-brand);
  --bs-btn-active-bg: var(--ui-on-brand);
  --bs-btn-active-border-color: var(--ui-on-brand);
}

/* «Светлая» заливка — панель на обеих основах: на тёмной --bs-light-rgb
   равен цвету текста (он нужен .text-light), и фон совпадал бы с текстом */
.bg-light {
  background-color: var(--ui-surface) !important;
  color: var(--ui-fg);
}

.bg-body {
  color: var(--ui-fg);
}

.bg-dark {
  color: var(--ui-page);
}

/* Панели и поля внутри заливки primary возвращают переменные корня: иначе
   ссылки и подсказки полей на белой карточке вышли бы цветом onPrimary */
.bg-primary :where(.bg-body, .bg-light, .card, .form-control, .form-select, .dropdown-menu, .list-group-item, .accordion-item) {
  --bs-body-color-rgb: 22, 25, 28;
  --bs-emphasis-color-rgb: 22, 25, 28;
  --bs-secondary-color: var(--ui-subtle);
  --bs-secondary-rgb: 84, 91, 98;
  --bs-link-color: var(--ui-lnk);
  --bs-link-color-rgb: 34, 39, 44;
  --bs-link-hover-color: var(--ui-fg);
  --bs-link-hover-color-rgb: 22, 25, 28;
}

:where(img[height][width]) { height: auto; }

.site-header{background:var(--ui-page);color:var(--ui-fg);border-bottom:1px solid rgba(0,0,0,.08);font-family:var(--ui-ff-body)}
.site-header .navbar{padding-top:.75rem;padding-bottom:.75rem}
.site-header .navbar-brand{display:flex;align-items:center;gap:.6rem;color:var(--ui-fg);font-family:var(--ui-ff-title);font-weight:700;font-size:1.15rem;margin-right:.5rem}
.site-header .navbar-brand img{width:55px;height:55px;flex-shrink:0}
.site-header .nav-link{color:var(--ui-fg);font-size:17px;padding:.5rem .8rem;border-radius:var(--ui-corner);transition:background-color .2s,color .2s}
.site-header .nav-link:hover{color:var(--ui-brand);background:var(--ui-surface)}
.site-header .nav-link:focus-visible,.site-header .navbar-brand:focus-visible,.site-header .navbar-toggler:focus-visible{outline:2px solid var(--ui-brand);outline-offset:2px;box-shadow:none}
.site-header .navbar-toggler{border:1px solid rgba(0,0,0,.2);border-radius:var(--ui-corner);padding:.4rem .6rem}
@media (max-width:991.98px){.site-header .navbar-nav{padding-top:.75rem}.site-header .nav-link{padding:.65rem .5rem}}
@media (max-width:400px){.site-header .navbar-brand{font-size:1rem}.site-header .navbar-brand img{width:44px;height:44px}}

.kx-hero{background:var(--ui-page);color:var(--ui-fg);padding:96px 0 88px;font-family:var(--ui-ff-body);font-size:17px}
.kx-hero h1{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h1);color:var(--ui-fg);line-height:1.15;max-width:22ch;margin-bottom:1rem}
.kx-hero h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h3);color:var(--ui-subtle);font-weight:500;max-width:48ch;margin-bottom:1.25rem}
.kx-hero p{color:var(--ui-fg);max-width:62ch;line-height:1.6}
.kx-hero ul{list-style:none;padding:0;margin:1.5rem 0 2rem;max-width:62ch}
.kx-hero li{display:flex;gap:.6rem;margin-bottom:.6rem;color:var(--ui-fg);line-height:1.5}
.kx-hero li i{color:var(--ui-brand);flex-shrink:0;margin-top:.15rem}
.kx-hero .kx-btn{background:var(--ui-brand);color:var(--ui-on-brand);border:2px solid var(--ui-brand);border-radius:var(--ui-corner);padding:.75rem 1.5rem;font-weight:600;font-size:17px;transition:opacity .2s,transform .2s}
.kx-hero .kx-btn:hover{opacity:.88;transform:translateY(-1px);color:var(--ui-on-brand)}
.kx-hero .kx-btn:focus-visible{outline:3px solid var(--ui-fg);outline-offset:3px}
.kx-hero figure{margin:56px 0 0}
.kx-hero img{aspect-ratio:3/2;width:100%;height:auto;object-fit:cover;border-radius:var(--ui-corner);display:block}
@media(max-width:576px){.kx-hero{padding:72px 0 64px}.kx-hero figure{margin-top:40px}}

#value{padding:96px 0;background:var(--ui-surface);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px}
#value h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);max-width:22ch;margin-bottom:16px}
#value .lead-txt{color:var(--ui-subtle);max-width:62ch;margin-bottom:48px;font-size:17px}
#value .adv{background:var(--ui-page);border:1px solid rgba(0,0,0,.08);border-radius:var(--ui-corner);padding:28px 24px;height:100%;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
#value .adv:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(0,0,0,.07);border-color:rgba(0,0,0,.16)}
#value .adv.wide{box-shadow:0 2px 8px rgba(0,0,0,.05)}
#value .adv i{font-size:1.6rem;color:var(--ui-brand);display:block;margin-bottom:14px}
#value .adv h3{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h4);color:var(--ui-fg);margin-bottom:10px}
#value .adv p{color:var(--ui-subtle);margin:0;line-height:1.6;font-size:17px}
#value .cta{margin-top:48px}
#value .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:12px 26px}
#value .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:3px}
@media(max-width:575px){#value{padding:80px 0}}

#story{background:var(--ui-surface);color:var(--ui-fg);padding:96px 0;font-family:var(--ui-ff-body);font-size:17px}
#story h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:1.25rem}
#story p{line-height:1.65;max-width:62ch;color:var(--ui-fg)}
#story .story-note{color:var(--ui-subtle)}
#story .story-img{aspect-ratio:3/2;width:100%;height:auto;object-fit:cover;border-radius:var(--ui-corner);display:block}
#story .story-img-2{margin-top:1.5rem}
#story .story-link{color:var(--ui-lnk);font-weight:600;text-decoration:underline;text-underline-offset:3px}
#story .story-link:focus-visible{outline:2px solid var(--ui-brand);outline-offset:3px;border-radius:4px}
#story figcaption{color:var(--ui-subtle);font-size:17px;margin-top:.5rem}
@media (max-width:991.98px){#story{padding:80px 0}}

#working-with-us{background:var(--ui-surface);color:var(--ui-fg);padding:88px 0;font-family:var(--ui-ff-body);font-size:17px}
#working-with-us h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:.75rem}
#working-with-us .ww-lead{color:var(--ui-subtle);max-width:62ch;margin-bottom:2rem}
#working-with-us .ww-item{background:var(--ui-page);border:1px solid rgba(0,0,0,.1);border-left:4px solid var(--ui-flare);border-radius:var(--ui-corner);padding:1.1rem 1.2rem;height:100%;transition:transform .2s ease,box-shadow .2s ease}
#working-with-us .ww-item:hover{transform:translateY(-3px);box-shadow:0 6px 16px rgba(0,0,0,.07)}
#working-with-us .ww-item i{font-size:1.4rem;color:var(--ui-brand);display:block;margin-bottom:.5rem}
#working-with-us h3{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h4);color:var(--ui-fg);margin-bottom:.4rem}
#working-with-us p{margin:0;color:var(--ui-fg);line-height:1.6}
#working-with-us .btn-primary{color:var(--ui-on-brand);background:var(--ui-brand);border-color:var(--ui-brand)}
#working-with-us .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:2px}

#services{background:var(--ui-surface);color:var(--ui-fg);padding:96px 0;font-family:var(--ui-ff-body);font-size:17px}
#services h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:16px}
#services h3{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h4);color:var(--ui-fg);margin-bottom:8px}
#services .lead-txt{color:var(--ui-subtle);max-width:62ch;margin-bottom:48px;font-size:17px}
#services .svc{display:flex;gap:20px;align-items:flex-start;background:var(--ui-page);color:var(--ui-fg);border:1px solid rgba(0,0,0,.08);border-radius:var(--ui-corner);padding:24px;height:100%;transition:border-color .2s,box-shadow .2s,transform .2s}
#services .svc:hover{border-color:var(--ui-brand);box-shadow:0 6px 18px rgba(0,0,0,.07);transform:translateY(-2px)}
#services .ico{flex:0 0 52px;width:52px;height:52px;border-radius:var(--ui-corner);background:var(--ui-brand);color:var(--ui-on-brand);display:flex;align-items:center;justify-content:center;font-size:24px}
#services .svc p{color:var(--ui-subtle);margin:0;line-height:1.6;font-size:17px}
#services .note{color:var(--ui-subtle);margin-top:40px;max-width:62ch}
#services .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:12px 24px}
#services .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:2px}
@media(max-width:575px){#services{padding:80px 0}#services .svc{padding:18px;gap:14px}#services .ico{flex-basis:44px;width:44px;height:44px;font-size:20px}}

#portfolio{background:var(--ui-surface);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;padding:96px 0}
#portfolio h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:.5rem}
#portfolio .pf-note{color:var(--ui-subtle);max-width:60ch;margin-bottom:2.5rem}
#portfolio .pf-item{background:var(--ui-page);border-radius:var(--ui-corner);overflow:hidden;height:100%;display:flex;flex-direction:column}
#portfolio .pf-item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block}
#portfolio .pf-body{padding:1.1rem 1.1rem 1.3rem}
#portfolio .pf-badge{display:inline-block;font-size:.85rem;color:var(--ui-subtle);border:1px solid var(--ui-subtle);border-radius:var(--ui-corner);padding:.1rem .55rem;margin-bottom:.6rem}
#portfolio h3{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h4);color:var(--ui-fg);margin-bottom:.4rem}
#portfolio .pf-body p{color:var(--ui-fg);margin:0;line-height:1.55}
@media(max-width:575px){#portfolio{padding:80px 0}}

#stay-in-touch{background:var(--ui-surface);color:var(--ui-fg);padding:96px 0;font-family:var(--ui-ff-body);font-size:17px}
#stay-in-touch h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:1rem}
#stay-in-touch p{color:var(--ui-subtle);max-width:62ch;line-height:1.6}
#stay-in-touch .nl-topics{list-style:none;padding:0;margin:1.25rem 0 0}
#stay-in-touch .nl-topics li{color:var(--ui-fg);padding:.35rem 0 .35rem 1.1rem;position:relative}
#stay-in-touch .nl-topics li::before{content:"";position:absolute;left:0;top:.95rem;width:6px;height:6px;border-radius:50%;background:var(--ui-subtle)}
#stay-in-touch .nl-form{background:var(--ui-page);border-radius:var(--ui-corner);padding:2rem}
#stay-in-touch label{font-weight:600;color:var(--ui-fg);margin-bottom:.5rem}
#stay-in-touch .form-control{font-size:17px;border-radius:var(--ui-corner);color:var(--ui-fg);background:var(--ui-page)}
#stay-in-touch .form-control:focus{border-color:var(--ui-brand);box-shadow:0 0 0 3px rgba(0,0,0,.12)}
#stay-in-touch .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);font-size:17px;padding:.65rem 1.4rem}
#stay-in-touch .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:2px}
#stay-in-touch .nl-note{font-size:17px;margin-top:1rem;margin-bottom:0}
#stay-in-touch .nl-note a{color:var(--ui-lnk)}
@media(max-width:575px){#stay-in-touch{padding:80px 0}#stay-in-touch .nl-form{padding:1.25rem}}

#faq{background:var(--ui-surface);color:var(--ui-fg);padding:96px 0;font-family:var(--ui-ff-body);font-size:17px}
#faq h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:16px}
#faq .faq-lead{color:var(--ui-subtle);max-width:62ch;margin-bottom:40px;line-height:1.6}
#faq .accordion{max-width:860px}
#faq .accordion-item{background:var(--ui-page);color:var(--ui-fg);border:1px solid rgba(0,0,0,.08);border-radius:var(--ui-corner);margin-bottom:10px;overflow:hidden}
#faq .accordion-button{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-title);font-size:17px;font-weight:600;line-height:1.45;box-shadow:none;padding:18px 20px}
#faq .accordion-button:not(.collapsed){background:var(--ui-page);color:var(--ui-fg);border-bottom:1px solid rgba(0,0,0,.08)}
#faq .accordion-button:focus-visible{outline:2px solid var(--ui-brand);outline-offset:-2px}
#faq .accordion-body{color:var(--ui-fg);line-height:1.65;padding:18px 20px 22px;max-width:72ch}
#faq .accordion-body p:last-child{margin-bottom:0}
#faq a{color:var(--ui-lnk)}
#faq .faq-cta{margin-top:40px}
#faq .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:12px 24px;font-size:17px}
@media (max-width:576px){#faq{padding:80px 0}#faq .accordion-button,#faq .accordion-body{padding-left:16px;padding-right:16px}}

#reach-us{background:var(--ui-surface);color:var(--ui-fg);padding:96px 0;font-family:var(--ui-ff-body);font-size:17px}
#reach-us h2,#reach-us h3{font-family:var(--ui-ff-title);color:var(--ui-fg)}
#reach-us h2{font-size:var(--ui-scale-h2)}
#reach-us h3{font-size:var(--ui-scale-h4)}
#reach-us .rq-lead{color:var(--ui-subtle);max-width:60ch}
#reach-us .rq-list{padding-left:1.1rem;max-width:60ch}
#reach-us .rq-list li{margin-bottom:.5rem}
#reach-us .rq-form{background:var(--ui-page);color:var(--ui-fg);border-radius:var(--ui-corner);padding:2rem;border:1px solid rgba(0,0,0,.08)}
#reach-us .form-label{font-weight:600;color:var(--ui-fg)}
#reach-us .form-control{font-size:17px;border-radius:var(--ui-corner);color:var(--ui-fg);background:var(--ui-page)}
#reach-us .form-control:focus{border-color:var(--ui-brand);box-shadow:0 0 0 .2rem rgba(0,0,0,.12)}
#reach-us .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:.7rem 1.6rem;font-size:17px}
#reach-us .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:2px}
#reach-us a.rq-mail{color:var(--ui-lnk);font-weight:600;word-break:break-all}
#reach-us .rq-note{color:var(--ui-subtle)}
@media(max-width:575px){#reach-us{padding:80px 0}#reach-us .rq-form{padding:1.25rem}}

#notice{background:var(--ui-surface);color:var(--ui-fg);padding:96px 0;font-family:var(--ui-ff-body);font-size:17px}
#notice h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h2);color:var(--ui-fg);margin-bottom:1.25rem}
#notice .notice-box{background:var(--ui-page);border:1px solid rgba(0,0,0,.08);border-radius:var(--ui-corner);padding:2rem;max-width:760px}
#notice .notice-icon{font-size:1.75rem;color:var(--ui-brand);line-height:1}
#notice p{line-height:1.7;margin-bottom:1rem;color:var(--ui-fg)}
#notice p.text-muted{color:var(--ui-subtle)!important}
#notice a{color:var(--ui-lnk)}
#notice a:focus-visible{outline:2px solid var(--ui-brand);outline-offset:2px}
@media (max-width:575px){#notice{padding:80px 0}#notice .notice-box{padding:1.25rem}}

.kd-footer{background:var(--ui-surface);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;padding:88px 0 96px}
.kd-footer h2,.kd-footer h3{font-family:var(--ui-ff-title);color:var(--ui-fg)}
.kd-footer h2{font-size:var(--ui-scale-h3);margin-bottom:1rem}
.kd-footer h3{font-size:var(--ui-scale-h4);margin-bottom:.75rem}
.kd-footer p{color:var(--ui-subtle);max-width:60ch;line-height:1.6}
.kd-footer ul{list-style:none;padding:0;margin:0}
.kd-footer li{margin-bottom:.5rem}
.kd-footer a{color:var(--ui-lnk);text-decoration:underline;text-underline-offset:3px}
.kd-footer a:focus-visible,.kd-cookie a:focus-visible,.kd-cookie button:focus-visible{outline:2px solid var(--ui-brand);outline-offset:2px}
.kd-footer .kd-copy{border-top:1px solid var(--ui-subtle);margin-top:2.5rem;padding-top:1.5rem;color:var(--ui-subtle)}
.kd-cookie{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;border-top:2px solid var(--ui-brand);padding:1.25rem 0;max-height:60vh;overflow-y:auto}
.kd-cookie h2{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h4);color:var(--ui-fg);margin-bottom:.5rem}
.kd-cookie p,.kd-cookie li{color:var(--ui-subtle);margin-bottom:.35rem;line-height:1.5}
.kd-cookie ul{padding-left:1.1rem;margin-bottom:.75rem}
.kd-cookie a{color:var(--ui-lnk)}
.kd-cookie .btn{border-radius:var(--ui-corner)}

#about-main{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;padding:96px 0}
#about-main h1,#about-main h2,#about-main h3{font-family:var(--ui-ff-title);color:var(--ui-fg)}
#about-main h1{font-size:var(--ui-scale-h1);margin-bottom:1.25rem}
#about-main h2{font-size:var(--ui-scale-h2);margin-bottom:1rem}
#about-main h3{font-size:var(--ui-scale-h3);margin-bottom:.5rem}
#about-main p,#about-main li{line-height:1.65;max-width:68ch}
#about-main .ab-lead{color:var(--ui-subtle)}
#about-main .ab-img{aspect-ratio:3/2;width:100%;height:auto;object-fit:cover;border-radius:var(--ui-corner);display:block}
#about-main figcaption{color:var(--ui-subtle);margin-top:.5rem}
#about-main .ab-block{margin-top:88px}
#about-main .ab-panel{background:var(--ui-surface);color:var(--ui-fg);border-radius:var(--ui-corner);padding:2rem}
#about-main .ab-list{padding-left:1.1rem}
#about-main .ab-list li{margin-bottom:.6rem}
#about-main .ab-qa dt{font-family:var(--ui-ff-title);font-weight:600;margin-top:1.5rem}
#about-main .ab-qa dd{color:var(--ui-subtle);margin:.4rem 0 0;max-width:68ch;line-height:1.65}
#about-main a:not(.btn){color:var(--ui-lnk)}
#about-main .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:.75rem 1.5rem}
#about-main .btn:focus-visible,#about-main a:focus-visible{outline:3px solid var(--ui-fg);outline-offset:3px}
#about-main .ab-cta{border-top:1px solid rgba(0,0,0,.12);padding-top:2.5rem}
@media(max-width:767px){#about-main{padding:72px 0}#about-main .ab-block{margin-top:64px}#about-main .ab-panel{padding:1.4rem}}

#contact-main{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;padding:96px 0}
#contact-main h1,#contact-main h2,#contact-main h3{font-family:var(--ui-ff-title);color:var(--ui-fg)}
#contact-main h1{font-size:var(--ui-scale-h1);margin-bottom:1rem}
#contact-main h2{font-size:var(--ui-scale-h3);margin-bottom:.75rem}
#contact-main .cm-lead{max-width:62ch;color:var(--ui-subtle);line-height:1.6}
#contact-main .cm-form{background:var(--ui-surface);color:var(--ui-fg);border-radius:var(--ui-corner);padding:2rem;border:1px solid rgba(0,0,0,.08)}
#contact-main .form-label{font-weight:600;color:var(--ui-fg)}
#contact-main .form-control{font-size:17px;border-radius:var(--ui-corner);background:var(--ui-page);color:var(--ui-fg)}
#contact-main .form-control:focus{border-color:var(--ui-brand);box-shadow:0 0 0 .2rem rgba(0,0,0,.12)}
#contact-main .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:.7rem 1.6rem;font-size:17px}
#contact-main .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:2px}
#contact-main .cm-side p,#contact-main .cm-side li{line-height:1.6;color:var(--ui-fg)}
#contact-main .cm-side .cm-muted{color:var(--ui-subtle)}
#contact-main .cm-side ul{padding-left:1.1rem}
#contact-main .cm-side li{margin-bottom:.4rem}
#contact-main a:not(.btn){color:var(--ui-lnk)}
#contact-main .cm-mail{font-weight:600;word-break:break-all;user-select:all}
#contact-main .cm-block+.cm-block{margin-top:2.25rem}
#contact-main .cm-end{margin-top:3rem}
@media(max-width:575px){#contact-main{padding:80px 0}#contact-main .cm-form{padding:1.25rem}}

.ty-section{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;line-height:1.6;padding:4rem 0}
.ty-box{max-width:40rem;background:var(--ui-surface);border-radius:var(--ui-corner);padding:2.5rem 1.5rem}
@media (min-width:576px){.ty-box{padding:3rem 2.5rem}}
.ty-icon{width:3.5rem;height:3.5rem;border-radius:50%;background:var(--ui-brand);color:var(--ui-on-brand);display:inline-flex;align-items:center;justify-content:center;margin-bottom:1.5rem}
.ty-section h1{font-family:var(--ui-ff-title);font-size:var(--ui-scale-h1);color:var(--ui-fg);line-height:1.2;margin-bottom:1rem}
.ty-section p{max-width:60ch;margin-bottom:1rem}
.ty-section .ty-muted{color:var(--ui-subtle)}
.ty-section .btn-primary{border-radius:var(--ui-corner);padding:.75rem 1.5rem;font-size:17px}
.ty-section .btn-primary:focus-visible{outline:3px solid var(--ui-fg);outline-offset:3px}

#services-content{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;padding:96px 0}
#services-content h1,#services-content h2,#services-content h3{font-family:var(--ui-ff-title);color:var(--ui-fg)}
#services-content h1{font-size:var(--ui-scale-h1);max-width:22ch;margin-bottom:1rem}
#services-content h2{font-size:var(--ui-scale-h2);margin-bottom:.75rem}
#services-content h3{font-size:var(--ui-scale-h4);margin:.9rem 0 .5rem}
#services-content .lead-txt{color:var(--ui-subtle);max-width:65ch;font-size:17px}
#services-content .svc{background:var(--ui-surface);color:var(--ui-fg);border:1px solid rgba(0,0,0,.08);border-radius:var(--ui-corner);padding:1.5rem;height:100%;transition:border-color .2s,transform .2s,box-shadow .2s}
#services-content .svc:hover{border-color:var(--ui-brand);transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.07)}
#services-content .svc p{color:var(--ui-subtle);margin:0}
#services-content .ico{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--ui-corner);background:var(--ui-brand);color:var(--ui-on-brand);font-size:1.4rem}
#services-content .info{margin-top:80px}
#services-content .info p{color:var(--ui-subtle);max-width:68ch}
#services-content .cta{margin-top:80px;background:var(--ui-surface);color:var(--ui-fg);border-radius:var(--ui-corner);padding:2rem}
#services-content .cta p{color:var(--ui-subtle);max-width:60ch}
#services-content .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:.7rem 1.4rem}
#services-content .btn-primary:focus-visible,#services-content a:focus-visible{outline:3px solid var(--ui-fg);outline-offset:2px}
#services-content a.txt{color:var(--ui-lnk)}
@media(max-width:575px){#services-content{padding:72px 0}}

#faq-section{background:var(--ui-page);color:var(--ui-fg);font-family:var(--ui-ff-body);font-size:17px;padding:96px 0}
#faq-section h1,#faq-section h2,#faq-section h3{font-family:var(--ui-ff-title);color:var(--ui-fg)}
#faq-section h1{font-size:var(--ui-scale-h1);margin-bottom:16px}
#faq-section h2{font-size:var(--ui-scale-h3);margin:56px 0 12px}
#faq-section .faq-lead{color:var(--ui-subtle);max-width:68ch;line-height:1.6}
#faq-section .faq-intro{color:var(--ui-subtle);max-width:68ch;margin-bottom:20px;line-height:1.6}
#faq-section .accordion{--bs-accordion-bg:var(--ui-page);--bs-accordion-color:var(--ui-fg);--bs-accordion-active-bg:var(--ui-surface);--bs-accordion-active-color:var(--ui-fg);--bs-accordion-border-radius:var(--ui-corner);--bs-accordion-inner-border-radius:var(--ui-corner);max-width:820px}
#faq-section .accordion-button{font-family:var(--ui-ff-title);font-weight:600;font-size:17px;color:var(--ui-fg);background:var(--ui-page)}
#faq-section .accordion-button:not(.collapsed){background:var(--ui-surface);color:var(--ui-fg);box-shadow:none}
#faq-section .accordion-button:focus-visible{outline:2px solid var(--ui-brand);outline-offset:-2px;box-shadow:none}
#faq-section .accordion-body{line-height:1.65;max-width:72ch;color:var(--ui-fg)}
#faq-section .accordion-body a{color:var(--ui-lnk)}
#faq-section .faq-cta{background:var(--ui-surface);color:var(--ui-fg);border-radius:var(--ui-corner);padding:40px 32px;margin-top:72px;max-width:820px}
#faq-section .faq-cta p{color:var(--ui-subtle);margin-bottom:20px}
#faq-section .faq-cta h2{margin-top:0}
#faq-section .btn-primary{background:var(--ui-brand);border-color:var(--ui-brand);color:var(--ui-on-brand);border-radius:var(--ui-corner);padding:12px 24px}
#faq-section .btn-primary:focus-visible{outline:2px solid var(--ui-fg);outline-offset:2px}
@media(max-width:576px){#faq-section{padding:80px 0}#faq-section .faq-cta{padding:28px 20px}}

/* Цвет текста кнопок закреплён: правило блока вида «#about a { color: … }»
   по специфичности перебивало .btn-primary, и кнопка выходила светлым
   текстом на светлой заливке */
a.btn-primary, .btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  color: var(--ui-on-brand) !important;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--ui-brand);
  outline-offset: 2px;
}

footer a {
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* Название в шапке набрано заголовочным шрифтом; крупное, оно выталкивает
   кнопку меню на вторую строку телефона */
@media (max-width: 575.98px) {
  .navbar-brand, .navbar-brand * {
    font-size: 1.25rem !important;
    line-height: 1.2;
  }
  .navbar-brand {
    min-width: 0;
    max-width: calc(100% - 64px);
    white-space: normal;
  }
}

footer small, footer .small {
  font-size: max(.875rem, 14px);
}

@keyframes reveal-56 {
  from { opacity: 0; transform: translateX(-16px); }
  to { opacity: 1; transform: none; }
}

.intro-band-21 > * {
  animation: reveal-56 530ms cubic-bezier(.2, .7, .2, 1) both;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
