:root{
      --ring: rgba(23, 43, 77, .06);
      --icon-bg: #eef2ff;
      --icon-fg: #4f46e5;
    }
    .section-orbit{
      padding: 5rem 0 6rem;
    }
    .lead-sm{ font-size: 1.05rem; color: #6b7280; }

    /* center art + rings */
    .orbit-wrap{
      position: relative;
      max-width: 680px;
      margin-inline: auto;
      aspect-ratio: 1/1;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background:
        radial-gradient(closest-side, #fff 55%, transparent 56%) center/100% 100% no-repeat;
    }
    .orbit-wrap::before,
    .orbit-wrap::after{
      content:"";
      position:absolute; inset: 6% 6%;
      border-radius:50%;
      border: 1px solid var(--ring);
    }
    .orbit-wrap::after{
      inset: 0;
      border-width: 2px;
    }
    .tooth{
      width: 66%;
      max-width: 420px;
      filter: drop-shadow(0 12px 25px rgba(0,0,0,.08));
    }

    /* feature items */
    .feature{
      max-width: 320px;
    }
    .icon-circle{
      width: 56px; height: 56px;
      display: grid; place-items: center;
      border-radius: 50%;
      background: var(--icon-bg);
      color: var(--icon-fg);
      box-shadow: 0 6px 18px rgba(79,70,229,.12);
      flex: 0 0 56px;
    }
    .feature h6{ margin: 0; font-weight: 700; }
    .feature p{ margin: .25rem 0 0; color: #6b7280; }

    /* nice spacing on wide screens */
    @media (min-width: 992px){
      .col-features { gap: 2.5rem; }
      .feature { margin: 1rem 0; }
    }

    /* subtle dark-mode support */
    @media (prefers-color-scheme: dark){
      :root{ --ring: rgba(255,255,255,.08); --icon-bg:#272a3a; --icon-fg:#a5b4fc; }
      body{ background:#0b0e13; color:#e5e7eb; }
      .lead-sm, .feature p{ color:#9ca3af; }
      .orbit-wrap{ background: radial-gradient(closest-side, #0b0e13 55%, transparent 56%); }
    }