/* Оформление статей блога. Вынесено из первой статьи, чтобы кешировалось. */
:root{--blue:#0066ff;--blue-d:#0047b3;--blue-l:#3d8bff;--sky:#e8f1ff;--gold:#f5b342;--ink:#0a1733;--soft:#f4f7fc;--green:#28d77c;--mute:#6577a3;--border:#dce5f3;--red:#ff4d6d}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;color:var(--ink);background:#fff;line-height:1.7;-webkit-font-smoothing:antialiased;font-size:17px}
a{color:var(--blue);text-decoration:none}
img{max-width:100%;display:block}

/* PROGRESS BAR */
.progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--gold));z-index:100;width:0;transition:width .1s}

/* TOPBAR */

/* HEADER */
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;color:var(--ink)}
.logo-mark{width:38px;height:38px;background:linear-gradient(135deg,var(--blue),var(--blue-d));border-radius:10px;display:grid;place-items:center;color:#fff;font-weight:900;box-shadow:0 8px 22px rgba(0,102,255,.35)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:10px;font-weight:700;font-size:14px;cursor:pointer;border:0;transition:transform .12s,box-shadow .2s,background .2s;white-space:nowrap;font-family:inherit}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;box-shadow:0 10px 25px rgba(0,102,255,.32)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 32px rgba(0,102,255,.45)}
.btn-ghost{background:#fff;color:var(--ink);border:1.5px solid var(--border)}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue)}
.btn-gold{background:linear-gradient(135deg,#fbcd5c,var(--gold));color:#3a2400;box-shadow:0 10px 24px rgba(245,179,66,.4)}

/* ARTICLE HERO */
.art-hero{position:relative;background:linear-gradient(135deg,#001a4d 0%,#0047b3 60%,#0066ff 100%);color:#fff;padding:60px 0 80px;overflow:hidden}
.art-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 22%,rgba(255,255,255,.13),transparent 35%),radial-gradient(circle at 82% 75%,rgba(245,179,66,.18),transparent 38%),url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='80' height='80'><path d='M0 0h80v80H0z' fill='none' stroke='%23ffffff10' stroke-width='1'/></svg>");opacity:.95}
.art-hero-in{position:relative;max-width:880px;margin:0 auto;padding:0 24px;text-align:center}
.crumb{font-size:13px;color:#bcd4ff;margin-bottom:22px}
.crumb a{color:#bcd4ff}
.crumb a:hover{color:#fff}
.art-cat{display:inline-block;background:var(--gold);color:#3a2400;font-size:11px;font-weight:800;padding:5px 14px;border-radius:99px;letter-spacing:.5px;text-transform:uppercase;margin-bottom:22px}
.art-hero h1{font-size:48px;line-height:1.12;font-weight:800;letter-spacing:-1px;margin-bottom:22px}
.art-hero h1 .accent{color:var(--gold)}
.art-hero .subt{font-size:20px;color:#d8e6ff;max-width:720px;margin:0 auto 30px;line-height:1.55}
.art-meta{display:flex;justify-content:center;gap:26px;color:#bcd4ff;font-size:14px;flex-wrap:wrap;margin-bottom:30px}
.art-meta b{color:#fff}
.art-author-mini{display:inline-flex;align-items:center;gap:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:99px;padding:8px 22px 8px 8px;backdrop-filter:blur(8px)}
.art-author-mini .av{width:42px;height:42px;border-radius:99px;background:linear-gradient(135deg,var(--gold),#e07b00);color:#3a2400;display:grid;place-items:center;font-weight:800;font-size:14px}
.art-author-mini .info{text-align:left}
.art-author-mini .info b{display:block;font-size:14px;color:#fff}
.art-author-mini .info span{font-size:12px;color:#bcd4ff}

/* HERO STATS STRIP */
.hstrip{background:#fff;border-bottom:1px solid var(--border);padding:24px 0;position:relative;margin-top:-30px;z-index:5}
.hstrip-in{max-width:1080px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.hs{background:linear-gradient(135deg,#fff,var(--soft));border:1px solid var(--border);border-radius:14px;padding:18px;text-align:center;box-shadow:0 14px 34px rgba(10,23,51,.06)}
.hs b{display:block;font-size:28px;font-weight:800;color:var(--blue-d);letter-spacing:-.5px;line-height:1.1}
.hs span{font-size:12px;color:var(--mute);text-transform:uppercase;letter-spacing:.5px;font-weight:600;display:block;margin-top:6px}

/* ARTICLE LAYOUT */
.art-layout{max-width:1280px;margin:0 auto;padding:60px 24px;display:grid;grid-template-columns:240px 1fr 280px;gap:50px;align-items:start}

/* TOC LEFT */
.toc{position:sticky;top:90px;align-self:start}
.toc h6{font-size:11px;font-weight:800;color:var(--mute);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:16px}
.toc ol{list-style:none;counter-reset:item;border-left:2px solid var(--border)}
.toc ol li{counter-increment:item;padding:7px 0 7px 18px;position:relative;font-size:13px;line-height:1.4}
.toc ol li a{color:var(--mute);font-weight:600;display:block;transition:color .15s}
.toc ol li a:hover{color:var(--blue)}
.toc ol li.active{border-left:2px solid var(--blue);margin-left:-2px}
.toc ol li.active a{color:var(--blue)}
.toc-share{margin-top:28px;padding-top:22px;border-top:1px solid var(--border)}
.toc-share h6{margin-bottom:12px}
.share-row{display:flex;gap:8px;flex-wrap:wrap}
.share-row a{width:34px;height:34px;border-radius:8px;background:#fff;border:1.5px solid var(--border);display:grid;place-items:center;font-size:14px;color:var(--mute);transition:all .15s}
.share-row a:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-1px)}
.read-meta{font-size:12px;color:var(--mute);margin-top:18px;padding-top:18px;border-top:1px solid var(--border)}
.read-meta b{color:var(--ink);display:block;margin-bottom:2px;font-size:14px}

/* CONTENT */
.content{max-width:720px}
.content .lead{font-size:21px;line-height:1.55;color:var(--ink);font-weight:500;border-left:4px solid var(--blue);padding:6px 0 6px 22px;margin-bottom:32px;background:linear-gradient(90deg,var(--sky),transparent)}
.content h2{font-size:32px;font-weight:800;color:var(--ink);margin:50px 0 18px;letter-spacing:-.5px;line-height:1.2;scroll-margin-top:80px}
.content h2 .num{color:var(--blue);font-weight:700;margin-right:10px;font-size:20px;background:var(--sky);padding:4px 10px;border-radius:8px;display:inline-block;vertical-align:middle}
.content h3{font-size:22px;font-weight:800;color:var(--ink);margin:34px 0 14px;line-height:1.3}
.content p{margin-bottom:18px;color:#27395f}
.content ul,.content ol{margin:14px 0 22px 22px}
.content ul li,.content ol li{margin-bottom:10px;color:#27395f}
.content strong{color:var(--ink);font-weight:700}
.content a{color:var(--blue);text-decoration:underline;text-decoration-color:#bbd4ff;text-underline-offset:3px}
.content a:hover{text-decoration-color:var(--blue)}

/* CALLOUTS */
.callout{display:flex;gap:16px;padding:22px 24px;border-radius:14px;margin:26px 0;border-left:4px solid}
.callout-info{background:var(--sky);border-color:var(--blue)}
.callout-warn{background:#fff7e8;border-color:var(--gold);color:#5a3e00}
.callout-warn p{color:#5a3e00}
.callout-warn strong{color:#3a2400}
.callout-tip{background:#e7faf0;border-color:var(--green);color:#0c4a26}
.callout-tip p{color:#0c4a26}
.callout-tip strong{color:#0a3318}
.callout .ico{font-size:24px;flex-shrink:0;line-height:1}
.callout p{margin:0;font-size:15px;line-height:1.6}
.callout p+p{margin-top:8px}

/* PULL QUOTE */
blockquote{margin:34px -10px;padding:30px 36px;background:linear-gradient(135deg,var(--ink),#1d3260);color:#fff;border-radius:18px;position:relative;font-size:22px;line-height:1.4;font-weight:600;letter-spacing:-.3px}
blockquote::before{content:"“";position:absolute;top:-10px;left:18px;font-size:80px;color:var(--gold);line-height:1;font-family:Georgia,serif}
blockquote cite{display:block;font-size:13px;color:#bcd4ff;font-weight:500;margin-top:14px;font-style:normal;letter-spacing:.5px}

/* COST BREAKDOWN */
.cb-wrap{background:linear-gradient(180deg,var(--soft),#fff);border:1px solid var(--border);border-radius:18px;padding:28px;margin:30px 0}
.cb-wrap h4{font-size:18px;font-weight:800;margin-bottom:6px}
.cb-wrap .cb-sub{font-size:13px;color:var(--mute);margin-bottom:24px}
.cb-row{margin-bottom:14px}
.cb-row:last-child{margin-bottom:0}
.cb-label{display:flex;justify-content:space-between;font-size:14px;font-weight:700;margin-bottom:6px}
.cb-label .pct{color:var(--blue);font-weight:800;font-variant-numeric:tabular-nums}
.cb-line{height:14px;background:var(--sky);border-radius:99px;overflow:hidden}
.cb-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--blue-l));border-radius:99px;transition:width 1s ease}
.cb-fill.gold{background:linear-gradient(90deg,var(--gold),#e07b00)}
.cb-fill.green{background:linear-gradient(90deg,var(--green),#0a8c4f)}
.cb-fill.red{background:linear-gradient(90deg,var(--red),#b3173a)}
.cb-foot{margin-top:20px;padding-top:18px;border-top:1px solid var(--border);display:flex;justify-content:space-between;font-weight:800;font-size:16px}
.cb-foot .total{color:var(--blue-d);font-size:22px}

/* TABLE */
.tbl-wrap{margin:26px 0;overflow-x:auto;border-radius:14px;border:1px solid var(--border)}
table{width:100%;border-collapse:collapse;font-size:14px}
thead{background:var(--ink);color:#fff}
thead th{padding:14px 16px;text-align:left;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.5px}
tbody td{padding:14px 16px;border-bottom:1px solid var(--border)}
tbody tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:var(--soft)}
tbody tr:hover{background:var(--sky)}
.num-c{font-variant-numeric:tabular-nums;font-weight:700;color:var(--blue-d);text-align:right}

/* PACKAGE COMPARE */
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0}
.pkg{background:#fff;border:1.5px solid var(--border);border-radius:14px;padding:22px;position:relative}
.pkg.feat{border-color:var(--blue);box-shadow:0 16px 40px rgba(0,102,255,.15)}
.pkg.feat::before{content:"Most picked";position:absolute;top:-10px;right:14px;background:var(--blue);color:#fff;font-size:11px;font-weight:800;padding:3px 10px;border-radius:99px;text-transform:uppercase;letter-spacing:.5px}
.pkg h5{font-size:16px;font-weight:800;color:var(--ink);margin-bottom:6px}
.pkg .price{font-size:30px;font-weight:800;color:var(--blue-d);margin-bottom:12px;line-height:1}
.pkg .price small{font-size:12px;color:var(--mute);font-weight:600}
.pkg ul{margin:0;list-style:none;padding:0}
.pkg ul li{font-size:13px;color:#27395f;padding:5px 0 5px 20px;position:relative;border:0;margin:0}
.pkg ul li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:800}

/* HIDDEN COSTS LIST */
.hc-list{margin:24px 0}
.hc{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--border)}
.hc:last-child{border-bottom:0}
.hc .hc-num{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,#fff7e8,#fef3d6);color:#7a5a00;font-weight:800;display:grid;place-items:center;flex-shrink:0;font-size:18px;border:1.5px solid #f5d68a}
.hc h5{font-size:17px;font-weight:800;margin-bottom:6px;color:var(--ink)}
.hc .hc-cost{display:inline-block;background:var(--ink);color:#fff;font-size:11px;font-weight:800;padding:3px 9px;border-radius:6px;margin-left:8px;letter-spacing:.5px}
.hc p{font-size:14px;color:var(--mute);margin:0;line-height:1.55}

/* CASE STUDY */
.case{margin:36px 0;background:linear-gradient(135deg,#fff,var(--sky));border:1.5px solid var(--blue);border-radius:18px;padding:28px;position:relative;overflow:hidden}
.case::before{content:"REAL BUILD";position:absolute;top:14px;right:14px;background:var(--blue);color:#fff;font-size:10px;font-weight:800;padding:3px 10px;border-radius:99px;letter-spacing:.5px}
.case h4{font-size:20px;font-weight:800;margin-bottom:8px;color:var(--ink)}
.case .case-meta{font-size:12px;color:var(--mute);margin-bottom:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.case-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}
.case-stat{background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px;text-align:center}
.case-stat b{display:block;font-size:18px;color:var(--blue-d);font-weight:800}
.case-stat span{font-size:11px;color:var(--mute);text-transform:uppercase}

/* INLINE CTA */
.in-cta{margin:36px 0;background:linear-gradient(135deg,var(--ink),#1d3260);color:#fff;padding:28px;border-radius:18px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.in-cta h4{font-size:18px;font-weight:800;color:#fff;margin:0 0 6px}
.in-cta p{color:#bcd4ff;margin:0;font-size:14px}

/* AUTHOR BOX */
.author-box{margin:50px 0;background:var(--soft);border-radius:18px;padding:32px;display:flex;gap:24px;align-items:flex-start;flex-wrap:wrap}
.author-box .av-big{width:78px;height:78px;border-radius:99px;background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;display:grid;place-items:center;font-size:24px;font-weight:800;flex-shrink:0}
.author-box .info{flex:1;min-width:260px}
.author-box h5{font-size:18px;font-weight:800;margin-bottom:4px}
.author-box .role{font-size:13px;color:var(--blue);font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.author-box .bio{font-size:14px;color:var(--mute);margin-bottom:14px;line-height:1.55}
.author-box .creds{display:flex;gap:8px;flex-wrap:wrap}
.author-box .cred{font-size:11px;background:#fff;color:var(--blue-d);border:1px solid var(--border);padding:4px 10px;border-radius:99px;font-weight:700}

/* RIGHT SIDEBAR */
.aside{display:flex;flex-direction:column;gap:20px;position:sticky;top:90px;align-self:start}
.aside-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px}
.aside-card.dark{background:linear-gradient(135deg,#0047b3,#0066ff);color:#fff;border:0}
.aside-card h6{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px;color:var(--mute)}
.aside-card.dark h6{color:#bcd4ff}
.aside-card.dark h5{color:#fff;font-size:18px;font-weight:800;margin-bottom:8px}
.aside-card.dark p{color:#d8e6ff;font-size:13px;margin-bottom:14px}
.aside-card.dark .btn{background:var(--gold);color:#3a2400;width:100%;border:0}
.related{display:flex;flex-direction:column;gap:14px}
.rel{display:flex;gap:12px;cursor:pointer;align-items:flex-start}
.rel:hover .r-title{color:var(--blue)}
.rel .r-img{width:60px;height:48px;border-radius:8px;flex-shrink:0;display:grid;place-items:center;font-size:20px}
.rel.r1 .r-img{background:linear-gradient(135deg,#0047b3,#0066ff);color:#fff}
.rel.r2 .r-img{background:linear-gradient(135deg,#28d77c,#0a8c4f);color:#fff}
.rel.r3 .r-img{background:linear-gradient(135deg,#f5b342,#e07b00);color:#fff}
.rel.r4 .r-img{background:linear-gradient(135deg,#9461ff,#5c2bd9);color:#fff}
.rel .r-title{font-size:13px;font-weight:700;color:var(--ink);line-height:1.4;margin-bottom:4px}
.rel .r-meta{font-size:11px;color:var(--mute)}
.aside-newsletter input{width:100%;padding:10px 12px;border-radius:8px;border:0;font-size:13px;margin-bottom:8px;background:rgba(255,255,255,.18);color:#fff;outline:0}
.aside-newsletter input::placeholder{color:#bcd4ff}
.toc-progress-mob{display:none}

/* COMMENTS */
.comments{max-width:720px;margin:50px auto 0;padding:40px 0;border-top:1px solid var(--border)}
.comments h3{font-size:24px;font-weight:800;margin-bottom:6px}
.comments .csub{font-size:14px;color:var(--mute);margin-bottom:24px}
.comment{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--border)}
.comment:last-child{border-bottom:0}
.comment .av{width:42px;height:42px;border-radius:99px;background:linear-gradient(135deg,var(--blue-l),var(--blue));color:#fff;display:grid;place-items:center;font-weight:800;flex-shrink:0;font-size:14px}
.comment .av.av2{background:linear-gradient(135deg,#28d77c,#0a8c4f)}
.comment .av.av3{background:linear-gradient(135deg,#9461ff,#5c2bd9)}
.comment .av.av4{background:linear-gradient(135deg,#f5b342,#e07b00)}
.comment .body b{font-size:14px;color:var(--ink)}
.comment .body .stamp{font-size:12px;color:var(--mute);margin-left:8px}
.comment .body p{font-size:14px;color:#27395f;margin:6px 0 0;line-height:1.55}
.comment .body .reply{font-size:12px;color:var(--blue);font-weight:700;margin-top:8px;display:inline-block;cursor:pointer}
.comment-form{margin-top:26px;background:var(--soft);border-radius:14px;padding:22px}
.comment-form h4{font-size:16px;font-weight:800;margin-bottom:12px}
.comment-form textarea{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:14px;font-family:inherit;font-size:14px;outline:0;min-height:90px;background:#fff;resize:vertical}
.comment-form textarea:focus{border-color:var(--blue)}
.comment-form .row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.comment-form input{padding:11px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;outline:0;background:#fff}
.comment-form input:focus{border-color:var(--blue)}

/* RELATED ARTICLES */
.related-section{background:var(--soft);padding:80px 0}
.related-section h2{font-size:32px;font-weight:800;text-align:center;margin-bottom:8px;letter-spacing:-.5px}
.related-section .rsub{text-align:center;color:var(--mute);margin-bottom:40px}
.rs-grid{max-width:1080px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rs{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;cursor:pointer;transition:all .2s}
.rs:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(10,23,51,.1)}
.rs-img{aspect-ratio:16/9;display:grid;place-items:center;font-size:42px;opacity:.6}
.rs-1 .rs-img{background:linear-gradient(135deg,#28d77c,#0a8c4f);color:#fff}
.rs-2 .rs-img{background:linear-gradient(135deg,#9461ff,#5c2bd9);color:#fff}
.rs-3 .rs-img{background:linear-gradient(135deg,#f5b342,#e07b00);color:#fff}
.rs-body{padding:18px 20px}
.rs-meta{font-size:11px;color:var(--mute);text-transform:uppercase;letter-spacing:.5px;font-weight:700;margin-bottom:6px}
.rs-meta b{color:var(--blue)}
.rs h4{font-size:16px;font-weight:800;line-height:1.35;color:var(--ink)}

/* NEWSLETTER */
.newsletter{background:linear-gradient(135deg,#0047b3,#0066ff);color:#fff;padding:80px 0;position:relative;overflow:hidden}
.newsletter::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(245,179,66,.2),transparent 50%)}
.nl-in{position:relative;max-width:880px;margin:0 auto;text-align:center;padding:0 24px}
.nl-in h2{font-size:36px;font-weight:800;margin-bottom:14px;letter-spacing:-.5px}
.nl-in p{color:#d8e6ff;font-size:17px;margin-bottom:30px;max-width:560px;margin-left:auto;margin-right:auto}
.nl-form{display:flex;gap:8px;max-width:520px;margin:0 auto;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:6px}
.nl-form input{flex:1;background:transparent;border:0;outline:0;color:#fff;padding:14px 18px;font-size:15px}
.nl-form input::placeholder{color:#bcd4ff}

/* FOOTER */
footer{background:#06122c;color:#bcd4ff;padding:60px 0 30px}
.foot-grid{max-width:1280px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.foot-grid h5{color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:1px;margin-bottom:18px}
.foot-grid a{color:#bcd4ff;display:block;padding:5px 0;font-size:14px}
.foot-grid a:hover{color:#fff}
.foot-bottom{max-width:1280px;margin:0 auto;padding:22px 24px 0;border-top:1px solid #1d3260;display:flex;justify-content:space-between;color:#7a93c4;font-size:13px;flex-wrap:wrap;gap:14px}

/* MODAL */
.modal{display:none;position:fixed;inset:0;background:rgba(6,18,44,.78);backdrop-filter:blur(8px);z-index:5000;align-items:center;justify-content:center;padding:20px}
.modal.open{display:flex}
.modal-box{background:#fff;border-radius:20px;max-width:500px;width:100%;padding:34px;position:relative;animation:slideUp .35s;max-height:min(90vh,760px);overflow-y:auto;overscroll-behavior:contain;}
@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.modal-box h3{font-size:24px;font-weight:800;margin-bottom:8px}
.modal-box p{color:var(--mute);margin-bottom:22px;font-size:14px}
.modal-x{position:absolute;top:16px;right:18px;background:transparent;border:0;font-size:26px;cursor:pointer;color:var(--mute);z-index:2;}
.f-row{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.f-row label{font-size:13px;font-weight:700}
.f-row input,.f-row select{padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;outline:0;font-family:inherit}
.f-row input:focus,.f-row select:focus{border-color:var(--blue)}

/* WHATSAPP */
.wa-float{position:fixed;bottom:24px;right:24px;width:62px;height:62px;border-radius:50%;background:#25d366;display:grid;place-items:center;cursor:pointer;box-shadow:0 16px 36px rgba(37,211,102,.5);z-index:90}
.wa-float svg{width:32px;height:32px;fill:#fff}
.wa-float::after{content:"";position:absolute;inset:0;border-radius:50%;background:#25d366;animation:pulse 2s infinite;z-index:-1}
@keyframes pulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.6);opacity:0}}

@media(max-width:1100px){
  .art-layout{grid-template-columns:1fr;gap:30px;padding:40px 24px}
  .toc{position:static}
  .aside{position:static;flex-direction:row;flex-wrap:wrap}
  .aside-card{flex:1;min-width:250px}
  .rs-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .art-hero h1{font-size:32px}
  .art-hero .subt{font-size:16px}
  .art-layout{padding:36px 16px;overflow:hidden}
  .art-layout > *,.toc,.content,.aside{min-width:0;max-width:100%}
  .hstrip-in{grid-template-columns:repeat(2,1fr)}
  .pkg-grid,.case-stats{grid-template-columns:1fr 1fr}
  .case-stats{grid-template-columns:1fr 1fr}
  .rs-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:28px}
  .nl-form{flex-direction:column}
  .content h2{font-size:26px}
  .content .lead{font-size:18px}
  blockquote{margin:24px 0;font-size:18px;padding:24px}
}




/* MODAL LAYER FIX */
@media(max-width:600px){.modal{padding:14px}.modal-box{max-height:calc(100vh - 28px);padding:30px 22px}}


/* CREATOR COMPACT FOOTER */
footer.cc-footer-compact{--ccf-ink:#0a1733;--ccf-ink2:#1a2952;--ccf-muted:#6577a3;--ccf-soft:#f4f7fc;--ccf-soft2:#eef4ff;--ccf-line:#e1e8f4;--ccf-blue:#0066ff;--ccf-blue-d:#0047b3;--ccf-green:#25d366;background:#fff;color:var(--ccf-ink);padding:0;border-top:1px solid var(--ccf-line);position:relative;overflow:hidden}
footer.cc-footer-compact::before,footer.cc-footer-compact::after{content:none;display:none}
.ccf-wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.ccf-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px;align-items:center;padding:26px 0;border-bottom:1px solid var(--ccf-line)}
.ccf-logo{display:flex;align-items:center;gap:12px;font-size:24px;font-weight:900;color:var(--ccf-ink);white-space:nowrap;letter-spacing:0}
.ccf-mark{width:42px;height:42px;border-radius:8px;background:var(--ccf-blue);color:#fff;display:grid;place-items:center;font-weight:900;box-shadow:0 10px 22px rgba(0,102,255,.22);flex:0 0 auto}
.ccf-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;min-width:0}
.ccf-nav a{border:1px solid var(--ccf-line);border-radius:999px;padding:9px 12px;font-size:13px;font-weight:900;color:var(--ccf-ink2);background:var(--ccf-soft);line-height:1.1;white-space:nowrap}
.ccf-nav a:hover{background:var(--ccf-soft2);color:var(--ccf-blue-d);border-color:#bed3ff}
.ccf-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.ccf-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:12px 16px;border-radius:999px;font-size:13px;font-weight:900;white-space:nowrap;border:1px solid transparent;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;text-decoration:none;line-height:1;color:#fff}
.ccf-btn:hover{transform:translateY(-1px)}
.ccf-btn-primary{background:var(--ccf-blue);color:#fff;box-shadow:0 12px 26px rgba(0,102,255,.24)}
.ccf-btn-wa{background:var(--ccf-green);color:#063d1b;box-shadow:0 12px 26px rgba(37,211,102,.20)}
.ccf-mid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.1fr;gap:28px;padding:28px 0}
.ccf-copy{color:var(--ccf-muted);margin-top:10px;max-width:360px;font-size:14px;line-height:1.6}
.ccf-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.ccf-chips a{border:1px solid var(--ccf-line);border-radius:999px;padding:8px 10px;font-size:12px;font-weight:900;background:#fff;color:var(--ccf-ink2);line-height:1.1}
.ccf-chips a:hover{background:var(--ccf-soft2);color:var(--ccf-blue-d)}
.ccf-group{display:grid;gap:9px;align-content:start;min-width:0}
.ccf-group h4,.ccf-cert-head .ccf-eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ccf-ink);margin:0 0 4px;font-weight:900}
.ccf-group a,.ccf-group span{display:block;color:var(--ccf-ink);opacity:.76;font-size:14px;line-height:1.35;min-width:0;overflow-wrap:anywhere}
.ccf-group a:hover{opacity:1;color:var(--ccf-blue)}
.ccf-cert-panel{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;padding:18px 0;border-top:1px solid var(--ccf-line);border-bottom:1px solid var(--ccf-line)}
.ccf-cert-head h3{font-size:18px;line-height:1.1;letter-spacing:0;margin:0 0 5px;color:var(--ccf-ink);max-width:360px}
.ccf-cert-head p{font-size:13px;line-height:1.45;color:var(--ccf-muted);max-width:420px;margin:0}
.ccf-cert-grid{display:grid;grid-template-columns:repeat(5,minmax(86px,1fr));gap:8px;align-items:stretch}
.ccf-cert-card,.ccf-rating-card{min-height:70px;border:1px solid var(--ccf-line);border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;padding:10px;min-width:0}
.ccf-cert-card img{display:block;max-width:100%;max-height:44px;object-fit:contain;filter:saturate(.95);opacity:.95}
.ccf-rating-card{display:grid;align-content:center;justify-items:start;gap:3px;color:var(--ccf-ink);background:linear-gradient(135deg,#fff,#f8fbff);text-decoration:none}
.ccf-rating-card b{font-size:23px;line-height:1;color:var(--ccf-blue);font-weight:900}
.ccf-rating-card span{font-size:12px;font-weight:900;color:var(--ccf-ink);line-height:1.1}
.ccf-rating-card small{font-size:10px;font-weight:800;color:var(--ccf-muted);line-height:1.2}
.ccf-legal{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ccf-muted);padding:16px 0}
.ccf-legal a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.ccf-legal a:hover{color:var(--ccf-blue)}
@media(max-width:1020px){
  .ccf-top{grid-template-columns:1fr;gap:18px;align-items:start}
  .ccf-nav{justify-content:flex-start}
  .ccf-actions{justify-content:flex-start}
  .ccf-mid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ccf-cert-panel{grid-template-columns:1fr}
  .ccf-cert-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:680px){
  .ccf-wrap{padding:0 18px}
  .ccf-logo{font-size:22px}
  .ccf-top{padding:22px 0}
  .ccf-nav{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .ccf-nav a{text-align:center;white-space:normal}
  .ccf-actions{width:100%}
  .ccf-btn{flex:1 1 150px}
  .ccf-mid{grid-template-columns:1fr;gap:22px}
  .ccf-cert-panel{gap:14px;padding:18px 0}
  .ccf-cert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ccf-cert-card,.ccf-rating-card{min-height:76px}
  .ccf-cert-card img{max-height:48px}
  .ccf-legal{display:grid;gap:8px}
}
@media(max-width:390px){
  .ccf-nav,.ccf-cert-grid{grid-template-columns:1fr}
  .ccf-logo{font-size:20px}
  .ccf-mark{width:38px;height:38px}
}

/* CREATOR HEADER V2 */
.cc-topbar{background:#fff;color:var(--mute,#6577a3);font-size:11.5px;border-bottom:1px solid var(--line,#e3e9f5)}
.cc-topbar-in{max-width:1240px;margin:0 auto;padding:5px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;min-width:0}
.cc-topbar-left,.cc-topbar-right{display:flex;align-items:center;gap:18px;min-width:0}
.cc-topbar a,.cc-topbar span{color:inherit;white-space:nowrap}
.cc-topbar a:hover{color:var(--blue,#0066ff)}
.cc-site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--line,#e3e9f5);box-shadow:0 12px 34px rgba(10,23,51,.07)}
.cc-nav{max-width:1240px;margin:0 auto;padding:14px 24px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;position:relative;min-width:0}
.cc-logo{display:flex;align-items:center;gap:10px;color:var(--ink,#0a1733);font-weight:900;letter-spacing:0;white-space:nowrap;min-width:0}
.cc-logo:hover{color:var(--ink,#0a1733)}
.cc-logo-mark{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--blue,#0066ff),var(--blue-d,#0047b3));color:#fff;display:grid;place-items:center;font-size:20px;font-weight:900;box-shadow:0 10px 24px rgba(0,102,255,.28);flex:0 0 auto}
.cc-logo-text{font-size:20px;line-height:1}
.cc-menu{display:flex;align-items:center;justify-content:center;gap:clamp(8px,.9vw,14px);min-width:0;color:var(--ink2,#1a2952)}
.cc-menu>a{color:inherit;font-size:13px;font-weight:750;white-space:nowrap;line-height:1.2;padding:8px 0;position:relative}
.cc-menu>a:hover,.cc-menu>a.current{color:var(--blue,#0066ff)}
.cc-menu>a.current::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--blue,#0066ff)}
.cc-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap;min-width:0}
.cc-phone-pill{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:9px 12px;border-radius:999px;background:var(--sky,#e8f1ff);color:var(--blue-d,#0047b3);font-size:12px;font-weight:900;white-space:nowrap}
.cc-phone-pill:hover{color:var(--blue-d,#0047b3)}
.cc-lang{display:flex;align-items:center;gap:0;border:1px solid var(--line,#e3e9f5);border-radius:999px;background:#fff;padding:3px;flex:0 0 auto}
.cc-lang button{border:0;background:transparent;color:var(--mute,#6577a3);font-weight:900;font-size:12px;padding:7px 9px;border-radius:999px;cursor:pointer;font-family:inherit;line-height:1}
.cc-lang button.active{background:var(--ink,#0a1733);color:#fff}
.cc-btn{border:0;border-radius:999px;padding:10px 14px;font-weight:900;font-size:12px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;min-height:38px;font-family:inherit;text-decoration:none;transition:transform .18s,box-shadow .18s,background .18s;color:#fff}
.cc-btn:hover{transform:translateY(-1px)}
.cc-btn-gold{background:var(--gold,#f5b342);color:#2f2100;box-shadow:0 10px 24px rgba(245,179,66,.28)}
.cc-btn-wa{background:#25d366;color:#063d1b;box-shadow:0 10px 24px rgba(37,211,102,.24)}
.cc-btn-wa:hover{color:#063d1b;background:#25d366}
.cc-mobile-wa{display:none}
.cc-burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line,#e3e9f5);background:#fff;border-radius:14px;color:var(--ink,#0a1733);cursor:pointer;position:relative;box-shadow:0 10px 24px rgba(10,23,51,.08);flex:0 0 auto}
.cc-burger span{position:absolute;width:18px;height:2px;border-radius:2px;background:currentColor;transition:transform .22s ease,opacity .18s ease}
.cc-burger span:nth-child(1){transform:translateY(-6px)}
.cc-burger span:nth-child(3){transform:translateY(6px)}
.cc-burger.active span:nth-child(1){transform:rotate(45deg)}
.cc-burger.active span:nth-child(2){opacity:0}
.cc-burger.active span:nth-child(3){transform:rotate(-45deg)}
.cc-drawer-tools{display:none}
@media(max-width:1240px){
  .cc-nav{gap:12px}
  .cc-menu{gap:10px}
  .cc-phone-pill{display:none}
  .cc-btn{padding-left:12px;padding-right:12px}
}
@media(max-width:1100px){
  .cc-topbar{display:none}
  .cc-nav{grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;padding:10px 16px}
  .cc-actions{display:none}
  .cc-menu{display:none}
  .cc-mobile-wa{display:inline-flex;grid-column:3;grid-row:1;min-height:42px;padding:0 13px;border-radius:14px;font-size:11px}
  .cc-burger{display:inline-flex;grid-column:4;grid-row:1}
  .cc-menu.open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));position:absolute;top:calc(100% + 10px);left:16px;right:16px;z-index:1200;background:#fff;color:var(--ink,#0a1733);border:1px solid var(--line,#e3e9f5);border-radius:22px;box-shadow:0 24px 60px rgba(10,23,51,.18);padding:12px;align-items:stretch;gap:7px;max-height:calc(100vh - 96px);overflow:auto}
  .cc-menu.open>a{display:flex;align-items:center;justify-content:space-between;min-height:42px;padding:11px 12px;border-radius:14px;background:var(--soft,#f4f7fc);font-size:14px;font-weight:850;color:var(--ink,#0a1733)}
  .cc-menu.open>a::after{content:">";color:var(--blue,#0066ff);font-weight:900}
  .cc-menu.open>a:hover{background:var(--sky,#e8f1ff)}
  .cc-menu.open>a.current::after{content:">";position:static;height:auto;background:none}
  .cc-menu.open .cc-drawer-tools{display:grid;grid-column:1/-1;gap:10px;margin-top:7px;padding-top:12px;border-top:1px solid var(--line,#e3e9f5)}
  .cc-drawer-actions{display:grid;grid-template-columns:76px minmax(0,1fr) minmax(0,1fr);gap:8px}
  .cc-drawer-actions .cc-lang{height:42px;width:100%;justify-content:center;background:#fff}
  .cc-drawer-actions .cc-btn{width:100%;min-height:42px;border-radius:13px;padding:10px 8px}
  .cc-drawer-contact{display:grid;gap:8px;font-size:12px;color:var(--ink2,#1a2952)}
  .cc-drawer-contact > a,.cc-drawer-contact > span{display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px;align-items:center;min-height:38px;padding:8px 10px;background:var(--soft,#f4f7fc);border:1px solid var(--line,#e3e9f5);border-radius:13px;font-weight:750;color:inherit}
  .cc-drawer-contact b{color:var(--mute,#6577a3);font-size:10px;line-height:1;text-transform:uppercase;font-weight:900}
  .cc-drawer-contact > span span,.cc-drawer-contact > a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-width:430px){
  .cc-logo-text{display:none}
  .cc-nav{grid-template-columns:auto minmax(0,1fr) auto auto;padding:10px 12px}
  .cc-menu.open{left:10px;right:10px}
  .cc-drawer-actions{grid-template-columns:72px 1fr 1fr}
  .cc-btn{font-size:11px}
  .cc-lang button{padding:7px 8px}
}
@media(max-width:340px){
  .cc-mobile-wa{padding:0 10px;font-size:10px}
  .cc-burger{width:42px;height:42px}
}

/* SHARED PAGE RHYTHM POLISH */
@media(min-width:901px){
  section{padding-top:78px!important;padding-bottom:78px!important}
  .section-head{margin-bottom:42px!important;max-width:720px!important}
  .section-head h2{font-size:clamp(32px,3vw,42px)!important;line-height:1.14!important;letter-spacing:-.6px!important}
  .section-head p{font-size:16px!important;line-height:1.6!important}
  .hero-about,.hero-s,.hero-p,.hero-c{min-height:52vh!important;padding:72px 0 58px!important}
  .hero,.svc-hero,.art-hero{min-height:auto!important;padding:68px 0 58px!important}
  .hero-about::before,.hero-s::before,.hero-s::after,.hero-p::before,.hero-c::before,footer::before{display:none!important}
  .hero::before,.hero::after,.hero-waves,.svc-hero::before,.svc-hero::after,.art-hero::before,.art-hero::after{display:none!important}
  .hero-about h1,.hero-s h1,.hero-p h1,.hero-c h1{font-size:clamp(42px,4.4vw,58px)!important;line-height:1.05!important;margin-bottom:18px!important;letter-spacing:-1px!important}
  .hero h1,.svc-hero h1,.art-hero h1{font-size:clamp(38px,4vw,54px)!important;line-height:1.08!important;margin-bottom:18px!important;letter-spacing:-.8px!important}
  .hero-about p,.hero-s p,.hero-p p,.hero-c p{font-size:18px!important;line-height:1.55!important;margin-bottom:28px!important}
  .hero p.lead,.hero .lead,.svc-hero p,.art-hero .subt{font-size:17px!important;line-height:1.58!important;margin-bottom:22px!important}
  .hero-in,.svc-hero-grid{gap:34px!important;align-items:center!important}
  .hero-card,.svc-fact-box,.sfb-price{border-radius:16px!important}
  .svc-fact-box{padding:26px!important}
  .svc-fact-box .price,.sfb-price .amt{font-size:42px!important}
  .hero-stats{gap:26px!important;margin-top:16px!important}
  .hero-stats strong{font-size:38px!important}
  .hero-s .stats{max-width:760px!important;padding:18px!important;gap:16px!important;border-radius:16px!important;margin-bottom:26px!important}
  .hero-s .stats div strong{font-size:28px!important}
  .hero-p .promises{gap:14px!important;margin-bottom:24px!important}
  .card,.cert,.aw,.csr,.dept,.msg,.sc,.pkg,.case-wrap,.team-c,.war-card,.ex,.price,.faq-item,.service-card,.svc,.feat,.art,.post,.step,.tm,.office-grid .o{border-radius:14px!important}
  .cards-grid,.certs-grid,.aw-grid,.csr-grid,.depts-grid,.msg-grid,.social-grid,.packages-grid,.team-grid,.ex-grid,.service-grid,.services-grid,.featured-grid,.articles-grid,.blog-grid{gap:18px!important}
  .cert,.aw,.csr,.dept,.msg,.sc,.pkg,.team-c,.war-card,.ex .ex-body,.price,.service-card,.post-body,.art-body,.feat-body{padding:22px!important}
  .svc-img,.cat-img,.ex-img,.post-img,.art-thumb,.feat-img{max-height:220px!important}
  .map,.map-wrap{height:340px!important;margin-top:38px!important;border-radius:16px!important}
  .cta-band,.book,.inline-cta,.newsletter{padding-top:62px!important;padding-bottom:62px!important}
  .ccf-mid{padding:24px 0!important}
  .ccf-top{padding:22px 0!important}
}
@media(max-width:720px){
  section{padding-top:48px!important;padding-bottom:48px!important}
  .section-head{text-align:left!important;margin-bottom:24px!important}
  .hero-about,.hero-s,.hero-p,.hero-c,.hero,.svc-hero,.art-hero{min-height:auto!important;padding:44px 0 38px!important;text-align:left!important}
  .hero-about .container,.hero-s .container,.hero-p .container,.hero-c .container,.art-hero-in{text-align:left!important}
  .hero-in,.svc-hero-grid{display:grid!important;grid-template-columns:1fr!important;gap:22px!important}
  .hero-about h1,.hero-s h1,.hero-p h1,.hero-c h1,.hero h1,.svc-hero h1,.art-hero h1{font-size:34px!important;line-height:1.08!important;letter-spacing:-.3px!important}
  .hero-about p,.hero-s p,.hero-p p,.hero-c p,.hero p.lead,.svc-hero p,.art-hero .subt{font-size:16px!important;margin-bottom:20px!important}
  .hero-stats,.hero-s .stats,.hero-p .promises,.hero-bullets{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .hero-stats strong,.hero-stat b{font-size:28px!important}
  .hero-card,.svc-fact-box{padding:20px!important;border-radius:14px!important}
  .btn{width:100%;justify-content:center}
  .hero-cta{display:grid!important;gap:10px!important;width:100%}
  .ccf-cert-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:430px){
  .hero-stats,.hero-s .stats,.hero-p .promises,.hero-bullets{grid-template-columns:1fr!important}
  .hero-stat,.hero-s .stats div,.hero-p .promises span{min-width:0!important}
}

/* ── Блоки статей из базы ───────────────────────────────────── */

/* Короткий ответ в начале — его цитируют ИИ-поисковики */
.art-answer{background:linear-gradient(135deg,#f0f6ff,#e8f1ff);border:1px solid #cfe0fb;
  border-left:4px solid var(--blue);border-radius:14px;padding:22px 24px;margin:0 0 34px}
.art-answer b{display:block;margin-bottom:9px;font-size:12px;letter-spacing:.9px;
  text-transform:uppercase;color:var(--blue-d)}
.art-answer p{margin:0;font-size:17.5px;line-height:1.65}
.art-answer strong{color:var(--ink);font-weight:800}

.art-body h2{margin:44px 0 16px;font-size:27px;line-height:1.25;scroll-margin-top:90px}
.art-body h3{margin:30px 0 12px;font-size:20px}
.art-body p{margin:0 0 18px}
.art-body a{border-bottom:1px solid rgba(0,102,255,.3)}
.art-body a:hover{border-bottom-color:var(--blue)}

.art-table{width:100%;border-collapse:collapse;margin:22px 0;font-size:15.5px;
  border:1px solid var(--border);border-radius:12px;overflow:hidden}
.art-table th{background:var(--soft);padding:12px 14px;text-align:left;font-size:13px;
  text-transform:uppercase;letter-spacing:.5px;color:var(--mute);border-bottom:1px solid var(--border)}
.art-table td{padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:top}
.art-table tr:last-child td{border-bottom:0}
.art-table tbody tr:nth-child(even){background:#fbfcfe}
.art-table-wrap{overflow-x:auto}

.art-list{margin:0 0 22px;padding:0;list-style:none;display:grid;gap:11px}
.art-list li{position:relative;padding-left:26px}
.art-list li:before{content:"";position:absolute;left:4px;top:11px;width:7px;height:7px;
  border-radius:50%;background:var(--blue)}

.art-steps{margin:0 0 22px;padding-left:22px;display:grid;gap:12px}
.art-steps li{padding-left:6px}
.art-steps li::marker{color:var(--blue);font-weight:800}

.art-body details{border:1px solid var(--border);border-radius:12px;padding:0;margin:0 0 10px;
  background:#fff;overflow:hidden}
.art-body details summary{padding:15px 18px;cursor:pointer;font-weight:700;list-style:none;
  display:flex;justify-content:space-between;gap:14px;align-items:center}
.art-body details summary::-webkit-details-marker{display:none}
.art-body details summary:after{content:"+";color:var(--blue);font-size:20px;font-weight:800;flex:none}
.art-body details[open] summary:after{content:"–"}
.art-body details[open] summary{border-bottom:1px solid var(--border)}
.art-body details p{margin:0;padding:15px 18px;color:var(--mute)}

.art-cta{margin:44px 0 0;padding:28px;border-radius:16px;color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--blue-d))}
.art-cta h3{margin:0 0 10px;color:#fff;font-size:22px}
.art-cta p{margin:0 0 18px;color:rgba(255,255,255,.88)}
.art-cta-actions{display:flex;gap:12px;flex-wrap:wrap}
.art-cta .btn-ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4);color:#fff}

.related-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.related-post{display:block;padding:20px;border:1px solid var(--border);border-radius:14px;
  background:#fff;transition:.18s}
.related-post:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(10,23,51,.09)}
.related-post span{display:block;margin-bottom:9px;font-size:11px;font-weight:800;
  text-transform:uppercase;letter-spacing:.7px;color:var(--blue)}
.related-post b{display:block;margin-bottom:8px;color:var(--ink);font-size:16.5px;line-height:1.35}
.related-post p{margin:0;color:var(--mute);font-size:14px;line-height:1.55}

@media(max-width:900px){
  .related-posts{grid-template-columns:1fr}
  .art-body h2{font-size:23px}
  .art-answer{padding:18px 19px}
  .art-answer p{font-size:16.5px}
  .art-table{font-size:14px;display:block;overflow-x:auto;white-space:nowrap}
  .art-table td,.art-table th{white-space:normal;min-width:110px}
}

/* ── Сетка статей на странице блога ─────────────────────────── */
.ib-list{padding:70px 0}
.ib-list-head{max-width:700px;margin:0 0 32px}
.ib-list-head h2{font-size:30px;margin:8px 0 12px}
.ib-list-head p{color:var(--mute)}
.ib-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ib-card{display:flex;flex-direction:column;gap:10px;padding:24px;border:1px solid var(--border);
  border-radius:16px;background:#fff;transition:.18s}
.ib-card:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(10,23,51,.1);border-color:#c9dcf8}
.ib-card-topic{font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--blue)}
.ib-card b{color:var(--ink);font-size:19px;line-height:1.32}
.ib-card p{margin:0;color:var(--mute);font-size:14.5px;line-height:1.6;flex:1}
.ib-card-meta{color:var(--mute);font-size:12.5px;font-weight:700}
.ib-empty{color:var(--mute)}
@media(max-width:980px){.ib-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.ib-grid{grid-template-columns:1fr}.ib-list{padding:48px 0}}
.art-updated{padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.16);
  font-size:12.5px;font-weight:700}