/* ===== БАЗА: сетка, типографика, компоненты ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Manrope',system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden;text-align: center;justify-content:center;}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
p{cursor: default;}
h1,h2,h3{font-family:'Unbounded','Manrope',sans-serif;line-height:1.2;cursor: default;}
h1{font-size:clamp(1.6rem,4.2vw,3rem);font-weight:900}
h2{font-size:clamp(1.3rem,3vw,2.1rem);font-weight:700;margin-bottom:.6em}
h3{font-size:1.02rem;font-weight:700;margin:.5em 0 .35em}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.grad{background:linear-gradient(92deg,var(--acc),var(--acc2) 60%,var(--acc3));-webkit-background-clip:text;background-clip:text;color:transparent}
.over{color:var(--acc);letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;font-weight:700;margin-bottom:14px}
.lead{color:var(--muted);font-size:1.05rem}
.sec{padding:76px 0}
.sec-alt{background:var(--bg2)}
/* header */
.hdr{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:18px;padding:12px 20px}
.logo{display:flex;align-items:center;gap:10px;margin-right:auto}
.logo-ic{width:38px;height:38px}
.lg-bg{fill:var(--favbg)} .lg-pl{fill:none;stroke:var(--acc);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:60;animation:lgdraw 2.6s ease-in-out infinite}
.lg-dot{fill:var(--acc2);animation:lgblink 2.6s infinite}
@keyframes lgdraw{0%{stroke-dashoffset:60}55%{stroke-dashoffset:0}100%{stroke-dashoffset:0}}
@keyframes lgblink{0%,60%{opacity:1}70%,90%{opacity:.15}100%{opacity:1}}
.logo-tx{font-family:'Unbounded';font-weight:700;font-size:1.4rem;line-height:1.5;margin-left: auto;}
.logo-tx b{display:block;font:600 .62rem 'Manrope';color:var(--muted);letter-spacing:.18em;text-transform:uppercase}
.nav{display:flex;gap:20px;font-weight:600;font-size:.92rem}
.nav a{color:var(--muted);transition:color .2s}.nav a:hover{color:var(--acc)}
.hdr-ctl{display:flex;align-items:center;gap:10px}
.seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{background:transparent;border:0;color:var(--text);padding:6px 8px;cursor:pointer;font-size:.9rem;transition:background .2s}
.seg button.on{background:var(--acc);color:#111}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font:700 .95rem 'Manrope';color:#14100a;background:linear-gradient(94deg,var(--acc),var(--acc2));padding:12px 22px;border-radius:12px;transition:transform .18s,box-shadow .18s;box-shadow:0 6px 22px var(--glow)}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px var(--glow)}
.btn-big{padding:15px 28px;font-size:1.02rem}
.btn-s{padding:8px 16px;font-size:.85rem}
.btn-ghost{background:transparent;color:var(--text);border:1.5px solid var(--acc);box-shadow:none}
.btn-line{background:transparent;color:var(--muted);box-shadow:none}
.btn-line:hover{color:var(--acc)}
/* hero */
.hero{position:relative;padding:84px 0 64px;overflow:hidden;justify-content:center;}
.hero-in{position:relative;z-index:1;justify-content:center;}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0 22px}
.facts{display:flex;flex-wrap:wrap;gap:10px 22px;list-style:none;color:var(--muted);font-weight:600;font-size:.9rem;justify-content:center;}
.tab-hint{margin-top:26px;color:var(--acc3);font-size:.95rem}
/*Pulse*/
.pulse { position: relative; /*display: flex;*/ align-items: center; justify-content: center; }
.pulse::before { content: ' '; 
	position: absolute; 
	height: 100%; 
	width: 100%;
	/*height: 10px;  
	width: 110px;*/
	border-radius: 25%; 
	/*background: rgba(28, 25, 23, 0.95);
	border: #f59e0b 2px solid;*/
	animation: pulse-ring 3s cubic-bezier(0.215, 0.61, 0.355, 1) infinite; 
	z-index: -1; 
}
@keyframes pulse-ring { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 15px rgba(245, 158, 11, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); } }

/* Пульсирующая точка */
.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.5;
        transform: scale(0.9);
    }
}


.animate-pulse-round {
    animation: pulse-glow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse-glow-round {
    0%, 100% {
        opacity: 1;
        box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7);
    }
    50% {
        opacity: 0.8;
        box-shadow: 0 0 0 8px rgba(251, 191, 36, 0);
    }
}

