/* === 42hz.ai UI enhancements (injected, no bundle edits) === */

/* 1. Typography — unify on Inter for an authoritative, precise register.
   To revert to Space Grotesk: delete this block. */
.font-display{
  font-family:"Inter",system-ui,-apple-system,sans-serif!important;
  letter-spacing:-0.035em;
}

/* 2. Contrast lifts for static muted text.
   No !important on purpose -> any JS-driven inline scroll animation still wins. */
.text-white\/20{color:rgb(255 255 255 / .52);}
.text-white\/30{color:rgb(255 255 255 / .62);}
.text-white\/35{color:rgb(255 255 255 / .68);}
.text-white\/40{color:rgb(255 255 255 / .74);}
.text-white\/50{color:rgb(255 255 255 / .82);}

/* 3. Scroll-reveal headlines — base color resolves to white;
   the dim look comes entirely from per-word opacity (set in JS). */
h2.font-display span.text-white\/25{color:#fff;}
.hz-word{transition:opacity .12s linear;}

/* 4. Platform section — filter chips, row hover highlight, staggered reveal */
.hz-chipbar{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 2.75rem;}
.hz-chip{
  font:500 12px/1 "Inter",sans-serif;letter-spacing:.04em;text-transform:uppercase;
  color:rgb(255 255 255 / .55);background:rgb(255 255 255 / .04);
  border:1px solid rgb(255 255 255 / .10);padding:.55rem .9rem;border-radius:999px;
  cursor:pointer;transition:color .2s ease,background .2s ease,border-color .2s ease;
}
.hz-chip:hover{color:rgb(255 255 255 / .9);border-color:rgb(255 255 255 / .28);}
.hz-chip[data-active="true"]{color:#0a0a0a;background:#FBB320;border-color:#FBB320;}

.hz-prow{position:relative;transition:background .25s ease,opacity .35s ease,filter .35s ease;}
.hz-prow::before{
  content:"";position:absolute;left:-1.1rem;top:.15rem;bottom:.15rem;width:2px;
  background:#FBB320;border-radius:2px;transform:scaleY(0);transform-origin:top;
  transition:transform .28s cubic-bezier(.16,1,.3,1);
}
.hz-prow:hover{background:rgb(255 255 255 / .025);}
.hz-prow:hover::before{transform:scaleY(1);}
.hz-row-dim{opacity:.12!important;filter:saturate(0);pointer-events:none;}

.hz-reveal{opacity:0;transform:translateY(14px);
  transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);}
.hz-reveal.hz-in{opacity:1;transform:none;}

/* 4b. Section contrast — raised, slightly-warm surface on alternating sections */
.hz-surface{
  background:#0e0d11 !important;
  border-top:1px solid rgb(255 255 255/.06);
  border-bottom:1px solid rgb(255 255 255/.06);
}

/* 5. Respect reduced motion — kill animations + the particle canvas */
@media (prefers-reduced-motion: reduce){
  .hz-word{opacity:1!important;}
  .hz-reveal{opacity:1!important;transform:none!important;}
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
  canvas{display:none!important;}
}

/* 6. Hero eyebrow "Asset Intelligence" — was amber @50% over the 3D scene,
   too low-contrast to read. Full-opacity brighter amber + subtle shadow. */
[code-path="src/sections/SignalCore.tsx:292:13"]{
  color:#FFC24A !important;
  opacity:1 !important;
  text-shadow:0 1px 10px rgb(0 0 0/.55);
}

/* 7. Closing CTA — stays in the dark family. A faint warm wash + gold hairline
   gives a subtle sense of "arrival" without a loud color block. */
#contact{
  background:
    radial-gradient(120% 80% at 50% 100%, rgb(255 179 32/.06) 0%, transparent 60%),
    #050505 !important;
  border-top:1px solid rgb(255 179 32/.14);
  /* was py-72 (288px) bottom — left a huge black gap under the legal bar */
  padding-bottom:3.5rem !important;
}

/* 8. Photon Beam — soft amber light beams drifting behind the footer CTA. */
#contact{overflow:hidden;}
#contact > *:not(.hz-beams){position:relative;z-index:1;}
.hz-beams{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.hz-beam{
  position:absolute;top:-40%;height:180%;width:150px;
  left:calc(var(--i) * 26% - 28%);
  background:linear-gradient(90deg, transparent, rgb(255 179 32/.10), transparent);
  filter:blur(16px);
  animation:hzbeam 9s ease-in-out infinite;
  animation-delay:calc(var(--i) * -2.2s);
}
@keyframes hzbeam{
  0%,100%{opacity:.22;transform:translateX(-32px) rotate(14deg);}
  50%{opacity:.65;transform:translateX(38px) rotate(14deg);}
}
@media (prefers-reduced-motion:reduce){
  .hz-beam{animation:none!important;opacity:.3!important;transform:rotate(14deg)!important;}
}
