/* Technical-minimal palette: near-monochrome + one restrained accent (steel blue). */

[data-md-color-scheme="default"] {
  --md-primary-fg-color: #1a1a1a;
  --md-primary-fg-color--light: #3a3a3a;
  --md-primary-fg-color--dark: #000000;
  --md-primary-bg-color: #fafafa;

  --md-accent-fg-color: #3b6ea5;
  --md-accent-fg-color--transparent: #3b6ea51a;

  --md-default-bg-color: #fafafa;
  --md-default-fg-color: #1a1a1a;
  --md-default-fg-color--light: #4a4a4a;
  --md-default-fg-color--lighter: #8a8a8a;
  --md-default-fg-color--lightest: #e0e0e0;

  --md-typeset-color: #2a2a2a;
  --md-typeset-a-color: #3b6ea5;

  --md-code-bg-color: #f0f0ee;
  --md-code-fg-color: #2a2a2a;

  --md-footer-bg-color: #1a1a1a;
  --md-footer-bg-color--dark: #141414;
  --md-footer-fg-color: #fafafa;
  --md-footer-fg-color--light: #cfcfcf;
}

[data-md-color-scheme="slate"] {
  --md-hue: 0;

  --md-primary-fg-color: #e8e8e8;
  --md-primary-fg-color--light: #cfcfcf;
  --md-primary-fg-color--dark: #ffffff;
  --md-primary-bg-color: #121212;

  --md-accent-fg-color: #6f9bce;
  --md-accent-fg-color--transparent: #6f9bce1a;

  --md-default-bg-color: #121212;
  --md-default-fg-color: #e8e8e8;
  --md-default-fg-color--light: #b8b8b8;
  --md-default-fg-color--lighter: #7a7a7a;
  --md-default-fg-color--lightest: #2a2a2a;

  --md-typeset-color: #d8d8d8;
  --md-typeset-a-color: #6f9bce;

  --md-code-bg-color: #1a1a1a;
  --md-code-fg-color: #d8d8d8;

  --md-footer-bg-color: #0a0a0a;
  --md-footer-bg-color--dark: #000000;
  --md-footer-fg-color: #e8e8e8;
  --md-footer-fg-color--light: #a0a0a0;
}

/* Generous whitespace — technical-minimal reads as unhurried, not dense */
.md-typeset {
  line-height: 1.7;
}

/* Justified body text on content pages (Projects, Writing, Experience) —
   not on the homepage, whose custom layout keeps ragged-right */
.md-typeset p,
.md-typeset li {
  text-align: justify;
  hyphens: auto;
}

.home p,
.home li,
.md-typeset .grid.cards p {
  text-align: left;
  hyphens: none;
}

/* Editorial serif for top-level headings — the register of someone who writes.
   Inner headings (h3+), nav, cards, and labels stay Inter for contrast. */
.md-typeset h1,
.md-typeset h2,
.home-hero h1 {
  font-family: "Source Serif 4", Georgia, serif;
  font-weight: 600;
  letter-spacing: 0;
}

/* Homepage section labels are labels, not headings — keep them sans */
.home-section h2 {
  font-family: var(--md-text-font, "Inter", sans-serif);
}

/* Match form controls and scrollbars to the active scheme */
[data-md-color-scheme="default"] {
  color-scheme: light;
}

[data-md-color-scheme="slate"] {
  color-scheme: dark;
}

/* Text selection in the accent color */
::selection {
  background-color: var(--md-accent-fg-color--transparent);
  color: var(--md-accent-fg-color);
}

/* Admonitions restyled to the site's register: monochrome body, steel-blue
   spine — instead of the theme's default green/blue color coding */
.md-typeset .admonition {
  border-color: var(--md-accent-fg-color);
  box-shadow: none;
}

.md-typeset .admonition-title {
  background-color: var(--md-accent-fg-color--transparent);
}

.md-typeset .admonition-title::before {
  background-color: var(--md-accent-fg-color);
}

/* Quieter table headers, consistent with the flat card treatment */
.md-typeset table:not([class]) th {
  background-color: var(--md-code-bg-color);
  color: var(--md-default-fg-color);
}

.md-typeset table:not([class]) {
  border: 1px solid var(--md-default-fg-color--lightest);
  box-shadow: none;
}

/* Monospace signal: reserved for concrete technical facts (stats, stack tags) */
.tag {
  display: inline-block;
  font-family: var(--md-code-font, "JetBrains Mono", monospace);
  font-size: 0.7rem;
  padding: 0.2rem 0.55rem;
  margin: 0 0.35rem 0.35rem 0;
  border-radius: 3px;
  background-color: var(--md-code-bg-color);
  color: var(--md-default-fg-color--light);
  border: 1px solid var(--md-default-fg-color--lightest);
}

.stat-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1.75rem;
  margin: 1.5rem 0 2rem;
}

.stat {
  font-family: var(--md-code-font, "JetBrains Mono", monospace);
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--md-default-fg-color);
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.stat small {
  font-family: var(--md-text-font, sans-serif);
  font-size: 0.7rem;
  font-weight: 400;
  color: var(--md-default-fg-color--light);
  letter-spacing: 0.01em;
}

/* Contact page — compact icon+label buttons, matching the flat card register */
.md-typeset .contact-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 2rem 0;
}

