html, body {
    margin: 0; padding: 0;
    background: #f4f8fc;
    font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
    color: #1a202c;
    min-height: 100%;
}
body { min-height: 100vh; }

.main-header {
    background: linear-gradient(90deg, #48b1f3 0%, #34cea3 100%);
    color: #fff;
    padding: 32px 0 12px 0;
    box-shadow: 0 4px 24px #48b1f344;
}
.header-inner {
    display: flex;
    align-items: center;
    max-width: 1160px;
    margin: 0 auto;
    justify-content: space-between;
    flex-wrap: wrap;
}
.logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    font-size: 2.0em;
    font-weight: 600;
    color: #fff;
    letter-spacing: 1px;
    transition: color .2s;
}
.logo-ico {
    font-size: 1.6em;
    margin-right: 12px;
    filter: drop-shadow(0 1px 2px #0004);
}
.logo-text { font-size: 1.1em; }
.top-nav {
    display: flex;
    gap: 26px;
    font-size: 1.1em;
}
.top-nav a {
    color: #fff;
    text-decoration: none;
    position: relative;
    padding: 2px 6px;
    transition: color .2s;
}
.top-nav a:hover {
    color: #feff7a;
}
.header-desc {
    max-width: 760px;
    margin: 18px auto 0 auto;
    color: #eafcff;
    font-size: 1.18em;
    text-align: center;
}
.breadcrumbs {
    max-width: 1160px;
    margin: 22px auto 0 auto;
    font-size: 1em;
    color: #444;
    padding-left: 16px;
    padding-bottom: 2px;
}
.breadcrumbs a {
    color: #249ed3;
    text-decoration: none;
}
.breadcrumbs span[itemprop="itemListElement"] + span[itemprop="itemListElement"]:before {
    content: "›";
    margin: 0 7px;
    color: #aaa;
}

.main-content {
    max-width: 1160px;
    margin: 36px auto 24px auto;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 6px 32px #48b1f314;
    padding: 38px 28px 40px 28px;
    min-height: 380px;
}
.categories-block {
    margin-bottom: 42px;
}
.categories-block h2 {
    font-size: 2.1em;
    color: #21a58a;
    margin-bottom: 20px;
    font-weight: 800;
}
.categories-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 26px;
}
.category-card {
    background: linear-gradient(120deg, #e1f6fd 0%, #e2f7f2 100%);
    border-radius: 16px;
    box-shadow: 0 3px 16px #b9f0fb26;
    padding: 22px 18px 16px 20px;
    transition: box-shadow .22s, transform .22s;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.category-card:hover {
    box-shadow: 0 7px 32px #52d9ff42;
    transform: translateY(-4px) scale(1.017);
}
.category-card h3 {
    color: #13b378;
    margin: 0 0 7px 0;
    font-size: 1.22em;
}
.category-card p {
    font-size: 1.05em;
    color: #1e6d55;
    margin: 0 0 8px 0;
}
.category-card ul {
    list-style: disc;
    padding-left: 17px;
    margin: 7px 0 0 0;
}
.category-card li {
    margin-bottom: 5px;
    font-size: 1.07em;
}
.category-card a {
    color: #249ed3;
    font-weight: 500;
    text-decoration: none;
    transition: color .17s;
}
.category-card a:hover {
    color: #1977d2;
    text-decoration: underline;
}

.calc-block {
    background: linear-gradient(90deg, #ebf9f3 0%, #e3f5fb 100%);
    border-radius: 14px;
    padding: 32px 28px;
    box-shadow: 0 2px 14px #55d9ff18;
    margin-bottom: 38px;
}
.calc-form label { font-weight: 600; }
.calc-form input, .calc-form select, .calc-form button {
    font-size: 1.09em;
    margin: 0 8px 0 0;
    padding: 6px 14px;
    border: 1px solid #a3e3e2;
    border-radius: 6px;
    outline: none;
}
.calc-form button {
    background: linear-gradient(90deg, #34cea3 0%, #48b1f3 100%);
    color: #fff;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background .16s;
}
.calc-form button:hover {
    background: linear-gradient(90deg, #2fc7ff 0%, #35eabb 100%);
}
.calc-result {
    background: #e8fbf2;
    border-left: 5px solid #34cea3;
    margin: 22px 0 28px 0;
    padding: 18px 24px;
    border-radius: 7px;
    font-size: 1.16em;
    color: #144a3d;
}
.faq-block, .bullets-block {
    margin-top: 42px;
}
.faq-block h3, .bullets-block h3 {
    color: #1780d2;
    margin-bottom: 9px;
    font-size: 1.13em;
}
.faq-list, .bullets-list {
    margin: 0; padding: 0;
    list-style: none;
}
.faq-list li {
    margin-bottom: 10px;
    background: #f1f7ff;
    border-left: 4px solid #4db7f2;
    padding: 8px 13px 6px 12px;
    border-radius: 7px;
    font-size: 1.06em;
}
.bullets-list li {
    margin-bottom: 8px;
    background: #e9fcf3;
    border-left: 4px solid #2dc2a4;
    padding: 8px 13px 6px 12px;
    border-radius: 7px;
    font-size: 1.06em;
}
@media (max-width: 900px) {
    .main-content, .header-inner, .categories-list { max-width: 98vw !important; }
    .main-content { padding: 14vw 2vw 7vw 2vw; }
    .categories-list { grid-template-columns: repeat(auto-fit, minmax(222px, 1fr)); }
}
@media (max-width: 580px) {
    .main-header { padding: 24px 0 7px 0; }
    .header-inner { flex-direction: column; align-items: flex-start; gap: 11px; }
    .main-content { padding: 16px 4vw 16vw 4vw; }
    .categories-block h2 { font-size: 1.33em; }
    .category-card { padding: 14px 8px 12px 10px; min-height: 100px; }
}
.main-footer {
    margin-top: 34px;
    background: linear-gradient(90deg, #48b1f3 0%, #34cea3 100%);
    color: #fff;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    box-shadow: 0 -2px 24px #34cea355;
    padding: 24px 0 16px 0;
}
.footer-inner {
    max-width: 1160px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.footer-logo {
    font-size: 1.23em;
    display: flex;
    align-items: center;
    gap: 7px;
}
.footer-links {
    display: flex;
    gap: 22px;
}
.footer-links a { color: #fff; text-decoration: none; }
.footer-links a:hover { text-decoration: underline; }
.examples-block {
    margin: 32px 0 24px 0;
    background: #f9fafb;
    border-radius: 14px;
    padding: 24px;
    box-shadow: 0 2px 12px #0001;
}
.examples-block h3 {
    margin-bottom: 16px;
    font-size: 1.18em;
    color: #194164;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.examples-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    font-size: 1.05em;
}
.examples-table th, .examples-table td {
    padding: 12px 10px;
    border: 1px solid #e1e8ee;
    text-align: center;
    vertical-align: middle;
}
.examples-table th {
    background: #f3f7fa;
    color: #224c65;
    font-weight: 700;
}
.examples-table tr:nth-child(even) {
    background: #f9fcfe;
}
.examples-table a {
    color: #1362be;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.15s;
}
.examples-table a:hover {
    color: #0e388d;
    text-decoration: underline;
}
.examples-table small {
    display: block;
    color: #666;
    margin-top: 2px;
    font-size: 0.93em;
    line-height: 1.2;
}
.sum-highlight { color: #16a34a; font-weight: bold; }
.words-highlight { color: #374151; font-style: italic; }
.info-text { background: #f5f5f5; padding: 1em; margin-top: 1em; }
.forum-main-block {
    margin: 0 auto 36px auto;
    max-width: 760px;
    padding: 32px 22px 26px 22px;
    background: #f7fafe;
    border-radius: 16px;
    box-shadow: 0 3px 18px #94b7ec24;
}
.forum-title {
    margin: 0 0 18px 0;
    font-size: 2.2em;
    color: #257abf;
    font-weight: 900;
    text-align: center;
    letter-spacing: 0.01em;
}
.forum-create-btn {
    display: inline-block;
    background: linear-gradient(90deg, #48e6d8 0%, #3297fc 100%);
    color: #fff;
    font-weight: 600;
    font-size: 1.13em;
    padding: 8px 26px;
    border-radius: 9px;
    margin-bottom: 22px;
    text-decoration: none;
    box-shadow: 0 2px 10px #73d3fa15;
    transition: background .18s, box-shadow .18s;
}
.forum-create-btn:hover {
    background: linear-gradient(90deg, #49cdff 0%, #43efc6 100%);
    color: #f4fffd;
    box-shadow: 0 3px 20px #83e2ed38;
}
.forum-list {
    margin-top: 6px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.forum-item {
    padding: 18px 18px 12px 18px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 12px #68b7ff18;
    border-left: 4px solid #8ee8ff;
    margin-bottom: 4px;
    transition: box-shadow .16s, border-color .16s;
}
.forum-item:hover {
    border-color: #54c6ff;
    box-shadow: 0 5px 26px #b8e7ff28;
}
.forum-link {
    color: #137acf;
    font-size: 1.21em;
    font-weight: 700;
    text-decoration: none;
}
.forum-link:hover {
    color: #14baad;
    text-decoration: underline;
}
.forum-meta {
    margin-top: 8px;
    color: #3a4860;
    font-size: 0.98em;
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}
.forum-meta span {
    background: #f1f7ff;
    border-radius: 6px;
    padding: 2px 8px 2px 7px;
    display: inline-block;
    margin-right: 4px;
    font-weight: 500;
}
@media (max-width:700px) {
    .forum-main-block { max-width: 99vw; padding: 10vw 2vw 10vw 2vw;}
    .forum-title { font-size: 1.3em; }
    .forum-link { font-size: 1.03em;}
    .forum-meta { font-size: 0.92em;}
}
.forum-post-block {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 6px 32px #e9e9fa33;
    padding: 34px 22px;
    margin-bottom: 36px;
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
}
.forum-post-title { font-size: 1.7em; margin-bottom: 7px; color: #1e5786; }
.forum-post-meta { color: #7b8a99; margin-bottom: 14px; font-size:1.04em; }
.forum-post-question {
    background: #f7fafc; border-radius: 10px; padding: 16px 13px 11px 15px;
    color: #274552; font-size: 1.15em; margin-bottom: 22px;
}
.forum-comments-block { margin-top: 34px; }
.forum-comments-block h3 { font-size:1.17em; color:#0a516f; margin-bottom:13px; }
.forum-comment {
    margin-bottom: 19px;
    padding: 12px 14px 10px 14px;
    background: #f4f8fd;
    border-radius: 9px;
    box-shadow: 0 1px 6px #bbe8ff22;
}
.forum-comment-nick { color:#2275b9; font-weight:600; margin-right:12px; }
.forum-comment-reply { color:#7a8897; font-size:0.96em; margin-left:7px; }
.forum-comment-text { margin-top:4px; color:#2b3b4e; font-size:1.04em; }
.forum-no-comments { color: #7b8a99; font-style: italic; }
.forum-error { color: #b50000; font-weight: bold; padding:22px; text-align:center;}
.post-card {
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 8px 40px #37a6d814;
    max-width: 760px;
    margin: 42px auto 34px auto;
    padding: 34px 26px 18px 26px;
    position: relative;
    animation: fadein .8s;
}
@keyframes fadein { from { opacity: 0; transform: translateY(30px);} to { opacity:1; transform:none;} }

.post-head {
    display: flex; align-items: center; margin-bottom: 11px;
}
.post-avatar {
    width: 54px; height: 54px;
    background: linear-gradient(120deg, #34d8bf 10%, #31a3ff 85%);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 2.2em; color: #fff; font-weight: 900; box-shadow: 0 3px 22px #57e5ee23;
    margin-right: 15px;
}
.post-meta { display: flex; flex-direction: column; gap:3px; font-size: 1.03em; }
.post-author { color: #2377bb; font-weight: bold;}
.post-date, .post-views { color:#789; font-size:0.97em; margin-left:0; }
.post-views { display: inline-flex; align-items: center; gap:3px; margin-top:3px;}
.post-title { font-size: 1.75em; margin: 13px 0 9px 0; color: #11325b; font-weight:900;}
.post-question {
    padding: 19px 17px 13px 20px;
    background: linear-gradient(120deg, #eefaff 70%, #f1f9f7 100%);
    color: #233d56;
    border-radius: 13px;
    font-size: 1.22em;
    margin-bottom: 27px;
    box-shadow: 0 2px 16px #49cbe216;
}

.forum-comments-block { margin: 38px 0 8px 0; }
.forum-comments-block h3 { color: #1479c8; font-size:1.14em; margin-bottom:18px;}
.comments-count { color:#fff; background:#13bb99; border-radius:9px; padding:0 10px 1px 10px; margin-left:8px;}

.comments-level-0 { }
.comments-level-1 { margin-left:35px; }
.comments-level-2 { margin-left:70px; }
.comments-level-3 { margin-left:100px; }
.comment-card {
    display: flex; align-items: flex-start; margin-bottom:18px; padding:12px 13px;
    background: #f7fbfd; border-radius:11px; box-shadow: 0 2px 14px #6cecff12;
    transition: box-shadow .17s;
    position: relative;
}
.comment-card:hover { box-shadow: 0 8px 30px #41a5e916; }
.comment-avatar {
    width: 36px; height: 36px; border-radius: 50%;
    background: linear-gradient(120deg, #16d7aa 60%, #23b6ef 100%);
    color: #fff; font-size:1.21em; font-weight:900;
    display:flex;align-items:center;justify-content:center; margin-right:11px;
}
.comment-body { flex:1; }
.comment-meta { display:flex;align-items:center; gap:10px;}
.comment-author { font-weight:600; color: #269;}
.comment-reply-btn {
    background: linear-gradient(90deg, #0dd0a0 60%, #18b3e9 100%);
    color:#fff; border:none; border-radius:8px;
    font-size:0.98em; padding:3px 17px 3px 14px; margin-left:8px;
    cursor:pointer; transition:background .13s; box-shadow: 0 2px 8px #7ffcff13;
}
.comment-reply-btn:hover { background:linear-gradient(90deg, #1ce2a1 60%, #49aef7 100%);}
.comment-text { margin-top:3px; color:#21383a; font-size:1.06em; }
.forum-no-comments { color:#a7b6c1; font-style:italic; margin-top:21px;}

.forum-error { color:#d80000; font-weight:bold; padding:23px; background:#f9eaea; border-radius:11px; text-align:center; font-size:1.24em; }

.post-card {
    max-width: 820px;
    margin: 32px auto 24px auto;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 4px 32px #b7ecff25;
    padding: 40px 36px 34px 36px;
    min-height: 200px;
    font-size: 1.12em;
}
.post-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}
.post-avatar {
    width: 52px; height: 52px; background: linear-gradient(120deg, #3ae7c7 30%, #4d7fff 100%);
    color: #fff; border-radius: 100%; font-size: 2em; display: flex; align-items: center; justify-content: center; font-weight: 700; box-shadow: 0 1px 8px #17b8f955;
}
.post-meta {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.post-author { color: #1575d1; font-weight: bold; font-size: 1.08em; }
.post-date, .post-views { color: #7294b7; font-size: 0.98em; margin-left: 8px; }
.post-title {
    font-size: 1.45em;
    margin: 16px 0 18px 0;
    color: #1a263a;
    font-weight: bold;
    letter-spacing: 0.01em;
}
.post-question { color: #0f383b; margin-bottom: 32px; font-size: 1.08em; }
.forum-comments-block { margin-top: 48px; }
.forum-comments-block h3 { color: #1686d1; font-size: 1.13em; margin-bottom: 16px; }
.comments-level { margin-left: 0; }
.comments-level-1 { margin-left: 36px; }
.comments-level-2 { margin-left: 54px; }
.comment-card {
    display: flex;
    gap: 14px;
    background: #f8fbfe;
    border-radius: 12px;
    box-shadow: 0 1px 8px #c1e8ff15;
    margin-bottom: 12px;
    padding: 14px 17px 14px 12px;
}
.comment-avatar {
    width: 36px; height: 36px;
    background: linear-gradient(90deg, #42dfc5 10%, #3683ff 100%);
    color: #fff; border-radius: 50%; font-size: 1.29em; font-weight: bold;
    display: flex; align-items: center; justify-content: center; margin-top: 2px;
}
.comment-body { flex: 1; }
.comment-meta { font-size: 1em; color: #2a6d87; margin-bottom: 4px; display: flex; align-items: center; gap: 12px; }
.comment-author { font-weight: bold; }
.comment-text { color: #0d2527; font-size: 1.07em; }
.comment-reply-btn {
    background: none; border: none; color: #2398fa;
    font-size: 0.98em; cursor: pointer; margin-left: 11px; padding: 3px 10px; border-radius: 6px;
    transition: background .14s;
}
.comment-reply-btn:hover { background: #eaf6ff; }
.forum-no-comments { color: #868e99; font-size: 1.08em; margin: 28px 0; text-align: center; }
.forum-error { color: #e10015; background: #fff2f2; border-radius: 10px; padding: 34px 18px; margin: 40px auto; text-align: center; font-size: 1.23em; }
@media (max-width:700px) {
    .post-card { padding: 18px 8vw 14vw 8vw; }
    .comment-card { flex-direction: column; }
}
/* Форум: пагинация */
.forum-pagination {
    margin: 32px 0 8px 0;
    text-align: center;
    font-size: 1.1em;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
}

.forum-page-btn,
.forum-page-current {
    display: inline-block;
    min-width: 36px;
    padding: 7px 12px;
    margin: 2px;
    border-radius: 8px;
    background: #f4f7fa;
    color: #2d3c55;
    text-decoration: none;
    font-weight: 500;
    transition: background 0.18s, color 0.18s, box-shadow 0.16s;
    border: 1px solid #e3e9ef;
    box-shadow: 0 2px 6px 0 #2d3c550c;
    cursor: pointer;
}

.forum-page-btn:hover {
    background: #e2edff;
    color: #004fa3;
    border-color: #aac8f5;
}

.forum-page-current {
    background: #2d7af0;
    color: #fff;
    font-weight: 700;
    cursor: default;
    border-color: #1a5ad9;
    box-shadow: 0 2px 6px 0 #1a5ad930;
}

@media (max-width: 600px) {
    .forum-pagination {
        font-size: 1em;
        gap: 2px;
    }
    .forum-page-btn,
    .forum-page-current {
        min-width: 28px;
        padding: 6px 6px;
        margin: 1px;
        font-size: 0.95em;
    }
}
/* ==== FORUM INFORMER ==== */
.forum-informer-block {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    box-shadow: 0 1px 8px 0 #0001;
    padding: 18px 18px 12px 18px;
    margin-bottom: 20px;
    max-width: 420px;
    font-family: inherit;
    transition: box-shadow .2s;
}
.forum-informer-block:hover {
    box-shadow: 0 4px 16px 0 #0002;
}
.forum-informer-title {
    font-size: 1.17em;
    font-weight: 600;
    margin-bottom: 12px;
    letter-spacing: 0.01em;
    color: #283548;
    display: flex;
    align-items: center;
    gap: 7px;
}
.forum-informer-list {
    list-style: none;
    margin: 0 0 8px 0;
    padding: 0;
}
.forum-informer-list li {
    margin-bottom: 7px;
    padding-bottom: 7px;
    border-bottom: 1px dashed #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1em;
}
.forum-informer-list li:last-child {
    border-bottom: none;
}
.forum-informer-list a {
    color: #2067c7;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.14s;
    max-width: 78%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}
.forum-informer-list a:hover {
    color: #0e376e;
    text-decoration: underline;
}
.forum-informer-meta {
    color: #74809d;
    font-size: 0.96em;
    min-width: 45px;
    text-align: right;
    margin-left: 10px;
}
.forum-informer-more {
    display: inline-block;
    margin-top: 8px;
    color: #466ad5;
    font-size: 0.98em;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: .03em;
    transition: color 0.15s;
}
.forum-informer-more:hover {
    color: #253e76;
    text-decoration: underline;
}

/* Адаптивность */
@media (max-width: 600px) {
    .forum-informer-block {
        max-width: 100%;
        padding: 14px 7px 7px 11px;
    }
    .forum-informer-title { font-size: 1.04em; }
    .forum-informer-list li {
        font-size: 0.99em;
    }
}
.forum-informer-row {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 30px;
    align-items: flex-start;
}

.forum-informer-block {
    flex: 1 1 320px;  /* минимум ширины, гибко растягивается */
    max-width: 420px;
    min-width: 0;
}

/* Для мобильных — блоки друг под другом */
@media (max-width: 900px) {
    .forum-informer-row {
        flex-direction: column;
        gap: 16px;
    }
    .forum-informer-block {
        max-width: 100%;
    }
}
.forum-related-block {
    margin: 32px 0 0 0;
    padding: 20px;
    background: #f8fafc;
    border-radius: 12px;
    box-shadow: 0 2px 8px #dde5ee30;
}
.forum-related-block h3 {
    font-size: 1.1em;
    margin-bottom: 8px;
    color: #475569;
}
.forum-related-list {
    list-style: disc inside;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 28px;
}
.forum-related-list li {
    margin: 0;
}
.forum-related-list a {
    color: #3175d1;
    text-decoration: underline;
    transition: color .2s;
}
.forum-related-list a:hover {
    color: #0d466e;
}