/* The opening makes agent choice and separate bot workspaces tangible. */
.opening { background: #fff; }
.mast { height: 74px; background: #fff; }
.crew-hero { padding-block: 31px 30px; }
.crew-hero.wrap,.crew-principle.wrap,.early-comparison.wrap { max-width:1200px; }
.crew-copy { display: grid; grid-template-columns: 1.25fr 1fr; gap: 100px; align-items: end; margin-bottom: 28px; }
.crew-copy .eyebrow { font-size: 10px; letter-spacing: .1em; color: #656565; margin-bottom: 17px; }
.crew-dot { display: inline-block; width: 6px; height: 6px; background: #202020; border-radius: 50%; margin-right: 8px; }
.opening .crew-copy h1 { margin: 0; font-size: clamp(58px,4.6vw,68px); line-height: 1.04; letter-spacing: -.055em; font-weight: 600; color: #202020; }
.crew-copy .opening-ai { display: inline; color: #202020; }
.crew-pitch { padding-bottom: 5px; }
.crew-intro { color: #626262; font-size: 16px; line-height: 1.7; margin-bottom: 22px; }
.crew-actions { display: flex; gap: 26px; align-items: center; }
.crew-actions .button.primary { background: #202020; min-height: 47px; gap: 24px; padding-inline: 20px; font-size: 13px; border-radius:10px; }
.crew-actions .button.primary:hover { background: #3b3b3b; }
.crew-try { font-size: 12px; display: flex; gap: 18px; align-items: center; color: #454545; }
.crew-try:hover { color: #202020; }
.crew-stage { min-width: 0; }
.crew-window { border: 1px solid #dededc; border-radius: 14px; background: #fff; overflow: hidden; box-shadow: 0 18px 38px -24px #27272226; }
.crew-agent-bar { display: grid; grid-template-columns: 170px repeat(5,1fr); align-items: center; gap: 7px; min-height: 66px; padding: 6px 0 15px; background: #fff; }
.crew-step { display: flex; align-items: center; gap: 9px; font: 12px/1.4 Inter,sans-serif; color: #666663; letter-spacing: .03em; }
.crew-step b { font: 10px var(--mono); color: #73736b; }
.crew-agent-bar button { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 10px 8px; border-radius: 9px; border: 1px solid transparent; color: #464642; font-size: 13px; white-space: nowrap; transition:background .18s,border-color .18s,transform .18s; }
.crew-agent-bar button img { width: 25px; height: 25px; object-fit: contain; }
.crew-agent-bar button:hover { background: #f5f5f3; transform:translateY(-2px); }
.crew-agent-bar button[aria-pressed=true] { border-color: #b8cebf; background: #f0f6f1; color: #18583e; }
.crew-agent-check { font-size: 10px; opacity: 0; }
[aria-pressed=true]>.crew-agent-check { opacity: 1; }

.crew-bot-selector { display:grid; grid-template-columns:170px 1fr; align-items:center; gap:7px; padding:10px 16px; background:#fafaf8; border-bottom:1px solid #e7e7e5; }
.crew-tabs { display:flex; gap:9px; }
.crew-tabs button { display:flex; align-items:center; gap:8px; border:1px solid transparent; border-radius:5px; padding:7px 12px; color:#62625f; text-align:left; }
.crew-tabs button[aria-selected=true] { background:#fff; color:#1b5741; border-color:#c6d6ca; }
.crew-tabs button:hover { background:#fff; }
.crew-tabs strong { font-size:12px; font-weight:500; }
.crew-tabs small,.crew-tabs i { display:none; }
.crew-tab-symbol { font:14px var(--display); width:18px; text-align:center; }
#crew-tab-shop .crew-tab-symbol { font-family:Georgia,serif; font-style:italic; color:#815342; }
#crew-tab-research .crew-tab-symbol { color:#6b598b; }
#crew-tab-report .crew-tab-symbol { color:#4d745e; }
.crew-result iframe { display:block; width:100%; height:400px; border:0; background:#faf9f7; }
.crew-computer-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:9px 16px; border-top:1px solid #e7e7e5; background:#fafaf8; color:#62625f; font:10px var(--mono); }
.crew-computer-bar>span { display:flex; gap:8px; align-items:center; }
.crew-computer-bar b { font:10px var(--mono); }
.crew-computer-bar svg { width:11px; height:11px; }
.crew-computer-bar svg:nth-of-type(2) { margin-left:12px; }
.crew-model { display:flex; gap:15px; align-items:center; color:#545450; font-size:11px; padding:2px; }
.crew-model>span:last-child { color:#202020; }
.crew-stage-note { display:flex; justify-content:space-between; gap:16px; color:#686865; font-size:10px; line-height:1.5; padding-top:12px; }
.crew-stage-note span:last-child { color:#52695d; text-align:right; }
.crew-principle { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid #e7e7e5; padding-block: 25px; }
.crew-principle>p { font: 20px/1.2 var(--display); letter-spacing: -.5px; color: #62625f; }
.crew-principle strong { color: #222522; font-weight: 500; }
.crew-principle>div { display: flex; align-items: center; gap: 9px; font-size: 12px; color: #606660; }
.crew-principle svg { width: 15px; height: 15px; }
.early-comparison { padding-block: 72px 68px; border-top: 1px solid #e7e7e5; color: #232623; }
.early-comparison-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 32px; }
.early-comparison-head .eyebrow { font-size: 9px; color: #666a66; margin-bottom: 14px; }
.early-comparison-head h2 { font-size: clamp(38px,3.6vw,52px); font-weight:600; letter-spacing:-.045em; }
.early-comparison-head>p { color: #686b67; font-size: 14px; line-height: 1.8; }
.early-comparison-table { width: 100%; border-collapse: collapse; table-layout: fixed; text-align: left; }
.early-comparison-table th,.early-comparison-table td { border-bottom: 1px solid #e4e6e1; vertical-align: top; padding: 24px 30px; }
.early-comparison-table thead th { padding-block: 18px; background: #f6f6f3; border-top: 1px solid #e4e6e1; }
.early-comparison-table thead th:last-child { background: #eaf3eb; }
.early-comparison-table thead td { width: 16%; padding: 0; }
.early-comparison-table thead th>span { display: block; font: 28px/1.2 var(--display); letter-spacing: -1px; color: #535a53; }
.early-comparison-table thead th>small { display: block; font: 9px var(--mono); letter-spacing: .03em; margin-top: 10px; color: #626962; }
.early-comparison-table .early-wrkr { color: #202020; font: 600 27px/1.2 var(--mono); letter-spacing: -2px; }
.early-wrkr>small { font: 12px var(--display); letter-spacing: 0; margin-left: 6px; }
.early-comparison-table tbody th { padding-left: 0; font: 20px/1.3 var(--display); letter-spacing: -.5px; }
.early-comparison-table tbody th>span { display: block; font: 9px var(--mono); color: #71766f; letter-spacing: 0; margin-bottom: 13px; }
.early-comparison-table h3 { font-size: 24px; line-height: 1.2; letter-spacing: -.65px; margin-bottom: 9px; }
.early-comparison-table p { color: #62685f; font-size: 14px; line-height: 1.7; max-width: 390px; }
.early-comparison-table tbody td:first-of-type h3 { color: #535a53; }
.early-wrkr-cell { background: #f3f8f2; }
.early-wrkr-cell h3 { color: #204c35; }
.early-wrkr-cell p { color: #52634f; }
.early-wrkr-cell>a { display: inline-block; font-size: 12px; margin-top: 14px; color: #202020; }
.early-wrkr-cell>a:hover { text-decoration: underline; }
.shared-space,.separate-spaces { margin-top: 18px; }
.shared-space { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; padding: 11px 14px; border: 1px solid #d9ddd4; border-radius: 5px; background: #f6f6f3; }
.shared-space>span { font-size: 10px; text-align: center; padding-bottom: 9px; border-bottom: 1px solid #d9ddd4; color: #666e60; }
.shared-space>small { display: flex; align-items: center; justify-content: center; gap: 7px; grid-column: 1/-1; font-size: 9px; color: #666e60; }
.shared-space svg,.separate-spaces svg { width: 12px; height: 12px; }
.shared-space svg:nth-of-type(2) { margin-left: 10px; }
.separate-spaces { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.separate-spaces>span { border: 1px solid #cfddc7; background: #fff; border-radius: 5px; padding: 11px 6px; }
.separate-spaces b { display: block; text-align: center; color: #3b5834; font-size: 9px; font-weight: 500; }
.separate-spaces small { display: flex; justify-content: center; gap: 15px; margin-top: 12px; color: #56734d; }
.early-comparison-foot { display: flex; align-items: start; justify-content: space-between; gap: 35px; padding-top: 18px; }
.early-comparison-foot p { font-size: 10px; line-height: 1.8; color: #676d62; }
.early-comparison-foot p a { text-decoration: underline; text-underline-offset: 3px; }
.early-comparison-foot>.text-link { font-size: 11px; white-space: nowrap; }
.bakery-intro { padding-block: 74px 30px; display: flex; justify-content: space-between; align-items: end; gap: 40px; border-top: 1px solid #dbe3e9; }
.bakery-intro .eyebrow { color: #5d6c74; font-size: 9px; margin-bottom: 17px; }
.bakery-intro h2 { font-size: 47px; color: #213741; }
.bakery-intro>p { color: #566973; font-size: 14px; line-height: 1.8; max-width: 350px; }
.opening-promise { padding-block: 30px 50px; }
.workbench-backplate { background: #3d5edf; }

@media(min-width:1100px) and (max-height:740px) {
  .mast { height:64px; }
  .crew-hero { padding-block:16px 16px; }
  .crew-copy { margin-bottom:16px; }
  .opening .crew-copy h1 { font-size:50px; }
  .crew-copy .eyebrow { margin-bottom:9px; font-size:8px; }
  .crew-intro { font-size:12px; margin-bottom:12px; }
  .crew-actions .button.primary { min-height:38px; }
  .crew-agent-bar { min-height:45px; padding-block:0 8px; }
  .crew-agent-bar button { padding-block:8px; }
  .crew-bot-selector { padding-block:5px; }
  .crew-result iframe { height:268px; }
  .crew-computer-bar { padding-block:8px; }
  .crew-stage-note { padding-top:9px; }
  .crew-principle { padding-block:20px; }
}
@media(max-width:1250px) {
  .crew-copy { gap:40px; }
  .crew-intro { font-size:13px; }
  .crew-agent-bar { grid-template-columns:150px repeat(5,1fr); padding-inline:12px; gap:4px; }
  .crew-agent-bar button { font-size:11px; gap:6px; padding-inline:5px; }
  .crew-bot-selector { grid-template-columns:150px 1fr; padding-inline:12px; }
  .crew-principle>p { font-size:18px; }
  .early-comparison-table th,.early-comparison-table td { padding-inline:22px; }
  .early-comparison-table h3 { font-size:21px; }
}
@media(max-width:1000px) {
  .crew-copy { gap:25px; }
  .opening .crew-copy h1 { font-size:56px; }
  .crew-intro .desktop-br { display:none; }
  .crew-actions { gap:15px; }.crew-try { font-size:10px; gap:8px; }
  .crew-actions .button.primary { font-size:11px; padding-inline:13px; gap:12px; }
  .crew-agent-bar { grid-template-columns:repeat(5,1fr); gap:5px; }
  .crew-agent-bar>.crew-step { grid-column:1/-1; margin:4px 4px 0; }
  .crew-result iframe { height:400px; }
  .crew-principle { flex-wrap:wrap; justify-content:start; gap:18px 30px; }
  .crew-principle>p { width:100%; font-size:22px; }
  .early-comparison-head { display:block; }.early-comparison-head>p { margin-top:20px; }
  .early-comparison-table thead td { width:12%; }
  .early-comparison-table tbody th { font-size:15px; }
  .early-comparison-table th,.early-comparison-table td { padding-inline:16px; }
  .early-comparison-table h3 { font-size:20px; }
  .early-comparison-table p { font-size:11px; }
  .separate-spaces b { font-size:8px; }
  .shared-space>small { flex-wrap:wrap; font-size:8px; }
  .bakery-intro h2 { font-size:39px; }
}
@media(max-width:600px) {
  .mast { height:72px; }
  .crew-hero { padding-block:28px 23px; }
  .crew-copy { display:block; margin-bottom:25px; }
  .crew-copy .eyebrow { font-size:8px; margin-bottom:17px; }
  .opening .crew-copy h1 { font-size:clamp(44px,12.4vw,68px); line-height:1.07; }
  .crew-pitch { margin-top:23px; padding:0; }
  .crew-intro { font-size:15px; line-height:1.7; margin-bottom:20px; }
  .crew-actions { gap:19px; }.crew-try { font-size:11px; gap:9px; }
  .crew-actions .button.primary { font-size:11px; min-height:45px; padding-inline:13px; }
  .crew-agent-bar { grid-template-columns:repeat(3,1fr); gap:5px; padding:11px 10px; }
  .crew-agent-bar>.crew-step { margin:1px 2px 6px; }
  .crew-agent-bar button { font-size:11px; padding:9px 5px; gap:6px; justify-content:start; min-height:42px; }
  .crew-agent-bar button img { width:20px; height:20px; }
  .crew-agent-check { font-size:8px; margin-left:auto; }
  .crew-bot-selector { grid-template-columns:1fr; gap:10px; padding:12px 10px; }
  .crew-tabs { gap:3px; justify-content:space-between; }
  .crew-tabs button { padding:7px 6px; gap:4px; }
  .crew-tabs strong { font-size:11px; }
  .crew-tab-symbol { width:13px; }
  .crew-result iframe { height:709px; }
  .crew-computer-bar { padding:10px; flex-wrap:wrap; gap:10px; font-size:9px; }
  .crew-computer-bar b { font-size:9px; }
  .crew-model { width:100%; font-size:10px; justify-content:space-between; }
  .crew-stage-note { font-size:10px; gap:16px; }.crew-stage-note>span { max-width:50%; }
  .crew-principle { gap:17px; padding-block:23px; }
  .crew-principle>p { font-size:22px; }
  .crew-principle>div { width:100%; font-size:11px; gap:12px; }
  .early-comparison { padding-block:38px; }
  .early-comparison-head { margin-bottom:24px; }
  .early-comparison-head h2 { font-size:38px; }
  .early-comparison-head .eyebrow { font-size:8px; }
  .early-comparison-head>p { font-size:12px; margin-top:18px; }
  .early-comparison-table,.early-comparison-table tbody { display:block; }
  .early-comparison-table thead { display:none; }
  .early-comparison-table tr { display:grid; grid-template-columns:1fr; margin-bottom:26px; }
  .early-comparison-table tbody th { padding:0 0 14px; border:0; font-size:23px; }
  .early-comparison-table tbody th>span { display:inline; margin-right:10px; font-size:10px; }
  .early-comparison-table td { padding:22px; border:1px solid #e4e6e1; }
  .early-comparison-table td:first-of-type { border-radius:12px 12px 0 0; border-bottom:0; }
  .early-comparison-table td:last-of-type { border-radius:0 0 12px 12px; }
  .early-comparison-table td::before { content:attr(data-label); display:block; font:10px var(--mono); color:#63685d; margin-bottom:14px; }
  .early-comparison-table h3 { font-size:24px; line-height:1.15; }
  .early-comparison-table p { font-size:13px; line-height:1.8; }
  .early-wrkr-cell>a { font-size:12px; line-height:1.6; }
  .shared-space>span,.separate-spaces b { font-size:10px; }
  .shared-space>small { font-size:10px; }
  .early-comparison-foot { display:block; }
  .early-comparison-foot p { font-size:8px; line-height:1.9; }
  .early-comparison-foot>.text-link { display:inline-flex; margin-top:17px; font-size:11px; }
  .bakery-intro { padding-block:42px 23px; flex-direction:column; align-items:start; gap:18px; }.bakery-intro h2 { font-size:36px; }.bakery-intro>p { font-size:12px; }
  .opening-promise { align-items:start; gap:15px; padding-block:25px 35px; }
}

@media(prefers-reduced-motion:reduce) { .crew-agent-bar button { transition:none; } }
body.motion-paused .crew-agent-bar button { transition:none; }