.md-typeset a.contact-row {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.6rem 1.1rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 4px;
  color: var(--md-default-fg-color);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.85rem;
  transition: border-color 0.2s, color 0.2s;
}

.md-typeset a.contact-row:hover {
  border-color: var(--md-accent-fg-color);
  color: var(--md-accent-fg-color);
}

.contact-row__icon {
  display: inline-flex;
  width: 1rem;
  height: 1rem;
  color: var(--md-default-fg-color--light);
  flex-shrink: 0;
}

.md-typeset a.contact-row:hover .contact-row__icon {
  color: var(--md-accent-fg-color);
}

.contact-row__icon svg {
  width: 100%;
  height: 100%;
}

/* Card title icons — steel-blue, sized to the title line */
.md-typeset .card-icon {
  color: var(--md-accent-fg-color);
  vertical-align: -0.15em;
  margin-right: 0.15rem;
}

/* Restyle default grid cards toward the technical-minimal register: flat, no shadow */
.md-typeset .grid.cards > ul > li {
  border-radius: 4px;
  box-shadow: none;
  border: 1px solid var(--md-default-fg-color--lightest);
  transition: border-color 0.2s;
}

.md-typeset .grid.cards > ul > li:hover {
  box-shadow: none;
  border-color: var(--md-accent-fg-color);
}

/* Homepage layout */
.home {
  max-width: 54rem;
  margin: 0 auto;
  padding: 1rem 0.2rem 3rem;
}

.home-hero {
  padding: 3rem 0 2.5rem;
}

.home-hero h1 {
  font-size: 2.2rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.home-hero__tagline {
  font-size: 1.25rem;
  color: var(--md-default-fg-color);
  max-width: 42rem;
  line-height: 1.55;
  font-weight: 500;
  margin-bottom: 1rem;
}

.home-hero__context {
  font-size: 0.95rem;
  color: var(--md-default-fg-color--light);
  max-width: 42rem;
  line-height: 1.7;
  margin-bottom: 2rem;
}

.home-hero .stat-row {
  margin: 1.5rem 0 0;
}

.home-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.75rem;
  margin-top: 2.25rem;
}

.home-cta a {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--md-accent-fg-color);
  text-decoration: none;
}

.home-cta a:hover {
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

.home-section {
  padding: 2.25rem 0;
  border-top: 1px solid var(--md-default-fg-color--lightest);
}

.home-section h2 {
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--md-default-fg-color--light);
  margin-bottom: 1.5rem;
}

.home-timeline {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.home-timeline__date {
  display: inline-block;
  font-family: var(--md-code-font, "JetBrains Mono", monospace);
  font-size: 0.8rem;
  color: var(--md-default-fg-color--light);
  min-width: 8rem;
}

.home-principles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
  gap: 1.75rem 2.5rem;
}

.home-principle h3 {
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0 0 0.5rem;
  color: var(--md-default-fg-color);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.home-principle h3 svg {
  width: 1rem;
  height: 1rem;
  fill: var(--md-accent-fg-color);
  flex-shrink: 0;
}

.home-principle p {
  font-size: 0.85rem;
  line-height: 1.65;
  color: var(--md-default-fg-color--light);
  margin: 0;
}

.home-principle__proof {
  margin-top: 0.6rem !important;
  font-size: 0.75rem !important;
  color: var(--md-default-fg-color--lighter) !important;
}

.home-principle__proof a {
  color: var(--md-accent-fg-color);
  text-decoration: none;
}

.home-principle__proof a:hover {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

/* Skills — flat cards that lift on hover, same language as the grid cards */
.home-skills {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
  gap: 1rem;
}

.home-skills__group {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 4px;
  padding: 1.2rem 1.3rem 1rem;
  display: flex;
  flex-direction: column;
  transition: border-color 0.2s, transform 0.2s;
}

.home-skills__group:hover {
  border-color: var(--md-accent-fg-color);
  transform: translateY(-2px);
}

.home-skills__group h3 {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0 0 0.85rem;
  color: var(--md-default-fg-color);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.home-skills__group h3 svg {
  width: 1rem;
  height: 1rem;
  fill: var(--md-accent-fg-color);
  flex-shrink: 0;
}

.home-skills__tags {
  flex: 1;
}

.home-skills__proof {
  margin: 0.85rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid var(--md-default-fg-color--lightest);
  font-family: var(--md-code-font, "JetBrains Mono", monospace);
  font-size: 0.7rem;
  color: var(--md-default-fg-color--light);
}

.tag:hover {
  border-color: var(--md-accent-fg-color);
  color: var(--md-accent-fg-color);
}

/* Writing / articles listing — plain, no card chrome, consistent with the rest of the site */
.md-typeset .article-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 2rem 0;
}

.md-typeset .article-list > ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.md-typeset .article-list > ul > li {
  padding: 1.5rem 0;
  border-top: 1px solid var(--md-default-fg-color--lightest);
}

.md-typeset .article-list > ul > li:first-child {
  border-top: none;
  padding-top: 0;
}

.md-typeset .article-list h3 {
  margin: 0 0 0.4rem;
  font-size: 1.1rem;
}

.article-date {
  font-family: var(--md-code-font, "JetBrains Mono", monospace);
  font-size: 0.8rem;
  color: var(--md-default-fg-color--light);
}