:root{
  --bg:#0B0D12;
  --bg2:#13161D;
  --red:#FF3B1F;
  --gold:#FFD23F;
  --cyan:#4DABF7;
  --text:#FFFFFF;
  --muted:#A0A0B0;
}
*{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  width:100%;
}
h1,h2,h3,h4,.font-display{ font-family:'Manrope',sans-serif; letter-spacing:-0.02em; }
.font-mono{ font-family:'JetBrains Mono',monospace; }
.gradient-wow{ background:linear-gradient(135deg,#FF3B1F 0%,#FFD23F 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.gradient-data{ background:linear-gradient(135deg,#4DABF7 0%,#FFD23F 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.bg-wow{ background:linear-gradient(135deg,#FF3B1F 0%,#FFD23F 100%); }
.glass{ background:rgba(255,255,255,0.04); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,0.08); }
.glass-strong{ background:rgba(255,255,255,0.06); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); border:1px solid rgba(255,255,255,0.12); }
.glow-red{ box-shadow:0 0 60px rgba(255,59,31,0.25); }
.glow-gold{ box-shadow:0 0 60px rgba(255,210,63,0.3); }
.glow-cyan{ box-shadow:0 0 60px rgba(77,171,247,0.25); }

/* Grid background */
.grid-bg{
  background-image:
    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size:60px 60px;
}

/* Buttons */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  gap:10px; padding:16px 28px; font-weight:600; font-size:15px; border-radius:12px;
  white-space:nowrap; text-align:center; line-height:1.2;
  transition:all .3s cubic-bezier(0.25,0.46,0.45,0.94); overflow:hidden;
}
.btn-primary{ background:linear-gradient(135deg,#FF3B1F,#FFD23F); color:#0B0D12; }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 20px 40px -10px rgba(255,59,31,0.5); }
.btn-ghost{ background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); color:#fff; }
.btn-ghost:hover{ background:rgba(255,255,255,0.1); border-color:rgba(255,210,63,0.4); }

/* Magnetic — transform only; do not override display (keeps inline-flex / flex intact) */
.magnetic{ transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94); }

/* Card tilt */
.tilt-card{ transform-style:preserve-3d; transition:transform .3s cubic-bezier(0.03,0.98,0.52,0.99); }

/* Animated underline */
.link-underline{ position:relative; }
.link-underline::after{
  content:''; position:absolute; left:0; bottom:-4px; width:0; height:2px;
  background:linear-gradient(90deg,#FF3B1F,#FFD23F); transition:width .3s;
}
.link-underline:hover::after{ width:100%; }

/* Yandex search line */
.ya-search{
  background:rgba(255,255,255,0.08); backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,0.12); border-radius:20px;
  padding:18px 26px; display:flex; align-items:center; gap:14px;
}
.ya-caret{ display:inline-block; width:2px; height:1.1em; background:var(--gold); vertical-align:middle; animation:blink 1s infinite; }
@keyframes blink{ 50%{ opacity:0; } }

/* SERP item */
.serp-item{
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08);
  padding:14px 18px; border-radius:12px; display:flex; align-items:center; gap:16px;
  transition:all .5s;
}
.serp-item.target{ background:linear-gradient(90deg,rgba(255,59,31,0.12),rgba(255,210,63,0.1)); border-color:rgba(255,210,63,0.4); box-shadow:0 0 40px rgba(255,210,63,0.15); }
.serp-rank{ font-family:'JetBrains Mono',monospace; font-weight:700; color:var(--muted); min-width:36px; }
.serp-item.target .serp-rank{ color:var(--gold); }

/* Number counter */
.counter{ font-variant-numeric:tabular-nums; }

/* Section heading */
.section-tag{
  display:inline-flex; align-items:center; gap:8px; padding:6px 14px;
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1);
  border-radius:100px; font-size:13px; color:var(--muted); font-family:'JetBrains Mono',monospace;
}
.section-tag::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--red); box-shadow:0 0 10px var(--red); animation:pulse 2s infinite; }
@keyframes pulse{ 50%{ opacity:.4; } }

/* Scrollbar */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--bg); }
::-webkit-scrollbar-thumb{ background:rgba(255,255,255,0.1); border-radius:10px; }
::-webkit-scrollbar-thumb:hover{ background:rgba(255,59,31,0.4); }

