/**
 * NABAB VISION — Shared premium polish layer (subpages)
 * Portable subset of the homepage inline polish: pill section labels,
 * scroll-reveal entrance, FAQ accordion, card hover lift, button sheen,
 * custom cursor + scroll progress. Self-contained — paired with /js/premium.js
 * which injects the cursor/progress DOM. All motion respects reduced-motion.
 */

/* === Section label → premium pill === */
.section-label {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  background: rgba(255, 77, 28, .08);
  border: 1px solid rgba(255, 77, 28, .2);
  border-radius: 100px;
  padding: .35em .85em;
  margin-bottom: 1.25rem;
}
.section-label::before {
  content: '\25A0';
  font-size: .45em;
  opacity: .55;
}

/* === Scroll-reveal entrance === */
.prem-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .72s cubic-bezier(.25, .46, .45, .94),
              transform .72s cubic-bezier(.25, .46, .45, .94);
  will-change: opacity, transform;
}
.prem-reveal.prem-in {
  opacity: 1;
  transform: none;
}
.prem-d1 { transition-delay: 80ms; }
.prem-d2 { transition-delay: 160ms; }
.prem-d3 { transition-delay: 240ms; }
.prem-d4 { transition-delay: 320ms; }
.prem-d5 { transition-delay: 400ms; }

/* === FAQ accordion polish (matches homepage) === */
.faq-item { transition: padding-left .3s ease; }
.faq-item:hover { padding-left: 6px; }
.faq-question { transition: color .25s ease; }
.faq-question:hover { color: #fff; }
.faq-item[open] .faq-question { color: var(--accent); }
.faq-question::after {
  content: '+';
  font-size: 1.15rem;
  font-weight: 400;
  line-height: 1;
  color: var(--accent);
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 77, 28, .25);
  border-radius: 50%;
  background: rgba(255, 77, 28, .05);
  transition: transform .4s cubic-bezier(.34, 1.56, .64, 1),
              background .25s ease, border-color .25s ease;
}
.faq-question:hover::after {
  background: rgba(255, 77, 28, .12);
  border-color: rgba(255, 77, 28, .5);
}
.faq-item[open] .faq-question::after {
  content: '+';
  transform: rotate(135deg);
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* === Card hover lift (subpage content cards) === */
.service-quick-card,
.service-note-card,
.case-card,
.value-card,
.pricing-card {
  transition: transform .35s cubic-bezier(.25, .46, .45, .94),
              border-color .3s ease, box-shadow .3s ease;
}
.service-quick-card:hover,
.service-note-card:hover,
.case-card:hover,
.value-card:hover,
.pricing-card:hover {
  transform: translateY(-5px);
  border-color: rgba(255, 77, 28, .35);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .4), 0 0 0 1px rgba(255, 77, 28, .12);
}

/* === Button sheen sweep === */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -120%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .18), transparent);
  transform: skewX(-20deg);
  pointer-events: none;
}
.btn-primary:hover::after { left: 140%; transition: left .7s ease; }

/* === Custom cursor (desktop pointer only) === */
@media (pointer: fine) {
  body.nv-cursor-on { cursor: none; }
  body.nv-cursor-on a,
  body.nv-cursor-on button,
  body.nv-cursor-on [role="button"],
  body.nv-cursor-on .btn { cursor: none; }
}
.nv-cursor-dot {
  position: fixed; top: 0; left: 0;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent);
  pointer-events: none; z-index: 99999;
  transform: translate(-50%, -50%);
  will-change: left, top;
  transition: width .2s ease, height .2s ease, opacity .25s ease;
}
.nv-cursor-ring {
  position: fixed; top: 0; left: 0;
  width: 34px; height: 34px; border-radius: 50%;
  border: 1.5px solid rgba(255, 77, 28, .55);
  pointer-events: none; z-index: 99998;
  transform: translate(-50%, -50%);
  will-change: left, top;
  transition: width .3s ease, height .3s ease, border-color .3s ease, opacity .25s ease;
}
body.nv-c-hover .nv-cursor-dot { width: 14px; height: 14px; opacity: .65; }
body.nv-c-hover .nv-cursor-ring {
  width: 54px; height: 54px;
  border-color: rgba(255, 77, 28, .85);
  box-shadow: 0 0 18px rgba(255, 77, 28, .2);
}
body.nv-c-hidden .nv-cursor-dot,
body.nv-c-hidden .nv-cursor-ring { opacity: 0; }

/* === Scroll progress bar === */
.nv-scroll-progress {
  position: fixed; top: 0; left: 0; height: 2px;
  background: linear-gradient(90deg, var(--accent), #ff8c2e);
  z-index: 10001; width: 0%;
  pointer-events: none;
  transition: width .08s linear;
}

@media (prefers-reduced-motion: reduce) {
  .prem-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .btn-primary::after { display: none; }
  .nv-scroll-progress { transition: none; }
}
