:root{
      --indigo:#4338ca;          
      --indigo-600:#4f46e5;     
      --space:#0b0b12;
    }

    body{ background: #ffffff; font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans"; }


.bh {
  position: relative;
  width: 60px; height: 60px; 
  transform: translateZ(0); 
  z-index: 1;
}

.bh {
  cursor: pointer; 
  transition: transform 0.4s ease;
}

.bh:hover .bh-core {
  transform: scale(1.12);
  transition: transform 0.8s cubic-bezier(0.17, 0.67, 0.22, 1.15);
}

.bh:hover .bh-einstein-ring {
  transform: scale(1.08); 
  opacity: 1;
  filter: blur(0.5px) saturate(250%) brightness(1.3); 
  transition: all 0.6s ease-out;
}

.bh:hover .bh-disk {
  animation-duration: 3s; 
}

.bh:hover .bh-sparks i {
  animation-duration: 1.5s;
  opacity: 1;
  box-shadow: 0 0 12px rgba(129, 140, 248, 1);
}

.bh-core {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, #000 0%, #000 35%, rgba(0, 0, 0, 0.7) 45%, rgba(67, 56, 202, 0) 60%);
  
  box-shadow:
    0 0 20px rgba(0, 0, 0, 0.4),          
    inset 0 0 10px rgba(0, 0, 0, 0.8),    
    0 3px 6px rgba(17, 24, 39, .14),      
    0 12px 24px rgba(17, 24, 39, .10);   

  pointer-events: none;
}

    .bh-einstein-ring{
      position:absolute; inset: 0; border-radius:50%;
      background:
        radial-gradient(closest-side,
          transparent calc(50% - 2px),
          rgba(156, 163, 255, .95) calc(50% - 2px),
          rgba(129,140,248,.85) calc(50% - 1px),
          rgba(99,102,241,.55) 50%,
          transparent 52%);
      filter: blur(.6px) saturate(130%);
      opacity: .95;
    }

.bh-disk {
  position: absolute;
  inset: -3px;
  transform: perspective(300px) rotateX(64deg) translateZ(0);
  animation: spin 25s linear infinite;
  transform-style: flat; 
  backface-visibility: hidden;
  will-change: transform; 
}

    .bh-disk::before{
      content:""; position:absolute; inset: 4px; border-radius:50%;
      background:
        conic-gradient(from 0deg,
          rgba(67,56,202,0) 0deg,
          rgba(67,56,202,.12) 12deg,
          rgba(79,70,229,.28) 60deg,
          rgba(129,140,248,.5) 110deg,
          rgba(79,70,229,.32) 180deg,
          rgba(67,56,202,.14) 300deg,
          rgba(67,56,202,0) 360deg);
      -webkit-mask: radial-gradient(circle at 50% 50%, transparent 30%, black 31%);
              mask: radial-gradient(circle at 50% 50%, transparent 30%, black 31%);
      filter: blur(.5px) saturate(120%);
      box-shadow:
        0 1px 6px rgba(17,24,39,.12),
        0 10px 18px rgba(17,24,39,.08),
        inset 0 0 28px rgba(67,56,202,.38);
    }

    .bh-disk::after{
      content:""; position:absolute; inset: -2px; border-radius:50%;
      background: radial-gradient(60% 60% at 50% 50%, rgba(67,56,202,.18), rgba(67,56,202,0) 70%);
      -webkit-mask: radial-gradient(circle at 50% 50%, transparent 48%, black 60%);
              mask: radial-gradient(circle at 50% 50%, transparent 48%, black 60%);
      filter: blur(2.2px);
      opacity:.95;
    }

    .bh-penumbra{
      position:absolute; inset:-8px; border-radius:50%;
      background: radial-gradient(55% 55% at 50% 50%, rgba(0,0,0,.08), rgba(0,0,0,0) 70%);
      filter: blur(8px);
      opacity:.7;
    }

    .bh-sparks{ position:absolute; inset:0; }
    .bh-sparks i{
      position:absolute; width:3px; height:3px; border-radius:50%;
      background: #312e81; 
      box-shadow: 0 0 9px rgba(79,70,229,.9);
      animation: spiral 10s linear infinite; 
      opacity:.85;
    }
    .bh-sparks i:nth-child(1){ left: 50%; top: 6%; animation-delay: -.1s; }
    .bh-sparks i:nth-child(2){ left: 12%; top: 44%; animation-delay: -.7s; }
    .bh-sparks i:nth-child(3){ left: 84%; top: 58%; animation-delay: -1.3s; }
    .bh-sparks i:nth-child(4){ left: 28%; top: 16%; animation-delay: -1.9s; }

@keyframes spin {
  from {
    transform: perspective(300px) rotateX(64deg) rotateZ(0deg);
  }
  to {
    transform: perspective(300px) rotateX(64deg) rotateZ(360deg);
  }
}
    @keyframes pulse {
      0%,100% { opacity:.55; filter: blur(5px) saturate(120%); }
      50%     { opacity:.9;  filter: blur(7px) saturate(150%); }
    }
    @keyframes spiral {
      0%   { transform: translate(-2px,-2px) rotate(0deg)   translateX(18px) rotate(0deg); opacity:.15; }
      60%  { opacity:.95; }
      100% { transform: translate(-2px,-2px) rotate(540deg) translateX(6px)  rotate(-540deg); opacity:0; }
    }

    @media (prefers-reduced-motion: reduce) {
      .bh-disk{ animation: none; }
      .bh-glow{ animation: none; }
      .bh-sparks i{ animation: none; opacity:.5; }
    }

    .nexora-title{
      background: linear-gradient(90deg, #0b0b12, #111827 35%, var(--indigo));
      -webkit-background-clip: text; background-clip: text; color: transparent;
    }

    .brand:hover .bh{ transform: translateY(-1px); }