/* Investors page styles.

   Everything structural on this page (sections, cards, stat blocks, buttons)
   comes from styles.css. This file only carries the pieces that page does not
   already have: the CTA pair under the opening statement, the Done / Not yet
   split, the "what the round funds" band, the full-bleed number halves, the
   opening statement, the basis-label strip and the founder rows. */

/* --- Opening statement --- */
.invest-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 36px;
}

/* --- Where we are: Done / Not yet ---
   Full-bleed halves. Each half's outer padding is --bleed-pad, so its text sits
   on the same line as the section heading above. */
.stage-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.stage-split__half { padding: clamp(48px, 6vw, 88px) clamp(32px, 4vw, 64px); }
.stage-split__half--done {
  padding-left: var(--bleed-pad);
  background-color: var(--dark-surface);
  color: var(--on-primary-container);
}
.stage-split__half--ahead {
  padding-right: var(--bleed-pad);
  background-color: var(--surface-container-lowest);
  color: var(--on-surface-variant);
}
.stage-split__heading {
  font-family: var(--font-headline);
  font-size: var(--text-display);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: 0.01em;
  margin-bottom: 36px;
}
.stage-split__half--done .stage-split__heading { color: var(--primary-fixed); }
.stage-split__half--ahead .stage-split__heading { color: var(--on-surface); }
.stage-split__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 24px;
  max-width: 560px;
}
.stage-split__list li {
  padding-top: 20px;
  border-top: 1px solid var(--outline-variant);
  font-size: 15px;
  line-height: 1.65;
}
.stage-split__half--done .stage-split__list li { border-top-color: var(--dark-border); }
.stage-split__item {
  display: block;
  font-family: var(--font-subhead);
  font-size: 19px;
  font-weight: var(--weight-subhead);
  line-height: 1.3;
  margin-bottom: 6px;
}
.stage-split__half--done .stage-split__item { color: var(--on-dark); }
.stage-split__half--ahead .stage-split__item { color: var(--on-surface); }
.stage-split__half--done a { color: var(--inverse-primary); text-decoration: underline; text-underline-offset: 3px; }
.stage-split__half--done :focus-visible { outline-color: var(--inverse-primary); }

/* --- What the round funds ---
   A full-width Forest Green band, one row per budget line, with the outlined
   numeral the platform values bands use. */
.fund-band {
  list-style: none;
  margin: 0;
  padding: 0;
  background-color: var(--dark-surface);
}
.fund-row {
  display: grid;
  grid-template-columns: calc(var(--bleed-pad) + clamp(96px, 12vw, 180px)) minmax(0, 1fr);
  align-items: start;
  border-top: 1px solid var(--dark-border);
}
.fund-row:first-child { border-top: 0; }
.fund-row__num {
  padding: 40px 0 40px var(--bleed-pad);
  font-family: var(--font-headline);
  font-size: clamp(3rem, 6vw, 5rem);
  font-weight: 800;
  line-height: 0.85;
  letter-spacing: 0.01em;
  color: var(--inverse-primary);
}
@supports (-webkit-text-stroke: 1px black) {
  .fund-row__num {
    color: transparent;
    -webkit-text-stroke: 1.5px var(--inverse-primary);
  }
}
.fund-row__text { padding: 44px var(--bleed-pad) 44px 0; }
.fund-row__title {
  font-family: var(--font-subhead);
  font-size: var(--text-subhead);
  font-weight: var(--weight-subhead);
  line-height: 1.2;
  color: var(--primary-fixed);
  margin-bottom: 12px;
}
.fund-row__body {
  font-size: 15px;
  line-height: 1.7;
  color: var(--on-primary-container);
  max-width: 680px;
}
.fund-note {
  margin-top: 28px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--on-surface-variant);
  max-width: 680px;
}

/* --- Market pair ---
   The same two figures the home and platform pages carry, with the same basis
   labels. No figure appears here that is not already published elsewhere. */
