/* Hero Flow, version B: no box, an open field, and a big serif moment in the system rail. Loads after hero-flow.css. */
.hf-big{display:none}
.hf.open{background:radial-gradient(ellipse 70% 55% at 50% 48%,rgba(205,244,107,.06),transparent 70%);border-color:transparent;box-shadow:none;border-radius:0;padding-left:4px;padding-right:4px}
.hf.open:before{mask-image:radial-gradient(70% 60% at 50% 45%,#000 20%,transparent 80%)}

/* rail becomes a wide band between two hairlines, with one big line of type */
.hf.open .hf-rail{height:auto;padding:16px 0 14px;border-radius:0;border:0;background:none;flex-direction:column;justify-content:center;gap:6px;overflow:visible;
  border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.hf.open .hf-rail.on{box-shadow:none;border-color:rgba(205,244,107,.35)}
.hf.open .hf-rail:after{left:0;right:0;bottom:-1px}
.hf.open .hf-rail > em{display:none}
.hf.open .hf-big{display:block;font:italic 400 clamp(38px,4.2vw,56px)/1 "Instrument Serif",Georgia,serif;letter-spacing:-.02em;color:var(--text);white-space:nowrap}
.hf.open .hf-big span{color:var(--accent)}
.hf.open .hf-rail small{font-size:10px;letter-spacing:.22em}

/* work rows lose their boxes: hairline list */
.hf.open .hf-out{gap:0}
.hf.open .hf-row{background:none;border:0;border-radius:0;border-bottom:1px solid rgba(255,255,255,.07);padding:0 2px}
.hf.open .hf-row:last-child{border-bottom:0}
.hf.open .hf-chip{background:rgba(18,22,26,.7);backdrop-filter:blur(6px)}

@media(max-width:560px){
  .hf.open{padding-left:0;padding-right:0}
  .hf.open .hf-rail{padding:12px 0 10px;gap:4px}
  .hf.open .hf-big{font-size:clamp(32px,10vw,40px)}
  .hf.open .hf-rail small{font-size:9.5px;letter-spacing:.16em}
}