.c-index { margin-top: 24px; }
.c-index__group { margin-bottom: 24px; }
.c-index__group:last-child { margin-bottom: 0; }
.c-index__group h3 { margin: 0 0 12px; font-family: var(--label); font-size: 20px; line-height: 1.5; font-weight: 600; color: var(--muted); }
.c-index__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.c-index__link { position: relative; display: flex; flex-direction: column; min-height: 128px; padding: 20px 36px 20px 20px; border: 1px solid #d5cfc0; border-radius: 10px; background: #f6f1e6; color: var(--ink); text-decoration: none; }
.c-index__name { margin-bottom: 4px; font-size: 18px; font-weight: 650; line-height: 1.4; color: var(--deep-ink); }
.c-index__detail { font-size: 16px; line-height: 1.5; color: var(--muted); }
.c-index__arrow { position: absolute; right: 14px; top: 20px; font-size: 20px; line-height: 1.2; color: var(--blue-text); }
.c-index__link:hover { background: #edf5ff; border-color: #b5cce2; }
.c-index__group:nth-child(2) .c-index__link { background: #edf3e7; border-color: #cbdcc0; }
.c-index__group:nth-child(2) .c-index__link:hover { background: #e1efd7; }
.c-index__group:nth-child(3) .c-index__link { background: #edf5fa; border-color: #c5dce9; }
.c-index__group:nth-child(3) .c-index__link:hover { background: #deedf7; }
.c-index__group:nth-child(4) .c-index__link { background: #fbefed; border-color: #e8d6d1; }
.c-index__group:nth-child(4) .c-index__link:hover { background: #f7e4e0; }
@media (max-width: 600px) {
  .c-index__grid { grid-template-columns: 1fr; gap: 8px; }
  .c-index__link { min-height: 100px; padding: 16px 40px 16px 16px; }
  .c-index__arrow { top: 18px; right: 16px; }
}