/* ========================================================================
   Geekin — Industries + Healthcare page-specific styles
   Extends /styles.css. Do not redefine tokens or header/footer rules here —
   see the shared stylesheet's own file-header note for that convention.
   ======================================================================== */

/* Industries overview: 6 verticals, 3 columns = two even rows (same
   even-grid logic used for the 8-service grid on Services/Home). */
.industries-grid {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 900px) {
  .industries-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .industries-grid { grid-template-columns: 1fr; }
}

.industries-note {
  color: var(--fg-muted);
  font-size: var(--text-sm);
  margin-top: var(--space-2);
}

/* Healthcare page: a few sections list specific coverage areas (EHR
   systems, safeguards, etc.) as a plain marker list rather than full
   cards, to vary rhythm instead of repeating the card grid every section. */
.topic-list {
  margin: var(--space-3) 0 0;
  padding-left: 1.1em;
  color: var(--fg-muted);
  font-size: var(--text-sm);
  display: grid;
  gap: var(--space-2);
}
.topic-list li::marker {
  color: var(--accent);
}

.topic-list-wide {
  max-width: 70ch;
}