/* Equipes por profissão: uma mesa por tipo de trabalho.
   Reaproveita os tokens de marketing.css (--ink, --paper, --copper...).
   Profundidade com perspective + translateZ: sem WebGL, leve em Android de entrada.
   Nada aqui depende de requestAnimationFrame: animação é CSS e termina sozinha. */

.team-intro{padding-block:65px 36px;max-width:860px}
.team-intro h1{margin-bottom:22px}
.team-lead{font-size:1.05rem;color:var(--muted);line-height:1.8;max-width:760px}

.team-stage{display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;align-items:start;padding-bottom:40px}

/* Trilho de profissões */
.team-rail{display:flex;flex-direction:column;gap:8px;position:sticky;top:96px}
.team-rail button{display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;text-align:left;padding:15px 16px;border:1px solid var(--line);border-radius:12px;background:var(--white);color:var(--ink);font:inherit;cursor:pointer;transition:border-color .18s,background .18s,transform .18s}
.team-rail button:hover{border-color:var(--copper)}
.team-rail button[aria-selected="true"]{background:var(--ink);color:var(--white);border-color:var(--ink);transform:translateX(4px)}
.team-rail button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.rail-name{font-weight:650;line-height:1.3}
.rail-status{font-size:.62rem;letter-spacing:.07em;font-weight:700}
.tag.val{background:#f3e6d9;color:#7a4a2c}
.team-rail button[aria-selected="true"] .tag{background:rgba(255,255,255,.16);color:var(--white)}

/* A sala: escura de propósito, para as telas brilharem como no vídeo de referência */
.team-room{position:relative;border-radius:20px;background:radial-gradient(120% 90% at 50% 0%,#17484b 0,#0e2a2c 55%,#091b1d 100%);padding:34px 22px 0;min-height:430px;overflow:hidden;perspective:1300px;perspective-origin:50% 38%;isolation:isolate}
.room-glow{position:absolute;inset:-20% 0 auto 55%;height:70%;background:radial-gradient(closest-side,rgba(219,173,136,.34),transparent 72%);z-index:0;pointer-events:none}
.screens{position:relative;z-index:2;display:grid;grid-template-columns:.78fr 1.5fr .78fr;gap:14px;align-items:end;transform-style:preserve-3d;transform:rotateY(calc(var(--px,0) * 5deg)) rotateX(calc(var(--py,0) * -3deg));transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.mon{position:relative;background:#050f10;border-radius:12px 12px 8px 8px;padding:9px 9px 12px;box-shadow:0 30px 50px -22px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.06);transform-style:preserve-3d}
.mon-left{transform:rotateY(19deg) translateZ(-26px);transform-origin:right center}
.mon-main{transform:translateZ(34px)}
.mon-right{transform:rotateY(-19deg) translateZ(-26px);transform-origin:left center}
.mon-screen{background:var(--white);border-radius:6px;overflow:hidden;min-height:250px;font-size:.78rem;color:var(--ink);box-shadow:0 0 38px rgba(219,173,136,.22);display:flex;flex-direction:column}
.mon-main .mon-screen{min-height:300px}
.mon-stand{display:block;width:34%;height:15px;margin:10px auto -26px;background:linear-gradient(#0b1c1e,#050f10);border-radius:0 0 8px 8px}

/* Mesa, teclado e luminária */
.desk{position:relative;z-index:1;height:84px;margin:34px -22px 0;background:linear-gradient(180deg,#b88a60 0,#98613e 38%,#6e4328 100%);box-shadow:0 -22px 44px rgba(219,173,136,.18)}
.desk::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:rgba(255,255,255,.35)}
.keyboard{position:absolute;left:50%;top:14px;width:30%;height:26px;margin-left:-15%;background:#17292b;border-radius:5px;transform:perspective(200px) rotateX(48deg);box-shadow:0 8px 14px rgba(0,0,0,.35)}
.lamp{position:absolute;right:9%;top:-58px;width:6px;height:70px;background:#1d2c2e;border-radius:3px}
.lamp::after{content:"";position:absolute;left:-22px;top:-8px;width:44px;height:16px;background:#e9d3b8;border-radius:22px 22px 4px 4px;box-shadow:0 14px 36px 10px rgba(219,173,136,.45)}

/* Interface das telas */
.scr-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 12px;border-bottom:1px solid var(--line);background:var(--soft)}
.scr-head b{font-size:.74rem;line-height:1.3}
.sample{font-size:.58rem;letter-spacing:.09em;font-weight:700;color:#7a4a2c;border:1px solid #c9a78c;border-radius:3px;padding:2px 5px;white-space:nowrap}
.dot-live{width:8px;height:8px;border-radius:50%;background:#3f8f5c;animation:eq-pulse 2s infinite}
.plot{display:block;width:100%;height:auto;background:#fbfaf6;border-bottom:1px solid var(--line)}
.plot text{font-family:inherit}

.checks{list-style:none;margin:0;padding:12px;display:grid;gap:12px}
.checks li{display:flex;gap:9px;align-items:flex-start;line-height:1.4;font-size:.74rem;opacity:0;animation:eq-rise .5s ease forwards;animation-delay:calc(var(--i) * .55s + .3s)}
.checks li::before{content:"✓";flex:0 0 16px;height:16px;border-radius:50%;background:#3f8f5c;color:#fff;font-size:.6rem;display:grid;place-items:center;margin-top:1px}
.checks li:last-child::before{content:"";background:transparent;border:1.5px solid var(--copper);animation:eq-pulse 2s infinite}

.rows{list-style:none;margin:0;padding:6px 12px 10px}
.rows li{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line);font-size:.74rem;line-height:1.35}
.rows li:last-child{border-bottom:0}
.rows b{font-variant-numeric:tabular-nums;white-space:nowrap}
.rows .total{border-top:1.5px solid var(--ink);border-bottom:0;font-weight:700}
.rows .flag{background:#fbefe3;margin-inline:-12px;padding-inline:12px}
.rows .d{font-style:normal;color:var(--muted);font-size:.66rem;margin-right:4px;font-variant-numeric:tabular-nums}
.chip{font-size:.58rem;letter-spacing:.08em;font-weight:700;padding:2px 6px;border-radius:3px;background:#f3e6d9;color:#7a4a2c}

.appr{padding:12px;display:flex;flex-direction:column;gap:12px;flex:1}
.appr-role small{display:block;font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:2px}
.appr-role b{font-size:.78rem;line-height:1.35}
.appr-text{margin:0;font-size:.74rem;line-height:1.55;color:var(--muted)}
.appr-btn{margin-top:auto;border:1px solid var(--line);background:var(--soft);color:var(--muted);border-radius:6px;padding:9px 10px;font:inherit;font-size:.72rem;font-weight:600;cursor:not-allowed}

/* Entrada da mesa: a câmera "avança" para a nova profissão */
.team-panel.enter .screens{animation:eq-dolly .7s cubic-bezier(.2,.7,.2,1)}

/* Detalhes abaixo da sala */
.prof-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:26px 0 14px}
.prof-head h2{font-size:1.5rem;margin:0}
.prof-info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;border-top:1px solid var(--line);padding-top:20px}
.prof-info small{display:block;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--copper);margin-bottom:6px}
.prof-info p{margin:0;color:var(--muted);line-height:1.65;font-size:.95rem}

.team-limits{margin-block:30px;padding:26px 28px;border:1px solid var(--line);border-left:5px solid var(--copper);border-radius:12px;background:var(--white);display:grid;grid-template-columns:minmax(0,220px) 1fr;gap:22px}
.team-limits h2{font-size:1.25rem;margin:0}
.team-limits p{margin:0;color:var(--muted);line-height:1.7}
.team-cta{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;padding-block:34px 80px}
.team-cta h2{margin-bottom:10px}
.team-cta p{color:var(--muted);max-width:620px;line-height:1.7;margin:0}
.team-actions{display:flex;gap:12px;flex-wrap:wrap}
.button.outline{background:transparent;border-color:var(--ink);color:var(--ink)}

@keyframes eq-pulse{0%{box-shadow:0 0 0 0 rgba(63,143,92,.5)}70%{box-shadow:0 0 0 7px rgba(63,143,92,0)}100%{box-shadow:0 0 0 0 rgba(63,143,92,0)}}
@keyframes eq-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes eq-dolly{from{opacity:0;transform:translateZ(-160px) rotateY(10deg) scale(.96)}to{opacity:1}}

@media (max-width:980px){
  .team-stage{grid-template-columns:1fr}
  .team-rail{position:static;flex-direction:row;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity}
  .team-rail button{flex:0 0 auto;width:auto;min-width:170px;scroll-snap-align:start}
  .team-rail button[aria-selected="true"]{transform:none}
}
@media (max-width:760px){
  .team-room{padding:20px 12px 0;perspective:none;min-height:0}
  .screens{grid-template-columns:1fr;transform:none!important;gap:12px}
  .mon-left,.mon-main,.mon-right{transform:none}
  .mon-main{order:-1}
  .mon-screen,.mon-main .mon-screen{min-height:0}
  .mon-stand,.desk{display:none}
  .room-glow{inset:-10% 0 auto 20%}
  .team-room{padding-bottom:12px}
  .prof-info,.team-limits{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .screens{transition:none;transform:none!important}
  .team-panel.enter .screens{animation:none}
  .checks li{opacity:1;animation:none}
  .dot-live,.checks li:last-child::before{animation:none}
}
