/* =========================================================
   VENTUREEX — Neon overhaul
   Floating orb accents · glossy containers · extended hovers
   · shooting-star cursor trail. Palette: black / white / #00FF38
   ========================================================= */

/* ---------- Shooting-star cursor canvas ---------- */
.parsec-shooting-canvas{
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  mix-blend-mode: screen;
}
@media (hover:none), (pointer:coarse){ .parsec-shooting-canvas{ display:none; } }

/* Give the ring/dot a neon-green identity to match the new palette */
.parsec-cursor{ border-color: var(--neon); box-shadow: 0 0 14px 1px var(--neon-dim); }
.parsec-cursor-dot{ background: var(--neon); box-shadow: 0 0 8px 2px var(--neon-soft); }
.parsec-cursor.is-hover{
  border-color: #ffffff;
  background: radial-gradient(circle, var(--neon-dim), transparent 70%);
  box-shadow: 0 0 26px 4px var(--neon-soft);
}

/* =========================================================
   Floating orb accents — extra particle-sphere elements
   scattered across every page beyond the hero banner.
   Sized up, blended additively, and scroll-transformed by
   js/orb-scroll.js (translate/rotate/scale) on top of the
   orb's own internal scroll-reactive spin (hero-orb.js).
   ========================================================= */
.orb-host.orb-host-float{
  position: absolute;
  inset: auto;
  overflow: visible;
  z-index: 0;
  pointer-events: none;
  opacity: .8;
  mix-blend-mode: screen;
  will-change: transform;
}
.orb-host-float canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.orb-host-float::after{ content: none; } /* no vignette mask on floating accents */

.orb-host-float.sz-xl{ width: 1040px; height: 1040px; }
.orb-host-float.sz-lg{ width: 820px; height: 820px; }
.orb-host-float.sz-md{ width: 580px; height: 580px; }
.orb-host-float.sz-sm{ width: 420px; height: 420px; }

.orb-pos-tr{ top: -8%; right: -8%; }
.orb-pos-tl{ top: -8%; left: -8%; }
.orb-pos-br{ bottom: -10%; right: -8%; }
.orb-pos-bl{ bottom: -8%; left: -8%; }
.orb-pos-mr{ top: 14%; right: -10%; }
.orb-pos-ml{ top: 16%; left: -10%; }

@media (max-width: 1100px){
  .orb-host-float.sz-xl{ width: 680px; height: 680px; }
  .orb-host-float.sz-lg{ width: 540px; height: 540px; }
  .orb-host-float.sz-md{ width: 420px; height: 420px; }
}
@media (max-width: 720px){
  .orb-host-float{ opacity: .5; }
  .orb-host-float.sz-xl, .orb-host-float.sz-lg{ width: 340px; height: 340px; }
  .orb-host-float.sz-md, .orb-host-float.sz-sm{ width: 260px; height: 260px; }
}
@media (prefers-reduced-motion: reduce){
  .orb-host-float{ display: none; }
}

/* =========================================================
   Glossy finish — applied to every card / panel / container
   Layered highlight sweep across the top edge + soft inner
   sheen + neon-tinted glass background, on top of each
   component's own existing background.
   ========================================================= */
.p-card, .p-work-card, .p-team-card, .p-price-card, .p-quote-panel,
.p-spotlight, .p-contact-item, .p-form, .p-stat-card,
.p-logo-chip, .p-project-card .p-card{
  position: relative;
  isolation: isolate;
  background-blend-mode: overlay;
  box-shadow:
    inset 0 1px 0 0 rgba(255,255,255,.14),
    inset 0 0 40px -28px rgba(255,255,255,.5);
  backdrop-filter: blur(6px);
}
/* Float badges keep their own absolute positioning (set in 02-sections.css) —
   only add the glossy sheen touch here, never touch position/display. */
.p-float-badge{
  box-shadow:
    inset 0 1px 0 0 rgba(255,255,255,.14),
    0 20px 40px -20px rgba(0,0,0,.6);
  backdrop-filter: blur(8px);
}
/* clip the sheen to the rounded corners — price-card excluded since its
   "popular" badge is intentionally positioned outside the box */
