.stratum {
  position: relative;
  padding-block: var(--stratum-pad);
  border-top: 1px solid var(--hairline);
}

.stratum:first-of-type {
  border-top: 0;
}

.stratum__log {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  margin-bottom: 2.5rem;
}

.stratum__depth {
  color: var(--basalt);
  font-variant-numeric: tabular-nums;
  flex: none;
}

.stratum__lith {
  color: var(--ink-2);
  flex: none;
}

.stratum__rule {
  flex: 1;
  height: 1px;
  background: var(--hairline);
  align-self: center;
}

.stratum__title {
  font-size: var(--fs-h2);
  max-width: 18ch;
}

.stratum__note {
  margin-top: 1.25rem;
  color: var(--ink-2);
}

.stratum__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 22rem);
  gap: clamp(1.5rem, 5vw, 4rem);
  align-items: end;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

@media (max-width: 820px) {
  .stratum__head {
    grid-template-columns: 1fr;
    align-items: start;
  }
}