/* ==========================================================================
   DC Orbit Showcase — member chips (photo + name) orbiting a central logo
   ========================================================================== */

.dcorb {
    position: relative;
    overflow: hidden;
    padding: clamp(64px, 8vw, 120px) clamp(20px, 4vw, 60px);
    background:
        radial-gradient(820px 560px at 50% 46%, rgba(0, 119, 204, 0.12), transparent 62%),
        linear-gradient(180deg, #fff 0%, var(--dc-bg) 100%);
    font-family: var(--dc-font-body);
}

.dcorb__inner { max-width: 1280px; margin: 0 auto; }

.dcorb__stage {
    position: relative;
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: clamp(320px, 94vw, 980px);
    margin: 8px auto 0;
}

/* ---- Halo & orbit rings ------------------------------------------------- */
.dcorb__halo {
    position: absolute;
    inset: 14%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 119, 204, 0.22), transparent 62%);
    filter: blur(46px);
    animation: dcorb-pulse 8s ease-in-out infinite;
}
.dcorb__ring {
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--dcorb-s);
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border: 1px dashed rgba(11, 31, 51, 0.16);
    border-radius: 50%;
}

/* ---- Central logo ------------------------------------------------------- */
.dcorb__core {
    position: absolute;
    inset: 40.5%;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--dc-line);
    box-shadow: 0 26px 54px -20px rgba(11, 31, 51, 0.4);
    display: grid;
    place-items: center;
    z-index: 5;
    animation: dcorb-pulse 8s ease-in-out infinite;
}
.dcorb__core img {
    width: 72%;
    height: auto;
    display: block;
}

/* ---- Member nodes ------------------------------------------------------- */
.dcorb__node {
    position: absolute;
    top: 50%;
    left: 50%;
    width: var(--dcorb-ring);
    aspect-ratio: 1;
    transform: translate(-50%, -50%) rotate(var(--dcorb-a));
    pointer-events: none;
}
.dcorb__pin {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%) rotate(calc(var(--dcorb-a) * -1));
}
.dcorb__chip {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 5px 14px 5px 5px;
    background: #fff;
    border: 1px solid var(--dc-line);
    border-radius: 999px;
    box-shadow: var(--dc-shadow-md);
    pointer-events: auto;
    cursor: default;
    animation: dcorb-float 7s ease-in-out infinite;
    animation-delay: calc(var(--dcorb-i, 0) * -0.6s);
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
.dcorb__chip:hover {
    box-shadow: var(--dc-shadow-lg);
    border-color: var(--dc-primary-2);
    position: relative;
    z-index: 6;
}
.dcorb__chip-img {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: var(--dc-bg-2);
    background-size: cover;
    background-position: center;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.9);
    transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.dcorb__chip:hover .dcorb__chip-img { transform: scale(1.12); }
.dcorb__chip-name {
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--dc-ink);
    white-space: nowrap;
}

@keyframes dcorb-pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.05); }
}
@keyframes dcorb-float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-7px); }
}

/* ---- Responsive --------------------------------------------------------- */
@media (max-width: 820px) {
    .dcorb__stage { max-width: 100%; }
    .dcorb__chip { gap: 6px; padding: 4px 10px 4px 4px; }
    .dcorb__chip-img { width: 26px; height: 26px; }
    .dcorb__chip-name { font-size: 10px; }
    .dcorb__core { inset: 38%; }
}
@media (max-width: 560px) {
    .dcorb__chip-name { display: none; }
    .dcorb__chip { padding: 4px; }
}

@media (prefers-reduced-motion: reduce) {
    .dcorb__halo, .dcorb__core, .dcorb__chip { animation: none; }
}