/* ===== V5: «Сенсорный» — крупные плитки, переключатели и −/+, без выпадающих списков ===== */
:root{--bg:#f3f4fa;--surface:#fff;--text:#141a2e;--muted:#5a6278;--border:#dde1ec;--accent:#3346f0;--accent-hover:#2535d6;--accent-soft:#eceefe;--accent-ink:#2131c4;--on-accent:#fff;--radius:18px;--tile-r:14px;--shadow:0 1px 2px rgba(20,26,46,.05),0 8px 24px rgba(20,26,46,.06);--focus-c:#1d2bc2;--font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body{font-family:var(--font);background:var(--bg)}
h1,h2,h3,.section__title,.hero__title,.logo__text{font-family:"Manrope","Inter",system-ui,sans-serif}
:focus-visible{outline:3px solid var(--focus-c);outline-offset:3px}

/* --- Шапка, первый экран, шаги --- */
.header{background:rgba(255,255,255,.9);border-bottom-color:var(--border)}
.logo__mark{background:var(--accent)!important;color:#fff!important;border-radius:12px!important}
.nav__cta{background:var(--accent)!important;color:#fff!important;border-radius:12px!important}
.hero{background:radial-gradient(760px 380px at 90% -10%,#dfe3ff 0,transparent 65%),radial-gradient(600px 320px at -10% 110%,#e3f4ff 0,transparent 60%),var(--bg);padding:3rem 0 2.25rem}
.hero__eyebrow{color:var(--accent-ink);font-weight:700}
.hero__title{font-weight:800;letter-spacing:-.025em;font-size:clamp(2rem,6vw,3.3rem);line-height:1.08}
.btn{border-radius:14px;min-height:52px;font-weight:700}
.btn--primary{background:var(--accent);box-shadow:0 6px 18px rgba(51,70,240,.28)}
.btn--primary:hover{background:var(--accent-hover)}
.btn--ghost{background:#fff;border:1.5px solid var(--border);color:var(--text)}
.hero__chips button{display:inline-block;min-height:44px;line-height:1.2;border-radius:999px;background:#fff;border:1.5px solid var(--border);color:var(--text);font-weight:600;padding:.7rem 1rem}
.hero__chips button:hover{border-color:var(--accent);color:var(--accent-ink)}
.steps__item{border:0;box-shadow:var(--shadow);border-radius:var(--radius)}

/* --- Каталог услуг карточками --- */
.card{border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff}
.card__icon{width:3.1rem;height:3.1rem;border-radius:14px;display:grid;place-items:center;background:var(--accent-soft)}
.card__price{color:var(--accent-ink);font-weight:700}
.card--interactive{transition:transform .18s,box-shadow .18s,border-color .18s}
.card--interactive:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 14px 30px rgba(51,70,240,.14)}
.section--muted{background:#e9ebf6}
@media(max-width:759px){.card__icon{width:2.6rem;height:2.6rem}}

/* --- Форма --- */
.form{border-radius:22px;box-shadow:var(--shadow);border:1px solid var(--border);padding:1.25rem 1rem 1.5rem}
@media(min-width:520px){.form{padding:1.6rem 1.5rem 1.75rem}}
.form__step{font-size:1.15rem;font-weight:800;border-top-color:var(--border)}
.form__step span{display:inline-flex;align-items:center;gap:.5rem}
.field__label,.fieldset>legend{font-weight:700;font-size:.95rem;color:var(--text);margin-bottom:.15rem}
.fieldset>legend{padding:0}
.field input[type="text"],.field input[type="tel"],.field input[type="number"],.field select,.field textarea{min-height:52px;border:1.5px solid var(--border);border-radius:var(--tile-r);padding:.75rem .9rem;background:#fff}
.field textarea{min-height:96px}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(51,70,240,.16)}
.calc{border:0;background:#f7f8fd;border-radius:var(--radius);padding:1rem}
.calc__title{font-size:1.05rem}
.calc__badge{background:#fff;color:var(--accent-ink);border:1px solid #d6daf8}
.calc__panel{gap:1.1rem}
.timing-note{border-radius:var(--tile-r)}

/* Скрытый, но живой нативный select (значения и события — для app.js) */
.tui-on .tui-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0!important;opacity:0;pointer-events:none}

/* --- Плитки вместо выпадающих списков --- */
.tui-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.tui-tiles--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tui-tiles--service .tui-tile:last-child:nth-child(odd){grid-column:1/-1}
/* 19m14f: симметрия при любом числе услуг (3, 4, 5, 6…): 12 колонок, плитка = 4; ровно 4 плитки — по 3 (один ряд); неполный последний ряд по центру */
@media(min-width:700px){
.tui-tiles--service{grid-template-columns:repeat(12,minmax(0,1fr))}
.tui-tiles--service .tui-tile{grid-column:span 4}
.tui-tiles--service .tui-tile:last-child:nth-child(odd){grid-column:span 4}
.tui-tiles--service .tui-tile:last-child:nth-child(3n+1){grid-column:5/9}
.tui-tiles--service .tui-tile:nth-last-child(2):nth-child(3n+1){grid-column:3/7}
.tui-tiles--service .tui-tile:last-child:nth-child(3n+2){grid-column:7/11}
.tui-tiles--service .tui-tile:first-child:nth-last-child(4),.tui-tiles--service .tui-tile:first-child:nth-last-child(4)~.tui-tile{grid-column:auto/span 3}
.tui-tiles--service .tui-tile:first-child:nth-last-child(2),.tui-tiles--service .tui-tile:first-child:nth-last-child(2)~.tui-tile{grid-column:auto/span 6}
.tui-tiles--service .tui-tile:first-child:nth-last-child(1){grid-column:1/-1}
}
.tui-tiles--4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:560px){.tui-tiles--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tui-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:.55rem;min-height:96px;margin:0;padding:.85rem .85rem .8rem;border:1.5px solid var(--border);border-radius:var(--tile-r);background:#fff;color:var(--text);font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background .15s,border-color .15s,box-shadow .15s,transform .1s}
.tui-tiles--3 .tui-tile,.tui-tiles--4 .tui-tile{align-items:center;text-align:center;min-height:88px;padding:.75rem .5rem}
.tui-tile:hover{border-color:#b9c0f7}
.tui-tile:active{transform:scale(.98)}
.tui-tile:focus-visible{outline:3px solid var(--focus-c);outline-offset:3px}
.tui-tile__icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--accent-soft);color:var(--accent)}
.tui-tile__icon .tui-ico{width:24px;height:24px}
.tui-tile__text{display:grid;gap:.1rem;min-width:0}
.tui-tile__label{font-weight:700;font-size:.95rem;line-height:1.25}
.tui-tile__sub{font-size:.8rem;color:var(--muted);line-height:1.25}
.tui-tile__hint{display:block;margin-top:.15rem;font-size:.74rem;color:var(--muted);line-height:1.25;overflow-wrap:anywhere}
.svc-guide--tiled{display:none}
.tui-tile__check{position:absolute;top:.55rem;right:.55rem;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--border);background:#fff}
.tui-tiles--3 .tui-tile__check,.tui-tiles--4 .tui-tile__check{display:none}
.tui-tile[aria-checked="true"]{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 8px 20px rgba(51,70,240,.28)}
.tui-tile[aria-checked="true"] .tui-tile__icon{background:rgba(255,255,255,.18);color:#fff}
.tui-tile[aria-checked="true"] .tui-tile__sub,.tui-tile[aria-checked="true"] .tui-tile__hint{color:rgba(255,255,255,.85)}
.tui-tile[aria-checked="true"] .tui-tile__check{border-color:#fff;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233346f0' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
@media(min-width:520px){.tui-tiles--service .tui-tile{min-height:112px}}

/* --- Радио-группы: сегментированные кнопки (работают и без JS) --- */
.form .radios{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,120px),1fr));gap:.6rem}
.form .radios--stack{grid-template-columns:1fr}
.form .radio{position:relative;display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:52px;padding:.6rem .8rem;border:1.5px solid var(--border);border-radius:var(--tile-r);background:#fff;font-weight:600;text-align:center;line-height:1.25;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background .15s,border-color .15s,box-shadow .15s}
.form .radio:hover{border-color:#b9c0f7}
.form .radio>input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.form .radio:has(>input:checked){background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 6px 16px rgba(51,70,240,.25)}
.form .radio:has(>input:checked) .check__price{color:rgba(255,255,255,.85)}
.form .radio:has(>input:focus-visible){outline:3px solid var(--focus-c);outline-offset:3px}
.form .radio .tui-ico{flex:none;width:22px;height:22px;color:var(--accent)}
.form .radio:has(>input:checked) .tui-ico{color:#fff}
.form .radios--stack .radio{justify-content:flex-start;text-align:left;padding:.8rem .95rem;min-height:56px}
.form .radios--stack .radio:has(>input:checked){background:var(--accent-soft);color:var(--text);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.form .radios--stack .radio:has(>input:checked) .check__price{color:var(--muted)}
.form .radios--stack .radio:has(>input:checked) .tui-ico{color:var(--accent)}
.form .radios--stack .radio::after{content:"";flex:none;order:3;margin-left:auto;width:22px;height:22px;border-radius:50%;border:1.5px solid #c3c9da;background:#fff}
.form .radios--stack .radio:has(>input:checked)::after{border:7px solid var(--accent)}
/* Три способа связи — в одну строку, иконка над подписью */
.form .radios:has(>.radio:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.form .radios:not(.radios--stack) .radio--ico{flex-direction:column;gap:.3rem;min-height:72px;font-size:.9rem}

/* --- Чекбоксы-опции: карточки с переключателем --- */
.form .checks{display:grid;gap:.6rem}
.form .check:not(.check--consent){display:flex;align-items:center;gap:.8rem;min-height:56px;padding:.7rem .9rem;border:1.5px solid var(--border);border-radius:var(--tile-r);background:#fff;font-weight:600;line-height:1.3;-webkit-tap-highlight-color:transparent;transition:background .15s,border-color .15s}
.form .check:not(.check--consent)>span{flex:1;min-width:0}
.form .check:not(.check--consent) .check__price{display:block;font-weight:500;font-size:.85rem;margin-top:.1rem}
.form .check:not(.check--consent)>input[type=checkbox]{order:2;flex:none;appearance:none;-webkit-appearance:none;position:relative;width:50px;height:30px;margin:0;border-radius:999px;background:#cfd4e2;cursor:pointer;transition:background .18s}
.form .check:not(.check--consent)>input[type=checkbox]::before{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s}
.form .check:not(.check--consent)>input[type=checkbox]:checked{background:var(--accent)}
.form .check:not(.check--consent)>input[type=checkbox]:checked::before{transform:translateX(20px)}
.form .check:not(.check--consent)>input[type=checkbox]:focus-visible{outline:3px solid var(--focus-c);outline-offset:3px}
.form .check:not(.check--consent):has(>input:checked){border-color:var(--accent);background:var(--accent-soft)}
.check--consent{border-radius:var(--tile-r);padding:.9rem 1rem}
.check--consent input,.lowq__label input{width:24px!important;height:24px!important;accent-color:var(--accent)}
.lowq{border-radius:var(--tile-r)}

/* --- Степперы −/+ --- */
.field--stepper{gap:.45rem}
.tui-stepper{display:grid;grid-template-columns:56px minmax(64px,1fr) 56px;align-items:stretch;width:min(100%,240px);height:56px;border:1.5px solid var(--border);border-radius:var(--tile-r);background:#fff;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.tui-stepper:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(51,70,240,.16)}
.tui-stepper__btn,.kit-stepper__btn{display:grid;place-items:center;min-width:44px;min-height:44px;margin:0;padding:0;border:0;background:var(--accent-soft);color:var(--accent);font:inherit;font-size:1.5rem;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:background .12s,color .12s}
.tui-stepper__btn:hover,.kit-stepper__btn:hover{background:#dde1fd}
.tui-stepper__btn:active,.kit-stepper__btn:active{background:var(--accent);color:#fff}
.tui-stepper__btn:focus-visible,.kit-stepper__btn:focus-visible{outline:0;box-shadow:inset 0 0 0 3px var(--accent)}
.tui-stepper__btn:disabled{background:#f3f4f8;color:#b4bacb;cursor:default}
.field .tui-stepper input[type="number"],.kit-stepper input[type="number"]{width:100%;height:100%;min-height:0;margin:0;padding:0 .25rem;border:0!important;border-radius:0;background:transparent;box-shadow:none!important;text-align:center;font-size:1.2rem!important;font-weight:800;font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield}
.tui-stepper input::-webkit-outer-spin-button,.tui-stepper input::-webkit-inner-spin-button,.kit-stepper input::-webkit-outer-spin-button,.kit-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.kit-stepper__controls{display:grid;grid-template-columns:56px minmax(64px,1fr) 56px;gap:0;width:min(100%,240px);height:56px;border:1.5px solid var(--border);border-radius:var(--tile-r);background:#fff;overflow:hidden}
.kit-stepper__controls:focus-within{border-color:var(--accent)}
.kit-stepper__btn{width:auto;height:auto;border-radius:0}
.kit-stepper input{border:0;font:inherit}
.form__row{gap:1rem}

/* --- Пакеты и комплекты фото на документы (рисует app.js) --- */
.kit-formats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
@media(min-width:700px){.kit-formats{grid-template-columns:repeat(3,minmax(0,1fr))}}
.kit-chip,.kit-chip__body{height:100%}
.kit-chip__body,.kit-layout__card,.pkg-card__body{border:1.5px solid var(--border);border-radius:var(--tile-r);min-height:52px;transition:border-color .15s,box-shadow .15s,background .15s}
.kit-chip__body{padding:.7rem .9rem;align-content:start;justify-items:start}
.kit-chip:has(input:checked) .kit-chip__body,.kit-layout:has(input:checked) .kit-layout__card,.pkg-card:has(input:checked) .pkg-card__body{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
.kit-chip:has(input:focus-visible) .kit-chip__body,.kit-layout:has(input:focus-visible) .kit-layout__card,.pkg-card:has(input:focus-visible) .pkg-card__body{outline:3px solid var(--focus-c);outline-offset:3px}
.pkg-card__body{padding:.85rem .95rem}
.pkg-card__price,.kit-layout__price{color:var(--accent-ink)}
.kit-sheet{background:#e7e9f6}.kit-sheet__cell{background:#b3bbe9}
.kit-layout:has(input:checked) .kit-sheet__cell{background:var(--accent)}

/* --- Загрузка файлов --- */
.uploader__drop{min-height:150px;gap:.4rem;border:2px dashed #b9c0f7!important;border-radius:var(--radius)!important;background:#f6f7ff!important;transition:background .15s,border-color .15s}
.uploader__drop::before{content:"";width:52px;height:52px;border-radius:16px;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 16v2.5A1.5 1.5 0 0 0 5.5 20h13a1.5 1.5 0 0 0 1.5-1.5V16'/%3E%3C/svg%3E") center/26px no-repeat;box-shadow:0 6px 16px rgba(51,70,240,.3)}
.uploader__drop:hover{background:#eef0ff!important;border-color:var(--accent)!important}
.uploader input[type=file]:focus-visible+.uploader__drop{outline:3px solid var(--focus-c);outline-offset:3px}
.uploader__drop strong{font-size:1.05rem}
.upload-progress__bar{background:var(--accent)}
.tg-bulk{border-radius:var(--tile-r)}
.tg-bulk__btn{border-radius:12px;min-height:48px}

/* --- Итог --- */
.total{background:#fff;border:1.5px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow:var(--shadow)}
.total__title{font-size:1.05rem;font-weight:800}
.total__lines{padding-left:0;list-style:none;display:grid;gap:.35rem;font-size:.92rem}
.total__lines li{padding-left:1rem;position:relative}
.total__lines li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.total__lines li.muted::before{background:#c3c9da}
.total__sum{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.35rem .75rem;padding-top:.7rem;border-top:1px dashed var(--border);font-weight:600}
.total__sum strong{font-size:1.6rem;font-weight:800;color:var(--accent-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.tui-total-btn{display:none;margin-top:.9rem}
#btn-submit{border-radius:16px;min-height:58px;font-size:1.08rem}

/* --- Липкая нижняя панель (телефон/планшет) --- */
.tui-bar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;align-items:center;gap:.75rem;padding:.7rem max(1rem,env(safe-area-inset-left)) calc(.7rem + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.97);border-top:1px solid var(--border);box-shadow:0 -10px 30px rgba(20,26,46,.1);transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
.tui-bar.is-on{transform:none;visibility:visible;transition:transform .25s ease}
@supports (backdrop-filter:blur(8px)){.tui-bar{background:rgba(255,255,255,.88);backdrop-filter:blur(12px)}}
.tui-bar__info{display:grid;min-width:0;line-height:1.2}
.tui-bar__caption{font-size:.72rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.tui-bar__sum{font-family:"Manrope","Inter",sans-serif;font-size:1.45rem;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.tui-bar.is-bump .tui-bar__sum{animation:tui-bump .35s ease}
.tui-bar__what{font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tui-bar__btn{flex:none;margin-left:auto;min-height:52px;padding:0 1.3rem;border:0;border-radius:14px;background:var(--accent);color:#fff;font:inherit;font-weight:700;font-size:1rem;cursor:pointer;box-shadow:0 6px 18px rgba(51,70,240,.3);touch-action:manipulation}
.tui-bar__btn:hover{background:var(--accent-hover)}
.tui-bar__btn:focus-visible{outline:3px solid var(--focus-c);outline-offset:3px}
.tui-bar__btn:disabled{opacity:.6;cursor:progress}
@keyframes tui-bump{0%{transform:scale(1)}40%{transform:scale(1.08);color:var(--accent)}100%{transform:scale(1)}}
body.tui-bar-visible .mobile-cta{opacity:0;pointer-events:none;transform:translateY(120%)}
body.tui-bar-visible .sticky-contacts{bottom:calc(var(--tui-bar-h,76px) + .75rem);transition:bottom .25s}
body.has-cookie-bar .tui-bar{bottom:var(--cookie-bar-h,0px)}
body.tui-bar-visible.has-cookie-bar .sticky-contacts{bottom:calc(var(--cookie-bar-h,0px) + var(--tui-bar-h,76px) + .75rem)}
body.tui-bar-visible .footer{padding-bottom:calc(var(--tui-bar-h,76px) + 1rem)}

/* --- Десктоп: форма слева, итог липкой колонкой справа --- */
/* 19m3: форма touch — на всю ширину контейнера (в app.css #order .form = 640 px; с 19l это сжимало 2 колонки) */
#order .form.tui-on{max-width:none}
@media(min-width:1024px){
 #order .section__title,#order .section__subtitle{max-width:none}
 .form.tui-on{grid-template-columns:minmax(0,1fr) 340px;column-gap:2rem;row-gap:0;align-items:start;padding:2rem}
 .form.tui-on>*{grid-column:1;margin-top:1.1rem}
 .form.tui-on>.form__step:first-of-type{margin-top:0}
 .form.tui-on>#total-box{grid-column:2;grid-row:1/span 60;position:sticky;top:calc(var(--header-h,64px) + 1.25rem);margin-top:0;align-self:start}
 .form.tui-on .tui-total-btn{display:flex}
 .tui-bar{display:none}
 body.tui-bar-visible .sticky-contacts{bottom:.85rem}
 .tui-tiles--3 .tui-tile{min-height:96px}
}
@media(min-width:760px) and (max-width:1023px){.tui-bar{left:50%;right:auto;width:min(720px,calc(100% - 2rem));transform:translate(-50%,130%);bottom:1rem;border:1px solid var(--border);border-radius:20px}.tui-bar.is-on{transform:translate(-50%,0)}body.has-cookie-bar .tui-bar{bottom:calc(var(--cookie-bar-h,0px) + 1rem)}}
@media(max-width:389px){.tui-bar{gap:.5rem}.tui-bar__caption{font-size:.64rem;letter-spacing:.02em;white-space:nowrap}.tui-bar__btn{padding:0 1rem}.logo__text{font-size:.95rem}}
@media(max-width:359px){.tui-tiles--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.tui-tile,.tui-bar,.form .radio,.form .check,.card--interactive{transition:none!important}.tui-bar.is-bump .tui-bar__sum{animation:none}}