/* Reset + base */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html, body { height: 100%; }
body {
  font: 14px/1.5 var(--font);
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

h1 { font-size: 22px; font-weight: 800; }
h2 { font-size: 18px; font-weight: 700; }
h3 { font-size: 16px; font-weight: 700; }
p  { line-height: 1.55; }
a  { color: var(--cyan-deep); }

button, input, select, textarea { font: inherit; color: inherit; }
img { max-width: 100%; display: block; }

:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
::selection { background: var(--cyan-100); }

/* scrollbars */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(157, 179, 187, .45);
  border-radius: 8px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: rgba(157, 179, 187, .7); }

/* brand background diamonds */
.diamonds { position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.diamonds i {
  position: absolute; display: block; background: var(--cyan);
  transform: rotate(45deg); border-radius: 14%;
  animation: diamondFloat 16s ease-in-out infinite;
}
.diamonds i:nth-child(1) { width: 240px; height: 240px; right: -80px;  top: 12%;  opacity: .05; }
.diamonds i:nth-child(2) { width: 130px; height: 130px; right: 16%;    bottom: -40px; opacity: .07; animation-delay: -6s; }
.diamonds i:nth-child(3) { width: 70px;  height: 70px;  left: 34%;     top: -22px; opacity: .06; animation-delay: -11s; }
@keyframes diamondFloat {
  0%, 100% { transform: rotate(45deg) translateY(0); }
  50%      { transform: rotate(45deg) translateY(-16px); }
}

/* icons */
.icon, [data-lucide] { width: var(--i, 18px); height: var(--i, 18px); stroke-width: 2; flex: none; }

/* utility */
.hidden { display: none !important; }
.muted { color: var(--muted); }
.nowrap { white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
