:root {
  color-scheme: dark;

  --accent: #ff3b3b;
  --accent-dim: rgba(255, 59, 59, 0.15);
  --dark: #080a0f;
  --dark2: #0f1219;
  --dark3: #161b24;
  --text: #f0f4f8;
  --muted: #6b7588;
  --border: rgba(255,255,255,.07);
  --border2: rgba(255,255,255,.15);
  --font-d: 'Bebas Neue', sans-serif;
  --font-b: 'Cabinet Grotesk', sans-serif;
  --radius: 12px;
  --radius-lg: 20px;
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  /* Compatibility aliases for current HTML files */
  --lime: var(--accent);
  --lime2: #e53434;
  --limedim: var(--accent-dim);
  --danger: var(--accent);
  --success: #ff8a8a;
  --warn: #ffb347;
  --purple: #c084fc;
  --fd: var(--font-d);
  --fb: var(--font-b);
}

html, body {
  background: var(--dark);
  color: var(--text);
  font-family: var(--font-b);
  -webkit-font-smoothing: antialiased;
  cursor: none;
}

::selection {
  background: rgba(255, 59, 59, 0.28);
  color: var(--text);
}

#cursor,
#cur {
  position: fixed;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  mix-blend-mode: difference;
  transition: transform .1s, width .3s, height .3s, opacity .3s;
}

@media (pointer: coarse) {
  html, body { cursor: auto !important; }
  #cursor, #cursor-ring, #cur, #cur-ring { display: none !important; }
  button, a, .slide-cta, .nav-dot, .arrow-btn, .role-card, .btn-hover-opacity, .btn-hover-scale { cursor: auto !important; }
}

#cursor-ring,
#cur-ring {
  position: fixed;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1.5px solid rgba(255, 59, 59, 0.45);
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%);
  transition: left .12s ease, top .12s ease, width .3s, height .3s;
  opacity: .5;
}

body:hover #cursor,
body:hover #cur {
  opacity: 1;
}

/* ── Contact form ── */
.contact-form { display: flex; flex-direction: column; gap: 14px; }
.contact-form input,
.contact-form textarea {
  background: rgba(255,255,255,.05); border: 1px solid var(--border);
  border-radius: 10px; padding: 12px 16px; color: var(--text);
  font-family: var(--font-b); font-size: 14px; outline: none;
  transition: border-color .3s;
}
.contact-form input:focus,
.contact-form textarea:focus { border-color: var(--accent); }
.contact-form input::placeholder,
.contact-form textarea::placeholder { color: var(--muted); }
.contact-form textarea { resize: vertical; min-height: 120px; }
.contact-submit {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--accent); color: var(--dark); padding: 14px 28px;
  border: none; border-radius: 4px; font-weight: 800; font-size: 14px;
  letter-spacing: .05em; text-transform: uppercase;
  cursor: none; transition: transform .2s, box-shadow .2s;
  font-family: var(--font-b);
}
.contact-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(255,59,59,.3); }
.contact-info { display: flex; flex-direction: column; gap: 16px; margin-top: 8px; }
.contact-info-item { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--muted); }
.contact-info-icon { width: 40px; height: 40px; border-radius: 10px; background: rgba(255,59,59,.1); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }