/* First timers: what alumni report, and when. The line settles as the phases advance. */
.ftben {
  --fb-ink: var(--color-text); --fb-muted: var(--color-text-2); --fb-line: var(--color-border);
  --fb-flame: var(--color-accent); --fb-gold: var(--color-gold);
  --sci-ink: var(--color-text); --sci-muted: var(--color-text-2);
  --sci-line: var(--color-border); --sci-gold: var(--color-accent);
  margin: 2.5rem 0 1.5rem; border: 1px solid var(--color-border); border-radius: 24px;
  background: var(--color-bg-card); color: var(--fb-ink); overflow: hidden;
  box-shadow: 0 24px 64px -36px color-mix(in srgb, var(--color-text) 12%, transparent);
}
.ftben *, .ftben *::before { box-sizing: border-box; }
.ftben p { margin: 0; }
.ftben .sci__header { border-top: 3px solid var(--color-red); }

.ftben__steps { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--fb-line); }
.ftben__steps button { display: flex; align-items: flex-start; gap: .6rem; padding: .9rem 1rem; min-height: 44px;
  border: 0; border-right: 1px solid var(--fb-line); background: transparent; text-align: left; color: var(--fb-muted); }
.ftben__steps button:last-child { border-right: 0; }
.ftben__steps button b { display: block; font-size: .84rem; font-weight: 600; color: var(--fb-ink); line-height: 1.25; }
.ftben__steps button small { display: block; margin-top: .15rem; font-size: .68rem; color: var(--fb-muted); }
.ftben__number { font-size: .62rem; font-variant-numeric: tabular-nums; color: var(--fb-muted); padding-top: .2rem; }
.ftben__steps button[aria-pressed="true"] { background: color-mix(in srgb, var(--color-cream) 45%, transparent); }
.ftben__steps button[aria-pressed="true"] .ftben__number { color: var(--fb-flame); }

.ftben__main { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
.ftben__visual { padding: 1.2rem 1.4rem 1rem; border-right: 1px solid var(--fb-line); }
.ftben__visual-top { display: flex; justify-content: space-between; font-size: .66rem; color: var(--fb-muted); margin-bottom: .5rem; }
.ftben__visual-top span:last-child { font-variant-numeric: tabular-nums; color: var(--fb-flame); }
.ftben svg { display: block; width: 100%; height: auto; font-family: var(--font-sans); }
.ftben__grid path { fill: none; stroke: var(--fb-line); stroke-width: 1; stroke-dasharray: 2 6; }
.ftben__baseline { fill: none; stroke: var(--fb-line); stroke-width: 1.5; }
.ftben__wave { fill: none; stroke: url(#ftben-fire); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--fb-progress, 0)); transition: stroke-dashoffset .5s linear; }
.ftben__mark circle { fill: var(--color-bg-card); stroke: var(--fb-line); stroke-width: 2; transition: stroke .35s ease, fill .35s ease; }
.ftben__mark text { font-size: 11px; fill: var(--fb-muted); text-anchor: middle; letter-spacing: .04em; transition: fill .35s ease; }
.ftben__mark.is-on circle { stroke: var(--fb-flame); fill: color-mix(in srgb, var(--color-cream) 72%, transparent); }
.ftben__mark.is-on text { fill: var(--fb-flame); font-weight: 600; }
.ftben__axis text { font-size: 10.5px; fill: var(--fb-muted); text-anchor: middle; letter-spacing: .05em; }
.ftben__period { margin-top: .6rem; display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.ftben__period span { font-size: .78rem; font-weight: 600; }
.ftben__period small { font-size: .64rem; color: var(--fb-muted); }

.ftben__notes { padding: 1.3rem 1.4rem; }
.ftben__notes section[data-active="false"] { display: none; }
.ftben__eyebrow { font-size: .61rem; letter-spacing: .13em; text-transform: uppercase; color: var(--fb-muted); margin-bottom: .4rem !important; }
.ftben__notes h4 { font-family: var(--font-display); font-weight: 400; font-size: 1.45rem; line-height: 1.15; letter-spacing: -.03em; margin: 0 0 .7rem; }
.ftben__body { font-size: .88rem; line-height: 1.6; color: var(--fb-muted); }
.ftben__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0 0; padding: 0; list-style: none; }
.ftben__tags li { padding: .3rem .6rem; font-size: .72rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--fb-flame) 32%, var(--fb-line));
  background: color-mix(in srgb, var(--color-cream) 30%, transparent); color: var(--fb-ink); }

.ftben__path { position: relative; display: grid; grid-template-columns: repeat(3, 1fr);
  padding: .55rem 1.4rem .7rem; border-top: 1px solid var(--fb-line); font-size: .64rem; color: var(--fb-muted); }
.ftben__path i { position: absolute; left: 1.4rem; right: 1.4rem; bottom: .35rem; height: 2px; background: var(--fb-line); border-radius: 2px; }
.ftben__path i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: calc(var(--fb-progress, 0) * 100%);
  background: var(--gradient-fire-h); border-radius: 2px; transition: width .5s linear; }
.ftben__foot { margin-top: 1.1rem; font-size: .86rem; }

@media (max-width: 860px) {
  .ftben__main { grid-template-columns: 1fr; }
  .ftben__visual { border-right: 0; border-bottom: 1px solid var(--fb-line); }
}
@media (prefers-reduced-motion: reduce) {
  .ftben__wave, .ftben__path i::after { transition: none; }
}