/*
  NJS Studio Theme — Premium Dark Layer (v2.6.0)
  Safe: overrides only visuals + adds optional reveal/shimmer effects.
*/

:root{
  --p-glow: 0 18px 60px rgba(0,0,0,.35);
  --p-glow2: 0 10px 28px rgba(0,0,0,.28);
  --p-line: color-mix(in oklab, var(--line) 70%, transparent);
}

/* Animated background aura */
body.njs-theme::before{
  content:"";
  position:fixed;
  inset:-20%;
  pointer-events:none;
  z-index:-2;
  background:
    radial-gradient(700px 420px at 10% 10%, color-mix(in oklab, var(--accent) 35%, transparent), transparent 60%),
    radial-gradient(820px 520px at 90% 22%, rgba(120,240,190,.15), transparent 62%),
    radial-gradient(680px 520px at 40% 92%, rgba(92,200,255,.14), transparent 62%),
    radial-gradient(900px 600px at 80% 90%, rgba(255,210,120,.12), transparent 62%);
  filter: blur(10px);
  opacity:.85;
  animation:njsAura 18s ease-in-out infinite;
}
@keyframes njsAura{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-2%,1%,0) scale(1.03)}
}

/* Header polish */
.site-header{
  backdrop-filter:saturate(120%) blur(10px);
  border-bottom:1px solid var(--p-line);
}

.brand-badge{
  box-shadow:0 10px 22px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.06) inset;
}

/* Card premium */
.card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--p-line);
  box-shadow: var(--p-glow2);
  transform: translateZ(0);
}
.card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,.06), transparent 25%, rgba(255,255,255,.04) 55%, transparent);
  opacity:.6;
  transform:translateX(-45%);
  transition:transform .55s ease, opacity .55s ease;
  pointer-events:none;
}
.card:hover{ box-shadow: var(--p-glow); }
.card:hover::before{ transform:translateX(35%); opacity:.75; }

.card.highlight{
  border-color: color-mix(in oklab, var(--accent) 55%, var(--line));
}

/* Price accent pop */
.price{
  text-shadow: 0 0 18px color-mix(in oklab, var(--accent) 35%, transparent);
}

/* Buttons: subtle gradient + shimmer */
.btn{
  position:relative;
  overflow:hidden;
}
.btn:not(.outline){
  background:linear-gradient(135deg, color-mix(in oklab, var(--accent) 88%, #0b1730), color-mix(in oklab, var(--accent) 35%, #071427));
  border-color: color-mix(in oklab, var(--accent) 55%, rgba(255,255,255,.10));
}
.btn::after{
  content:"";
  position:absolute;
  inset:-2px;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.25) 18%, transparent 36%);
  transform:translateX(-120%);
  opacity:.55;
  pointer-events:none;
}
.btn:hover::after{ animation:njsShimmer .85s ease; }
@keyframes njsShimmer{
  0%{transform:translateX(-120%)}
  100%{transform:translateX(120%)}
}

/* Package description nicer spacing */
.pack-desc{
  color: color-mix(in oklab, var(--muted) 92%, rgba(255,255,255,.06));
  margin: 2px 0 12px;
}

/* Icons: make them feel like chips */
.icon-box{
  background:linear-gradient(180deg, rgba(7,20,39,.55), rgba(7,20,39,.25));
  border-color: rgba(232,240,255,.16);
}

/* Contact form premium */
.form-wrap{
  border:1px solid var(--p-line);
  border-radius:18px;
  background: rgba(11,31,58,.22);
  box-shadow: var(--p-glow2);
  padding: 16px;
}
.form-wrap .input,
.form-wrap textarea,
.form-wrap select{
  border-radius:14px;
}

/* Reveal animation (enabled by premium.js) */
.njs-reveal{
  opacity:0;
  transform: translateY(14px);
  transition: opacity .55s ease, transform .55s ease;
  will-change: opacity, transform;
}
.njs-reveal.is-visible{
  opacity:1;
  transform:none;
}

@media (prefers-reduced-motion: reduce){
  body.njs-theme::before{ animation:none; }
  .card::before{ transition:none; }
  .btn:hover::after{ animation:none; }
  .njs-reveal{ transition:none; transform:none; opacity:1; }
}
