/* Ehukai particles tweaks */

/* Top particle band inside hero */
.simple-ocean-hero .logo-particles-hero {
  position: absolute;
  top: 16vh; /* move band up */
  left: 0;
  right: 0;
  height: 380px; /* more space above/below */
  pointer-events: none;
  z-index: 10; /* stays behind text (text z-index is 100) */
  will-change: auto;
  animation: none;
}

/* Slightly reduce particle visibility */
.simple-ocean-hero .logo-particles-hero canvas {
  opacity: 0.7;
}

/* Ehukai hero canvas opacity (home can override via CSS var) */
[data-pattern="ehukai-hero"] #canvas {
  opacity: var(--ehukai-canvas-opacity, 0.6);
}

/* Brighter hero title for ehukai hero */
[data-pattern="ehukai-hero"] .hero-title {
  background: none !important;
  -webkit-text-fill-color: #fff !important;
  color: #fff !important;
  text-shadow: 0 2px 6px rgba(0,0,0,.45), 0 14px 28px rgba(0,0,0,.35), 0 0 28px rgba(255,255,255,.22);
}

/* On location pages (half hero), place particle band above the heading block */
.simple-ocean-hero.simple-ocean-hero--half .logo-particles-hero {
  top: 0;            /* start at top of hero */
  height: 300px;     /* larger band (3x) */
  z-index: 10;       /* below text; positioned above vertically */
}

/* Nudge text down on location heroes so the band sits clearly above */
.simple-ocean-hero.simple-ocean-hero--half .hero-content-wrapper {
  margin-top: 340px; /* below larger band */
}

@media (max-width: 768px) {
  .simple-ocean-hero .logo-particles-hero { top: 12vh; height: 260px; }
  /* On smaller screens, reduce offset so content isn't clipped */
  .simple-ocean-hero.simple-ocean-hero--half .hero-content-wrapper { margin-top: 220px; }
}

/* Remove dark center overlay behind hero content */
.hero-content-wrapper::before { content: none !important; }

/* Remove background star field and hard line animations */
.simple-ocean-hero { animation: none !important; background-attachment: scroll !important; }
.simple-ocean-hero::before { content: none !important; background: none !important; animation: none !important; }

@keyframes ehukai-drift {
  0% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(1px, -1.5px, 0); }
  100% { transform: translate3d(0, 0, 0); }
}