/* ============================================================
   ИЖПЛАСТЭКО — стили для контентных страниц
   (гео-посадочные /truba-pnd-<город> + база знаний /baza-znaniy)
   Использует переменные из style.css (--color-*). Подключается только
   на новых страницах, существующие не трогает.
   ============================================================ */

/* ---- Лёгкий герой контентной страницы (без формы, светлый) ---- */
.page-hero{
  background:linear-gradient(135deg,var(--color-dark),var(--color-navy));
  color:#fff;padding:38px 0 42px;
}
.page-hero .page-hero-kicker{
  display:inline-block;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
  color:var(--color-blue-sec);font-weight:700;margin-bottom:10px;
}
.page-hero h1{font-size:2rem;line-height:1.18;margin:0 0 14px;color:#fff;}
.page-hero .page-hero-lead{font-size:1.05rem;line-height:1.6;color:rgba(255,255,255,.82);max-width:760px;margin:0 0 20px;}
.page-hero .hero-chips{margin-bottom:20px;}
.page-hero .btn-call{box-shadow:0 6px 18px rgba(0,0,0,.25);}
@media(max-width:640px){.page-hero h1{font-size:1.55rem;}}

/* ---- Хлебные крошки на тёмном герое (доп. к .breadcrumb) ---- */
.page-hero .breadcrumb{margin-bottom:16px;}
.page-hero .breadcrumb a{color:rgba(255,255,255,.7);}
.page-hero .breadcrumb a:hover{color:#fff;}
.page-hero .breadcrumb span{color:rgba(255,255,255,.5);}

/* ---- Универсальная секция ---- */
.content-section{padding:46px 0;}
.content-section.alt{background:var(--color-bg);}

/* ---- Сетка карточек ---- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:24px;}
.card{
  background:var(--color-white);border:1px solid var(--color-border);border-radius:12px;
  padding:22px 22px 20px;transition:box-shadow .2s,transform .2s;
}
.card:hover{box-shadow:0 10px 28px rgba(26,39,68,.10);transform:translateY(-2px);}
.card .card-ico{font-size:1.4rem;color:var(--color-cyan);margin-bottom:10px;}
.card h3{font-size:1.08rem;margin:0 0 8px;color:var(--color-text);}
.card p{font-size:.93rem;line-height:1.55;color:var(--color-text-muted);margin:0;}
.card a.card-link{display:inline-block;margin-top:12px;font-weight:600;color:var(--color-cyan);}
.card a.card-link:hover{color:var(--color-cyan-hov);}

/* ---- Карточки регионов (с городом + телефоном) ---- */
.region-card{display:flex;flex-direction:column;}
.region-card .rc-city{font-size:1.15rem;font-weight:700;color:var(--color-text);}
.region-card .rc-region{font-size:.85rem;color:var(--color-text-muted);margin-bottom:10px;}
.region-card .rc-phone{font-weight:700;color:var(--color-cyan);font-size:1rem;}
.region-card .rc-meta{font-size:.85rem;color:var(--color-text-muted);margin-top:6px;}

/* ---- Информационные врезки ---- */
.callout{
  border-left:4px solid var(--color-cyan);background:var(--color-cyan-lt);
  padding:16px 18px;border-radius:0 10px 10px 0;margin:22px 0;font-size:.96rem;line-height:1.6;
}
.callout.warn{border-left-color:var(--color-orange);background:rgba(0,119,182,.07);}
.callout strong{color:var(--color-text);}

/* ---- FAQ (нативный аккордеон) ---- */
.faq{margin-top:22px;}
.faq details{
  background:var(--color-white);border:1px solid var(--color-border);border-radius:10px;
  margin-bottom:12px;padding:0 18px;
}
.faq summary{
  cursor:pointer;font-weight:600;padding:16px 0;list-style:none;color:var(--color-text);
  display:flex;justify-content:space-between;align-items:center;gap:12px;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-size:1.4rem;color:var(--color-cyan);font-weight:400;}
.faq details[open] summary::after{content:"\2212";}
.faq details[open] summary{border-bottom:1px solid var(--color-border);}
.faq .faq-a{padding:14px 0 18px;font-size:.95rem;line-height:1.65;color:var(--color-text-muted);}

/* ---- Типографика статьи базы знаний ---- */
.article{max-width:800px;margin:0 auto;}
.article p{font-size:1.02rem;line-height:1.75;color:var(--color-text);margin:0 0 18px;}
.article h2{font-size:1.5rem;margin:36px 0 14px;color:var(--color-text);}
.article h3{font-size:1.2rem;margin:26px 0 10px;color:var(--color-text);}
.article ul,.article ol{margin:0 0 18px;padding-left:22px;line-height:1.7;}
.article li{margin-bottom:8px;}
.article table{width:100%;border-collapse:collapse;margin:20px 0;font-size:.93rem;}
.article th,.article td{border:1px solid var(--color-border);padding:10px 12px;text-align:left;}
.article th{background:var(--color-bg-2);font-weight:700;}
.article img{max-width:100%;border-radius:10px;}

/* ---- Оглавление ---- */
.toc{background:var(--color-bg);border:1px solid var(--color-border);border-radius:10px;padding:18px 22px;margin:0 0 28px;}
.toc strong{display:block;margin-bottom:10px;}
.toc ol{margin:0;padding-left:20px;}
.toc a{color:var(--color-cyan);}
.toc a:hover{color:var(--color-cyan-hov);}

/* ---- Блок «Похожее / связанные ссылки» (перелинковка) ---- */
.related{background:var(--color-bg);border-radius:12px;padding:24px;margin-top:36px;}
.related h3{margin:0 0 14px;font-size:1.15rem;}
.related ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px 26px;}
.related li{padding:0;}
.related a{display:flex;gap:8px;align-items:baseline;color:var(--color-cyan);font-weight:500;line-height:1.45;}
.related a:hover{color:var(--color-cyan-hov);}
.related a::before{content:"\2192";color:var(--color-blue-sec);}

/* ---- Перечень статей в хабе базы знаний ---- */
.kb-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin-top:24px;}
.kb-item{
  background:var(--color-white);border:1px solid var(--color-border);border-radius:12px;
  padding:22px;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s;
}
.kb-item:hover{box-shadow:0 10px 28px rgba(26,39,68,.10);transform:translateY(-2px);}
.kb-item .kb-cat{font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;color:var(--color-blue-sec);font-weight:700;margin-bottom:8px;}
.kb-item h3{font-size:1.12rem;margin:0 0 8px;line-height:1.35;}
.kb-item h3 a{color:var(--color-text);}
.kb-item h3 a:hover{color:var(--color-cyan);}
.kb-item p{font-size:.92rem;color:var(--color-text-muted);line-height:1.55;margin:0 0 14px;flex-grow:1;}
.kb-item .kb-more{font-weight:600;color:var(--color-cyan);font-size:.92rem;}

/* ---- Местные «якоря доверия» на гео-странице ---- */
.trust-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px;}
.trust-row .trust-item{display:flex;align-items:center;gap:10px;background:var(--color-white);border:1px solid var(--color-border);border-radius:10px;padding:12px 16px;font-size:.92rem;font-weight:500;}
.trust-row .trust-item i{color:var(--color-cyan);font-size:1.1rem;}