/**
 * MindHive Online — Unified Brand Theme (no blue)
 */
:root {
  --mh-primary: #047857;
  --mh-primary-dark: #065F46;
  --mh-primary-darker: #064E3B;
  --mh-primary-light: #D1FAE5;
  --mh-primary-muted: #ECFDF5;

  --mh-accent: #10B981;
  --mh-accent-dark: #059669;
  --mh-accent-light: #A7F3D0;

  --mh-surface: #F8FAFC;
  --mh-surface-alt: #F0FDF4;
  --mh-dark: #1E293B;
  --mh-muted: #64748B;
  --mh-white: #FFFFFF;

  --mh-gradient: linear-gradient(135deg, #047857 0%, #10B981 100%);
  --mh-gradient-dark: linear-gradient(135deg, #064E3B 0%, #047857 100%);
  --mh-shadow: 0 4px 20px rgba(4, 120, 87, 0.12);
  --mh-shadow-lg: 0 12px 40px rgba(4, 120, 87, 0.18);
  --mh-radius: 12px;
  --mh-radius-lg: 16px;
  --mh-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

body.mh-body {
  background: var(--mh-surface);
  color: var(--mh-dark);
}

.mh-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.75rem;
  background: var(--mh-gradient);
  color: var(--mh-white);
  font-weight: 600;
  border-radius: 999px;
  text-decoration: none;
  transition: var(--mh-transition);
  box-shadow: var(--mh-shadow);
}

.mh-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: var(--mh-shadow-lg);
  filter: brightness(1.05);
}

.mh-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.75rem;
  background: transparent;
  color: var(--mh-primary);
  font-weight: 600;
  border: 2px solid var(--mh-primary);
  border-radius: var(--mh-radius);
  text-decoration: none;
  transition: var(--mh-transition);
}

.mh-btn-outline:hover {
  background: var(--mh-primary-light);
  transform: translateY(-2px);
}

.mh-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 1rem;
  background: var(--mh-primary-light);
  color: var(--mh-primary);
  font-size: 0.8rem;
  font-weight: 600;
  border-radius: 999px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.mh-card {
  background: var(--mh-white);
  border-radius: var(--mh-radius-lg);
  border: 1px solid #E2E8F0;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  transition: var(--mh-transition);
}

.mh-card:hover {
  box-shadow: var(--mh-shadow);
  transform: translateY(-4px);
}

.mh-section-alt {
  background: var(--mh-surface-alt);
}

.modern-title {
  background: linear-gradient(135deg, var(--mh-dark) 0%, var(--mh-primary) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

.image-hover-glow:hover {
  box-shadow: 0 0 40px rgba(16, 185, 129, 0.25);
}