/* Product universe v7: structured capability cockpits and a restrained future-system atmosphere. */
.mp-capabilities-section--universe {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(circle at 12% 18%, rgba(56, 197, 255, .075), transparent 24%),
    radial-gradient(circle at 82% 38%, rgba(111, 79, 255, .09), transparent 29%),
    radial-gradient(circle at 52% 88%, rgba(30, 221, 177, .045), transparent 22%);
}

.mp-capabilities-section--universe::before,
.mp-capabilities-section--universe::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.mp-capabilities-section--universe::before {
  inset: 0;
  opacity: .42;
  background-image:
    radial-gradient(circle, rgba(150, 192, 255, .65) 0 1px, transparent 1.4px),
    radial-gradient(circle, rgba(105, 229, 255, .48) 0 1px, transparent 1.3px);
  background-position: 0 0, 71px 43px;
  background-size: 137px 137px, 191px 191px;
  mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
  animation: capabilityStars 36s linear infinite;
}

.mp-capabilities-section--universe::after {
  width: min(74vw, 1120px);
  aspect-ratio: 2.4;
  top: 31%;
  left: 50%;
  border: 1px solid rgba(102, 138, 255, .09);
  border-radius: 50%;
  transform: translateX(-50%) rotate(-7deg);
  box-shadow: 0 0 0 54px rgba(79, 96, 255, .018), 0 0 0 108px rgba(44, 209, 255, .012);
  animation: capabilityOrbit 14s ease-in-out infinite alternate;
}

.mp-capabilities-section--universe .lp-container {
  position: relative;
  z-index: 1;
}

.mp-capabilities-section--universe .mp-capability-card {
  backdrop-filter: blur(16px);
  background:
    linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.012)),
    rgba(8, 11, 21, .78);
}

.mp-capabilities-section--universe .mp-capability-card > em {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
}

/* Keep every cockpit on the same baseline, independent of copy length. */
.mp-capabilities-section--universe .mp-capability-visual {
  display: flex;
  min-height: 109px;
  flex-direction: column;
  justify-content: flex-end;
}

.capability-progress__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  color: #8b96ad;
  font-size: .54rem;
}

.capability-progress__meta strong {
  color: #dfe7ff;
  font: 600 .58rem "JetBrains Mono", monospace;
}

.capability-progress > span {
  flex: none;
}

.capability-progress small {
  margin-top: 10px;
}

.capability-governance {
  gap: 6px;
}

.capability-governance > span {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 29px;
  padding: 6px 9px;
  border: 1px solid rgba(128, 148, 255, .15);
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(40, 50, 91, .34), rgba(9, 13, 25, .82));
}

.capability-governance > span:nth-child(2) {
  border-color: rgba(64, 205, 255, .18);
  transform: translateX(5px);
}

.capability-governance > span:nth-child(3) {
  border-color: rgba(49, 218, 174, .17);
  transform: translateX(10px);
}

.capability-governance i {
  color: #5fd5ff;
  font: 600 .46rem "JetBrains Mono", monospace;
  font-style: normal;
  letter-spacing: .08em;
}

.capability-governance b {
  min-width: 0;
  overflow: hidden;
  color: #dbe2f4;
  font-size: .55rem;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.capability-governance small {
  color: #6f7b95;
  font-size: .47rem;
  white-space: nowrap;
}

.capability-chain {
  gap: 12px;
  padding-top: 22px;
}

.capability-chain::before,
.capability-chain > i,
.capability-chain > span {
  display: none;
}

.capability-chain__status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #7e8aa2;
  font-size: .52rem;
}

.capability-chain__status span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #55dbb8;
}

.capability-chain__status span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2dd7ad;
  box-shadow: 0 0 0 5px rgba(45, 215, 173, .08), 0 0 13px rgba(45, 215, 173, .68);
  animation: chainHealth 2.2s ease-in-out infinite;
}

.capability-chain__status strong {
  color: #d9e1f3;
  font: 600 .54rem "JetBrains Mono", monospace;
}

.capability-chain__track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  align-items: start;
  padding-top: 8px;
}

.capability-chain__track::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 7px;
  right: 7px;
  height: 1px;
  background: linear-gradient(90deg, #5b63ff, #48cfff 55%, #2dd7ad);
  background-size: 200% 100%;
  animation: chainFlow 3s linear infinite;
}

.capability-chain__track i {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 8px;
  color: #6f7a91;
  font-size: .42rem;
  font-style: normal;
  width: auto;
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  flex: initial;
}

