.kd-home {
  max-width: var(--kd-container);
  margin: 0 auto;
  padding: var(--kd-s5) var(--kd-s4) var(--kd-s6);
  color: var(--kd-ink);
  font-size: var(--kd-fs-md);
  line-height: 1.6;
}
.kd-home *, .kd-home *::before, .kd-home *::after { box-sizing: border-box; }
.kd-home ul { list-style: none; margin: 0; padding: 0; }
.kd-home a { color: inherit; text-decoration: none; }
.kd-home h1, .kd-home h2 { color: var(--kd-ink); line-height: 1.3; }

.kd-hero {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: var(--kd-s5);
  padding: var(--kd-s6);
  background: var(--kd-tint);
  border-radius: var(--kd-r-lg);
}
.kd-hero h1 { margin: 0 0 var(--kd-s2); font-size: var(--kd-fs-2xl); font-weight: 700; }
.kd-hero__main > p { margin: 0 0 var(--kd-s4); color: var(--kd-soft); }

.kd-chips { display: flex; flex-wrap: wrap; gap: var(--kd-s2); margin-top: var(--kd-s3) !important; }
.kd-chips a {
  display: inline-block;
  padding: 6px 14px;
  background: var(--kd-card);
  border: 1px solid var(--kd-line);
  border-radius: 999px;
  font-size: var(--kd-fs-sm);
}
.kd-chips a:hover { border-color: var(--kd-blue); color: var(--kd-blue); }

.kd-feature {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--kd-s5);
  padding: var(--kd-s5);
  background: var(--kd-blue);
  color: #fff !important;
  border-radius: var(--kd-r);
}
.kd-feature small { display: block; opacity: .85; font-size: var(--kd-fs-sm); }
.kd-feature strong { display: block; margin: var(--kd-s1) 0; font-size: var(--kd-fs-lg); line-height: 1.35; }
.kd-feature__cta {
  padding: var(--kd-s3) var(--kd-s4);
  background: #fff;
  color: var(--kd-blue);
  border-radius: var(--kd-r);
  font-weight: 700;
  font-size: var(--kd-fs-sm);
  text-align: center;
}
.kd-feature:hover .kd-feature__cta { background: var(--kd-tint); }

.kd-quick { margin-top: var(--kd-s5); }
.kd-quick ul { display: grid; grid-template-columns: repeat(6, 1fr); background: var(--kd-card); border: 1px solid var(--kd-line); border-radius: var(--kd-r); overflow: hidden; }
.kd-quick li + li { border-left: 1px solid var(--kd-line); }
.kd-quick a { display: block; padding: var(--kd-s4) var(--kd-s2); text-align: center; font-size: var(--kd-fs-sm); font-weight: 500; }
.kd-quick a:hover { background: var(--kd-bg); color: var(--kd-blue); }
.kd-quick__mark {
  display: grid;
  place-content: center;
  width: 36px;
  height: 36px;
  margin: 0 auto var(--kd-s2);
  background: var(--kd-tint);
  color: var(--kd-blue);
  border-radius: 50%;
  font-weight: 700;
}

.kd-body { display: grid; grid-template-columns: 1fr 330px; gap: var(--kd-s6); margin-top: var(--kd-s6); align-items: start; }
.kd-main section + section { margin-top: var(--kd-s6); }
.kd-main h2 { margin: 0 0 var(--kd-s3); padding-bottom: var(--kd-s2); border-bottom: 2px solid var(--kd-ink); font-size: var(--kd-fs-lg); }

.kd-shop li > a { display: grid; grid-template-columns: 56px 1fr; gap: var(--kd-s3); align-items: center; }
.kd-shop__img { width: 56px; height: 56px; background: var(--kd-tint); border-radius: var(--kd-r-sm); overflow: hidden; }
.kd-shop__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kd-shop__txt { display: grid; gap: var(--kd-s1); font-size: var(--kd-fs-xs); }
.kd-shop__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: var(--kd-fs-sm); line-height: 1.4; }
.kd-shop__txt b { font-size: var(--kd-fs-sm); }
.kd-sale { display: inline-block; padding: 1px 6px; background: var(--kd-sale); color: #fff; border-radius: var(--kd-r-sm); font-size: var(--kd-fs-xs); font-weight: 700; }

@media (max-width: 900px) {
  .kd-hero { grid-template-columns: 1fr; padding: var(--kd-s5); }
  .kd-body { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .kd-home { padding: var(--kd-s4) var(--kd-s3) var(--kd-s5); }
  .kd-hero h1 { font-size: var(--kd-fs-xl); }
  .kd-quick ul { grid-template-columns: repeat(3, 1fr); }
  .kd-quick li:nth-child(n+4) { border-top: 1px solid var(--kd-line); }
  .kd-quick li:nth-child(4) { border-left: 0; }
  .kd-table li { grid-template-columns: 56px 1fr; }
  .kd-table__aux { grid-column: 2; }
  .kd-search input[type="search"], .kd-search button { height: 44px; }
}
