/* Trajetória (Sobre mim): as mesmas fotos se reorganizam em arranjos diferentes (trajetoria.js) */
.tj{padding:clamp(40px,6vw,72px) 0 clamp(56px,8vw,96px)}
.tj-head{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;margin-bottom:clamp(24px,4vw,48px)}
.tj-head .strip-caption{margin:0}
.tj-switch{justify-content:center;display:none}   /* fica só o círculo, girando */
.tj-switch{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:999px;background:rgba(29,23,36,.06);border:1px solid rgba(29,23,36,.1)}
.tj-switch button{padding:8px 15px;border:0;border-radius:999px;background:none;cursor:pointer;font:500 13.5px var(--font-body);color:inherit;opacity:.72;
  transition:background .35s var(--ease),opacity .35s,box-shadow .35s}
.tj-switch button:hover{opacity:1}
.tj-switch button[aria-pressed="true"]{background:#fff;opacity:1;box-shadow:0 4px 14px rgba(29,23,36,.12)}
.tj-switch button:focus-visible{outline:2px solid #f59e0b;outline-offset:2px}
.tj-stage{position:relative;width:100%;perspective:1400px;transition:height .9s cubic-bezier(.65,0,.35,1)}
.tj-card{position:absolute;left:50%;top:50%;margin:0;border-radius:14px;overflow:hidden;cursor:pointer;background:#ddd;
  box-shadow:0 22px 44px -18px rgba(29,23,36,.45);transform-style:preserve-3d;will-change:transform;
  transition:transform .95s cubic-bezier(.65,0,.35,1),filter .95s,opacity .6s}
.tj-card img{display:block;width:100%;height:100%;object-fit:cover}
.tj-card:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}
@media (max-width:640px){
  .tj-switch button{padding:7px 11px;font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){ .tj-card,.tj-stage{transition:none} }
.tj .tj-switch{display:none}   /* só o círculo, girando sozinho (os outros arranjos foram aposentados) */
/* giro contínuo (trajetoria.js): sem transição enquanto gira, para não "atrasar" o movimento */
.tj-stage.tj-girando .tj-card{transition:none !important}