/* Desktop layered metric orbit. Loaded after the main stylesheet. */

.metric-orbit-display {
  display: none;
}

@media (min-width: 1181px) {
  .company-metrics .metric-focus {
    --metric-orbit-progress: 16.6667%;
    --metric-number-scale: 1;
    --metric-number-size: clamp(176px, 14.8vw, 220px);
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    transform: none;
  }

  .company-metrics .metric-focus[data-number-density="medium"] {
    --metric-number-scale: 1;
    --metric-number-size: clamp(160px, 13.2vw, 196px);
  }

  .company-metrics .metric-focus[data-number-density="compact"] {
    --metric-number-scale: 1;
    --metric-number-size: clamp(140px, 12vw, 168px);
  }

  .company-metrics .metric-focus[data-number-density="ultra"] {
    --metric-number-scale: 1;
    --metric-number-size: clamp(118px, 9.8vw, 144px);
  }

  .company-metrics .metric-focus::after {
    display: none;
  }

  .company-metrics .metric-focus-meta {
    display: none;
  }

  .company-metrics .metric-orbit-display {
    position: absolute;
    z-index: 5;
    top: 190px;
    left: 50%;
    display: block;
    width: min(340px, 86%);
    aspect-ratio: 1;
    perspective: 720px;
    transform: translateX(-50%);
    pointer-events: none;
  }

  .company-metrics .metric-orbit-display::before {
    position: absolute;
    content: "";
    inset: 11%;
    border-radius: 50%;
    opacity: 0.68;
    background: radial-gradient(circle, rgba(226, 189, 120, 0.2), rgba(119, 229, 229, 0.06) 42%, transparent 69%);
    filter: blur(11px);
    transform: translateY(14%);
  }

  .company-metrics .metric-orbit-plane {
    position: absolute;
    inset: 0;
    transform: rotateX(54deg) rotateZ(-5deg) scale(0.8);
    transform-style: preserve-3d;
    transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .company-metrics .metric-orbit-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    transform-style: preserve-3d;
    will-change: transform, filter, opacity;
  }

  .company-metrics .metric-orbit-ring--main {
    width: 280px;
    height: 280px;
    border: 1px solid rgba(226, 189, 120, 0.36);
    background: radial-gradient(circle, rgba(5, 17, 26, 0.1) 0 48%, rgba(5, 17, 26, 0.58) 49% 100%);
    box-shadow: 0 0 0 12px rgba(226, 189, 120, 0.035), 0 22px 56px rgba(0, 0, 0, 0.34), inset 0 0 42px rgba(226, 189, 120, 0.06);
    transform: translate3d(-50%, -50%, 72px);
    animation: metricOrbitMain 3s ease-in-out infinite;
  }

  .company-metrics .metric-orbit-ring--main::before {
    position: absolute;
    content: "";
    inset: -9px;
    padding: 9px;
    border-radius: inherit;
    background: conic-gradient(from -90deg, #fff0c8 0%, #d6a556 var(--metric-orbit-progress), rgba(119, 229, 229, 0.2) var(--metric-orbit-progress), rgba(255, 255, 255, 0.075) 100%);
    filter: drop-shadow(0 0 17px rgba(226, 189, 120, 0.32));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
  }

  .company-metrics .metric-orbit-ring--main > i {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 15px;
    margin-left: -1px;
    background: rgba(5, 17, 26, 0.88);
    box-shadow: 0 0 0 1px rgba(226, 189, 120, 0.06);
    transform: rotate(calc(var(--orbit-i) * 60deg)) translateY(-147px);
    transform-origin: center 0;
  }

  .company-metrics .metric-orbit-ring--second {
    width: 212px;
    height: 212px;
    border: 6px solid rgba(119, 229, 229, 0.24);
    border-top-color: rgba(255, 225, 164, 0.78);
    border-right-color: rgba(226, 189, 120, 0.4);
    box-shadow: 0 0 22px rgba(119, 229, 229, 0.08), inset 0 0 30px rgba(119, 229, 229, 0.08);
    transform: translate3d(-50%, -50%, 25px);
    animation: metricOrbitSecond 3s ease-in-out infinite;
    animation-delay: 180ms;
  }

  .company-metrics .metric-orbit-ring--third {
    width: 138px;
    height: 138px;
    border: 2px solid rgba(255, 225, 164, 0.82);
    box-shadow: 0 0 26px rgba(226, 189, 120, 0.15), inset 0 0 22px rgba(226, 189, 120, 0.07);
    transform: translate3d(-50%, -50%, -18px);
    animation: metricOrbitThird 3s ease-in-out infinite;
    animation-delay: 330ms;
  }

  .company-metrics .metric-orbit-ring--base {
    width: 306px;
    height: 306px;
    border: 29px solid rgba(119, 229, 229, 0.06);
    box-shadow: inset 0 0 0 1px rgba(119, 229, 229, 0.14), 0 0 0 1px rgba(226, 189, 120, 0.1);
    transform: translate3d(-50%, -50%, -72px);
    animation: metricOrbitBase 3s ease-in-out infinite;
    animation-delay: 520ms;
  }

  .company-metrics .metric-orbit-ring--core {
    width: 68px;
    height: 68px;
    border: 1px solid rgba(255, 235, 190, 0.72);
    background: conic-gradient(from 210deg, rgba(226, 189, 120, 0.7) 0 var(--metric-orbit-progress), rgba(6, 18, 27, 0.94) 0);
    box-shadow: 0 0 32px rgba(226, 189, 120, 0.2), inset 0 0 20px rgba(0, 0, 0, 0.42);
    transform: translate3d(-50%, -50%, 108px);
    animation: metricOrbitCore 3s ease-in-out infinite;
    animation-delay: 650ms;
  }

  .company-metrics .metric-focus > strong {
    position: absolute;
    z-index: 22;
    top: 88px;
    left: 50%;
    display: flex;
    width: auto;
    min-height: 0;
    margin: 0;
    align-items: center;
    justify-content: center;
    font-size: var(--metric-number-size);
    line-height: 0.82;
    transform: translate(-50%, -50%);
  }

  .company-metrics .metric-number-lockup {
    position: relative;
    inset: auto;
    display: flex;
    width: max-content;
    align-items: flex-end;
    justify-content: center;
    transform: scaleX(var(--metric-number-scale));
    transform-origin: center;
  }

  .company-metrics #metricFocusNumber {
    padding-block: 0.08em 0.12em;
    padding-inline-end: 0.14em;
    overflow: visible;
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.44)) drop-shadow(0 0 22px rgba(226, 189, 120, 0.12));
  }

  .company-metrics .metric-focus > strong small {
    margin: 0 0 0.08em -0.38em;
  }

  .company-metrics .metric-focus > strong::before,
  .company-metrics .metric-focus > strong::after {
    display: none;
  }

  .company-metrics .metric-focus h4 {
    position: absolute;
    z-index: 24;
    right: 32px;
    bottom: 82px;
    left: 32px;
    margin: 0;
    font-size: clamp(23px, 1.9vw, 29px);
    text-align: center;
  }

  .company-metrics .metric-focus > p {
    position: absolute;
    z-index: 24;
    right: 38px;
    bottom: 28px;
    left: 38px;
    max-width: none;
    margin: 0;
    font-size: 10.5px;
    line-height: 1.62;
    text-align: center;
  }

  .company-metrics .metric-signal-bars,
  .company-metrics .metric-focus-progress {
    display: none;
  }

  .company-metrics .metric-focus.is-switching {
    opacity: 0.72;
    transform: translate3d(0, 5px, 0);
  }

  .company-metrics .metric-focus.is-switching .metric-orbit-plane {
    transform: rotateX(61deg) rotateZ(7deg) scale(0.75);
  }

  .company-metrics .metric-focus.is-switching .metric-orbit-ring {
    filter: brightness(1.35) saturate(1.14);
  }

  @keyframes metricOrbitMain {
    0%, 100% { transform: translate3d(-50%, -50%, 72px); }
    50% { transform: translate3d(-50%, -47%, 86px); }
  }

  @keyframes metricOrbitSecond {
    0%, 100% { transform: translate3d(-50%, -50%, 25px); }
    50% { transform: translate3d(-50%, -43%, 39px); }
  }

  @keyframes metricOrbitThird {
    0%, 100% { transform: translate3d(-50%, -50%, -18px); }
    50% { transform: translate3d(-50%, -38%, -4px); }
  }

  @keyframes metricOrbitBase {
    0%, 100% { transform: translate3d(-50%, -50%, -72px); }
    50% { transform: translate3d(-50%, -44%, -58px); }
  }

  @keyframes metricOrbitCore {
    0%, 100% { transform: translate3d(-50%, -50%, 108px) scale(1); }
    50% { transform: translate3d(-50%, -45%, 122px) scale(1.06); }
  }
}

@media (min-width: 1181px) and (prefers-reduced-motion: reduce) {
  .company-metrics .metric-orbit-plane,
  .company-metrics .metric-orbit-ring {
    transition: none !important;
    animation: none !important;
  }
}
