/* One team's page (James, 11 Nov 2026, of attio.com: "this is the level of depth our site needs to have"). The team's glass object and its
   price first, then every bot in it as a pane of glass with the steel switch, each opening on its example played as the tour plays it
   (tour.css), then the other teams on the same shelf as the bots page. Loaded after bot.css, on the team pages. */
.b-facts[hidden],.tm-pick[hidden]{display:none}
.tm-price{max-width:40ch;margin-top:18px;color:var(--ink);font-size:17px;font-weight:500;line-height:1.4;letter-spacing:-.016em;animation:rise-in 1s var(--ease) .22s both}
.tm-price:empty{display:none}
.tm-hero .h-acts .btn .arr{font-size:16px}

/* the bots: a row each, a pane of glass; switched on, it is lit at its edge as on the bots page */
.tm-bots{background:linear-gradient(180deg,#fff 0,#f1f2f5 100%)}
.tm-bots .t-head > p:not(.bt-picked){max-width:52ch;margin-top:14px;color:var(--soft);font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.36}
.tm-pick,.tm-list{width:min(100% - 64px,1400px);margin:clamp(20px,2.6vw,32px) auto 0}
.tm-pick h3{font-size:22px;font-weight:600;letter-spacing:-.024em}
.tm-pick .k-trades{max-width:none}
.tm-pick p{margin-top:18px}
.tm-list{display:grid;gap:12px}
.tm-bot{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:6px 20px;padding:16px 20px 16px 14px;border-radius:24px;
  background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,255,255,.55) 46%),linear-gradient(180deg,#fff,#f4f5f8);
  box-shadow:0 0 0 1px rgba(14,18,28,.08),inset 0 1px 0 #fff,0 24px 36px -30px rgba(22,30,48,.5);animation:rise-in .6s var(--ease) both;animation-delay:calc(var(--i) * 45ms);transition:box-shadow .45s}
.tm-bot[data-on]{box-shadow:0 0 0 2.5px var(--accent),0 0 0 3.5px rgba(63,107,0,.34),inset 0 1px 0 #fff,0 0 44px -10px color-mix(in srgb,var(--accent) 80%,transparent),0 24px 36px -30px rgba(22,30,48,.5)}
.tm-bot .thumb{width:72px;height:62px;object-fit:contain;mix-blend-mode:multiply}
.tm-bot[data-later]{background:#f4f5f8}
.tm-bot[data-later] .thumb{opacity:.35;filter:grayscale(1)}
.tm-bot[data-later] :is(h3,.tm-job){color:var(--soft)}
.tm-head h3{font-size:20px;font-weight:600;line-height:1.15;letter-spacing:-.024em}
.tm-head h3 a{text-decoration:none}
.tm-head h3 a:hover{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.tm-job{max-width:72ch;margin-top:4px;color:var(--ink-2);font-size:15px;line-height:1.4;text-wrap:pretty}
.tm-side{display:grid;justify-items:end;gap:2px;text-align:right}
.tm-cost{font-size:15px;font-weight:600;white-space:nowrap}
.tm-cost:empty{display:none}
.tm-side small{color:var(--soft);font-size:12.5px}
.tm-ex{grid-column:2 / -1}
.tm-ex summary{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px 0 12px;border-radius:99px;background:#fff;box-shadow:var(--edge);font-size:14.5px;font-weight:500;cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent;transition:translate .25s var(--ease)}
.tm-ex summary::-webkit-details-marker{display:none}
.tm-ex summary::before{content:"";width:8px;height:8px;border:solid var(--ink-2);border-width:0 2px 2px 0;rotate:-45deg;transition:rotate .3s var(--ease)}
.tm-ex[open] summary::before{rotate:45deg}
.tm-ex summary:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media (hover:hover){.tm-ex summary:hover{translate:2px 0}}
.tm-flow{max-width:920px;min-height:0;margin-top:12px;padding:clamp(14px,2vw,22px)}

/* the other teams: the bots page's own shelf, each tile a way to its page */
.tm-others{padding-top:clamp(40px,5vw,72px)}
.tm-teams{margin-top:clamp(14px,2vw,24px)}
.tm-teams .k-tile b{max-width:12ch}

@media (max-width:899px){
  .tm-pick,.tm-list{width:calc(100% - 24px)}
  .tm-bot{grid-template-columns:52px minmax(0,1fr);padding:14px 14px 14px 10px;gap:8px 12px}
  .tm-bot .thumb{width:52px;height:46px;align-self:start}
  .tm-side{grid-column:1 / -1;grid-template-columns:auto 1fr;justify-items:start;align-items:center;gap:2px 14px;text-align:left}
  .tm-side .sw-b{grid-row:span 2}
  .tm-ex{grid-column:1 / -1}
  .tm-flow{padding:12px}
}
