/* =========================================================
   core.css — общая база всех движков стиля
   Движок задаёт токены: --bg --fg --muted --line --accent --accent-2 --accent-3
   --font-d (заголовки) --font-b (текст) --radius --ease
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-x: clip; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body {
  background: var(--bg); color: var(--fg);
  font-family: var(--font-b, system-ui, sans-serif); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; overflow-x: clip; min-height: 100vh;
}
img, svg, video, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; color: inherit; background: none; border: 0; }
button { cursor: pointer; }
ul, ol { list-style: none; }
::selection { background: var(--accent); color: var(--bg); }

.container { width: min(100% - 32px, var(--container, 1240px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ico { width: 1.25em; height: 1.25em; flex: none; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- Состояния до анимации (только при JS) ---------- */
html.js [data-reveal], html.js [data-stagger] > *, html.js [data-split], html.js [data-pop] { visibility: hidden; }
html.js [data-img-reveal] { clip-path: inset(100% 0 0 0); }
@media (prefers-reduced-motion: reduce) {
  html.js [data-reveal], html.js [data-stagger] > *, html.js [data-split], html.js [data-pop] { visibility: visible; }
  html.js [data-img-reveal] { clip-path: none; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---------- Заглушка до старта шторки ---------- */
html.js:not(.curtain-ready) body::after {
  content: ''; position: fixed; inset: 0; z-index: 9998; background: var(--curtain, var(--fg));
}

/* ---------- Шторка ---------- */
.curtain { position: fixed; inset: 0; z-index: 9999; display: flex; pointer-events: none; visibility: hidden; }
.curtain__panel { flex: 1; background: var(--curtain, var(--fg)); }
.curtain__panel:nth-child(2) { background: var(--curtain-2, var(--accent)); }

/* ---------- Прелоадер ---------- */
.preloader { position: fixed; inset: 0; z-index: 10000; background: var(--curtain, var(--fg)); color: var(--bg); display: grid; place-items: center; }
.preloader__inner { width: min(360px, 80vw); }
.preloader__brand { font-family: var(--font-d); font-size: 22px; letter-spacing: .02em; margin-bottom: 18px; }
.preloader__row { display: flex; justify-content: space-between; align-items: end; font-size: 13px; opacity: .7; }
.preloader__num { font-family: var(--font-d); font-size: 56px; line-height: 1; opacity: 1; }
.preloader__bar { height: 2px; background: color-mix(in srgb, var(--bg) 20%, transparent); margin-top: 14px; overflow: hidden; }
.preloader__bar i { display: block; height: 100%; background: var(--accent); transform-origin: left; transform: scaleX(0); }

/* ---------- Курсор ---------- */
html.has-cursor, html.has-cursor a, html.has-cursor button { cursor: none; }
.cursor-dot, .cursor-ring { position: fixed; left: 0; top: 0; pointer-events: none; z-index: 9997; border-radius: 50%; }
.cursor-dot { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: var(--cursor, var(--accent)); }
.cursor-ring {
  width: 38px; height: 38px; margin: -19px 0 0 -19px; border: 1px solid var(--cursor, var(--accent));
  display: grid; place-items: center; transition: width .35s, height .35s, margin .35s, background .35s, border-color .35s;
}
.cursor-ring.is-hover { width: 58px; height: 58px; margin: -29px 0 0 -29px; background: color-mix(in srgb, var(--cursor, var(--accent)) 14%, transparent); }
.cursor-ring.has-label { width: 92px; height: 92px; margin: -46px 0 0 -46px; background: var(--cursor, var(--accent)); border-color: transparent; }
.cursor-ring::after {
  content: attr(data-label); font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--cursor-fg, var(--bg));
  opacity: 0; transition: opacity .25s;
}
.cursor-ring.has-label::after { opacity: 1; }
html.cursor-hidden .cursor-dot, html.cursor-hidden .cursor-ring { opacity: 0 !important; }

/* ---------- Полоса прогресса скролла ---------- */
[data-progress] { position: fixed; left: 0; top: 0; height: 2px; width: 100%; background: var(--accent); transform-origin: left; transform: scaleX(0); z-index: 200; }

/* ---------- Бегущая строка ---------- */
[data-marquee] { overflow: hidden; white-space: nowrap; }
.marquee__track { display: inline-flex; will-change: transform; }
.marquee__track > * { flex: none; }

/* ---------- До / после ---------- */
[data-ba] { position: relative; overflow: hidden; --pos: 50%; touch-action: pan-y; user-select: none; }
[data-ba] img { width: 100%; height: 100%; object-fit: cover; }
[data-ba] .ba__after { position: absolute; inset: 0; clip-path: inset(0 0 0 var(--pos)); }
[data-ba] .ba__handle { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; background: #fff; transform: translateX(-1px); cursor: ew-resize; }
[data-ba] .ba__handle::after {
  content: ''; position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l-6 6 6 6M15 6l6 6-6 6'/%3E%3C/svg%3E") center/22px no-repeat;
  box-shadow: 0 6px 24px rgba(0,0,0,.25);
}
[data-ba] .ba__tag { position: absolute; top: 16px; padding: 6px 12px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; background: rgba(0,0,0,.55); color: #fff; border-radius: 99px; }
[data-ba] .ba__tag--l { left: 16px; } [data-ba] .ba__tag--r { right: 16px; }

/* ---------- Горизонтальный скролл ---------- */
[data-hscroll] { overflow: hidden; }
.hs-track { display: flex; gap: var(--hs-gap, 24px); width: max-content; will-change: transform; }
@media (max-width: 899px) {
  [data-hscroll] { overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  [data-hscroll]::-webkit-scrollbar { display: none; }
  .hs-track > * { scroll-snap-align: start; }
  .hs-track { padding-inline: 16px; }
}

/* ---------- Стопка карточек ---------- */
[data-stack] > * { position: sticky; top: var(--stack-top, 90px); transform-origin: center top; }

/* ---------- FAQ ---------- */
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 24px 0; font-family: var(--font-d); font-size: clamp(18px, 2vw, 22px); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .faq-x { width: 28px; height: 28px; flex: none; position: relative; border-radius: 50%; border: 1px solid var(--line); transition: transform .5s var(--ease, ease), background .3s; }
.faq-item summary .faq-x::before, .faq-item summary .faq-x::after { content: ''; position: absolute; left: 50%; top: 50%; width: 10px; height: 1.5px; margin: -.75px 0 0 -5px; background: currentColor; }
.faq-item summary .faq-x::after { transform: rotate(90deg); }
.faq-item[open] summary .faq-x { transform: rotate(45deg); background: var(--accent); border-color: var(--accent); color: var(--bg); }
.faq-item .faq-a { overflow: hidden; }
.faq-item .faq-a > div { padding: 0 0 24px; color: var(--muted); max-width: 760px; }

/* ---------- Форма ---------- */
form[data-fake] .form-ok { display: none; }
form[data-fake].is-sent .form-body { display: none; }
form[data-fake].is-sent .form-ok { display: block; }

/* ---------- Метка демо стиля ---------- */
.style-tag {
  position: fixed; left: 16px; bottom: 16px; z-index: 150; display: flex; flex-direction: column; gap: 2px;
  padding: 10px 16px; border-radius: 14px; background: rgba(15, 15, 18, .82); color: #fff; font: 600 13px/1.2 system-ui, sans-serif;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform .3s;
}
.is-embedded .style-tag { display: none; }
.style-tag span { font-weight: 400; font-size: 11.5px; opacity: .65; }
.style-tag:hover { transform: translateY(-3px); }
@media (max-width: 600px) { .style-tag { left: auto; right: 12px; bottom: 12px; padding: 8px 12px; } }

/* ---------- Прочее ---------- */
[data-scrub-text] .w { opacity: .18; }
@media (max-width: 760px) { body { font-size: 16px; } }