/*
    ВСЁ содержимое файла действует только на компьютере.

    Перестройка калькулятора запускается при ширине больше 1024px
    (проверка внутри calc-view.js). Стили обязаны совпадать с этим
    условием: 10.08.2026 они применялись и на телефоне, из-за чего
    мобильные блоки раскладывались в две колонки и слайдер примеров
    выходил вдвое уже нужного.
*/
@media (min-width: 1025px) {

  /* ── колонки: фото уже, настройки шире ── */
  /*
     Колонка под фото по ширине самой картинки, без запаса.
     Раньше колонка была 470px, картинка ~440 — разница уходила
     в пустоту между фото и шагами, плюс свои отступы правой колонки.
  */
  .make__row{grid-template-columns:auto 1fr!important;gap:24px!important;
    height:auto!important;min-height:0!important;align-items:start!important}
  .make__image{width:440px!important;max-width:440px!important;padding:0!important;margin:0!important}
  .make__setting,.content__settings{padding-left:0!important;margin-left:0!important}
  /*
     Контейнеру примеров НЕ ставим ни max-width, ни overflow:hidden.
     Слайдер «до/после» — это slick-карусель: она считает ширину слоёв
     при запуске. Обрезка контейнером уводила слои за левый край
     (замер: ширина 304, левый край −151) и ползунок переставал работать.
     Ширину задаёт только колонка сетки, а карусели после перестройки
     даём команду пересчитаться — jQuery('.slick-slider').slick('setPosition').
  */
  .make__wrapper{padding-bottom:0!important}

  /* ── гармошка ── */
  .acc{display:flex;flex-direction:column;gap:12px}
  .acc__item{background:#fff;border:1px solid #E8EBF0;border-radius:14px;overflow:hidden}
  .acc__head{display:flex;align-items:center;gap:10px;padding:16px 20px;cursor:pointer;user-select:none}
  #make .acc__num{display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 20px;width:20px;height:20px;border-radius:50%;color:#fff;
    background:linear-gradient(135deg,#ff9a22,#ff7900);font:600 12px/1 Montserrat,Arial,sans-serif}
  .acc__title{font:500 19px/1.25 Montserrat,Arial,sans-serif;color:#333;flex:1 1 auto}
  /* Иконки в CSS сохраняются при обновлении .acc__val.textContent. */
  #make .acc__val{position:relative;flex:0 0 166px;min-width:0;padding-left:30px;
    font:700 16px/1.2 Montserrat,Arial,sans-serif;color:#000;margin-right:6px;text-align:left}
  #make .acc__val::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
    width:20px;height:20px;background:center/contain no-repeat}
  #make .acc__item:nth-child(2) .acc__val::after{content:" см."}
  #make .acc__item:nth-child(1) .acc__val::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff8500%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203a9%209%200%201%200%200%2018h1a2%202%200%200%200%201.4-3.4%201.5%201.5%200%200%201%201.1-2.6H17a4%204%200%200%200%204-4c0-4.4-4-8-9-8Z%22%2F%3E%3Ccircle%20cx%3D%227.5%22%20cy%3D%2211%22%20r%3D%22.7%22%2F%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%227.5%22%20r%3D%22.7%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%227.5%22%20r%3D%22.7%22%2F%3E%3Ccircle%20cx%3D%2217.5%22%20cy%3D%2211%22%20r%3D%22.7%22%2F%3E%3C%2Fsvg%3E")}
  #make .acc__item:nth-child(2) .acc__val::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff8500%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%203H3v6m12-6h6v6M3%2015v6h6m12-6v6h-6M3%209l6-6m6%2018%206-6%22%2F%3E%3C%2Fsvg%3E")}
  #make .acc__item:nth-child(3) .acc__val::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff8500%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%226.5%22%20y%3D%226.5%22%20width%3D%2211%22%20height%3D%2211%22%20rx%3D%22.5%22%2F%3E%3C%2Fsvg%3E")}
  #make .acc__item:nth-child(4) .acc__val::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ff8500%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%203%208%203v6c0%204.5-3.2%207.7-8%209-4.8-1.3-8-4.5-8-9V6Z%22%2F%3E%3Cpath%20d%3D%22m8.5%2012%202.5%202.5%204.5-5%22%2F%3E%3C%2Fsvg%3E")}
  #make .acc__chev{stroke:#ff8500;flex:0 0 auto;transition:transform .2s}
  .acc__item.open .acc__chev{transform:rotate(180deg)}
  .acc__item.open .acc__val{display:none}
  .acc__body{display:none;padding:0 20px 20px}
  .acc__item.open .acc__body{display:block}
  .acc__body .calc__steps-title{display:none!important}
  .acc__body .options,.acc__body .select-style,.acc__body .select-size{max-width:100%!important;overflow:hidden}
  /* переключатель внутри шага прижат к верху, без лишних отступов */
  .acc__body .options__baggets,.acc__body .options__cover{margin:0!important}
  .acc__body .checkbox-label{margin:0 0 4px!important}

  /*
     Покрытие: два переключателя вместо одного «Добавить покрытие» и вкладок.
     Родной заголовок и кнопки-вкладки скрыты, но остаются в разметке —
     на них завязан расчёт цены.
  */
  /* два переключателя стоят В РЯД, а не столбиком */
  .covrows{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px 30px;align-items:center}
  .covrow{display:flex;align-items:center;gap:12px;cursor:pointer;flex:0 0 auto}
  .covrow__t{font:15px Montserrat,Arial,sans-serif;color:#333}
  .covrow.on .covrow__t{color:#F0913A;font-weight:600}
  .covpick-on>.options-title{display:none!important}
  .covpick-on .cover-list .cs_btn,.covpick-on .cover__reset{display:none!important}
  /* описание и фото выбранного покрытия показываем, только когда что-то выбрано */
  .covpick-on .cover-list{display:none!important;margin-top:14px}
  .covpick-on.has-choice .cover-list{display:block!important}
  .acc__body .slick-list,.acc__body [class*="bagget"]{max-width:100%!important}

  /* ── цена: образец владельца от 11.09.2026 ── */
  /* Перед строкой цены такой же зазор, как перед формой: 6px. */
  #make .rightcol > .content__settings{row-gap:6px}
  .pricerow{display:flex;gap:20px;align-items:flex-start;margin-top:0}
  .priceside{flex:1 1 auto;min-width:237px;display:flex;flex-direction:column;
    align-self:stretch;justify-content:flex-start;gap:6px;padding:0 0 14px}
  #make .priceside .make__new-price{font-size:48px!important;line-height:1.05!important;
    font-weight:800!important;color:#fd6412!important}
  #make .priceside .make__old-price{font-size:24px!important;line-height:1.1!important;
    color:#8e939b!important;text-decoration-thickness:2px!important}
  #make .priceside .make-button{margin:0!important;padding:0!important;border:0!important;width:100%}
  #make .priceside .result-price{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:8px 0 0!important}
  #make .priceside .make__new-price,#make .priceside .make__old-price{
    white-space:normal!important;display:block;margin:0!important;max-width:100%}
  #newPriceMake,#oldPriceMake{white-space:nowrap}
  .make-button.priceonly>div{display:none!important}
  #make .calc-price-label{position:relative;display:inline-block;margin:0 0 6px;
    padding:5px 8px;border-radius:5px;background:#ff921f;color:#fff;
    font:700 12px/1.2 Montserrat,Arial,sans-serif}
  #make .calc-price-label::after{content:"";position:absolute;left:21px;bottom:-5px;
    border:5px solid transparent;border-top-color:#ff921f;border-bottom:0}
  #make .priceside .perks{display:flex;flex-direction:row;flex-wrap:wrap;
    justify-content:space-between;gap:8px 16px}
  #make .priceside .perks span{display:flex;align-items:center;gap:7px;
    font:500 12px/1.3 Montserrat,Arial,sans-serif;color:#444;white-space:nowrap}
  #make .priceside .perks svg{flex:0 0 16px;width:16px;height:16px;padding:3px;
    border-radius:50%;background:#38b85b;stroke:#fff}
  @media (max-width:1199px){
    #make .priceside .perks{gap:8px}
    #make .priceside .perks span{font-size:11px}
  }
  @media (max-width:1279px){
    #make .priceside .make__new-price{font-size:38px!important}
  }


  /* ── что входит ── */
  .incbox{flex:0 0 260px;background:#fff;border:1px solid #E8EBF0;border-radius:14px;
    padding:14px 18px;font-family:Montserrat,Arial,sans-serif}
  .incbox__t{font:600 15px/1.3 Montserrat,Arial,sans-serif;margin:0 0 12px;color:#222;text-align:left}
  .incbox ol{display:block!important;list-style:none!important;margin:0!important;padding:0!important}
  .incbox li{display:flex!important;align-items:center;gap:11px;width:100%!important;float:none!important;
    padding:4px 0!important;margin:0!important;font:14px/1.35 Montserrat,Arial,sans-serif!important;
    color:#444;text-align:left!important;white-space:normal}
  .incbox li::marker,.incbox li::before{content:none!important}
  #make .incbox li > svg{flex:0 0 17px;width:17px;height:17px;padding:3px;
    border-radius:50%;background:#38b85b;stroke:#fff}
  .incbox li.extra span{color:#F0913A;font-weight:600}

  /* ── шаг 4 ── */
  /* блок 4 — во всю ширину, под обеими колонками: в колонке 630 три столбца
     не помещались и кнопка падала вниз отдельной строкой */
  /* компактная карточка в правой колонке — три столбца в ряд */
  .step4band{width:100%;margin:6px 0 0!important;background:#fff;border:1px solid #E8EBF0;
    border-radius:14px;padding:16px 18px 16px;font-family:Montserrat,Arial,sans-serif}
  .step4band .s4head{display:flex;align-items:center;gap:9px;margin:0 0 14px}
  .step4band .s4num{color:#F0913A;font:600 17px/1 Montserrat,Arial,sans-serif}
  .step4band .s4t{font:500 17px/1.25 Montserrat,Arial,sans-serif;color:#333}
  .step4band .cols{display:flex;gap:14px;align-items:flex-start;flex-wrap:nowrap}
  .step4band .col{flex:1 1 0;min-width:0}
  .step4band .col#c1{flex:1 1 200px}
  .step4band .col#c2{flex:1 1 200px}
  .step4band .col#c3{flex:1 1 190px;padding-top:22px}
  /* выбор канала под телефоном */
  .s4label--tight{margin:12px 0 7px!important}
  .waypick{display:flex;gap:7px;flex-wrap:wrap}
  .waybtn{flex:1 1 auto;border:1px solid #dcdcdc;background:#fff;border-radius:20px;padding:8px 12px;
    font:13px Montserrat,Arial,sans-serif;color:#333;cursor:pointer;transition:.15s}
  .waybtn:hover{border-color:#F0913A}
  .waybtn.active{background:#F0913A;border-color:#F0913A;color:#fff;font-weight:600}
  /* поле пожелания под загрузкой видно сразу */
  .step4band .col#c1 .makePortret__textarea{margin-top:10px!important}
  .s4label{font:13px Montserrat,Arial,sans-serif;color:#555;margin:0 0 7px}
  .s4note{font:13px/1.3 Montserrat,Arial,sans-serif;color:#8a8a8a;margin:8px 0 0}
  .step4band .downFileMake{display:block!important;border:1.5px dashed #D9DEE8!important;border-radius:12px;
    padding:20px!important;background:#FAFBFD;cursor:pointer;text-align:center;margin:0!important;
    font:14px Montserrat,Arial,sans-serif;color:#555}
  .step4band input.phone__mask{width:100%!important;border:1px solid #DDE1E8!important;border-radius:10px!important;
    padding:14px 16px!important;font:16px Montserrat,Arial,sans-serif!important;margin:0!important}
  .wishlink{display:inline-block;margin-top:12px;color:#F0913A;font:14px Montserrat,Arial,sans-serif;cursor:pointer}
  .step4band .makePortret__textarea{display:none!important;margin:10px 0 0!important;width:100%}
  .step4band .makePortret__textarea.show{display:block!important}
  .step4band .makePortret__textarea textarea{width:100%!important;min-height:80px;border:1px solid #DDE1E8!important;
    border-radius:10px!important;padding:12px 14px!important;font:15px Montserrat,Arial,sans-serif!important;resize:vertical}
  .step4band button.cs_button_all{width:100%!important;margin:0!important}
  /* гарантии в две колонки, как в макете, а не столбиком */
  .guar{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px}
  .guar span{font:13px Montserrat,Arial,sans-serif;color:#4a4a4a;display:flex;gap:7px;align-items:center;flex:1 1 140px}
  /* согласие — одной строкой внизу карточки, во всю ширину */
  .step4band .politConfid-check{margin:16px 0 0!important;font-size:12px!important;
    display:flex!important;align-items:flex-start;gap:8px}


  /* ── форма одной колонкой ── */
  .step4col .s5top{display:flex;align-items:center;gap:8px;justify-content:center;
    font:600 14px/1.35 Montserrat,Arial,sans-serif;color:#333;margin:0 0 12px}
  .step4col .s5top svg,.step4col .s5micro svg,.step4col .s5foot svg{flex:0 0 17px}
  .step4col .downFileMake{border:1.5px dashed #F0B36A!important;background:#FFF9F2!important;
    padding:16px!important;border-radius:12px!important;text-align:center;font:14px Montserrat,Arial,sans-serif;color:#555;
    display:flex!important;align-items:center;justify-content:center;gap:12px}
  .step4col .downFileMake .upico{flex:0 0 34px}
  .step4col .makePortret__textarea textarea{min-height:44px!important;padding:11px 14px!important}
  .step4col input.phone__mask{padding:11px 14px!important;font:15px Montserrat,Arial,sans-serif!important}
  .step4col .waypick{display:flex;gap:8px;flex-wrap:wrap}
  .step4col .waybtn{flex:1 1 110px;display:flex;align-items:center;justify-content:center;gap:8px;
    border:1px solid #E3E7EE;background:#fff;border-radius:10px;padding:10px 10px;
    font:14px Montserrat,Arial,sans-serif;color:#333;cursor:pointer;transition:.15s}
  .step4col .waybtn:hover{border-color:#F0913A}
  .step4col .waybtn.active{border-color:#F0913A;box-shadow:inset 0 0 0 1px #F0913A;font-weight:600}
  .step4col .s5micro{display:flex;align-items:center;justify-content:center;gap:8px;
    font:13px Montserrat,Arial,sans-serif;color:#8a8a8a;margin:12px 0}
  .step4col button.cs_button_all{width:100%!important;border-radius:10px!important;padding:15px!important;
    font:700 17px Montserrat,Arial,sans-serif!important}
  .step4col .politConfid-check{margin:12px 0 0!important;font-size:12px!important;display:flex!important;
    align-items:flex-start;gap:8px}
  .step4col .s5foot{display:flex;align-items:center;justify-content:center;gap:8px;
    font:12px Montserrat,Arial,sans-serif;color:#9aa3b0;margin-top:10px}


  /* телефон и кнопки каналов — в одну строку */
  .step4col .phonerow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
  .step4col .phonerow>#c2{flex:0 0 190px}
  .step4col .phonerow .waypick{flex:1 1 auto;gap:7px}
  .step4col .phonerow .waybtn{flex:1 1 90px;padding:9px 8px;font-size:13px;gap:6px}
  .step4col .phonerow .waybtn svg{width:17px;height:17px}
  /* комментарий свёрнут, открывается по ссылке */
  .step4col #wishtoggle{display:inline-block;margin:10px 0 0}
  .step4col .makePortret__textarea{display:none!important}
  .step4col .makePortret__textarea.show{display:block!important;margin-top:8px!important}

  /* ── полоса доводов: левая колонка, сразу под примерами работ ── */
  /*
      Фото и полоса лежат в общей обёртке .leftcol и вместе занимают
      одну ячейку сетки. Если положить полосу третьим элементом
      .make__row, автораскладка уводит настройки во второй ряд и вся
      правая колонка уезжает под фотографию. Разводить их по рядам
      вручную тоже нельзя: настройки выше левой колонки, ряд под фото
      растягивается, и полоса отрывается от снимка.

      Сайт обращается к .make__image через пробел (.make__content
      .make__image, .make__row .make__image), а не через «>»,
      поэтому лишний контейнер ничего не ломает — проверено по
      таблицам стилей страницы.
  */
  .leftcol{width:440px;max-width:100%;display:block;min-width:0}
  .trustrow{width:100%;max-width:100%;display:flex;flex-wrap:nowrap;
    margin:14px 0 0;background:#fff;border:1px solid #E8EBF0;border-radius:14px;overflow:hidden}
  /*
      Колонка узкая, поэтому значок сверху, текст под ним — иначе на
      строку остаётся меньше ста пикселей и фраза рассыпается по слогам.
  */
  /*
      Боковой отступ 8px, а не 12. Замер на боевом: ячейка 146px, при
      отступе 12 на текст оставалось 122px, а фразе «Макет от дизайнера»
      нужно 126 — не хватало четырёх пикселей, и она рвалась на три строки.
      С отступом 8 остаётся 130px, и все три подписи встают ровно в две.
      Шрифт при этом уменьшать не пришлось.
  */
  .trustrow div{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px;
    align-items:flex-start;font:12px/1.35 Montserrat,Arial,sans-serif;color:#333;
    padding:14px 8px;border-right:1px solid #EEF1F5}
  .trustrow div:last-child{border-right:0}
  .trustrow .tico{flex:0 0 26px;width:26px;height:26px}

  @media(max-width:900px){
    .pricerow{flex-direction:column}
    .incbox{flex:1 1 auto;width:100%}
    /* на телефоне слайдер свой (.make__image-mobil), обёртка пустеет —
       отправляем её в конец, чтобы доводы шли после настроек */
    .leftcol{width:100%;order:9}
    .trustrow{width:100%;flex-wrap:wrap;margin-top:12px}
    /* по одному пункту в строку: втроём на телефоне выходит по 110px,
       значок с текстом в такую ячейку не помещаются */
    .trustrow div{flex:1 1 100%;flex-direction:row;align-items:center;gap:11px;font-size:13px;
      padding:13px 14px;border-right:0;border-bottom:1px solid #EEF1F5}
    .trustrow div:last-child{border-bottom:0}
  }

  /* ── подтверждение после отправки ── */
  /*
      Блок «Спасибо» перенесён из удалённого модального окна.
      Скрыт, пока calc.js не поставит ему класс active.
      Форма прячется в тот же момент — иначе человек видит обе сразу
      и не понимает, ушла заявка или нет.
  */
  .step4band .calcThanks{display:none;text-align:center;padding:26px 20px}
  .step4band .calcThanks.active{display:block}
  .step4band .calcThanks h3{font:700 20px/1.3 Montserrat,Arial,sans-serif;color:#333;margin:0 0 10px}
  .step4band .calcThanks .h3{display:block;font:600 17px/1.35 Montserrat,Arial,sans-serif;color:#333;margin:0 0 6px}
  .step4band .calcThanks .h4{display:block;font:500 15px/1.4 Montserrat,Arial,sans-serif;color:#6b7280}
  /*
      Пока показано спасибо — прячем в блоке всё, кроме него самого.
      Перечислять внутренние классы нельзя: разметка формы собирается
      скриптом и её состав меняется. Правило по «всем детям кроме»
      переживёт любую перестановку.
  */
  .step4band.calcFormBox:not(.active) > *:not(.calcThanks){display:none!important}

  /* ── пока идёт перестройка, блок скрыт ── */
  /*
      Класс висит на <html> и снимается скриптом сразу после перестройки
      либо через 3 секунды страховкой. Прячем именно visibility —
      место под блок остаётся занятым, страница не прыгает.

      Правило работает только вместе со скриптом: класс ставит он сам.
      Если скрипт не загрузился, класса нет и калькулятор виден как обычно.
  */
  .calc-rebuilding #make .make__row{visibility:hidden}

}

/*
    Картинки покрытия — вернуть пропорции и ужать. Добавлено 12.08.2026.

    В разметке у них стоят width="600" height="600", а в стилях размеров
    нет — поэтому атрибуты применялись как жёсткие, и фото 300x199
    растягивалось до 548x600. Пропорции ломались: снимок 3:2 показывался
    почти квадратом, отсюда и «огромное», и мыльное.

    Замер на боевом до и после: блок 737 -> 336 px, картинка 548x600 -> 300x199.

    Предел 300 px — это родной размер файла, а не на глаз: при нём увеличение
    исходника всего 1.2x и фактура холста остаётся читаемой. Дальше
    картинка мылится — исходные файлы всего 300x199, крупнее их нет.
    Появятся крупнее — поднять это число, больше ничего менять не нужно.
*/
.acc__body .box__cover-img img,
.cover-list .box__cover-img img,
.box__cover-img img {
    width: 100%;
    max-width: 300px;
    height: auto;
    display: block;
    border-radius: 10px;
}

/* 11.09.2026: карточки под фото по образцу владельца, только десктоп.
   На <=1024px .leftcol остаётся скрытой существующим calc-new.css. */
@media (min-width: 1025px) {
    #make .calc-benefits {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        width: 100%;
        margin-top: 16px;
    }

    #make .calc-benefits__card {
        min-width: 0;
        padding: 12px 10px;
        border-radius: 16px;
        background: #fff;
        box-shadow: 0 8px 24px rgba(61, 59, 55, 0.04);
    }

    #make .calc-benefits__icon {
        display: block;
        width: 32px;
        height: 32px;
        margin-bottom: 8px;
        color: #ffa133;
    }

    #make .calc-benefits__title {
        margin: 0 0 6px;
        color: #1c1a17;
        font: 700 14px/1.3 Montserrat, Arial, sans-serif;
    }

    #make .calc-benefits__text {
        margin: 0;
        color: #666;
        font: 400 13px/1.5 Montserrat, Arial, sans-serif;
    }
}

/* 22.09.2026: подписи над шагами — «Соберите портрет за 4 шага» и
   «Сейчас выбрано» (pages/sections/calc.php, перед .acc).
   Правило вне @media: на телефоне гармошки с колонкой значений нет,
   подписи там не нужны. Отступы сняты с живого сайта при 1440px:
   номер шага в 21px от левого края блока, колонка значений
   шириной 166px и в 56px от правого. */
.acc-caps{display:none}
@media (min-width: 1025px) {
    #make .acc-caps {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 12px;
        padding: 0 56px 8px 21px;
        color: #858585;
        font: 500 14px/1.3 Montserrat, Arial, sans-serif;
    }

    #make .acc-caps__right {
        flex: 0 0 166px;
    }
}