
/* ============================================================
   ORBIX NEBULA COLORS · Global Visual Layer
   Sistemas Orbix · Synthoria · Avatar Lab · OrbixCloud
   Palette: Caterpillar Yellow, Neon Purple, Matrix Green
   ============================================================ */

:root {
  color-scheme: dark;

  --orbix-black: #020617;
  --orbix-ink: #050b14;
  --orbix-panel: rgba(15, 23, 42, 0.88);
  --orbix-panel-soft: rgba(255, 255, 255, 0.045);
  --orbix-line: rgba(255, 255, 255, 0.14);
  --orbix-text: #f8fafc;
  --orbix-muted: #b8c4d8;

  --orbix-cyan: #67e8f9;
  --orbix-blue: #60a5fa;

  /* Requested premium colors */
  --orbix-caterpillar-yellow: #ffcd11;
  --orbix-neon-purple: #b026ff;
  --orbix-matrix-green: #00ff41;

  --orbix-gradient-primary:
    linear-gradient(
      135deg,
      var(--orbix-cyan) 0%,
      var(--orbix-blue) 34%,
      var(--orbix-neon-purple) 68%,
      var(--orbix-caterpillar-yellow) 100%
    );

  --orbix-gradient-matrix:
    linear-gradient(
      135deg,
      var(--orbix-matrix-green),
      var(--orbix-cyan)
    );

  --orbix-shadow-purple:
    0 0 38px rgba(176, 38, 255, 0.28);

  --orbix-shadow-yellow:
    0 0 34px rgba(255, 205, 17, 0.22);

  --orbix-shadow-matrix:
    0 0 34px rgba(0, 255, 65, 0.18);
}

/* Base visual enhancement */
html {
  scroll-behavior: smooth;
}

body {
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 205, 17, 0.105), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(176, 38, 255, 0.16), transparent 30%),
    radial-gradient(circle at 60% 92%, rgba(0, 255, 65, 0.10), transparent 34%),
    linear-gradient(135deg, var(--orbix-black), var(--orbix-ink)) !important;
}

/* Subtle matrix grid */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background-image:
    linear-gradient(rgba(0, 255, 65, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.035) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(circle at 50% 0%, black, transparent 76%);
}

/* Links */
a {
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 260ms cubic-bezier(.22, 1, .36, 1);
}

a:hover {
  color: var(--orbix-caterpillar-yellow) !important;
}

/* Headings */
h1,
h2,
h3 {
  text-wrap: balance;
}

h1 strong,
h2 strong,
h3 strong,
.text-gradient,
.gradient-text {
  background: var(--orbix-gradient-primary);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}

/* Cards, panels, hero blocks */
:where(
  .hero,
  .panel,
  .card,
  .orbix-card,
  .stat,
  .metric,
  .service-card,
  .feature-card,
  section[class*="panel"],
  article
) {
  border-color: rgba(255, 255, 255, 0.14);
}

:where(.hero, .panel, .orbix-card, .card):hover {
  border-color: rgba(255, 205, 17, 0.34) !important;
  box-shadow:
    var(--orbix-shadow-purple),
    var(--orbix-shadow-yellow),
    0 22px 70px rgba(0, 0, 0, 0.26);
}

/* Buttons */
:where(
  .btn,
  .button,
  .cta,
  .cta-button,
  .primary,
  .btn-primary,
  .orbix-btn,
  button
) {
  transition:
    transform 260ms cubic-bezier(.22, 1, .36, 1),
    box-shadow 260ms ease,
    border-color 180ms ease,
    filter 180ms ease;
}

:where(.primary, .btn-primary, .orbix-btn--primary, .cta-button) {
  background: var(--orbix-gradient-primary) !important;
  color: #020617 !important;
  box-shadow:
    0 12px 34px rgba(176, 38, 255, 0.26),
    0 8px 28px rgba(255, 205, 17, 0.16);
}

