/* ============================================================
   MIRRIM — business.mirrim.games/tools · светлое стекло
   Инструменты для бизнеса. Легенда токенов и правил внизу файла.
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{font:var(--mirrim-text-body);font-size:17px;line-height:1.55;color:var(--mirrim-ink-900);background:#FBFAFF;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--mirrim-purple-500);text-decoration:none}
a:hover{color:var(--mirrim-purple-700)}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
h1,h2,h3,h4{font-family:var(--mirrim-font-display);letter-spacing:-.025em;text-wrap:balance}

/* ---------- фон ---------- */
.bgfx{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.bgfx i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5}
.bgfx i:nth-child(1){width:620px;height:620px;top:-180px;left:-140px;background:#C9B8FF}
.bgfx i:nth-child(2){width:520px;height:520px;top:18%;right:-160px;background:#A78BFA;opacity:.34}
.bgfx i:nth-child(3){width:700px;height:700px;top:56%;left:-220px;background:#E7DEFF;opacity:.7}
.bgfx i:nth-child(4){width:460px;height:460px;bottom:4%;right:-120px;background:#C9B8FF;opacity:.4}

/* ---------- скелет ---------- */
.wrap{width:min(1120px,100% - 48px);margin-inline:auto}
section{padding:100px 0;position:relative}
.sec-hd{max-width:760px;margin-bottom:44px}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font:700 14px/1 var(--mirrim-font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--mirrim-purple-600);margin-bottom:18px}
.eyebrow::before{content:"";width:26px;height:2px;border-radius:2px;background:var(--mirrim-purple-400)}
.ei{width:1.05em;height:1.05em;stroke:currentColor;stroke-width:2;fill:none;flex:0 0 auto;vertical-align:-.14em}
h2.sec-t{font-size:clamp(32px,4vw,52px);font-weight:800;line-height:1.06}
.sec-sub{margin-top:18px;font-size:19px;color:var(--mirrim-ink-600);max-width:640px;text-wrap:pretty}
.mark{background:linear-gradient(180deg,transparent 62%,#DFFB8F 62%);padding:0 .08em}

/* ---------- стекло ---------- */
.glass{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border:1px solid rgba(255,255,255,.9);border-radius:var(--mirrim-radius-2xl);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 44px -22px rgba(46,16,101,.28);position:relative;overflow:hidden}
.glass::before{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,1),transparent)}
.glass-soft{background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.8);border-radius:var(--mirrim-radius-lg)}

/* ---------- кнопки ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;height:60px;padding:0 30px;border-radius:var(--mirrim-radius-pill);font:800 18px/1 var(--mirrim-font-display);white-space:nowrap;transition:transform .16s,box-shadow .2s,background .2s}
.btn svg{width:21px;height:21px;stroke-width:2.2;fill:none;stroke:currentColor;flex:0 0 auto}
.btn:active{transform:translateY(1px) scale(.99)}
.btn--lime{background:var(--mirrim-lime-500);color:#0A0A0A;box-shadow:var(--mirrim-shadow-lime)}
.btn--lime:hover{background:var(--mirrim-lime-400);color:#0A0A0A;box-shadow:0 14px 30px -8px rgba(168,217,32,.7)}
.btn--purple{background:var(--mirrim-purple-500);color:#fff;box-shadow:var(--mirrim-shadow-cta)}
.btn--purple:hover{background:var(--mirrim-purple-600);color:#fff}
.btn--ghost{background:rgba(255,255,255,.72);color:var(--mirrim-ink-900);border:1.5px solid rgba(124,58,237,.24);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.btn--ghost:hover{border-color:var(--mirrim-purple-400);background:#fff;color:var(--mirrim-ink-900)}
.btn--sm{height:48px;padding:0 22px;font-size:16px}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- шапка + крошки ---------- */
.nav{position:sticky;top:0;z-index:60;padding:14px 0;background:rgba(251,250,255,.74);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid rgba(124,58,237,.1)}
.nav__in{display:flex;align-items:center;gap:32px}
.nav__logo{height:30px;width:auto}
.nav__links{display:flex;gap:26px;margin-left:auto;font:700 16px/1 var(--mirrim-font-display);min-width:0;overflow:hidden}
.nav__links a{color:var(--mirrim-ink-700);white-space:nowrap}
.nav__links a:hover{color:var(--mirrim-purple-600)}
.nav__cta{display:flex;gap:10px;flex:0 0 auto;margin-left:auto}
.crumbs{display:flex;align-items:center;gap:10px;padding-top:26px;font:700 15px/1 var(--mirrim-font-text)}
.crumbs a{display:inline-flex;align-items:center;gap:8px;color:var(--mirrim-purple-600);padding:9px 15px;border-radius:999px;background:rgba(124,58,237,.08);transition:background .18s}
.crumbs a:hover{background:rgba(124,58,237,.15)}
.crumbs span{color:var(--mirrim-ink-400)}
.crumbs b{color:var(--mirrim-ink-700)}

/* ---------- 1 · герой ---------- */
.hero{padding:34px 0 92px}
.hero__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center}
.hero h1{font-size:clamp(38px,5.1vw,62px);font-weight:800;line-height:1.04}
.hero h1 em{font-style:normal;color:var(--mirrim-purple-500)}
.hero__sub{margin-top:24px;font-size:21px;line-height:1.5;color:var(--mirrim-ink-600);max-width:530px;text-wrap:pretty}
.hero .btn-row{margin-top:36px}
.hero__note{margin-top:18px;font:500 15px/1.4 var(--mirrim-font-text);color:var(--mirrim-ink-500)}
.pdot{width:9px;height:9px;border-radius:50%;background:var(--mirrim-success);box-shadow:0 0 0 4px rgba(93,211,60,.22);animation:pulse 2s ease-in-out infinite;flex:0 0 auto}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(93,211,60,.06)}}

