/* layouts/grid.css */
/* theme-revive-tech refinement for the grid layout. Tokens only, no raw
   colour/size literals (theme spec §2). Served as part of /theme/layouts.css,
   linked after the engine stylesheet, so these rules refine it.

   The engine renders every grid cell as a flat, vertically-centred box with a
   full hairline border, so a wall of cells reads as one undifferentiated block
   and the authored lead-in gets no emphasis. The engineered card is the tech
   sibling's differentiator from the business one: a LEFT accent hairline (the
   code-block / rail motif, distinct from the business top hairline), flat with no
   elevation, tighter corners, left-aligned content, and a mono 01 index. The
   accent does the pointing; the body sits muted beneath the lead-in. */
.layout-grid .grid-cell {
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: var(--revive-card-gap);
  padding: var(--revive-card-pad);
  text-align: start;
  border: var(--border-w) solid var(--ink-faint);
  border-left: var(--revive-card-edge) solid var(--accent);
  border-radius: var(--radius);
}

/* The lead-in is authored as **bold** at the start of the cell paragraph. It
   stays on the shared display face (Space Grotesk) in the accent, so the card
   gets a clear entry point that still reads native to the family. */
.layout-grid .grid-cell p strong:first-child {
  color: var(--accent);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: calc(var(--size-0) * var(--revive-card-lead-scale));
}

/* Body copy of each card, muted so the lead-in carries the weight. */
.layout-grid .grid-cell p {
  color: var(--revive-card-body-color);
  line-height: var(--leading-body);
}

/* Numbered cards (opt-in per slide via `numbered:`): a small mono 01 index above
   each lead-in, counted in source order, in the accent. The mono index is the
   engineered counterpart to the business sibling's soft display index.
   --size--1 is a stage-derived token, in scope at the point of use. */
.layout-grid .grid-numbered {
  counter-reset: revive-card;
}
.layout-grid .grid-numbered .grid-cell::before {
  counter-increment: revive-card;
  content: counter(revive-card, decimal-leading-zero);
  font-family: var(--font-mono);
  font-size: var(--size--1);
  color: var(--accent);
  letter-spacing: var(--revive-index-tracking);
}

/* layouts/predict.css */
/* theme-revive-tech refinement for the predict layout. Tokens only, no raw
   colour/size literals (theme spec §2). The engine owns the placeholder cursor,
   the rise, and the scale of the revealed answer; this only sets type so the
   frame reads native to the tech register: the prompt drops to a Geist Mono
   kicker so the question reads as setup, and the revealed answer (already accent,
   at statement scale from the engine) is tightened on the display track so it
   lands as a considered line rather than a shout. */
.predict-prompt p {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: var(--revive-kicker-tracking);
  font-size: var(--size-0);
}
.predict-answer.is-revealed :is(p, h1, h2, h3) {
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-tight);
}

/* layouts/section.css */
/* theme-revive-tech refinement for the section divider layout. Tokens only, no
   raw colour/size literals (theme spec §2). Served as part of /theme/layouts.css,
   linked after the engine stylesheet, so these rules refine it.

   A section break is a breath in the talk. The engine already draws the accent
   rail down the side of the section card; this refinement tunes it to the REVIVE
   rail width (the tighter engineered register) so section and title signatures
   match, and drops the lede to a mono kicker under the title.

   The mono-forward move that sets the technical sibling apart from the business
   one: a mono accent marker sits above the section title as an engineered eyebrow.
   The section card is a flex column, so this ::before is its first child and lands
   above the heading. It is a decorative marker in the accent (not a numbered index,
   which would need a reliable cross-slide counter the runtime cannot promise), so
   it carries no false ordinal. */
.layout-section {
  justify-content: center;
  gap: var(--space-4);
}
.layout-section .section-card {
  border-left: var(--revive-rail-w) solid var(--accent);
  padding-left: var(--revive-rail-gap);
}
.layout-section .section-card::before {
  content: '//';
  font-family: var(--font-mono);
  font-size: var(--size--1);
  font-weight: 400;
  letter-spacing: var(--revive-mark-tracking);
  line-height: var(--leading-tight);
  color: var(--accent);
}
.layout-section h1 {
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-tight);
  max-width: var(--measure);
}
.layout-section p {
  font-family: var(--font-mono);
  font-size: var(--size--1);
  text-transform: uppercase;
  letter-spacing: var(--revive-kicker-tracking);
  color: var(--ink-muted);
}
.layout-section .agenda-current {
  color: var(--accent);
}

