.scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 10001;
  height: 3px;
  pointer-events: none;
}

.scroll-progress-bar {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: var(--color-primary);
  box-shadow: 0 0 10px rgba(170, 255, 0, 0.4);
}

.site-header--sticky {
  transition:
    background-color 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    backdrop-filter 0.3s ease;
}

.site-header--sticky.is-compact {
  border-bottom-color: var(--color-border);
  background-color: color-mix(in srgb, var(--color-bg) 88%, transparent);
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.12);
  backdrop-filter: blur(12px);
}

.site-header--sticky .header-inner {
  transition: height 0.3s ease, transform 0.3s ease;
}

html[data-theme="light"] .site-header--sticky.is-compact {
  background-color: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 26px rgba(20, 35, 45, 0.1);
}

.custom-cursor,
.cursor-ring {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10002;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition:
    width 0.25s ease,
    height 0.25s ease,
    opacity 0.2s ease,
    border-color 0.25s ease,
    background-color 0.25s ease;
}

.custom-cursor {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 12px rgba(170, 255, 0, 0.35);
  transform: translate3d(var(--cursor-x, 0), var(--cursor-y, 0), 0) translate(-50%, -50%);
}

.cursor-ring {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(170, 255, 0, 0.5);
  border-radius: 50%;
  color: var(--color-text);
  font: 600 8px/1 var(--font-body);
  letter-spacing: 0.08em;
  text-align: center;
  transform: translate3d(var(--cursor-x, 0), var(--cursor-y, 0), 0) translate(-50%, -50%);
}

.cursor-ring::after {
  content: attr(data-label);
}

html[data-theme="light"] .custom-cursor {
  background: var(--color-accent);
  box-shadow: 0 0 12px rgba(85, 127, 0, 0.25);
}

html[data-theme="light"] .cursor-ring {
  border-color: rgba(85, 127, 0, 0.5);
  color: var(--color-text);
}

body.has-premium-cursor.cursor-visible .custom-cursor,
body.has-premium-cursor.cursor-visible .cursor-ring {
  opacity: 1;
  visibility: visible;
}

body.has-premium-cursor,
body.has-premium-cursor * {
  cursor: none;
}

body.has-premium-cursor :is(input, textarea, [contenteditable="true"]) {
  cursor: text;
}

body.cursor-hover .custom-cursor {
  width: 11px;
  height: 11px;
}

body.cursor-hover .cursor-ring {
  width: 48px;
  height: 48px;
  border-color: var(--color-primary);
}

body.cursor-hover .cursor-ring[data-label]:not([data-label=""]) {
  width: 62px;
  height: 62px;
  border-color: var(--color-primary);
  background: rgba(6, 17, 22, 0.18);
}

body.cursor-pressed .custom-cursor {
  width: 6px;
  height: 6px;
}

.premium-magnetic {
  translate: var(--premium-magnetic-x, 0px) var(--premium-magnetic-y, 0px);
  transition: translate 0.28s cubic-bezier(0.2, 0.75, 0.25, 1);
  will-change: translate;
}

.premium-section-reveal,
.premium-card-reveal {
  opacity: 0;
  translate: 0 16px;
  transition:
    opacity 0.65s ease,
    translate 0.65s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--premium-delay, 0ms);
}

.premium-card-reveal {
  translate: 0 12px;
}

.premium-section-reveal.premium-visible,
.premium-card-reveal.premium-visible {
  opacity: 1;
  translate: 0 0;
}

.premium-card-reveal.premium-visible:hover {
  translate: 0 -4px;
}

.premium-image-reveal {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.85s cubic-bezier(0.22, 0.7, 0.2, 1);
}

.premium-image-reveal.premium-visible {
  clip-path: inset(0);
}

.premium-word-heading .premium-word {
  display: inline-block;
  opacity: 0;
  translate: 0 0.55em;
  transition:
    opacity 0.55s ease,
    translate 0.55s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: calc(var(--premium-word-index, 0) * 45ms);
}

.premium-word-heading.premium-visible .premium-word {
  opacity: 1;
  translate: 0 0;
}

.hero-section::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(
    400px circle at var(--spotlight-x, 50%) var(--spotlight-y, 45%),
    rgba(170, 255, 0, 0.075),
    transparent 72%
  );
  transition: opacity 0.35s ease;
}

.hero-section.premium-spotlight-active::after {
  opacity: 1;
}

html[data-theme="light"] .hero-section.premium-spotlight-active::after {
  background: radial-gradient(
    400px circle at var(--spotlight-x, 50%) var(--spotlight-y, 45%),
    rgba(85, 127, 0, 0.065),
    transparent 72%
  );
}

.hero-section .tech-circle,
.hero-section .hero-orbit-ring {
  translate: 0 var(--premium-parallax-y, 0px);
}

@media (min-width: 992px) {
  .site-header--sticky.is-compact .header-inner {
    height: calc(var(--header-height) - 10px);
  }
}

@media (max-width: 991px), (hover: none), (pointer: coarse) {
  .custom-cursor,
  .cursor-ring {
    display: none;
  }

  body.has-premium-cursor,
  body.has-premium-cursor * {
    cursor: revert !important;
  }

  body.has-premium-cursor :is(input, textarea, [contenteditable="true"]) {
    cursor: text !important;
  }

  .premium-magnetic {
    translate: none;
    transition: none;
    will-change: auto;
  }

  .hero-section::after {
    display: none;
  }

  .hero-section .tech-circle,
  .hero-section .hero-orbit-ring {
    translate: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-progress-bar,
  .site-header--sticky,
  .site-header--sticky .header-inner,
  .premium-magnetic,
  .premium-section-reveal,
  .premium-card-reveal,
  .premium-image-reveal,
  .premium-word-heading .premium-word,
  .hero-section::after {
    transition: none !important;
  }

  .custom-cursor,
  .cursor-ring {
    display: none !important;
  }

  body.has-premium-cursor,
  body.has-premium-cursor * {
    cursor: revert !important;
  }

  body.has-premium-cursor :is(input, textarea, [contenteditable="true"]) {
    cursor: text !important;
  }

  .premium-section-reveal,
  .premium-card-reveal,
  .premium-word-heading .premium-word {
    opacity: 1 !important;
    translate: none !important;
  }

  .premium-image-reveal {
    clip-path: none !important;
  }

  .premium-magnetic,
  .hero-section .tech-circle,
  .hero-section .hero-orbit-ring {
    translate: none !important;
  }
}
