/* /teams v2: story beats ob-teams-hero-1, ob-home-4, ob-home-9, ob-teams-3, ob-compare-4, ob-compare-2, ob-post-cta-1. */
.sp-teams{--card-ink:#0B0B0D;--card-on:#FFFFFF;--card-field:rgba(255,255,255,.8);--field-ink:#0F1222;--tm-gap:24px}
.sp-teams h2{max-width:20ch}
.tm-lead{font-size:18px;line-height:1.6;color:var(--muted);max-width:52ch}
.tm-actions{display:flex;flex-wrap:wrap;gap:12px}
.sp-teams .btn:not(.main){background:var(--panel);color:var(--ink)}
.sp-teams .btn:disabled{opacity:.55;cursor:default}
.sp-teams :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.tm-feedback{font-size:16px;line-height:1.5;min-height:24px;overflow-wrap:anywhere}
.tm-feedback[data-error=true]{font-weight:500}

/* beat 1: hero */
.tm-hero{padding:104px 0 72px}
.tm-hero .wrap{position:relative;display:grid;justify-items:center;gap:28px;text-align:center}
.tm-hero h1{max-width:none;margin-inline:auto}
.tm-hero h1 span{display:block}
.tm-hero .lead{max-width:54ch;margin:0;font-size:20px;line-height:1.55}
.tm-plates{display:flex;gap:12px;justify-content:center}
.tm-plate{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:var(--frame)}
@media(min-width:1180px){
 .tm-plates{display:contents}
 .tm-plate{position:absolute;width:76px;height:76px;border-radius:24px}
 .tm-plate:nth-child(1){top:6px;right:5%}
 .tm-plate:nth-child(2){top:46%;left:2%}
 .tm-plate:nth-child(3){top:62%;right:2%}
}

/* beat 2: scene with the turn feed */
.tm-scene-section{padding:0 0 88px}
.tm-scene{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start;background:var(--frame);border-radius:32px;padding:48px}
.tm-scene-side{display:grid;gap:24px;align-content:start}
.tm-scene h2{font-size:clamp(28px,3vw,38px)}
.tm-controls{display:flex;flex-wrap:wrap;gap:16px;align-items:end}
.tm-field{display:grid;gap:8px;flex:1 1 180px;min-width:0}
.tm-round-field{flex:0 1 140px}
.tm-field label,.tm-card label{font-size:14px;color:var(--muted)}
.sp-teams select,.sp-teams input[type=number],.sp-teams input[type=text]{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--muted);border-radius:16px;background:var(--canvas);color:var(--ink);font:inherit}
.tm-scene-feed{display:grid;gap:16px;background:var(--canvas);border-radius:24px;padding:28px}
.tm-round{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.tm-feed{list-style:none;margin:0;padding:0;display:grid;gap:16px;align-content:start;min-height:268px;max-height:400px;overflow:auto;overscroll-behavior:contain}
.tm-feed li{display:flex;align-items:flex-start;gap:12px}
.tm-feed li>svg{flex:none}
.tm-feed li>div{min-width:0;max-width:56ch;background:var(--frame);border-radius:18px;padding:12px 16px}
.tm-feed p{font-size:16px;line-height:1.5}
.tm-feed p strong,.tm-feed div>strong{font-weight:500}
.tm-feed div>strong{display:block;font-size:14px;color:var(--muted)}

/* beat 3: sticky stack of live cards */
.tm-turns{padding:24px 0 96px}
.tm-turns-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:start}
.tm-turns-side{position:sticky;top:104px;display:grid;gap:20px;align-content:start}
.tm-steps{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:4px}
.tm-steps a{display:flex;align-items:center;min-height:44px;padding:0 16px;border-radius:16px;color:var(--muted);font-size:16px;transition:background-color 160ms var(--ease),color 160ms var(--ease)}
.tm-steps a[aria-current=step]{background:var(--ink);color:var(--canvas)}
.tm-cards{display:grid;gap:var(--tm-gap)}
.tm-card{position:sticky;top:calc(96px + var(--i) * 80px);z-index:calc(1 + var(--i));display:grid;gap:20px;align-content:start;min-height:360px;padding:24px 32px 32px;border-radius:32px;background:var(--c);color:var(--card-ink)}
.tm-card header{display:flex;align-items:center;gap:14px}
.tm-card header>svg{box-sizing:content-box;padding:8px;border-radius:16px;background:var(--frame)}
.tm-card h3{font-size:24px;line-height:1.2;font-weight:500}
.tm-card-text{font-size:17px;line-height:1.5;max-width:44ch}
.tm-card .sp-mention,.tm-card .tm-review,.tm-card .tm-queue,.tm-card .tm-model{display:grid;gap:14px;padding:0;background:none;min-width:0}
.tm-card label{color:var(--card-ink)}
.tm-card .sp-mention label{margin:0}
.tm-card .sp-people button{display:flex;align-items:center;gap:8px;min-height:44px;padding:6px 16px 6px 10px;background:var(--card-field);color:var(--field-ink);border-radius:var(--pill)}
.tm-card .sp-people button[aria-pressed=true]{background:var(--card-ink);color:var(--card-on)}
.tm-card .sp-people .mascot{width:24px;height:24px}
.tm-card textarea,.tm-card input[type=text],.tm-card select{background:var(--card-field);color:var(--field-ink);border:1px solid var(--card-ink);border-radius:16px}
.tm-card textarea{min-height:92px;padding:12px 14px;border:1px solid var(--card-ink)}
.tm-card .btn{background:var(--card-field);color:var(--field-ink)}
.tm-card .btn.main{background:var(--card-ink);color:var(--card-on)}
.tm-card .btn[aria-pressed=true]{background:var(--card-ink);color:var(--card-on)}
.tm-card .tm-feedback[data-error=true]{color:var(--card-ink)}
.tm-agent-line{font-size:16px;font-weight:500}
.tm-queued{padding:12px 16px;border-radius:16px;background:var(--card-field)}
.tm-queued p{color:var(--field-ink);font-size:16px}
.tm-card :focus-visible{outline-color:var(--card-ink)}

