/* Раздел «Как писать» — на основе /site/legal/legal.css */
body{margin:0;background:#f7f8fc;color:#35415a;font:18px/1.75 "PT Sans",sans-serif}
*{box-sizing:border-box}
a{color:#b86439;text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1180px;margin:auto;padding:28px}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.brand{display:flex;gap:12px;align-items:center;font:700 24px "PT Sans Caption",sans-serif;color:#2d374d}
.brand img{width:34px}
.top-links{display:flex;gap:22px;align-items:center;font-size:16px}
.top-links .here{color:#40516d;font-weight:700}

.layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:48px;padding-top:30px}
/* Меню стоит в разметке после статьи: на телефоне оно под текстом, на широком экране — слева. */
.layout>.nav{grid-column:1;grid-row:1}
.layout>.paper{grid-column:2;grid-row:1}
.nav{align-self:start;position:sticky;top:20px;max-height:calc(100vh - 40px);overflow:auto;font-size:15px;padding-right:4px}
.nav details{margin-bottom:6px}
.nav summary{cursor:pointer;list-style:none;font:700 15px "PT Sans Caption",sans-serif;color:#40516d;padding:9px 12px;border-radius:9px}
.nav summary::-webkit-details-marker{display:none}
.nav summary::after{content:"＋";float:right;color:#9aa4b4;font-weight:400}
.nav details[open] summary::after{content:"－"}
.nav summary:hover{background:#eef1f6}
.nav ol{list-style:none;margin:2px 0 10px;padding:0}
.nav li a{display:block;color:#7c879a;padding:6px 12px 6px 22px;border-radius:9px;line-height:1.4}
.nav li a:hover{background:#eef1f6;text-decoration:none;color:#40516d}
.nav li a.active{background:#e9edf4;color:#40516d;font-weight:700}
.nav .hub{display:block;color:#7c879a;padding:9px 12px;border-radius:9px;margin-bottom:6px}
.nav .hub.active{background:#e9edf4;color:#40516d;font-weight:700}
.nav li a.all{color:#9aa4b4;font-size:14px}

.paper{background:#fff;border:1px solid #e1e6ef;padding:44px 48px;border-radius:19px;min-width:0}
.crumbs{font-size:13px;color:#9aa4b4;display:flex;flex-wrap:wrap;gap:6px}
.crumbs a{color:#9aa4b4}
.crumbs a:hover{color:#b86439}
.paper h1{font:700 36px/1.22 "PT Sans Caption",sans-serif;letter-spacing:-1.1px;margin:14px 0 10px;color:#2d374d}
.meta{font-size:14px;color:#9aa4b4;margin-bottom:26px}
.paper h2{font:700 24px/1.35 "PT Sans Caption",sans-serif;margin:40px 0 12px;color:#2d374d}
.paper h3{font:700 19px/1.4 "PT Sans Caption",sans-serif;margin:28px 0 8px;color:#35415a}
.paper p,.paper li{color:#5d6880;font-size:17.5px}
.paper .body>p:first-child{font-size:19px;color:#4a556b}
.paper strong{color:#35415a}
.paper ul,.paper ol{padding-left:24px;margin:10px 0 16px}
.paper li{margin:6px 0}
.paper li>p{margin:4px 0}
.paper blockquote{margin:16px 0;padding:12px 18px;border-left:3px solid #e2a37e;background:#fbf7f3;border-radius:0 11px 11px 0}
.paper blockquote p{margin:6px 0;color:#4a556b;font-size:17px}
.paper code{font-size:.9em;background:#f1f3f8;padding:1px 6px;border-radius:5px}
.paper hr{border:0;border-top:1px solid #e4e8ef;margin:30px 0}
.table-wrap{overflow-x:auto;margin:16px 0 22px;border:1px solid #e1e6ef;border-radius:12px}
.paper table{border-collapse:collapse;width:100%;font-size:15.5px;line-height:1.5}
.paper th,.paper td{padding:10px 14px;text-align:left;vertical-align:top;border-bottom:1px solid #e9edf3;color:#5d6880}
.paper th{background:#f4f6fa;color:#35415a;font-weight:700}
.paper tr:last-child td{border-bottom:0}

.cta{margin-top:40px;padding:24px 26px;border:1px solid #edd5bf;background:#fff5e9;border-radius:15px;display:flex;gap:18px;align-items:center}
.cta img{width:54px;flex:none}
.cta b{display:block;font:700 19px/1.35 "PT Sans Caption",sans-serif;color:#7c4a2b;margin-bottom:4px}
.cta p{margin:0 0 12px;color:#9b6b48;font-size:16px;line-height:1.6}
.cta a.btn{display:inline-block;background:#bd542b;color:#fff;font-weight:700;padding:9px 18px;border-radius:10px;font-size:16px}
.cta a.btn:hover{text-decoration:none;background:#a8471f}

.pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px}
.pager a{display:block;border:1px solid #e1e6ef;border-radius:13px;padding:14px 18px;color:#40516d;line-height:1.4}
.pager a:hover{border-color:#e2a37e;text-decoration:none}
.pager small{display:block;color:#9aa4b4;font-size:13px;margin-bottom:3px}
.pager .next{text-align:right;grid-column:2}

/* Коротко, оглавление, вопросы, «Читайте также» */
.short{margin:0 0 22px;padding:16px 20px;border:1px solid #e1e6ef;border-radius:14px;background:#f8f9fc}
.short b{display:block;font:700 15px "PT Sans Caption",sans-serif;color:#40516d;margin-bottom:4px}
.short ul{margin:0;padding-left:20px}
.paper .short li{font-size:16.5px;margin:4px 0}
.toc{margin:0 0 26px;padding:14px 20px;border-left:3px solid #e1e6ef}
.toc b{display:block;font-size:14px;color:#9aa4b4;margin-bottom:4px}
.toc ol{margin:0;padding-left:20px}
.paper .toc li{font-size:16px;margin:3px 0}
.faq h3{margin-top:20px}
.paper .cards,.cards{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.paper .cards li{margin:0}
.cards a{display:block;height:100%;border:1px solid #e1e6ef;border-radius:12px;padding:12px 15px;line-height:1.4}
.cards a:hover{border-color:#e2a37e;text-decoration:none}
.cards b{display:block;color:#40516d;font-size:16px}
.cards span{display:block;color:#7c879a;font-size:14.5px;margin-top:3px}
.situations{margin:22px 0 6px}
.situations b{display:block;font-size:14px;color:#9aa4b4;margin-bottom:8px}
.situations div{display:flex;flex-wrap:wrap;gap:8px}
.situations a{border:1px solid #e1e6ef;border-radius:999px;padding:6px 14px;font-size:15px;color:#40516d}
.situations a:hover{border-color:#e2a37e;text-decoration:none}
.ai-plaque{margin:26px 0 0;padding:20px 22px;border:1px solid #edd5bf;background:#fff8f0;border-radius:16px}
.ai-plaque h2{margin:0 0 6px;font-size:22px}
.paper .ai-plaque p{margin:0;font-size:16px}
.hub-card h2 a{color:inherit}
.hub-card .cards{grid-template-columns:1fr}

/* Хаб */
.hub-intro{font-size:19px;color:#4a556b;max-width:720px}
.hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:28px}
.hub-card{border:1px solid #e1e6ef;border-radius:16px;padding:22px 24px}
.hub-card h2{margin:0 0 4px;font-size:22px}
.hub-card>p{margin:0 0 12px;font-size:15.5px;color:#7c879a}
.hub-card ol{margin:0;padding-left:20px}
.hub-card li{font-size:16px;margin:5px 0}

.bottom{font-size:14px;color:#9aa4b4;padding-bottom:50px;display:flex;flex-wrap:wrap;gap:8px 22px}
.bottom a{color:#9aa4b4}

@media(max-width:860px){
 .wrap{padding:18px}
 .layout{display:block;padding-top:6px}
 .nav{position:static;max-height:none;margin-top:18px;background:#fff;border:1px solid #e1e6ef;border-radius:15px;padding:8px}
 .cards{grid-template-columns:1fr}
 .paper{padding:26px 20px;border-radius:16px}
 .paper h1{font-size:28px}
 .paper h2{font-size:21px}
 .paper p,.paper li{font-size:17px}
 .brand{font-size:19px;white-space:nowrap}
 .brand img{width:28px}
 .top-links{gap:14px;font-size:14px;white-space:nowrap}
 .top-links a[href="/#pricing"]{display:none}
 .hub-grid{grid-template-columns:1fr}
 .cta{flex-direction:column;align-items:flex-start}
 .pager{grid-template-columns:1fr}
 .pager .next{grid-column:1}
}

/* Тёмная тема (переменные из /site/theme.css) */
html[data-theme="dark"] .brand,html[data-theme="dark"] .paper h1,html[data-theme="dark"] .paper h2,html[data-theme="dark"] .paper h3,html[data-theme="dark"] .paper strong,html[data-theme="dark"] .top-links .here{color:var(--theme-text)}
html[data-theme="dark"] :is(.paper p,.paper li,.paper td,.nav li a,.nav .hub,.hub-card>p){color:var(--theme-muted)}
html[data-theme="dark"] .paper .body>p:first-child,html[data-theme="dark"] .hub-intro{color:var(--theme-text)}
html[data-theme="dark"] :is(.nav summary){color:var(--theme-text)}
html[data-theme="dark"] :is(.nav li a.active,.nav .hub.active,.nav summary:hover,.nav li a:hover){background:var(--theme-soft);color:var(--theme-text)}
html[data-theme="dark"] :is(.paper,.hub-card,.pager a,.table-wrap,.cards a,.situations a){background:var(--theme-panel);border-color:var(--theme-line)}
html[data-theme="dark"] .short{background:var(--theme-soft);border-color:var(--theme-line)}
html[data-theme="dark"] .toc{border-left-color:var(--theme-line)}
html[data-theme="dark"] .ai-plaque{background:var(--theme-warm);border-color:var(--theme-warm-line)}
html[data-theme="dark"] :is(.cards b,.situations a,.short b){color:var(--theme-text)}
html[data-theme="dark"] :is(.cards span,.toc b,.situations b,.nav li a.all){color:var(--theme-muted)}
html[data-theme="dark"] .paper th{background:var(--theme-soft);color:var(--theme-text)}
html[data-theme="dark"] :is(.paper th,.paper td){border-color:var(--theme-line)}
html[data-theme="dark"] .paper blockquote{background:var(--theme-warm);border-left-color:#b87550}
html[data-theme="dark"] .paper blockquote p{color:var(--theme-text)}
html[data-theme="dark"] .paper code{background:var(--theme-soft)}
html[data-theme="dark"] .pager a{color:var(--theme-text)}
html[data-theme="dark"] a{color:var(--theme-orange)}
html[data-theme="dark"] .cta{background:var(--theme-warm);border-color:var(--theme-warm-line)}
html[data-theme="dark"] .cta b{color:var(--theme-text)}
html[data-theme="dark"] .cta p{color:var(--theme-muted)}
html[data-theme="dark"] .cta a.btn{background:#d96f3d;color:#fff}
html[data-theme="dark"] :is(.crumbs a,.meta,.bottom a,.pager small){color:var(--theme-muted)}
@media(max-width:860px){html[data-theme="dark"] .nav{background:var(--theme-panel);border-color:var(--theme-line)}}