/* Сайт ИИ-архитектора — сценарий на всю страницу (06.10.2026, по образцам 07 и 08, но со своим устройством).
   Главная мысль сайта — разрозненные инструменты становятся одной системой. Поэтому страница после истории
   устроена как схема под напряжением: провод (wire.js) идёт от блока к блоку, блоки включаются, когда до них
   дошла заявка, по включённому проводу бегут огоньки. Сцены разделов:
     «шесть болей»            — заявка бежит по проводу, доходит до обрыва и гаснет              (кадры Blender, фон раздела)
     «до / работа / после»    — три короткие сцены тех же предметов                               (кадры Blender)
     форматы, инструменты, кейсы, витрина — предметы обесточены, пока провод до них не дошёл       (питание от провода)
     «как проверяю»           — у шагов загораются зелёные индикаторы проверки                    (питание от провода)
     форма                    — карточка заявки собирается из того, что человек вводит            (отклик на ввод)
   Кадры листает film.js (.scrub). */

.scrub{position:relative;aspect-ratio:auto;border-radius:0;background:none;overflow:visible}
.scrub>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;display:block}

/* ── Провод: холст поверх страницы, карточка заявки на голове линии ── */
.thread,.lead-wire,.lead-spark{display:none !important}
.wire-line{position:fixed;inset:0;width:100%;height:100%;z-index:6;pointer-events:none}
.wire-tip{position:absolute;left:0;top:0;z-index:7;width:44px;height:31px;margin:-15px 0 0 -22px;border-radius:9px;background:#fff1e2;pointer-events:none;opacity:0;
  will-change:transform,opacity;box-shadow:0 0 0 1px rgba(238,96,24,.5),0 0 22px rgba(238,96,24,.6)}