/* grids, cards */
.grid{display:grid;gap:16px;margin-top:26px}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(5,1fr)}
.g6{grid-template-columns:repeat(6,1fr)}
.g7{grid-template-columns:repeat(7,1fr)}
.g8{grid-template-columns:repeat(8,1fr)}
.g9{grid-template-columns:repeat(9,1fr)}
.g10{grid-template-columns:repeat(10,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;position:relative;transition:transform .25s,border-color .25s,box-shadow .25s;cursor: default;}
.card:hover{transform:translateY(-2px);transition: all 0.3s ease;border-color:var(--acc);box-shadow:0 12px 34px var(--glow)}
.card .em{font-size:1.7rem}
.card p{color:var(--muted);font-size:.93rem;}
.card.pop:hover{margin-top:-2px;box-shadow:0 10px 30px var(--glow)}

/* browser mock */
.browser{margin:30px auto 22px;max-width:860px;border:1px solid var(--line);border-radius:16px;background:var(--card);overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.br-bar{display:flex;align-items:center;gap:7px;padding:10px 14px;background:var(--bg2)}
.dot{width:11px;height:11px;border-radius:50%}.dot.r{background:#ff5f57}.dot.y{background:#febc2e}.dot.g{background:#28c840}
.br-url{margin-left:10px;flex:1;background:var(--bg);border-radius:8px;padding:5px 14px;color:var(--muted);font-size:.8rem; text-align: left;}
.br-tabs{display:flex;gap:6px;padding:10px 12px 0;background:var(--bg2);overflow:hidden;}
.br-tab{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:10px 10px 0 0;background:var(--bg2);color:var(--muted);font-size:.82rem;max-width:220px}
.br-tab.on{background:var(--card);color:var(--text);box-shadow:0 -4px 14px var(--glow)}
.br-fav{width:26px;height:26px;flex:none;display:grid;place-items:center}
.br-fav.st{background:var(--line);border-radius:6px}
.br-fav svg,.szbox svg{width:100%;height:100%}
.br-x{opacity:.5}
.br-body{padding:22px;display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between}
.sizes{display:flex;gap:18px;align-items:flex-end}
.sz{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted);font-size:.72rem}
.s16{width:16px;height:16px}.s32{width:32px;height:32px}.s64{width:64px;height:64px}
.demo-ctl{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.timer{font-weight:800;color:var(--acc);font-size:1.1rem}
.hint{width:100%;color:var(--muted);font-size:.85rem}


.work svg {width:auto;height:100px;}
.work .card {min-width:128.5px;max-width:128.5px;padding:10px;}
.work .card svg{
	text-align: center;
    justify-content: center;
    display: inline-block;
	width: 125px;
    height: auto;
	border-radius: 10px;
}

/* work_2 */

.list li {list-style-type: none;}
.list li:before {
    content: "✓ ";
    color: #f59e0b;
    font-weight: 700;
}
.list {
    text-align: left;
    justify-self: center;
}

.work .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));
    gap: 18px;
}
.preview {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px 0 6px;
}

.work_2 .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
    gap: 18px;
}
.work_2 .preview svg {
    width: 96px;
    height: 96px;
    display: block;
    transition: transform .25s;
}
.work_2 .name {
    font-weight: 700;
    text-align: center;
    font-size: 15px;
}
.work_2 .card {
    padding: 1px;
}
.preview_img {
	text-align:center;
	width:140px;
	background: var(--card);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding:5px;
    position: relative;
	
}
.preview_img svg {
	text-align: center;
    justify-content: center;
    display: inline-block;
	width: 125px;
    height: auto;
}
.descr_img {margin-top:8px;font-size:12px;color:#555;}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}
.chips button{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;padding:9px 16px;font:600 .85rem 'Manrope';cursor:pointer;transition:.2s}
.chips button:hover{border-color:var(--acc);color:var(--acc)}
.chips button.on{background:var(--acc);border-color:var(--acc);color:#14100a;font-weight:800}
/* price */
.price .card{display:flex;flex-direction:column}
.price ul{list-style:none;margin:12px 0 18px;display:grid;gap:8px;color:var(--muted);font-size:.88rem;}
.price li{text-align: left}
.price li::before{content:"✔";color:var(--acc);margin-right:8px;text-align: left;}
.price .p{font-family:'Unbounded';font-size:1.5rem;color:var(--acc);margin:6px 0 2px}
.price .btn{margin-top:auto}
.pop{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),0 14px 40px var(--glow)}
.pop-tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,var(--acc),var(--acc2));color:#14100a;font:800 .72rem 'Manrope';padding:5px 14px;border-radius:999px;letter-spacing:.06em}
.note{margin-top:18px;color:var(--muted);font-size:.92rem}
.note a{color:var(--acc)}
/* steps */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:26px}
.step{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}
.step b{font-family:'Unbounded';color:var(--acc);font-size:1.2rem}
.step p{color:var(--muted);font-size:.86rem}
/* faq, seo */
.faq-w{max-width:840px}
details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-bottom:10px}
summary{cursor:pointer;font-weight:700}
details p{color:var(--muted);margin-top:8px;font-size:.93rem}
details[open]{border-color:var(--acc)}
.seo p{color:var(--muted);font-size:.92rem;margin-bottom:12px}
/* final */
.final{text-align:center}
.final .lead{margin:0 auto}
.final {justify-content:center;width:100%;}

