/* chooser.css: the robotic or open chooser, on the Robotic vs. Open page.
   Moved off the homepage Sep 24, 2026. */
.compare-band { padding: 72px 0 88px; background: var(--paper-deep); border-top: 1px solid var(--line); }
.compare-band .section-lead { max-width: 680px; margin-bottom: 26px; color: var(--ink-soft); }
@media (max-width: 700px) { .compare-band { padding: 52px 0 64px; } }
/* ---------- Robotic or open chooser ---------- */
.ch-tabs { display: none; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.chooser.is-live .ch-tabs { display: flex; }
.ch-tabs button { font: 600 0.98rem/1 var(--sans); height: 46px; padding: 0 22px; border-radius: 999px; border: 1.5px solid var(--ink); background: transparent; color: var(--ink); cursor: pointer; }
.ch-tabs button[aria-selected="true"] { background: var(--ink); color: var(--paper); }
.ch-tabs button:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.ch-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-bottom: 36px; }
.ch-title { grid-column: 1 / -1; margin: 0; }
.chooser.is-live .ch-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.chooser.is-live .ch-panel { margin-bottom: 0; }
.chooser.is-live .ch-panel[hidden] { display: none; }
.ch-col { border: 1px solid var(--line-dark); background: var(--paper); padding: 24px 26px; }
.ch-col h4 { font-family: var(--serif); font-weight: 550; font-size: 1.35rem; margin-bottom: 10px; }
.ch-col ul { margin: 12px 0 14px; padding-left: 1.1em; color: var(--ink-soft); }
.ch-col li { margin-bottom: 6px; }
.ch-col-off { background: transparent; border-style: dashed; }
.ch-col-off p { color: var(--ink-soft); margin-bottom: 12px; }
.cut-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 12px; background: #fff; border: 1px solid var(--line); }
.cut { width: 180px; height: 24px; flex: none; }
.cut-l { fill: none; stroke: var(--accent); stroke-width: 4; stroke-linecap: round; }
.cut-cap { font-size: 0.88rem; font-weight: 600; color: var(--ink); }
@media (prefers-reduced-motion: no-preference) {
  .chooser.is-live .cut-l { stroke-dasharray: 200; stroke-dashoffset: 200; }
  .chooser.is-live .ch-panel.is-drawn .cut-l { stroke-dashoffset: 0; transition: stroke-dashoffset 0.8s var(--ease-out, ease-out); }
}

@media (max-width: 860px) { .ch-panel { grid-template-columns: 1fr; } }