.page--blog { background:#f5f7f6; color:#16201b; }
.page--blog .header { background:#fff; }
.page--blog .header__nav > a.is-active { color:#16934b; }
.blog-kicker { color:#16934b; font-size:.84rem; line-height:1.3; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.blog-hero { position:relative; overflow:hidden; background:#0b1711; color:#fff; padding:78px 0 82px; }
.blog-hero::before { content:""; position:absolute; inset:auto -8% -70% 40%; height:560px; background:radial-gradient(circle,rgba(30,180,90,.28),transparent 65%); }
.blog-hero__grid { display:grid; grid-template-columns:minmax(0,1fr) 410px; align-items:center; gap:70px; }
.blog-hero h1 { max-width:850px; margin:16px 0 24px; font-size:clamp(2.8rem,5.1vw,5.7rem); line-height:.98; letter-spacing:-.065em; }
.blog-hero p { max-width:690px; margin:0; color:rgba(255,255,255,.68); font-size:1.13rem; line-height:1.7; }
.blog-hero__visual { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-height:300px; border:1px solid rgba(255,255,255,.14); border-radius:30px; padding:28px; background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.02)); }
.blog-hero__visual strong { position:relative; z-index:1; align-self:flex-end; color:#35d174; font-size:6rem; line-height:1; letter-spacing:-.08em; }
.blog-hero__visual div { position:relative; z-index:1; display:grid; gap:10px; }
.blog-hero__visual div span { display:flex; align-items:center; gap:9px; color:rgba(255,255,255,.75); font-weight:650; }
.blog-hero__visual div span::before { content:""; width:7px; height:7px; border-radius:50%; background:#35d174; }
.blog-hero__shape { position:absolute; border-radius:50%; }
.blog-hero__shape--one { width:180px; height:180px; top:40px; left:35px; background:#1eb45a; opacity:.23; }
.blog-hero__shape--two { width:95px; height:95px; top:98px; left:95px; border:18px solid rgba(255,255,255,.12); }
.blog-catalog { padding:58px 0 100px; }
.blog-filters { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:38px; }
.blog-filters { scrollbar-width:none; }
.blog-filters::-webkit-scrollbar { display:none; }
.blog-filters a { display:flex; align-items:center; gap:8px; min-height:44px; padding:10px 17px; border:1px solid #dce4df; border-radius:999px; background:#fff; color:#445049; font-size:.94rem; font-weight:700; transition:.2s ease; }
.blog-filters a:hover,.blog-filters a.is-active { color:#fff; border-color:#16934b; background:#16934b; transform:translateY(-1px); }
.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.article-card { overflow:hidden; display:flex; flex-direction:column; min-width:0; border:1px solid #e1e7e3; border-radius:24px; background:#fff; transition:transform .25s ease,box-shadow .25s ease; }
.article-card:hover { transform:translateY(-4px); box-shadow:0 20px 50px rgba(12,40,24,.1); }
.article-card__visual { position:relative; display:block; height:220px; overflow:hidden; background:linear-gradient(135deg,#103b25,#1eb45a); }
.article-card:nth-child(3n+2) .article-card__visual { background:linear-gradient(135deg,#142b42,#1b7f8d); }
.article-card:nth-child(3n+3) .article-card__visual { background:linear-gradient(135deg,#3f2b17,#bd7630); }
.article-card__visual img { width:100%; height:100%; object-fit:cover; }
.article-card__icon { position:absolute; left:26px; bottom:20px; color:#fff; font-size:6rem; line-height:1; opacity:.86; }
.article-card__number { position:absolute; top:20px; right:24px; color:rgba(255,255,255,.82); font-size:1.1rem; font-weight:800; }
.article-card__body { display:flex; flex:1; flex-direction:column; padding:27px 27px 29px; }
.article-card__meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-bottom:15px; color:#78827c; font-size:.84rem; font-weight:700; }
.article-card__meta span { color:#16934b; }
.article-card h2 { margin:0 0 13px; font-size:1.34rem; line-height:1.28; letter-spacing:-.025em; }
.article-card h2 a { color:#142019; }
.article-card p { margin:0 0 22px; color:#606b64; font-size:.96rem; line-height:1.65; }
.article-card__more { display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:19px; border-top:1px solid #edf0ee; color:#16201b; font-size:.92rem; font-weight:800; }
.article-card__more span { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; color:#fff; background:#1eb45a; }
.blog-empty { padding:60px; border-radius:24px; background:#fff; text-align:center; }
.blog-empty h2 { margin:0 0 12px; font-size:1.7rem; }
.blog-empty p { color:#66716a; }
.blog-pagination { display:flex; justify-content:center; gap:8px; margin-top:38px; }
.blog-pagination a { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:#fff; color:#303b34; font-weight:800; }
.blog-pagination a.is-active { color:#fff; background:#16934b; }
.blog-breadcrumb { padding:22px 0; background:#fff; border-top:1px solid #edf0ee; }
.blog-breadcrumb .wrap { display:flex; align-items:center; gap:10px; overflow:hidden; white-space:nowrap; color:#8a938e; font-size:.85rem; }
.blog-breadcrumb a { color:#58635c; }
.blog-breadcrumb span:last-child { overflow:hidden; text-overflow:ellipsis; }
.article-head { padding:66px 0 72px; background:#fff; }
.article-head__inner { max-width:990px; }
.article-head__tags { display:flex; flex-wrap:wrap; gap:8px; }
.article-head__tags a { padding:8px 13px; border-radius:999px; color:#147e42; background:#e8f7ee; font-size:.85rem; font-weight:800; }
.article-head h1 { margin:22px 0 22px; font-size:clamp(2.4rem,5.2vw,5.1rem); line-height:1.02; letter-spacing:-.058em; }
.article-head__lead { max-width:820px; margin:0; color:#5a655e; font-size:1.18rem; line-height:1.7; }
.article-head__meta { display:flex; flex-wrap:wrap; gap:10px 24px; margin-top:30px; color:#7a847e; font-size:.88rem; font-weight:650; }
.article-cover { overflow:hidden; margin-top:42px; margin-bottom:0; border-radius:28px; background:#dfe8e2; aspect-ratio:1200/630; }
.article-cover img { display:block; width:100%; height:100%; object-fit:cover; }
.article-layout { display:grid; grid-template-columns:260px minmax(0,760px); justify-content:center; align-items:start; gap:64px; padding-top:62px; padding-bottom:95px; }
.article-aside { position:sticky; top:92px; display:grid; gap:18px; }
.article-toc { padding:22px; border:1px solid #dde5e0; border-radius:19px; background:#fff; }
.article-toc__toggle { display:flex; justify-content:space-between; width:100%; padding:0; border:0; background:none; color:#16201b; font:800 .96rem/1.4 Manrope,sans-serif; cursor:pointer; }
.article-toc__toggle span { color:#16934b; }
.article-toc ol { display:grid; gap:11px; margin:18px 0 0; padding:17px 0 0; border-top:1px solid #e9eeeb; list-style:none; }
.article-toc.is-closed ol { display:none; }
.article-toc li { line-height:1.35; }
.article-toc li.is-sub { padding-left:13px; }
.article-toc a { color:#68736c; font-size:.82rem; font-weight:650; }
.article-toc a:hover,.article-toc a.is-active { color:#16934b; }
.article-service-link { display:grid; gap:5px; padding:21px; border-radius:19px; color:#fff; background:#102419; }
.article-service-link span { color:rgba(255,255,255,.6); font-size:.79rem; }
.article-service-link strong { font-size:.95rem; line-height:1.4; }
.article-service-link em { margin-top:8px; color:#4ade80; font-size:.82rem; font-style:normal; font-weight:800; }
.article-content { min-width:0; color:#2b352f; font-size:1.05rem; line-height:1.82; }
.article-content > *:first-child { margin-top:0; }
.article-content h2,.article-content h3 { scroll-margin-top:100px; color:#142019; letter-spacing:-.035em; }
.article-content h2 { margin:58px 0 20px; font-size:2.05rem; line-height:1.18; }
.article-content h3 { margin:38px 0 14px; font-size:1.34rem; line-height:1.3; }
.article-content p { margin:0 0 21px; }
.article-content ul,.article-content ol { margin:0 0 26px; padding-left:1.3em; }
.article-content li { margin:9px 0; padding-left:6px; }
.article-content a:not(.article-help a) { color:#147e42; text-decoration:underline; text-underline-offset:3px; }
.article-content blockquote { margin:30px 0; padding:22px 25px; border-left:4px solid #1eb45a; border-radius:0 14px 14px 0; background:#edf8f1; color:#304237; }
.article-content__note { margin-bottom:40px; padding:25px 28px; border-radius:18px; background:#102419; color:#fff; }
.article-content__note strong { display:block; margin-bottom:8px; color:#4ade80; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; }
.article-content__note p { margin:0; color:rgba(255,255,255,.78); }
.article-help { display:grid; grid-template-columns:1fr .9fr; gap:42px; margin:70px 0 0; padding:48px; border-radius:28px; background:#0d1e14; color:#fff; }
.article-help h2 { margin:10px 0 14px; color:#fff; font-size:2.1rem; }
.article-help p { color:rgba(255,255,255,.66); font-size:.96rem; line-height:1.7; }
.article-help > div > a { display:block; color:#fff; font-size:1.45rem; font-weight:800; text-decoration:none; }
.article-help > div > small { color:rgba(255,255,255,.5); }
.article-form { display:grid; gap:13px; }
.article-form label { display:grid; gap:6px; color:rgba(255,255,255,.72); font-size:.78rem; font-weight:700; }
.article-form input,.article-form textarea { width:100%; border:1px solid rgba(255,255,255,.14); border-radius:11px; outline:none; padding:13px 14px; background:rgba(255,255,255,.08); color:#fff; font:500 .9rem/1.45 Manrope,sans-serif; resize:vertical; }
.article-form input:focus,.article-form textarea:focus { border-color:#4ade80; }
.article-form button { display:flex; justify-content:space-between; align-items:center; min-height:50px; border:0; border-radius:11px; padding:0 17px; color:#fff; background:#1eb45a; font:800 .91rem/1 Manrope,sans-serif; cursor:pointer; }
.article-form button:disabled { opacity:.58; cursor:wait; }
.article-form > small { color:rgba(255,255,255,.43); font-size:.69rem; line-height:1.55; }
.article-form > small a { color:rgba(255,255,255,.75); }
.article-form__status { min-height:0; margin:0!important; color:rgba(255,255,255,.72); font-size:.78rem!important; }
.article-form__status:empty { display:none; }
.article-form__status.is-success { color:#6ee7a0; }
.article-form__status.is-error { color:#fca5a5; }
.article-faq { margin-top:75px; }
.article-faq > h2 { margin-top:10px; }
.article-faq details { border-top:1px solid #dce4df; }
.article-faq details:last-child { border-bottom:1px solid #dce4df; }
.article-faq summary { display:flex; justify-content:space-between; gap:25px; padding:21px 0; color:#1a241e; font-size:1rem; font-weight:800; line-height:1.45; cursor:pointer; list-style:none; }
.article-faq summary::-webkit-details-marker { display:none; }
.article-faq summary span { color:#16934b; font-size:1.4rem; transition:transform .2s; }
.article-faq details[open] summary span { transform:rotate(45deg); }
.article-faq details div { padding:0 40px 22px 0; color:#68736c; font-size:.95rem; line-height:1.7; }
.related-articles { padding:85px 0 100px; background:#fff; }
.related-articles__head { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:34px; }
.related-articles__head h2 { margin:9px 0 0; font-size:2.7rem; letter-spacing:-.045em; }
.related-articles__head > a { color:#16934b; font-weight:800; }
.related-articles__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.related-articles__grid article { display:flex; flex-direction:column; min-height:260px; padding:27px; border-radius:20px; background:#f2f6f3; }
.related-articles__grid article > span { color:#1eb45a; font-size:.85rem; font-weight:800; }
.related-articles__grid h3 { margin:23px 0 12px; font-size:1.18rem; line-height:1.35; }
.related-articles__grid h3 a { color:#152019; }
.related-articles__grid p { margin:0 0 20px; color:#66716a; font-size:.88rem; line-height:1.6; }
.related-articles__grid article > a { margin-top:auto; color:#147e42; font-size:.85rem; font-weight:800; }
@media (max-width:1050px) {
  .blog-hero__grid { grid-template-columns:1fr 320px; gap:35px; }
  .article-layout { grid-template-columns:220px minmax(0,1fr); gap:35px; }
  .article-help { margin-left:0; margin-right:0; }
}
@media (max-width:820px) {
  .blog-hero { padding:58px 0; }
  .blog-hero__grid { grid-template-columns:1fr; }
  .blog-hero__visual { display:none; }
  .blog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .article-layout { display:block; padding-top:36px; }
  .article-aside { position:static; margin-bottom:34px; }
  .article-service-link { display:none; }
  .article-help { grid-template-columns:1fr; padding:34px; }
  .related-articles__grid { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .blog-hero h1 { font-size:2.72rem; }
  .blog-hero p { font-size:1rem; }
  .blog-catalog { padding-top:36px; }
  .blog-filters { flex-wrap:nowrap; overflow-x:auto; margin-right:-20px; padding-right:20px; }
  .blog-filters a { flex:0 0 auto; }
  .blog-grid { grid-template-columns:1fr; }
  .article-card__visual { height:180px; }
  .article-head { padding:44px 0 48px; }
  .article-cover { margin-top:24px; border-radius:18px; }
  .article-head h1 { font-size:2.5rem; }
  .article-head__lead { font-size:1rem; }
  .article-head__meta { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
  .article-content { font-size:1rem; line-height:1.76; }
  .article-content h2 { font-size:1.65rem; }
  .article-help { margin-top:50px; padding:27px 22px; border-radius:20px; }
  .article-help h2 { font-size:1.7rem; }
  .related-articles__head { align-items:start; }
  .related-articles__head h2 { font-size:2rem; }
}
