/* mmix.ua UI/UX слой 28.09.2026 (wave2/uiux). Дизайн сайта не меняется: только читаемость, тап-зоны, фокус,
   компактная cookie-плашка, липкая панель заявки. Палитра — цвета плиток и кнопки btn-blue из main.min.css. */
:root{--mx-blue:#005dff;--mx-blue-edge:#4d7cdb;--mx-dark:#0e0f14;--mx-orange:#e1973f;--mx-green:#70a857;--mx-navy:#2b5c9a;--mx-red:#d04a3a}

/* 1. Фокус с клавиатуры (в main.min.css стоит * {outline:none}) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[role=link]:focus-visible,[role=button]:focus-visible,[tabindex]:focus-visible,.menu-btn:focus-visible{
  outline:3px solid var(--mx-blue)!important;outline-offset:2px;box-shadow:0 0 0 2px #fff}

/* 2. Тап-зоны: маленькие иконки получают невидимую зону 44px без сдвига вёрстки */
.header .phone li a,.footer .social li a,.duns-ncage a,.mobile-portfolio a{position:relative}
.header .phone li a::after,.footer .social li a::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
.mobile-portfolio a::after{content:"";position:absolute;left:-6px;right:-6px;top:-13px;bottom:-13px}
.footer .social li{margin:0 9px}

/* 2b. Межстрочный интервал: в main.min.css у текстовых блоков line-height 1.0–1.15, текст слипается */
.article p,.article li,.article td,.mxd p,.mxd li,.mxb p,.mxb li,.mxcase p,.mxcase li,.dev-dscr p,.dev-dscr li,
.galaxy-dscr p,.chips-item-dscr p,.result-dscr p,.elephant-inform-dscr p,.elephant-inform-dscr li,
.advantage-dscr li,.contacts-photo-wrap p,.team-dscr p{line-height:1.55}
.mxd li+li,.mxb li+li,.article li+li{margin-top:.3em}

/* 3. Cookie-плашка: одна строка на десктопе, две-три на телефоне, кнопка 44px */
#cookie-banner{padding:10px 16px!important;background-color:#1b1d24!important;border-top:3px solid var(--mx-blue);box-sizing:border-box;text-align:left!important}
#cookie-banner .mx-ck{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:16px}
#cookie-banner .mx-ck p{margin:0;font:14px/1.4 Arial,sans-serif!important;color:#e9ecf2;flex:1}
#cookie-banner .mx-ck a{color:#9cc2ff!important;text-decoration:underline}
#cookie-banner .mx-ck button{flex:none;min-height:44px;padding:0 22px;background:var(--mx-blue);color:#fff;border:0;border-bottom:4px solid var(--mx-blue-edge);font:15px "HelveticaMedium",Arial,sans-serif;text-transform:uppercase;cursor:pointer}
#cookie-banner .mx-ck button:hover{background:#1f6fff}

/* 4. Липкая панель заявки */
.mx-bar{display:none}
.mx-bar__cta{font-family:"HelveticaMedium",Arial,sans-serif;text-transform:uppercase;text-decoration:none!important}
.mx-bar__stripe{display:flex;height:4px}
.mx-bar__stripe i{flex:1}
.mx-bar__stripe i:nth-child(1){background:var(--mx-orange)}.mx-bar__stripe i:nth-child(2){background:var(--mx-green)}
.mx-bar__stripe i:nth-child(3){background:var(--mx-navy)}.mx-bar__stripe i:nth-child(4){background:var(--mx-red)}

@media (max-width:767px){
  .mx-bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:950;background:var(--mx-dark);
    padding-bottom:env(safe-area-inset-bottom);transform:translateY(0);transition:transform .25s ease-out}
  .mx-bar.is-hidden{transform:translateY(110%)}
  .mx-bar__row{display:flex;gap:8px;padding:8px 10px}
  .mx-bar__cta{flex:1;display:flex;align-items:center;justify-content:center;min-height:46px;background:var(--mx-blue);color:#fff!important;
    border-bottom:4px solid var(--mx-blue-edge);font-size:15px;letter-spacing:.02em}
  .mx-bar__msg{flex:none;width:50px;min-height:46px;display:flex;align-items:center;justify-content:center;background:#23262f;border-bottom:4px solid #393f4d;cursor:pointer}
  .mx-bar__msg img{width:26px;height:26px;display:block}
  body.mx-has-bar{padding-bottom:66px}
  body.mx-has-bar .footer-bottom{padding-bottom:12px}
  /* чат-кружок на телефоне дублирует панель и закрывал текст — прячем (как на crystal.tax) */
  .chat.js-chat{display:none!important}
  body.mx-has-bar #cookie-banner{bottom:66px!important}
  body.mx-has-bar.mx-bar-off #cookie-banner{bottom:0!important}
  #cookie-banner .mx-ck{gap:10px}
  #cookie-banner .mx-ck p{font-size:13px!important}
  #cookie-banner .mx-ck button{padding:0 14px;font-size:14px}

  /* 5. Читаемость на телефоне */
  .galaxy-message{font-size:15px!important;line-height:1.5}
  .galaxy-message p{font-size:15px;line-height:1.5}
  .galaxy-text p,.galaxy-dscr p{line-height:1.5}
  .chips-item-dscr{font-size:15px!important;line-height:1.5}
  .footer-icg-wrap{font-size:13px!important;line-height:1.5}
  /* поля форм: 44px и 16px — iOS не зумит страницу при фокусе */
  .connect-us-box form input.input-form,.content-form .input-form,#forma3 input[type=text],#forma3 input[type=email],#forma3 input[type=tel]{min-height:44px;height:44px;line-height:44px;font-size:16px}
  .connect-us-box form textarea,.content-form textarea{font-size:16px}
  /* текстовые ссылки футера и «сайты по городам» — зона нажатия */
  .regions-links li{padding:0 10px 4px}
  .regions-links li a{display:inline-block;padding:13px 0}
  .footer-info li a,.duns-ncage a{display:inline-block;padding:12px 0}
  .footer-bottom-item-n1 a{display:inline-block;padding:12px 4px}
}
@media (min-width:768px){
  .mx-bar{display:block;position:fixed;left:24px;bottom:24px;z-index:950;width:auto;background:none;
    opacity:1;transform:translateY(0);transition:opacity .2s ease-out,transform .25s ease-out}
  .mx-bar.is-hidden{opacity:0;transform:translateY(16px);pointer-events:none}
  .mx-bar__row{display:flex;flex-direction:column}
  .mx-bar__cta{display:block;padding:14px 18px 12px;background:var(--mx-blue);color:#fff!important;border-bottom:5px solid var(--mx-blue-edge);
    font-size:15px;box-shadow:0 6px 18px rgba(0,0,0,.35);transition:border-color .2s,background .2s}
  .mx-bar__cta:hover{background:#1f6fff;border-bottom-color:#fff}
  .mx-bar__msg{display:none}
  .mx-bar__stripe{order:-1}
  body.mx-cookie-on .mx-bar{bottom:96px}
}
@media (prefers-reduced-motion:reduce){.mx-bar{transition:none}}
@media print{.mx-bar,#cookie-banner{display:none!important}}

/* 28.09 координатор: на телефоне выключка по ширине даёт дыры между словами */
@media (max-width:767px){
  p,li,.galaxy-message,.galaxy-dscr,.header-dscr,article,.content,.chips-item-dscr{text-align:left!important;hyphens:auto;-webkit-hyphens:auto}
}