.wire-tip b{position:absolute;left:9px;height:4px;border-radius:2px;background:#ee6018}
.wire-tip b:first-child{top:9px;width:26px}.wire-tip b:last-child{top:18px;width:18px}
@media (max-width:760px){.wire-tip{width:22px;height:16px;margin:-8px 0 0 -11px;border-radius:5px}
  .wire-tip b{left:4px;height:2px}.wire-tip b:first-child{top:5px;width:14px}.wire-tip b:last-child{top:9px;width:9px}}
@media (prefers-reduced-motion:reduce){.wire-tip{display:none}}

/* ── «Шесть болей»: фон раздела — сцена обрыва ── */
.break-bg .tex.scrub{aspect-ratio:auto;overflow:hidden}
.break-bg .tex.scrub>canvas{object-position:56% 46%;opacity:.95}
@media (max-width:760px){.break-bg .tex.scrub>canvas{object-position:62% 46%}}

/* ── «До / работа / после» ── */
.shot3.scrub{aspect-ratio:4/3;overflow:hidden}
.shot3.scrub img{transform:none !important;transition:none}

/* ── Питание от провода: блок обесточен, пока заявка до него не дошла. Без скрипта всё включено. ── */
.js-wire .plan,.js-wire .tool,.js-wire .product-card,.js-wire .panel,.js-wire .trio{transition:border-color .7s,box-shadow .7s,transform .3s}
.js-wire .plan:not(.lit).powered,.js-wire .tool.powered,.js-wire .product-card.powered{border-color:rgba(238,96,24,.5);box-shadow:0 0 0 1px rgba(238,96,24,.12),0 14px 40px rgba(238,96,24,.08)}
.js-wire .panel.powered{border-color:rgba(238,96,24,.45);box-shadow:0 20px 70px rgba(238,96,24,.1)}
.js-wire .plan .plan-part,.js-wire .product-object img,.js-wire .case-object{transition:filter .9s,opacity .9s,transform .5s}
.js-wire .plan:not(.powered) .plan-part,.js-wire .product-card:not(.powered) .product-object img,.js-wire .case:not(.powered) .case-object{filter:grayscale(1) brightness(.42);opacity:.75}
.js-wire .tool .mono{transition:color .6s}
.js-wire .tool.powered .mono{color:#ffac77}
.js-wire .row .n{transition:color .5s,text-shadow .5s}
.js-wire .row.powered .n{color:#ee6018;text-shadow:0 0 10px rgba(238,96,24,.7)}
.js-wire .case .big{transition:text-shadow .8s}
.js-wire .case.powered .big{text-shadow:0 0 44px rgba(238,96,24,.22)}
/* линия заряда на верхней кромке блока: растёт, пока заявка проходит блок (--pw ставит wire.js) */
.js-wire .tool[data-power],.js-wire .row[data-power],.js-wire .step[data-power],.js-wire .panel[data-power],.js-wire .product-card[data-power]{position:relative}
.js-wire .plan[data-power]::after,.js-wire .tool[data-power]::after,.js-wire .row[data-power]::after,.js-wire .step[data-power]::after,
.js-wire .panel[data-power]::after,.js-wire .product-card[data-power]::after{content:"";position:absolute;left:0;top:0;height:2px;width:calc(var(--pw,0) * 100%);
  background:#ee6018;box-shadow:0 0 10px rgba(238,96,24,.7);pointer-events:none;border-radius:2px}
/* у строк и шагов линия заряда тоньше и тише: их много подряд */
.js-wire .row[data-power]::after,.js-wire .step[data-power]::after{height:1px;box-shadow:none;opacity:.55}
/* индикаторы у шагов: «как проверяю» — зелёный (проверка пройдена), порядок работы — оранжевый (в работе) */
.js-wire .step .n::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:9px;vertical-align:1px;background:#3b3836;transition:background .5s,box-shadow .5s}
.js-wire #method .step.powered .n::before{background:#4fd18b;box-shadow:0 0 10px rgba(79,209,139,.75)}
.js-wire .step.powered .n::before{background:#ee6018;box-shadow:0 0 10px rgba(238,96,24,.75)}
.js-wire .step{transition:opacity .5s}
.js-wire .step:not(.powered){opacity:.55}
@media (prefers-reduced-motion:reduce){.js-wire .plan .plan-part,.js-wire .product-object img,.js-wire .case-object{filter:none !important;opacity:1 !important}.js-wire .step{opacity:1 !important}}

/* ── Форма: карточка заявки собирается из введённого ── */
.ticket{margin:30px 0 0;max-width:380px;border:1px solid rgba(238,238,238,.16);border-radius:10px;background:rgba(21,20,19,.9);font-family:var(--mono);overflow:hidden;
  transition:border-color .6s,box-shadow .6s}
.ticket__bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid rgba(238,238,238,.1);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--mut)}
.ticket__bar i{width:7px;height:7px;border-radius:50%;background:#3b3836;transition:background .5s,box-shadow .5s}
.ticket__row{display:grid;grid-template-columns:74px 1fr;gap:10px;padding:10px 14px;font-size:12.5px;color:var(--mut);border-bottom:1px solid rgba(238,238,238,.06)}
.ticket__row:last-of-type{border-bottom:0}
.ticket__row b{font-weight:400;color:#3f3c39;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .4s}
.ticket__row.is-in b{color:var(--ink)}
.ticket__row.is-in span{color:#ffac77}
.ticket__state{padding:10px 14px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--mut);border-top:1px solid rgba(238,238,238,.1)}
.ticket.is-ready{border-color:rgba(238,96,24,.6);box-shadow:0 0 0 1px rgba(238,96,24,.2),0 14px 50px rgba(238,96,24,.18)}
.ticket.is-ready .ticket__bar i{background:#ee6018;box-shadow:0 0 10px rgba(238,96,24,.8)}
.ticket.is-ready .ticket__state{color:#ffac77}
@media (max-width:979px){.ticket{margin:4px 0 18px;max-width:none}}

/* телефон: блоки нанизаны на провод цепочкой — между карточками оставлены проходы, в них видны звенья провода */
@media (max-width:760px){.plans,.toolgrid{gap:26px}.prods{gap:30px}}

/* предмет на голове линии у края экрана не должен давать странице горизонтальную прокрутку */
.thread-wrap{overflow-x:clip}