.number-halves {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.number-half {
  display: flex;
  flex-direction: column;
  padding: clamp(48px, 6vw, 88px) clamp(32px, 4vw, 64px);
}
.number-half--cost {
  padding-left: var(--bleed-pad);
  background-color: var(--dark-surface-deep);
  color: var(--on-primary-container);
}
.number-half--value {
  padding-right: var(--bleed-pad);
  background-color: var(--accent);
  color: var(--on-accent);
}
.number-half__basis {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.number-half--cost .number-half__basis { color: var(--inverse-primary); }
.number-half__value {
  font-family: var(--font-headline);
  font-size: clamp(4rem, 11vw, 9rem);
  font-weight: 800;
  line-height: 0.9;
  letter-spacing: 0.01em;
  margin: 16px 0 20px;
}
.number-half--cost .number-half__value { color: var(--on-dark); }
.number-half__label {
  font-size: 15px;
  line-height: 1.6;
  max-width: 34ch;
}
.market-sources {
  margin-top: 28px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--on-surface-variant);
}
.market-sources a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* --- Opening statement ---
   The pre-seed line at display size across the full width, the two paragraphs
   side by side under it. */
.statement__title {
  font-family: var(--font-headline);
  font-size: clamp(2.6rem, 8vw, 8.5rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: 0.01em;
  color: var(--on-surface);
  margin: 0 0 clamp(32px, 4vw, 56px);
  text-wrap: balance;
}
.statement__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px clamp(32px, 5vw, 80px);
}
.statement__body .section__lead { max-width: none; margin: 0; }

/* --- Diligence: the four basis labels ---
   Least certain to most: white, Sprout Green, Seedling Green, Forest Green. */
.basis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}
.basis__item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 28px;
  min-height: clamp(180px, 16vw, 240px);
  padding: clamp(28px, 3vw, 44px) clamp(20px, 2.4vw, 36px);
}
.basis__item:first-child { padding-left: var(--bleed-pad); }
.basis__item:last-child { padding-right: var(--bleed-pad); }
.basis__item:nth-child(1) { background-color: var(--surface-container-lowest); color: var(--on-surface); }
.basis__item:nth-child(2) { background-color: var(--accent); color: var(--on-accent); }
.basis__item:nth-child(3) { background-color: var(--primary); color: var(--on-primary); }
.basis__item:nth-child(4) { background-color: var(--dark-surface); color: var(--on-primary-container); }
.basis__term {
  font-family: var(--font-headline);
  font-size: clamp(1.4rem, 2.6vw, 2.2rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.01em;
}
.basis__item:nth-child(4) .basis__term { color: var(--primary-fixed); }
.basis__desc { margin: 0; font-size: 14px; line-height: 1.6; max-width: 30ch; }

/* --- Founders ---
   Names as full-width display rows, hairlines to both screen edges. Each row
   links to that founder's panel on the team page and floods Sprout Green on
   hover or focus. */
.founder-rows { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--dark-border); }
.founder-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px 32px;
  padding: clamp(20px, 2.4vw, 32px) var(--bleed-pad);
  border-top: 1px solid var(--dark-border);
  text-decoration: none;
  transition: background-color var(--transition-fast);
}
.founder-row__name {
  font-family: var(--font-headline);
  font-size: clamp(2rem, 5.6vw, 5rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--primary-fixed);
  margin: 0;
  transition: color var(--transition-fast);
}
.founder-row__role {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--inverse-primary);
  transition: color var(--transition-fast);
}
.founder-row:hover,
.founder-row:focus-visible { background-color: var(--accent); outline: none; }
.founder-row:hover .founder-row__name,
.founder-row:hover .founder-row__role,
.founder-row:focus-visible .founder-row__name,
.founder-row:focus-visible .founder-row__role { color: var(--on-accent); }
.founder-rows + .container .invest-actions { margin-top: 40px; }

@media (max-width: 900px) {
  .stage-split,
  .number-halves { grid-template-columns: 1fr; }
  .stage-split__half,
  .number-half { padding-left: var(--bleed-pad); padding-right: var(--bleed-pad); }
  .statement__body { grid-template-columns: 1fr; }
  .basis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .basis__item,
  .basis__item:first-child,
  .basis__item:last-child { padding-left: var(--bleed-pad); padding-right: var(--bleed-pad); }
}
@media (max-width: 600px) {
  .fund-row { grid-template-columns: 1fr; }
  .fund-row__num { padding: 36px var(--bleed-pad) 0; }
  .fund-row__text { padding: 20px var(--bleed-pad) 40px; }
}