/* ============================================================
   Aura Ecosystem - design tokens (дизайн-код)
   Единый источник правды по шрифтам, цвету и движению. Подключай одним
   файлом в любом продукте экосистемы. Знак три кольца всегда, вордмарк
   всегда полный "Aura Ecosystem".
   Канон = дизайн Sales-CRM (2026-09): холодный монохром как база +
   цветные акценты/сигналы, когерентные тени, движение и прелоудер.
   Полная айдентика: /IDENTITY.md · живой дизайн-код: /brand.html
   ============================================================ */

/* ---- Шрифты (самохост, лежат в /fonts) ---- */
@font-face{font-family:'BLK Fort';font-weight:400;src:url('../fonts/BLKFort-Book.woff2') format('woff2');font-display:swap}
@font-face{font-family:'BLK Fort';font-weight:700;src:url('../fonts/BLKFort-Bold.woff2') format('woff2');font-display:swap}
@font-face{font-family:'BLK Fort';font-weight:800;src:url('../fonts/BLKFort-Extrabold.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Gilroy';font-weight:500;src:url('../fonts/Gilroy-Medium.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Gilroy';font-weight:600;src:url('../fonts/Gilroy-SemiBold.woff2') format('woff2');font-display:swap}

/* ---- Токены (канон Sales-CRM) ---- */
:root{
  /* поверхности: холодный монохром */
  --bg:#f6f7fb; --card:#ffffff; --surface:#f2f4f9; --soft:#eef0f6;
  /* текст */
  --fg:#171a21; --sfg:#5a6072; --mfg:#8b90a0;
  /* линии */
  --border:#e6e8ef;
  /* тёмно-графитовый акцент интерфейса (актив/интерактив), без синего в шасси */
  --ink:#0a0a0a; --accent:#1c1f27; --accent-hi:#3a3f4d; --accent-soft:#eef0f5; --accent-ring:rgba(23,26,33,.18);
  /* тёмная поверхность (кнопки, активные пилюли, аватары, прогресс, футер) */
  --dark:linear-gradient(150deg,#4c5261 0%,#15171c 90%);

  /* ---- ЦВЕТ: акценты и сигналы (монохром - база, цвет - смысл) ---- */
  --blue:#1257c4; --blue-hi:#0f4aa8; --blue-soft:#eaf1fb;   /* основной цветовой акцент, графики, ссылки-CTA */
  --grad-blue:linear-gradient(150deg,#5ab0f0 0%,#1257c4 90%); /* линии графиков, hero-акценты */
  --success:#1a7f37; --success-soft:#e7f5ec;   /* успех, готово, рост */
  --warn:#b45309;    --warn-soft:#fff3d6;       /* внимание, дедлайн */
  --danger:#c74634;  --danger-soft:#ffe9e6;     /* ошибка, просрочка, выход */
  /* сегмент-тинты (лид/статус): hot / warm / cold */
  --seg-hot-bg:#ffe9e6;  --seg-hot-fg:#c74634;
  --seg-warm-bg:#fff3d6; --seg-warm-fg:#9a6a12;
  --seg-cold-bg:var(--soft); --seg-cold-fg:var(--sfg);

  /* шрифты */
  --display:'BLK Fort',sans-serif;
  --text:'Gilroy',system-ui,-apple-system,sans-serif;

  /* радиусы: контролы 12, карточки 18 */
  --r:12px; --r-lg:12px; --r-xl:18px; --r-pill:9999px;

  /* когерентная шкала теней */
  --shadow-sm:0 1px 2px rgba(16,20,32,.05);
  --shadow-md:0 8px 24px -14px rgba(16,20,32,.28);
  --shadow-lg:0 18px 44px -28px rgba(16,20,32,.34);
  --sh:var(--shadow-lg);

  /* ---- ДВИЖЕНИЕ ---- */
  --ease-out:cubic-bezier(.22,.61,.36,1);   /* появление */
  --ease-pop:cubic-bezier(.34,1.3,.64,1);   /* поповеры/модалки (лёгкий overshoot) */
  --ease-brand:cubic-bezier(.22,.9,.24,1);  /* фирменное «сборка», прелоудер */
  --dur-fast:.16s; --dur:.3s; --dur-slow:.6s;
}

/* ---- База ---- */
.gt{background:linear-gradient(180deg,#0a0a0a 0%,#333 52%,#8f8f8f 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent}
.grad-dark{background:var(--dark);color:#fff}
.seg-hot{background:var(--seg-hot-bg);color:var(--seg-hot-fg)}
.seg-warm{background:var(--seg-warm-bg);color:var(--seg-warm-fg)}
.seg-cold{background:var(--seg-cold-bg);color:var(--seg-cold-fg)}

/* ---- Анимации (общие для всех продуктов) ---- */
@keyframes auraFadeUp{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes auraPop{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
.animate-fade-up{animation:auraFadeUp var(--dur) var(--ease-out) both}
.animate-pop{animation:auraPop .22s var(--ease-pop) both}
@media(prefers-reduced-motion:reduce){.animate-fade-up,.animate-pop{animation:none}}

/* ---- Лого-локап: знак три кольца (всегда) + Aura Ecosystem (всегда) + подстрочник ---- */
.logo{display:flex;align-items:center;gap:13px;text-decoration:none}
.logo .mk svg{width:42px;height:42px;display:block}
.logo .wm{font-family:var(--display);font-weight:700;font-size:24px;letter-spacing:-.6px;color:var(--fg);line-height:1}
.logo .wm .lt{font-weight:400}
.logo .wm .sub{font-family:var(--text);font-weight:600;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--mfg);margin-top:5px}
.logo.on-dark .wm{color:#fff}
.logo.on-dark .wm .sub{color:#9a9a9a}

/* ---- Прелоудер (канон): премиальная сборка знака ----
   Кольца рисуются по кругу (draw-in) -> ядро всходит -> орбитальная комета со
   светящимся следом -> вордмарк раскрывается клип-вайпом. Мягкое ядро-свечение
   пульсирует. Только GPU-трансформы + stroke/clip. */
.aura-loader{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;
  background:radial-gradient(130% 560px at 50% 0%,#ffffff 0%,rgba(255,255,255,0) 60%) no-repeat,var(--bg);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out),visibility .7s}
.aura-loader-out{opacity:0;visibility:hidden;pointer-events:none;transform:scale(1.03) translateY(-8px)}
.aura-loader-stage{position:relative;width:132px;height:132px;animation:aldStage .9s var(--ease-brand) both}
.aura-loader-stage svg{width:100%;height:100%;overflow:visible;display:block}

/* мягкое свечение-пульс под знаком */
.aura-glow{fill:var(--ink);opacity:.06;filter:blur(7px);transform-box:fill-box;transform-origin:center;animation:aldGlow 3.2s ease-in-out infinite}
/* три кольца: рисуются по окружности (dashoffset), старт сверху (rotate -90) */
.aura-ring{fill:none;stroke:var(--ink);stroke-linecap:round;transform-box:fill-box;transform-origin:center;transform:rotate(-90deg)}
.aura-ring-outer{stroke-width:2;opacity:.16;stroke-dasharray:289;stroke-dashoffset:289;animation:aldDraw 1s var(--ease-brand) .05s forwards}
.aura-ring-mid{stroke-width:2.6;opacity:.4;stroke-dasharray:195;stroke-dashoffset:195;animation:aldDraw 1s var(--ease-brand) .2s forwards}
.aura-ring-core{fill:var(--ink);stroke:none;transform-box:fill-box;transform-origin:center;opacity:0;animation:aldCore .6s var(--ease-pop) .55s forwards,aldPulse 2.8s ease-in-out 1.2s infinite}
/* орбитальная комета по внешнему кольцу: короткая дуга + мягкое свечение */
.aura-orbit{transform-box:fill-box;transform-origin:center;animation:aldOrbit 2.6s cubic-bezier(.55,.1,.45,.9) .5s infinite}
.aura-orbit circle{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round;stroke-dasharray:20 269;transform:rotate(-90deg);transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 0 6px rgba(10,10,10,.4))}

.aura-loader-word{font-family:var(--display);font-weight:700;letter-spacing:-.6px;font-size:27px;line-height:1;color:var(--fg);text-align:center;
  clip-path:inset(0 100% 0 0);animation:aldWipe .85s var(--ease-brand) .8s forwards}
.aura-loader-word .lt{font-weight:400;color:var(--mfg)}
.aura-loader-sub{font-family:var(--text);font-weight:600;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--mfg);margin-top:8px;opacity:0;animation:aldFade .6s var(--ease-out) 1.2s forwards}

@keyframes aldStage{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
@keyframes aldGlow{0%,100%{opacity:.05;transform:scale(.88)}50%{opacity:.13;transform:scale(1.14)}}
@keyframes aldDraw{to{stroke-dashoffset:0}}
@keyframes aldCore{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
@keyframes aldPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.13)}}
@keyframes aldOrbit{to{transform:rotate(360deg)}}
@keyframes aldWipe{to{clip-path:inset(0 0 0 0)}}
@keyframes aldFade{to{opacity:1}}
@media(prefers-reduced-motion:reduce){
  .aura-glow,.aura-ring,.aura-ring-core,.aura-orbit,.aura-loader-word,.aura-loader-sub{animation:none}
  .aura-ring{stroke-dashoffset:0}.aura-ring-core{opacity:1}
  .aura-loader-word{clip-path:none}.aura-loader-sub{opacity:1}
}