/* Floating dots */
.floating-dot{
  position:absolute; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(255,210,63,0.6) 0%, transparent 70%);
  filter:blur(1px);
}

/* Timeline */
.timeline-line{
  position:absolute; left:30px; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg, transparent 0%, rgba(255,59,31,0.3) 10%, rgba(255,210,63,0.3) 50%, rgba(77,171,247,0.3) 90%, transparent 100%);
}
@media (min-width:1024px){
  .timeline-line{ left:50%; transform:translateX(-50%); }
}

/* Case carousel */
.carousel-track{ display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory; padding:10px 4px 30px; scrollbar-width:none; }
.carousel-track::-webkit-scrollbar{ display:none; }
.carousel-track > *{ scroll-snap-align:start; flex-shrink:0; }
.case-image-open{ display:block; border:0; padding:0; background:transparent; }
.case-image-modal{
  position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center;
  padding:16px;
}
.case-image-modal[hidden]{ display:none !important; }
.case-image-modal__backdrop{
  position:absolute; inset:0; background:rgba(5,7,12,0.92); backdrop-filter:blur(8px);
}
.case-image-modal__dialog{
  position:relative; z-index:1; width:min(96vw,1200px); max-height:92vh;
  display:flex; flex-direction:column; gap:12px;
}
.case-image-modal__title{
  color:#fff; font-size:14px; font-family:var(--font-mono, monospace); text-align:center; opacity:0.85;
}
.case-image-modal__body{
  overflow:auto; border-radius:12px; border:1px solid rgba(255,255,255,0.12);
  background:#0b0d12; box-shadow:0 24px 80px rgba(0,0,0,0.55);
}
.case-image-modal__body img{
  display:block; width:100%; height:auto; max-height:calc(92vh - 64px); object-fit:contain;
}
.case-image-modal__close{
  position:absolute; top:-8px; right:0; transform:translateY(-100%);
  width:40px; height:40px; border:1px solid rgba(255,255,255,0.15); border-radius:999px;
  background:rgba(255,255,255,0.06); color:#fff; font-size:24px; line-height:1; cursor:pointer;
}
.case-image-modal__close:hover{ border-color:var(--gold); color:var(--gold); }

/* Mini dashboard previews */
.dash-preview{ border:1px solid rgba(255,255,255,0.08); }
.dash-preview__head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:16px; }
.dash-preview__live{
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:0.08em;
  color:var(--gold); padding:4px 8px; border-radius:999px;
  background:rgba(255,210,63,0.12); border:1px solid rgba(255,210,63,0.25);
}
.dash-preview__metric{ font-family:'JetBrains Mono',monospace; font-size:2rem; font-weight:700; line-height:1; margin-bottom:4px; }
.dash-preview__bars{ display:flex; align-items:flex-end; gap:6px; height:72px; margin-top:12px; }
.dash-preview__bar{ flex:1; border-radius:6px 6px 2px 2px; background:linear-gradient(180deg, rgba(255,210,63,0.85), rgba(255,59,31,0.35)); min-height:8px; }
.dash-preview__bar--muted{ background:linear-gradient(180deg, rgba(77,171,247,0.8), rgba(77,171,247,0.2)); }
.dash-preview__bar--green{ background:linear-gradient(180deg, rgba(72,199,142,0.85), rgba(72,199,142,0.2)); }
.dash-preview__bar--red{ background:linear-gradient(180deg, rgba(255,59,31,0.85), rgba(255,59,31,0.2)); }

/* Form inputs */
.form-input{
  width:100%; padding:16px 20px; background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.1); border-radius:12px;
  color:#fff; font-size:15px; transition:all .25s;
}
.form-input:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 4px rgba(255,210,63,0.1); background:rgba(255,255,255,0.06); }
.form-input::placeholder{ color:rgba(255,255,255,0.35); }

