/* Square scene, equal-radius paths, and counter-rotation keep labels upright. */
.industries-body .industry-radar {
    container-type: inline-size;
    width: 100%;
    max-width: 540px;
    height: auto;
    aspect-ratio: 1;
    margin-inline: auto;
    --orbit-duration: 32s;
}

.industry-radar .radar-ring-one {
    width: calc(100% - 128px);
    height: calc(100% - 128px);
    border-color: rgba(114, 242, 197, .24);
}

.industry-radar .radar-node {
    --orbit-radius: calc(50cqw - 64px);
    left: 50%;
    top: 50%;
    right: auto;
    bottom: auto;
    width: max-content;
    padding: 9px 12px;
    font-size: 12px;
    letter-spacing: .05em;
    transform-origin: 0 0;
    transform: rotate(var(--orbit-angle)) translateX(var(--orbit-radius)) rotate(calc(0deg - var(--orbit-angle))) translate(-50%, -50%);
    animation: industry-planet-orbit var(--orbit-duration) linear infinite;
    will-change: transform;
}

.industry-radar .radar-node-a { --orbit-angle: 198deg; }
.industry-radar .radar-node-b { --orbit-angle: -18deg; }
.industry-radar .radar-node-c { --orbit-angle: 126deg; }
.industry-radar .radar-node-d { --orbit-angle: 54deg; }
.industry-radar .radar-node-e { --orbit-angle: -90deg; }

.industry-radar .radar-core span,
.industry-radar .radar-core small { font-size: 12px; letter-spacing: .06em; }

@keyframes industry-planet-orbit {
    from {
        transform: rotate(var(--orbit-angle)) translateX(var(--orbit-radius)) rotate(calc(0deg - var(--orbit-angle))) translate(-50%, -50%);
    }
    to {
        transform: rotate(calc(var(--orbit-angle) + 360deg)) translateX(var(--orbit-radius)) rotate(calc(0deg - var(--orbit-angle) - 360deg)) translate(-50%, -50%);
    }
}

@media (max-width: 700px) {
    .industry-radar .radar-node {
        --orbit-radius: calc(50cqw - 56px);
        padding: 8px;
        letter-spacing: 0;
    }
    .industry-radar .radar-ring-one {
        width: calc(100% - 112px);
        height: calc(100% - 112px);
    }
    .industry-radar .radar-core {
        width: 24cqw;
        height: 24cqw;
    }
    .industry-radar .radar-core span,
    .industry-radar .radar-core small { display: none; }
    .industry-radar .radar-core strong { font-size: 24px; margin: 2px 0; }
}

@media (prefers-reduced-motion: reduce) {
    .industry-radar .radar-node { animation: none; will-change: auto; }
}