*, *::before, *::after {
  margin: 0; padding: 0; box-sizing: border-box;
  cursor: none !important;
  user-select: none; -webkit-user-select: none;
}

html, body {
  overflow-x: hidden !important;
  touch-action: pan-y;
  overscroll-behavior: none;
}

:root {
  --black: #0A0A0A;
  --white: #FFFFFF;
  --font: 'Satoshi', sans-serif;
  --font-brand: 'Poppins', sans-serif;
  --mx: 50vw;
  --my: 50vh;
}

body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  background: radial-gradient(
    ellipse 520px 380px at var(--mx) var(--my),
    rgba(255, 255, 255, 0.055) 0%,
    rgba(255, 255, 255, 0.018) 38%,
    transparent 72%
  );
  /* mix-blend-mode: screen removed — triggers iOS Safari black compositing layer bug */
  /* will-change removed — not needed on a fixed pointer-events:none overlay */
}

body.slider-open { overflow: hidden; }
body.slider-open #service-preview { display: none; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

body {
  font-family: var(--font);
  background: var(--white);
  color: var(--black);
  overflow-x: hidden;
}

#service-preview { display: none !important; }

#cursor {
  position: fixed;
  top: 0; left: 0;
  font-size: 20px;
  font-weight: 700;
  font-family: var(--font-brand);
  color: var(--black);
  pointer-events: none;
  z-index: 99999;
  display: none;
  transform: translate(-50%, -50%) rotate(0deg);
  transition: font-size 0.2s ease, transform 0.1s linear;
  mix-blend-mode: difference;
  filter: invert(1);
}
#cursor.on-service { font-size: 48px; }

#cursor-dot {
  position: fixed;
  width: 5px; height: 5px;
  background: currentColor;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  display: none;
  pointer-events: none;
  mix-blend-mode: difference;
  filter: invert(1);
  z-index: 99999;
}

body.is-touch #cursor,
body.is-touch #cursor-dot {
  display: none !important;
  transition: none !important;
  animation: none !important;
  mix-blend-mode: normal !important;
  filter: none !important;
}

@media (hover: none) and (pointer: coarse) {
  #cursor,
  #cursor-dot {
    display: none !important;
    transition: none !important;
    animation: none !important;
    mix-blend-mode: normal !important;
    filter: none !important;
  }
}