.cta-row{justify-content:center;width:100%;}

.consent{display:inline-flex;gap:10px;align-items:flex-start;max-width:520px;margin:6px auto 0;color:var(--muted);font-size:.85rem;text-align:left;cursor:pointer}
.consent a{color:var(--acc);text-decoration:underline}
.consent input{accent-color:var(--acc);width:18px;height:18px;margin-top:2px;flex:none}
.consent.shake{animation:shake .4s}
@keyframes shake{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-4px)}}
.consent-msg{color:var(--acc2);font-size:.85rem;margin-top:8px}
.contacts{display:flex;flex-wrap:wrap;gap:14px 26px;justify-content:center;margin-top:26px;font-weight:600}
.contacts a:hover{color:var(--acc)}
/* footer */
.ftr{border-top:1px solid var(--line);padding:26px 0;background:var(--bg2)}
.ftr-in{display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:space-between;color:var(--muted);font-size:.82rem}
.ftr-l{display:flex;gap:18px}.ftr-l a:hover{color:var(--acc)}

/* cookie, refbar */
.cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;
	display:flex;gap:14px;align-items:center;
	justify-content:space-between;
	background:var(--card);border:1px solid var(--acc);border-radius:14px;
	padding:12px 18px;font-size:.88rem;box-shadow:0 12px 40px rgba(0,0,0,.5);
	width: 98%;}

