/* ==========================================================================
 *  IcebergAI landing page — the few rules unique to this single-page site.
 *
 *  Everything else (tokens, Material mapping, .iceberg-hero, .grid cards,
 *  buttons) comes from iceberg.css, which is a copy of the IcebergTTX docs
 *  stylesheet. Keep additions here so that file can be re-synced wholesale.
 * ========================================================================== */

/* Single page, no nav sidebar: let the content use the full measure. */
.md-main__inner {
  margin-top: 0;
}
.md-content {
  max-width: 52rem;
  margin: 0 auto;
}

/* The hero wordmark is the visible page title, so hide the <h1> the theme renders
 * from the front matter. Visually-hidden rather than display:none — the latter
 * would drop the document's only h1 out of the accessibility tree. */
.md-typeset h1:first-child {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* The org hero carries no product name under the wordmark, so the mark can
 * breathe a little more than it does on the per-project heroes. */
.iceberg-hero img.hero-wordmark {
  height: 3.6rem;
}

/* .tagline (big Spectral serif) carries the one-line thesis; the supporting
 * paragraph sits under it at body size so the hierarchy reads punchline-first. */
.iceberg-hero p.hero-sub {
  max-width: 58ch;
  margin: 0 0 1.75rem;
  font-size: 0.86rem;
  line-height: 1.7;
  color: oklch(0.78 0.015 252);
}

/* ==========================================================================
 *  Project cards — a status pill on the title row
 * ========================================================================== */
.md-typeset .project-cards .pill {
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.5rem;
  padding: 0.1rem 0.5rem;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  font-family: "JetBrains Mono", monospace;
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--muted);
}
.md-typeset .project-cards .pill--live {
  border-color: var(--accent-line);
  background-color: var(--accent-soft);
  color: var(--accent-ink);
}

/* Four projects: a fixed 2×2 beats the theme's auto-fit, which packs 3 across
 * and orphans the fourth on its own row. Collapses to 1-up on narrow screens. */
/* The theme puts the grid on the .grid div and sets the <ul> to display:contents,
 * so the <li>s are the grid items — column rules belong on the div, not the ul.
 * Its default auto-fit packs 3 across and orphans the 4th; a fixed 2×2 is tidier.
 * Collapses to 1-up below 45em. */
@media screen and (min-width: 45em) {
  .md-typeset .grid.cards.project-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Shipping projects link out; in-development ones deliberately do not — their
 * repos are private or unborn, and a dead link on the front door is worse than
 * no link. Grid rows already stretch the cards to equal height, so the short
 * link-less cards need no help; they just carry trailing space. */
.md-typeset .grid.cards.project-cards > ul > li > p:last-child {
  margin-bottom: 0;
}