/* Marquee */
.marquee{ display:flex; overflow:hidden; mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.marquee-track{ display:flex; gap:60px; animation:marquee 30s linear infinite; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* Accordion */
.faq-item{ border-bottom:1px solid rgba(255,255,255,0.08); }
.faq-q{ display:flex; justify-content:space-between; align-items:center; padding:24px 0; cursor:pointer; transition:color .2s; }
.faq-q:hover{ color:var(--gold); }
.faq-q .icon{ width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,0.05); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:transform .3s, background .3s; }
.faq-item.open .faq-q .icon{ transform:rotate(45deg); background:var(--red); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .4s ease; color:var(--muted); }
.faq-item.open .faq-a{ max-height:500px; }

/* Nav blur */
.nav-blur{ backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }

/* Noise texture */
.noise{
  position:fixed; inset:0; pointer-events:none; z-index:1; opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Hero glow orbs */
.orb{ position:absolute; border-radius:50%; filter:blur(80px); opacity:.3; pointer-events:none; }
.orb-red{ background:#FF3B1F; }
.orb-gold{ background:#FFD23F; }
.orb-cyan{ background:#4DABF7; }

/* Service card hover chart */
.mini-chart{ height:60px; opacity:0; transition:opacity .3s; }
.service-card:hover .mini-chart{ opacity:1; }

/* Homepage service cards — accent colors (no inline Jinja in style=) */
.svc-card-glow{ transform:translate(30%,-30%); }
.svc-card-glow-0{ background:#FF3B1F; }
.svc-card-glow-1{ background:#FFD23F; }
.svc-card-glow-2{ background:#4DABF7; }
.svc-card-glow-3{ background:#B57BFF; }
.svc-card-icon-0{ background:linear-gradient(135deg,#FF3B1F,#FFD23F); }
.svc-card-icon-1{ background:linear-gradient(135deg,#FFD23F,#4DABF7); }
.svc-card-icon-2{ background:linear-gradient(135deg,#4DABF7,#B57BFF); }
.svc-card-icon-3{ background:linear-gradient(135deg,#B57BFF,#FF3B1F); }

/* Pricing card highlight */
.pricing-highlight{ position:relative; }
.pricing-highlight::before{
  content:''; position:absolute; inset:-1px; border-radius:20px; padding:1px;
  background:linear-gradient(135deg,#FF3B1F,#FFD23F);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}

/* Comparison table */
.compare-cell{ padding:20px 24px; border-bottom:1px solid rgba(255,255,255,0.06); }
.compare-head{ font-weight:700; }
.compare-row{ transition:background .2s; }
.compare-row:hover{ background:rgba(255,255,255,0.03); }
.compare-wow{ background:linear-gradient(180deg, rgba(255,59,31,0.08) 0%, rgba(255,210,63,0.04) 100%); }

/* Mobile comparison cards */
.compare-mobile{ display:flex; flex-direction:column; gap:12px; padding:16px; }
.compare-card{
  border:1px solid rgba(255,255,255,0.08); border-radius:16px;
  background:rgba(255,255,255,0.03); overflow:hidden;
}
.compare-card-title{
  padding:14px 16px; font-size:13px; font-weight:600;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.compare-card-row{
  display:grid; grid-template-columns:96px 1fr; gap:10px;
  align-items:center; padding:12px 16px;
  border-bottom:1px solid rgba(255,255,255,0.04); font-size:13px;
}
.compare-card-row:last-child{ border-bottom:none; }
.compare-card-row.wow{
  background:linear-gradient(90deg, rgba(255,59,31,0.12), rgba(255,210,63,0.06));
}
.compare-card-label{
  font-family:'JetBrains Mono',monospace; font-size:10px;
  letter-spacing:0.04em; color:var(--muted); text-transform:uppercase;
}
.compare-card-row.wow .compare-card-label{ color:var(--gold); }
.compare-card-value{ display:flex; align-items:center; gap:6px; line-height:1.3; }
@media (min-width:768px){
  .compare-mobile{ display:none; }
}
@media (max-width:767px){
  .compare-desktop{ display:none; }
}

/* Reveal */
.reveal{ opacity:0; transform:translateY(40px); transition:opacity .8s, transform .8s; }
.reveal.visible{ opacity:1; transform:translateY(0); }

/* Ticker tape */
.ticker-badge{ display:inline-flex; align-items:center; gap:8px; padding:8px 16px; background:rgba(255,210,63,0.1); border:1px solid rgba(255,210,63,0.3); border-radius:100px; font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--gold); }
.ticker-badge--dark{
  background:rgba(8,10,14,0.9); border:1px solid rgba(255,255,255,0.14);
  color:#fff; backdrop-filter:blur(8px); box-shadow:0 8px 24px rgba(0,0,0,0.35);
}
.ticker-badge--dark .dot{ background:var(--gold); }
.ticker-badge .dot{ width:8px; height:8px; border-radius:50%; background:var(--gold); animation:pulse 1.5s infinite; }

/* Confetti */
.confetti{ position:fixed; width:8px; height:14px; pointer-events:none; z-index:9999; }

/* Sticky CTA */
.sticky-cta{ position:fixed; bottom:24px; right:24px; z-index:50; opacity:0; transform:translateY(20px); pointer-events:none; transition:all .4s; }
.sticky-cta.show{ opacity:1; transform:translateY(0); pointer-events:auto; }
@media (max-width:640px){ .sticky-cta{ bottom:16px; right:16px; left:16px; } .sticky-cta .btn{ width:100%; justify-content:center; } }

/* Modal */
.modal{ position:fixed; inset:0; background:rgba(0,0,0,0.85); backdrop-filter:blur(16px); display:none; z-index:90; overflow-y:auto; }
.modal.show{ display:block; animation:fadeIn .3s; }

/* Chart canvas container */
.chart-wrap{ position:relative; width:100%; max-width:100%; min-width:0; overflow:hidden; }
.chart-wrap canvas,
.mini-chart-wrap canvas{ width:100% !important; max-width:100% !important; height:100% !important; }
.mini-chart-wrap{
  position:relative; width:100%; max-width:100%; min-width:0;
  height:64px; overflow:hidden;
}
.problem-card, .service-card{ min-width:0; max-width:100%; }
@media (max-width:767px){
  .problem-card{ padding:20px !important; }
  #problem .grid{ gap:16px; }
  #problem h2{ font-size:clamp(28px,8vw,40px); }
  #problem h3{ font-size:1.25rem; }
}

/* Selection */
::selection{ background:var(--gold); color:var(--bg); }

/* Utility */
.text-balance{ text-wrap:balance; }
.container-main{ max-width:1440px; margin:0 auto; padding:0 16px; width:100%; box-sizing:border-box; }
@media (min-width:480px){ .container-main{ padding:0 24px; } }
@media (min-width:768px){ .container-main{ padding:0 48px; } }

/* Lucide icons */
i[data-lucide], svg.lucide{
  display:inline-block; vertical-align:-0.125em; flex-shrink:0;
}
.icon-lg{ width:40px; height:40px; stroke-width:1.5; color:var(--gold); }
.icon-md{ width:28px; height:28px; stroke-width:1.75; color:var(--gold); }
.icon-sm{ width:16px; height:16px; stroke-width:2; }
.icon-xs{ width:14px; height:14px; stroke-width:2; vertical-align:-2px; }
.icon-inline{ width:14px; height:14px; stroke-width:2; vertical-align:-2px; margin-right:4px; }
.check-icon{ color:var(--gold); width:16px; height:16px; stroke-width:2.5; }
.status-ok{ color:#22c55e; }
.status-no{ color:#ef4444; }
.status-warn{ color:#f59e0b; }

/* Hero search input animation */
.typing-text{ display:inline-block; vertical-align:middle; }

/* Rank animation helper */
.rank-up{ animation:rankUp 2s cubic-bezier(0.34,1.56,0.64,1); }
@keyframes rankUp{ 0%{ transform:translateY(80px); opacity:0; } 100%{ transform:translateY(0); opacity:1; } }

/* Glow ring for CTA */
.glow-ring{ position:relative; }
.glow-ring::before{
  content:''; position:absolute; inset:-2px; border-radius:14px; padding:2px;
  background:linear-gradient(135deg,#FF3B1F,#FFD23F,#4DABF7);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:rotate 4s linear infinite;
}
@keyframes rotate{
  0%{ filter:hue-rotate(0deg); }
  100%{ filter:hue-rotate(360deg); }
}

/* Hero scan line */
.scan-line{
  position:absolute; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
  animation:scanMove 4s linear infinite;
}
@keyframes scanMove{ 0%{ top:0; opacity:0; } 10%{ opacity:1; } 90%{ opacity:1; } 100%{ top:100%; opacity:0; } }

/* Logo mark */
.logo-mark{
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.logo-mark svg{ display:block; }
body.sw-page { cursor: auto; }

/* Article / Quill HTML body */
.article-body{
line-height:var(--article-line-height, 1.75);
font-size:1.0625rem;
color:var(--muted);
}
.article-body h2{
color:#E4E4EE;
font-size:clamp(1.35rem, 3vw, 1.75rem);
font-weight:600;
margin-top:0;
margin-bottom:1rem;
line-height:1.25;
}
.article-body h3{
color:#D4D4E0;
font-size:1.2rem;
font-weight:600;
margin-top:0;
margin-bottom:0.75rem;
}
.article-body p{ margin-top:0; margin-bottom:1rem; }
/* Пустая строка Quill: <p><br></p> */
.article-body p:empty,
.article-body p:has(> br:only-child){
margin-top:1.25rem;
margin-bottom:1.25rem;
min-height:0.25rem;
}
.article-body :is(p, ul, ol) + h2{ margin-top:0.5rem; }
.article-body :is(p, ul, ol) + h3{ margin-top:0.25rem; }
.article-body h2 + p,
.article-body h3 + p{ margin-top:0.75rem; }
.article-body ul,
.article-body ol{
margin:1rem 0 1.25rem 0;
padding-left:1.75rem;
list-style-position:outside;
}
.article-body ul{ list-style-type:disc; }
.article-body ol{ list-style-type:decimal; }
.article-body li{
display:list-item;
margin-bottom:0.5rem;
padding-left:0.35rem;
}
.article-body li::marker{ color:var(--gold); }
.article-body ol li::marker{ color:var(--gold); font-weight:600; }
.article-body a{ color:var(--gold); text-decoration:underline; text-underline-offset:2px; }
.article-body a:hover{ color:var(--text); }
.article-body strong{ color:#E8E8F0; font-weight:600; }
.article-body table{
width:100%;
border-collapse:collapse;
margin:1.25rem 0;
border:1px solid rgba(255,255,255,0.18);
font-size:0.95rem;
}
.article-body th,
.article-body td{
border:1px solid rgba(255,255,255,0.14);
padding:0.75rem 1rem;
text-align:left;
vertical-align:top;
}
.article-body th{
color:#E4E4EE;
background:rgba(255,255,255,0.07);
font-weight:600;
}
.article-body tbody tr:nth-child(even) td{
background:rgba(255,255,255,0.03);
}
.article-body caption{
caption-side:bottom;
padding-top:0.5rem;
font-size:0.875rem;
color:var(--muted);
}
/* Tables inside articles: don't squash on mobile */
.article-body table,
.article-body table th,
.article-body table td{
word-break:normal;
overflow-wrap:normal;
hyphens:manual;
}
.article-table-wrap{
margin:1.25rem 0;
max-width:100%;
min-width:0;
}
@media (max-width:767px){
.article-table-wrap--stack table{
  display:block;
  width:100%;
  margin:0;
  border:none;
}
.article-table-wrap--stack thead{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.article-table-wrap--stack tbody{ display:block; }
.article-table-wrap--stack tr{
  display:block;
  margin-bottom:0.75rem;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:0.75rem;
  overflow:hidden;
  background:rgba(255,255,255,0.03);
}
.article-table-wrap--stack tr:last-child{ margin-bottom:0; }
.article-table-wrap--stack td{
  display:block;
  border:none;
  border-bottom:1px solid rgba(255,255,255,0.08);
  padding:0.65rem 1rem;
}
.article-table-wrap--stack td:last-child{ border-bottom:none; }
.article-table-wrap--stack td[data-label]::before{
  content:attr(data-label);
  display:block;
  font-size:0.68rem;
  font-family:ui-monospace,monospace;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:var(--gold);
  margin-bottom:0.35rem;
  opacity:0.9;
}
.article-table-wrap--stack td:first-child{
  background:rgba(255,255,255,0.05);
  font-weight:600;
  color:#E4E4EE;
}
.article-table-wrap--stack td:first-child[data-label]::before{ display:none; }
.article-table-wrap--scroll{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:0.75rem;
}
.article-table-wrap--scroll table{
  margin:0;
  width:max-content;
  min-width:100%;
}
}