/* Общий язык движения. Геометрия контента не зависит от инициализации JS. */
:root {
  --duration-fast:160ms;
  --duration-base:280ms;
  --duration-slow:640ms;
  --ease-premium:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --stagger-small:60ms;
  --stagger-base:90ms;
  --reveal-y:20px;
  --reveal-opacity:.35;
}
.hero-title .hero-opening { color:#f9f9fb; font-weight:500; }
@media(min-width:768px) { .hero-opening,.hero-ending { display:block; } }
@keyframes motion-line { from { transform:scaleX(.15); } to { transform:scaleX(1); } }
#final h2.motion-closing::after { animation:motion-line var(--duration-slow) var(--ease-premium); }
/* Шапка визуально уплотняется, не сдвигая документ. */
[data-site-header] { isolation:isolate; background:transparent!important; backdrop-filter:none!important; border-bottom:0; transition:none; }
[data-site-header]::before { content:''; position:absolute; inset:0; z-index:-1; background:#090a0ced; border-bottom:1px solid #ffffff12; transform-origin:top; transition:transform var(--duration-base) var(--ease-premium),background-color var(--duration-base) ease; }
[data-site-header] > .container-header { transition:transform var(--duration-base) var(--ease-premium); }
@media(min-width:1024px) {
  [data-site-header][data-compact="true"]::before { transform:scaleY(.85); background:#090a0cf7; }
  [data-site-header][data-compact="true"] > .container-header { transform:translateY(-6px); }
}
[data-site-header] nav > a,[data-site-header] nav > div > a { position:relative; min-height:44px; display:flex; align-items:center; }
[data-site-header] nav > a::after,[data-site-header] nav > div > a::after { content:''; position:absolute; bottom:5px; left:0; right:0; height:1px; background:#d8b26e; transform:scaleX(0); transform-origin:left; transition:transform var(--duration-base) var(--ease-premium); }
[data-site-header] nav a[aria-current] { color:#eee7d9; }
[data-site-header] nav > a[aria-current]::after,[data-site-header] nav > div > a[aria-current]::after { transform:scaleX(1); }
@media(hover:hover) { [data-site-header] nav > a:hover::after,[data-site-header] nav > div > a:hover::after { transform:scaleX(1); } }
[data-site-header] nav a:focus-visible::after { transform:scaleX(1); }
#mobileMenu { position:absolute; top:100%; left:0; right:0; max-height:calc(100dvh - 80px); overscroll-behavior:contain; }
#mobileMenu[hidden],.menu-backdrop[hidden] { display:none!important; }
.menu-backdrop { position:fixed; inset:0; z-index:45; background:#0009; }
#mobileMenu a[aria-current] { color:#e2bf7e; }
#mobileMenuBtn { min-width:44px; min-height:44px; }
.motion-noscript-nav { display:flex; flex-wrap:wrap; gap:16px; padding:100px 20px 20px; }
.motion-noscript-nav a { min-height:44px; display:flex; align-items:center; text-decoration:underline; }
/* Состояния вместо подпрыгивания всех интерактивных элементов. */
a,button,input,textarea,summary { transition:color var(--duration-fast) ease,background-color var(--duration-fast) ease,border-color var(--duration-fast) ease; }
button:active,.hero-primary:active,.hero-secondary:active,.studio-feature-cta:active { filter:brightness(.94); }
.button-arrow,.portfolio-card h3 a span,.catalog-cover-arrow { transition:transform var(--duration-fast) var(--ease-premium); }
.hero-primary,.hero-secondary,.header-actions button { position:relative; }
.service-area { transition:background-color var(--duration-base) ease,border-color var(--duration-base) ease; }
.service-area h3 { transition:transform var(--duration-base) var(--ease-premium); }
.service-area:focus-within { border-color:#a28657; }
.portfolio-card { transition:border-color var(--duration-base) ease; }
.portfolio-card:focus-within { border-color:#b89960; }
.project-cover-window,.catalog-cover-screen { transition:transform var(--duration-base) var(--ease-premium); }
.project-cover-window img { transition:transform var(--duration-slow) var(--ease-out); }
.contact-panel input,.contact-panel textarea { transition:border-color var(--duration-fast) ease,background-color var(--duration-fast) ease; }
.contact-panel input:focus,.contact-panel textarea:focus { background:#171b19; }
.contact-panel :user-invalid { border-color:#e09586; }
.portfolio-filters button { transition:color var(--duration-fast) ease,background-color var(--duration-fast) ease,border-color var(--duration-fast) ease; }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .hero-primary:hover .button-arrow,.hero-secondary:hover .button-arrow { transform:translateX(4px); }
  .service-area:hover { border-color:#8b7654; background:#171a1e; }
  .service-area:hover h3,.service-area:focus-within h3 { transform:translateX(3px); }
  .portfolio-card:hover { border-color:#69614f; }
  .project-cover:hover .project-cover-window { transform:translateY(-3px); box-shadow:0 15px 28px #2e2e2926; }
  .project-cover:hover .project-cover-window img { transform:scale(1.025); }
  .catalog-cover:hover .catalog-cover-screen { transform:translateY(-3px); }
  .portfolio-card h3 a:hover span,.catalog-cover:hover .catalog-cover-arrow { transform:translate(3px,-3px); }
}
/* Восемь узлов остаются читаемыми на любой стадии прогресса. */
.system-flow { position:relative; isolation:isolate; }
.system-flow > div { position:relative; z-index:1; transition:border-color var(--duration-base) ease,background-color var(--duration-base) ease; }
.system-flow > div[data-step-state="passed"] { border-color:#78684c; }
.system-flow > div[data-step-state="active"] { border-color:#d8b26e; background:#242219; }
.system-flow-svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; z-index:0; pointer-events:none; }
.system-flow-track { fill:none; stroke:#484334; stroke-width:1.5; }
.system-flow-signal { fill:none; stroke:#d8b26e; stroke-width:2; stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--flow-progress,1)); }
.process-step { position:relative; }
.process-step::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:#d8b26e; transform:scaleX(var(--step-progress,0)); transform-origin:left; }
.process-step[data-step-state="active"] { border-color:#8b7654; }
#final h2 { position:relative; }
#final h2::after { content:''; display:block; margin:24px auto 0; width:64px; height:1px; background:#d8b26e; transform:scaleX(var(--closing-progress,1)); transform-origin:center; }
@media(max-width:1023px) {
  .system-flow { grid-template-columns:1fr!important; gap:10px!important; padding-left:20px; text-align:left; }
  .system-flow > div { min-height:48px; display:flex; align-items:center; gap:20px; padding:12px 16px; }
  .system-flow > div > span:last-child { margin-top:0; }
  .system-flow > div::before { content:''; position:absolute; left:-24px; top:calc(50% - 4px); width:8px; height:8px; border-radius:50%; background:#766b54; }
  .system-flow > div[data-step-state="active"]::before,.system-flow > div[data-step-state="passed"]::before { background:#d8b26e; }
}
@media(max-width:767px) { #mobileMenu { max-height:calc(100dvh - 68px); } :root { --reveal-y:8px; } }
/* Отключение движения, включая старые hover-правила. Не ускорение до .01ms. */
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto!important; }
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .catalog-cover:hover .catalog-cover-screen,.catalog-cover:hover .catalog-cover-arrow,.project-cover:hover .project-cover-window,.project-cover:hover img,.portfolio-card h3 a:hover span,.service-area:hover h3,.service-area:focus-within h3,.hero-primary:hover .button-arrow,.hero-secondary:hover .button-arrow { transform:none!important; }
  .system-flow-signal { stroke-dashoffset:0; }
  .process-step::before { transform:scaleX(1); }
}