/* Homepage hero: direction A "Refined" (Shane approved 23 Oct 2026; the existing tilted news clippings are kept as they are).
   Visible four-way audience switch (drives the existing hidden #segment select), shorter two-line headline with the rolling
   word in a fixed-width slot (js/site.js), one primary button + a "See how it works" text link for every audience, and the
   'What is AI Accuracy Lab?' drop-down as a quiet "New to this?" line above the news. */
.hero{padding-top:72px}
.hero .aud[hidden]{display:none}
.aud2{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 12px}
.aud2-l{font-size:14px;font-weight:600;color:var(--muted)}
.aud2-seg{display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--hairline),0 1px 2px rgba(0,0,0,.04);max-width:100%;overflow-x:auto;scrollbar-width:none}
.aud2-seg::-webkit-scrollbar{display:none}
.aud2-seg button{all:unset;box-sizing:border-box;cursor:pointer;min-height:40px;padding:0 18px;border-radius:999px;display:inline-flex;align-items:center;font-size:15px;font-weight:500;color:var(--muted);white-space:nowrap;transition:background-color .15s,color .15s}
.aud2-seg button:hover{color:var(--ink)}
.aud2-seg button[aria-checked="true"]{background:#1D1D1F;color:#fff;font-weight:600}
.aud2-seg button:focus-visible{outline:3px solid #1D4ED8;outline-offset:1px}
.hero h1.h-hero{margin-top:40px;max-width:1000px;font-size:clamp(40px,5.6vw,76px);line-height:1.04;letter-spacing:-.045em;text-wrap:balance}
.hero h1.h-hero .hrot-b{display:block}   /* the rolling word starts line 2: "Catch AI errors before the / <word> does." */
.hero h1.h-hero .hrot{text-align:right}  /* word sits against "does.", so only the space before it varies */
.hero .sub{margin-top:24px;max-width:700px;font-size:20px}
.hero .hero-ctas{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 28px;margin-top:34px}
.hero .hero-ctas .btn-dark{background:#1D1D1F;color:#fff;border-color:#1D1D1F;margin-top:0}
.hero .hero-ctas .btn-dark:hover{background:#000}
.hero .hero-ctas .tlink{font-size:17px}
.hero .hero-ctas .tlink::after{content:" \203A"}
/* 'What is AI Accuracy Lab?' as a quiet line: "New to this? What is AI Accuracy Lab?" + small chevron, centred; opens as before */
.hero .wia.wia-b{margin-top:20px}
.hero .wia-b .wia-h{font-size:15.5px;font-weight:600;letter-spacing:-.01em}
.hero .wia-b .wia-t::before{content:"New to this? ";font-weight:400;color:var(--muted)}
.hero .wia-b .wia-btn{min-height:36px}
.hero .wia-b .wia-chev{width:26px;height:26px;margin-left:0}
.hero .wia-b .wia-chev svg{width:20px;height:20px}
.hero .wia-b:has(.wia-body[hidden]) .wia-ul{display:none}
.hero .wia-b .wia-ul svg{width:min(200px,60%);transform:translateX(-13px)}
.hero .mq{margin-top:36px}
@media (max-width:760px){
  .hero{padding-top:36px}
  .aud2-l{width:100%;text-align:center;font-size:13px}
  .aud2-seg{display:grid;grid-template-columns:1fr 1fr;border-radius:20px;width:100%;max-width:340px}
  .aud2-seg button{justify-content:center;padding:0 10px;font-size:14px;min-height:40px}
  .hero h1.h-hero{margin-top:26px;font-size:clamp(36px,10vw,44px)}
  .hero .sub{font-size:17px}
  .hero .hero-ctas{flex-direction:column;gap:14px;margin-top:28px}
  .hero .hero-ctas .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.aud2-seg button{transition:none}}