/* LDSA shared design language (homepage 2026 system).
 * Tokens + directory v2 components. Enqueued only on pages using v2
 * renderers ([ldsa_exam_directory_v2]). The homepage staging page carries
 * its own inline copy of the shared rules until go-live consolidation.
 * Palette mirrors the Kadence theme tokens; change both together. */

.ldsa-dir2 {
  --ldsa-teal: #049f82;
  --ldsa-teal-dark: #038f75;
  --ldsa-green-deep: #13612e;
  --ldsa-ink: #222222;
  --ldsa-body: #454545;
  --ldsa-muted: #676767;
  --ldsa-faint: #999999;
  --ldsa-line: #eeeeee;
  font-size: 16px;
  color: var(--ldsa-body);
}
.ldsa-dir2 *, .ldsa-dir2 *::before, .ldsa-dir2 *::after { box-sizing: border-box; }
.ldsa-dir2 a { text-decoration: none; }

.ldsa-dir2-filter {
  width: 100%;
  max-width: 440px;
  padding: 12px 16px;
  border: 1px solid #cbd5e0;
  border-radius: 8px;
  font-size: 15px;
  margin-bottom: 10px;
}
.ldsa-dir2-filter:focus {
  outline: none;
  border-color: var(--ldsa-teal);
  box-shadow: 0 0 0 3px rgba(4, 159, 130, 0.15);
}

.ldsa-dir2-group { margin: 34px 0 0 0; scroll-margin-top: 96px; }
.ldsa-dir2-head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.ldsa-dir2-icon {
  width: 46px; height: 46px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.ldsa-dir2-headtext { flex-grow: 1; min-width: 0; }
.ldsa-dir2-kicker { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; }
.ldsa-dir2-head h2 {
  font-family: Montserrat, 'Trebuchet MS', sans-serif;
  font-size: 24px; font-weight: 800; color: var(--ldsa-ink); margin: 2px 0 0 0;
}
.ldsa-dir2-count {
  background: #f2f2f2; color: var(--ldsa-muted); font-size: 12px; font-weight: 700;
  padding: 4px 10px; border-radius: 999px; flex-shrink: 0; white-space: nowrap;
}

.ldsa-dir2-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
.ldsa-dir2-card {
  background: #ffffff; border: 1px solid var(--ldsa-line);
  border-top: 3px solid var(--ldsa-teal); border-radius: 12px;
  padding: 18px 20px; display: flex; flex-direction: column; gap: 6px;
  box-shadow: 0 1px 3px rgba(34, 34, 34, 0.06);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.ldsa-dir2-card:hover { transform: translateY(-3px); box-shadow: 0 6px 16px rgba(34, 34, 34, 0.10); }
.ldsa-dir2-name { font-weight: 700; font-size: 17px; color: var(--ldsa-ink); }
.ldsa-dir2-name:hover { color: var(--ldsa-teal); }
.ldsa-dir2-desc { font-size: 14px; line-height: 1.5; color: var(--ldsa-muted); flex-grow: 1; }
.ldsa-dir2-cta { font-size: 14px; font-weight: 700; margin-top: 6px; }

.ldsa-dir2-also {
  margin-top: 12px; font-size: 14px; color: var(--ldsa-muted);
  display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline;
}
.ldsa-dir2-also-label { font-weight: 700; }
.ldsa-dir2-also-item a { font-weight: 600; color: var(--ldsa-body); text-decoration: underline; text-decoration-color: #cccccc; }
.ldsa-dir2-also-item a:hover { color: var(--ldsa-teal); }
.ldsa-dir2-also-desc { color: var(--ldsa-faint); }

@media (max-width: 1023px) {
  .ldsa-dir2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .ldsa-dir2-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ldsa-dir2-head h2 { font-size: 20px; }
  .ldsa-dir2-card { padding: 16px; }
  .ldsa-dir2-cta { padding: 6px 0; }
}