.capability-chain__track i::before {
  content: "";
  width: 10px;
  height: 10px;
  border: 2px solid #151a2b;
  border-radius: 50%;
  background: #7073ff;
  box-shadow: 0 0 12px rgba(99, 109, 255, .55);
}

.capability-chain__track i::after {
  content: attr(data-event);
}

.capability-chain__track i:last-child::before {
  background: #34d7ad;
  box-shadow: 0 0 14px rgba(52, 215, 173, .62);
}

@keyframes capabilityStars {
  to { background-position: 137px 68px, -120px 234px; }
}

@keyframes capabilityOrbit {
  to { transform: translateX(-50%) rotate(-3deg) scale(1.045); opacity: .7; }
}

@keyframes chainFlow {
  to { background-position: -200% 0; }
}

@keyframes chainHealth {
  50% { transform: scale(.78); box-shadow: 0 0 0 8px rgba(45, 215, 173, 0), 0 0 17px rgba(45, 215, 173, .7); }
}

@media (max-width: 760px) {
  .capability-governance > span:nth-child(2),
  .capability-governance > span:nth-child(3) { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .mp-capabilities-section--universe::before,
  .mp-capabilities-section--universe::after,
  .capability-chain__status span i,
  .capability-chain__track::before { animation: none !important; }
}

/* Cosmic universe v8: restore each cockpit's native layout and add visible depth. */
.cosmic-universe {
  background:
    radial-gradient(circle at 14% 22%, rgba(18, 142, 197, .11), transparent 28%),
    radial-gradient(circle at 82% 16%, rgba(92, 68, 214, .13), transparent 31%),
    #050710;
}

.cosmic-universe #main-content {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.cosmic-universe #main-content::before,
.cosmic-universe #main-content::after {
  content: "";
  position: fixed;
  z-index: 0;
  pointer-events: none;
}

.cosmic-universe #main-content::before {
  inset: 72px 0 0;
  opacity: .68;
  background-image:
    radial-gradient(circle, rgba(219, 232, 255, .95) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(91, 210, 255, .82) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(155, 119, 255, .74) 0 1.2px, transparent 1.8px);
  background-position: 7px 17px, 73px 91px, 151px 39px;
  background-size: 173px 173px, 241px 241px, 317px 317px;
  animation: universeDrift 70s linear infinite;
}

.cosmic-universe #main-content::after {
  width: min(78vw, 1280px);
  aspect-ratio: 1;
  top: 12vh;
  right: -31vw;
  border: 1px solid rgba(105, 132, 255, .16);
  border-radius: 50%;
  background:
    radial-gradient(circle at 42% 46%, transparent 0 30%, rgba(72, 111, 255, .08) 43%, transparent 61%),
    conic-gradient(from 35deg, transparent, rgba(54, 210, 255, .10), transparent 26%, rgba(119, 74, 255, .11), transparent 58%);
  box-shadow:
    0 0 0 90px rgba(58, 83, 210, .025),
    0 0 0 180px rgba(53, 200, 255, .015),
    0 0 180px rgba(70, 74, 220, .18);
  animation: universeOrbit 28s ease-in-out infinite alternate;
}

.cosmic-universe #main-content > * {
  position: relative;
  z-index: 1;
}

.mp-capabilities-section--universe {
  border-block: 1px solid rgba(105, 132, 255, .10);
  background:
    radial-gradient(ellipse at 8% 17%, rgba(29, 184, 235, .16), transparent 32%),
    radial-gradient(ellipse at 88% 29%, rgba(111, 70, 255, .18), transparent 38%),
    radial-gradient(ellipse at 52% 88%, rgba(30, 221, 177, .075), transparent 29%),
    linear-gradient(180deg, rgba(5, 8, 18, .78), rgba(7, 8, 21, .94));
  box-shadow: inset 0 80px 150px rgba(14, 33, 75, .14), inset 0 -90px 150px rgba(29, 14, 74, .11);
}

.mp-capabilities-section--universe::before {
  opacity: .82;
  background-size: 113px 113px, 179px 179px;
}

.mp-capabilities-section--universe::after {
  border-color: rgba(102, 138, 255, .20);
  box-shadow: 0 0 0 54px rgba(79, 96, 255, .04), 0 0 0 108px rgba(44, 209, 255, .025), 0 0 120px rgba(84, 74, 255, .12);
}

