.oss-section {
  --oss-radius-desktop: 320px;
  --oss-radius-tablet: 240px;
  --oss-radius-mobile: 165px;
  --oss-radius-wide: 400px;
  --oss-item-small: 150px;
  --oss-item-medium: 190px;
  --oss-item-large: 220px;
  --oss-item-xl: 260px;
  --oss-content-max: 680px;
  --oss-end-logo-max: 420px;
  --oss-sequence-font-desktop: 52px;
  --oss-sequence-font-tablet: 40px;
  --oss-sequence-font-mobile: 30px;
  --oss-end-kicker-font-desktop: 32px;
  --oss-end-kicker-font-mobile: 22px;
  --oss-section-bg: transparent;
  --oss-text-color: #0f172a;
  --oss-muted-color: color-mix(in srgb, var(--oss-text-color) 72%, transparent);
  --oss-panel-bg: rgba(255, 255, 255, 0.76);
  --oss-card-bg: rgba(255, 255, 255, 0.68);
  --oss-card-border: rgba(15, 23, 42, 0.08);
  --oss-card-shadow: 0 18px 60px rgba(15, 23, 42, 0.12);
  --oss-accent-color: #60a5fa;
  position: relative;
  overflow: clip;
  padding: clamp(56px, 8vw, 120px) 0;
  background: var(--oss-section-bg);
  color: var(--oss-text-color);
}

.oss-section *,
.oss-section *::before,
.oss-section *::after {
  box-sizing: border-box;
}

.oss-theme-dark {
  --oss-text-color: #f8fafc;
  --oss-muted-color: rgba(248, 250, 252, 0.82);
  --oss-panel-bg: rgba(15, 23, 42, 0.66);
  --oss-card-bg: rgba(15, 23, 42, 0.56);
  --oss-card-border: rgba(255, 255, 255, 0.12);
  --oss-card-shadow: 0 22px 70px rgba(2, 6, 23, 0.35);
}

.oss-section__inner {
  width: min(1440px, 92vw);
  margin: 0 auto;
}

.oss-stage {
  position: relative;
  display: grid;
  place-items: center;
  min-height: min(100svh, 980px);
  isolation: isolate;
}

.oss-center {
  position: relative;
  z-index: 3;
  margin-inline: auto;
  width: min(var(--oss-content-max), 92vw);
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid color-mix(in srgb, var(--oss-text-color) 10%, transparent);
  border-radius: 28px;
  text-align: center;
  background: var(--oss-panel-bg);
  backdrop-filter: blur(10px);
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
}

.oss-center--sequence {
  width: min(var(--oss-content-max), 92vw);
  min-height: clamp(160px, 18vw, 240px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.oss-sequence {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(160px, 18vw, 240px);
}

.oss-sequence__message,
.oss-sequence__end {
  position: absolute;
  inset: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 0;
  text-align: center;
  pointer-events: none;
}

.oss-sequence__line {
  width: 100%;
  margin: 0;
  text-align: center;
}

.oss-sequence__line-inner,
.oss-sequence__end-kicker {
  display: inline-block;
  max-width: 100%;
  margin-inline: auto;
  font-size: var(--oss-sequence-font-desktop);
  font-weight: 600;
  line-height: 1.16;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

.oss-sequence__end-kicker {
  font-size: var(--oss-end-kicker-font-desktop);
  margin-bottom: clamp(14px, 2vw, 24px);
}

.oss-word {
  display: inline-block;
  opacity: 0;
  will-change: transform, opacity;
}

.oss-accent {
  color: var(--oss-accent-color);
}

.oss-sequence__logo-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(var(--oss-end-logo-max), 82vw);
  max-width: 100%;
  flex: 0 1 auto;
  margin-inline: auto;
  margin-block: 0;
  opacity: 0;
  transform-origin: center center;
  visibility: visible;
  overflow: visible;
}

.oss-sequence__logo-wrap > * {
  display: block;
  width: 100%;
  max-width: 100%;
  flex: 0 1 auto;
}

.oss-sequence__logo-image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
  opacity: 1;
  visibility: visible;
}

.oss-eyebrow {
  margin: 0 0 12px;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--oss-muted-color);
}

.oss-title {
  margin: 0;
  font-size: clamp(2rem, 3.5vw, 4rem);
  line-height: 1;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.oss-copy {
  margin-top: 18px;
  color: var(--oss-muted-color);
  font-size: clamp(1rem, 1.2vw, 1.15rem);
  line-height: 1.65;
}

.oss-copy p {
  margin: 0;
}

.oss-copy p + p {
  margin-top: 0.9em;
}

.oss-actions {
  margin-top: 22px;
}

.oss-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  background: var(--oss-text-color);
  color: color-mix(in srgb, var(--oss-panel-bg) 15%, white 85%);
  text-decoration: none;
  font-weight: 700;
}

.oss-theme-dark .oss-button {
  color: #020617;
  background: #ffffff;
}

