/* ===== tela inicial: esfera central com raios, cartões 01–05 e chips ===== */
.home2 { display: flex; flex-direction: column; align-items: center; gap: 10px; padding-bottom: 8px; }
.home2 .saud-sub { margin: -6px 0 0; color: var(--text-dim); font-size: 13px; }
.ia-card { display: flex; gap: 10px; align-items: center; align-self: flex-start; border: 1px solid rgba(255, 75, 18, .45); border-radius: 12px; padding: 8px 14px; font-size: 11px; letter-spacing: 1px; background: rgba(10, 14, 24, .6); }
.ia-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 10px var(--orange); }
.esfera-wrap { position: relative; width: min(400px, 40vh, 90%); aspect-ratio: 1; display: flex; align-items: center; justify-content: center; }
#raios { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
#esfera-img { width: 40%; aspect-ratio: 1; border-radius: 50%; object-fit: cover; animation: avatarSpin 50s linear infinite; box-shadow: 0 0 50px rgba(59, 130, 246, .45), 0 0 90px rgba(255, 75, 18, .3); transition: transform .08s linear; }
@keyframes avatarSpin { to { rotate: 360deg; } }
.cards5 { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; width: 100%; max-width: 980px; }
.card5 { display: flex; flex-direction: column; gap: 3px; padding: 12px; border: 1px solid rgba(255, 75, 18, .35); border-radius: 12px; background: rgba(10, 14, 24, .6); color: var(--text-dim); text-decoration: none; font-size: 12px; transition: transform .2s, border-color .2s; }
.card5:hover { transform: translateY(-2px); border-color: var(--orange); color: #fff; }
.card5 b { color: #fff; letter-spacing: 1px; } .card5 em { font-style: normal; color: var(--orange); font-size: 11px; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.chip { background: transparent; color: var(--text-dim); border: 1px solid rgba(255, 255, 255, .2); border-radius: 999px; padding: 6px 14px; cursor: pointer; font: inherit; font-size: 12px; }
.chip:hover { color: #fff; border-color: var(--orange); }
@media (prefers-reduced-motion: reduce) { #esfera-img { animation: none; } }

/* esfera grande em segundo plano, atrás de cartões e textos */
.home2 { position: relative; min-height: 100%; justify-content: space-between; }
.home2 > :not(.esfera-wrap) { position: relative; z-index: 1; }
.esfera-wrap { position: absolute; z-index: 0; top: 50%; left: 50%; translate: -50% -50%; width: min(1000px, 100%, 118vh); pointer-events: none; opacity: .9; }
.card5, .ia-card { backdrop-filter: blur(3px); background: rgba(10, 14, 24, .55); }