.mp-capabilities-section--universe .mp-capability-card {
  background:
    radial-gradient(circle at 100% 0, rgba(94, 99, 255, .085), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.047), rgba(255,255,255,.012)),
    rgba(7, 10, 21, .86);
  box-shadow: inset 0 1px rgba(255,255,255,.025), 0 22px 70px rgba(0,0,0,.20);
}

/* Undo the generic column layout so every visual regains its intended structure. */
.mp-capabilities-section--universe .mp-capability-visual {
  display: block;
  min-height: 109px;
  flex-direction: initial;
  justify-content: initial;
}

.mp-capabilities-section--universe .capability-kpis,
.mp-capabilities-section--universe .capability-law,
.mp-capabilities-section--universe .capability-matrix,
.mp-capabilities-section--universe .capability-terminal,
.mp-capabilities-section--universe .capability-proofs {
  display: grid;
}

.mp-capabilities-section--universe .capability-tree,
.mp-capabilities-section--universe .capability-queue,
.mp-capabilities-section--universe .capability-pipeline,
.mp-capabilities-section--universe .capability-anchor {
  display: flex;
  flex-direction: row;
  justify-content: initial;
}

.mp-capabilities-section--universe .capability-progress,
.mp-capabilities-section--universe .capability-governance,
.mp-capabilities-section--universe .capability-chain {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.capability-chain__status span {
  position: static;
  top: auto;
}

.capability-chain .capability-chain__track i:last-of-type {
  margin-right: 0;
  background: none;
}

@keyframes universeDrift {
  to { background-position: 346px 173px, -241px 332px, 468px -317px; }
}

@keyframes universeOrbit {
  to { transform: translate(-5vw, 4vh) rotate(13deg) scale(1.08); opacity: .78; }
}

@media (max-width: 760px) {
  .cosmic-universe #main-content::after {
    width: 145vw;
    right: -88vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cosmic-universe #main-content::before,
  .cosmic-universe #main-content::after { animation: none !important; }
}

/* Keep the cosmic atmosphere above the section background and behind content. */
.mp-capabilities-section--universe::before,
.mp-capabilities-section--universe::after {
  z-index: 0;
}

/* Cosmic product and home polish v9. */
.mp-capabilities-section--universe {
  overflow: hidden;
}

.mp-capabilities-section--universe .lp-container::before,
.mp-capabilities-section--universe .lp-container::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
}

/* A visible Milky-Way band crossing the architecture instead of a flat gradient. */
.mp-capabilities-section--universe .lp-container::before {
  top: 155px;
  left: -18%;
  width: 136%;
  height: 720px;
  opacity: .88;
  transform: rotate(-8deg);
  background:
    radial-gradient(ellipse at 18% 52%, rgba(57, 215, 255, .25), transparent 19%),
    radial-gradient(ellipse at 43% 48%, rgba(86, 112, 255, .24), transparent 25%),
    radial-gradient(ellipse at 70% 54%, rgba(142, 72, 255, .26), transparent 23%),
    radial-gradient(ellipse at 92% 45%, rgba(53, 204, 231, .19), transparent 17%),
    linear-gradient(180deg, transparent 24%, rgba(74, 102, 255, .11) 43%, rgba(135, 73, 255, .13) 54%, transparent 74%);
  filter: blur(24px) saturate(125%);
  animation: galaxyBreathe 12s ease-in-out infinite alternate;
}

.mp-capabilities-section--universe .lp-container::after {
  top: 85px;
  right: -190px;
  width: 560px;
  aspect-ratio: 1;
  border: 1px solid rgba(114, 145, 255, .23);
  border-radius: 50%;
  opacity: .7;
  background: radial-gradient(circle at 38% 38%, rgba(82, 205, 255, .08), transparent 47%);
  box-shadow:
    0 0 0 58px rgba(70, 103, 255, .035),
    0 0 0 116px rgba(134, 73, 255, .023),
    0 0 150px rgba(65, 102, 255, .19);
  animation: architecturePlanet 18s ease-in-out infinite alternate;
}

.mp-capabilities-section--universe :is(.lp-section-head, .mp-capability-grid) {
  position: relative;
  z-index: 1;
}

/* WaveChain becomes a real, readable animated cockpit. */
.mp-capabilities-section--universe .capability-chain {
  min-height: 138px;
  gap: 20px;
  padding: 18px 18px 15px;
  border: 1px solid rgba(91, 119, 255, .15);
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 110%, rgba(56, 211, 255, .08), transparent 55%),
    rgba(5, 9, 19, .54);
}

