// Variation B — Brutalist dossier
function HeroDossier() {
  const now = new Date();
  const ts = now.toISOString().replace("T", " / ").slice(0, 19);
  const ref = "COC-2026-" + String(Math.floor(now.getTime() / 1000) % 99999).padStart(5, "0");

  return (
    <section className="hero-dossier">
      <div className="dos-corner tl">+</div>
      <div className="dos-corner tr">+</div>
      <div className="dos-corner bl">+</div>
      <div className="dos-corner br">+</div>

      <div className="dos-header">
        <div className="dos-cell">
          <div className="dos-k">DOCUMENT</div>
          <div className="dos-v">PROSPECTUS — EXTERNAL</div>
        </div>
        <div className="dos-cell">
          <div className="dos-k">REFERENCE</div>
          <div className="dos-v">{ref}</div>
        </div>
        <div className="dos-cell">
          <div className="dos-k">ISSUED</div>
          <div className="dos-v">{ts}Z</div>
        </div>
        <div className="dos-cell dos-cls">
          <div className="dos-k">CLASSIFICATION</div>
          <div className="dos-v dos-cls-v">
            <Redact reveal="NEED-TO-KNOW">UNCLASSIFIED</Redact>
          </div>
        </div>
      </div>

      <div className="dos-body">
        <div className="dos-eyebrow">SUBJECT / crime of curiosity</div>
        <h1 className="dos-title">
          We get paid to break<br />
          what you can't afford<br />
          to see broken.
        </h1>
        <p className="dos-lede">
          An offensive security consultancy of operators and researchers. We think like the people already inside your network and leave with a report that tells you how to evict us.
        </p>
        <div className="dos-quote">
          <span className="dos-quote-mark">"</span>
          my crime is that of curiosity
          <span className="dos-quote-mark">"</span>
          <span className="dos-quote-cite">— the hacker manifesto, 1986</span>
        </div>
      </div>

      <div className="dos-footer">
        <div className="dos-stats">
          {window.COC.STATS.map((s) => (
            <div key={s.l} className="dos-stat">
              <div className="dos-stat-n">{s.n}</div>
              <div className="dos-stat-l">{s.l}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

window.HeroDossier = HeroDossier;