/* Lightflow v0.6.5 — official bright brand assets and editorial hero lift. */

/* On interior pages the anchor selector was winning over .nav-workspace.
   Match the homepage WorkSuite blue exactly, without changing the home button. */
.primary-nav a.nav-workspace {
  color: var(--blue);
}

.primary-nav a.nav-workspace:hover {
  color: var(--blue);
  background: rgba(13, 111, 197, .06);
}

/* New editorial-template family only: lift both ornaments 100px.
   The wave deliberately sits below .editorial-photo (z-index: 2). */
.editorial-hero::after {
  bottom: -240px;
}

.editorial-hero-wave {
  bottom: 14px;
}

/* Main editorial pages: a quiet VICON-inspired circle replaces the retired
   solid blue sweep. The shared HeroWave sits above it and behind the photo. */
.editorial-hero--orb::after {
  right: -180px;
  bottom: -790px;
  width: min(1180px, 88vw);
  height: min(1180px, 88vw);
  background: #b9d8f1;
  border: 1px solid rgba(74, 137, 201, .18);
  border-radius: 50%;
  opacity: .3;
  transform: none;
}

/* Katalog Layanan keeps the lower solid circle more present than the other
   editorial pages, as requested. */
.editorial-hero--catalog::after {
  opacity: .5;
}

/* HADIR/VICON-style ring: a true circle, clipped by the hero frame so only
   the lower-right quarter sweeps behind the catalogue heading. */
.editorial-hero-ring {
  position: absolute;
  z-index: 1;
  top: -345px;
  left: -185px;
  width: 690px;
  height: 690px;
  border: 38px solid #8ebfe7;
  border-radius: 50%;
  opacity: .2;
  pointer-events: none;
}

.editorial-hero--orb .editorial-hero-wave {
  right: -60px;
  bottom: -38px;
  width: min(1040px, 78vw);
  height: 420px;
  opacity: .32;
  transform: rotate(-5deg);
}

/* Katalog Layanan only: this field belongs to the full-width hero rather than
   the photo column, so it remains pinned to the upper-right viewport edge. */
.editorial-hero-particles {
  position: absolute;
  z-index: 1;
  top: -54px;
  right: -36px;
  width: min(680px, 48vw);
  height: 480px;
  background: url("assets/signature/triangles.svg") center / contain no-repeat;
  opacity: .14;
  pointer-events: none;
  transform: rotate(7deg) scaleX(-1);
  transform-origin: center;
}

@media (min-width: 901px) {
  /* Crop the catalogue hero to the visible photo instead of leaving the
     template's unused lower breathing room. The photo keeps its size. */
  .editorial-hero--catalog {
    min-height: 0;
    padding-bottom: 0;
  }

  .editorial-hero--catalog .editorial-hero-shell,
  .editorial-hero--catalog .editorial-hero-visual {
    min-height: 612px;
  }

  .editorial-hero--catalog .editorial-photo {
    inset: 0 -8px 0 0;
  }

  .editorial-hero--catalog .editorial-hero-badge {
    bottom: 28px;
  }
}

@media (max-width: 900px) {
  .editorial-hero::after { bottom: -240px; }
  .editorial-hero-wave { bottom: 26px; }
  .editorial-hero--orb::after {
    right: -330px;
    bottom: -440px;
    width: 720px;
    height: 720px;
  }

  .editorial-hero--orb .editorial-hero-wave {
    right: -210px;
    bottom: -28px;
    width: 780px;
    height: 330px;
  }

  .editorial-hero-particles {
    top: -18px;
    right: -145px;
    width: 520px;
    height: 390px;
    opacity: .1;
  }

  .editorial-hero-ring {
    top: -275px;
    left: -255px;
    width: 520px;
    height: 520px;
    border-width: 28px;
  }
}