.oss-orbit {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
  width: min(960px, 100%);
  margin-top: clamp(28px, 5vw, 56px);
}

.oss-item {
  position: relative;
  margin: 0 auto;
  width: min(100%, var(--oss-item-medium));
  transform-origin: center center;
}

.oss-item--small { width: min(100%, var(--oss-item-small)); }
.oss-item--medium { width: min(100%, var(--oss-item-medium)); }
.oss-item--large { width: min(100%, var(--oss-item-large)); }
.oss-item--xl { width: min(100%, var(--oss-item-xl)); }

.oss-item__link {
  display: block;
  text-decoration: none;
}

.oss-item__card {
  position: relative;
  border: 1px solid var(--oss-card-border);
  overflow: hidden;
  background: var(--oss-card-bg);
  box-shadow: var(--oss-card-shadow);
  backface-visibility: hidden;
  transform: translateZ(0);
}

.oss-item__card--card {
  border-radius: 24px;
}

.oss-item__card--circle {
  border-radius: 999px;
}

.oss-item__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.oss-item__card--card .oss-item__image {
  aspect-ratio: 4 / 5;
}

.oss-item__card--circle .oss-item__image {
  aspect-ratio: 1 / 1;
}

.oss-item__label {
  position: absolute;
  inset-inline-start: 16px;
  inset-block-end: 16px;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.8);
  color: #ffffff;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1;
  backdrop-filter: blur(6px);
}

.oss-shape-circle .oss-item__label {
  display: none;
}

.oss-theme-dark .oss-item__label {
  background: rgba(255, 255, 255, 0.88);
  color: #020617;
}

.oss-section.oss-ready {
  min-height: 100svh;
  padding: 0;
}

.oss-section.oss-ready .oss-section__inner {
  width: 100%;
}

.oss-section.oss-ready .oss-stage {
  min-height: 100svh;
}

.oss-section.oss-ready .oss-orbit {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  pointer-events: none;
}

.oss-section.oss-ready .oss-item {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  pointer-events: auto;
}

.oss-section.oss-ready .oss-center {
  max-width: min(var(--oss-content-max), 44vw);
}

.oss-section.oss-ready .oss-center--sequence {
  max-width: min(var(--oss-content-max), 68vw);
}

@media (min-width: 1280px) {
  .oss-section.oss-ready .oss-center {
    max-width: min(var(--oss-content-max), 40vw);
  }

  .oss-section.oss-ready .oss-center--sequence {
    max-width: min(var(--oss-content-max), 64vw);
  }
}

@media (max-width: 1024px) {
  .oss-stage {
    gap: 18px;
  }

  .oss-section.oss-ready .oss-center {
    max-width: min(var(--oss-content-max), 72vw);
  }

  .oss-section.oss-ready .oss-center--sequence {
    max-width: min(var(--oss-content-max), 78vw);
  }

  .oss-sequence__line-inner {
    font-size: var(--oss-sequence-font-tablet);
  }

  .oss-sequence__end-kicker {
    font-size: clamp(var(--oss-end-kicker-font-mobile), 3vw, var(--oss-end-kicker-font-desktop));
  }

  .oss-sequence__logo-wrap {
    max-width: min(var(--oss-end-logo-max), 70vw);
  }
}

@media (max-width: 767px) {
  .oss-section {
    padding: 0;
  }

  .oss-section__inner {
    width: min(94vw, 720px);
  }

  .oss-section.oss-ready .oss-center {
    max-width: 88vw;
  }

  .oss-section.oss-ready .oss-center--sequence {
    max-width: 90vw;
    min-height: 132px;
  }

  .oss-sequence {
    min-height: 132px;
  }

  .oss-sequence__line-inner {
    font-size: var(--oss-sequence-font-mobile);
    line-height: 1.22;
  }

  .oss-sequence__end-kicker {
    font-size: var(--oss-end-kicker-font-mobile);
    line-height: 1.22;
    margin-bottom: 12px;
  }

  .oss-sequence__logo-wrap {
    max-width: min(var(--oss-end-logo-max), 74vw);
  }

  .oss-section {
    --oss-item-small: 88px;
    --oss-item-medium: 108px;
    --oss-item-large: 128px;
    --oss-item-xl: 144px;
  }

  /* v1.10.7: keep all orbit items visible on mobile.
     Previous stable builds hid items after #7/#6 on small screens, which could make
     the mobile orbit settle as a partial cluster instead of a complete oval. */
}

@media (max-width: 479px) {
  .oss-sequence__line-inner {
    font-size: min(var(--oss-sequence-font-mobile), 1.6rem);
  }

  .oss-sequence__end-kicker {
    font-size: min(var(--oss-end-kicker-font-mobile), 1.3rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .oss-stage {
    position: relative;
  }

  .oss-item,
  .oss-center,
  .oss-word,
  .oss-sequence__message,
  .oss-sequence__end,
  .oss-sequence__logo-wrap {
    transform: none !important;
    opacity: 1 !important;
  }
}