/* beat 4: departments tiles */
.tm-depts,.tm-ent,.tm-hub{padding:48px 0}
.tm-depts h2,.tm-ent h2,.tm-hub h2{margin-bottom:0}
.tm-tiles{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tm-tile{display:grid;align-content:space-between;gap:48px;min-height:200px;padding:32px;border-radius:28px;background:var(--frame)}
.tm-tile h3{font-size:24px;line-height:1.25;max-width:20ch}
.tm-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:var(--c);color:var(--card-ink)}
.tm-icon svg{width:28px;height:28px}

/* beat 5: table */
.tm-head{display:grid;gap:16px;margin-bottom:32px}
.tm-table{width:100%;border-collapse:separate;border-spacing:0 8px}
.tm-table th,.tm-table td{padding:22px 28px;text-align:left;vertical-align:top;font-size:17px;line-height:1.5;background:var(--frame)}
.tm-table thead th{padding:0 28px 4px;background:none;font-size:14px;font-weight:400;color:var(--muted)}
.tm-table tbody th{width:32%;font-weight:500;border-radius:20px 0 0 20px}
.tm-table tbody td{color:var(--muted);border-radius:0 20px 20px 0}

/* beat 6: hub and licences */
.tm-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tm-col{display:grid;gap:20px;align-content:start;padding:36px;border-radius:28px;background:var(--frame)}
.tm-col:nth-child(2){background:var(--panel)}
.tm-col h3{font-size:24px}
.tm-col ul{list-style:disc;margin:0;padding-left:1.1em;display:grid;gap:14px;font-size:17px;line-height:1.55;color:var(--muted)}
.tm-col li::marker{color:var(--ink)}

/* beat 7: closing call */
.sp-teams .final{padding-top:96px}
.tm-cta-actions{justify-content:center}

@media(max-width:1023px){.tm-scene{gap:36px;padding:36px}.tm-turns-grid{gap:44px}.tm-card{min-height:340px}}
@media(max-width:899px){
 .tm-scene{grid-template-columns:minmax(0,1fr)}
 .tm-turns-grid{grid-template-columns:minmax(0,1fr)}
 .tm-turns-side{position:static}
 .tm-steps{display:none}
 .tm-card{position:static;min-height:0}
}
@media(max-width:759px){
 .tm-hero{padding:56px 0 40px}.tm-hero .lead{font-size:18px}
 .tm-scene{padding:24px;border-radius:28px}.tm-scene-feed{padding:20px}
 .tm-card{padding:24px;border-radius:28px}
 .tm-tiles,.tm-cols{grid-template-columns:minmax(0,1fr)}
 .tm-tile{min-height:0;gap:28px;padding:24px}
 .tm-col{padding:28px}
 .tm-depts,.tm-ent,.tm-hub{padding:32px 0}
 .tm-table,.tm-table tbody,.tm-table tr,.tm-table th,.tm-table td{display:block}
 .tm-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .tm-table tbody tr{margin-bottom:8px;border-radius:20px;background:var(--frame);padding:20px 22px;display:grid;gap:6px}
 .tm-table th,.tm-table td{padding:0;background:none;width:auto;border-radius:0}
 .tm-table tbody th{width:auto;border-radius:0}
 .tm-table tbody td{border-radius:0}
}
@media(prefers-reduced-motion:reduce){.sp-teams .mascot{animation:none}.sp-teams *{scroll-behavior:auto;transition-duration:.01ms}}