.cookie a{color:var(--acc);text-decoration:underline}
.refbar{position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:55;background:linear-gradient(90deg,var(--acc),var(--acc2));color:#14100a;font:700 .85rem 'Manrope';padding:9px 20px;border-radius:999px;box-shadow:0 8px 30px var(--glow)}
/* reveal base */
.rev{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.rev.in{opacity:1;transform:none}
/* responsive */
@media(max-width:960px){.g3,.g4{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.nav{display:none}}
@media(max-width:620px){.g3,.g4{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.hdr-ctl .btn-s{display:none}.br-tab:not(.on){display:none}}

/* ===== БЕГУЩАЯ СТРОКА ВКЛАДКИ ===== */
.br-title{flex:1;min-width:0;max-width:120px;overflow:hidden;white-space:nowrap;}
.br-title-in{display:inline-block;white-space:nowrap;animation:brmarq 19s linear infinite;will-change:transform;}

/*.br-title-in{outline:1px solid red;}
.br-a{outline:1px solid lime;}*/

@keyframes brmarq{
  /* 0%,26.3%   {transform:translateX(0);} */ 
  47.4%,100% {transform:translateX(var(--shift,0));}
}

.bold{font-weight:700;}
.colorF93 {color: #F93;}
.underline {text-decoration: underline #F93;}
.line_red {outline:1px solid red;}
.line_lime {outline:1px solid lime;}
.line_yellow {text-decoration: underline;}
.line_white {outline:1px solid white;}
.line_black {outline:1px solid black;}

/* модалка выбора канала связи */
.modal{position:fixed;inset:0;z-index:80;background:rgba(5,6,10,.72);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px}
.modal[hidden]{display:none}
.modal-box{width:100%;max-width:440px;max-height:90vh;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.modal-x{position:absolute;top:8px;right:14px;background:none;border:0;color:var(--muted);font-size:1.5rem;cursor:pointer}
.modal h3{font-size:1.05rem;margin-bottom:6px}
.modal-sub{color:var(--muted);font-size:.86rem;margin-bottom:14px}
.m-row{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;font-weight:700;font-size:.92rem;transition:.2s}
.m-row:hover{border-color:var(--acc);transform:translateX(3px)}
.m-ic{width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:8px;background:var(--bg2);font:800 .72rem 'Manrope';color:var(--acc)}
.m-badge{margin-left:auto;font:600 .66rem 'Manrope';color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 8px;white-space:nowrap}
.m-badge.ok{color:#3DDC97;border-color:rgba(61,220,151,.4)}
.m-badge.warn{color:var(--acc3);border-color:var(--acc)}
.modal .consent{margin-top:10px}
.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);z-index:90;background:var(--card);border:1px solid var(--acc);border-radius:12px;padding:10px 18px;font-size:.88rem;opacity:0;pointer-events:none;transition:.3s}
.toast.show{opacity:1;transform:translate(-50%,0)}


.no-wrap { display: inline-block; white-space: nowrap;}
.hide { display:none; } /* Скрываем лишние элементы <span class="hide"></span> */

/* ================ МОБИЛЬНАЯ ВЕРСИЯ ================ */

.show_mob { display:none; } /* Скрываем элементы мобильной версии на большом экране */


@media (max-width: 1230px) {

	.hide_mob { display:none; } /* Скрываем лишние элементы в мобильной версии <span class="hide_mob"></span> */
	.show_mob { display:block; } /* Отображаем элементы только в мобильной версии  <span class="show_mob"><br></span>  */
	
	.hero h1 {line-height: 0.8;}
	.detector-card { padding: 1rem;}
	
	.logo-tx {margin-left:40px;}
	.demo-ctl {margin-left:35px;}
	.demo-ctl #stopBtn {margin-left:20px;}
	
	h2 {font-size: 1.5rem;}
	
	.work .grid {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));
		gap: 10px;
	}

	.work .card {
		max-width: 100%;
	}
	.work_2 .card {
		max-width: 100%;
	}
	.work_2 .preview_img {
		width: 46%;
	}
	.cookie{width: 90%;}
}

@media (max-width: 1024px) {

	.hide_mob { display:none; } /* Скрываем лишние элементы в мобильной версии <span class="hide_mob"></span> */
	.show_mob { display:block; } /* Отображаем элементы только в мобильной версии  <span class="show_mob"><br></span>  */
	
	.hero h1 {line-height: 0.8;}
	.detector-card { padding: 1rem;}
	
	.logo-tx {margin-left:40px;}
	.demo-ctl {margin-left:35px;}
	.demo-ctl #stopBtn {margin-left:20px;}
	
	h2 {font-size: 1.5rem;}
	
	.work .grid {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));
		gap: 10px;
	}

	.work .card {
		max-width: 100%;
	}
	.work_2 .card {
		max-width: 100%;
	}
	.work_2 .preview_img {
		width: 46%;
	}

}

@media (max-width: 768px) {
	
	/* 
	.section { padding: 6rem 1rem; }
    .header-container { flex-direction: column; gap: 1rem; }
    nav { flex-wrap: wrap; justify-content: center; gap: 1rem; }
    .hero h1 { font-size: 4rem; }
    .hero-stats { grid-template-columns: repeat(2, 1fr); }
    .features-grid, .markets-grid, .reviews-grid, .pricing-grid { grid-template-columns: 1fr; }
    .review-card { min-width: 100%; max-width: 100%; }
    .pricing-card.popular { transform: scale(1); }
    .theme-toggle { bottom: 20px; right: 20px; width: 45px; height: 45px; }
    .animation-toggle { bottom: 82px; right: 20px; width: 45px; height: 45px; }
    .toggle-tooltip { bottom: 135px; right: 15px; font-size: 10px; }
	.exchanges-list { grid-template-columns: 1fr; }
    .exchange-item { flex-direction: column; align-items: flex-start; }
    .exchange-link { max-width: 100%; }
    .ping-container { width: 100%; justify-content: flex-start; }
	.section-title { font-size: 2.2rem; }
	*/
	/*gap: 0.75rem;*/
	
	.hide_mob { display:none; } /* Скрываем лишние элементы в мобильной версии <span class="hide_mob"></span> */
	.show_mob { display:block; } /* Отображаем элементы только в мобильной версии  <span class="show_mob"><br></span>  */
	
	.hero h1 {line-height: 0.8;}
	.detector-card { padding: 1rem;}
	
	.logo-tx {margin-left:40px;}
	.demo-ctl {margin-left:35px;}
	.demo-ctl #stopBtn {margin-left:20px;}
	
	h2 {font-size: 1.5rem;}
	
	.work .grid {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));
		gap: 10px;
	}

	.work .card {
		max-width: 100%;
	}
	.work_2 .card {
		max-width: 100%;
	}
	.work_2 .preview_img {
		width: 46%;
	}
	
	
}











