/* nadomu.kiev.ua — страница кодов ошибок. Палитра сайта: синий #0467ba, жёлтый #ffc700. */
.kd-pick,.kd-how,.kd-list{padding:34px 0}
.kd-pick{padding-top:18px}
.kd-lead{font-size:16px;line-height:1.75;color:#3d3d3d;max-width:900px;margin:0 0 18px}
.kd-h2{font-size:28px;line-height:1.2;font-weight:700;color:#00101d;margin:0 0 18px}

/* ─── выбор бренда ─── */
.kd-brands{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.kd-brand{appearance:none;border:1.5px solid #cbe2f5;background:#fff;color:#0467ba;
  font:600 14px/1 inherit;padding:10px 16px;border-radius:22px;cursor:pointer;transition:.2s}
.kd-brand:hover{border-color:#0467ba}
.kd-brand.is-on{background:#0467ba;border-color:#0467ba;color:#fff}
.kd-pick__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px}
.kd-pick__t{font-size:19px;font-weight:700;color:#00101d}
.kd-pick__all{font-size:14px;font-weight:600;color:#0467ba;white-space:nowrap}
.kd-hint{font-size:13.5px;color:#6b747c;margin:4px 0 12px}
.kd-tiles{display:flex;flex-wrap:wrap;gap:8px}
.kd-tile{appearance:none;border:1.5px solid #ffc700;background:#fff;color:#00101d;
  font:700 14px/1 inherit;padding:9px 14px;border-radius:8px;cursor:pointer;transition:.2s}
.kd-tile:hover{background:#ffc700}

/* ─── карточки «как читать код» ─── */
.kd-how__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kd-card{background:#fff;border:1px solid #e5e5e5;border-radius:10px;padding:20px}
.kd-card__n{display:flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;background:#ffc700;color:#00101d;font-weight:700;font-size:14px;margin-bottom:10px}
.kd-card h3{font-size:16px;font-weight:700;color:#00101d;margin:0 0 6px;line-height:1.3}
.kd-card p{font-size:14px;color:#6b747c;line-height:1.7;margin:0}

/* ─── таблицы кодов ─── */
.kd-sec{margin-bottom:38px;scroll-margin-top:90px}
.kd-sec__h{font-size:24px;line-height:1.25;font-weight:700;color:#00101d;margin:0 0 8px}
.kd-sec__i{font-size:14.5px;color:#6b747c;line-height:1.8;max-width:900px;margin:0 0 14px}
.kd-tbl__wrap{background:#fff;border:1px solid #e5e5e5;border-radius:10px;overflow:hidden}
.kd-tbl{width:100%;border-collapse:collapse;font-size:14px}
.kd-tbl th{background:#0467ba;color:#fff;text-align:left;font-size:12px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;padding:12px 14px}
.kd-tbl td{padding:12px 14px;border-top:1px solid #e5e5e5;vertical-align:top;color:#3d3d3d;line-height:1.6}
.kd-tbl tr{scroll-margin-top:110px}
.kd-tbl .kd-c{font-weight:700;color:#0467ba;white-space:nowrap;font-size:15px}
.kd-tbl .kd-m{color:#00101d;font-weight:600}
.kd-tbl .kd-p{min-width:120px;font-weight:700;color:#00101d;white-space:nowrap}
.kd-tbl tr.is-hl td{background:#ffeeb1;animation:kdFlash 1.1s ease-in-out 2}
.kd-tbl tr.is-hl td:first-child{box-shadow:inset 4px 0 0 #ffc700}
@keyframes kdFlash{0%,100%{background:#ffeeb1}50%{background:#ffe07a}}
.kd-note{font-size:13px;color:#6b747c;margin:-16px 0 32px}

/* ─── блок про узел ─── */
.kd-why{background:#0467ba;color:#fff;border-radius:14px;padding:30px 32px;margin-bottom:38px}
.kd-why h2{font-size:24px;font-weight:700;margin:0 0 12px;color:#fff}
.kd-why p{font-size:15px;line-height:1.8;color:rgba(255,255,255,.88);margin:0;max-width:900px}
.kd-why p+p{margin-top:10px}

/* ─── FAQ ─── */
.kd-faqs{display:grid;gap:10px;margin-bottom:24px}
.kd-faq{background:#fff;border:1px solid #e5e5e5;border-radius:10px}
.kd-faq summary{padding:16px 52px 16px 20px;font-size:16px;font-weight:700;color:#00101d;
  cursor:pointer;list-style:none;position:relative}
.kd-faq summary::-webkit-details-marker{display:none}
.kd-faq summary::after{content:'+';position:absolute;right:20px;top:50%;transform:translateY(-50%);
  font-size:22px;font-weight:700;color:#0467ba}
.kd-faq[open] summary::after{content:'\2212'}
.kd-faq p{padding:0 20px 18px;font-size:14.5px;color:#6b747c;line-height:1.8;margin:0}
.kd-svc{font-size:15px;font-weight:600}
.kd-svc a{color:#0467ba}

@media (max-width:1199px){.kd-how__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){
  .kd-h2{font-size:22px}
  .kd-sec__h{font-size:19px}
  .kd-how__grid{grid-template-columns:1fr}
  .kd-why{padding:22px 20px}
  .kd-why h2{font-size:20px}
  /* таблица превращается в карточки: подписи колонок берутся из data-label */
  .kd-tbl thead{display:none}
  .kd-tbl,.kd-tbl tbody,.kd-tbl tr,.kd-tbl td{display:block;width:auto}
  .kd-tbl tr{border-top:1px solid #e5e5e5;padding:6px 0}
  .kd-tbl tr:first-child{border-top:0}
  .kd-tbl td{border:0;padding:6px 14px}
  .kd-tbl td::before{content:attr(data-label);display:block;font-size:11px;font-weight:700;
    letter-spacing:.04em;text-transform:uppercase;color:#6b747c;margin-bottom:2px}
  .kd-tbl .kd-c::before{display:none}
  .kd-tbl .kd-c{font-size:17px;padding-bottom:0}
}