* { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: #08090A; color: #F4F6F5; font-family: 'IBM Plex Sans', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
  a { color: #B6F03C; text-decoration: none; }
  a:hover { color: #CDF977; }
  ::selection { background: #B6F03C; color: #0A0F02; }

.dc-hoverable { transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease, box-shadow .15s ease; }

/* ---- Hover states ---- */
.dc-hover-1:hover { color: #F4F6F5 }
.dc-hover-2:hover { color: #F4F6F5 }
.dc-hover-3:hover { color: #F4F6F5 }
.dc-hover-4:hover { color: #F4F6F5 }
.dc-hover-5:hover { color: #F4F6F5 }
.dc-hover-6:hover { color: #F4F6F5 }
.dc-hover-7:hover { background: #C8F866; color: #0A0F02 }
.dc-hover-8:hover { background: #C8F866; transform: translateY(-1px) }
.dc-hover-9:hover { color: #F4F6F5 }
.dc-hover-10:hover { border-color: #B6F03C }
.dc-hover-11:hover { background: #C8F866 }
.dc-hover-12:hover { border-color: #B6F03C }
.dc-hover-13:hover { border-color: rgba(182,240,60,0.35) }
.dc-hover-14:hover { border-color: rgba(182,240,60,0.35) }
.dc-hover-15:hover { border-color: rgba(182,240,60,0.35) }
.dc-hover-16:hover { border-color: rgba(182,240,60,0.35) }
.dc-hover-17:hover { border-color: rgba(182,240,60,0.3) }
.dc-hover-18:hover { border-color: rgba(182,240,60,0.3) }
.dc-hover-19:hover { border-color: rgba(182,240,60,0.3) }
.dc-hover-20:hover { border-color: #B6F03C }
.dc-hover-21:hover { border-color: #B6F03C }
.dc-hover-22:hover { background: #C8F866 }
.dc-hover-23:hover { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.32) }
.dc-hover-24:hover { background: #C8F866 }
.dc-hover-25:hover { background: #C8F866 }
.dc-hover-26:hover { border-color: #B6F03C }
.dc-hover-27:hover { background: #1A2210; color: #EAFFC2 }
.dc-hover-28:hover { color: #F4F6F5 }
.dc-hover-29:hover { color: #F4F6F5 }
.dc-hover-30:hover { color: #F4F6F5 }
.dc-hover-31:hover { color: #F4F6F5 }
.dc-hover-32:hover { color: #F4F6F5 }
.dc-hover-33:hover { color: #F4F6F5 }

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .dc-nav-links { display: none !important; }
  .dc-grid { grid-template-columns: 1fr !important; }
  h1 { font-size: clamp(36px, 9vw, 64px) !important; }
}

@media (max-width: 640px) {
  a[href="#contact"] { white-space: normal !important; }
}