.mp-capabilities-section--universe .capability-chain__status {
  width: 100%;
  font-size: .61rem;
}

.mp-capabilities-section--universe .capability-chain__status span {
  gap: 9px;
  font-weight: 600;
}

.mp-capabilities-section--universe .capability-chain__status span i {
  width: 8px;
  height: 8px;
  box-shadow: 0 0 0 6px rgba(45, 215, 173, .09), 0 0 18px rgba(45, 215, 173, .78);
}

.mp-capabilities-section--universe .capability-chain__status strong {
  font-size: .63rem;
}

.mp-capabilities-section--universe .capability-chain__track {
  width: 100%;
  padding-top: 10px;
}

.mp-capabilities-section--universe .capability-chain__track::before {
  top: 17px;
  left: 10px;
  right: 10px;
  height: 2px;
  box-shadow: 0 0 16px rgba(75, 154, 255, .38);
}

.mp-capabilities-section--universe .capability-chain__track::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 13px;
  left: 7px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #65e7d0;
  box-shadow: 0 0 16px rgba(101, 231, 208, .95);
  animation: chainPacketLarge 3.6s linear infinite;
}

.mp-capabilities-section--universe .capability-chain__track i {
  gap: 10px;
  font-size: .5rem;
}

.mp-capabilities-section--universe .capability-chain__track i::before {
  width: 14px;
  height: 14px;
  border-width: 3px;
  box-shadow: 0 0 17px rgba(99, 109, 255, .7);
}

/* Filled operational previews for every home platform surface. */
.surface-workhub,
.surface-law,
.surface-ai,
.surface-actions {
  margin-top: auto;
  margin-bottom: 18px;
}

.surface-workhub > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
  color: #8f99b0;
  font-size: .64rem;
}

.surface-workhub strong {
  color: #eaf0ff;
  font: 650 .68rem "JetBrains Mono", monospace;
}

.surface-workhub > i {
  display: block;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, .065);
}

.surface-workhub > i b {
  display: block;
  width: 92%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #40cff5, #677bff 58%, #9068ff);
  box-shadow: 0 0 18px rgba(100, 112, 255, .45);
  animation: workhubProgress 4.5s ease-in-out infinite alternate;
}

.surface-workhub small {
  display: block;
  margin-top: 8px;
  color: #727e96;
  font-size: .57rem;
}

.surface-law {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
}

.surface-law span {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(104, 126, 255, .17);
  border-radius: 11px;
  background: rgba(255, 255, 255, .024);
  color: #a8b0c4;
  font-size: .61rem;
}

.surface-law b {
  color: #50d5ff;
  font: 650 .56rem "JetBrains Mono", monospace;
}

.surface-law i {
  width: 22px;
  height: 1px;
  background: linear-gradient(90deg, #48d2ff, #8270ff);
}

.surface-ai {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.surface-ai span {
  min-width: 0;
  padding: 10px 5px;
  border: 1px solid rgba(108, 128, 255, .16);
  border-radius: 10px;
  background: rgba(61, 78, 149, .08);
  text-align: center;
}

.surface-ai span:nth-child(2) { background: rgba(210, 145, 53, .08); }
.surface-ai span:nth-child(3) { background: rgba(48, 202, 166, .08); }
.surface-ai span:nth-child(4) { background: rgba(53, 164, 229, .08); }

.surface-ai b,
.surface-ai small {
  display: block;
}

.surface-ai b {
  color: #dfe6ff;
  font: 650 .72rem "JetBrains Mono", monospace;
}

.surface-ai small {
  margin-top: 5px;
  overflow: hidden;
  color: #77839a;
  font-size: .48rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.surface-actions {
  display: grid;
  gap: 6px;
}

.surface-actions span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 29px;
  padding: 6px 9px;
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 8px;
  background: rgba(255, 255, 255, .022);
}

.surface-actions b { font-size: .58rem; font-weight: 600; }
.surface-actions small { color: #7c879d; font-size: .51rem; }
.surface-actions .critical b { color: #ff7081; }
.surface-actions .warning b { color: #f0b75a; }
.surface-actions .tracking b { color: #4fd7f3; }

.dpoaf-robok-theme .lp-platform-card > :is(
  .lp-card-metrics, .surface-mini-stack, .surface-proof-types, .surface-chain,
  .lp-proof-strip, .surface-workhub, .surface-law, .surface-ai, .surface-actions
) + .lp-card-link {
  margin-top: 0;
}

@keyframes chainPacketLarge {
  from { left: 7px; }
  to { left: calc(100% - 16px); }
}

@keyframes galaxyBreathe {
  to { transform: translateY(42px) rotate(-5deg) scale(1.05); opacity: .72; }
}

@keyframes architecturePlanet {
  to { transform: translate(-42px, 35px) rotate(8deg) scale(1.06); opacity: .5; }
}

@keyframes workhubProgress {
  from { width: 72%; }
  to { width: 92%; }
}

@media (max-width: 760px) {
  .mp-capabilities-section--universe .lp-container::before {
    left: -55%;
    width: 210%;
  }
  .mp-capabilities-section--universe .lp-container::after {
    right: -390px;
  }
  .surface-law { grid-template-columns: 1fr; }
  .surface-law i { width: 1px; height: 14px; margin-left: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .mp-capabilities-section--universe .lp-container::before,
  .mp-capabilities-section--universe .lp-container::after,
  .mp-capabilities-section--universe .capability-chain__track::after,
  .surface-workhub > i b { animation: none !important; }
}

/* Product architecture solar galaxy v10. */
.mp-capabilities-section--universe {
  isolation: isolate;
  min-height: 2550px;
  background:
    radial-gradient(circle at 13% 10%, rgba(12, 185, 224, .12), transparent 25%),
    radial-gradient(circle at 82% 13%, rgba(91, 64, 232, .17), transparent 31%),
    radial-gradient(circle at 54% 58%, rgba(29, 88, 160, .09), transparent 34%),
    linear-gradient(180deg, #030710 0%, #060817 36%, #040711 100%);
}

.mp-capabilities-section--universe::before {
  z-index: 0;
  opacity: .88;
  background-image:
    radial-gradient(circle, rgba(210, 236, 255, .92) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(97, 209, 255, .82) 0 1px, transparent 1.4px),
    radial-gradient(circle, rgba(149, 117, 255, .72) 0 1px, transparent 1.35px),
    radial-gradient(circle, rgba(255, 255, 255, .38) 0 .7px, transparent 1.15px);
  background-position: 0 0, 94px 137px, 221px 43px, 39px 92px;
  background-size: 289px 263px, 337px 311px, 419px 367px, 151px 173px;
  animation: architectureStarDrift 90s linear infinite;
}

.mp-capabilities-section--universe::after {
  z-index: 0;
  inset: 5% -18% auto -22%;
  height: 880px;
  border: 0;
  border-radius: 50%;
  opacity: .7;
  transform: rotate(-11deg);
  background:
    radial-gradient(ellipse at 13% 48%, rgba(43, 220, 249, .18), transparent 18%),
    radial-gradient(ellipse at 43% 52%, rgba(58, 98, 255, .18), transparent 25%),
    radial-gradient(ellipse at 72% 46%, rgba(144, 70, 255, .21), transparent 23%),
    linear-gradient(180deg, transparent 30%, rgba(70, 124, 255, .09) 43%, rgba(124, 61, 255, .14) 54%, transparent 70%);
  filter: blur(28px) saturate(145%);
  animation: architectureNebulaDrift 18s ease-in-out infinite alternate;
}

.mp-capabilities-section--universe .lp-container::before,
.mp-capabilities-section--universe .lp-container::after {
  display: none;
}

.architecture-cosmos {
  position: absolute;
  z-index: 0;
  top: 72px;
  right: -110px;
  width: min(860px, 58vw);
  height: 780px;
  pointer-events: none;
  perspective: 1000px;
}

.architecture-nebula {
  position: absolute;
  inset: 8% 0 4%;
  border-radius: 50%;
  opacity: .72;
  transform: rotate(-12deg);
  background:
    radial-gradient(ellipse at 42% 48%, rgba(75, 220, 255, .21), transparent 18%),
    radial-gradient(ellipse at 59% 51%, rgba(100, 93, 255, .24), transparent 26%),
    radial-gradient(ellipse at 74% 48%, rgba(174, 77, 255, .18), transparent 21%);
  filter: blur(28px);
  animation: solarNebulaPulse 11s ease-in-out infinite alternate;
}

.architecture-sun {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  width: 112px;
  height: 112px;
  border: 1px solid rgba(150, 230, 255, .62);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 34% 32%, #f2fcff 0 5%, #7ce7ff 16%, #4f8eff 39%, #6653ff 63%, #1a1f69 78%, rgba(15, 18, 67, .05) 100%);
  box-shadow:
    0 0 20px rgba(122, 227, 255, .95),
    0 0 70px rgba(78, 135, 255, .72),
    0 0 145px rgba(103, 75, 255, .52),
    0 0 240px rgba(66, 156, 255, .26);
  animation: architectureSunPulse 5.5s ease-in-out infinite alternate;
}

.architecture-sun::before,
.architecture-sun::after,
.architecture-sun i {
  content: "";
  position: absolute;
  inset: -19px;
  border: 1px solid rgba(111, 197, 255, .18);
  border-radius: 50%;
  animation: solarCorona 12s linear infinite;
}

.architecture-sun::after {
  inset: -34px;
  border-style: dashed;
  border-color: rgba(131, 105, 255, .18);
  animation-direction: reverse;
  animation-duration: 17s;
}

.architecture-sun i {
  inset: 14px;
  border: 0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.5), transparent 12%);
}

.architecture-orbit {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(113, 148, 255, .2);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-12deg);
  box-shadow: inset 0 0 28px rgba(64, 118, 255, .025), 0 0 26px rgba(69, 115, 255, .035);
}

.architecture-orbit::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-top: 1px solid rgba(87, 218, 255, .38);
  border-right: 1px solid transparent;
  border-bottom: 1px solid rgba(140, 94, 255, .17);
  border-left: 1px solid transparent;
  border-radius: inherit;
}

.architecture-orbit--one { width: 250px; height: 128px; animation: architectureOrbitOne 10s linear infinite; }
.architecture-orbit--two { width: 390px; height: 202px; animation: architectureOrbitTwo 17s linear infinite reverse; }
.architecture-orbit--three { width: 555px; height: 292px; animation: architectureOrbitThree 25s linear infinite; }
.architecture-orbit--four { width: 730px; height: 390px; animation: architectureOrbitFour 36s linear infinite reverse; }

.architecture-planet {
  position: absolute;
  top: 50%;
  right: -7px;
  display: block;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255,255,255,.55);
  border-radius: 50%;
  transform: translateY(-50%);
}

.architecture-planet--cyan {
  background: radial-gradient(circle at 35% 30%, #e6ffff, #4ee3ec 34%, #147f9c 75%);
  box-shadow: 0 0 16px rgba(71, 229, 238, .95), 0 0 38px rgba(61, 210, 238, .42);
}

.architecture-planet--violet {
  width: 21px;
  height: 21px;
  right: -10px;
  background: radial-gradient(circle at 35% 30%, #f4e9ff, #ad74ff 32%, #592ca4 76%);
  box-shadow: 0 0 20px rgba(174, 105, 255, .9), 0 0 48px rgba(127, 74, 255, .4);
}

.architecture-planet--blue {
  width: 17px;
  height: 17px;
  background: radial-gradient(circle at 35% 30%, #e9f6ff, #5aa5ff 34%, #2456b4 74%);
  box-shadow: 0 0 18px rgba(85, 167, 255, .88), 0 0 42px rgba(64, 115, 255, .4);
}

.architecture-planet--ice {
  width: 11px;
  height: 11px;
  right: -5px;
  background: radial-gradient(circle at 35% 30%, #fff, #a5efff 40%, #4c8fbd 78%);
  box-shadow: 0 0 14px rgba(172, 242, 255, .88);
}

.architecture-comet {
  position: absolute;
  z-index: 3;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  opacity: 0;
  background: #e6fbff;
  box-shadow: 0 0 13px rgba(125, 225, 255, .95);
}

.architecture-comet::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 2px;
  width: 110px;
  height: 1px;
  transform-origin: right center;
  transform: rotate(-18deg);
  background: linear-gradient(90deg, transparent, rgba(91, 196, 255, .8));
}

.architecture-comet--one { top: 15%; left: 8%; animation: architectureComet 12s ease-in-out 1s infinite; }
.architecture-comet--two { top: 69%; left: 54%; animation: architectureCometTwo 17s ease-in-out 6s infinite; }

.architecture-system-label {
  position: absolute;
  z-index: 6;
  left: 50%;
  bottom: 86px;
  transform: translateX(-50%);
  color: rgba(132, 188, 255, .58);
  font: 600 .55rem/1.3 "JetBrains Mono", monospace;
  letter-spacing: .17em;
  white-space: nowrap;
}

.mp-capabilities-section--universe > .lp-container {
  position: relative;
  z-index: 2;
}

.mp-capabilities-section--universe .mp-capability-card {
  background: linear-gradient(145deg, rgba(12, 18, 35, .93), rgba(7, 10, 24, .88));
  backdrop-filter: blur(14px);
}

@keyframes architectureStarDrift {
  to { background-position: 289px 263px, -243px 448px, 640px -202px, 190px 346px; }
}

@keyframes architectureNebulaDrift {
  to { transform: translate(5%, 7%) rotate(-6deg) scale(1.08); opacity: .54; }
}

@keyframes solarNebulaPulse {
  to { transform: rotate(-6deg) scale(1.12); opacity: .52; filter: blur(38px); }
}

@keyframes architectureSunPulse {
  to { transform: translate(-50%, -50%) scale(1.08); filter: saturate(122%); }
}

@keyframes solarCorona { to { transform: rotate(360deg); } }
@keyframes architectureOrbitOne { to { transform: translate(-50%, -50%) rotate(348deg); } }
@keyframes architectureOrbitTwo { to { transform: translate(-50%, -50%) rotate(348deg); } }
@keyframes architectureOrbitThree { to { transform: translate(-50%, -50%) rotate(348deg); } }
@keyframes architectureOrbitFour { to { transform: translate(-50%, -50%) rotate(348deg); } }

@keyframes architectureComet {
  0%, 72% { opacity: 0; transform: translate(-40px, -20px); }
  76% { opacity: .95; }
  90% { opacity: .55; }
  100% { opacity: 0; transform: translate(640px, 230px); }
}

@keyframes architectureCometTwo {
  0%, 78% { opacity: 0; transform: translate(80px, 20px) rotate(180deg); }
  82% { opacity: .8; }
  100% { opacity: 0; transform: translate(-450px, -220px) rotate(180deg); }
}

@media (max-width: 900px) {
  .architecture-cosmos {
    top: 235px;
    right: -310px;
    width: 760px;
    height: 600px;
    opacity: .72;
  }
  .architecture-system-label { display: none; }
}

@media (max-width: 620px) {
  .mp-capabilities-section--universe { min-height: 0; }
  .architecture-cosmos {
    top: 310px;
    right: -430px;
    transform: scale(.78);
    transform-origin: top center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mp-capabilities-section--universe::before,
  .mp-capabilities-section--universe::after,
  .architecture-nebula,
  .architecture-sun,
  .architecture-sun::before,
  .architecture-sun::after,
  .architecture-orbit,
  .architecture-comet {
    animation: none !important;
  }
}

/* Compact orbital architecture v11.
 * The solar system is a premium intro motif; content height now follows the
 * capability grid instead of a decorative fixed canvas. */
.mp-capabilities-section--universe {
  min-height: 0;
  padding-block: clamp(76px, 7vw, 112px) clamp(84px, 7vw, 112px);
}

.mp-capabilities-section--universe .lp-section-head {
  position: relative;
  z-index: 3;
  max-width: min(850px, 58vw);
  margin-bottom: clamp(42px, 4.5vw, 64px);
}

.mp-capabilities-section--universe .lp-section-head h2 {
  max-width: 820px;
}

.architecture-cosmos {
  top: 18px;
  right: max(-145px, calc((100vw - 1720px) / 2 - 130px));
  width: 780px;
  height: 610px;
  opacity: .88;
  transform: scale(.78);
  transform-origin: top right;
}

.architecture-system-label {
  bottom: 42px;
}

.mp-capabilities-section--universe .mp-capability-grid {
  position: relative;
  z-index: 4;
  gap: 18px;
}

.mp-capabilities-section--universe .mp-capability-card {
  min-height: 308px;
  padding: 24px;
  border-color: rgba(116, 139, 205, .2);
  background:
    linear-gradient(145deg, rgba(12, 18, 35, .95), rgba(7, 10, 24, .91)),
    radial-gradient(circle at 100% 0, rgba(99, 87, 255, .08), transparent 38%);
}

.mp-capabilities-section--universe .mp-capability-card h3 {
  margin: 18px 0 9px;
  font-size: clamp(1.18rem, 1.35vw, 1.48rem);
}

.mp-capabilities-section--universe .mp-capability-card > p {
  font-size: .79rem;
  line-height: 1.55;
}

.mp-capabilities-section--universe .mp-capability-card > em {
  margin-top: 12px;
}

.mp-capabilities-section--universe .mp-capability-visual {
  min-height: 74px;
  padding-top: 12px;
}

.mp-capabilities-section--universe :is(.capability-kpis, .capability-law, .capability-matrix, .capability-terminal, .capability-proofs) {
  min-height: 72px;
}

.mp-capabilities-section--universe :is(.capability-tree, .capability-queue, .capability-pipeline, .capability-anchor, .capability-progress, .capability-governance) {
  min-height: 82px;
}

.mp-capabilities-section--universe .capability-chain {
  min-height: 100px;
  padding: 12px 13px 10px;
  gap: 12px;
}

@media (min-width: 1500px) {
  .mp-capabilities-section--universe .mp-capability-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1181px) and (max-width: 1499px) {
  .mp-capabilities-section--universe .mp-capability-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .architecture-cosmos { right: -230px; opacity: .72; }
}

@media (max-width: 1180px) {
  .mp-capabilities-section--universe .lp-section-head {
    max-width: 760px;
  }
  .mp-capabilities-section--universe .mp-capability-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .architecture-cosmos {
    top: 100px;
    right: -300px;
    opacity: .5;
  }
}

@media (max-width: 720px) {
  .mp-capabilities-section--universe { padding-block: 68px 76px; }
  .mp-capabilities-section--universe .lp-section-head { max-width: none; }
  .mp-capabilities-section--universe .mp-capability-grid { grid-template-columns: 1fr; }
  .mp-capabilities-section--universe .mp-capability-card { min-height: 292px; }
  .architecture-cosmos { top: 210px; right: -480px; opacity: .32; }
}

/* Product architecture design-system alignment v12.
 * Product now uses the exact surface language of the home operating system. */
.mp-capabilities-section--universe {
  isolation: isolate;
  min-height: 0;
  padding-block: clamp(92px, 8vw, 132px);
  background:
    radial-gradient(ellipse at 78% 18%, rgba(38, 46, 112, .18), transparent 35%),
    radial-gradient(ellipse at 8% 42%, rgba(19, 120, 157, .09), transparent 31%),
    #070a12;
}

.mp-capabilities-section--universe::before {
  z-index: 0;
  inset: 0;
  height: auto;
  border: 0;
  border-radius: 0;
  opacity: .38;
  transform: none;
  filter: none;
  animation: none;
  background-image:
    radial-gradient(circle, rgba(158, 205, 255, .55) 0 1px, transparent 1.35px),
    radial-gradient(circle, rgba(121, 105, 255, .45) 0 1px, transparent 1.3px);
  background-position: 0 0, 93px 137px;
  background-size: 283px 257px, 397px 359px;
}

.mp-capabilities-section--universe::after,
.mp-capabilities-section--universe .lp-container::before,
.mp-capabilities-section--universe .lp-container::after,
.architecture-cosmos {
  display: none !important;
}

.mp-capabilities-section--universe > .lp-container {
  position: relative;
  z-index: 2;
}

.mp-capabilities-section--universe .lp-section-head {
  max-width: 900px;
  margin-bottom: clamp(48px, 5vw, 72px);
}

.mp-capabilities-section--universe .mp-capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.mp-capabilities-section--universe .mp-capability-card.lp-platform-card {
  min-height: 410px;
  padding: 34px;
  border-color: rgba(255, 255, 255, .095);
  border-radius: 26px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .058), rgba(255, 255, 255, .016) 75%),
    var(--robok-panel);
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
  backdrop-filter: none;
}

.mp-capabilities-section--universe .mp-capability-card h3 {
  margin: 16px 0 10px;
  font-size: 1.45rem;
}

.mp-capabilities-section--universe .mp-capability-card > p {
  font-size: .88rem;
  line-height: 1.65;
}

.mp-capabilities-section--universe .mp-capability-visual {
  min-height: 88px;
  margin-top: auto;
  padding-top: 20px;
}

.mp-capabilities-section--universe .mp-capability-card > em {
  width: max-content;
  margin-top: 20px;
  color: #aab3ff;
  font-size: .75rem;
}

@media (max-width: 1100px) {
  .mp-capabilities-section--universe .mp-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .mp-capabilities-section--universe { padding-block: 72px 82px; }
  .mp-capabilities-section--universe .mp-capability-grid { grid-template-columns: 1fr; }
  .mp-capabilities-section--universe .mp-capability-card.lp-platform-card { min-height: 370px; padding: 28px; }
}

/* Product architecture background alignment v13.
 * Keep the section transparent so it shares the same global cosmic canvas
 * as the home "One governed operating system" section. */
.mp-capabilities-section--universe {
  background: transparent;
}

.mp-capabilities-section--universe::before {
  display: none !important;
}