.p-card, .p-work-card, .p-team-card, .p-quote-panel,
.p-spotlight, .p-contact-item, .p-form, .p-stat-card, .p-logo-chip{
  overflow: hidden;
}
.p-card::before, .p-work-card::before, .p-team-card::before, .p-price-card::before,
.p-quote-panel::before, .p-spotlight::before, .p-contact-item::before,
.p-form::before, .p-stat-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  padding: 0;
  opacity: 1;
  border-radius: inherit;
  background: linear-gradient(155deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.03) 22%, transparent 45%);
  -webkit-mask: none;
  mask: none;
  -webkit-mask-composite: source-over;
  mask-composite: add;
  pointer-events: none;
}

/* Glossy hover lift — neon glow + subtle rise, unified across all containers */
.p-card:hover, .p-work-card:hover, .p-team-card:hover, .p-price-card:hover,
.p-quote-panel:hover, .p-spotlight:hover, .p-contact-item:hover,
.p-stat-card:hover, .p-logo-chip:hover{
  transform: translateY(-6px);
  border-color: var(--neon);
  box-shadow:
    inset 0 1px 0 0 rgba(255,255,255,.18),
    0 25px 60px -24px var(--neon-soft),
    0 0 0 1px var(--neon-dim);
}
.p-price-card:hover{ transform: translateY(-6px); } /* keep existing scale-free lift consistent */
.p-team-card, .p-price-card, .p-quote-panel, .p-spotlight, .p-contact-item,
.p-stat-card, .p-logo-chip{
  transition: transform .3s var(--ease-out), border-color .3s ease, box-shadow .3s ease;
}

/* ---------- Extra hover states for containers that had none ---------- */
.p-spotlight, .p-quote-panel, .p-stat-card, .p-project-card, .p-filter-btn,
.p-logo-chip, .p-form, .p-map{
  cursor: pointer;
}
.p-filter-btn:hover{ border-color: var(--neon); color: var(--neon); box-shadow: 0 0 0 1px var(--neon-dim); }
.p-form:hover{ border-color: rgba(0,255,56,.3); box-shadow: inset 0 1px 0 0 rgba(255,255,255,.14), 0 20px 55px -30px var(--neon-soft); }
.p-map:hover{ box-shadow: 0 0 0 2px var(--neon-dim); }
.p-testi-dots button:hover{ background: var(--starlight-45); }
.p-footer-col a:hover{ text-shadow: 0 0 10px var(--neon-dim); }

/* ---------- Glossy field inputs ---------- */
.p-field input, .p-field textarea, .p-newsletter input{
  box-shadow: inset 0 1px 0 0 rgba(255,255,255,.06);
}
.p-field input:focus, .p-field textarea:focus, .p-newsletter input:focus{
  box-shadow: inset 0 1px 0 0 rgba(255,255,255,.1), 0 0 0 3px var(--neon-dim);
}

/* ---------- Glossy buttons ---------- */
.p-btn{ box-shadow: inset 0 1px 0 0 rgba(255,255,255,.18); }

/* Button text: back to black (#04050a) per request. The ghost button's
   background is a light fill now (previously near-transparent) so the
   dark text stays legible against the page's black background —
   otherwise black-on-black would be unreadable. Let me know if you'd
   rather keep it outline-only and use a different accent instead. */
.p-btn-ghost{ color:#04050a; background:#ffffff; border-color:#ffffff; }
.p-btn-ghost:hover{ color:#04050a; background:#e7e9f2; }
.p-nav-cta .p-btn-primary{ color:#04050a; }

/* Keep the two hero buttons cleanly aligned on one line, wrapping only
   on very narrow screens. */
.p-hero-ctas,
.p-pagehead-ctas{ display:flex; align-items:center; flex-wrap:wrap; gap:1rem; }
.p-hero-ctas .p-btn,
.p-pagehead-ctas .p-btn{ flex: 0 0 auto; }
.p-btn-primary{ box-shadow: inset 0 1px 0 0 rgba(255,255,255,.35), 0 12px 34px -14px var(--neon-soft); }
.p-btn-primary:hover{ box-shadow: inset 0 1px 0 0 rgba(255,255,255,.4), 0 16px 40px -12px var(--neon-soft); }

/* Final, unambiguous rule: every button on the site uses black text,
   loaded last so nothing else in the cascade can override it. */
.p-btn, .p-btn:hover, .p-btn:focus, .p-btn:visited{ color:#04050a; }