:where(.btn, .button, .cta, .cta-button, .orbix-btn, button):hover {
  transform: translateY(-3px);
  border-color: rgba(255, 205, 17, 0.52) !important;
  filter: saturate(1.1);
}

/* Badges and tags */
:where(.tag, .badge, .eyebrow, .chip, .pill) {
  border-color: rgba(0, 255, 65, 0.35) !important;
  color: var(--orbix-matrix-green) !important;
  background:
    linear-gradient(
      135deg,
      rgba(0, 255, 65, 0.075),
      rgba(176, 38, 255, 0.07)
    ) !important;
  box-shadow: var(--orbix-shadow-matrix);
}

/* Top ecosystem menu */
.orbix-ecosystem-menu {
  border-bottom-color: rgba(255, 205, 17, 0.28) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(255, 205, 17, 0.16), transparent 32%),
    radial-gradient(circle at 88% 0%, rgba(176, 38, 255, 0.16), transparent 30%),
    linear-gradient(135deg, rgba(2, 6, 23, 0.98), rgba(15, 23, 42, 0.96)) !important;
}

.orbix-ecosystem-menu strong {
  color: var(--orbix-caterpillar-yellow) !important;
}

.orbix-ecosystem-menu a:hover {
  color: #020617 !important;
  background:
    linear-gradient(
      135deg,
      var(--orbix-caterpillar-yellow),
      var(--orbix-matrix-green)
    ) !important;
}

/* Brand mark enhancement */
:where(.mark, .orbix-brand__mark, .brand-mark, .logo-mark) {
  background:
    radial-gradient(circle at 28% 22%, #ffffff, transparent 18%),
    linear-gradient(
      135deg,
      var(--orbix-caterpillar-yellow),
      var(--orbix-cyan) 42%,
      var(--orbix-neon-purple) 100%
    ) !important;
  box-shadow:
    0 0 36px rgba(255, 205, 17, 0.22),
    0 0 48px rgba(176, 38, 255, 0.20) !important;
}

/* Tables / code / status */
code,
pre {
  border-color: rgba(0, 255, 65, 0.22) !important;
}

code {
  color: var(--orbix-matrix-green);
}

:where(.status, .ok, .success, .operational) {
  color: var(--orbix-matrix-green) !important;
}

:where(.warning, .premium, .highlight) {
  color: var(--orbix-caterpillar-yellow) !important;
}

:where(.purple, .neon, .ai) {
  color: var(--orbix-neon-purple) !important;
}

/* Section separators */
hr,
.orbix-divider {
  border: 0;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--orbix-caterpillar-yellow),
      var(--orbix-neon-purple),
      var(--orbix-matrix-green),
      transparent
    ) !important;
}

/* Focus accessibility */
:focus-visible {
  outline: 3px solid var(--orbix-caterpillar-yellow);
  outline-offset: 3px;
  border-radius: 10px;
}

/* Optional utility classes */
.orbix-yellow { color: var(--orbix-caterpillar-yellow) !important; }
.orbix-purple { color: var(--orbix-neon-purple) !important; }
.orbix-matrix { color: var(--orbix-matrix-green) !important; }

.orbix-border-yellow { border-color: rgba(255, 205, 17, 0.45) !important; }
.orbix-border-purple { border-color: rgba(176, 38, 255, 0.45) !important; }
.orbix-border-matrix { border-color: rgba(0, 255, 65, 0.45) !important; }

.orbix-nebula-glow {
  box-shadow:
    0 0 36px rgba(255, 205, 17, 0.16),
    0 0 44px rgba(176, 38, 255, 0.18),
    0 0 32px rgba(0, 255, 65, 0.12) !important;
}

/* Mobile */
@media (max-width: 760px) {
  body::before {
    background-size: 42px 42px;
  }

  :where(.hero, .panel, .card, .orbix-card) {
    border-radius: 22px;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }
}
