/* ToxicOFF — общий слой поверх ЛЮБОЙ страницы (в т.ч. перенесённых из макета):
   логотип сервиса, выпадающее меню «Инструменты», ховер-эффекты, микроанимации, CTR-акценты.
   Без глобальных сбросов — чтобы не конфликтовать с инлайн-стилями макета. */

/* ── логотип сервиса (как в app: лицо в тёмной обводке + онлайн-точка) ── */
.logo.brand{display:flex;align-items:center;gap:9px;text-decoration:none}
.logo-badge{position:relative;display:inline-flex;flex:none;width:42px;height:42px;border-radius:50%;
  box-shadow:0 5px 12px -3px rgba(0,0,0,.45)}
.logo-clip{position:absolute;inset:0;border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 50% 30%,#2c2836,#15131c);display:flex;align-items:center;justify-content:flex-start}
.logo-head{height:34px;width:auto;max-width:none;margin-left:4px}
.logo-dot{position:absolute;top:0;right:0;width:12px;height:12px;border-radius:50%;background:#22c55e;border:2px solid #fff;z-index:2}
.logo-word{font-family:'Unbounded',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.02em;color:#15131c;white-space:nowrap}
.logo-word b{color:#7c3aed}
.site-foot .logo-word{color:#fff}
.site-foot .logo-dot{border-color:#1a0d38}

/* ── выпадающее меню «Инструменты» ── */
.dd{position:relative}
/* кнопка выглядит как обычный пункт меню — отличает только стрелочка */
.dd-btn{display:inline-flex;align-items:center;gap:5px;padding:0;border:0;background:none;
  color:#57536a;font-family:inherit;font-weight:600;font-size:14.5px;cursor:pointer;transition:color .18s}
.dd-btn:hover,.dd.open .dd-btn{color:#4c1d95}
.dd-caret{font-size:10px;opacity:.7;transition:transform .22s}
.dd.open .dd-caret{transform:rotate(180deg)}
.dd-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:288px;background:#fff;border:1px solid #ece6f8;
  border-radius:16px;padding:8px;box-shadow:0 24px 60px -20px rgba(50,30,80,.5);display:grid;gap:2px;
  opacity:0;transform:translateY(-8px);visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility .2s;z-index:60}
.dd.open .dd-menu{opacity:1;transform:none;visibility:visible}
.dd-menu a{display:flex;flex-direction:column;gap:1px;padding:10px 12px;border-radius:11px;text-decoration:none;color:#1e1b2e;
  transition:background .15s}
.dd-menu a b{font-weight:700;font-size:14.5px}
.dd-menu a span{font-size:12px;color:#8a8698}
.dd-menu a:hover{background:#f6f2ff}
.dd-menu a.on{background:#f4eeff}
.dd-menu a.on b{color:#4c1d95}
@media(max-width:860px){
  .dd{width:100%}
  .dd-btn{width:100%;justify-content:space-between}
  .dd-menu{position:static;min-width:0;box-shadow:none;border:0;border-radius:0;padding:4px 0 6px;
    opacity:1;transform:none;visibility:visible;display:none}
  .dd.open .dd-menu{display:grid}
}

/* ── кнопки: ховер и «живость» ── */
.btn,.cta-anim{transition:transform .18s ease,box-shadow .25s ease,background .2s ease,border-color .2s ease}
.btn:hover,.cta-anim:hover{transform:translateY(-2px)}
.btn:active,.cta-anim:active{transform:translateY(0)}
.btn-p:hover,.cta-anim:hover{box-shadow:0 16px 32px -12px rgba(124,58,237,.85)}
/* блик по первичной кнопке */
.btn-p,.cta-anim{position:relative;overflow:hidden}
.btn-p::after,.cta-anim::after{content:"";position:absolute;top:0;left:-140%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);
  transform:skewX(-18deg);transition:left .6s ease;pointer-events:none}
.btn-p:hover::after,.cta-anim:hover::after{left:140%}
.nudge{display:inline-block;transition:transform .2s ease}
a:hover>.nudge,.btn:hover .nudge{transform:translateX(4px)}

/* ── карточки: лёгкий подъём ── */
.card,.tier,.pillar,.step{transition:transform .2s ease,box-shadow .25s ease,border-color .2s ease}
.card:hover,.step:hover{transform:translateY(-3px);border-color:#dcd2f2;box-shadow:0 22px 46px -30px rgba(50,30,80,.55)}
.tier:hover{transform:translateY(-4px);border-color:#c4b5fd}
.pillar:hover{transform:translateY(-3px);box-shadow:0 26px 54px -30px rgba(50,30,80,.6)}

/* ── CTR-акценты ── */
.accent{display:inline-flex;align-items:center;gap:7px;background:#e9f7ef;border:1px solid #bfe6cd;
  color:#16a34a;font-weight:800;font-size:12.5px;padding:6px 12px;border-radius:999px}
.accent-warm{background:#fff4e8;border-color:#ffd9b0;color:#c2410c}
.pulse-dot{position:relative;display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e}
.pulse-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#22c55e;
  animation:pulseRing 1.9s cubic-bezier(.2,.6,.3,1) infinite}
@keyframes pulseRing{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.2);opacity:0}}

/* ── появление секций при скролле (класс ставит JS, без JS всё видно) ── */
.js-reveal{opacity:0;transform:translateY(16px)}
.js-reveal.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.3,1)}
@media(prefers-reduced-motion:reduce){
  .js-reveal,.js-reveal.in{opacity:1!important;transform:none!important;transition:none!important}
  .btn,.cta-anim,.card,.tier,.pillar,.step,.dd-btn,.dd-menu{transition:none!important}
  .btn:hover,.cta-anim:hover,.card:hover,.tier:hover,.pillar:hover,.step:hover{transform:none!important}
  .pulse-dot::after{animation:none!important}
  .btn-p::after,.cta-anim::after{display:none}
}