/* /catalog — every design described in full */
.kv-catalog-page { max-width: 860px; }
.kv-catalog-hero { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,.06); margin-bottom: 20px; }
.kv-catalog-page h1 { font-size: 26px; line-height: 1.2; margin: 0 0 10px; }
.kv-catalog-hero h2 { font-size: 16px; margin: 18px 0 6px; color: #1a1a2e; }
.kv-catalog-hero p, .kv-catalog-hero li { font-size: 14px; }
.kv-catalog-hero a, .kv-catalog-index a { color: #137196; }
.kv-catalog-facts { margin: 0; padding-left: 18px; }
.kv-catalog-facts li { margin-bottom: 4px; }
.kv-catalog-index { margin: 0; font-size: 13px; line-height: 1.6; }
.kv-catalog-index dt { font-weight: 700; color: #1a1a2e; margin-top: 8px; }
.kv-catalog-index dd { margin: 0; color: #334155; }
.kv-catalog-data { font-size: 12px !important; color: #64748b; margin: 14px 0 0; }

.kv-catalog-list { list-style: none; margin: 0; padding: 0; }
.kv-design { background: #fff; border-radius: 12px; padding: 16px; margin: 0 0 14px; box-shadow: 0 1px 3px rgba(0,0,0,.05); scroll-margin-top: 80px; }
.kv-design article { display: flex; gap: 18px; align-items: flex-start; }
.kv-design-img { flex: 0 0 200px; width: 200px; height: auto; aspect-ratio: 1; object-fit: contain; background: #d4ec3a; border-radius: 10px; padding: 10px; box-sizing: border-box; }
.kv-design-body { flex: 1 1 auto; min-width: 0; }
.kv-catalog-page .kv-design h2 { font-size: 20px; margin: 0 0 8px; }
.kv-design-body p { font-size: 14px; margin: 0 0 8px; }
.kv-design-art { color: #475569 !important; }
.kv-design-for { margin-bottom: 2px !important; }
.kv-design-for-list { margin: 0 0 10px; padding-left: 18px; font-size: 14px; }
.kv-design-for-list li { line-height: 1.5; }
.kv-design-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px !important; color: #64748b !important; }
.kv-design-order { display: inline-block; font-size: 14px; font-weight: 700; color: #fff; background: #1a1a2e; padding: 8px 14px; border-radius: 8px; text-decoration: none; }
.kv-design-order:hover { background: #2d2d4a; }

@media (max-width: 600px) {
  .kv-design article { flex-direction: column; }
  .kv-design-img { flex-basis: auto; width: 100%; max-width: 260px; align-self: center; }
}