/* ---------- Inter (самохост: 2 subset-файла, вариативный вес 400–800) ---------- */
@font-face{font-family:"Inter";font-style:normal;font-weight:400 800;font-display:swap;
    src:url(/media/fonts/inter-cyrillic.woff2) format("woff2");
    unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116;}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 800;font-display:swap;
    src:url(/media/fonts/inter-latin.woff2) format("woff2");
    unicode-range:U+0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ---------- Токены темы (меняйте градиент здесь) ---------- */
:root{
    --g1:#2563eb;
    --g2:#7c3aed;
    --blue:#2563eb;
    --blue-dark:#1d4ed8;
    --ink:#0f172a;
    --muted:#64748b;
    --line:#e2e8f0;
    --bg:#ffffff;
    --bg-soft:#f8fafc;
    --maxw:1200px;
}

/* ---------- Сброс ---------- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
    -webkit-font-smoothing:antialiased;
    line-height:1.5;
}
.quizi *{box-sizing:border-box;}
.quizi img{max-width:100%;display:block;}
.quizi a{color:inherit;}
::selection{background:rgba(37,99,235,0.16);}

/* ---------- Утилиты ---------- */
.q-wrap{position:relative;overflow:hidden;}
.q-container{max-width:var(--maxw);margin:0 auto;padding-left:40px;padding-right:40px;}
.q-grad-text{
    background:linear-gradient(90deg,var(--g1),var(--g2));
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:transparent;
}
.q-btn{
    display:inline-block;text-decoration:none;font-weight:600;
    border-radius:8px;transition:background .18s ease,border-color .18s ease;
    cursor:pointer;
}
.q-btn-primary{background:var(--blue);color:#fff;padding:14px 28px;font-size:15px;}
.q-btn-primary:hover{background:var(--blue-dark);}
.q-btn-ghost{background:#fff;color:var(--ink);padding:14px 28px;font-size:15px;border:1px solid var(--line);}
.q-btn-ghost:hover{border-color:#cbd5e1;background:var(--bg-soft);}

/* ---------- Reveal-анимация (прогрессивное улучшение) ----------
   Анимация только при .has-js (класс ставит inline-скрипт в начале страницы).
   Без JS блоки видны сразу — общий layout шаблона НЕ трогаем. */
.q-reveal{opacity:1;transform:none;}
.has-js .q-reveal{opacity:0;transform:translateY(28px);
    transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);}
.has-js .q-reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
    .has-js .q-reveal{transition:none;opacity:1;transform:none;}
}

/* ================= HERO ================= */

/* Свечения (.hero-glow*) и точечная сетка (.hero-grid-dots) удалены 06.08.2026:
   первый экран переделан по направлению A, эти элементы из разметки ушли, и
   ни один шаблон их больше не выводит. */


.nav{display:flex;align-items:center;justify-content:space-between;padding:8px 0 72px;}
.brand{display:flex;align-items:center;gap:10px;}
.brand-mark{width:26px;height:26px;border-radius:7px;background:var(--blue);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.brand-name{color:var(--ink);font-weight:700;font-size:18px;letter-spacing:-.02em;}
.brand-name .tld{color:#94a3b8;}
.nav-links{display:flex;align-items:center;gap:36px;}
.nav-links a{color:var(--muted);text-decoration:none;font-size:14px;font-weight:500;}
.nav-links a.nav-cta{color:#fff;font-weight:600;background:var(--blue);padding:9px 18px;border-radius:8px;transition:background .18s;}
.nav-links a.nav-cta:hover{background:var(--blue-dark);}
.nav-toggle{display:none;}











/* Hero mockup — окно редактора */
.editor{background:#fff;border-radius:14px;border:1px solid var(--line);overflow:hidden;
    box-shadow:0 40px 80px -30px rgba(15,23,42,.22);}
.editor-bar{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid var(--line);background:var(--bg-soft);}
.dot{width:11px;height:11px;border-radius:50%;opacity:.7;}
.dot.r{background:#ef4444;}.dot.y{background:#f59e0b;}.dot.g{background:#22c55e;}
.editor-url{flex:1;text-align:center;color:#94a3b8;font-size:12px;}
.editor-body{background:var(--bg-soft);}
.editor-toolbar{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;background:#fff;border-bottom:1px solid #e5e7eb;}
.editor-toolbar .tb-left{display:flex;align-items:center;gap:8px;color:#374151;font-weight:600;font-size:12px;}
.editor-toolbar .tb-right{display:flex;gap:8px;}
.tb-chip{padding:5px 11px;border:1px solid #e5e7eb;border-radius:6px;color:#6b7280;font-size:11px;}
.tb-chip.pri{background:var(--blue);color:#fff;border:0;font-weight:500;}
.editor-cols{display:grid;grid-template-columns:118px 1fr 108px;}
.ed-panel{background:#fff;padding:13px 9px;}
.ed-panel.left{border-right:1px solid #e5e7eb;display:flex;flex-direction:column;gap:4px;}
.ed-panel.right{border-left:1px solid #e5e7eb;padding:13px 11px;display:flex;flex-direction:column;gap:13px;}
.ed-label{color:#9ca3af;font-size:9px;font-weight:600;letter-spacing:.06em;}
.ed-step{display:flex;align-items:center;gap:7px;padding:7px 8px;color:#6b7280;font-size:11px;}
.ed-step.active{background:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;color:#1e40af;font-weight:500;}
.ed-dot{width:5px;height:5px;border-radius:50%;background:#cbd5e1;}
.ed-step.active .ed-dot{background:var(--blue);}
.ed-add{margin-top:3px;padding:7px 8px;color:var(--blue);font-size:11px;font-weight:500;}
.ed-canvas{padding:18px;background:var(--bg-soft);}
.ed-card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:18px;}
.ed-progress{display:flex;gap:4px;margin-bottom:14px;}
.ed-progress span{height:3px;flex:1;background:#e5e7eb;border-radius:2px;}
.ed-progress span.on{background:var(--blue);}
.ed-count{color:#9ca3af;font-size:10px;margin-bottom:7px;}
.ed-q{display:inline-block;color:#111827;font-size:15px;font-weight:700;letter-spacing:-.01em;border-bottom:1.5px dashed #cbd5e1;padding-bottom:3px;margin-bottom:14px;}
.ed-opts{display:flex;flex-direction:column;gap:8px;}
.ed-opt{display:flex;align-items:center;gap:8px;border:1px solid #e5e7eb;border-radius:7px;padding:8px 9px;}
.ed-opt.on{border-color:var(--blue);background:#eff6ff;}
.ed-grip{color:#cbd5e1;font-size:11px;letter-spacing:-1px;}
.ed-opt.on .ed-grip{color:#93c5fd;}
.ed-key{width:18px;height:18px;border-radius:5px;background:#f1f5f9;color:#6b7280;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;}
.ed-opt.on .ed-key{background:var(--blue);color:#fff;}
.ed-opt-txt{color:#374151;font-size:12px;}
.ed-opt.on .ed-opt-txt{color:#1e3a8a;font-weight:500;}
.ed-addopt{margin-top:12px;color:var(--blue);font-size:11px;font-weight:500;}
.ed-field-label{color:#6b7280;font-size:10px;margin-bottom:5px;}
.ed-select{display:flex;align-items:center;justify-content:space-between;border:1px solid #e5e7eb;border-radius:6px;padding:6px 8px;color:#374151;font-size:11px;}
.ed-toggle-row{display:flex;align-items:center;justify-content:space-between;}
.ed-toggle-row span:first-child{color:#374151;font-size:11px;}
.ed-switch{width:26px;height:15px;border-radius:999px;background:var(--blue);position:relative;display:inline-block;}
.ed-switch:after{content:"";position:absolute;top:2px;right:2px;width:11px;height:11px;border-radius:50%;background:#fff;}

/* ================= СЕКЦИИ ================= */
.sec{background:var(--bg);}
.sec.soft{background:var(--bg-soft);}
.sec.dark{background:#0f172a;}
.sec-pad{padding-top:120px;padding-bottom:120px;}

/* Цифры */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:96px 40px;max-width:var(--maxw);margin:0 auto;}
.stat{padding-right:40px;}
.stat + .stat{border-left:1px solid var(--line);padding-left:40px;}
.stat-num{color:var(--blue);font-size:48px;font-weight:800;letter-spacing:-.03em;line-height:1;}
.stat-label{color:var(--muted);font-size:15px;margin-top:12px;line-height:1.5;}

/* Почему */
.why{display:grid;grid-template-columns:360px 1fr;gap:80px;align-items:start;}
.why h2{font-size:40px;font-weight:600;letter-spacing:-.03em;margin:0;line-height:1.15;position:sticky;top:60px;color:var(--ink);}
.why-row{padding:40px 0;border-top:1px solid var(--line);}
.why-row:first-child{padding:0 0 40px;border-top:0;}
.why-row h3{font-size:22px;font-weight:700;letter-spacing:-.02em;margin:0 0 12px;color:var(--ink);}
.why-row p{color:var(--muted);font-size:16px;line-height:1.6;margin:0;max-width:560px;}

/* Как работает */
.sec-title{font-size:44px;font-weight:600;letter-spacing:-.03em;margin:0 0 72px;text-align:center;line-height:1.1;color:var(--ink);}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.step{padding-right:28px;}
.step + .step{border-left:1px solid var(--line);padding-left:28px;}
.step-num{font-size:72px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--line);}
.step h3{font-size:19px;font-weight:700;letter-spacing:-.02em;margin:18px 0 10px;color:var(--ink);}
.step p{color:var(--muted);font-size:15px;line-height:1.6;margin:0 0 22px;}
.shot{height:96px;border-radius:8px;overflow:hidden;}
.shot.lite{border:1px solid #e5e7eb;background:#fff;}
.shot-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;line-height:1.7;}

/* Возможности */
.feat-head h2{font-size:44px;font-weight:600;letter-spacing:-.03em;margin:0 0 16px;line-height:1.1;color:var(--ink);}
.feat-head p{color:var(--muted);font-size:18px;margin:0 0 72px;max-width:520px;line-height:1.6;}
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:48px;}
.feat-col h3{font-size:17px;font-weight:700;letter-spacing:-.01em;margin:0 0 20px;color:var(--ink);}
.feat-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.feat-col li{color:var(--muted);font-size:15px;display:flex;gap:10px;}
.feat-col li .m{color:var(--blue);}

/* Для кого */
.niches{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 64px;}
.niche-ic{width:46px;height:46px;border-radius:11px;background:#eff6ff;display:flex;align-items:center;justify-content:center;color:var(--blue);margin-bottom:18px;}
.niche h3{font-size:18px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px;color:var(--ink);}
.niche p{color:var(--muted);font-size:15px;line-height:1.5;margin:0;}

/* Интеграции */
.int-glow{position:absolute;top:50%;right:-100px;transform:translateY(-50%);width:480px;height:480px;border-radius:50%;filter:blur(120px);opacity:.3;background:radial-gradient(circle,var(--g1),transparent 70%);z-index:0;pointer-events:none;}
.int-inner{position:relative;z-index:1;padding:100px 40px;max-width:var(--maxw);margin:0 auto;}
.int-title{font-size:36px;font-weight:600;letter-spacing:-.03em;margin:0 0 12px;text-align:center;line-height:1.15;color:#fff;}
.int-sub{color:#94a3b8;font-size:16px;margin:0 0 56px;text-align:center;}
.int-list{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;}
.int-chip{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px 22px;filter:grayscale(1);opacity:.75;transition:filter .2s,opacity .2s,border-color .2s;}
.int-chip:hover{filter:grayscale(0);opacity:1;border-color:rgba(255,255,255,.25);}
.int-chip span.nm{color:#cbd5e1;font-size:20px;font-weight:600;letter-spacing:-.01em;}

/* Тарифы */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start;}
.plan{position:relative;border-radius:16px;padding:32px;background:#fff;border:1px solid var(--line);}
.plan.hl{border:2px solid var(--blue);box-shadow:0 24px 50px -24px rgba(37,99,235,.28);}
.plan-badge{position:absolute;top:-13px;left:32px;background:var(--blue);color:#fff;font-size:12px;font-weight:600;padding:5px 14px;border-radius:999px;}
.plan-name{font-size:17px;font-weight:700;margin-bottom:20px;color:var(--ink);}
.plan-price{display:flex;align-items:baseline;gap:6px;margin-bottom:6px;}
.plan-price .amt{font-size:48px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--ink);}
.plan-price .per{color:var(--muted);font-size:15px;}
.plan-desc{color:var(--muted);font-size:14px;margin:4px 0 28px;line-height:1.5;}
.plan-cta{display:block;text-align:center;font-size:15px;font-weight:600;text-decoration:none;padding:13px;border-radius:8px;transition:background .18s,border-color .18s;}
.plan-cta.pri{background:var(--blue);color:#fff;}
.plan-cta.pri:hover{background:var(--blue-dark);}
.plan-cta.sec{background:#fff;border:1px solid var(--line);color:var(--ink);}
.plan-cta.sec:hover{border-color:#cbd5e1;background:var(--bg-soft);}
.plan-feats{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:13px;}
.plan-feats li{display:flex;gap:10px;align-items:center;font-size:14px;color:#334155;}
.plan-feats li.off{color:#94a3b8;}
.plan-feats li .mk{flex-shrink:0;width:16px;display:flex;}
.plan-feats li .mk .dash{color:#cbd5e1;font-weight:600;}

/* FAQ */
.faq{max-width:900px;margin:0 auto;padding:120px 40px;}
.faq h2{font-size:44px;font-weight:600;letter-spacing:-.03em;margin:0 0 48px;line-height:1.1;color:var(--ink);}
.faq details{border-top:1px solid var(--line);padding:4px 0;}
.faq details > summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;font-size:18px;font-weight:600;letter-spacing:-.01em;color:var(--ink);}
.faq details > summary::-webkit-details-marker{display:none;}
.faq summary .ic{flex-shrink:0;transition:transform .2s ease;}
.faq details[open] summary .ic{transform:rotate(45deg);}
.faq details p{color:var(--muted);font-size:16px;line-height:1.65;margin:0 0 24px;max-width:720px;}
.faq-end{border-top:1px solid var(--line);}

/* Финальный CTA */
.cta{position:relative;overflow:hidden;background:var(--bg-soft);}
.cta-glow{position:absolute;top:0;left:50%;transform:translateX(-50%);width:640px;height:360px;border-radius:50%;filter:blur(130px);opacity:.12;background:radial-gradient(circle,var(--g2),transparent 70%);z-index:0;pointer-events:none;}
.cta-inner{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:130px 40px;text-align:center;}
.cta h2{color:var(--ink);font-size:48px;font-weight:700;letter-spacing:-.03em;margin:0 auto 32px;line-height:1.1;max-width:720px;}
.cta-btn{display:inline-block;background:var(--blue);color:#fff;font-size:16px;font-weight:600;text-decoration:none;padding:16px 36px;border-radius:8px;transition:background .18s;}
.cta-btn:hover{background:var(--blue-dark);}
.cta-note{color:#94a3b8;font-size:14px;margin:20px 0 0;}

/* Footer */
.footer{background:#0f172a;}
.footer-top{max-width:var(--maxw);margin:0 auto;padding:72px 40px 48px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;}
.footer .brand-name{color:#fff;}
.footer .brand-name .tld{color:#64748b;}
.footer-about{color:#94a3b8;font-size:14px;line-height:1.6;margin:16px 0 0;max-width:280px;}
.footer-col-title{color:#fff;font-size:14px;font-weight:600;margin-bottom:16px;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.footer-col a{color:#94a3b8;text-decoration:none;font-size:14px;}
.footer-col a:hover{color:#cbd5e1;}
.footer-bottom{max-width:var(--maxw);margin:0 auto;padding:24px 40px 40px;border-top:1px solid rgba(255,255,255,.08);color:#64748b;font-size:13px;}

/* ================= АДАПТИВ ================= */
@media (max-width:1024px){
    
    .stats{gap:0;}
    .stat-num{font-size:40px;}
    .step-num{font-size:60px;}
}
@media (max-width:900px){
    .q-container,.stats,.int-inner,.cta-inner,.footer-top,.footer-bottom,.faq{padding-left:24px;padding-right:24px;}
    .nav{padding:8px 0 40px;}
    .nav-links{gap:20px;}
    
    
    
    .sec-pad{padding-top:80px;padding-bottom:80px;}
    .stats{grid-template-columns:1fr 1fr;gap:32px 0;padding:64px 24px;}
    .stat,.stat + .stat{padding:0 24px;border-left:1px solid var(--line);}
    .stat:nth-child(2n/**/+1){border-left:0;padding-left:0;}
    .why{grid-template-columns:1fr;gap:32px;}
    .why h2{position:static;font-size:34px;}
    .sec-title{font-size:34px;margin-bottom:48px;}
    .steps{grid-template-columns:1fr 1fr;gap:40px 0;}
    .step,.step + .step{padding:0 24px;border-left:1px solid var(--line);}
    .step:nth-child(2n/**/+1){border-left:0;padding-left:0;}
    .feat-grid{grid-template-columns:1fr 1fr;gap:40px;}
    .feat-head h2{font-size:34px;}
    .niches{grid-template-columns:1fr 1fr;gap:40px;}
    .int-title{font-size:30px;}
    .int-inner{padding:80px 24px;}
    .plans{grid-template-columns:1fr;gap:32px;max-width:440px;margin:0 auto;}
    .plan.hl{order:-1;}
    .faq{padding:80px 24px;}
    .faq h2{font-size:34px;}
    .cta-inner{padding:90px 24px;}
    .cta h2{font-size:36px;}
    .footer-top{grid-template-columns:1fr 1fr;gap:40px;}
}
@media (max-width:600px){
    .nav-links{display:none;}
    .nav-links.open{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:4px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin:0 24px;box-shadow:0 20px 40px -20px rgba(15,23,42,.25);z-index:20;}
    .nav-links.open a{padding:10px 8px;width:100%;}
    .nav-links.open a.nav-cta{text-align:center;justify-content:center;}
    .nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;}
    
    
    
    
    .editor-cols{grid-template-columns:1fr;}
    .ed-panel.left,.ed-panel.right{display:none;}
    .stats{grid-template-columns:1fr;gap:28px;}
    .stat,.stat + .stat{border-left:0!important;padding:0!important;}
    .steps{grid-template-columns:1fr;gap:36px;}
    .step,.step + .step{border-left:0;padding:0;}
    .feat-grid{grid-template-columns:1fr;gap:32px;}
    .niches{grid-template-columns:1fr;gap:32px;}
    .int-chip{padding:12px 16px;}
    .int-chip span.nm{font-size:16px;}
    .footer-top{grid-template-columns:1fr;gap:32px;}
    .sec-title,.feat-head h2,.faq h2,.why h2,.int-title{font-size:28px;}
    .cta h2{font-size:28px;}
    .plan-price .amt{font-size:40px;}
}
/* ================= БЛОГ / НОВОСТИ / КЕЙСЫ ================= */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.blog-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;
    display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s;}
.blog-card:hover{box-shadow:0 12px 40px -12px rgba(15,23,42,.14);transform:translateY(-2px);}
.blog-tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.04em;
    padding:4px 10px;border-radius:6px;margin:16px 16px 0;text-transform:uppercase;}
.blog-tag--case{background:#eff6ff;color:var(--blue);}
.blog-tag--article{background:#f0fdf4;color:#16a34a;}
.blog-tag--news{background:#fef3c7;color:#d97706;}
.blog-img{height:160px;background:var(--bg-soft);display:flex;align-items:center;
    justify-content:center;margin:12px 16px;border-radius:10px;border:1px solid var(--line);}
.blog-img--placeholder span{font-size:48px;opacity:.6;}
.blog-body{padding:0 20px;flex:1;}
.blog-meta{color:#94a3b8;font-size:12px;margin-bottom:10px;}
.blog-body h3{font-size:17px;font-weight:700;letter-spacing:-.01em;margin:0 0 10px;
    color:var(--ink);line-height:1.35;}
.blog-body p{color:var(--muted);font-size:14px;line-height:1.55;margin:0;}
.blog-footer{padding:16px 20px;border-top:1px solid var(--line);margin-top:16px;}
.blog-coming{font-size:13px;color:#94a3b8;font-style:italic;}

@media (max-width:900px){.blog-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.blog-grid{grid-template-columns:1fr;}}

/* ================= ПРИМЕРЫ КВИЗОВ ================= */
.examples-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.example-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;transition:box-shadow .2s;}
.example-card:hover{box-shadow:0 8px 32px -8px rgba(15,23,42,.12);}
.example-ic{font-size:32px;margin-bottom:16px;}
.example-card h3{font-size:17px;font-weight:700;letter-spacing:-.01em;margin:0 0 12px;color:var(--ink);}
.example-card p{color:var(--muted);font-size:14px;line-height:1.55;margin:0 0 8px;}
.example-card p:last-child{margin-bottom:0;}
.ex-label{color:var(--blue);font-weight:600;}

/* ================= НОВОСТИ (перелинковка) ================= */
.ql-news-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.ql-news-all{color:var(--blue);font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap;}
.ql-news-all:hover{color:var(--blue-dark);}
.ql-news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.ql-news-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;text-decoration:none;transition:box-shadow .2s,border-color .2s;}
.ql-news-card:hover{box-shadow:0 8px 32px -8px rgba(15,23,42,.12);border-color:#cbd5e1;}
.ql-news-date{color:var(--muted);font-size:13px;font-weight:500;margin-bottom:12px;}
.ql-news-card h3{font-size:17px;font-weight:700;letter-spacing:-.01em;margin:0 0 12px;color:var(--ink);}
.ql-news-card p{color:var(--muted);font-size:14px;line-height:1.55;margin:0 0 16px;}
.ql-news-more{margin-top:auto;color:var(--blue);font-weight:600;font-size:14px;}
@media (max-width:1024px){.ql-news-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.ql-news-grid{grid-template-columns:1fr;}}

/* ================= РАБОТАЕТ НА ЛЮБЫХ САЙТАХ ================= */
.cms-list{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:28px;}
.cms-item{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 22px;
    font-size:15px;font-weight:500;color:var(--ink);}
.cms-note{text-align:center;color:var(--muted);font-size:15px;max-width:600px;margin:0 auto;line-height:1.6;}

/* ================= СРАВНЕНИЕ ================= */
.compare-wrap{overflow-x:auto;margin-bottom:28px;}
.compare-table{width:100%;border-collapse:collapse;font-size:15px;}
.compare-table th{padding:14px 20px;text-align:left;font-size:13px;font-weight:600;
    color:var(--muted);border-bottom:2px solid var(--line);}
.compare-table th.compare-us{color:var(--blue);}
.compare-table td{padding:14px 20px;border-bottom:1px solid var(--line);color:var(--ink);}
.compare-table td.compare-us{font-weight:600;color:var(--blue);}
.compare-table tr:last-child td{border-bottom:0;}
.compare-table tr:hover td{background:var(--bg-soft);}
.compare-note{color:var(--muted);font-size:14px;line-height:1.6;max-width:680px;margin:0 auto;
    text-align:center;padding:20px;background:#fff;border:1px solid var(--line);border-radius:12px;}

@media (max-width:900px){
    .examples-grid{grid-template-columns:1fr 1fr;}
    .compare-table th,.compare-table td{padding:12px 14px;font-size:14px;}
}
@media (max-width:600px){
    .examples-grid{grid-template-columns:1fr;}
    .cms-list{gap:8px;}
    .cms-item{font-size:14px;padding:10px 16px;}
}
    

/* ===== Живой демо-квиз в hero (перенесён со старой главной, адаптирован под светлый hero) ===== */


















@media (max-width:600px){}

/* ===== Модалки документов (оферта/политика и т.п.) ===== */
.modal-content{position:fixed;inset:0;z-index:200;display:none;}
.modal-content.active{display:block;}
.modal-content .modal-bg{position:absolute;inset:0;background:rgba(10,16,28,.6);}
.modal-content .modal-container{position:relative;z-index:2;max-width:820px;max-height:84vh;overflow:auto;
    margin:6vh auto 0;background:#fff;border-radius:16px;padding:26px 28px;}
.modal-content .modal-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;}
.modal-content .modal-header span{font-size:19px;font-weight:700;color:var(--ink);}
.modal-content .close-modal{cursor:pointer;font-size:24px;line-height:1;color:#667085;text-decoration:none;}
.modal-content .close-modal:hover{color:var(--ink);}
.modal-content .modal-page__content{color:#334155;font-size:15px;line-height:1.7;}

/* ===== Тарифы: переключатель пакета (Task 14) ===== */
.plan-packages{display:inline-flex;gap:4px;background:#eef2f8;padding:3px;border-radius:10px;margin:0 0 10px}
.plan-pkg{border:0;background:transparent;padding:6px 12px;border-radius:7px;font-size:13px;color:#475569;cursor:pointer}
.plan-pkg.on{background:#fff;color:#2563eb;font-weight:600}

/* ================= НОВОСТНЫЕ СТРАНИЦЫ (/news, /news/{slug}) ================= */
.news-top{position:relative;background:#fff;border-bottom:1px solid var(--line);}
.news-top .nav{padding:14px 0;}
.news-sec{padding:56px 0 88px;}
.news-page-head{max-width:720px;margin:0 0 48px;}
.news-page-head h1{font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1.1;margin:0 0 14px;color:var(--ink);}
.news-page-head p{color:var(--muted);font-size:18px;line-height:1.6;margin:0;}
.news-intro{margin:0 0 40px;}
.news-empty{padding:56px 24px;text-align:center;color:var(--muted);font-size:16px;background:var(--bg-soft);border:1px solid var(--line);border-radius:16px;}
/* Карточка с картинкой (листинг) */
.ql-news-thumb{display:block;height:170px;border-radius:12px;margin:-6px 0 18px;background-size:cover;background-position:center;background-color:#eef2f8;}
.ql-news-card--img{padding-top:22px;}
/* Статья */
.news-article{max-width:760px;margin:0 auto;}
.news-back{display:inline-block;color:var(--blue);font-weight:600;font-size:14px;text-decoration:none;margin-bottom:24px;}
.news-back:hover{color:var(--blue-dark);}
.news-article-date{color:var(--muted);font-size:14px;font-weight:500;margin-bottom:12px;}
.news-article h1{font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1.12;margin:0 0 28px;color:var(--ink);}
.news-article-cover{width:100%;border-radius:16px;border:1px solid var(--line);margin:0 0 32px;}
.news-article-foot{display:flex;flex-wrap:wrap;gap:14px;margin-top:48px;padding-top:32px;border-top:1px solid var(--line);}
/* Prose — тело статьи/интро из CMS */
.q-prose{color:#334155;font-size:16px;line-height:1.75;}
.q-prose > *:first-child{margin-top:0;}
.q-prose p{margin:0 0 18px;}
.q-prose h2{font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:36px 0 14px;line-height:1.2;}
.q-prose h3{font-size:20px;font-weight:700;color:var(--ink);margin:28px 0 12px;}
.q-prose ul,.q-prose ol{margin:0 0 18px;padding-left:22px;}
.q-prose li{margin:0 0 8px;}
.q-prose a{color:var(--blue);text-decoration:underline;}
.q-prose a:hover{color:var(--blue-dark);}
.q-prose img{max-width:100%;height:auto;border-radius:12px;margin:20px 0;}
.q-prose blockquote{margin:20px 0;padding:8px 20px;border-left:3px solid var(--blue);color:var(--muted);}
.q-prose table{width:100%;border-collapse:collapse;margin:20px 0;}
.q-prose th,.q-prose td{border:1px solid var(--line);padding:10px 14px;text-align:left;font-size:15px;}
.q-prose p:empty{display:none;}
/* Галереи из CMS-контента (co_lines/banner__item/highslide).
   ВАЖНО: style.css задаёт `.banner__item img{position:absolute;top:0;left:0;width:100%;height:100%}`
   и `.banner__item:after{padding-bottom:58%}` — раскладку рядов раньше делал JS старого движка,
   которого тут нет. Без него абсолютная картинка вылетает в top:0 и НАКРЫВАЕТ обложку/заголовок.
   Поэтому берём картинку под свой контроль: возвращаем в поток (position:static), фикс-высота,
   а ряды раскладываем CSS-сеткой на .co_lines. */
.q-prose .co_lines{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin:22px 0;}
.q-prose .banner__item{position:relative;display:block;width:auto;margin:0;border-radius:10px;overflow:hidden;background:#eef2f8;}
.q-prose .banner__item:after{display:none;}
.q-prose .banner__item img{position:static;width:100%;height:170px;object-fit:cover;margin:0;border-radius:10px;display:block;}
.q-prose .highslide-caption{display:none;}
@media (max-width:600px){
    .news-page-head h1,.news-article h1{font-size:30px;}
    .news-sec{padding:40px 0 64px;}
}

/* === QUIZI INTEGRATED LANDING PRODUCTION UI === */
/* ============================================================================
   Quizi.by — production polish for the public landing page.
   Loaded after landing.css and scoped to .quizi.
   ============================================================================ */

.quizi{
    --lp-primary:#2563eb;
    --lp-primary-dark:#1d4ed8;
    --lp-primary-soft:#eef4ff;
    --lp-ink:#0b1220;
    --lp-text:#344054;
    --lp-muted:#667085;
    --lp-faint:#98a2b3;
    --lp-line:#e2e8f0;
    --lp-line-strong:#d5deea;
    --lp-bg:#ffffff;
    --lp-soft:#f5f7fb;
    --lp-soft-blue:#f3f6ff;
    --lp-dark:#0d1528;
    --lp-radius:16px;
    --lp-radius-lg:24px;
    --lp-shadow:0 1px 2px rgba(16,24,40,.04),0 18px 55px -34px rgba(16,24,40,.34);
    --maxw:1280px;
    background:var(--lp-bg);
    color:var(--lp-ink);
}
.quizi .q-container{max-width:var(--maxw);padding-left:32px;padding-right:32px}
.quizi .sec{position:relative;background:var(--lp-bg)}
.quizi .sec.soft{background:var(--lp-soft)}
.quizi .sec-pad{padding-top:112px;padding-bottom:112px}
.quizi .sec-title,.quizi .feat-head h2,.quizi .faq h2,.quizi .why h2{
    color:var(--lp-ink);font-weight:700;letter-spacing:-.03em;text-wrap:balance
}
.quizi .sec-title{font-size:48px;margin-bottom:58px}
.quizi .feat-head{max-width:720px}
.quizi .feat-head h2{font-size:48px;margin-bottom:16px}
.quizi .feat-head p{max-width:650px;margin-bottom:54px;color:var(--lp-muted);font-size:18px;line-height:1.65}

/* Navigation --------------------------------------------------------------- */


.quizi .nav{
    position:relative;z-index:15;min-height:66px;margin:0;padding:10px 12px 10px 14px;
    border:1px solid rgba(213,222,234,.9);border-radius:18px;background:rgba(255,255,255,.88);
    box-shadow:0 12px 36px -26px rgba(16,24,40,.38);backdrop-filter:blur(14px)
}
.quizi .brand{gap:10px;text-decoration:none}
.quizi .brand-mark{width:32px;height:32px;border-radius:10px;background:linear-gradient(145deg,#3478f6,#1d4ed8);box-shadow:0 6px 14px rgba(37,99,235,.22)}
.quizi .brand-mark svg{width:17px;height:17px}
.quizi .brand-name{font-size:20px;font-weight:700;letter-spacing:-.03em}
.quizi .brand-name .tld{color:var(--lp-primary)}
.quizi .nav-links{gap:8px}
.quizi .nav-links a{padding:10px 12px;border-radius:9px;color:var(--lp-text);font-size:14px;font-weight:550;transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}
.quizi .nav-links a:hover{background:var(--lp-soft);color:var(--lp-ink)}
.quizi .nav-links a.nav-cta{min-width:94px;padding:10px 18px;text-align:center;background:var(--lp-primary);color:#fff;box-shadow:0 6px 16px rgba(37,99,235,.18)}
.quizi .nav-links a.nav-cta:hover{background:var(--lp-primary-dark);color:#fff}

/* Hero -------------------------------------------------------------------- */





.quizi .q-grad-text{background:none;-webkit-text-fill-color:initial;color:var(--lp-primary)}


.quizi .q-btn{min-height:50px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;font-size:14.5px;font-weight:650;box-shadow:none}
.quizi .q-btn-primary{background:var(--lp-primary);color:#fff;box-shadow:0 10px 25px -12px rgba(37,99,235,.6)}
.quizi .q-btn-primary:hover{background:var(--lp-primary-dark);transform:translateY(-1px)}
.quizi .q-btn-ghost{border-color:var(--lp-line-strong);background:rgba(255,255,255,.8);color:var(--lp-ink)}
.quizi .q-btn-ghost:hover{background:#fff;border-color:#b9c5d6}






















/* Stats ------------------------------------------------------------------- */

.quizi .stats{position:relative;z-index:4;max-width:var(--maxw);margin:-38px auto 0;padding:0 32px;gap:0}
.quizi .stat{min-height:128px;padding:26px 30px!important;border:1px solid var(--lp-line);border-left:0!important;background:#fff;box-shadow:var(--lp-shadow)}
.quizi .stat:first-child{border-left:1px solid var(--lp-line)!important;border-radius:20px 0 0 20px}
.quizi .stat:last-child{border-radius:0 20px 20px 0}
.quizi .stat-num{color:var(--lp-ink);font-size:34px;font-weight:700;letter-spacing:-.03em}
.quizi .stat-num::first-line{color:var(--lp-ink)}
.quizi .stat-label{margin-top:8px;color:var(--lp-muted);font-size:13.5px}

/* Why --------------------------------------------------------------------- */
.quizi .why{grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:96px}
.quizi .why h2{top:90px;font-size:48px}
.quizi .why h2::after{content:"Собран для белорусского бизнеса — без лишней сложности.";display:block;max-width:340px;margin-top:20px;color:var(--lp-muted);font-size:16px;font-weight:450;line-height:1.6;letter-spacing:0}
.quizi .why-row{position:relative;padding:30px 0 30px 48px;border-color:var(--lp-line)}
.quizi .why-row:first-child{padding:0 0 30px 48px}
.quizi .why-row::before{content:"";position:absolute;left:0;top:32px;width:28px;height:28px;border-radius:9px;background:var(--lp-primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/15px no-repeat}
.quizi .why-row:first-child::before{top:2px}
.quizi .why-row h3{font-size:21px;margin-bottom:7px}
.quizi .why-row p{max-width:690px;color:var(--lp-muted);font-size:15.5px}

/* Steps ------------------------------------------------------------------- */
.quizi .steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.quizi .step,.quizi .step + .step{position:relative;display:flex;flex-direction:column;min-height:330px;padding:22px;border:1px solid var(--lp-line);border-radius:18px;background:#fff;box-shadow:0 14px 38px -34px rgba(16,24,40,.5)}
.quizi .step-num{color:#dce6fa;font-size:44px;font-weight:700;letter-spacing:-.05em}
.quizi .step h3{margin:12px 0 7px;color:var(--lp-ink);font-size:18px}
.quizi .step p{min-height:47px;margin:0 0 18px;color:var(--lp-muted);font-size:14px}
.quizi .shot{height:104px;margin-top:auto;border-radius:12px}
.quizi .shot.lite{border-color:#e2e8f0;background:#fbfcfe}

/* Features ---------------------------------------------------------------- */
.quizi #features{background:linear-gradient(180deg,#f6f8fc,#f3f6fb)}
.quizi .feat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.quizi .feat-col{position:relative;min-height:238px;padding:26px 28px 26px 82px;border:1px solid var(--lp-line);border-radius:18px;background:#fff;box-shadow:0 12px 36px -34px rgba(16,24,40,.55)}
.quizi .feat-col::before{content:"";position:absolute;left:26px;top:25px;width:38px;height:38px;border-radius:11px;background:var(--lp-primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='3'/%3E%3Cpath d='M8 9h8M8 13h8M8 17h5'/%3E%3C/svg%3E") center/19px no-repeat}
.quizi .feat-col:nth-child(2)::before{background-color:#f1edff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237f56d9' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3'/%3E%3Cpath d='M5 20c1-3.5 3.5-5 7-5s6 1.5 7 5'/%3E%3C/svg%3E")}
.quizi .feat-col:nth-child(3)::before{background-color:#fff3e8;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc6803' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 12a4 4 0 0 1 4-4h2M16 12a4 4 0 0 1-4 4h-2'/%3E%3Cpath d='m9 15-3 3a3 3 0 1 1-4-4l3-3M15 9l3-3a3 3 0 1 1 4 4l-3 3'/%3E%3C/svg%3E")}
.quizi .feat-col:nth-child(4)::before{background-color:#eaf8f1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23079455' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M4 19V5M4 19h16M8 16v-5M12 16V8M16 16V6M20 16v-3'/%3E%3C/svg%3E")}
.quizi .feat-col h3{margin-bottom:16px;color:var(--lp-ink);font-size:19px}
.quizi .feat-col ul{gap:10px}
.quizi .feat-col li{color:var(--lp-muted);font-size:14.5px}
.quizi .feat-col li .m{width:16px;height:16px;margin-top:2px;display:inline-block;flex:0 0 16px;font-size:0;border-radius:50%;background:var(--lp-primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/10px no-repeat}

/* Niches and examples ------------------------------------------------------ */
.quizi .niches{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.quizi .niche{min-height:178px;padding:22px;border:1px solid transparent;border-radius:17px;background:#f8fafc;transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}
.quizi .niche:hover{border-color:var(--lp-line);background:#fff;box-shadow:var(--lp-shadow);transform:translateY(-2px)}
.quizi .niche-ic{width:42px;height:42px;margin-bottom:17px;border-radius:11px;background:var(--lp-primary-soft);color:var(--lp-primary)}
.quizi .niche h3{font-size:17px}
.quizi .niche p{color:var(--lp-muted);font-size:14px}
.quizi .examples-grid{gap:16px}
.quizi .example-card{min-height:268px;padding:24px;border-color:var(--lp-line);border-radius:18px;box-shadow:0 12px 36px -36px rgba(16,24,40,.6);transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}
.quizi .example-card:hover{border-color:#cbd8ed;box-shadow:var(--lp-shadow);transform:translateY(-2px)}
.quizi .example-ic{width:42px;height:42px;display:grid;place-items:center;margin-bottom:18px;border-radius:11px;background:var(--lp-primary-soft);color:var(--lp-primary)}
.quizi .example-ic svg{width:21px;height:21px}
.quizi .example-card h3{font-size:17px;line-height:1.35}
.quizi .example-card p{color:var(--lp-muted);font-size:13.5px;line-height:1.6}
.quizi .ex-label{color:var(--lp-text);font-weight:650}

/* CMS and comparison ------------------------------------------------------- */
.quizi .cms-list{gap:10px;margin-bottom:24px}
.quizi .cms-item{min-width:118px;padding:12px 18px;border-color:var(--lp-line);border-radius:11px;background:#fff;color:var(--lp-text);font-size:14px;font-weight:650;text-align:center;box-shadow:0 8px 22px -20px rgba(16,24,40,.4)}
.quizi .cms-note{color:var(--lp-muted);font-size:14px}
.quizi .compare-wrap{padding:10px 18px;margin-bottom:24px;border:1px solid var(--lp-line);border-radius:18px;background:#fff;box-shadow:var(--lp-shadow)}
.quizi .compare-table th{padding:16px 18px;border-bottom:1px solid var(--lp-line);color:var(--lp-muted);font-size:12px}
.quizi .compare-table td{padding:14px 18px;color:var(--lp-text);font-size:14px}
.quizi .compare-table th.compare-us,.quizi .compare-table td.compare-us{color:var(--lp-primary);background:#f7f9ff}
.quizi .compare-note{border-color:#dbe5f8;background:#f6f8ff;color:var(--lp-text)}

/* Integrations ------------------------------------------------------------- */
.quizi .sec.dark{overflow:hidden;background:linear-gradient(135deg,#0b1326,#111d38 65%,#102a4e)}
.quizi .int-glow{right:8%;width:520px;height:520px;opacity:.25;background:radial-gradient(circle,#2563eb,transparent 68%)}
.quizi .int-inner{max-width:var(--maxw);padding:100px 32px}
.quizi .int-title{font-size:42px;font-weight:700;letter-spacing:-.03em}
.quizi .int-sub{margin-bottom:45px;color:#aebbd0}
.quizi .int-list{gap:10px}
.quizi .int-chip{min-height:62px;padding:13px 18px;border-color:rgba(255,255,255,.12);border-radius:13px;background:rgba(255,255,255,.055);filter:none;opacity:1;backdrop-filter:blur(6px)}
.quizi .int-chip:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.10);transform:translateY(-2px)}
.quizi .int-chip span.nm{color:#e1e8f5;font-size:15px;font-weight:650}

/* Pricing ----------------------------------------------------------------- */
.quizi #pricing{background:linear-gradient(180deg,#f5f7fb,#f8faff)}
.quizi .plans{gap:18px}
.quizi .plan{min-height:560px;padding:30px;border-color:var(--lp-line);border-radius:20px;box-shadow:0 18px 50px -44px rgba(16,24,40,.5)}
.quizi .plan.hl{border:1.5px solid var(--lp-primary);box-shadow:0 24px 60px -34px rgba(37,99,235,.38);transform:translateY(-8px)}
.quizi .plan-badge{top:-14px;left:25px;padding:6px 12px;box-shadow:0 6px 16px rgba(37,99,235,.22)}
.quizi .plan-name{font-size:18px}
.quizi .plan-price .amt{font-size:50px;color:var(--lp-ink)}
.quizi .plan-desc{min-height:42px;color:var(--lp-muted)}
.quizi .plan-cta{min-height:48px;display:flex;align-items:center;justify-content:center;border-radius:10px}
.quizi .plan-cta.sec{border-color:var(--lp-line-strong);color:var(--lp-text)}
.quizi .plan-feats{gap:12px}
.quizi .plan-feats li{color:var(--lp-text);font-size:13.5px}
.quizi .plan-feats li.off{color:var(--lp-faint)}

/* FAQ --------------------------------------------------------------------- */
.quizi .faq{max-width:1120px;padding:110px 32px;display:grid;grid-template-columns:330px minmax(0,1fr);gap:78px;align-items:start}
.quizi .faq h2{position:sticky;top:90px;margin:0;font-size:46px}
.quizi .faq h2::after{content:"Коротко отвечаем на вопросы об установке, оплате и работе с заявками.";display:block;margin-top:18px;color:var(--lp-muted);font-size:15px;font-weight:450;line-height:1.6;letter-spacing:0}
.quizi .faq details{padding:0;border-color:var(--lp-line)}
.quizi .faq details > summary{padding:20px 0;color:var(--lp-ink);font-size:16px;font-weight:650}
.quizi .faq details p{margin:0 0 20px;color:var(--lp-muted);font-size:14.5px}
.quizi .faq summary .ic{width:18px;height:18px}

/* Final CTA and footer ----------------------------------------------------- */
.quizi .cta{padding:26px 32px 0;background:#fff}
.quizi .cta-glow{display:none}
.quizi .cta-inner{max-width:1216px;padding:82px 32px;border-radius:28px;background:linear-gradient(135deg,#eff4ff,#f8faff 52%,#f3efff);box-shadow:inset 0 0 0 1px #dfe7f5}
.quizi .cta h2{max-width:760px;color:var(--lp-ink);font-size:48px;font-weight:700}
.quizi .cta-btn{min-height:52px;padding:0 28px;display:inline-flex;align-items:center;border-radius:11px;background:var(--lp-primary);box-shadow:0 10px 24px -12px rgba(37,99,235,.6)}
.quizi .cta-note{color:var(--lp-muted)}
.quizi .footer{margin-top:26px;background:var(--lp-dark)}
.quizi .footer-top{max-width:var(--maxw);padding:70px 32px 48px;gap:50px}
.quizi .footer-about{color:#9eabc0}
.quizi .footer-col-title{font-size:13px;color:#f4f7fb}
.quizi .footer-col a,.quizi .footer-col span{color:#93a1b7;font-size:13.5px}
.quizi .footer-col a:hover{color:#fff}
.quizi .footer-bottom{max-width:var(--maxw);padding:23px 32px 34px;color:#708098}

/* News cards if present ---------------------------------------------------- */
.quizi .ql-news-grid{gap:16px}
.quizi .ql-news-card{padding:24px;border-radius:18px;border-color:var(--lp-line);box-shadow:0 12px 36px -36px rgba(16,24,40,.6)}
.quizi .ql-news-card:hover{transform:translateY(-2px);box-shadow:var(--lp-shadow)}

/* Responsive --------------------------------------------------------------- */
@media (max-width:1100px){
    
    
    
    .quizi .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .plan{padding:25px}
}
@media (max-width:900px){
    .quizi .q-container,.quizi .stats,.quizi .int-inner,.quizi .cta,.quizi .footer-top,.quizi .footer-bottom,.quizi .faq{padding-left:22px;padding-right:22px}
    .quizi .nav{padding:9px 10px}
    .quizi .nav-links{gap:2px}
    .quizi .nav-links a{padding:9px}
    
    
    
    
    .quizi .stats{grid-template-columns:repeat(2,minmax(0,1fr));margin:-32px auto 0}
    .quizi .stat,.quizi .stat:first-child,.quizi .stat:last-child{border:1px solid var(--lp-line)!important;border-radius:0}
    .quizi .stat:first-child{border-radius:18px 0 0 0}
    .quizi .stat:nth-child(2){border-radius:0 18px 0 0}
    .quizi .stat:nth-child(3){border-radius:0 0 0 18px}
    .quizi .stat:last-child{border-radius:0 0 18px 0}
    .quizi .why{grid-template-columns:minmax(0,1fr);gap:42px}
    .quizi .why h2,.quizi .faq h2{position:static}
    .quizi .feat-grid{grid-template-columns:minmax(0,1fr)}
    .quizi .niches{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .faq{grid-template-columns:minmax(0,1fr);gap:42px}
    .quizi .plans{max-width:560px;margin:auto;grid-template-columns:minmax(0,1fr)}
    .quizi .plan.hl{order:-1;transform:none}
}
@media (max-width:620px){
    .quizi .q-container,.quizi .stats,.quizi .int-inner,.quizi .cta,.quizi .footer-top,.quizi .footer-bottom,.quizi .faq{padding-left:16px;padding-right:16px}
    
    .quizi .nav{min-height:58px;border-radius:14px}
    .quizi .nav-links.open{top:66px;margin:0;border-radius:14px;padding:8px;box-shadow:0 20px 48px -22px rgba(16,24,40,.35)}
    
    
    
    
    
    
    
    
    .quizi .stats{grid-template-columns:minmax(0,1fr);gap:8px;margin:-24px auto 0}
    .quizi .stat,.quizi .stat:first-child,.quizi .stat:nth-child(2),.quizi .stat:nth-child(3),.quizi .stat:last-child{min-height:105px;padding:20px!important;border-radius:15px!important}
    .quizi .stat-num{font-size:29px}
    .quizi .sec-pad{padding-top:78px;padding-bottom:78px}
    .quizi .sec-title,.quizi .feat-head h2,.quizi .why h2,.quizi .faq h2{font-size:35px}
    .quizi .steps,.quizi .niches,.quizi .examples-grid{grid-template-columns:minmax(0,1fr)}
    .quizi .step,.quizi .step + .step{min-height:300px}
    .quizi .feat-col{padding:72px 21px 22px}
    .quizi .feat-col::before{left:21px;top:20px}
    .quizi .why-row,.quizi .why-row:first-child{padding-left:42px}
    .quizi .cta{padding-top:16px}
    .quizi .cta-inner{padding:62px 20px;border-radius:22px}
    .quizi .cta h2{font-size:35px}
    .quizi .footer-top{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:620px){
    
}

/* Comparison uses neutral typographic marks instead of platform-dependent emoji. */
.quizi .compare-mark{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:999px;font-size:15px;font-weight:800;line-height:1}
.quizi .compare-mark--yes{background:#eaf8f1;color:#16875b}
.quizi .compare-mark--no{background:#fff0f1;color:#c63e47}
.quizi .compare-mark--partial{background:#fff5df;color:#a96300}

/* ============================================================================
   ПЕРВЫЙ ЭКРАН «Заявка приходит при вас» (направление A, 05.08.2026).
   Идёт ПОСЛЕДНИМ и намеренно перебивает «капсульную» эпоху выше: там hero — это
   свечения, точечная сетка, плавающая навигация-капсула и мокап-окно браузера.
   Здесь тон другой: белый фон, шапка строкой, один акцент и никакого градиента.
   Правки капсульных правил выше НЕ трогать — ими живут новостные страницы.
   ============================================================================ */

/* Фон и шапка -------------------------------------------------------------
   Первый экран — тёмно-синяя сцена. Вся остальная страница белая, и светлый
   hero в ней растворялся: не было точки, с которой начинается просмотр.
   Синий здесь фирменный, просто взятый в глубину. */
/* Светлая сцена, плотность даёт графика, а не заливка: сетка из ромбов (знак
   страницы), два мягких пятна фирменного синего и белые карточки поверх. */










/* Раскладка первого экрана ------------------------------------------------- */

.quizi .ql-eyebrow{
    display:flex;align-items:center;gap:14px;margin-bottom:26px;
    color:var(--lp-muted);font-size:13px;font-weight:650;letter-spacing:.02em
}
.quizi .ql-eyebrow::after{content:"";height:1px;flex:1;background:var(--lp-line)}
/* Заголовок держит поисковый ключ «конструктор квизов для сайта» первой строкой,
   вторая строка несёт оффер. Кегль ниже, чем был у короткого варианта: иначе
   длинный H1 занимает четыре строки и выдавливает кнопки за первый экран. */

/* Акцент — тонкая линия под словом, а не заливка: заливка наезжала на точку
   в конце предложения и читалась как дефект вёрстки. */









/* Факты колонками, а не строкой: строка ломалась пополам и разделитель
   оказывался в начале следующей строки. */




/* Правая колонка: квиз, связка, панель заявок ------------------------------ */











/* Финал: галочка и подпись в строку — большой зелёный круг тут перевешивал заголовок. */




/* Связка «квиз -> кабинет» */



/* Панель заявок кабинета (.ql-inbox / .ql-lead) удалена 06.08.2026 вместе с
   разметкой первого экрана — решение владельца. Что заявка дошла, показывает
   карточка уведомления .ql-ping ниже. */

/* Цифры под первым экраном: без наезда на hero — карточки-внахлёст были частью
   капсульной эпохи и с новым hero читались как обрезанный блок. */



/* Секция «Веб-студиям» ----------------------------------------------------- */
.quizi .ql-agency{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:start;margin-bottom:32px}
.quizi .ql-agency__text h2{margin:0 0 16px;color:var(--lp-ink);font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1.12}
.quizi .ql-agency__text p{margin:0 0 28px;color:var(--lp-muted);font-size:17px;line-height:1.65}
.quizi .ql-agency__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.quizi .ql-agency__list li{padding:20px 0;border-top:1px solid var(--lp-line);color:var(--lp-muted);font-size:15px;line-height:1.6}
.quizi .ql-agency__list li:first-child{padding-top:0;border-top:0}
.quizi .ql-agency__list b{display:block;margin-bottom:4px;color:var(--lp-ink);font-size:16px;font-weight:650}

/* ============================================================================
/* ============================================================================
   ВИЗУАЛЬНЫЙ ЯЗЫК ГЛАВНОЙ (05.08.2026, вторая редакция).
   Первая была плоским «бланком» — линии, отсутствие цвета, воздух вместо
   плотности; читалась как прототип. Здесь у страницы появляется характер:

   ЦВЕТ     графит #141626 · василёк #2563eb · глубокий василёк #1d4ed8 ·
            бумага #f7f9fc · линия #e2e8f0 · малахит #137A5F (только «получено»).
            Василёк вместо дежурного #2563eb: национальный цветок и цвет,
            который не встречается у российских конкурентов.
   ШРИФТ    Inter во всех ролях — гарнитура сайта, менять её не просили.
            (Пробовали Onest для заголовков — владелец вернул Inter.)
   ЗНАК     ромб. В блок-схеме ромб — развилка, а квиз это дерево вопросов с
            ветвлениями; он же мотив белорусского орнамента. Ромбом набраны
            маркеры списков, номера шагов и разделители заголовков. Больше
            ничего декоративного на странице нет — весь расчёт на него.
   ============================================================================ */


/* Токены: переопределяют васильком синий предыдущих эпох ------------------- */
.quizi{
    --q-ink:#141626;
    --q-blue:#2563eb;
    --q-blue-deep:#1d4ed8;
    --q-soft:#eff6ff;
    --q-paper:#f7f9fc;
    --q-line:#e2e8f0;
    --q-green:#137A5F;
    --lp-primary:#2563eb;
    --lp-primary-dark:#1d4ed8;
    --lp-primary-soft:#eff6ff;
    --lp-ink:#141626;
    --lp-text:#3A3F55;
    --lp-muted:#5C6280;
    --lp-faint:#8B90A8;
    --lp-line:#e2e8f0;
    --lp-line-strong:#CBD0E8;
    --lp-soft:#f7f9fc;
}

/* Дисплейная гарнитура — заголовки, числа, кнопки ------------------------- */
.quizi h1,.quizi h2,.quizi .sec-title,.quizi .feat-head h2,.quizi .stat-num,
.quizi .plan-price .amt,.quizi .step-num,.quizi .int-title,.quizi .brand-name,
.quizi .q-btn,.quizi .cta-btn,.quizi .plan-cta,.quizi .nav-links a.nav-cta{
    font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif
}
.quizi h1,.quizi h2,.quizi .sec-title,.quizi .feat-head h2,.quizi .int-title{
    font-weight:700;letter-spacing:-.03em
}

/* Ромб — общий знак страницы ---------------------------------------------- */
.quizi .ql-rhomb::before{
    content:"";display:inline-block;width:7px;height:7px;flex:0 0 7px;
    background:var(--q-blue);transform:rotate(45deg)
}

/* Общее -------------------------------------------------------------------- */
.quizi .sec.soft,.quizi #features,.quizi #pricing{background:var(--q-paper)}
.quizi .sec-pad{padding-top:110px;padding-bottom:110px}
.quizi .sec-title{font-size:44px;margin-bottom:18px}
.quizi .feat-head h2{font-size:44px}
.quizi .feat-head p{color:var(--lp-muted);font-size:17px}
/* Заголовок секции подпирается ромбом — он же отбивка вместо линейки */
.quizi .sec-title::after{
    content:"";display:block;width:9px;height:9px;margin:22px auto 40px;
    background:var(--q-blue);transform:rotate(45deg)
}
.quizi .feat-head h2::after{
    content:"";display:block;width:9px;height:9px;margin:16px 0 18px;
    background:var(--q-blue);transform:rotate(45deg)
}

/* Классы вместо инлайновых стилей, которые стояли в разметке ---------------- */
.quizi .feat-head--center{max-width:640px;margin:0 auto;text-align:center}
.quizi .feat-head--center h2::after{margin-left:auto;margin-right:auto}
.quizi .sec-title--tight{margin-bottom:0}
.quizi .sec-title--tight::after{margin-bottom:22px}
.quizi .sec-lead{max-width:620px;margin:0 auto 56px;color:var(--lp-muted);font-size:17px;text-align:center;line-height:1.6}
.quizi .cms-note--gap{margin-top:36px}

/* Первый экран: правки под новый язык ------------------------------------- */
/* Фон первого экрана задан ниже, в блоке тёмной сцены — здесь не переопределять. */
.quizi .ql-eyebrow{color:var(--q-blue);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:11.5px}
.quizi .ql-eyebrow::after{background:var(--q-line)}





/* Ромб абсолютным позиционированием, а не flex: flex сделал бы <b> внутри
   строки отдельным элементом, и «Заявки в» отрывалось от «Telegram, CRM». */











/* Связка «квиз → кабинет»: ромб на нитке, а не безымянная чёрточка */



/* Цифры: крупное начертание, ромбы вместо линеек-разделителей ------------- */





.quizi .stat-num{color:var(--q-ink);font-size:38px;font-weight:700;letter-spacing:-.03em}
.quizi .stat-label{color:var(--lp-muted);font-size:14px;margin-top:10px}

/* Почему: крупные пункты, ромб на полях ------------------------------------ */
.quizi .why h2{font-size:44px}
.quizi .why h2::after{content:"Собран для белорусского бизнеса — без лишней сложности.";font-size:16px}
.quizi .why-row,.quizi .why-row:first-child{position:relative;padding-left:38px}
.quizi .why-row::before{
    display:block;content:"";position:absolute;left:0;top:44px;width:9px;height:9px;
    border-radius:0;background:var(--q-blue);transform:rotate(45deg)
}
.quizi .why-row:first-child::before{top:8px}
.quizi .why-row h3{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:22px;font-weight:700;letter-spacing:-.025em}
.quizi .why-row p{font-size:16px}

/* Как это работает: последовательность — значит номера уместны ------------- */
.quizi .steps{gap:16px}
.quizi .step,.quizi .step + .step{
    min-height:0;padding:28px;border:1px solid var(--q-line);border-radius:16px;
    background:#fff;box-shadow:none
}
/* Номер шага не кладём внутрь повёрнутого квадрата — цифры встали бы под 45°.
   Ромб рисуем отдельным значком слева, номер остаётся прямым. */
.quizi .step-num{
    display:flex;align-items:center;gap:10px;
    color:var(--q-blue-deep);font-size:14px;font-weight:700;letter-spacing:.04em
}
.quizi .step-num::before{
    content:"";width:9px;height:9px;flex:0 0 9px;
    background:var(--q-blue);transform:rotate(45deg)
}
.quizi .step h3{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;margin:22px 0 8px;font-size:19px;font-weight:700;letter-spacing:-.02em}
.quizi .step p{min-height:44px;margin-bottom:20px;font-size:14.5px}
.quizi .shot{height:100px;margin-top:auto;border-radius:12px}
.quizi .shot.lite{border-color:var(--q-line);background:var(--q-paper)}

/* Возможности: четыре колонки с ромбовыми маркерами ------------------------ */
.quizi .feat-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.quizi .feat-col{
    min-height:0;padding:26px 24px;border:1px solid var(--q-line);border-radius:16px;
    background:#fff;box-shadow:none
}
.quizi .feat-col + .feat-col{padding-left:24px;border-left:1px solid var(--q-line)}
.quizi .feat-col::before{display:none}
.quizi .feat-col h3{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;margin-bottom:16px;font-size:17px;font-weight:700}
.quizi .feat-col li{align-items:flex-start;color:var(--lp-muted);font-size:14.5px}
.quizi .feat-col li .m{
    width:6px;height:6px;flex:0 0 6px;margin-top:7px;border-radius:0;
    background:var(--q-blue) none;transform:rotate(45deg)
}

/* Для кого: карточки на бумаге -------------------------------------------- */
.quizi .niches{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.quizi .niche{min-height:0;padding:24px;border:1px solid var(--q-line);border-radius:16px;background:#fff;transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}
.quizi .niche:hover{border-color:var(--q-blue);background:#fff;box-shadow:0 16px 34px -28px rgba(20,22,38,.6);transform:none}
.quizi .niche-ic{width:40px;height:40px;margin-bottom:16px;border:0;border-radius:11px;background:var(--q-soft);color:var(--q-blue)}
.quizi .niche h3{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:17px;font-weight:700}

/* Примеры квизов ----------------------------------------------------------- */
.quizi .example-card{min-height:0;padding:26px;border-color:var(--q-line);border-radius:16px;background:#fff;box-shadow:none}
.quizi .example-card:hover{border-color:var(--q-blue);box-shadow:0 16px 34px -28px rgba(20,22,38,.6);transform:none}
.quizi .example-ic{border:0;border-radius:11px;background:var(--q-soft);color:var(--q-blue)}
.quizi .example-card h3{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:17px;font-weight:700}
.quizi .ex-label{color:var(--q-blue-deep);font-weight:650}

/* Установка на любой сайт: код слева, платформы справа ---------------------
   Раньше здесь стоял ряд серых плашек с названиями — пусто и бездоказательно.
   Теперь видно саму строку установки и знакомые платформы. */
.quizi .cms-item{border-color:var(--q-line);border-radius:11px;background:#fff;box-shadow:none;font-weight:600}
.quizi .ql-install{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:stretch}
.quizi .ql-install__code{padding:0;border:1px solid var(--q-line);border-radius:18px;background:#fff;overflow:hidden}
.quizi .ql-install__bar{
    display:flex;align-items:center;gap:7px;padding:14px 18px;border-bottom:1px solid var(--q-line);
    background:var(--q-paper)
}
.quizi .ql-install__bar span{width:9px;height:9px;border-radius:50%;background:#dbe2ee}
.quizi .ql-install__bar span:first-child{background:#ff8b8b}
.quizi .ql-install__bar span:nth-child(2){background:#ffc46b}
.quizi .ql-install__bar span:nth-child(3){background:#5ed39a}
.quizi .ql-install__bar em{margin-left:auto;font-style:normal;color:var(--lp-faint);font-size:12px}
.quizi .ql-install__code pre{
    margin:0;padding:22px 20px;overflow-x:auto;background:#0f172a;
    font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;line-height:1.6;color:#cbd5e1
}
.quizi .ql-install__code pre b{color:#7dd3fc;font-weight:600}
.quizi .ql-install__code p{margin:0;padding:18px 20px 20px;color:var(--lp-muted);font-size:14px;line-height:1.6}
.quizi .ql-install__code p code{
    padding:2px 6px;border-radius:6px;background:var(--q-soft);
    color:var(--q-blue-deep);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px
}
.quizi .ql-install__cms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.quizi .ql-cms{
    display:flex;align-items:center;gap:11px;padding:16px;border:1px solid var(--q-line);
    border-radius:14px;background:#fff;color:var(--lp-ink);font-size:14px;font-weight:650;
    transition:border-color .16s ease,box-shadow .16s ease
}
.quizi .ql-cms:hover{border-color:var(--q-blue);box-shadow:0 14px 30px -26px rgba(20,35,80,.7)}
.quizi .ql-cms span{
    flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;
    color:#fff;font-size:13px;font-weight:750;letter-spacing:-.02em
}
.quizi .ql-cms[data-cms="wp"] span{background:#21759b}
.quizi .ql-cms[data-cms="tilda"] span{background:#1a1a1a}
.quizi .ql-cms[data-cms="bitrix"] span{background:#0ab2e6}
.quizi .ql-cms[data-cms="oc"] span{background:#23a1d1;font-size:12px}
.quizi .ql-cms[data-cms="joomla"] span{background:#f44321}
.quizi .ql-cms[data-cms="code"] span{background:var(--q-blue);font-size:12px}
@media (max-width:900px){
    .quizi .ql-install{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:620px){
    .quizi .ql-install__cms{grid-template-columns:minmax(0,1fr)}
    .quizi .ql-install__code pre{font-size:12px;padding:18px 16px}
}

/* Сравнение: своя колонка выделена васильковым ----------------------------- */
.quizi .compare-wrap{padding:8px 20px;border:1px solid var(--q-line);border-radius:18px;background:#fff;box-shadow:none}
.quizi .compare-table th{border-bottom:1px solid var(--q-line)}
.quizi .compare-table th.compare-us{color:var(--q-blue);font-weight:700}
.quizi .compare-table td.compare-us{background:var(--q-soft);color:var(--q-blue-deep);font-weight:650}
.quizi .compare-table tr:hover td{background:var(--q-paper)}
.quizi .compare-table tr:hover td.compare-us{background:var(--q-soft)}
.quizi .compare-note{border-color:var(--q-line);background:#fff;color:var(--lp-muted)}
.quizi .compare-mark{width:24px;height:24px;font-size:14px}
.quizi .compare-mark--yes{background:#E4F3EE;color:var(--q-green)}

/* Интеграции: светлая секция ------------------------------------------------ */
.quizi .sec.dark{background:#fff;border-top:1px solid var(--q-line);border-bottom:1px solid var(--q-line)}
.quizi .int-glow{display:none}
.quizi .int-inner{padding:104px 32px}
.quizi .int-title{color:var(--q-ink);font-size:44px}
.quizi .int-title::after{content:"";display:block;width:9px;height:9px;margin:20px auto 0;background:var(--q-blue);transform:rotate(45deg)}
.quizi .int-sub{margin-top:18px;color:var(--lp-muted)}
.quizi .int-chip{min-height:60px;border:1px solid var(--q-line);border-radius:14px;background:#fff;backdrop-filter:none;box-shadow:none}
.quizi .int-chip:hover{border-color:var(--q-blue);background:#fff;transform:none}
.quizi .int-chip span.nm{color:var(--lp-text);font-size:15px;font-weight:600}

/* Веб-студиям --------------------------------------------------------------- */
.quizi .ql-agency__text h2{font-size:40px}
.quizi .ql-agency__list li{position:relative;padding-left:30px;border-color:var(--q-line)}
.quizi .ql-agency__list li::before{
    content:"";position:absolute;left:0;top:26px;width:7px;height:7px;
    background:var(--q-blue);transform:rotate(45deg)
}
.quizi .ql-agency__list li:first-child::before,
.quizi .ql-agency__list li:nth-child(2)::before{top:6px}
.quizi .ql-agency__list b{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;font-weight:700}

/* Тарифы -------------------------------------------------------------------- */
.quizi .plan{min-height:0;padding:32px;border-color:var(--q-line);border-radius:18px;background:#fff;box-shadow:none}
.quizi .plan.hl{border:1.5px solid var(--q-blue);box-shadow:0 24px 50px -38px rgba(37,99,235,.8);transform:none}
.quizi .plan-badge{background:var(--q-blue);box-shadow:none}
.quizi .plan-name{font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:18px;font-weight:700}
.quizi .plan-price .amt{font-size:46px;font-weight:700;letter-spacing:-.03em}
.quizi .plan-cta.pri{background:var(--q-blue);box-shadow:none}
.quizi .plan-cta.pri:hover{background:var(--q-blue-deep)}
.quizi .plan-pkg.on{color:var(--q-blue)}
.quizi .plan-feats li .mk svg{stroke:var(--q-green)}

/* FAQ ----------------------------------------------------------------------- */
.quizi .faq h2{font-size:44px}
.quizi .faq h2::after{font-size:15px}
.quizi .faq details > summary{font-size:16.5px;font-weight:650}
.quizi .faq summary .ic{stroke:var(--q-blue)}

/* Новости -------------------------------------------------------------------- */
.quizi .ql-news-card{border-color:var(--q-line);border-radius:16px;box-shadow:none}
.quizi .ql-news-card:hover{border-color:var(--q-blue);box-shadow:0 16px 34px -28px rgba(20,22,38,.6);transform:none}
.quizi .ql-news-more{color:var(--q-blue)}

/* Финальный CTA — единственный сплошь цветной блок страницы ---------------- */
.quizi .cta{padding:0;background:#fff}
.quizi .cta-inner{
    max-width:none;padding:104px 32px;border-radius:0;background:var(--q-blue-deep);
    box-shadow:none;color:#fff
}
.quizi .cta h2{max-width:820px;margin-bottom:14px;color:#fff;font-size:46px;font-weight:700;letter-spacing:-.03em}
.quizi .cta h2 .q-grad-text{color:#fff;box-shadow:inset 0 -12px 0 rgba(255,255,255,.18)}
.quizi .cta-inner::after{
    content:"";display:block;width:10px;height:10px;margin:0 auto 34px;
    background:rgba(255,255,255,.35);transform:rotate(45deg)
}
.quizi .cta-btn{background:#fff;color:var(--q-blue-deep);box-shadow:none}
.quizi .cta-btn:hover{background:#eff6ff;color:var(--q-blue-deep)}
.quizi .cta-note{color:rgba(255,255,255,.62)}
/* Порядок: заголовок → ромб → кнопка → сноска. ::after встаёт после сноски,
   поэтому саму отбивку двигаем flex-порядком, а не разметкой. */
.quizi .cta-inner{display:flex;flex-direction:column;align-items:center}
.quizi .cta-inner h2{order:1}
.quizi .cta-inner::after{order:2}
.quizi .cta-inner .cta-btn{order:3}
.quizi .cta-inner .cta-note{order:4}

/* Подвал --------------------------------------------------------------------- */
.quizi .footer{margin-top:0;background:var(--q-ink)}

/* Шапка новостных страниц — как на главной ---------------------------------- */
.quizi .news-top .nav{
    min-height:76px;padding:0;margin:0;border:0;border-radius:0;background:transparent;
    box-shadow:none;backdrop-filter:none;gap:40px
}
.quizi .news-top .brand-mark{border-radius:9px;box-shadow:none;background:var(--q-blue)}
.quizi .news-top .nav-links{margin-left:auto;gap:6px}
.quizi .news-top .nav-links a.nav-cta{background:var(--q-ink);box-shadow:none}
.quizi .news-top .nav-links a.nav-cta:hover{background:var(--q-blue-deep)}

/* Первый экран: фирменный синий как единственный акцент -------------------- */








/* Уведомление в мессенджер — третья карточка сцены: заявка не просто «где-то
   в кабинете», она приходит человеку в телефон. */







/* ЦВЕТ: акцентная палитра ---------------------------------------------------
   Синий остаётся фирменным и главным, остальные пять — только для плиток
   преимуществ и иконок, чтобы страница не была одноцветной. Каждый цвет
   закреплён за темой: деньги, данные, скорость, продукт, каналы, установка. */
.quizi{
    --a-blue-bg:#eff6ff;   --a-blue-ink:#1d4ed8;
    --a-green-bg:#e9f8f1;  --a-green-ink:#0f7a55;
    --a-amber-bg:#fff5e6;  --a-amber-ink:#b45309;
    --a-violet-bg:#f4efff; --a-violet-ink:#6d28d9;
    --a-teal-bg:#e6f7f9;   --a-teal-ink:#0e7490;
    --a-indigo-bg:#eef0ff; --a-indigo-ink:#4338ca;
}

/* Первый экран: одно главное действие ---------------------------------------
   Было четыре разноцветных чипа, строка CMS и мелкие факты — внимание
   рассыпалось, а кнопка была одна. Теперь два действия и три строки доказательств
   под ними: смотреть не на что, кроме кнопки. */










/* Преимущества: шесть цветных плиток --------------------------------------- */
.quizi .ql-adv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.quizi .ql-adv__item{padding:28px 26px 26px;border-radius:18px;background:var(--q-paper)}
.quizi .ql-adv__num{
    display:inline-flex;align-items:center;margin-bottom:16px;padding:6px 12px;border-radius:9px;
    font-size:15px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums
}
.quizi .ql-adv__item h3{margin:0 0 9px;color:var(--lp-ink);font-size:18px;font-weight:700;letter-spacing:-.02em}
.quizi .ql-adv__item p{margin:0;color:var(--lp-muted);font-size:14.5px;line-height:1.6}
.quizi .ql-adv__item--blue{background:var(--a-blue-bg)}
.quizi .ql-adv__item--blue .ql-adv__num{background:#dbe8ff;color:var(--a-blue-ink)}
.quizi .ql-adv__item--green{background:var(--a-green-bg)}
.quizi .ql-adv__item--green .ql-adv__num{background:#d3f0e3;color:var(--a-green-ink)}
.quizi .ql-adv__item--amber{background:var(--a-amber-bg)}
.quizi .ql-adv__item--amber .ql-adv__num{background:#ffe7c2;color:var(--a-amber-ink)}
.quizi .ql-adv__item--violet{background:var(--a-violet-bg)}
.quizi .ql-adv__item--violet .ql-adv__num{background:#e7dcff;color:var(--a-violet-ink)}
.quizi .ql-adv__item--teal{background:var(--a-teal-bg)}
.quizi .ql-adv__item--teal .ql-adv__num{background:#cfeef2;color:var(--a-teal-ink)}
.quizi .ql-adv__item--indigo{background:var(--a-indigo-bg)}
.quizi .ql-adv__item--indigo .ql-adv__num{background:#dfe3ff;color:var(--a-indigo-ink)}

/* Возможности: возвращаем цветные иконки, они были обесцвечены ------------- */
.quizi .feat-col{padding:26px 24px 26px 78px}
.quizi .feat-col + .feat-col{padding-left:78px}
.quizi .feat-col::before{display:block;left:24px;top:26px}

/* Ниши: у каждой свой цвет плашки ------------------------------------------ */
.quizi .niche:nth-child(1) .niche-ic{background:var(--a-blue-bg);color:var(--a-blue-ink)}
.quizi .niche:nth-child(2) .niche-ic{background:var(--a-violet-bg);color:var(--a-violet-ink)}
.quizi .niche:nth-child(3) .niche-ic{background:var(--a-amber-bg);color:var(--a-amber-ink)}
.quizi .niche:nth-child(4) .niche-ic{background:var(--a-teal-bg);color:var(--a-teal-ink)}
.quizi .niche:nth-child(5) .niche-ic{background:var(--a-green-bg);color:var(--a-green-ink)}
.quizi .niche:nth-child(6) .niche-ic{background:var(--a-indigo-bg);color:var(--a-indigo-ink)}

/* Фотографии ниш ------------------------------------------------------------
   Взяты из превью шаблонов квизов: один рендер-стиль и общий светло-голубой
   фон, который совпадает с фоном секций — карточка не выглядит наклейкой. */
.quizi .example-card{position:relative;display:flex;flex-direction:column;padding:0;overflow:hidden}
/* Метка на обложке — как в библиотеке кабинета: сразу видно объём квиза */
.quizi .example-badge{
    position:absolute;top:12px;right:12px;z-index:2;padding:5px 11px;border-radius:999px;
    background:rgba(255,255,255,.94);color:var(--lp-text);font-size:12px;font-weight:650;
    box-shadow:0 4px 14px -6px rgba(16,24,40,.5)
}
.quizi .example-cta{
    padding:11px 18px;border-radius:10px;background:var(--q-blue);color:#fff!important;
    transition:background-color .16s ease
}
.quizi .example-cta:hover{background:var(--q-blue-deep)}
.quizi .example-photo{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:var(--q-soft)}
.quizi .example-body{display:flex;flex-direction:column;flex:1;padding:22px 24px 24px}
.quizi .example-body h3{margin:0 0 14px;font-size:17px;font-weight:700;letter-spacing:-.02em}
.quizi .example-card .example-ic{display:none}
/* Вопросы квиза — теми же чипами, что ответы в панели заявок первого экрана:
   один приём связывает обещание вверху страницы и примеры внизу. */
.quizi .example-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.quizi .example-chips span{
    padding:5px 10px;border-radius:8px;background:var(--q-soft);
    color:var(--q-blue-deep);font-size:12.5px;font-weight:550
}
.quizi .example-result{margin:0 0 18px;color:var(--lp-muted);font-size:14px;line-height:1.55}
.quizi .example-cta{
    margin-top:auto;display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
    color:var(--q-blue);font-size:14.5px;font-weight:650;text-decoration:none;
    transition:color .16s ease
}
.quizi .example-cta s{display:inline-block;text-decoration:none;transition:transform .16s ease}
.quizi .example-cta:hover{color:var(--q-blue-deep)}
.quizi .example-cta:hover s{transform:translateX(3px)}

/* Действие в конце секции: раньше блок кончался ничем ---------------------- */
.quizi .ql-section-cta{
    display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:44px;text-align:center
}
.quizi .ql-section-cta .q-btn{min-height:54px;padding:0 30px;font-size:15.5px}
.quizi .ql-section-cta span{color:var(--lp-faint);font-size:13.5px}
.quizi .ql-section-cta span a{text-decoration: underline;color:var(--lp-primary);}
.quizi .ql-section-cta span a:hover{text-decoration: none}

/* Реальные экраны продукта --------------------------------------------------
   Заменили нарисованные схемы: снимок живого кабинета доказывает, что продукт
   существует, лучше любой иллюстрации. Экран показывается целиком, поэтому
   object-fit не нужен — кадрирование сделано заранее при обработке файлов. */
/* Экран крупно, текст сбоку, стороны чередуются: в две колонки интерфейс
   ужимался до нечитаемого — а весь смысл блока в том, чтобы его разглядели. */
.quizi .ql-shots{display:flex;flex-direction:column;gap:28px}
.quizi .ql-shot{
    display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);gap:36px;
    align-items:center;margin:0;padding:0
}
.quizi .ql-shot:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.62fr)}
.quizi .ql-shot:nth-child(even) img{order:2}
.quizi .ql-shot:nth-child(even) figcaption{order:1}
.quizi .ql-shot img{
    display:block;width:100%;height:auto;border:1px solid var(--q-line);border-radius:16px;
    background:#fff;box-shadow:0 22px 50px -34px rgba(20,22,38,.55)
}
.quizi .ql-shot figcaption{color:var(--lp-muted);font-size:15px;line-height:1.65}
.quizi .ql-shot figcaption b{
    display:block;margin-bottom:10px;color:var(--lp-ink);font-size:22px;font-weight:700;letter-spacing:-.03em
}
/* Широкий вариант: снимок во всю колонку, подпись под ним по центру */
.quizi .ql-shot--wide{display:block;margin-bottom:56px}
.quizi .ql-shot--wide img{margin-bottom:22px}
.quizi .ql-shot--wide figcaption{max-width:720px;margin:0 auto;text-align:center}
.quizi .ql-shot--wide figcaption b{font-size:19px}
.quizi .ql-sub-title{
    margin:0 0 26px;color:var(--lp-ink);font-size:22px;font-weight:700;letter-spacing:-.025em;text-align:center
}

/* Возможности продукта: четыре пункта под схемами -------------------------- */
.quizi .ql-abilities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.quizi .ql-ability{position:relative;padding:24px 22px;border:1px solid var(--q-line);border-radius:16px;background:var(--q-paper)}
.quizi .ql-ability h3{
    position:relative;font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;margin:0 0 10px;padding-left:18px;
    font-size:16px;font-weight:700;letter-spacing:-.015em
}
.quizi .ql-ability h3::before{
    content:"";position:absolute;left:0;top:7px;width:8px;height:8px;
    background:var(--q-blue);transform:rotate(45deg)
}
.quizi .ql-ability p{margin:0;color:var(--lp-muted);font-size:14px;line-height:1.6}
.quizi .ql-ability b{color:var(--lp-ink);font-weight:650;white-space:nowrap}

/* Фото в секции для студий -------------------------------------------------- */
.quizi .ql-agency__photo{
    width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;
    border:1px solid var(--q-line);border-radius:16px;background:var(--q-soft)
}
.quizi .ql-agency{align-items:center;margin-bottom:36px}
.quizi .ql-agency__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.quizi .ql-agency__list li:nth-child(2){border-top:0;padding-top:0}

/* Доступность и мелкая механика (по Web Interface Guidelines) --------------- */
/* Видимый фокус для всего интерактивного: раньше кнопки демо и ссылки
   полагались на браузерный контур, а у поля телефона он был снят вовсе. */
.quizi a:focus-visible,
.quizi button:focus-visible,
.quizi input:focus-visible,
.quizi summary:focus-visible{
    outline:2px solid var(--q-blue);outline-offset:3px;border-radius:6px
}

/* Тап без 300 мс задержки на кнопках и ссылках */
.quizi a,.quizi button,.quizi summary{touch-action:manipulation}
/* Цифры одной ширины: счётчик заявок и цены не должны «дёргаться» при смене */
.quizi .stat-num,.quizi .plan-price .amt,.quizi .plan-pkg{font-variant-numeric:tabular-nums}
/* Якорные секции не подъезжают вплотную к верхней кромке окна */
.quizi #features,.quizi #agency,.quizi #pricing,.quizi #faq,.quizi #integrations,.quizi #news{scroll-margin-top:24px}
/* Ссылка «к содержимому» для клавиатуры: видна только при фокусе */
.quizi .ql-skip{
    position:absolute;left:16px;top:-60px;z-index:60;padding:11px 18px;border-radius:10px;
    background:var(--q-ink);color:#fff;font-size:14px;font-weight:600;text-decoration:none;
    transition:top .16s ease
}
.quizi .ql-skip:focus{top:14px;color:#fff}
@media (prefers-reduced-motion:reduce){.quizi .ql-skip{transition:none}}

/* Адаптив -------------------------------------------------------------------- */
@media (max-width:1100px){
    
    
    .quizi .feat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
    
    
    
    
    .quizi .ql-agency{grid-template-columns:minmax(0,1fr);gap:36px}
    .quizi .sec-title,.quizi .feat-head h2,.quizi .why h2,.quizi .faq h2,
    .quizi .int-title,.quizi .cta h2,.quizi .ql-agency__text h2{font-size:34px}
    .quizi .niches{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .int-inner{padding:80px 22px}
    .quizi .cta-inner{padding:80px 22px}
    .quizi .ql-shot,.quizi .ql-shot:nth-child(even){grid-template-columns:minmax(0,1fr);gap:18px}
    .quizi .ql-shot:nth-child(even) img{order:1}
    .quizi .ql-shot:nth-child(even) figcaption{order:2}
    .quizi .ql-abilities{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .ql-agency__photo{max-width:560px}
    .quizi .ql-adv{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
    
    
    
    
    
    
    
    
    
    .quizi .sec-title,.quizi .feat-head h2,.quizi .why h2,.quizi .faq h2,
    .quizi .int-title,.quizi .cta h2,.quizi .ql-agency__text h2{font-size:28px}
    .quizi .steps,.quizi .feat-grid,.quizi .niches{grid-template-columns:minmax(0,1fr)}
    .quizi .feat-col + .feat-col,.quizi .step + .step{border-left:1px solid var(--q-line)}
    /* Цифры столбиком: ромб-разделитель уезжает наверх строки */
    
    
    
    .quizi .stat-num{font-size:32px}
    .quizi .cta-inner{padding:64px 18px}
    .quizi .why-row,.quizi .why-row:first-child{padding-left:28px}
    .quizi .ql-abilities,.quizi .ql-adv{grid-template-columns:minmax(0,1fr)}
    .quizi .ql-adv__item{padding:22px 20px}
    .quizi .ql-badges{gap:6px}
    .quizi .ql-badge{font-size:12px;padding:6px 11px}
    .quizi .ql-shot figcaption{padding:18px 18px 20px}
    .quizi .ql-agency__list{grid-template-columns:minmax(0,1fr);gap:0}
    .quizi .ql-agency__list li:nth-child(2){padding-top:20px;border-top:1px solid var(--q-line)}
    .quizi .example-body{padding:20px 18px 22px}
}

/* ============================================================================
   ТАБЛИЦА СРАВНЕНИЯ — третья редакция (05.08.2026).
   Претензия владельца: «мелочно и сухо». Было — 12 строк по 14px, где четыре
   строки стояли с галочкой во всех колонках: признанный паритет гасил те
   строки, ради которых таблица и существует. Убраны в разметке.
   Здесь таблица получает: размер (критерий 17px против 14px), пояснение под
   каждым критерием, группировку по смыслу и выделенную колонку сервиса —
   читателю должно быть видно, какая колонка его, ещё до чтения строк.
   ============================================================================ */
.quizi .compare-wrap{padding:0;border:1px solid var(--q-line);border-radius:20px;background:#fff;overflow:hidden}
.quizi .compare-table{font-size:15px;table-layout:fixed}
.quizi .compare-table th{padding:18px 22px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.quizi .compare-table th.compare-us{font-size:15px;letter-spacing:-.02em;text-transform:none;font-weight:700}
.quizi .compare-table td{padding:18px 22px;vertical-align:middle}
.quizi .compare-table col{width:auto}

/* Критерий: название + зачем это читателю. Голое «Оплата в BYN» заставляло
   додумывать выгоду самостоятельно — половина читателей не станет. */
/* Ширины заданы явно: при table-layout:fixed остаток делится поровну, и три
   колонки-ответа расходились на 18% каждая — метка терялась в пустоте, а
   критерий переносился по слогам. Ответу нужно ровно столько места, сколько
   занимает кружок с полем. */
.quizi .compare-crit{width:55%}
.quizi .compare-table th:not(.compare-crit):not(:first-child),
.quizi .compare-table td:not(.compare-crit):not(:first-child){width:15%;text-align:center}
.quizi .compare-crit b{display:block;font-size:17px;font-weight:650;line-height:1.35;color:var(--q-ink);letter-spacing:-.02em}
.quizi .compare-crit small{display:block;margin-top:5px;font-size:13.5px;line-height:1.5;color:var(--lp-muted)}

/* Группа строк. Заголовок внутри таблицы, а не отдельным блоком — иначе при
   горизонтальной прокрутке на мобильном он уезжает от своих строк. */
.quizi .compare-group th{
    padding:14px 22px 10px;background:var(--q-paper);color:var(--lp-faint);
    font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    border-bottom:1px solid var(--q-line);text-align:left
}
.quizi .compare-table tr.compare-group:hover th{background:var(--q-paper)}

/* Колонка сервиса подсвечена насквозь, включая заголовок и строки групп. */
.quizi .compare-table th.compare-us,.quizi .compare-table td.compare-us{
    background:var(--q-soft);color:var(--q-blue-deep);
    box-shadow:inset 1px 0 0 #dbe6fb,inset -1px 0 0 #dbe6fb
}
.quizi .compare-table tr:last-child td.compare-us{border-radius:0 0 4px 4px}

/* Метки крупнее: при 24px они читались как типографский мусор, а не как ответ. */
.quizi .compare-mark{width:32px;height:32px;font-size:17px;font-weight:700}
.quizi .compare-mark--yes{background:#E4F3EE;color:var(--q-green)}
.quizi .compare-mark--no{background:#F4F5F8;color:#9AA0B4}
.quizi .compare-mark--partial{background:#FFF4DE;color:#9A6400}

@media (max-width:860px){
    .quizi .compare-wrap{border-radius:16px}
    .quizi .compare-table{font-size:14px}
    .quizi .compare-table th,.quizi .compare-table td{padding:14px 14px}
    .quizi .compare-group th{padding:12px 14px 8px}
    .quizi .compare-crit{width:52%}
    .quizi .compare-crit b{font-size:15px}
    .quizi .compare-crit small{font-size:12.5px}
    .quizi .compare-mark{width:28px;height:28px;font-size:15px}
}

/* Живой виджет на первом экране (когда задан landing.demo_quiz).
   Виджет рисует себя сам внутри shadow DOM — снаружи задаём только место:
   ширину сцены и скругление, чтобы он сел в композицию рядом с панелью заявок.
   Своих отступов и фона не навязываем: оформление берётся из настроек квиза,
   и посетитель видит ровно то, что увидит на сайте клиента. */




/* Ниши с фотографиями (05.08.2026). Были контурные иконки и строка текста —
   владелец назвал секцию сухой. Снимки те же, что в витрине шаблонов: это
   превью квизов, права свои. Текст переписан с «что за ниша» на «что квиз
   делает в этой нише» — иначе карточка не отвечает, зачем нажимать. */
.quizi .niche--photo{padding:0;overflow:hidden;border:1px solid var(--q-line);background:#fff;display:flex;flex-direction:column}
.quizi .niche--photo:hover{transform:translateY(-3px)}
.quizi .niche__photo{width:100%;height:186px;object-fit:cover;display:block;background:#eef3fb}
.quizi .niche__body{padding:20px 22px 24px}
.quizi .niche--photo h3{margin:0 0 7px;font-size:18px;letter-spacing:-.02em}
.quizi .niche--photo p{font-size:14.5px;line-height:1.55}
.quizi .niches-more{
    max-width:720px;margin:26px auto 0;text-align:center;
    color:var(--lp-muted);font-size:14.5px;line-height:1.6
}
@media (max-width:860px){
    .quizi .niche__photo{height:158px}
    .quizi .niche__body{padding:17px 18px 20px}
    .quizi .niche--photo h3{font-size:16px}
}

/* Карточка новости с обложкой на главной. Тело обёрнуто в .ql-news-body,
   поэтому картинка идёт до краёв карточки, а не внутри её отступов —
   иначе обложка выглядит вклеенной, а не частью карточки. */
.quizi .ql-news-card--img{padding:0;overflow:hidden}
.quizi .ql-news-card--img .ql-news-thumb{height:180px;margin:0;border-radius:0}
.quizi .ql-news-card--img .ql-news-body{display:flex;flex-direction:column;padding:20px 22px 24px}
.quizi .ql-news-card .ql-news-body{display:flex;flex-direction:column}
.quizi .ql-news-card .ql-news-date{display:block}
.quizi .ql-news-card .ql-news-more{margin-top:auto}
@media (max-width:860px){
    .quizi .ql-news-card--img .ql-news-thumb{height:160px}
}

/* «Возможности»: колонка получает строку-обещание и пояснения к пунктам.
   Иконка колонки лежит в ::before с абсолютным позиционированием, поэтому
   новый абзац просто встаёт в поток под заголовком — сетку не трогаем. */
.quizi .feat-col{min-height:0;padding-bottom:28px}
.quizi .feat-col__lead{
    margin:-8px 0 16px;color:var(--lp-muted);font-size:14px;line-height:1.55
}
.quizi .feat-col li{align-items:flex-start;gap:11px}
.quizi .feat-col li .m{margin-top:7px}
.quizi .feat-col li b{display:block;font-weight:600;font-size:14.5px;color:var(--lp-ink);line-height:1.4}
.quizi .feat-col li i{display:block;margin-top:2px;font-style:normal;font-size:13px;line-height:1.5;color:var(--lp-faint)}

/* Платформы установки: настоящие логотипы вместо монограмм (05.08.2026).
   Прежние правила красили квадрат `span` фоном бренда — теперь фон не нужен,
   логотип цветной сам. Старые селекторы остаются для .ql-cms--code, поэтому
   здесь гасим их только там, где стоит картинка. */
.quizi .ql-cms img{
    flex:0 0 auto;width:auto;height:30px;max-width:112px;object-fit:contain;display:block
}
.quizi .ql-cms--wide img{height:22px;max-width:150px}
/* Селектор с тегом: правило прежней эпохи `.quizi .ql-cms span` задаёт любому
   span внутри карточки белый квадрат 34×34. Без тега в селекторе оно выигрывало
   по специфичности, и подпись становилась белым текстом в белом квадрате —
   логотипы стояли без названий. */
.quizi .ql-cms span.ql-cms__name{
    flex:1 1 auto;width:auto;height:auto;display:block;border-radius:0;background:none;
    color:var(--lp-ink);font-size:14px;font-weight:650;letter-spacing:-.01em;text-align:left
}
.quizi .ql-cms span.ql-cms__mono{
    flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;
    background:var(--q-blue);color:#fff;font-size:12px;font-weight:750
}
/* Логотип Tilda — знак в тёмно-сером; на белой карточке он теряется рядом с
   цветными соседями, поэтому карточке даём чуть более плотную рамку. */
.quizi .ql-cms[data-cms="tilda"] img{height:34px}
@media (max-width:620px){
    .quizi .ql-cms img{height:26px}
    .quizi .ql-cms--wide img{height:19px;max-width:128px}
}

/* Экран агентского режима — В ОДНУ КОЛОНКУ, подпись под картинкой.
   Базовый .ql-shot раскладывает фигуру в две колонки (картинка 62% ширины);
   для этого кадра так нельзя: он широкий (1650px), и в 55% контейнера
   переключатели и кнопки превращаются в нечитаемую кашу. Правило уже
   стоило круга на скриншоте библиотеки шаблонов — интерфейс показывают
   крупно либо не показывают вовсе. */
.quizi .ql-shot--agency{display:block;margin:34px 0 0}
.quizi .ql-shot--agency img{width:100%;height:auto}
.quizi .ql-shot--agency figcaption{max-width:760px;margin:18px auto 0;text-align:center}

/* Широкие кадры интерфейса — схема ветвлений и воронка по маршрутам.
   В базовой сетке .ql-shot картинка занимает 62% ширины; для этих двух так
   нельзя: на схеме 21 узел, а в воронке таблица маршрутов — в узкой колонке
   и то и другое превращается в серую рябь. Даём полную ширину, подпись
   уводим под кадр. */
.quizi .ql-shot--wide{display:block}
.quizi .ql-shot--wide img{width:100%;height:auto}
.quizi .ql-shot--wide figcaption{max-width:860px;margin:18px auto 0;text-align:center}

/* Колонка под демо-квиз шире (05.08.2026, просьба владельца).
   Было minmax(420px,452px): в 450px настоящий квиз тесен — заголовок уходил
   в пять строк, а слова переносились по слогам. Отдаём сцене 560px и
   сокращаем зазор: левая колонка текстовая, ей ужаться безопаснее.
   Ниже 1180px правило из медиазапроса ставит колонку обратно ~380-410px —
   там квиз уже одноколоночный и лишняя ширина не нужна. */

@media (max-width:1240px){
    
}

/* =========================================================================
   ВЕТВЛЕНИЯ (#branching)
   Схема маршрута, а не картинка: один вопрос → развилка ромбом → три ветки
   со своими вопросами и своей заявкой. Ромб здесь работает как элемент
   схемы, а не украшение — это и есть знак страницы.
   Соединители тонкие, но НЕ волосяные: на белом линия в 1px с малой альфой
   исчезает — берём 1.5px и плотный цвет, иначе развилки не видно вовсе.
   ========================================================================= */
.quizi .ql-branch{
    --branch-gap:20px;
    --branch-line:rgba(37,99,235,.32);
    max-width:1000px;margin:0 auto;
}
.quizi .ql-branch__root{
    max-width:420px;margin:0 auto;padding:18px 22px;text-align:center;
    background:#fff;border:1px solid var(--line);border-radius:16px;
    box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.quizi .ql-branch__root b{display:block;font-size:18px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-top:4px}
.quizi .ql-branch__step{
    display:block;font-size:12px;font-weight:600;letter-spacing:.02em;
    text-transform:uppercase;color:var(--muted);
}
/* Развилка: вертикальный отрезок с ромбом посередине. */
.quizi .ql-branch__fork{position:relative;height:56px}
.quizi .ql-branch__fork::before{
    content:"";position:absolute;left:50%;top:0;bottom:0;width:1.5px;
    transform:translateX(-50%);background:var(--branch-line);
}
.quizi .ql-branch__diamond{
    position:absolute;left:50%;top:50%;width:14px;height:14px;
    transform:translate(-50%,-50%) rotate(45deg);
    background:var(--blue);border-radius:3px;
}
.quizi .ql-branch__paths{
    position:relative;display:grid;gap:var(--branch-gap);
    grid-template-columns:repeat(3,minmax(0,1fr));
}
/* Перемычка соединяет центры крайних колонок: при трёх равных колонках
   центр первой отстоит от края ровно на (ширина − 2 зазора) / 6. */
.quizi .ql-branch__paths::before{
    content:"";position:absolute;top:-1px;height:1.5px;background:var(--branch-line);
    left:calc((100% - var(--branch-gap) * 2) / 6);
    right:calc((100% - var(--branch-gap) * 2) / 6);
}
.quizi .ql-branch__path{position:relative;display:grid;gap:10px;align-content:start;padding-top:22px}
.quizi .ql-branch__path::before{
    content:"";position:absolute;left:50%;top:0;height:22px;width:1.5px;
    transform:translateX(-50%);background:var(--branch-line);
}
.quizi .ql-branch__answer{
    justify-self:center;padding:7px 16px;border-radius:999px;
    background:rgba(37,99,235,.08);color:var(--blue-dark);
    font-size:14px;font-weight:700;letter-spacing:-.01em;
}
.quizi .ql-branch__next{
    padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:12px;
    font-size:14px;line-height:1.4;color:var(--ink);
}
.quizi .ql-branch__lead{
    margin-top:2px;padding:14px;border-radius:12px;
    background:rgba(37,99,235,.06);border:1px solid rgba(37,99,235,.18);
    font-size:14px;line-height:1.45;color:var(--ink);
}
/* b внутри — отдельной строкой: во flex-строке жирное слово отрывается от
   остального текста, это на странице уже случалось. */
.quizi .ql-branch__lead b{display:block;font-size:12px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--blue-dark);margin-bottom:4px}
.quizi .ql-branch__note{
    margin:26px auto 0;max-width:620px;text-align:center;
    font-size:15px;line-height:1.5;color:var(--muted);
}
@media (max-width:860px){
    .quizi .ql-branch__paths{grid-template-columns:minmax(0,1fr);gap:30px}
    /* В столбик соединители убираем ЦЕЛИКОМ — и перемычку, и отрезки над
       ветками. С ними заявка первой ветки оказывалась связана линией со
       следующим ответом, и три параллельных маршрута читались как один
       длинный сценарий из девяти вопросов — ровно противоположное тому, что
       секция объясняет. Ветки разделяет увеличенный зазор. */
    .quizi .ql-branch__paths::before,
    .quizi .ql-branch__path::before{display:none}
    .quizi .ql-branch__fork{height:40px}
    .quizi .ql-branch__path{padding-top:0}
}
.footer-payments{display:flex;justify-content:space-between;gap:8px;width:100%;padding:10px 32px ;    max-width: var(--maxw);margin:0 auto}
.footer-payment{width:calc(10% - 7px);min-height:34px;background-position:center;background-size:contain;background-repeat:no-repeat;filter:grayscale(1) brightness(1.5);opacity:.75}.footer-payment.alfa{background-image:url("/media/img/payments/alfa.svg")}.footer-payment.erip{background-image:url("/media/img/payments/erip.svg")}.footer-payment.expresspay{background-image:url("/media/img/payments/expresspay.png")}.footer-payment.mc{background-image:url("/media/img/payments/mc.svg")}.footer-payment.mc2{background-image:url("/media/img/payments/mcpos.svg")}.footer-payment.visa{background-image:url("/media/img/payments/visa.svg")}.footer-payment.visa2{background-image:url("/media/img/payments/visa2.svg")}.footer-payment.belkart2{background-image:url("/media/img/payments/belkart.png")}.footer-payment.belkart{background-image:url("/media/img/payments/belkart.svg")}.footer-payment.applepay{background-image:url("/media/img/payments/applepay.svg")}.footer-payment.samsungpay{background-image:url("/media/img/payments/samsungpay.svg")}
/* =========================================================================
   ШАПКА И ПЕРВЫЙ ЭКРАН НА ТЕЛЕФОНЕ — три исправления.
   Блок стоит В САМОМ КОНЦЕ файла намеренно: все три правила перебивают
   объявления, стоящие выше, а при равной специфичности в CSS выигрывает
   последнее. Дописывать что-либо ниже — значит рисковать вернуть эти баги.
   ========================================================================= */

/* 1. Мобильное меню не открывалось.
      Виновник — правило старой эпохи из style.css: `@media (max-width:960px)
      .nav{height:0;overflow:hidden}`. Селектор голый, без префикса, поэтому он
      применяется и к шапке лендинга. Само меню при клике честно получало класс
      `open` и раскрывалось (проверено по DOM: 358×284), но родитель обрезал его
      по высоте шапки — снаружи это выглядело как «кнопка не работает».
      Лечим не отменой класса, а возвратом нормальных высоты и переполнения. */
@media (max-width:960px){
    .quizi .nav{height:auto;min-height:64px;overflow:visible}
}

/* 2. Первый экран разъезжался на телефоне.
      Сетка оставалась двухколоночной: `minmax(0,1fr)` схлопывался в НОЛЬ, а
      карточка квиза занимала 440px при экране 358px. Заголовок в колонке
      нулевой ширины переносился по одному слову: «Конструктор / квизов / для /
      сайта». Мобильное правило в файле есть выше, но ниже него стоит
      `@media (max-width:1240px)` с двумя колонками — и он действует на 390px
      тоже. */
@media (max-width:900px){
    
}

/* 3. Вход в кабинет рядом с бургером (разметка — layouts/landing_nav.php).
      На широком экране компактная кнопка не нужна: там есть обычная в ряду
      ссылок. На телефоне наоборот — прячем ту, что внутри выпадающего меню,
      иначе кнопка «Кабинет» показывается дважды. */
.quizi .nav-cta--compact{display:none}
@media (max-width:960px){
    .quizi .nav-cta--compact{
        display:inline-flex;align-items:center;justify-content:center;
        margin-left:auto;margin-right:10px;
        min-width:0;padding:9px 16px;border-radius:9px;
        font-size:14px;font-weight:600;line-height:1;white-space:nowrap;
        background:var(--q-ink,#0f172a);color:#fff
    }
    .quizi .nav-cta--compact:hover{background:var(--q-blue-deep,#1d4ed8);color:#fff}
    /* Бургер прижат к правому краю, кнопка — слева от него. */
    .quizi .nav-toggle{margin-left:0}
    /* Дубль внутри меню на телефоне не нужен. */
    .quizi .nav-links a.nav-cta:not(.nav-cta--compact){display:none}

    /* Бургер включается на той же ширине, что и компактная кнопка входа.
       БЫЛО: кнопка появлялась с 960px, а бургер — только с 600px. В полосе
       601–960px шапка показывала СРАЗУ и компактную кнопку, и полный ряд
       ссылок, у которого при этом спрятана своя кнопка входа. Ряд уже стоял
       на минимальных отступах (gap 2px), то есть держался впритык: седьмой
       пункт («Шаблоны») переполнил его, и на планшете 768px появилась
       горизонтальная прокрутка страницы.
       Правила повторяют мобильные (@media max-width:600px), но со своей
       специфичностью — те в этой полосе не действуют. */
    .quizi .nav-links{display:none}
    .quizi .nav-links.open{
        display:flex;position:absolute;top:64px;left:0;right:0;z-index:20;
        flex-direction:column;align-items:flex-start;gap:4px;
        padding:12px;margin:0;border:1px solid var(--lp-line);border-radius:14px;
        background:#fff;box-shadow:0 20px 48px -22px rgba(16,24,40,.35)
    }
    .quizi .nav-links.open a{width:100%;padding:10px 8px}
    .quizi .nav-toggle{
        display:inline-flex;align-items:center;justify-content:center;
        width:40px;height:40px;border:1px solid var(--lp-line);border-radius:9px;
        background:#fff;cursor:pointer
    }
}

/* ==========================================================================
   HERO — canonical block, 09.08.2026
   Один слой правил. Старые hero/ql-demo overrides удалены из этого файла.
   ========================================================================== */
.quizi .hero--lead{
    position:relative;
    overflow:hidden;
    border-bottom:1px solid var(--q-line,#e2e8f0);
    background:
        radial-gradient(44% 58% at 86% 18%,rgba(37,99,235,.10),transparent 72%),
        linear-gradient(180deg,#ffffff 0%,#f8faff 100%);
}
.quizi .hero--lead .hero-inner{position:relative;z-index:1;padding-top:0}
.quizi .hero--lead .nav{
    min-height:76px;padding:0;margin:0;border:0;border-radius:0;background:transparent;
    box-shadow:none;backdrop-filter:none;gap:40px
}
.quizi .hero--lead .brand-mark{border-radius:9px;background:var(--q-blue,#2563eb);box-shadow:none}
.quizi .hero--lead .nav-links{margin-left:auto;gap:6px}
.quizi .hero--lead .nav-links a:hover{background:#eff6ff;color:#1d4ed8}
.quizi .hero--lead .nav-links a.nav-cta{background:#141626;color:#fff;box-shadow:none}
.quizi .hero--lead .nav-links a.nav-cta:hover{background:#1d4ed8;color:#fff}

.quizi .hero--lead .hero-cols{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(500px,560px);
    gap:64px;align-items:center;padding:66px 0 86px
}
.quizi .hero-copy{min-width:0}
.quizi .hero--lead h1{
    max-width:650px;margin:0 0 18px;color:#141626;font-size:56px;line-height:1.02;
    font-weight:750;letter-spacing:-.05em;text-wrap:balance
}
.quizi .hero--lead h1 span{color:#2563eb}
.quizi .hero-promise{
    max-width:620px;margin:0 0 12px;color:#141626;font-size:24px;line-height:1.35;
    font-weight:650;letter-spacing:-.025em
}
.quizi .hero--lead .hero-sub{
    max-width:610px;margin:0 0 28px;color:#5c6280;font-size:17px;line-height:1.65
}
.quizi .hero--lead .hero-actions{display:flex;align-items:stretch;gap:12px;margin:0 0 30px;flex-wrap:wrap}
.quizi .ql-btn-lead{
    min-height:62px;padding:10px 24px;display:inline-flex;flex-direction:column;align-items:flex-start;
    justify-content:center;gap:2px;border-radius:10px;background:#2563eb;color:#fff;font-size:16px;
    font-weight:700;line-height:1.2;box-shadow:0 12px 28px -16px rgba(37,99,235,.72)
}
.quizi .ql-btn-lead:hover{background:#1d4ed8;color:#fff;transform:translateY(-1px)}
.quizi .ql-btn-lead small{font-size:12.5px;font-weight:500;opacity:.82;letter-spacing:0}
.quizi .ql-btn-demo{
    min-height:62px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
    border:1px solid #d7dfeb;border-radius:10px;background:#fff;color:#141626;font-size:15px;
    font-weight:650;text-decoration:none;transition:border-color .16s,color .16s,background .16s
}
.quizi .ql-btn-demo:hover{border-color:#2563eb;background:#f8faff;color:#2563eb}
.quizi .ql-btn-demo s{text-decoration:none;transition:transform .16s ease}
.quizi .ql-btn-demo:hover s{transform:translateX(3px)}

.quizi .hero-proof{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;max-width:650px;
    margin:0;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0
}
.quizi .hero-proof__item{min-width:0;padding:15px 18px 15px 0}
.quizi .hero-proof__item:nth-child(even){padding-left:20px;border-left:1px solid #e2e8f0}
.quizi .hero-proof__item:nth-child(n+3){border-top:1px solid #e2e8f0}
.quizi .hero-proof__item b{display:block;margin-bottom:2px;color:#141626;font-size:14px;font-weight:700}
.quizi .hero-proof__item span{display:block;color:#667085;font-size:12.5px;line-height:1.45}
.quizi .hero-agency{
    display:inline-flex;align-items:center;gap:7px;margin-top:18px;color:#475467;font-size:13.5px;
    font-weight:600;text-decoration:none
}
.quizi .hero-agency:hover{color:#2563eb}
.quizi .hero-agency s{text-decoration:none;transition:transform .16s ease}
.quizi .hero-agency:hover s{transform:translateX(3px)}

.quizi .hero-product{min-width:0;position:relative}
.quizi .hero-demo-head{
    display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 2px 10px;
    color:#667085;font-size:12px;line-height:1.3
}
.quizi .hero-demo-head > span{display:inline-flex;align-items:center;gap:8px;color:#344054;font-weight:700}
.quizi .hero-demo-head i{width:8px;height:8px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 4px rgba(22,163,74,.10)}
.quizi .hero-demo-head small{font-size:12px;color:#98a2b3}

.quizi .ql-demo{
    border:1px solid #dbe3ef;border-radius:18px;background:#fff;overflow:hidden;
    box-shadow:0 28px 70px -42px rgba(20,35,80,.48)
}
.quizi .ql-demo__card{min-height:340px;padding:24px;border-radius:18px;background:#fff;color:#141626}
.quizi .ql-demo__progress{height:5px;border-radius:999px;background:#e8edf5;overflow:hidden}
.quizi .ql-demo__progress i{display:block;height:100%;border-radius:999px;background:#2563eb;transition:width .35s ease}
.quizi .ql-demo__card small{display:block;margin:12px 0 6px;color:#667085;font-size:12px;font-weight:600}
.quizi .ql-demo__card h3{margin:0 0 16px;color:#141626;font-size:22px;line-height:1.3;font-weight:700;letter-spacing:-.02em}
.quizi .ql-demo__screen button,.quizi .ql-demo__screen input{
    display:block;width:100%;min-height:50px;margin:0 0 9px;padding:0 14px;border:1px solid #dfe5ef;
    border-radius:9px;background:#fff;color:#344054;font-family:inherit;font-size:14px;font-weight:550
}
.quizi .ql-demo__screen button{text-align:left;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
.quizi .ql-demo__screen button:hover{border-color:#2563eb;background:#eff6ff;color:#1d4ed8}
.quizi .ql-demo__screen input:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.quizi .ql-demo__screen .ql-demo__submit{text-align:center;background:#2563eb;border-color:#2563eb;color:#fff;font-weight:650}
.quizi .ql-demo__screen .ql-demo__submit:hover{background:#1d4ed8;color:#fff}
.quizi .ql-demo__screen p{margin:0 0 14px;color:#667085;font-size:14px;line-height:1.6}
.quizi .ql-demo__done{display:flex;align-items:center;gap:10px;margin:0 0 14px}
.quizi .ql-demo__done i{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#e8f6f0;color:#12805c;font-style:normal;font-size:18px;font-weight:800}
.quizi .ql-demo__done span{color:#12805c;font-size:14px;font-weight:700}
.quizi .ql-demo--live{padding:0;background:transparent;border:0;box-shadow:none;overflow:visible}
.quizi .ql-demo__live{min-height:320px;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 28px 70px -42px rgba(20,35,80,.48)}
.quizi .ql-demo__live:empty::after{content:'Квиз загружается…';display:grid;place-items:center;height:320px;border:1px solid #dbe3ef;border-radius:18px;background:#fff;color:#98a2b3;font-size:14px}

@media (max-width:1240px){
    .quizi .hero--lead .hero-cols{grid-template-columns:minmax(0,1fr) minmax(430px,480px);gap:44px}
    .quizi .hero--lead h1{font-size:48px}
    .quizi .hero-promise{font-size:21px}
}
@media (max-width:960px){
    .quizi .hero--lead .nav{height:auto;min-height:64px;overflow:visible}
    .quizi .hero--lead .hero-cols{grid-template-columns:minmax(0,1fr);gap:48px;padding:48px 0 68px}
    .quizi .hero--lead h1{max-width:760px;font-size:46px}
    .quizi .hero--lead .hero-sub,.quizi .hero-promise{max-width:720px}
    .quizi .hero-product{max-width:620px;width:100%;margin:0 auto}
}
@media (max-width:620px){
    .quizi .hero--lead .hero-cols{gap:38px;padding:34px 0 52px}
    .quizi .hero--lead h1{font-size:34px;line-height:1.06;letter-spacing:-.04em}
    .quizi .hero-promise{font-size:19px}
    .quizi .hero--lead .hero-sub{font-size:15.5px;line-height:1.6}
    .quizi .hero--lead .hero-actions{display:grid;grid-template-columns:minmax(0,1fr)}
    .quizi .ql-btn-lead,.quizi .ql-btn-demo{width:100%;align-items:center;text-align:center}
    .quizi .hero-proof{grid-template-columns:minmax(0,1fr)}
    .quizi .hero-proof__item,.quizi .hero-proof__item:nth-child(even){padding:12px 0;border-left:0}
    .quizi .hero-proof__item:nth-child(n+2){border-top:1px solid #e2e8f0}
    .quizi .hero-demo-head{align-items:flex-start;flex-direction:column;gap:4px}
    .quizi .ql-demo__card{min-height:0;padding:18px}
    .quizi .ql-demo__card h3{font-size:19px}
}

/* ==========================================================================
   БЛОК 02 — КАК РАБОТАЕТ КВИЗ НА САЙТЕ, v5
   Редакционная подача без панелей: текст + реальные экраны продукта.
   ========================================================================= */
.quizi .ql-story{background:#fff;border-bottom:1px solid #e2e8f0}
.quizi .ql-story__inner{padding-top:104px;padding-bottom:116px}
.quizi .ql-story__intro{max-width:900px;margin-bottom:88px}
.quizi .ql-story__eyebrow{display:block;margin-bottom:14px;color:#2563eb;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.quizi .ql-story__intro h2{max-width:820px;margin:0 0 20px;color:#141626;font-size:48px;line-height:1.06;font-weight:750;letter-spacing:-.045em;text-wrap:balance}
.quizi .ql-story__intro p{max-width:780px;margin:0;color:#667085;font-size:17px;line-height:1.68}

.quizi .ql-story__row{display:grid;grid-template-columns:minmax(250px,.52fr) minmax(0,1.48fr);gap:72px;align-items:center;margin:0 0 112px}
.quizi .ql-story__row--reverse{grid-template-columns:minmax(0,1.48fr) minmax(250px,.52fr)}
.quizi .ql-story__row--reverse .ql-story__text{order:2}
.quizi .ql-story__row--reverse .ql-story__shot{order:1}
.quizi .ql-story__text{max-width:360px}
.quizi .ql-story__step{display:block;margin-bottom:16px;color:#2563eb;font-size:13px;font-weight:800;letter-spacing:.08em}
.quizi .ql-story__text h3,.quizi .ql-story__finish h3{margin:0 0 12px;color:#141626;font-size:28px;line-height:1.14;font-weight:730;letter-spacing:-.035em}
.quizi .ql-story__text p,.quizi .ql-story__finish p{margin:0;color:#667085;font-size:15.5px;line-height:1.68}

.quizi .ql-story__shot{display:block;min-width:0;position:relative}
.quizi .ql-story__shot img{display:block;width:100%;height:auto;background:#fff;border:1px solid #dbe3ef;box-shadow:0 28px 64px -48px rgba(20,35,80,.55)}
.quizi .ql-story__shot--question img{max-width:830px}
.quizi .ql-story__shot--form img{max-width:790px;margin-left:auto}

.quizi .ql-story__finish{padding-top:68px;border-top:1px solid #e2e8f0}
.quizi .ql-story__finish-head{display:grid;grid-template-columns:48px minmax(0,660px);gap:0;margin-bottom:34px}
.quizi .ql-story__finish-head .ql-story__step{margin:6px 0 0}
.quizi .ql-story__lead{display:block;max-width:1000px;margin-left:auto}
.quizi .ql-story__lead img{display:block;width:100%;height:auto;background:#fff;border:1px solid #e2e8f0;box-shadow:0 24px 60px -48px rgba(20,35,80,.5)}

@media (max-width:900px){
    .quizi .ql-story__intro{margin-bottom:62px}
    .quizi .ql-story__row,.quizi .ql-story__row--reverse{grid-template-columns:minmax(0,1fr);gap:26px;margin-bottom:76px}
    .quizi .ql-story__row--reverse .ql-story__text{order:1}
    .quizi .ql-story__row--reverse .ql-story__shot{order:2}
    .quizi .ql-story__text{max-width:680px}
    .quizi .ql-story__shot--form img{margin-left:0}
    .quizi .ql-story__lead{margin-left:0}
}
@media (max-width:620px){
    .quizi .ql-story__inner{padding-top:74px;padding-bottom:80px}
    .quizi .ql-story__intro{margin-bottom:48px}
    .quizi .ql-story__intro h2{font-size:32px;line-height:1.1}
    .quizi .ql-story__intro p{font-size:15.5px}
    .quizi .ql-story__row{margin-bottom:58px}
    .quizi .ql-story__text h3,.quizi .ql-story__finish h3{font-size:23px}
    .quizi .ql-story__text p,.quizi .ql-story__finish p{font-size:14.5px}
    .quizi .ql-story__finish{padding-top:48px}
    .quizi .ql-story__finish-head{grid-template-columns:38px minmax(0,1fr);margin-bottom:24px}
    .quizi .ql-story__shot img,.quizi .ql-story__lead img{box-shadow:none}
}


/* ==========================================================================
   QUIZI.BY — FULL LANDING SECTIONS 2–15
   Hero intentionally untouched. All new homepage blocks use lp-* classes.
   ========================================================================== */

.quizi{--lp2-blue:#2563eb;--lp2-blue-dark:#1d4ed8;--lp2-ink:#111827;--lp2-text:#475569;--lp2-muted:#667085;--lp2-line:#e2e8f0;--lp2-soft:#f7f9fc;--lp2-white:#fff}

/* ========================================================================
   BLOCKS 2–15 — complete redesign. Approved Hero above is untouched.
   ======================================================================== */
.quizi .nx-section{position:relative;padding:112px 0;background:#fff;overflow:hidden}
.quizi .nx-kicker{display:block;margin-bottom:14px;color:#2563eb;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.quizi .nx-head{max-width:860px;margin:0 0 56px}
.quizi .nx-head h2,.quizi .nx-belarus-head h2,.quizi .nx-agency-copy h2,.quizi .nx-final h2{margin:0;color:#111827;font-size:52px;line-height:1.04;font-weight:780;letter-spacing:-.05em;text-wrap:balance}
.quizi .nx-head>p,.quizi .nx-head--split>p,.quizi .nx-belarus-head p,.quizi .nx-agency-copy>p{margin:20px 0 0;color:#667085;font-size:17px;line-height:1.72}
.quizi .nx-head--split{max-width:none;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);gap:76px;align-items:start}
.quizi .nx-head--split>p{margin-top:28px;max-width:520px}
.quizi .nx-head--center{margin-left:auto;margin-right:auto;text-align:center}.quizi .nx-head--center p{max-width:650px;margin-left:auto;margin-right:auto}
.quizi .nx-cta-row{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:42px}.quizi .nx-cta-row span{color:#8b95a7;font-size:13.5px}
.quizi .nx-text-list{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:12px}.quizi .nx-text-list li{position:relative;padding-left:24px;color:#475569;font-size:15px}.quizi .nx-text-list li::before{content:"";position:absolute;left:2px;top:8px;width:8px;height:8px;background:#2563eb;transform:rotate(45deg)}
.quizi .nx-product-shot{display:block;min-width:0}.quizi .nx-product-shot img{display:block;width:100%;height:auto}

/* 2 — visual story: compact editorial flow */
.quizi .nx-story2{padding-top:88px;padding-bottom:94px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.quizi .nx-story2-head{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.72fr);gap:64px;align-items:start;margin-bottom:38px}
.quizi .nx-story2-head h2{max-width:690px;margin:0;color:#111827;font-size:47px;line-height:1.04;font-weight:780;letter-spacing:-.048em;text-wrap:balance}
.quizi .nx-story2-head>p{max-width:470px;margin:28px 0 0;color:#667085;font-size:16px;line-height:1.68}
.quizi .nx-story2-layout{display:grid;grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr);gap:50px;align-items:start}
.quizi .nx-story2-steps{display:grid;gap:8px}
.quizi .nx-story2-step{display:grid;grid-template-columns:190px minmax(0,1fr);gap:22px;align-items:center;padding:8px 0}
.quizi .nx-story2-art{display:block;overflow:hidden;border-radius:20px;box-shadow:0 16px 40px -34px rgba(15,23,42,.26)}
.quizi .nx-story2-art img{display:block;width:100%;height:auto}
.quizi .nx-story2-copy{position:relative;padding-left:48px}
.quizi .nx-story2-copy::after{content:"";position:absolute;left:16px;top:39px;bottom:-34px;border-left:1px dashed #d6ddeb}
.quizi .nx-story2-step:last-child .nx-story2-copy::after{display:none}
.quizi .nx-story2-copy>span{position:absolute;left:0;top:0;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#2563eb;color:#fff;font-size:11px;font-weight:800;box-shadow:0 12px 26px -18px rgba(37,99,235,.7)}
.quizi .nx-story2-step--green .nx-story2-copy>span{background:#22b663}.quizi .nx-story2-step--violet .nx-story2-copy>span{background:#6d4df6}.quizi .nx-story2-step--amber .nx-story2-copy>span{background:#f5a10a}
.quizi .nx-story2-copy h3{margin:1px 0 7px;color:#111827;font-size:20px;line-height:1.18;font-weight:760;letter-spacing:-.025em}
.quizi .nx-story2-copy p{margin:0;color:#667085;font-size:13.5px;line-height:1.58}
.quizi .nx-story2-proof{position:sticky;top:22px;padding:20px 22px 22px;border-radius:28px;background:linear-gradient(145deg,#f4f7ff 0%,#fff 54%,#f7f9fc 100%);box-shadow:inset 0 0 0 1px #e5eaf2}
.quizi .nx-story2-proof-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-bottom:16px}
.quizi .nx-story2-proof-head b{color:#111827;font-size:15px}.quizi .nx-story2-proof-head span{color:#8792a6;font-size:12px;white-space:nowrap}
.quizi .nx-story2-screen{display:block;overflow:hidden;border-radius:15px;background:#fff;box-shadow:0 20px 48px -38px rgba(15,23,42,.38);border:1px solid #e8edf4}
.quizi .nx-story2-screen img{display:block;width:100%;height:auto}
.quizi .nx-story2-screen--question img{max-height:250px;object-fit:cover;object-position:top}
.quizi .nx-story2-screen--form img{max-height:255px;object-fit:cover;object-position:top}
.quizi .nx-story2-screen--lead img{max-height:168px;object-fit:cover;object-position:top}
.quizi .nx-story2-arrow{height:24px;display:grid;place-items:center;color:#9aabca;font-size:17px;font-weight:700}
.quizi .nx-story2-bottom{display:flex;align-items:center;justify-content:space-between;gap:34px;margin-top:34px;padding-top:24px;border-top:1px solid #e3e8f0}
.quizi .nx-story2-bottom p{max-width:820px;margin:0;color:#5d687a;font-size:14.5px;line-height:1.65}.quizi .nx-story2-bottom p b{color:#111827}
.quizi .nx-story2-bottom a{display:inline-flex;align-items:center;gap:8px;color:#2563eb;font-size:14px;font-weight:750;text-decoration:none;white-space:nowrap}.quizi .nx-story2-bottom a span{transition:transform .16s ease}.quizi .nx-story2-bottom a:hover span{transform:translateX(3px)}

/* 3 — editor as product theatre, not cards */
.quizi .nx-editor{background:#fff}
.quizi .nx-editor-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:36px;align-items:stretch;padding:24px;background:linear-gradient(135deg,#edf3ff 0%,#f7f9fc 56%,#eef5ff 100%);border-radius:32px}
.quizi .nx-editor-rail{display:flex;flex-direction:column;justify-content:center;padding:22px 8px 22px 12px}.quizi .nx-editor-rail>div{padding:22px 0;border-top:1px solid rgba(37,99,235,.14)}.quizi .nx-editor-rail>div:first-child{border-top:0}.quizi .nx-editor-rail b{display:block;margin-bottom:10px;color:#2563eb;font-size:12px;letter-spacing:.08em}.quizi .nx-editor-rail strong{display:block;margin-bottom:6px;color:#111827;font-size:18px}.quizi .nx-editor-rail span{display:block;color:#667085;font-size:13.5px;line-height:1.55}
.quizi .nx-product-shot--main img{border-radius:22px;box-shadow:0 34px 80px -50px rgba(15,23,42,.48);border:1px solid rgba(255,255,255,.8)}
.quizi .nx-editor-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px;margin-top:42px}.quizi .nx-editor-details figure{margin:0;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(180px,.65fr);gap:22px;align-items:center}.quizi .nx-editor-details picture{display:block;overflow:hidden;border-radius:18px;background:#f7f9fc}.quizi .nx-editor-details img{display:block;width:100%;height:auto}.quizi .nx-editor-details figcaption b{display:block;margin-bottom:7px;color:#111827;font-size:18px}.quizi .nx-editor-details figcaption span{display:block;color:#667085;font-size:14px;line-height:1.6}

/* 4 — settings editorial split + ribbon */
.quizi .nx-settings{background:#f7f9fc}
.quizi .nx-settings-grid{display:grid;grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);gap:68px;align-items:center}.quizi .nx-settings-grid .nx-head{margin:0}.quizi .nx-product-shot--design{padding:18px;background:#fff;border-radius:26px;box-shadow:0 30px 70px -52px rgba(15,23,42,.35)}.quizi .nx-product-shot--design img{border-radius:16px}
.quizi .nx-settings-ribbon{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:46px}.quizi .nx-settings-ribbon figure{margin:0}.quizi .nx-settings-ribbon picture{display:block;height:168px;overflow:hidden;border-radius:16px;background:#fff}.quizi .nx-settings-ribbon img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.quizi .nx-settings-ribbon figcaption{padding:14px 2px 0}.quizi .nx-settings-ribbon figcaption b{display:block;color:#111827;font-size:15.5px}.quizi .nx-settings-ribbon figcaption span{display:block;margin-top:5px;color:#7b8798;font-size:13px;line-height:1.5}

/* 5 — branching gets its own visual identity */
.quizi .nx-branching{background:linear-gradient(180deg,#fff 0%,#f4f8ff 48%,#fff 100%)}
.quizi .nx-branch-stage{padding:24px;border-radius:32px;background:radial-gradient(circle at 50% 12%,rgba(37,99,235,.13),transparent 42%),#f7faff;box-shadow:inset 0 0 0 1px #e2e8f0}.quizi .nx-branch-stage img{display:block;width:100%;height:auto;border-radius:18px;box-shadow:0 34px 80px -56px rgba(15,23,42,.5)}
.quizi .nx-branch-pair{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:38px}.quizi .nx-branch-pair figure{margin:0}.quizi .nx-branch-pair picture{display:block;overflow:hidden;border-radius:18px;background:#fff}.quizi .nx-branch-pair img{display:block;width:100%;height:auto}.quizi .nx-branch-pair figcaption{padding:16px 4px 0}.quizi .nx-branch-pair b{display:block;color:#111827;font-size:18px}.quizi .nx-branch-pair span{display:block;margin-top:6px;color:#667085;font-size:14px;line-height:1.6}

/* 6 — leads */
.quizi .nx-leads{background:#f7f9fc}.quizi .nx-leads-grid{display:grid;grid-template-columns:minmax(320px,.66fr) minmax(0,1.34fr);gap:64px;align-items:center}.quizi .nx-leads .nx-head{margin:0}.quizi .nx-product-shot--leads{padding:20px;border-radius:28px;background:linear-gradient(135deg,#eaf2ff,#fff);box-shadow:0 30px 74px -54px rgba(15,23,42,.35)}.quizi .nx-product-shot--leads img{border-radius:14px}
.quizi .nx-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:30px 0 0;border-top:1px solid #dde5f1;border-bottom:1px solid #dde5f1}.quizi .nx-facts div{padding:16px 10px 16px 0}.quizi .nx-facts dt{color:#2563eb;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.quizi .nx-facts dd{margin:4px 0 0;color:#475569;font-size:13px}

/* 7 — analytics */
.quizi .nx-analytics{background:#fff}.quizi .nx-analytics-hero{padding:22px;border-radius:30px;background:linear-gradient(135deg,#f3efff,#f7faff)}.quizi .nx-analytics-hero img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 30px 70px -54px rgba(58,45,112,.36)}
.quizi .nx-analytics-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:32px}.quizi .nx-analytics-pair figure{margin:0}.quizi .nx-analytics-pair picture{display:block;overflow:hidden;border-radius:18px;background:#f7f9fc}.quizi .nx-analytics-pair img{display:block;width:100%;height:auto}.quizi .nx-analytics-pair figcaption{padding:15px 3px 0}.quizi .nx-analytics-pair b{display:block;color:#111827;font-size:17px}.quizi .nx-analytics-pair span{display:block;margin-top:6px;color:#667085;font-size:14px}

/* 8 — agency contrast section */
.quizi .nx-agency{background:#111827;color:#fff}.quizi .nx-agency-grid{display:grid;grid-template-columns:minmax(320px,.7fr) minmax(0,1.3fr);gap:64px;align-items:center}.quizi .nx-agency .nx-kicker{color:#7aa2ff}.quizi .nx-agency-copy h2{color:#fff}.quizi .nx-agency-copy>p{color:#b8c2d2}.quizi .nx-agency-copy ul{list-style:none;margin:28px 0 32px;padding:0;display:grid;gap:12px}.quizi .nx-agency-copy li{position:relative;padding-left:23px;color:#d0d7e2;font-size:14.5px}.quizi .nx-agency-copy li::before{content:"";position:absolute;left:2px;top:7px;width:8px;height:8px;background:#5f8df7;transform:rotate(45deg)}
.quizi .nx-light-btn{display:inline-flex;min-height:50px;align-items:center;padding:0 22px;border-radius:10px;background:#fff;color:#111827;text-decoration:none;font-weight:750}.quizi .nx-agency-shot{display:block;padding:18px;border-radius:28px;background:#1d2940}.quizi .nx-agency-shot img{display:block;width:100%;height:auto;border-radius:17px;box-shadow:0 36px 86px -54px rgba(0,0,0,.7)}

/* 9 — templates mosaic */
.quizi .nx-templates{background:#fff}.quizi .nx-template-mosaic{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:1fr 1fr;gap:18px}.quizi .nx-template{position:relative;display:block;min-height:260px;overflow:hidden;border-radius:24px;text-decoration:none;background:#eef3fb}.quizi .nx-template--large{grid-row:1/3;min-height:540px}.quizi .nx-template img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.quizi .nx-template:hover img{transform:scale(1.025)}.quizi .nx-template::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(15,23,42,.78))}.quizi .nx-template span{position:absolute;z-index:2;left:26px;right:26px;bottom:24px;color:#fff}.quizi .nx-template small{display:block;margin-bottom:6px;color:#cfe0ff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.quizi .nx-template b{display:block;font-size:24px;line-height:1.15}.quizi .nx-template em{display:block;margin-top:7px;color:#d8deea;font-size:13px;font-style:normal}.quizi .nx-template--large b{font-size:32px}

/* 10 — install */
.quizi .nx-install{background:#f7f9fc}.quizi .nx-install-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:stretch}.quizi .nx-code{overflow:hidden;border-radius:24px;background:#0f172a;color:#fff}.quizi .nx-code-top{display:flex;align-items:center;gap:7px;padding:15px 18px;background:#172033}.quizi .nx-code-top i{width:9px;height:9px;border-radius:50%;background:#ff8b8b}.quizi .nx-code-top i:nth-child(2){background:#ffc46b}.quizi .nx-code-top i:nth-child(3){background:#5ed39a}.quizi .nx-code-top span{margin-left:auto;color:#7f8ba0;font-size:12px}.quizi .nx-code pre{margin:0;padding:32px 26px;overflow:auto;color:#cbd5e1;font:14px/1.75 ui-monospace,SFMono-Regular,Menlo,monospace}.quizi .nx-code pre b{color:#7dd3fc}.quizi .nx-code p{margin:0;padding:18px 24px;border-top:1px solid rgba(255,255,255,.08);color:#91a0b5;font-size:13.5px}.quizi .nx-code code{color:#bfdbfe}.quizi .nx-product-shot--opening{padding:16px;border-radius:24px;background:#fff}.quizi .nx-product-shot--opening img{border-radius:15px}
.quizi .nx-platforms{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:30px;padding-top:24px;border-top:1px solid #dfe6f0}.quizi .nx-platforms span{color:#475569;font-size:14px;font-weight:700}

/* 11 — integrations */
.quizi .nx-integrations{padding:92px 0;background:#fff}.quizi .nx-integration-line{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.quizi .nx-integration-line>span{display:flex;align-items:center;gap:10px;padding:11px 15px;border-radius:12px;color:#344054;font-size:14px;font-weight:700;background:#f8fafc}.quizi .nx-logo{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;color:#fff;font-size:10px;font-style:normal}.quizi .nx-logo--tg{background:#229ed9}.quizi .nx-logo--b24{background:#0ab2e6}.quizi .nx-logo--amo{background:#2e9be6}.quizi .nx-logo--gs{background:#0f9d58}.quizi .nx-logo--mail{background:#6366f1}.quizi .nx-logo--web{background:#334155}.quizi .nx-logo--ym{background:#ff3333}

/* 12 — pricing as columns, not card wall */
.quizi .nx-pricing{background:#fff}.quizi .nx-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}.quizi .nx-plan{position:relative;padding:34px 34px 38px;background:#fff}.quizi .nx-plan+.nx-plan{border-left:1px solid #e2e8f0}.quizi .nx-plan--accent{background:#f7f9ff}.quizi .nx-plan-head{min-height:44px}.quizi .nx-plan-head span{display:inline-block;margin-bottom:6px;color:#2563eb;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}.quizi .nx-plan h3{margin:0;color:#111827;font-size:19px}.quizi .nx-price{display:flex;align-items:baseline;gap:6px;margin:16px 0 8px}.quizi .nx-price strong{color:#111827;font-size:50px;line-height:1}.quizi .nx-price span{color:#667085;font-size:13px}.quizi .nx-plan>p{min-height:45px;color:#667085;font-size:14px}.quizi .nx-plan-btn{display:block;margin:24px 0;padding:13px 16px;border:1px solid #cbd5e1;border-radius:10px;color:#111827;text-align:center;text-decoration:none;font-weight:750}.quizi .nx-plan-btn--primary{border-color:#2563eb;background:#2563eb;color:#fff}.quizi .nx-plan ul{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:10px}.quizi .nx-plan li{position:relative;padding-left:20px;color:#475569;font-size:13.5px}.quizi .nx-plan li::before{content:"✓";position:absolute;left:0;color:#16875b;font-weight:800}

/* 14 — Belarus: strong trust band, no card wall */
.quizi section.nx-section.nx-belarus{
    background:#141626;
    color:#fff;
}
.quizi .nx-belarus::before,
.quizi .nx-belarus::after{display:none}
.quizi .nx-belarus .q-container{position:relative;z-index:1}
.quizi .nx-belarus-top{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
    gap:72px;
    align-items:end;
}
.quizi .nx-belarus-head{max-width:760px}
.quizi .nx-belarus .nx-kicker{color:#93c5fd}
.quizi .nx-belarus-head h2{
    margin:0;
    color:#fff;
    font-size:50px;
    line-height:1.04;
    font-weight:780;
    letter-spacing:-.045em;
    text-wrap:balance;
}
.quizi .nx-belarus-intro{
    max-width:510px;
    margin:0 0 4px;
    color:#cbd5e1;
    font-size:16.5px;
    line-height:1.72;
}
.quizi .nx-belarus-line{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    margin-top:54px;
    border-top:1px solid rgba(255,255,255,.10);
    border-bottom:1px solid rgba(255,255,255,.10);
}
.quizi .nx-belarus-line>div{padding:28px 28px 30px 0}
.quizi .nx-belarus-line>div+div{
    padding-left:28px;
    border-left:1px solid rgba(255,255,255,.10);
}
.quizi .nx-belarus-line b{
    display:block;
    color:#93c5fd;
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.09em;
}
.quizi .nx-belarus-line strong{
    display:block;
    margin:10px 0 8px;
    color:#fff;
    font-size:18px;
    line-height:1.35;
}
.quizi .nx-belarus-line span{
    display:block;
    color:#cbd5e1;
    font-size:13.5px;
    line-height:1.58;
}
.quizi .nx-payment-note{
    max-width:900px;
    margin:28px auto 0;
    color:#94a3b8;
    text-align:center;
    font-size:14px;
    line-height:1.65;
}
.quizi .nx-payment-note strong{color:#fff;font-weight:750}

/* 15 — FAQ */
.quizi .nx-faq{background:#fff}.quizi .nx-faq-grid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:82px}.quizi .nx-faq .nx-head{margin:0}.quizi .nx-faq-list details{border-top:1px solid #e2e8f0}.quizi .nx-faq-list details:last-child{border-bottom:1px solid #e2e8f0}.quizi .nx-faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 0;cursor:pointer;color:#111827;font-size:16px;font-weight:700}.quizi .nx-faq-list summary::-webkit-details-marker{display:none}.quizi .nx-faq-list summary i{color:#2563eb;font-size:20px;font-style:normal}.quizi .nx-faq-list details[open] summary i{transform:rotate(45deg)}.quizi .nx-faq-list details p{max-width:720px;margin:0 0 22px;color:#667085;font-size:14.5px;line-height:1.7}

/* 15 — news + final */
.quizi .nx-news{background:#f7f9fc}.quizi .nx-text-link{align-self:start;margin-top:28px;color:#2563eb;text-decoration:none;font-weight:750}.quizi .nx-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.quizi .nx-news-card{display:flex;flex-direction:column;overflow:hidden;border-radius:20px;background:#fff;text-decoration:none}.quizi .nx-news-img{height:185px;background-size:cover;background-position:center}.quizi .nx-news-body{display:flex;flex:1;flex-direction:column;padding:22px}.quizi .nx-news-body small{color:#94a3b8}.quizi .nx-news-body h3{margin:8px 0;color:#111827;font-size:19px;line-height:1.35}.quizi .nx-news-body p{margin:0 0 18px;color:#667085;font-size:14px;line-height:1.6}.quizi .nx-news-body b{margin-top:auto;color:#2563eb;font-size:14px}
.quizi .nx-final{padding:34px 0;background:#fff}.quizi .nx-final-inner{display:flex;align-items:center;justify-content:space-between;gap:48px;padding:68px;border-radius:30px;background:#111827;color:#fff;overflow:hidden;position:relative}.quizi .nx-final-inner::after{content:"";position:absolute;right:-110px;top:-160px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.55),transparent 68%)}.quizi .nx-final-inner>div{position:relative;z-index:1}.quizi .nx-final span{color:#9fb8ee;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}.quizi .nx-final h2{margin:8px 0 0;color:#fff;font-size:48px}.quizi .nx-final p{margin:12px 0 0;color:#b9c5d7;font-size:15px}.quizi .nx-final-actions{display:flex;flex-direction:column;gap:12px;min-width:235px}.quizi .nx-final-btn{padding:14px 20px;border-radius:10px;background:#fff;color:#111827;text-align:center;text-decoration:none;font-weight:800}.quizi .nx-final-link{color:#fff;text-align:center;text-decoration:none;font-weight:700;font-size:14px}

@media(max-width:1100px){
.quizi .nx-head h2,.quizi .nx-belarus-head h2,.quizi .nx-agency-copy h2{font-size:44px}
.quizi .nx-story2-layout{grid-template-columns:minmax(0,.9fr) minmax(470px,1.1fr);gap:32px}.quizi .nx-story2-step{grid-template-columns:165px minmax(0,1fr);gap:18px}
.quizi .nx-settings-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))}
.quizi .nx-belarus-line{grid-template-columns:repeat(2,1fr)}.quizi .nx-belarus-line>div:nth-child(3){border-left:0;border-top:1px solid rgba(255,255,255,.22)}.quizi .nx-belarus-line>div:nth-child(4){border-top:1px solid rgba(255,255,255,.22)}
}
@media(max-width:900px){
.quizi .nx-section{padding:84px 0}.quizi .nx-head--split,.quizi .nx-settings-grid,.quizi .nx-leads-grid,.quizi .nx-agency-grid{grid-template-columns:1fr;gap:28px}.quizi .nx-head--split>p{margin-top:0}.quizi .nx-story2-head{grid-template-columns:1fr;gap:16px}.quizi .nx-story2-head>p{margin-top:0}.quizi .nx-story2-layout{grid-template-columns:1fr;gap:34px}.quizi .nx-story2-steps{grid-template-columns:1fr 1fr;gap:20px 26px}.quizi .nx-story2-step{grid-template-columns:150px minmax(0,1fr);gap:16px}.quizi .nx-story2-copy::after{display:none}.quizi .nx-story2-proof{position:static}.quizi .nx-story2-screen--question img,.quizi .nx-story2-screen--form img,.quizi .nx-story2-screen--lead img{max-height:none}.quizi .nx-editor-layout{grid-template-columns:1fr}.quizi .nx-editor-rail{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:0}.quizi .nx-editor-rail>div{padding:10px 0;border-top:0}.quizi .nx-editor-details,.quizi .nx-branch-pair,.quizi .nx-analytics-pair{grid-template-columns:1fr}.quizi .nx-template-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:auto}.quizi .nx-template--large{grid-row:auto;grid-column:1/3;min-height:420px}.quizi .nx-install-grid{grid-template-columns:1fr}.quizi .nx-plans{grid-template-columns:1fr}.quizi .nx-plan+.nx-plan{border-left:0;border-top:1px solid #e2e8f0}.quizi .nx-faq-grid{grid-template-columns:1fr;gap:34px}.quizi .nx-final-inner{flex-direction:column;align-items:flex-start;padding:54px 38px}.quizi .nx-final-actions{width:100%}.quizi .nx-news-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
.quizi .nx-section{padding:68px 0}.quizi .nx-head{margin-bottom:38px}.quizi .nx-head h2,.quizi .nx-belarus-head h2,.quizi .nx-agency-copy h2{font-size:33px}.quizi .nx-head>p,.quizi .nx-belarus-head p,.quizi .nx-agency-copy>p{font-size:15.5px}.quizi .nx-story2{padding-top:64px;padding-bottom:70px}.quizi .nx-story2-head{margin-bottom:28px}.quizi .nx-story2-head h2{font-size:33px}.quizi .nx-story2-head>p{font-size:15.5px}.quizi .nx-story2-steps{grid-template-columns:1fr}.quizi .nx-story2-step{grid-template-columns:132px minmax(0,1fr);gap:14px}.quizi .nx-story2-art{border-radius:16px}.quizi .nx-story2-copy{padding-left:42px}.quizi .nx-story2-copy h3{font-size:19px}.quizi .nx-story2-proof{padding:13px;border-radius:20px}.quizi .nx-story2-proof-head{align-items:flex-start;flex-direction:column;gap:3px}.quizi .nx-story2-bottom{align-items:flex-start;flex-direction:column;gap:12px}.quizi .nx-editor-layout{padding:12px;border-radius:20px}.quizi .nx-editor-rail{grid-template-columns:1fr}.quizi .nx-editor-details figure{grid-template-columns:1fr}.quizi .nx-settings-ribbon{grid-template-columns:1fr}.quizi .nx-branch-stage,.quizi .nx-analytics-hero{padding:10px;border-radius:18px}.quizi .nx-template-mosaic{grid-template-columns:1fr}.quizi .nx-template--large{grid-column:auto;min-height:300px}.quizi .nx-template{min-height:260px}.quizi .nx-template--large b{font-size:26px}.quizi .nx-facts{grid-template-columns:1fr}.quizi .nx-facts div+div{border-top:1px solid #dde5f1}.quizi .nx-platforms{justify-content:flex-start}.quizi .nx-belarus-line{grid-template-columns:1fr}.quizi .nx-belarus-line>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.22)}.quizi .nx-final{padding:18px 0}.quizi .nx-final-inner{padding:42px 22px;border-radius:22px}.quizi .nx-final h2{font-size:34px}.quizi .nx-cta-row{flex-direction:column;text-align:center}
}

/* ========================= 13. ПОРЯДОК ПОЛУЧЕНИЯ ПЛАТНЫХ УСЛУГ ========================= */
.quizi .nx-paid-services{
    background:#f7f9fc;
    border-top:1px solid #e6ebf2;
    border-bottom:1px solid #e6ebf2;
}
.quizi .nx-paid-layout{
    display:grid;
    grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);
    gap:86px;
    align-items:start;
}
.quizi .nx-paid-head{
    position:sticky;
    top:42px;
    max-width:460px;
}
.quizi .nx-paid-head h2{
    margin:0;
    color:#111827;
    font-size:46px;
    line-height:1.06;
    font-weight:780;
    letter-spacing:-.045em;
    text-wrap:balance;
}
.quizi .nx-paid-head p{
    margin:20px 0 22px;
    color:#667085;
    font-size:16.5px;
    line-height:1.7;
}
.quizi .nx-paid-head .nx-text-link{
    display:inline-flex;
    color:#2563eb;
    font-size:14px;
    font-weight:750;
    text-decoration:none;
}
.quizi .nx-paid-head .nx-text-link:hover{text-decoration:underline}
.quizi .nx-paid-flow{
    border-top:1px solid #dce3ee;
}
.quizi .nx-paid-step{
    display:grid;
    grid-template-columns:54px minmax(0,1fr);
    gap:18px;
    padding:25px 0 27px;
    border-bottom:1px solid #dce3ee;
}
.quizi .nx-paid-step>span{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#eaf1ff;
    color:#2563eb;
    font-size:12px;
    line-height:1;
    font-weight:850;
    font-variant-numeric:tabular-nums;
}
.quizi .nx-paid-step h3{
    margin:1px 0 7px;
    color:#111827;
    font-size:18px;
    line-height:1.3;
    font-weight:750;
    letter-spacing:-.02em;
}
.quizi .nx-paid-step p{
    max-width:650px;
    margin:0;
    color:#667085;
    font-size:14.5px;
    line-height:1.65;
}
.quizi .nx-paid-note{
    display:grid;
    grid-template-columns:240px minmax(0,1fr);
    gap:28px 42px;
    margin-top:48px;
    padding-top:30px;
    border-top:2px solid #2563eb;
}
.quizi .nx-paid-note strong{
    color:#111827;
    font-size:16px;
    line-height:1.45;
}
.quizi .nx-paid-note p{
    margin:0;
    color:#475569;
    font-size:14.5px;
    line-height:1.65;
}
.quizi .nx-paid-note span{
    grid-column:2;
    margin-top:-15px;
    color:#8a94a6;
    font-size:12.5px;
    line-height:1.55;
}
@media (max-width:900px){
    .quizi .nx-paid-layout{grid-template-columns:1fr;gap:38px}
    .quizi .nx-paid-head{position:static;max-width:720px}
    .quizi .nx-paid-head h2{font-size:38px}
    .quizi .nx-paid-note{grid-template-columns:1fr;gap:12px}
    .quizi .nx-paid-note span{grid-column:1;margin-top:0}
}
@media (max-width:620px){
    .quizi .nx-paid-head h2{font-size:31px}
    .quizi .nx-paid-step{grid-template-columns:44px minmax(0,1fr);gap:12px;padding:21px 0}
    .quizi .nx-paid-step>span{width:34px;height:34px;border-radius:10px}
    .quizi .nx-paid-step h3{font-size:16px}
    .quizi .nx-paid-step p{font-size:13.5px}
    .quizi .nx-paid-note{margin-top:34px;padding-top:24px}
}


/* Belarus responsive fixes */
@media(max-width:1100px){
    .quizi .nx-belarus-top{grid-template-columns:1fr;gap:22px}
    .quizi .nx-belarus-intro{max-width:760px}
    .quizi .nx-belarus-line{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .nx-belarus-line>div:nth-child(3){padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.10)}
    .quizi .nx-belarus-line>div:nth-child(4){border-top:1px solid rgba(255,255,255,.10)}
}
@media(max-width:620px){
    .quizi .nx-belarus-head h2{font-size:33px}
    .quizi .nx-belarus-intro{font-size:15.5px}
    .quizi .nx-belarus-line{grid-template-columns:1fr;margin-top:36px}
    .quizi .nx-belarus-line>div,
    .quizi .nx-belarus-line>div+div,
    .quizi .nx-belarus-line>div:nth-child(3),
    .quizi .nx-belarus-line>div:nth-child(4){padding:22px 0;border-left:0;border-top:1px solid rgba(255,255,255,.10)}
    .quizi .nx-belarus-line>div:first-child{border-top:0}
    .quizi .nx-payment-note{text-align:left}
}

/* ========================= FINAL CTA — FULL WIDTH / FOOTER DARK ========================= */
.quizi .nx-final{
    padding:0;
    background:#141626;
}
.quizi .nx-final-inner{
    width:100%;
    min-height:250px;
    margin:0;
    padding-top:72px;
    padding-bottom:72px;
    padding-left:max(32px,calc((100vw - 1280px)/2 + 32px));
    padding-right:max(32px,calc((100vw - 1280px)/2 + 32px));
    border-radius:0;
    background:#141626;
    color:#fff;
    overflow:hidden;
    position:relative;
}
.quizi .nx-final-inner::after{
    display:none;
}
.quizi .nx-final span{
    color:#8fb0f2;
}
.quizi .nx-final h2{
    color:#fff;
}
.quizi .nx-final p{
    color:#9eabc0;
}
.quizi .nx-final-btn{
    background:#fff;
    color:#141626;
}
.quizi .nx-final-btn:hover{
    background:#eef4ff;
    color:#141626;
}
.quizi .nx-final-link{
    color:#fff;
}

@media(max-width:900px){
    .quizi .nx-final-inner{
        padding:56px 22px;
    }
}
@media(max-width:620px){
    .quizi .nx-final{
        padding:0;
    }
    .quizi .nx-final-inner{
        padding:44px 18px;
        border-radius:0;
    }
}

/* ========================= ПУБЛИЧНЫЙ SEO-КОНТУР =========================
   Разделы /templates, /integrations, /help и /quiz-for-* используют шапку,
   подвал, контейнер, типографику и кнопки лендинга — отдельного дизайна у
   них нет и быть не должно. Ниже только то, чего в лендинге не существует:
   хлебные крошки, сетка каталога, карточка шаблона и разбор структуры квиза.
   Префикс qp- (quizi public) выбран, чтобы правки здесь никогда не задевали
   главную: её классы начинаются с nx-, q- и ql-.
   ======================================================================== */

/* --- Хлебные крошки ---------------------------------------------------- */
.quizi .q-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 28px;color:var(--lp-faint);font-size:13px}
.quizi .q-crumbs a{color:var(--lp-muted);text-decoration:none;border-bottom:1px solid transparent}
.quizi .q-crumbs a:hover{color:var(--lp-primary);border-bottom-color:currentColor}
.quizi .q-crumbs__sep{color:#c3ccd9}
.quizi .q-crumbs__current{color:var(--lp-ink);font-weight:600}

/* --- Секции ------------------------------------------------------------ */
.quizi .qp-section{padding:64px 0;background:var(--lp-bg)}
.quizi .qp-section--head{padding-top:36px;padding-bottom:44px}
.quizi .qp-section--soft{background:var(--lp-soft)}
.quizi .qp-section--catalog{padding-top:8px}
.quizi .qp-section>.q-container>h2,
.quizi .qp-section .qp-col>h2,
.quizi .qp-article>h2,
.quizi .qp-aside-block>h2{
    margin:0 0 18px;color:var(--lp-ink);font-size:28px;line-height:1.2;
    font-weight:720;letter-spacing:-.03em;text-wrap:balance
}
.quizi .qp-aside-block>h2{font-size:17px;margin-bottom:12px}

.quizi .qp-head{max-width:820px}
.quizi .qp-head h1{margin:0;color:var(--lp-ink);font-size:44px;line-height:1.08;font-weight:760;letter-spacing:-.04em;text-wrap:balance}
.quizi .qp-eyebrow{display:block;margin-bottom:12px;color:var(--lp-primary);font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.quizi .qp-lead{margin:18px 0 0;color:var(--lp-muted);font-size:17px;line-height:1.7}
.quizi .qp-lead--narrow{max-width:720px;margin-bottom:28px}
.quizi .qp-head-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:26px}
.quizi .qp-head-note{color:var(--lp-faint);font-size:13.5px}
.quizi .qp-text-link{color:var(--lp-primary);text-decoration:none;font-weight:650;font-size:14.5px}
.quizi .qp-text-link:hover{color:var(--lp-primary-dark)}
.quizi .qp-muted{color:var(--lp-faint);font-size:14.5px;line-height:1.7}
.quizi .qp-after{margin:24px 0 0;color:var(--lp-muted);font-size:15px;line-height:1.7}
.quizi .qp-after a,.quizi .qp-col a,.quizi .qp-question-hint a,.quizi .qp-note a{color:var(--lp-primary);text-decoration:none;border-bottom:1px solid rgba(37,99,235,.3)}
.quizi .qp-after a:hover,.quizi .qp-col a:hover{color:var(--lp-primary-dark);border-bottom-color:currentColor}
.quizi .qp-note{margin:18px 0 0;padding:14px 16px;border-left:3px solid var(--lp-primary);background:var(--lp-primary-soft);border-radius:0 10px 10px 0;color:var(--lp-text);font-size:14.5px;line-height:1.65}
.quizi .qp-empty{padding:40px 0;color:var(--lp-muted);font-size:16px}

/* --- Оглавление категорий ---------------------------------------------- */
.quizi .qp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.quizi .qp-chips a{
    display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid var(--lp-line);
    border-radius:999px;background:#fff;color:var(--lp-text);text-decoration:none;font-size:13.5px;font-weight:600
}
.quizi .qp-chips a:hover{border-color:var(--lp-primary);color:var(--lp-primary)}
.quizi .qp-chips a span{color:var(--lp-faint);font-weight:600}
.quizi .qp-chips--static{margin-top:8px}

/* --- Каталог ----------------------------------------------------------- */
.quizi .qp-group{padding:44px 0 0}
.quizi .qp-group-title{display:flex;align-items:baseline;gap:10px;margin:0 0 22px;color:var(--lp-ink);font-size:24px;font-weight:720;letter-spacing:-.03em}
.quizi .qp-group-title small{color:var(--lp-faint);font-size:14px;font-weight:600}

.quizi .qp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.quizi .qp-grid--related{grid-template-columns:repeat(4,minmax(0,1fr))}
.quizi .qp-grid--int{grid-template-columns:repeat(3,minmax(0,1fr))}

.quizi .qp-card{
    display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--lp-line);
    border-radius:var(--lp-radius);background:#fff;transition:border-color .16s ease,box-shadow .16s ease
}
.quizi .qp-card:hover{border-color:var(--lp-line-strong);box-shadow:var(--lp-shadow)}
.quizi .qp-card-media{display:block;aspect-ratio:16/10;background:var(--lp-soft-blue);overflow:hidden}
.quizi .qp-card-media img{width:100%;height:100%;object-fit:cover;object-position:top center}
.quizi .qp-card-noimg{
    display:flex;width:100%;height:100%;align-items:center;justify-content:center;
    color:#9db4e4;font-size:15px;font-weight:700;letter-spacing:-.02em
}
.quizi .qp-card-body{display:flex;flex:1;flex-direction:column;gap:9px;padding:18px 18px 20px}
.quizi .qp-card-tag{
    align-self:flex-start;padding:4px 10px;border-radius:999px;background:var(--lp-primary-soft);
    color:var(--lp-primary);font-size:11.5px;font-weight:700;letter-spacing:.01em
}
.quizi .qp-card-body h3{margin:0;font-size:17px;line-height:1.3;font-weight:700;letter-spacing:-.02em}
.quizi .qp-card-body h3 a{color:var(--lp-ink);text-decoration:none}
.quizi .qp-card-body h3 a:hover{color:var(--lp-primary)}
.quizi .qp-card-body p{margin:0;color:var(--lp-muted);font-size:14.5px;line-height:1.6}
.quizi .qp-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:auto;padding-top:14px}
.quizi .qp-card-more{color:var(--lp-primary);text-decoration:none;font-size:14px;font-weight:650}
.quizi .qp-card-more:hover{color:var(--lp-primary-dark)}
.quizi .qp-card--int .qp-card-body{padding:22px}

.quizi .qp-use-form{margin:0}
.quizi .qp-btn-small{
    display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid var(--lp-line-strong);
    border-radius:9px;background:#fff;color:var(--lp-ink);font:inherit;font-size:13.5px;font-weight:650;
    text-decoration:none;cursor:pointer;transition:border-color .16s ease,background-color .16s ease
}
.quizi .qp-btn-small:hover{border-color:var(--lp-primary);background:var(--lp-primary-soft);color:var(--lp-primary)}

/* --- Шаги «как работать с шаблоном» ------------------------------------ */
.quizi .qp-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin-top:8px}
.quizi .qp-steps>div{padding:20px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-steps b{display:block;margin-bottom:10px;color:var(--lp-primary);font-size:13px;font-weight:800;letter-spacing:.06em}
.quizi .qp-steps h3{margin:0 0 8px;font-size:16px;font-weight:700;letter-spacing:-.02em}
.quizi .qp-steps p{margin:0;color:var(--lp-muted);font-size:14.5px;line-height:1.6}

/* --- Верх страницы шаблона --------------------------------------------- */
.quizi .qp-tpl-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:48px;align-items:start}
.quizi .qp-tpl-copy h1{margin:0;color:var(--lp-ink);font-size:40px;line-height:1.1;font-weight:760;letter-spacing:-.04em;text-wrap:balance}
.quizi .qp-tpl-shot{margin:0;padding:14px;border:1px solid var(--lp-line);border-radius:var(--lp-radius-lg);background:var(--lp-soft-blue)}
.quizi .qp-tpl-shot img{width:100%;height:auto;border-radius:12px}
.quizi .qp-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 24px;margin:26px 0 0}
.quizi .qp-facts div{padding:12px 0 0;border-top:1px solid var(--lp-line)}
.quizi .qp-facts dt{color:var(--lp-faint);font-size:12.5px;font-weight:650;letter-spacing:.02em}
.quizi .qp-facts dd{margin:4px 0 0;color:var(--lp-ink);font-size:16px;font-weight:700}
.quizi .qp-tpl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:28px}

/* --- Две колонки текста ------------------------------------------------ */
.quizi .qp-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;align-items:start}
.quizi .qp-col p{margin:0 0 14px;color:var(--lp-text);font-size:15.5px;line-height:1.72}
.quizi .qp-col p:last-child{margin-bottom:0}
.quizi .qp-list{margin:0 0 14px;padding:0;list-style:none;display:grid;gap:10px}
.quizi .qp-list li{position:relative;padding-left:22px;color:var(--lp-text);font-size:15.5px;line-height:1.65}
.quizi .qp-list li::before{content:"";position:absolute;left:3px;top:9px;width:7px;height:7px;border-radius:2px;background:var(--lp-primary)}
.quizi .qp-list--wide{max-width:820px}

/* --- Вопросы шаблона --------------------------------------------------- */
.quizi .qp-questions{margin:0;padding:0;list-style:none;counter-reset:qpq;display:grid;gap:14px}
.quizi .qp-question{
    counter-increment:qpq;position:relative;padding:20px 22px 20px 60px;
    border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff
}
.quizi .qp-question::before{
    content:counter(qpq);position:absolute;left:20px;top:20px;width:26px;height:26px;
    display:flex;align-items:center;justify-content:center;border-radius:8px;
    background:var(--lp-primary-soft);color:var(--lp-primary);font-size:12.5px;font-weight:800
}
.quizi .qp-question h3{margin:0;font-size:17px;line-height:1.35;font-weight:700;letter-spacing:-.02em;color:var(--lp-ink)}
.quizi .qp-question-hint{margin:6px 0 0;color:var(--lp-muted);font-size:14.5px;line-height:1.6}
.quizi .qp-answers{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.quizi .qp-answers li{
    padding:6px 12px;border:1px solid var(--lp-line);border-radius:8px;
    background:var(--lp-soft);color:var(--lp-text);font-size:13.5px
}
.quizi .qp-question .qp-muted{margin:10px 0 0}

/* --- Экраны квиза ------------------------------------------------------ */
.quizi .qp-screens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.quizi .qp-screen{padding:24px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-screen>span{display:block;margin-bottom:10px;color:var(--lp-faint);font-size:12px;font-weight:750;letter-spacing:.07em;text-transform:uppercase}
.quizi .qp-screen h3{margin:0;font-size:19px;font-weight:720;letter-spacing:-.02em;color:var(--lp-ink)}
.quizi .qp-screen p{margin:10px 0 0;color:var(--lp-muted);font-size:15px;line-height:1.65}
.quizi .qp-screen em{
    display:inline-flex;margin-top:14px;padding:8px 16px;border-radius:9px;
    background:var(--lp-primary);color:#fff;font-style:normal;font-size:13.5px;font-weight:650
}

/* --- «Что дальше» ------------------------------------------------------ */
.quizi .qp-next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.quizi .qp-next>div{padding:22px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-next h3{margin:0 0 10px;font-size:17px;font-weight:700;letter-spacing:-.02em}
.quizi .qp-next p{margin:0;color:var(--lp-muted);font-size:14.5px;line-height:1.7}
.quizi .qp-next a{color:var(--lp-primary);text-decoration:none;border-bottom:1px solid rgba(37,99,235,.3)}

/* --- Нумерованный порядок действий ------------------------------------- */
.quizi .qp-steps-list{margin:0;padding:0;list-style:none;counter-reset:qps;display:grid;gap:12px;max-width:860px}
.quizi .qp-steps-list li{
    counter-increment:qps;position:relative;padding:16px 20px 16px 58px;
    border:1px solid var(--lp-line);border-radius:12px;background:#fff;
    color:var(--lp-text);font-size:15.5px;line-height:1.65;word-break:break-word
}
.quizi .qp-steps-list li::before{
    content:counter(qps);position:absolute;left:18px;top:16px;width:26px;height:26px;
    display:flex;align-items:center;justify-content:center;border-radius:8px;
    background:var(--lp-primary);color:#fff;font-size:12.5px;font-weight:800
}

/* --- Помощь ------------------------------------------------------------ */
.quizi .qp-help-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;padding-top:36px}
.quizi .qp-help-block{padding:24px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-help-block h2{margin:0 0 14px;font-size:19px;font-weight:720;letter-spacing:-.02em}
.quizi .qp-help-list{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.quizi .qp-help-list li{display:flex;flex-direction:column;gap:3px}
.quizi .qp-help-list a{color:var(--lp-ink);text-decoration:none;font-size:15px;font-weight:650;line-height:1.4}
.quizi .qp-help-list a:hover{color:var(--lp-primary)}
.quizi .qp-help-list span{color:var(--lp-faint);font-size:13.5px;line-height:1.5}

.quizi .qp-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
.quizi .qp-article{max-width:820px}
.quizi .qp-article-aside{display:grid;gap:22px;position:sticky;top:24px}
.quizi .qp-aside-block{padding:22px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:var(--lp-soft)}
.quizi .qp-article-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:36px;padding-top:28px;border-top:1px solid var(--lp-line)}
.quizi .qp-faq{display:grid;gap:10px}
.quizi .qp-faq details{border:1px solid var(--lp-line);border-radius:12px;background:#fff;padding:14px 18px}
.quizi .qp-faq summary{cursor:pointer;color:var(--lp-ink);font-size:15.5px;font-weight:650;line-height:1.45}
.quizi .qp-faq p{margin:10px 0 0;color:var(--lp-muted);font-size:15px;line-height:1.7}

/* --- Посадочные под установку ------------------------------------------ */
.quizi .qp-ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.quizi .qp-way{padding:24px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-way b{display:block;margin-bottom:12px;color:var(--lp-primary);font-size:13px;font-weight:800;letter-spacing:.06em}
.quizi .qp-way h3{margin:0 0 10px;font-size:17px;font-weight:700;letter-spacing:-.02em;line-height:1.35}
.quizi .qp-way p{margin:0;color:var(--lp-muted);font-size:14.5px;line-height:1.7}

.quizi .qp-code{margin-top:26px;padding:22px;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-code-head span{color:var(--lp-faint);font-size:12px;font-weight:750;letter-spacing:.07em;text-transform:uppercase}
.quizi .qp-code pre{
    margin:12px 0 0;padding:16px;border-radius:11px;background:var(--lp-dark);color:#cfe0ff;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;line-height:1.6;
    overflow-x:auto
}
.quizi .qp-code pre b{color:#ffd479;font-weight:700}
.quizi .qp-code p{margin:14px 0 0;color:var(--lp-muted);font-size:14.5px;line-height:1.7}

/* --- Адаптив ------------------------------------------------------------
   Проверяется на трёх ширинах: ~360px (телефон), ~768px (планшет) и десктоп.
   Ни одна сетка не остаётся многоколоночной на телефоне — иначе карточки
   сжимаются в нечитаемые столбики и появляется горизонтальная прокрутка. */
@media(max-width:1080px){
    .quizi .qp-article-layout{grid-template-columns:minmax(0,1fr)}
    .quizi .qp-article-aside{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .qp-grid--related{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .qp-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
    .quizi .qp-section{padding:48px 0}
    .quizi .qp-head h1{font-size:34px}
    .quizi .qp-tpl-copy h1{font-size:32px}
    .quizi .qp-tpl-top{grid-template-columns:minmax(0,1fr);gap:30px}
    .quizi .qp-cols{grid-template-columns:minmax(0,1fr);gap:34px}
    .quizi .qp-grid,.quizi .qp-grid--int{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .qp-next,.quizi .qp-ways,.quizi .qp-help-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quizi .qp-screens{grid-template-columns:minmax(0,1fr)}
    .quizi .qp-section>.q-container>h2,.quizi .qp-section .qp-col>h2,.quizi .qp-article>h2{font-size:24px}
}
@media(max-width:620px){
    .quizi .qp-section{padding:38px 0}
    .quizi .qp-section--head{padding-top:22px;padding-bottom:30px}
    .quizi .qp-head h1,.quizi .qp-tpl-copy h1{font-size:27px;letter-spacing:-.03em}
    .quizi .qp-lead{font-size:15.5px}
    .quizi .qp-grid,.quizi .qp-grid--int,.quizi .qp-grid--related,
    .quizi .qp-steps,.quizi .qp-next,.quizi .qp-ways,
    .quizi .qp-help-grid,.quizi .qp-article-aside{grid-template-columns:minmax(0,1fr)}
    .quizi .qp-facts{grid-template-columns:minmax(0,1fr)}
    .quizi .qp-head-actions,.quizi .qp-tpl-actions,.quizi .qp-article-cta{gap:12px}
    .quizi .qp-head-actions .q-btn,.quizi .qp-tpl-actions .q-btn,.quizi .qp-article-cta .q-btn{width:100%;justify-content:center}
    .quizi .qp-question{padding:18px 16px}
    .quizi .qp-question::before{position:static;margin-bottom:10px}
    .quizi .qp-steps-list li{padding:16px}
    .quizi .qp-steps-list li::before{position:static;margin-bottom:10px}
    .quizi .qp-group-title{font-size:21px}
    .quizi .qp-code pre{font-size:12px}
}

/* Три платформы в ряду «Установка» на главной стали ссылками на свои
   инструкции. Правило рядом с qp-*, потому что появилось вместе с ними;
   стиль повторяет соседние подписи, чтобы ряд читался как один список. */
.quizi .nx-platforms a{color:#1d4ed8;font-size:14px;font-weight:700;text-decoration:none;border-bottom:1px solid rgba(29,78,216,.35)}
.quizi .nx-platforms a:hover{color:#0f172a;border-bottom-color:currentColor}

/* --- Страница тарифов /tarify -------------------------------------------
   Продолжение блока qp-*: те же токены, контейнер и кнопки. Своего дизайна
   у страницы нет — она часть сайта, а не отдельный лендинг. */
.quizi .qp-tt-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.quizi .qp-tt-plan{
    position:relative;display:flex;flex-direction:column;gap:14px;padding:26px 24px;
    border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff
}
.quizi .qp-tt-plan--accent{border:2px solid var(--lp-primary);box-shadow:0 24px 50px -30px rgba(37,99,235,.32)}
.quizi .qp-tt-badge{
    position:absolute;top:-13px;left:24px;padding:5px 14px;border-radius:999px;
    background:var(--lp-primary);color:#fff;font-size:12px;font-weight:650;white-space:nowrap
}
.quizi .qp-tt-plan h3{margin:0;font-size:19px;font-weight:720;letter-spacing:-.02em;color:var(--lp-ink)}
.quizi .qp-tt-price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.quizi .qp-tt-price small{color:var(--lp-faint);font-size:14px}
.quizi .qp-tt-price strong{font-size:40px;font-weight:780;letter-spacing:-.04em;line-height:1;color:var(--lp-ink)}
.quizi .qp-tt-price span{color:var(--lp-muted);font-size:14.5px}
.quizi .qp-tt-plan-note{margin:0;color:var(--lp-muted);font-size:14.5px;line-height:1.6}
.quizi .qp-tt-plan-facts{margin:0;padding:0;list-style:none;display:grid;gap:8px;padding-top:14px;border-top:1px solid var(--lp-line)}
.quizi .qp-tt-plan-facts li{display:flex;align-items:baseline;gap:7px;font-size:14.5px}
.quizi .qp-tt-plan-facts b{color:var(--lp-ink);font-weight:700}
.quizi .qp-tt-plan-facts span{color:var(--lp-muted)}
.quizi .qp-tt-packages{padding-top:14px;border-top:1px solid var(--lp-line)}
.quizi .qp-tt-packages-title{display:block;margin-bottom:8px;color:var(--lp-faint);font-size:12px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}
.quizi .qp-tt-packages table{width:100%;border-collapse:collapse}
.quizi .qp-tt-packages td{padding:6px 0;border-top:1px solid var(--lp-line);color:var(--lp-text);font-size:14px}
.quizi .qp-tt-packages th{padding:0 0 6px;color:var(--lp-faint);font-size:12.5px;font-weight:600;text-align:left}
.quizi .qp-tt-packages td:last-child,.quizi .qp-tt-packages th:last-child{text-align:right;white-space:nowrap}
.quizi .qp-tt-plan>a{margin-top:auto}
.quizi .qp-tt-plan>a.qp-btn-small{justify-content:center;min-height:46px}

/* Таблица сравнения. Широкое содержимое прокручивается ВНУТРИ своего
   контейнера — страница по горизонтали не едет. */
.quizi .qp-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--lp-line);border-radius:var(--lp-radius);background:#fff}
.quizi .qp-table{width:100%;min-width:640px;border-collapse:collapse;font-size:15px}
.quizi .qp-table--compact{min-width:0}
.quizi .qp-table-caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Без position:sticky. `overflow-x:auto` делает контейнер прокручиваемым и по
   вертикали, а высота у него по содержимому — прилипать шапке не к чему.
   Правило, которое ничего не делает, потом читается как поломка. */
.quizi .qp-table thead th{
    padding:14px 16px;background:var(--lp-soft);
    color:var(--lp-ink);font-size:14.5px;font-weight:700;text-align:center;border-bottom:1px solid var(--lp-line)
}
.quizi .qp-table thead th:first-child{text-align:left;min-width:280px}
.quizi .qp-table-group th{
    padding:12px 16px;background:var(--lp-soft-blue);color:var(--lp-primary);
    font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;text-align:left
}
.quizi .qp-table tbody th[scope="row"]{
    padding:14px 16px;color:var(--lp-ink);font-size:15px;font-weight:600;text-align:left;
    border-top:1px solid var(--lp-line);vertical-align:top
}
.quizi .qp-table tbody th[scope="row"] small{display:block;margin-top:4px;color:var(--lp-faint);font-size:13px;font-weight:400;line-height:1.5}
.quizi .qp-table tbody td{padding:14px 16px;text-align:center;border-top:1px solid var(--lp-line);vertical-align:top}
.quizi .qp-table--compact td,.quizi .qp-table--compact th{text-align:left}
.quizi .qp-table--compact td:last-child,.quizi .qp-table--compact th:last-child{text-align:right;white-space:nowrap}
.quizi .qp-tt-yes{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;background:#e8f6ee;color:#16a34a}
.quizi .qp-tt-no{color:#c3ccd9;font-size:18px;line-height:1}
.quizi .qp-tt-text{color:var(--lp-ink);font-size:15px;font-weight:650}

@media(max-width:900px){
    .quizi .qp-tt-plans{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
    .quizi .qp-tt-plans{grid-template-columns:minmax(0,1fr)}
    .quizi .qp-tt-price strong{font-size:34px}
    .quizi .qp-table{min-width:520px;font-size:14px}
    .quizi .qp-table thead th:first-child{min-width:200px}
    .quizi .qp-table thead th,.quizi .qp-table tbody th[scope="row"],.quizi .qp-table tbody td{padding:11px 12px}
    .quizi .qp-tt-plan>a{width:100%;justify-content:center}
}