/* мокап героя: телефон-карта + база */
.hmock{padding:24px;display:grid;grid-template-columns:auto minmax(240px,1fr);gap:20px;align-items:center}
.hmock>.dash{min-width:0}
.hmock .phone{width:176px}
@media (max-width:1180px){.hmock{grid-template-columns:minmax(0,1fr);justify-items:center}.hmock .phone{width:196px}.hmock>.dash{width:100%}}
.phone{width:196px;flex:0 0 auto;background:#0A0A0A;border-radius:30px;padding:8px;box-shadow:0 26px 54px -18px rgba(20,10,60,.55)}
.phone__s{background:#fff;border-radius:24px;padding:16px 14px;display:flex;flex-direction:column}
.phone__hd{display:flex;align-items:center;gap:8px;font:800 13px/1 var(--mirrim-font-display);color:var(--mirrim-ink-400);margin-bottom:12px}
.card-l{border-radius:16px;background:linear-gradient(150deg,#5B21B6,#7C3AED);padding:14px;color:#fff;margin-bottom:12px}
.card-l b{font:800 14px/1.2 var(--mirrim-font-display);display:block}
.card-l span{font:600 11.5px/1.2 var(--mirrim-font-text);color:rgba(255,255,255,.7);display:block;margin-top:3px}
.stamps{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px}
.stamps i{aspect-ratio:1;border-radius:50%;border:1.5px dashed rgba(255,255,255,.4);display:grid;place-items:center}
.stamps i.on{background:var(--mirrim-lime-500);border:0;box-shadow:0 0 12px rgba(198,244,50,.45)}
.stamps i.on::after{content:"";width:7px;height:4px;border-left:2px solid #0A0A0A;border-bottom:2px solid #0A0A0A;transform:rotate(-45deg) translate(1px,-1px)}
.card-l__nx{margin-top:12px;font:700 11.5px/1 var(--mirrim-font-text);color:var(--mirrim-lime-500)}
.phone__row{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:11px;background:var(--mirrim-ink-50);font:700 12px/1 var(--mirrim-font-text);margin-bottom:7px}
.phone__row u{width:7px;height:7px;border-radius:50%;background:var(--mirrim-purple-400);text-decoration:none;flex:0 0 auto}
.phone__row em{margin-left:auto;font-style:normal;color:var(--mirrim-ink-400);font-weight:700;font-size:11px}

/* ---------- мокап базы / дашборда ---------- */
.dash{border-radius:18px;background:#fff;border:1px solid rgba(124,58,237,.13);padding:16px;box-shadow:0 16px 36px -22px rgba(46,16,101,.4)}
.dash__hd{display:flex;align-items:center;gap:9px;font:800 14px/1 var(--mirrim-font-display);margin-bottom:14px}
.dash__hd b{margin-left:auto;font:700 12px/1 var(--mirrim-font-text);color:var(--mirrim-ink-400)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:14px}
.kpi{padding:12px;border-radius:13px;background:var(--mirrim-purple-50)}
.kpi__n{font:800 21px/1 var(--mirrim-font-display);color:var(--mirrim-purple-700)}
.kpi__l{font:600 11.5px/1.25 var(--mirrim-font-text);color:var(--mirrim-ink-500);margin-top:5px}
.chart{display:flex;align-items:flex-end;gap:6px;height:88px;margin-bottom:12px}
.chart i{flex:1;border-radius:6px 6px 0 0;background:linear-gradient(180deg,#A78BFA,#7C3AED);animation:rise 1.1s cubic-bezier(.22,1,.36,1) both}
.chart i.hi{background:linear-gradient(180deg,#D4FB58,#A8D920)}
.chart i:nth-child(2){animation-delay:.06s}.chart i:nth-child(3){animation-delay:.12s}.chart i:nth-child(4){animation-delay:.18s}.chart i:nth-child(5){animation-delay:.24s}.chart i:nth-child(6){animation-delay:.3s}.chart i:nth-child(7){animation-delay:.36s}.chart i:nth-child(8){animation-delay:.42s}
@keyframes rise{from{height:6%}}
.drows{display:flex;flex-direction:column;gap:7px}
.drow{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;background:var(--mirrim-ink-50);font:700 13px/1 var(--mirrim-font-text)}
.drow u{width:26px;height:26px;border-radius:8px;background:linear-gradient(150deg,#C9B8FF,#6D28D9);flex:0 0 auto;text-decoration:none}
.drow span{font:600 11px/1.2 var(--mirrim-font-text);color:var(--mirrim-ink-400);display:block;margin-top:3px}
.drow em{margin-left:auto;font-style:normal;font-weight:800;color:var(--mirrim-purple-600);font-size:12.5px}

/* ---------- 2 · четыре рычага ---------- */
.lev{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.levc{padding:30px 30px 32px;border-radius:var(--mirrim-radius-lg);position:relative}
.levc__n{font:800 13px/1 var(--mirrim-font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--mirrim-purple-400);margin-bottom:14px;display:block}
.levc h3{font-size:23px;font-weight:800;margin-bottom:9px;display:flex;align-items:center;gap:11px}
.levc h3 svg{width:24px;height:24px;stroke:var(--mirrim-purple-600);stroke-width:2;fill:none;flex:0 0 auto}
.levc p{font-size:16.5px;color:var(--mirrim-ink-600)}
.levc__how{margin-top:16px;padding-top:14px;border-top:1px solid rgba(124,58,237,.12);font:700 14px/1.35 var(--mirrim-font-text);color:var(--mirrim-ink-500)}
.levwrap{display:grid;grid-template-columns:1fr .82fr;gap:34px;align-items:center}
.levside{padding:34px 32px;border-radius:var(--mirrim-radius-2xl);background:linear-gradient(150deg,rgba(124,58,237,.96),rgba(46,16,101,.97));color:#fff}
.levside h3{font-size:clamp(24px,2.6vw,30px);font-weight:800;line-height:1.14;margin-bottom:14px}
.levside p{font-size:17px;color:rgba(255,255,255,.82)}
.levside .split{display:flex;gap:10px;margin-top:24px}
.levside .split div{flex:1;padding:14px;border-radius:14px;background:rgba(255,255,255,.1);font:700 13.5px/1.3 var(--mirrim-font-text)}
.levside .split div b{display:block;font:800 20px/1 var(--mirrim-font-display);margin-bottom:6px}
.levside .split div:last-child{background:rgba(198,244,50,.18);border:1px solid rgba(198,244,50,.4)}
.levside .split div:last-child b{color:var(--mirrim-lime-500)}

/* ---------- 3 · инструменты ---------- */
.tools{display:flex;flex-direction:column;gap:20px}
.tl2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tool{padding:0;overflow:hidden}
.tool>summary{display:none}
.tool__bd{display:grid;grid-template-columns:1fr .82fr;align-items:stretch}
.tool__tx{padding:32px 30px 30px;display:flex;flex-direction:column}
.tool__tag{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;padding:8px 13px;border-radius:999px;background:var(--mirrim-purple-50);color:var(--mirrim-purple-700);font:800 12.5px/1 var(--mirrim-font-display);letter-spacing:.04em;text-transform:uppercase;margin-bottom:16px}
.tool h3{font-size:26px;font-weight:800;margin-bottom:11px}
.tool__what{font-size:17px;color:var(--mirrim-ink-700);text-wrap:pretty}
.tool__why{margin-top:16px;display:flex;flex-direction:column;gap:9px}
.tool__why div{display:flex;gap:10px;font:600 15.5px/1.4 var(--mirrim-font-text);color:var(--mirrim-ink-600)}
.tool__why svg{width:18px;height:18px;stroke:var(--mirrim-purple-500);stroke-width:2.6;fill:none;margin-top:3px;flex:0 0 auto}
.tool__lever{margin-top:auto;padding-top:20px;display:flex;align-items:center;gap:10px;font:800 14px/1 var(--mirrim-font-display);color:#4E7A0B}
.tool__lever u{padding:8px 12px;border-radius:999px;background:rgba(198,244,50,.4);text-decoration:none}
.tool__mk{padding:26px 24px;background:linear-gradient(165deg,rgba(124,58,237,.07),rgba(199,184,255,.16));border-left:1px solid rgba(124,58,237,.1);display:flex;align-items:center;justify-content:center}
.tl2 .tool__bd{grid-template-columns:1fr}
.tl2 .tool__mk{border-left:0;border-top:1px solid rgba(124,58,237,.1)}

/* мини-мокапы инструментов */
.mkp{width:100%;max-width:290px}
.mk-scr{border-radius:16px;background:#fff;border:1px solid rgba(124,58,237,.13);padding:14px;box-shadow:0 14px 30px -18px rgba(46,16,101,.45)}
.mk-scr__hd{display:flex;align-items:center;gap:8px;font:800 12px/1 var(--mirrim-font-display);color:var(--mirrim-ink-400);margin-bottom:12px;text-transform:uppercase;letter-spacing:.06em}
.mk-scr__hd b{margin-left:auto;text-transform:none;letter-spacing:0;color:var(--mirrim-purple-600);font-size:11.5px}
.stars{display:flex;gap:5px;margin-bottom:10px}
.stars i{width:24px;height:24px;flex:0 0 auto;background:var(--mirrim-ink-200);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.stars i.on{background:var(--mirrim-lime-500)}
.txtbox{border-radius:11px;background:var(--mirrim-ink-50);padding:11px;font:600 12.5px/1.4 var(--mirrim-font-text);color:var(--mirrim-ink-600);min-height:56px}
.mini-btn{margin-top:10px;height:38px;border-radius:999px;background:var(--mirrim-purple-500);color:#fff;display:grid;place-items:center;font:800 13px/1 var(--mirrim-font-display)}
.mini-btn.lime{background:var(--mirrim-lime-500);color:#0A0A0A}
.wheel{width:150px;height:150px;margin:2px auto 0;border-radius:50%;background:conic-gradient(#7C3AED 0 60deg,#C6F432 60deg 120deg,#A78BFA 120deg 180deg,#fff 180deg 240deg,#C9B8FF 240deg 300deg,#D4FB58 300deg 360deg);box-shadow:0 0 0 6px rgba(255,255,255,.7),0 16px 34px -14px rgba(46,16,101,.5);position:relative;animation:spin 6s cubic-bezier(.16,1,.3,1) both}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(700deg)}}
.wheel::after{content:"";position:absolute;inset:38%;border-radius:50%;background:#fff}
.scratch{height:96px;border-radius:14px;background:linear-gradient(120deg,#C9B8FF,#8B5CF6);display:grid;place-items:center;font:800 20px/1 var(--mirrim-font-display);color:#2E1065;position:relative;overflow:hidden}
.scratch::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.88) 0 12px,rgba(240,236,255,.88) 12px 22px);clip-path:polygon(0 0,100% 0,100% 100%,66% 100%,54% 44%,28% 100%,0 100%)}
.quest{display:flex;flex-direction:column;gap:7px}
.quest div{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:11px;background:var(--mirrim-ink-50);font:700 12.5px/1 var(--mirrim-font-text)}
.quest div.done{background:rgba(198,244,50,.35)}
.quest div u{width:17px;height:17px;border-radius:50%;border:2px solid var(--mirrim-ink-300);flex:0 0 auto;text-decoration:none}
.quest div.done u{background:#0A0A0A;border-color:#0A0A0A}
.quest div em{margin-left:auto;font-style:normal;font-size:11px;color:var(--mirrim-ink-400)}
.cross3{display:flex;flex-direction:column;gap:8px}
.cross3 div{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid rgba(124,58,237,.12);font:700 13px/1 var(--mirrim-font-text)}
.cross3 div u{width:26px;height:26px;border-radius:8px;background:linear-gradient(150deg,#C9B8FF,#6D28D9);flex:0 0 auto;text-decoration:none}
.cross3 div em{margin-left:auto;font-style:normal;font:700 11.5px/1 var(--mirrim-font-text);color:var(--mirrim-ink-400)}
.cross3__pool{margin-top:4px;padding:12px;border-radius:12px;background:rgba(198,244,50,.35);font:800 13.5px/1.3 var(--mirrim-font-display);text-align:center}

/* ---------- 4 · цикл базы ---------- */
.cyc{display:flex;align-items:stretch;gap:10px;margin-bottom:26px}
.cycs{flex:1;padding:20px 18px;border-radius:var(--mirrim-radius-lg);background:rgba(255,255,255,.66);border:1px solid rgba(124,58,237,.13);position:relative}
.cycs b{display:block;font:800 15.5px/1.25 var(--mirrim-font-display);margin-bottom:6px}
.cycs span{font:500 13.5px/1.35 var(--mirrim-font-text);color:var(--mirrim-ink-500)}
.cycs u{position:absolute;top:14px;right:16px;font:800 12px/1 var(--mirrim-font-display);color:var(--mirrim-purple-300);text-decoration:none}
.cycs:last-child{background:linear-gradient(140deg,rgba(198,244,50,.3),rgba(255,255,255,.7));border-color:rgba(168,217,32,.55)}
.cycarr{align-self:center;width:22px;height:22px;flex:0 0 auto;stroke:var(--mirrim-purple-300);stroke-width:2.4;fill:none}
.base{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bs{display:flex;gap:14px;padding:20px 22px;border-radius:var(--mirrim-radius-lg)}
.bs__ic{width:42px;height:42px;border-radius:13px;background:var(--mirrim-purple-50);display:grid;place-items:center;flex:0 0 auto}
.bs__ic svg{width:21px;height:21px;stroke:var(--mirrim-purple-600);stroke-width:2;fill:none}
.bs b{display:block;font:800 17px/1.25 var(--mirrim-font-display);margin-bottom:5px}
.bs span{font-size:15.5px;color:var(--mirrim-ink-600)}

/* ---------- 5 · аналитика ---------- */
.anl{display:grid;grid-template-columns:.82fr 1.18fr;gap:38px;align-items:center}
.anl ul{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:24px}
.anl li{display:flex;gap:12px;font-size:16.5px;color:var(--mirrim-ink-700)}
.anl li svg{width:20px;height:20px;stroke:var(--mirrim-purple-500);stroke-width:2.4;fill:none;margin-top:3px;flex:0 0 auto}
.dash--big{padding:24px}
.dash--big .kpi__n{font-size:27px}
.dash--big .chart{height:130px}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.pts{display:flex;flex-direction:column;gap:7px}
.pt{display:flex;align-items:center;gap:9px;font:700 12.5px/1 var(--mirrim-font-text)}
.pt i{flex:1;height:10px;border-radius:999px;background:var(--mirrim-ink-100);overflow:hidden}
.pt i::after{content:"";display:block;height:100%;width:var(--w);border-radius:999px;background:linear-gradient(90deg,#A78BFA,#7C3AED)}
.pt.best i::after{background:linear-gradient(90deg,#C6F432,#A8D920)}
.pt em{font-style:normal;font-weight:800;color:var(--mirrim-ink-500);width:34px;text-align:right;font-size:12px}
.subhd{font:800 12px/1 var(--mirrim-font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--mirrim-ink-400);margin-bottom:10px}

/* ---------- 6 · каналы QR ---------- */
.chan{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.chn{display:flex;align-items:center;gap:15px;padding:20px 22px;border-radius:var(--mirrim-radius-lg)}
.chn__ic{width:44px;height:44px;border-radius:13px;background:#fff;border:1px solid rgba(124,58,237,.16);display:grid;place-items:center;flex:0 0 auto}
.chn__ic svg{width:22px;height:22px;stroke:var(--mirrim-purple-600);stroke-width:2;fill:none}
.chn b{font:800 17px/1.2 var(--mirrim-font-display);display:block}
.chn span{font:500 14px/1.3 var(--mirrim-font-text);color:var(--mirrim-ink-500)}
.plate{display:flex;align-items:center;gap:16px;margin-top:18px;padding:20px 24px;border-radius:var(--mirrim-radius-lg);background:linear-gradient(120deg,rgba(198,244,50,.28),rgba(255,255,255,.6));border:1px solid rgba(168,217,32,.5)}
.plate svg{width:26px;height:26px;stroke:#4E7A0B;stroke-width:2.4;fill:none;flex:0 0 auto}
.plate b{font:800 18px/1.35 var(--mirrim-font-display)}
.plate span{font-size:16.5px;color:var(--mirrim-ink-700)}

/* ---------- 7 · ниши ---------- */
.niches{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.niche{padding:26px 24px 26px;border-radius:var(--mirrim-radius-lg);display:flex;flex-direction:column;transition:transform .18s,box-shadow .22s}
.niche:hover{transform:translateY(-3px);box-shadow:0 18px 38px -20px rgba(46,16,101,.3)}
.niche__ic{width:44px;height:44px;border-radius:13px;background:linear-gradient(150deg,#C9B8FF,#7C3AED);display:grid;place-items:center;margin-bottom:15px}
.niche__ic svg{width:22px;height:22px;stroke:#fff;stroke-width:2;fill:none}
.niche h3{font-size:19px;font-weight:800;margin-bottom:12px}
.bundle{display:flex;flex-direction:column;gap:7px}
.bundle span{font:700 13.5px/1.25 var(--mirrim-font-text);padding:9px 12px;border-radius:10px;background:var(--mirrim-purple-50);color:var(--mirrim-purple-700)}
.niche__note{margin-top:14px;padding-top:12px;border-top:1px solid rgba(124,58,237,.1);font:600 13.5px/1.35 var(--mirrim-font-text);color:var(--mirrim-ink-500)}

/* ---------- 8 · внедрение ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
.step{padding:26px 24px;border-radius:var(--mirrim-radius-lg)}
.step__n{width:42px;height:42px;border-radius:13px;background:var(--mirrim-purple-500);color:#fff;display:grid;place-items:center;font:800 18px/1 var(--mirrim-font-display);margin-bottom:16px;box-shadow:var(--mirrim-shadow-cta)}
.step h3{font-size:18.5px;font-weight:800;margin-bottom:7px}
.step p{font-size:15.5px;color:var(--mirrim-ink-600)}
.nos{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.no{display:flex;gap:12px;align-items:flex-start;padding:18px 20px;border-radius:var(--mirrim-radius-md);background:rgba(255,255,255,.6);border:1px solid rgba(124,58,237,.12);font:700 15.5px/1.4 var(--mirrim-font-text)}
.no svg{width:19px;height:19px;stroke:var(--mirrim-success);stroke-width:3;fill:none;margin-top:2px;flex:0 0 auto}

/* ---------- 9 · FAQ ---------- */
.faq{display:flex;flex-direction:column;gap:12px;max-width:880px}
.fq{border-radius:var(--mirrim-radius-lg);overflow:hidden}
.fq__q{width:100%;display:flex;align-items:center;gap:18px;padding:24px 26px;text-align:left;font:800 19px/1.35 var(--mirrim-font-display)}
.fq__q:hover{color:var(--mirrim-purple-600)}
.fq__ch{width:32px;height:32px;border-radius:50%;background:var(--mirrim-purple-50);display:grid;place-items:center;margin-left:auto;flex:0 0 auto;transition:transform .24s,background .18s}
.fq__ch svg{width:16px;height:16px;stroke:var(--mirrim-purple-600);stroke-width:2.6;fill:none}
.fq.open .fq__ch{transform:rotate(180deg);background:var(--mirrim-purple-500)}
.fq.open .fq__ch svg{stroke:#fff}
.fq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.22,1,.36,1)}
.fq.open .fq__a{grid-template-rows:1fr}
.fq__a>div{overflow:hidden}
.fq__a p{padding:0 26px 24px;font-size:17px;color:var(--mirrim-ink-600);max-width:740px;text-wrap:pretty}

/* ---------- 10 · переход в события ---------- */
.cross{display:flex;align-items:center;gap:28px;padding:36px 40px;background:linear-gradient(150deg,rgba(124,58,237,.95),rgba(46,16,101,.96));color:#fff;border-color:rgba(255,255,255,.2)}
.cross::before{background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent)}
.cross__ic{width:64px;height:64px;border-radius:19px;background:rgba(255,255,255,.14);display:grid;place-items:center;flex:0 0 auto}
.cross__ic svg{width:31px;height:31px;stroke:var(--mirrim-lime-500);stroke-width:2;fill:none}
.cross h3{font-size:24px;font-weight:800;margin-bottom:7px}
.cross p{font-size:17px;color:rgba(255,255,255,.8);max-width:560px}
.cross .btn{margin-left:auto;flex:0 0 auto}

/* ---------- 11 · финальный CTA ---------- */
.final{padding:58px 54px;text-align:center;background:rgba(255,255,255,.72)}
.final h2{font-size:clamp(32px,4.2vw,50px);font-weight:800;line-height:1.06}
.final p{margin-top:18px;font-size:20px;color:var(--mirrim-ink-600);max-width:620px;margin-inline:auto}
.final .btn-row{justify-content:center;margin-top:32px}
.final__note{margin-top:20px;font:500 15px/1.4 var(--mirrim-font-text);color:var(--mirrim-ink-400)}

/* ---------- футер ---------- */
.foot{padding:60px 0 40px;border-top:1px solid rgba(124,58,237,.12);background:rgba(255,255,255,.5)}
.foot__grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:34px}
.foot__logo{height:28px;width:auto;margin-bottom:16px}
.foot__ab{font-size:15.5px;color:var(--mirrim-ink-500);max-width:280px}
.foot h4{font:800 15px/1 var(--mirrim-font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--mirrim-ink-400);margin-bottom:16px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot li a{font:600 15.5px/1.3 var(--mirrim-font-text);color:var(--mirrim-ink-700)}
.foot li a:hover{color:var(--mirrim-purple-600)}
.foot__bar{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:40px;padding-top:24px;border-top:1px solid rgba(124,58,237,.1);font:500 14.5px/1.3 var(--mirrim-font-text);color:var(--mirrim-ink-400)}
.foot__bar a{color:var(--mirrim-ink-500)}

/* ---------- липкий CTA ---------- */
.sticky{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;padding:12px 16px calc(12px + env(safe-area-inset-bottom));gap:10px;background:rgba(251,250,255,.9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid rgba(124,58,237,.14)}
.sticky .btn{flex:1;height:54px;font-size:16px;padding:0 14px}

/* ============================================================
   АДАПТИВЫ · 1440 / 768 / 390
   ============================================================ */
@media (max-width:1120px){
  .niches{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .base{grid-template-columns:repeat(2,1fr)}
  .foot__grid{grid-template-columns:1.4fr repeat(2,1fr);row-gap:34px}
}
@media (max-width:1040px){.nav__links{display:none}}
/* --- планшет 768 --- */
@media (max-width:900px){
  section{padding:74px 0}
  .wrap{width:min(1120px,100% - 40px)}
  .hero{padding:26px 0 64px}
  .hero__grid{grid-template-columns:1fr;gap:40px}
  .hmock{grid-template-columns:minmax(0,1fr)}
  .levwrap{grid-template-columns:1fr;gap:24px}
  .lev{grid-template-columns:repeat(2,1fr)}
  .tool__bd{grid-template-columns:1fr}
  .tool__mk{border-left:0;border-top:1px solid rgba(124,58,237,.1);padding:24px}
  .tl2{grid-template-columns:1fr}
  .cyc{flex-wrap:wrap}
  .cycs{flex:1 1 42%}
  .cycarr{display:none}
  .anl{grid-template-columns:1fr;gap:26px}
  .chan{grid-template-columns:repeat(2,1fr)}
  .nos{grid-template-columns:1fr}
  .cross{flex-wrap:wrap;padding:30px 26px;gap:20px}
  .cross .btn{margin-left:0;width:100%}
  .final{padding:44px 28px}
}
/* --- мобайл: текучий 320…620 --- */
@media (max-width:620px){
  section{padding:clamp(40px,11vw,56px) 0}
  .wrap{width:calc(100% - clamp(24px,8vw,32px))}
  body{padding-bottom:84px}
  .nav__cta .btn--ghost{display:none}
  h2.sec-t{font-size:clamp(26px,7.6vw,32px)}
  .sec-sub{font-size:clamp(16px,4.4vw,18px)}
  .sec-hd{margin-bottom:30px}
  .crumbs{padding-top:18px;font-size:14px}
  .hero h1{font-size:clamp(28px,8.8vw,38px)}
  .hero__sub{font-size:clamp(16.5px,4.6vw,19px)}
  .hero .btn-row,.hero .btn-row .btn{width:100%}
  .btn{height:56px;font-size:17px;padding:0 22px}
  .hmock{grid-template-columns:1fr;padding:16px;gap:16px}
  .phone{width:min(200px,60%);margin-inline:auto}
  .lev{grid-template-columns:1fr;gap:12px}
  .levc{padding:22px 20px}
  .levc h3{font-size:clamp(19px,5.4vw,22px)}
  .levside{padding:24px 20px}
  .levside .split{flex-direction:column}
  /* инструменты — раскрывающиеся карточки */
  .tool__bd{display:block;padding:0 18px 18px}
  .tool__tx{padding:0}
  .tool>summary{display:flex;list-style:none;align-items:center;gap:12px;padding:18px;cursor:pointer;min-height:64px}
  .tool>summary::-webkit-details-marker{display:none}
  .tool__sum{font:800 clamp(17px,4.9vw,20px)/1.25 var(--mirrim-font-display)}
  .tool__sum span{display:block;font:700 12px/1 var(--mirrim-font-text);color:var(--mirrim-purple-500);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
  .tool__ch{width:30px;height:30px;border-radius:50%;background:var(--mirrim-purple-50);display:grid;place-items:center;margin-left:auto;flex:0 0 auto;transition:transform .24s}
  .tool__ch svg{width:15px;height:15px;stroke:var(--mirrim-purple-600);stroke-width:2.6;fill:none}
  .tool[open] .tool__ch{transform:rotate(180deg)}
  .tool h3{display:none}
  .tool__tag{display:none}
  .tool__what{font-size:15.5px}
  .tool__mk{border:0;background:none;padding:16px 0 0;justify-content:flex-start}
  .mkp{max-width:100%}
  /* ниши — карусель */
  .niches{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(clamp(24px,8vw,32px)/-2);padding:4px calc(clamp(24px,8vw,32px)/2) 14px;scrollbar-width:none}
  .niches::-webkit-scrollbar{display:none}
  .niche{flex:0 0 min(290px,80%);scroll-snap-align:center}
  .swipe{display:flex;align-items:center;gap:8px;font:700 13.5px/1 var(--mirrim-font-text);color:var(--mirrim-ink-400);margin-top:-6px}
  .swipe svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.4;fill:none}
  .steps{grid-template-columns:1fr;gap:12px}
  .base{grid-template-columns:1fr}
  .chan{grid-template-columns:1fr}
  .cycs{flex:1 1 100%}
  .split2{grid-template-columns:1fr}
  .dash--big .chart{height:96px}
  .fq__q{padding:20px;font-size:17.5px}
  .fq__a p{padding:0 20px 20px;font-size:16px}
  .cross{padding:24px 20px;flex-direction:column;align-items:flex-start}
  .cross h3{font-size:clamp(20px,5.6vw,23px)}
  .final{padding:clamp(26px,8vw,36px) clamp(18px,6vw,24px)}
  .final h2{font-size:clamp(27px,8vw,34px)}
  .final p{font-size:clamp(16px,4.6vw,18px)}
  .final .btn-row .btn{width:100%}
  .foot__grid{grid-template-columns:1fr;gap:28px}
  .sticky{display:flex}
}
@media (max-width:360px){
  .crumbs a{padding:8px 12px}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi:last-child{grid-column:1/-1}
}
@media (max-width:900px) and (max-height:520px) and (orientation:landscape){
  .hero__grid{grid-template-columns:1fr 1fr;gap:26px;align-items:start}
  .niches{display:grid;grid-template-columns:repeat(2,1fr);overflow:visible;margin-inline:0;padding:0}
  .niche{flex:auto}
  .steps{grid-template-columns:repeat(2,1fr)}
  .swipe{display:none!important}
}

/* ============================================================
   ЛЕГЕНДА · business.mirrim.games/tools
   ------------------------------------------------------------
   ТОКЕНЫ (styles/tokens.css):
     purple-500 #7C3AED — primary; 300 #A78BFA — акцент;
     700 #5B21B6 / 900 #2E1065 — тёмные плашки-«итоги»;
     lime-500 #C6F432 — CTA и «результат механики» (текст #0A0A0A);
     ink-50…900 — нейтрали; success #5DD33C — «не требуется / готово».
     Радиусы 12/16/20/24/28/pill. Manrope: display 800, h 700, текст 500.

   ПРАВИЛО КОПИРАЙТА (ЖЁСТКОЕ):
     Никаких обещаний выручки, процентов роста, «×2 к возврату».
     Описываем ТОЛЬКО механику и её логику: что делает гость,
     что делает сотрудник, что попадает в базу, что видно в аналитике.
     Все числа на мокапах — интерфейсные примеры, а не результаты.

   ЯЗЫК СТРАНИЦЫ (отличие от /events):
     Светлое стекло и белые дашборды — основной тон, деловой.
     Тёмное фиолетовое — редко: рамка мышления (.levside) и переход
     на /events (.cross). Лайм = рычаг, к которому ведёт инструмент.
     Мокапы: телефон гостя (карта, колесо, скретч) и кабинет (.dash).

   КОМПОНЕНТЫ:
     .crumbs      — «← Ко всем направлениям» (связь с /)
     .hmock       — герой: карта лояльности + база в кабинете
     .levc        — рычаг (частота / чек / удержание / возврат)
     .tool        — развёрнутый инструмент; на мобайле <details>
     .cyc/.cycs   — цикл «собрал → база → сегмент → промокод → возврат»
     .bs          — свойства базы (выгрузка, согласия, сегменты)
     .dash        — мокап кабинета: KPI, динамика, каналы, точки
     .chn+.plate  — где размещать QR + печатные макеты
     .niche       — ниша с готовой связкой инструментов
     .step/.no    — внедрение и «что НЕ нужно»
     .fq          — FAQ; .cross — переход на /events; .final,.sticky — CTA

   СВЯЗЬ СТРАНИЦ:
     /             — развилка «События | Бизнес»
     /tools (эта)  — крошки вверх на «/», .cross вниз на /events
     /events       — интерактивы для событий
   ============================================================ */