/*!*****************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/app/globals.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************/
:root {
  /* Brand palette (from the OvIA logo) */
  --bg-0: #0b0b0d;
  --bg-1: #141417;
  --fg: #f4f5f7;
  --muted: #a7abb4;
  --brand-blue: #38bdf8;
  --brand-purple: #7c3aed;
  --brand-pink: #ec4899;
  --card: rgba(255, 255, 255, 0.04);
  --card-border: rgba(255, 255, 255, 0.09);
  --ok: #34d399;
  --bad: #fb7185;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  color: var(--fg);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial,
    sans-serif;
  -webkit-font-smoothing: antialiased;
  /* Dark charcoal base with subtle brand glows, like the logo backdrop */
  background-color: var(--bg-0);
  background-image:
    radial-gradient(1100px 600px at 78% -8%, rgba(124, 58, 237, 0.22), transparent 60%),
    radial-gradient(900px 520px at 10% 108%, rgba(56, 189, 248, 0.16), transparent 60%),
    radial-gradient(700px 500px at 50% 50%, rgba(236, 72, 153, 0.08), transparent 70%);
  background-attachment: fixed;
}

/* faint diagonal texture, echoing the logo card */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: repeating-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.014) 0,
    rgba(255, 255, 255, 0.014) 1px,
    transparent 1px,
    transparent 7px
  );
  z-index: 0;
}

.brand-IA {
  background: linear-gradient(
    120deg,
    var(--brand-blue) 0%,
    var(--brand-purple) 45%,
    var(--brand-pink) 78%,
    var(--brand-blue) 100%
  );
  background-size: 200% 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: shimmer 8s ease-in-out infinite;
}

@keyframes shimmer {
  0%,
  100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .brand-IA {
    animation: none;
  }
}