/* layouts/split.css */
/* theme-revive-tech refinement for the split layout (and the split-style text
   slides). Tokens only, no raw colour/size literals (theme spec §2).

   The engine top-aligns split columns, so a slide with a short heading on the
   left and a few lines on the right feels crammed at the top with an empty lower
   half. Here the columns are centred on the stage, the measure is tightened to
   the technical width so lines do not run too wide, and each revealed point gets
   breathing room and a small square accent tick (the engineered counterpart to
   the business sibling's round dot) so it reads as a considered beat. */
.layout-split .split-columns {
  align-items: center;
}

.layout-split .split-col p {
  max-width: var(--revive-measure-tight);
}
.layout-split .split-col p + p {
  margin-block-start: var(--revive-para-gap);
}

/* Revealed points in a split column: space them, and mark each with a square
   accent tick set on the first line. padding-inline-start keeps wrapped lines
   aligned under the text, not under the marker. */
.layout-split .reveal-item {
  position: relative;
  padding-inline-start: var(--space-4);
}
.layout-split .reveal-item + .reveal-item {
  margin-block-start: var(--revive-para-gap);
}
.layout-split .reveal-item::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: var(--revive-marker-offset);
  width: var(--revive-marker-size);
  height: var(--revive-marker-size);
  background: var(--accent);
}

/* layouts/statement.css */
/* theme-revive-tech refinement for the statement layout. Tokens only, no raw
   colour/size literals (theme spec §2).

   The statement slide is one sentence. Space Grotesk carries it, tightened and
   set on the tighter technical measure so it reads as a considered line rather
   than a big heading. No rail here: a left rule on centered text fights the
   balance, so the statement stays clean. */
.layout-statement {
  justify-content: center;
  gap: var(--space-4);
}
.layout-statement h1 {
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-tight);
  max-width: var(--measure);
  text-wrap: balance;
}

/* layouts/timeline.css */
/* theme-revive-tech refinement for the timeline layout. Tokens only, no raw
   colour/size literals (theme spec §2). The engine owns the axis, the dots, and
   the sliding marker; this only sets type so the nodes read native to the tech
   register: the display heading tightened on the display track, and the
   supporting line under each node dropped to a Geist Mono caption. The active
   node already emphasises in the accent (engine), so the refinement leaves colour
   alone. */
.timeline-node :is(h1, h2, h3) {
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-tight);
}
.timeline-node p {
  font-family: var(--font-mono);
  font-size: var(--size--1);
  color: var(--ink-muted);
}

/* layouts/title.css */
/* theme-revive-tech refinement for the title layout. Tokens only, no raw
   colour/size literals (theme spec §2). Served as part of /theme/layouts.css,
   linked after the engine stylesheet, so these rules refine it.

   The REVIVE accent rail signature, run at the tighter rail width of the
   engineered register (see --revive-rail-w in tokens.css): the opening title is
   anchored by a violet vertical rule, and the
   subtitle drops to a mono kicker aligned to the title's text edge so the pair
   reads as one anchored title block. The title scale is a unitless multiplier so
   the arithmetic can happen on the stage, which is where --size-5 is derived. */
.layout-title h1 {
  border-left: var(--revive-rail-w) solid var(--accent);
  padding-left: var(--revive-rail-gap);
  font-size: calc(var(--size-5) * var(--revive-title-scale));
  letter-spacing: var(--tracking-display);
  line-height: var(--leading-tight);
  max-width: var(--measure);
  text-wrap: balance;
}
.layout-title p {
  padding-left: calc(var(--revive-rail-w) + var(--revive-rail-gap));
  font-family: var(--font-mono);
  font-size: var(--size-0);
  text-transform: uppercase;
  letter-spacing: var(--revive-kicker-tracking);
  color: var(--ink-muted);
}